@elementor/editor-controls 0.36.0 → 1.1.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 (30) hide show
  1. package/CHANGELOG.md +46 -0
  2. package/dist/index.d.mts +78 -45
  3. package/dist/index.d.ts +78 -45
  4. package/dist/index.js +951 -651
  5. package/dist/index.js.map +1 -1
  6. package/dist/index.mjs +890 -596
  7. package/dist/index.mjs.map +1 -1
  8. package/package.json +8 -7
  9. package/src/bound-prop-context/use-bound-prop.ts +4 -1
  10. package/src/components/font-family-selector.tsx +23 -164
  11. package/src/components/popover-grid-container.tsx +7 -10
  12. package/src/components/repeater.tsx +24 -10
  13. package/src/components/size-control/size-input.tsx +125 -0
  14. package/src/components/{text-field-inner-selection.tsx → size-control/text-field-inner-selection.tsx} +33 -16
  15. package/src/components/text-field-popover.tsx +47 -0
  16. package/src/controls/background-control/background-overlay/background-image-overlay/background-image-overlay-position.tsx +11 -3
  17. package/src/controls/background-control/background-overlay/background-image-overlay/background-image-overlay-size.tsx +7 -3
  18. package/src/controls/box-shadow-repeater-control.tsx +8 -6
  19. package/src/controls/equal-unequal-sizes-control.tsx +24 -14
  20. package/src/controls/gap-control.tsx +17 -6
  21. package/src/controls/key-value-control.tsx +99 -0
  22. package/src/controls/linked-dimensions-control.tsx +62 -81
  23. package/src/controls/position-control.tsx +109 -0
  24. package/src/controls/repeatable-control.tsx +89 -0
  25. package/src/controls/size-control.tsx +181 -149
  26. package/src/controls/stroke-control.tsx +9 -6
  27. package/src/hooks/use-repeatable-control-context.ts +24 -0
  28. package/src/hooks/use-size-extended-options.ts +21 -0
  29. package/src/index.ts +4 -1
  30. package/src/utils/size-control.ts +10 -0
package/CHANGELOG.md CHANGED
@@ -1,5 +1,51 @@
1
1
  # @elementor/editor-controls
2
2
 
3
+ ## 1.1.0
4
+
5
+ ### Minor Changes
6
+
7
+ - 9ccd243: Opacity control is added to the style tab
8
+ - 17b73ab: Update `@elementor/ui` version.
9
+ - aa176b8: Create a KeyValue Control
10
+ - 3daa1c9: Extract font family content list to a standalone component inside the Editor UI package.
11
+ - 40d00c2: Implement the Popover Menu List inside the Dynamic Tags and the Variables.
12
+ - d5e9011: Implement the Popover Search component inside the Dynamic Tags, Font Families and the Variables.
13
+ - 30a6d95: Added repeatable control type
14
+ - f37c325: Extract the popover scrollable content box to a standalone component inside the Editor UI package.
15
+ - 20d04f2: Added object position custom control
16
+
17
+ ### Patch Changes
18
+
19
+ - Updated dependencies [da0c4ca]
20
+ - Updated dependencies [17b73ab]
21
+ - Updated dependencies [7a4178f]
22
+ - Updated dependencies [8e18905]
23
+ - Updated dependencies [3daa1c9]
24
+ - Updated dependencies [40d00c2]
25
+ - Updated dependencies [d5e9011]
26
+ - Updated dependencies [f37c325]
27
+ - Updated dependencies [20d04f2]
28
+ - @elementor/editor-ui@0.12.0
29
+ - @elementor/editor-props@0.14.0
30
+ - @elementor/editor-elements@0.8.6
31
+
32
+ ## 1.0.0
33
+
34
+ ### Major Changes
35
+
36
+ - 2c11540: Added support for custom values in size control
37
+
38
+ ### Minor Changes
39
+
40
+ - 199c99a: Added support to listen to breakpoint changes in the size-control
41
+
42
+ ### Patch Changes
43
+
44
+ - Updated dependencies [ab6320c]
45
+ - Updated dependencies [2c11540]
46
+ - @elementor/editor-props@0.13.0
47
+ - @elementor/editor-elements@0.8.5
48
+
3
49
  ## 0.36.0
4
50
 
5
51
  ### Minor Changes
package/dist/index.d.mts CHANGED
@@ -1,7 +1,7 @@
1
- import * as React from 'react';
2
- import { ReactNode, ComponentType, PropsWithChildren } from 'react';
1
+ import * as React$1 from 'react';
2
+ import { MutableRefObject, ReactNode, ComponentType, PropsWithChildren } from 'react';
3
3
  import { StringPropValue, PropTypeUtil, PropValue, PropKey, SizePropValue, PropType, CreateOptions } from '@elementor/editor-props';
4
- import { UnstableColorFieldProps, ToggleButtonProps, StackProps, FormLabelProps } from '@elementor/ui';
4
+ import { UnstableColorFieldProps, ToggleButtonProps, StackProps, SxProps, Theme, FormLabelProps } from '@elementor/ui';
5
5
  import * as _elementor_locations from '@elementor/locations';
6
6
 
7
7
  type ImageControlProps = {
@@ -12,30 +12,36 @@ type ImageControlProps = {
12
12
  resolutionLabel?: string;
13
13
  showMode?: 'all' | 'media' | 'sizes';
14
14
  };
15
- declare const ImageControl: ControlComponent<({ sizes, resolutionLabel, showMode }: ImageControlProps) => React.JSX.Element>;
15
+ declare const ImageControl: ControlComponent<({ sizes, resolutionLabel, showMode }: ImageControlProps) => React$1.JSX.Element>;
16
16
 
17
17
  declare const TextControl: ControlComponent<({ placeholder }: {
18
18
  placeholder?: string;
19
- }) => React.JSX.Element>;
19
+ }) => React$1.JSX.Element>;
20
20
 
21
21
  type Props$6 = {
22
22
  placeholder?: string;
23
23
  };
24
- declare const TextAreaControl: ControlComponent<({ placeholder }: Props$6) => React.JSX.Element>;
24
+ declare const TextAreaControl: ControlComponent<({ placeholder }: Props$6) => React$1.JSX.Element>;
25
+
26
+ declare const defaultUnits: readonly ["px", "%", "em", "rem", "vw", "vh"];
27
+ declare const defaultExtendedOptions: readonly ["auto", "custom"];
28
+ type Unit = (typeof defaultUnits)[number];
29
+ type ExtendedOption = (typeof defaultExtendedOptions)[number];
25
30
 
26
- type ExtendedValue = 'auto';
27
- type Unit = 'px' | '%' | 'em' | 'rem' | 'vw' | 'vh';
28
31
  type SizeControlProps = {
29
32
  placeholder?: string;
30
- startIcon?: React.ReactNode;
33
+ startIcon?: React$1.ReactNode;
31
34
  units?: Unit[];
32
- extendedValues?: ExtendedValue[];
35
+ extendedOptions?: ExtendedOption[];
36
+ disableCustom?: boolean;
37
+ anchorRef?: MutableRefObject<HTMLElement | undefined>;
38
+ defaultUnit?: Unit;
33
39
  };
34
- declare const SizeControl: ControlComponent<({ units, extendedValues, placeholder, startIcon }: SizeControlProps) => React.JSX.Element>;
40
+ declare const SizeControl: ControlComponent<(props: SizeControlProps) => React$1.JSX.Element>;
35
41
 
36
- declare const StrokeControl: ControlComponent<() => React.JSX.Element>;
42
+ declare const StrokeControl: ControlComponent<() => React$1.JSX.Element>;
37
43
 
38
- declare const BoxShadowRepeaterControl: ControlComponent<() => React.JSX.Element>;
44
+ declare const BoxShadowRepeaterControl: ControlComponent<() => React$1.JSX.Element>;
39
45
 
40
46
  type Props$5 = {
41
47
  options: Array<{
@@ -45,13 +51,13 @@ type Props$5 = {
45
51
  }>;
46
52
  onChange?: (newValue: string | null, previousValue: string | null | undefined) => void;
47
53
  };
48
- declare const SelectControl: ControlComponent<({ options, onChange }: Props$5) => React.JSX.Element>;
54
+ declare const SelectControl: ControlComponent<({ options, onChange }: Props$5) => React$1.JSX.Element>;
49
55
 
50
56
  type Props$4 = Partial<Omit<UnstableColorFieldProps, 'value' | 'onChange'>> & {
51
57
  propTypeUtil?: PropTypeUtil<string, string>;
52
58
  anchorEl?: HTMLElement | null;
53
59
  };
54
- declare const ColorControl: ControlComponent<({ propTypeUtil, anchorEl, slotProps, ...props }: Props$4) => React.JSX.Element>;
60
+ declare const ColorControl: ControlComponent<({ propTypeUtil, anchorEl, slotProps, ...props }: Props$4) => React$1.JSX.Element>;
55
61
 
56
62
  type RenderContentProps = {
57
63
  size: ToggleButtonProps['size'];
@@ -59,7 +65,7 @@ type RenderContentProps = {
59
65
  type ToggleButtonGroupItem<TValue> = {
60
66
  value: TValue;
61
67
  label: string;
62
- renderContent: ({ size }: RenderContentProps) => React.ReactNode;
68
+ renderContent: ({ size }: RenderContentProps) => React$1.ReactNode;
63
69
  showTooltip?: boolean;
64
70
  };
65
71
  type ExclusiveValue<TValue> = TValue;
@@ -80,7 +86,7 @@ type Props$3<TValue> = {
80
86
  value: ExclusiveValue<TValue>;
81
87
  onChange: (value: ExclusiveValue<TValue>) => void;
82
88
  });
83
- declare const ControlToggleButtonGroup: <TValue>({ justify, size, value, onChange, items, maxItems, exclusive, fullWidth, disabled, }: Props$3<TValue>) => React.JSX.Element;
89
+ declare const ControlToggleButtonGroup: <TValue>({ justify, size, value, onChange, items, maxItems, exclusive, fullWidth, disabled, }: Props$3<TValue>) => React$1.JSX.Element;
84
90
 
85
91
  type ToggleControlProps<T extends PropValue> = {
86
92
  options: Array<ToggleButtonGroupItem<T> & {
@@ -91,7 +97,7 @@ type ToggleControlProps<T extends PropValue> = {
91
97
  exclusive?: boolean;
92
98
  maxItems?: number;
93
99
  };
94
- declare const ToggleControl: ControlComponent<({ options, fullWidth, size, exclusive, maxItems, }: ToggleControlProps<StringPropValue["value"]>) => React.JSX.Element>;
100
+ declare const ToggleControl: ControlComponent<({ options, fullWidth, size, exclusive, maxItems, }: ToggleControlProps<StringPropValue["value"]>) => React$1.JSX.Element>;
95
101
 
96
102
  declare const NumberControl: ControlComponent<({ placeholder, max, min, step, shouldForceInt, }: {
97
103
  placeholder?: string;
@@ -99,7 +105,7 @@ declare const NumberControl: ControlComponent<({ placeholder, max, min, step, sh
99
105
  min?: number;
100
106
  step?: number;
101
107
  shouldForceInt?: boolean;
102
- }) => React.JSX.Element>;
108
+ }) => React$1.JSX.Element>;
103
109
 
104
110
  type MultiSizePropValue = Record<PropKey, SizePropValue>;
105
111
  type Item = {
@@ -115,13 +121,13 @@ type Props$2<TMultiPropType extends string, TPropValue extends MultiSizePropValu
115
121
  items: EqualUnequalItems;
116
122
  multiSizePropTypeUtil: PropTypeUtil<TMultiPropType, TPropValue>;
117
123
  };
118
- declare function EqualUnequalSizesControl<TMultiPropType extends string, TPropValue extends MultiSizePropValue>({ label, icon, tooltipLabel, items, multiSizePropTypeUtil, }: Props$2<TMultiPropType, TPropValue>): React.JSX.Element;
124
+ declare function EqualUnequalSizesControl<TMultiPropType extends string, TPropValue extends MultiSizePropValue>({ label, icon, tooltipLabel, items, multiSizePropTypeUtil, }: Props$2<TMultiPropType, TPropValue>): React$1.JSX.Element;
119
125
 
120
- declare const LinkedDimensionsControl: ControlComponent<({ label, isSiteRtl, extendedValues, }: {
126
+ declare const LinkedDimensionsControl: ControlComponent<({ label, isSiteRtl, extendedOptions, }: {
121
127
  label: string;
122
128
  isSiteRtl?: boolean;
123
- extendedValues?: ExtendedValue[];
124
- }) => React.JSX.Element>;
129
+ extendedOptions?: ExtendedOption[];
130
+ }) => React$1.JSX.Element>;
125
131
 
126
132
  type FontCategory = {
127
133
  label: string;
@@ -130,11 +136,11 @@ type FontCategory = {
130
136
  type FontFamilyControlProps = {
131
137
  fontFamilies: FontCategory[];
132
138
  };
133
- declare const FontFamilyControl: ControlComponent<({ fontFamilies }: FontFamilyControlProps) => React.JSX.Element>;
139
+ declare const FontFamilyControl: ControlComponent<({ fontFamilies }: FontFamilyControlProps) => React$1.JSX.Element>;
134
140
 
135
141
  declare const UrlControl: ControlComponent<({ placeholder }: {
136
142
  placeholder?: string;
137
- }) => React.JSX.Element>;
143
+ }) => React$1.JSX.Element>;
138
144
 
139
145
  type ControlProps<TControlProps = unknown> = TControlProps & {
140
146
  context: {
@@ -151,23 +157,50 @@ type Props$1 = ControlProps<{
151
157
  minInputLength?: number;
152
158
  placeholder?: string;
153
159
  }>;
154
- declare const LinkControl: ControlComponent<(props: Props$1) => React.JSX.Element>;
160
+ declare const LinkControl: ControlComponent<(props: Props$1) => React$1.JSX.Element>;
155
161
 
156
162
  declare const GapControl: ControlComponent<({ label }: {
157
163
  label: string;
158
- }) => React.JSX.Element>;
164
+ }) => React$1.JSX.Element>;
159
165
 
160
166
  declare const AspectRatioControl: ControlComponent<({ label }: {
161
167
  label: string;
162
- }) => React.JSX.Element>;
168
+ }) => React$1.JSX.Element>;
169
+
170
+ declare const SvgMediaControl: ControlComponent<() => React$1.JSX.Element>;
171
+
172
+ declare const BackgroundControl: ControlComponent<() => React$1.JSX.Element>;
173
+
174
+ declare const SwitchControl: ControlComponent<() => React$1.JSX.Element>;
163
175
 
164
- declare const SvgMediaControl: ControlComponent<() => React.JSX.Element>;
176
+ type ChildControlConfig = {
177
+ component: React.ComponentType;
178
+ props?: Record<string, unknown>;
179
+ propTypeUtil: PropTypeUtil<string, any>;
180
+ label?: string;
181
+ };
165
182
 
166
- declare const BackgroundControl: ControlComponent<() => React.JSX.Element>;
183
+ type RepeatableControlProps = {
184
+ label: string;
185
+ childControlConfig: ChildControlConfig;
186
+ showDuplicate?: boolean;
187
+ showToggle?: boolean;
188
+ };
189
+ declare const RepeatableControl: ControlComponent<({ label, childControlConfig, showDuplicate, showToggle }: RepeatableControlProps) => React$1.JSX.Element | null>;
190
+
191
+ type KeyValueControlProps = {
192
+ keyName?: string;
193
+ valueName?: string;
194
+ sx?: SxProps<Theme>;
195
+ regexKey?: string;
196
+ regexValue?: string;
197
+ validationErrorMessage?: string;
198
+ };
199
+ declare const KeyValueControl: ControlComponent<(props?: KeyValueControlProps) => React$1.JSX.Element>;
167
200
 
168
- declare const SwitchControl: ControlComponent<() => React.JSX.Element>;
201
+ declare const PositionControl: () => React$1.JSX.Element;
169
202
 
170
- declare const ControlFormLabel: (props: FormLabelProps) => React.JSX.Element;
203
+ declare const ControlFormLabel: (props: FormLabelProps) => React$1.JSX.Element;
171
204
 
172
205
  type FontFamilySelectorProps = {
173
206
  fontFamilies: FontCategory[];
@@ -175,7 +208,7 @@ type FontFamilySelectorProps = {
175
208
  onFontFamilyChange: (fontFamily: string) => void;
176
209
  onClose: () => void;
177
210
  };
178
- declare const FontFamilySelector: ({ fontFamilies, fontFamily, onFontFamilyChange, onClose, }: FontFamilySelectorProps) => React.JSX.Element;
211
+ declare const FontFamilySelector: ({ fontFamilies, fontFamily, onFontFamilyChange, onClose, }: FontFamilySelectorProps) => React$1.JSX.Element;
179
212
 
180
213
  type AnyComponentType = ComponentType<any>;
181
214
  declare const brandSymbol: unique symbol;
@@ -185,13 +218,13 @@ type ControlComponent<TComponent extends AnyComponentType = AnyComponentType> =
185
218
 
186
219
  type ControlActionsItems = Array<{
187
220
  id: string;
188
- MenuItem: React.ComponentType;
221
+ MenuItem: React$1.ComponentType;
189
222
  }>;
190
223
  type ControlActionsContext = {
191
224
  items: ControlActionsItems;
192
225
  };
193
226
  type ControlActionsProviderProps = PropsWithChildren<ControlActionsContext>;
194
- declare const ControlActionsProvider: ({ children, items }: ControlActionsProviderProps) => React.JSX.Element;
227
+ declare const ControlActionsProvider: ({ children, items }: ControlActionsProviderProps) => React$1.JSX.Element;
195
228
  declare const useControlActions: () => ControlActionsContext;
196
229
 
197
230
  type SetValueMeta = {
@@ -205,9 +238,9 @@ type PropContext<T extends PropValue, P extends PropType> = {
205
238
  placeholder?: T;
206
239
  disabled?: boolean;
207
240
  };
208
- declare const PropContext: React.Context<PropContext<PropValue, PropType> | null>;
209
- type PropProviderProps<T extends PropValue, P extends PropType> = React.PropsWithChildren<PropContext<T, P>>;
210
- declare const PropProvider: <T extends PropValue, P extends PropType>({ children, value, setValue, propType, placeholder, disabled, }: PropProviderProps<T, P>) => React.JSX.Element;
241
+ declare const PropContext: React$1.Context<PropContext<PropValue, PropType> | null>;
242
+ type PropProviderProps<T extends PropValue, P extends PropType> = React$1.PropsWithChildren<PropContext<T, P>>;
243
+ declare const PropProvider: <T extends PropValue, P extends PropType>({ children, value, setValue, propType, placeholder, disabled, }: PropProviderProps<T, P>) => React$1.JSX.Element;
211
244
 
212
245
  type PropKeyContextValue<T, P> = {
213
246
  bind: PropKey;
@@ -218,10 +251,10 @@ type PropKeyContextValue<T, P> = {
218
251
  path: PropKey[];
219
252
  disabled?: boolean;
220
253
  };
221
- type PropKeyProviderProps = React.PropsWithChildren<{
254
+ type PropKeyProviderProps = React$1.PropsWithChildren<{
222
255
  bind: PropKey;
223
256
  }>;
224
- declare const PropKeyProvider: ({ children, bind }: PropKeyProviderProps) => React.JSX.Element;
257
+ declare const PropKeyProvider: ({ children, bind }: PropKeyProviderProps) => React$1.JSX.Element;
225
258
 
226
259
  type UseBoundProp<TValue extends PropValue> = {
227
260
  bind: PropKey;
@@ -233,7 +266,7 @@ type UseBoundProp<TValue extends PropValue> = {
233
266
  restoreValue: () => void;
234
267
  disabled?: boolean;
235
268
  };
236
- declare function useBoundProp<T extends PropValue = PropValue>(): PropKeyContextValue<T, PropType>;
269
+ declare function useBoundProp<T extends PropValue = PropValue, P extends PropType = PropType>(): PropKeyContextValue<T, P>;
237
270
  declare function useBoundProp<TKey extends string, TValue extends PropValue>(propTypeUtil: PropTypeUtil<TKey, TValue>): UseBoundProp<TValue>;
238
271
 
239
272
  type ControlReplacement = {
@@ -246,7 +279,7 @@ type ConditionArgs = {
246
279
  type Props = PropsWithChildren<{
247
280
  replacements: ControlReplacement[];
248
281
  }>;
249
- declare const ControlReplacementsProvider: ({ replacements, children }: Props) => React.JSX.Element;
282
+ declare const ControlReplacementsProvider: ({ replacements, children }: Props) => React$1.JSX.Element;
250
283
  declare const createControlReplacementsRegistry: () => {
251
284
  registerControlReplacement: (replacement: ControlReplacement) => void;
252
285
  getControlReplacements: () => ControlReplacement[];
@@ -260,9 +293,9 @@ type ControlAdornmentsContext = {
260
293
  items?: ControlAdornmentsItems;
261
294
  };
262
295
  type ControlAdornmentsProviderProps = PropsWithChildren<ControlAdornmentsContext>;
263
- declare const ControlAdornmentsProvider: ({ children, items }: ControlAdornmentsProviderProps) => React.JSX.Element;
296
+ declare const ControlAdornmentsProvider: ({ children, items }: ControlAdornmentsProviderProps) => React$1.JSX.Element;
264
297
 
265
- declare function ControlAdornments(): React.JSX.Element | null;
298
+ declare function ControlAdornments(): React$1.JSX.Element | null;
266
299
 
267
300
  declare const injectIntoRepeaterItemIcon: (args: _elementor_locations.ReplaceableInjectArgs<{
268
301
  value: PropValue;
@@ -279,4 +312,4 @@ type UseInternalStateOptions<TValue> = {
279
312
  };
280
313
  declare const useSyncExternalState: <TValue>({ external, setExternal, persistWhen, fallback, }: UseInternalStateOptions<TValue>) => readonly [TValue, (setter: ((value: TValue) => TValue) | TValue) => void];
281
314
 
282
- export { AspectRatioControl, BackgroundControl, BoxShadowRepeaterControl, ColorControl, type ControlActionsItems, ControlActionsProvider, ControlAdornments, ControlAdornmentsProvider, type ControlComponent, ControlFormLabel, ControlReplacementsProvider, ControlToggleButtonGroup, type EqualUnequalItems, EqualUnequalSizesControl, type ExtendedValue, 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 };
315
+ 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, KeyValueControl, LinkControl, LinkedDimensionsControl, NumberControl, PositionControl, PropKeyProvider, PropProvider, type PropProviderProps, RepeatableControl, SelectControl, type SetValue, SizeControl, StrokeControl, SvgMediaControl, SwitchControl, TextAreaControl, TextControl, type ToggleButtonGroupItem, ToggleControl, type ToggleControlProps, UrlControl, createControlReplacementsRegistry, injectIntoRepeaterItemIcon, injectIntoRepeaterItemLabel, useBoundProp, useControlActions, useSyncExternalState };
package/dist/index.d.ts CHANGED
@@ -1,7 +1,7 @@
1
- import * as React from 'react';
2
- import { ReactNode, ComponentType, PropsWithChildren } from 'react';
1
+ import * as React$1 from 'react';
2
+ import { MutableRefObject, ReactNode, ComponentType, PropsWithChildren } from 'react';
3
3
  import { StringPropValue, PropTypeUtil, PropValue, PropKey, SizePropValue, PropType, CreateOptions } from '@elementor/editor-props';
4
- import { UnstableColorFieldProps, ToggleButtonProps, StackProps, FormLabelProps } from '@elementor/ui';
4
+ import { UnstableColorFieldProps, ToggleButtonProps, StackProps, SxProps, Theme, FormLabelProps } from '@elementor/ui';
5
5
  import * as _elementor_locations from '@elementor/locations';
6
6
 
7
7
  type ImageControlProps = {
@@ -12,30 +12,36 @@ type ImageControlProps = {
12
12
  resolutionLabel?: string;
13
13
  showMode?: 'all' | 'media' | 'sizes';
14
14
  };
15
- declare const ImageControl: ControlComponent<({ sizes, resolutionLabel, showMode }: ImageControlProps) => React.JSX.Element>;
15
+ declare const ImageControl: ControlComponent<({ sizes, resolutionLabel, showMode }: ImageControlProps) => React$1.JSX.Element>;
16
16
 
17
17
  declare const TextControl: ControlComponent<({ placeholder }: {
18
18
  placeholder?: string;
19
- }) => React.JSX.Element>;
19
+ }) => React$1.JSX.Element>;
20
20
 
21
21
  type Props$6 = {
22
22
  placeholder?: string;
23
23
  };
24
- declare const TextAreaControl: ControlComponent<({ placeholder }: Props$6) => React.JSX.Element>;
24
+ declare const TextAreaControl: ControlComponent<({ placeholder }: Props$6) => React$1.JSX.Element>;
25
+
26
+ declare const defaultUnits: readonly ["px", "%", "em", "rem", "vw", "vh"];
27
+ declare const defaultExtendedOptions: readonly ["auto", "custom"];
28
+ type Unit = (typeof defaultUnits)[number];
29
+ type ExtendedOption = (typeof defaultExtendedOptions)[number];
25
30
 
26
- type ExtendedValue = 'auto';
27
- type Unit = 'px' | '%' | 'em' | 'rem' | 'vw' | 'vh';
28
31
  type SizeControlProps = {
29
32
  placeholder?: string;
30
- startIcon?: React.ReactNode;
33
+ startIcon?: React$1.ReactNode;
31
34
  units?: Unit[];
32
- extendedValues?: ExtendedValue[];
35
+ extendedOptions?: ExtendedOption[];
36
+ disableCustom?: boolean;
37
+ anchorRef?: MutableRefObject<HTMLElement | undefined>;
38
+ defaultUnit?: Unit;
33
39
  };
34
- declare const SizeControl: ControlComponent<({ units, extendedValues, placeholder, startIcon }: SizeControlProps) => React.JSX.Element>;
40
+ declare const SizeControl: ControlComponent<(props: SizeControlProps) => React$1.JSX.Element>;
35
41
 
36
- declare const StrokeControl: ControlComponent<() => React.JSX.Element>;
42
+ declare const StrokeControl: ControlComponent<() => React$1.JSX.Element>;
37
43
 
38
- declare const BoxShadowRepeaterControl: ControlComponent<() => React.JSX.Element>;
44
+ declare const BoxShadowRepeaterControl: ControlComponent<() => React$1.JSX.Element>;
39
45
 
40
46
  type Props$5 = {
41
47
  options: Array<{
@@ -45,13 +51,13 @@ type Props$5 = {
45
51
  }>;
46
52
  onChange?: (newValue: string | null, previousValue: string | null | undefined) => void;
47
53
  };
48
- declare const SelectControl: ControlComponent<({ options, onChange }: Props$5) => React.JSX.Element>;
54
+ declare const SelectControl: ControlComponent<({ options, onChange }: Props$5) => React$1.JSX.Element>;
49
55
 
50
56
  type Props$4 = Partial<Omit<UnstableColorFieldProps, 'value' | 'onChange'>> & {
51
57
  propTypeUtil?: PropTypeUtil<string, string>;
52
58
  anchorEl?: HTMLElement | null;
53
59
  };
54
- declare const ColorControl: ControlComponent<({ propTypeUtil, anchorEl, slotProps, ...props }: Props$4) => React.JSX.Element>;
60
+ declare const ColorControl: ControlComponent<({ propTypeUtil, anchorEl, slotProps, ...props }: Props$4) => React$1.JSX.Element>;
55
61
 
56
62
  type RenderContentProps = {
57
63
  size: ToggleButtonProps['size'];
@@ -59,7 +65,7 @@ type RenderContentProps = {
59
65
  type ToggleButtonGroupItem<TValue> = {
60
66
  value: TValue;
61
67
  label: string;
62
- renderContent: ({ size }: RenderContentProps) => React.ReactNode;
68
+ renderContent: ({ size }: RenderContentProps) => React$1.ReactNode;
63
69
  showTooltip?: boolean;
64
70
  };
65
71
  type ExclusiveValue<TValue> = TValue;
@@ -80,7 +86,7 @@ type Props$3<TValue> = {
80
86
  value: ExclusiveValue<TValue>;
81
87
  onChange: (value: ExclusiveValue<TValue>) => void;
82
88
  });
83
- declare const ControlToggleButtonGroup: <TValue>({ justify, size, value, onChange, items, maxItems, exclusive, fullWidth, disabled, }: Props$3<TValue>) => React.JSX.Element;
89
+ declare const ControlToggleButtonGroup: <TValue>({ justify, size, value, onChange, items, maxItems, exclusive, fullWidth, disabled, }: Props$3<TValue>) => React$1.JSX.Element;
84
90
 
85
91
  type ToggleControlProps<T extends PropValue> = {
86
92
  options: Array<ToggleButtonGroupItem<T> & {
@@ -91,7 +97,7 @@ type ToggleControlProps<T extends PropValue> = {
91
97
  exclusive?: boolean;
92
98
  maxItems?: number;
93
99
  };
94
- declare const ToggleControl: ControlComponent<({ options, fullWidth, size, exclusive, maxItems, }: ToggleControlProps<StringPropValue["value"]>) => React.JSX.Element>;
100
+ declare const ToggleControl: ControlComponent<({ options, fullWidth, size, exclusive, maxItems, }: ToggleControlProps<StringPropValue["value"]>) => React$1.JSX.Element>;
95
101
 
96
102
  declare const NumberControl: ControlComponent<({ placeholder, max, min, step, shouldForceInt, }: {
97
103
  placeholder?: string;
@@ -99,7 +105,7 @@ declare const NumberControl: ControlComponent<({ placeholder, max, min, step, sh
99
105
  min?: number;
100
106
  step?: number;
101
107
  shouldForceInt?: boolean;
102
- }) => React.JSX.Element>;
108
+ }) => React$1.JSX.Element>;
103
109
 
104
110
  type MultiSizePropValue = Record<PropKey, SizePropValue>;
105
111
  type Item = {
@@ -115,13 +121,13 @@ type Props$2<TMultiPropType extends string, TPropValue extends MultiSizePropValu
115
121
  items: EqualUnequalItems;
116
122
  multiSizePropTypeUtil: PropTypeUtil<TMultiPropType, TPropValue>;
117
123
  };
118
- declare function EqualUnequalSizesControl<TMultiPropType extends string, TPropValue extends MultiSizePropValue>({ label, icon, tooltipLabel, items, multiSizePropTypeUtil, }: Props$2<TMultiPropType, TPropValue>): React.JSX.Element;
124
+ declare function EqualUnequalSizesControl<TMultiPropType extends string, TPropValue extends MultiSizePropValue>({ label, icon, tooltipLabel, items, multiSizePropTypeUtil, }: Props$2<TMultiPropType, TPropValue>): React$1.JSX.Element;
119
125
 
120
- declare const LinkedDimensionsControl: ControlComponent<({ label, isSiteRtl, extendedValues, }: {
126
+ declare const LinkedDimensionsControl: ControlComponent<({ label, isSiteRtl, extendedOptions, }: {
121
127
  label: string;
122
128
  isSiteRtl?: boolean;
123
- extendedValues?: ExtendedValue[];
124
- }) => React.JSX.Element>;
129
+ extendedOptions?: ExtendedOption[];
130
+ }) => React$1.JSX.Element>;
125
131
 
126
132
  type FontCategory = {
127
133
  label: string;
@@ -130,11 +136,11 @@ type FontCategory = {
130
136
  type FontFamilyControlProps = {
131
137
  fontFamilies: FontCategory[];
132
138
  };
133
- declare const FontFamilyControl: ControlComponent<({ fontFamilies }: FontFamilyControlProps) => React.JSX.Element>;
139
+ declare const FontFamilyControl: ControlComponent<({ fontFamilies }: FontFamilyControlProps) => React$1.JSX.Element>;
134
140
 
135
141
  declare const UrlControl: ControlComponent<({ placeholder }: {
136
142
  placeholder?: string;
137
- }) => React.JSX.Element>;
143
+ }) => React$1.JSX.Element>;
138
144
 
139
145
  type ControlProps<TControlProps = unknown> = TControlProps & {
140
146
  context: {
@@ -151,23 +157,50 @@ type Props$1 = ControlProps<{
151
157
  minInputLength?: number;
152
158
  placeholder?: string;
153
159
  }>;
154
- declare const LinkControl: ControlComponent<(props: Props$1) => React.JSX.Element>;
160
+ declare const LinkControl: ControlComponent<(props: Props$1) => React$1.JSX.Element>;
155
161
 
156
162
  declare const GapControl: ControlComponent<({ label }: {
157
163
  label: string;
158
- }) => React.JSX.Element>;
164
+ }) => React$1.JSX.Element>;
159
165
 
160
166
  declare const AspectRatioControl: ControlComponent<({ label }: {
161
167
  label: string;
162
- }) => React.JSX.Element>;
168
+ }) => React$1.JSX.Element>;
169
+
170
+ declare const SvgMediaControl: ControlComponent<() => React$1.JSX.Element>;
171
+
172
+ declare const BackgroundControl: ControlComponent<() => React$1.JSX.Element>;
173
+
174
+ declare const SwitchControl: ControlComponent<() => React$1.JSX.Element>;
163
175
 
164
- declare const SvgMediaControl: ControlComponent<() => React.JSX.Element>;
176
+ type ChildControlConfig = {
177
+ component: React.ComponentType;
178
+ props?: Record<string, unknown>;
179
+ propTypeUtil: PropTypeUtil<string, any>;
180
+ label?: string;
181
+ };
165
182
 
166
- declare const BackgroundControl: ControlComponent<() => React.JSX.Element>;
183
+ type RepeatableControlProps = {
184
+ label: string;
185
+ childControlConfig: ChildControlConfig;
186
+ showDuplicate?: boolean;
187
+ showToggle?: boolean;
188
+ };
189
+ declare const RepeatableControl: ControlComponent<({ label, childControlConfig, showDuplicate, showToggle }: RepeatableControlProps) => React$1.JSX.Element | null>;
190
+
191
+ type KeyValueControlProps = {
192
+ keyName?: string;
193
+ valueName?: string;
194
+ sx?: SxProps<Theme>;
195
+ regexKey?: string;
196
+ regexValue?: string;
197
+ validationErrorMessage?: string;
198
+ };
199
+ declare const KeyValueControl: ControlComponent<(props?: KeyValueControlProps) => React$1.JSX.Element>;
167
200
 
168
- declare const SwitchControl: ControlComponent<() => React.JSX.Element>;
201
+ declare const PositionControl: () => React$1.JSX.Element;
169
202
 
170
- declare const ControlFormLabel: (props: FormLabelProps) => React.JSX.Element;
203
+ declare const ControlFormLabel: (props: FormLabelProps) => React$1.JSX.Element;
171
204
 
172
205
  type FontFamilySelectorProps = {
173
206
  fontFamilies: FontCategory[];
@@ -175,7 +208,7 @@ type FontFamilySelectorProps = {
175
208
  onFontFamilyChange: (fontFamily: string) => void;
176
209
  onClose: () => void;
177
210
  };
178
- declare const FontFamilySelector: ({ fontFamilies, fontFamily, onFontFamilyChange, onClose, }: FontFamilySelectorProps) => React.JSX.Element;
211
+ declare const FontFamilySelector: ({ fontFamilies, fontFamily, onFontFamilyChange, onClose, }: FontFamilySelectorProps) => React$1.JSX.Element;
179
212
 
180
213
  type AnyComponentType = ComponentType<any>;
181
214
  declare const brandSymbol: unique symbol;
@@ -185,13 +218,13 @@ type ControlComponent<TComponent extends AnyComponentType = AnyComponentType> =
185
218
 
186
219
  type ControlActionsItems = Array<{
187
220
  id: string;
188
- MenuItem: React.ComponentType;
221
+ MenuItem: React$1.ComponentType;
189
222
  }>;
190
223
  type ControlActionsContext = {
191
224
  items: ControlActionsItems;
192
225
  };
193
226
  type ControlActionsProviderProps = PropsWithChildren<ControlActionsContext>;
194
- declare const ControlActionsProvider: ({ children, items }: ControlActionsProviderProps) => React.JSX.Element;
227
+ declare const ControlActionsProvider: ({ children, items }: ControlActionsProviderProps) => React$1.JSX.Element;
195
228
  declare const useControlActions: () => ControlActionsContext;
196
229
 
197
230
  type SetValueMeta = {
@@ -205,9 +238,9 @@ type PropContext<T extends PropValue, P extends PropType> = {
205
238
  placeholder?: T;
206
239
  disabled?: boolean;
207
240
  };
208
- declare const PropContext: React.Context<PropContext<PropValue, PropType> | null>;
209
- type PropProviderProps<T extends PropValue, P extends PropType> = React.PropsWithChildren<PropContext<T, P>>;
210
- declare const PropProvider: <T extends PropValue, P extends PropType>({ children, value, setValue, propType, placeholder, disabled, }: PropProviderProps<T, P>) => React.JSX.Element;
241
+ declare const PropContext: React$1.Context<PropContext<PropValue, PropType> | null>;
242
+ type PropProviderProps<T extends PropValue, P extends PropType> = React$1.PropsWithChildren<PropContext<T, P>>;
243
+ declare const PropProvider: <T extends PropValue, P extends PropType>({ children, value, setValue, propType, placeholder, disabled, }: PropProviderProps<T, P>) => React$1.JSX.Element;
211
244
 
212
245
  type PropKeyContextValue<T, P> = {
213
246
  bind: PropKey;
@@ -218,10 +251,10 @@ type PropKeyContextValue<T, P> = {
218
251
  path: PropKey[];
219
252
  disabled?: boolean;
220
253
  };
221
- type PropKeyProviderProps = React.PropsWithChildren<{
254
+ type PropKeyProviderProps = React$1.PropsWithChildren<{
222
255
  bind: PropKey;
223
256
  }>;
224
- declare const PropKeyProvider: ({ children, bind }: PropKeyProviderProps) => React.JSX.Element;
257
+ declare const PropKeyProvider: ({ children, bind }: PropKeyProviderProps) => React$1.JSX.Element;
225
258
 
226
259
  type UseBoundProp<TValue extends PropValue> = {
227
260
  bind: PropKey;
@@ -233,7 +266,7 @@ type UseBoundProp<TValue extends PropValue> = {
233
266
  restoreValue: () => void;
234
267
  disabled?: boolean;
235
268
  };
236
- declare function useBoundProp<T extends PropValue = PropValue>(): PropKeyContextValue<T, PropType>;
269
+ declare function useBoundProp<T extends PropValue = PropValue, P extends PropType = PropType>(): PropKeyContextValue<T, P>;
237
270
  declare function useBoundProp<TKey extends string, TValue extends PropValue>(propTypeUtil: PropTypeUtil<TKey, TValue>): UseBoundProp<TValue>;
238
271
 
239
272
  type ControlReplacement = {
@@ -246,7 +279,7 @@ type ConditionArgs = {
246
279
  type Props = PropsWithChildren<{
247
280
  replacements: ControlReplacement[];
248
281
  }>;
249
- declare const ControlReplacementsProvider: ({ replacements, children }: Props) => React.JSX.Element;
282
+ declare const ControlReplacementsProvider: ({ replacements, children }: Props) => React$1.JSX.Element;
250
283
  declare const createControlReplacementsRegistry: () => {
251
284
  registerControlReplacement: (replacement: ControlReplacement) => void;
252
285
  getControlReplacements: () => ControlReplacement[];
@@ -260,9 +293,9 @@ type ControlAdornmentsContext = {
260
293
  items?: ControlAdornmentsItems;
261
294
  };
262
295
  type ControlAdornmentsProviderProps = PropsWithChildren<ControlAdornmentsContext>;
263
- declare const ControlAdornmentsProvider: ({ children, items }: ControlAdornmentsProviderProps) => React.JSX.Element;
296
+ declare const ControlAdornmentsProvider: ({ children, items }: ControlAdornmentsProviderProps) => React$1.JSX.Element;
264
297
 
265
- declare function ControlAdornments(): React.JSX.Element | null;
298
+ declare function ControlAdornments(): React$1.JSX.Element | null;
266
299
 
267
300
  declare const injectIntoRepeaterItemIcon: (args: _elementor_locations.ReplaceableInjectArgs<{
268
301
  value: PropValue;
@@ -279,4 +312,4 @@ type UseInternalStateOptions<TValue> = {
279
312
  };
280
313
  declare const useSyncExternalState: <TValue>({ external, setExternal, persistWhen, fallback, }: UseInternalStateOptions<TValue>) => readonly [TValue, (setter: ((value: TValue) => TValue) | TValue) => void];
281
314
 
282
- export { AspectRatioControl, BackgroundControl, BoxShadowRepeaterControl, ColorControl, type ControlActionsItems, ControlActionsProvider, ControlAdornments, ControlAdornmentsProvider, type ControlComponent, ControlFormLabel, ControlReplacementsProvider, ControlToggleButtonGroup, type EqualUnequalItems, EqualUnequalSizesControl, type ExtendedValue, 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 };
315
+ 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, KeyValueControl, LinkControl, LinkedDimensionsControl, NumberControl, PositionControl, PropKeyProvider, PropProvider, type PropProviderProps, RepeatableControl, SelectControl, type SetValue, SizeControl, StrokeControl, SvgMediaControl, SwitchControl, TextAreaControl, TextControl, type ToggleButtonGroupItem, ToggleControl, type ToggleControlProps, UrlControl, createControlReplacementsRegistry, injectIntoRepeaterItemIcon, injectIntoRepeaterItemLabel, useBoundProp, useControlActions, useSyncExternalState };