@elementor/editor-controls 0.36.0 → 1.0.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 (24) hide show
  1. package/CHANGELOG.md +17 -0
  2. package/dist/index.d.mts +14 -9
  3. package/dist/index.d.ts +14 -9
  4. package/dist/index.js +750 -534
  5. package/dist/index.js.map +1 -1
  6. package/dist/index.mjs +688 -464
  7. package/dist/index.mjs.map +1 -1
  8. package/package.json +4 -3
  9. package/src/bound-prop-context/use-bound-prop.ts +4 -1
  10. package/src/components/popover-grid-container.tsx +7 -10
  11. package/src/components/size-control/size-input.tsx +125 -0
  12. package/src/components/{text-field-inner-selection.tsx → size-control/text-field-inner-selection.tsx} +33 -16
  13. package/src/components/text-field-popover.tsx +47 -0
  14. package/src/controls/background-control/background-overlay/background-image-overlay/background-image-overlay-position.tsx +11 -3
  15. package/src/controls/background-control/background-overlay/background-image-overlay/background-image-overlay-size.tsx +7 -3
  16. package/src/controls/box-shadow-repeater-control.tsx +8 -6
  17. package/src/controls/equal-unequal-sizes-control.tsx +24 -14
  18. package/src/controls/gap-control.tsx +17 -6
  19. package/src/controls/linked-dimensions-control.tsx +62 -81
  20. package/src/controls/size-control.tsx +179 -149
  21. package/src/controls/stroke-control.tsx +9 -6
  22. package/src/hooks/use-size-extended-options.ts +21 -0
  23. package/src/index.ts +1 -1
  24. package/src/utils/size-control.ts +10 -0
package/CHANGELOG.md CHANGED
@@ -1,5 +1,22 @@
1
1
  # @elementor/editor-controls
2
2
 
3
+ ## 1.0.0
4
+
5
+ ### Major Changes
6
+
7
+ - 2c11540: Added support for custom values in size control
8
+
9
+ ### Minor Changes
10
+
11
+ - 199c99a: Added support to listen to breakpoint changes in the size-control
12
+
13
+ ### Patch Changes
14
+
15
+ - Updated dependencies [ab6320c]
16
+ - Updated dependencies [2c11540]
17
+ - @elementor/editor-props@0.13.0
18
+ - @elementor/editor-elements@0.8.5
19
+
3
20
  ## 0.36.0
4
21
 
5
22
  ### Minor Changes
package/dist/index.d.mts CHANGED
@@ -1,5 +1,5 @@
1
1
  import * as React from 'react';
2
- import { ReactNode, ComponentType, PropsWithChildren } 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
4
  import { UnstableColorFieldProps, ToggleButtonProps, StackProps, FormLabelProps } from '@elementor/ui';
5
5
  import * as _elementor_locations from '@elementor/locations';
@@ -23,15 +23,20 @@ type Props$6 = {
23
23
  };
24
24
  declare const TextAreaControl: ControlComponent<({ placeholder }: Props$6) => React.JSX.Element>;
25
25
 
26
- type ExtendedValue = 'auto';
27
- type Unit = 'px' | '%' | 'em' | 'rem' | 'vw' | 'vh';
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];
30
+
28
31
  type SizeControlProps = {
29
32
  placeholder?: string;
30
33
  startIcon?: React.ReactNode;
31
34
  units?: Unit[];
32
- extendedValues?: ExtendedValue[];
35
+ extendedOptions?: ExtendedOption[];
36
+ disableCustom?: boolean;
37
+ anchorRef?: MutableRefObject<HTMLElement | undefined>;
33
38
  };
34
- declare const SizeControl: ControlComponent<({ units, extendedValues, placeholder, startIcon }: SizeControlProps) => React.JSX.Element>;
39
+ declare const SizeControl: ControlComponent<(props: SizeControlProps) => React.JSX.Element>;
35
40
 
36
41
  declare const StrokeControl: ControlComponent<() => React.JSX.Element>;
37
42
 
@@ -117,10 +122,10 @@ type Props$2<TMultiPropType extends string, TPropValue extends MultiSizePropValu
117
122
  };
118
123
  declare function EqualUnequalSizesControl<TMultiPropType extends string, TPropValue extends MultiSizePropValue>({ label, icon, tooltipLabel, items, multiSizePropTypeUtil, }: Props$2<TMultiPropType, TPropValue>): React.JSX.Element;
119
124
 
120
- declare const LinkedDimensionsControl: ControlComponent<({ label, isSiteRtl, extendedValues, }: {
125
+ declare const LinkedDimensionsControl: ControlComponent<({ label, isSiteRtl, extendedOptions, }: {
121
126
  label: string;
122
127
  isSiteRtl?: boolean;
123
- extendedValues?: ExtendedValue[];
128
+ extendedOptions?: ExtendedOption[];
124
129
  }) => React.JSX.Element>;
125
130
 
126
131
  type FontCategory = {
@@ -233,7 +238,7 @@ type UseBoundProp<TValue extends PropValue> = {
233
238
  restoreValue: () => void;
234
239
  disabled?: boolean;
235
240
  };
236
- declare function useBoundProp<T extends PropValue = PropValue>(): PropKeyContextValue<T, PropType>;
241
+ declare function useBoundProp<T extends PropValue = PropValue, P extends PropType = PropType>(): PropKeyContextValue<T, P>;
237
242
  declare function useBoundProp<TKey extends string, TValue extends PropValue>(propTypeUtil: PropTypeUtil<TKey, TValue>): UseBoundProp<TValue>;
238
243
 
239
244
  type ControlReplacement = {
@@ -279,4 +284,4 @@ type UseInternalStateOptions<TValue> = {
279
284
  };
280
285
  declare const useSyncExternalState: <TValue>({ external, setExternal, persistWhen, fallback, }: UseInternalStateOptions<TValue>) => readonly [TValue, (setter: ((value: TValue) => TValue) | TValue) => void];
281
286
 
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 };
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 };
package/dist/index.d.ts CHANGED
@@ -1,5 +1,5 @@
1
1
  import * as React from 'react';
2
- import { ReactNode, ComponentType, PropsWithChildren } 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
4
  import { UnstableColorFieldProps, ToggleButtonProps, StackProps, FormLabelProps } from '@elementor/ui';
5
5
  import * as _elementor_locations from '@elementor/locations';
@@ -23,15 +23,20 @@ type Props$6 = {
23
23
  };
24
24
  declare const TextAreaControl: ControlComponent<({ placeholder }: Props$6) => React.JSX.Element>;
25
25
 
26
- type ExtendedValue = 'auto';
27
- type Unit = 'px' | '%' | 'em' | 'rem' | 'vw' | 'vh';
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];
30
+
28
31
  type SizeControlProps = {
29
32
  placeholder?: string;
30
33
  startIcon?: React.ReactNode;
31
34
  units?: Unit[];
32
- extendedValues?: ExtendedValue[];
35
+ extendedOptions?: ExtendedOption[];
36
+ disableCustom?: boolean;
37
+ anchorRef?: MutableRefObject<HTMLElement | undefined>;
33
38
  };
34
- declare const SizeControl: ControlComponent<({ units, extendedValues, placeholder, startIcon }: SizeControlProps) => React.JSX.Element>;
39
+ declare const SizeControl: ControlComponent<(props: SizeControlProps) => React.JSX.Element>;
35
40
 
36
41
  declare const StrokeControl: ControlComponent<() => React.JSX.Element>;
37
42
 
@@ -117,10 +122,10 @@ type Props$2<TMultiPropType extends string, TPropValue extends MultiSizePropValu
117
122
  };
118
123
  declare function EqualUnequalSizesControl<TMultiPropType extends string, TPropValue extends MultiSizePropValue>({ label, icon, tooltipLabel, items, multiSizePropTypeUtil, }: Props$2<TMultiPropType, TPropValue>): React.JSX.Element;
119
124
 
120
- declare const LinkedDimensionsControl: ControlComponent<({ label, isSiteRtl, extendedValues, }: {
125
+ declare const LinkedDimensionsControl: ControlComponent<({ label, isSiteRtl, extendedOptions, }: {
121
126
  label: string;
122
127
  isSiteRtl?: boolean;
123
- extendedValues?: ExtendedValue[];
128
+ extendedOptions?: ExtendedOption[];
124
129
  }) => React.JSX.Element>;
125
130
 
126
131
  type FontCategory = {
@@ -233,7 +238,7 @@ type UseBoundProp<TValue extends PropValue> = {
233
238
  restoreValue: () => void;
234
239
  disabled?: boolean;
235
240
  };
236
- declare function useBoundProp<T extends PropValue = PropValue>(): PropKeyContextValue<T, PropType>;
241
+ declare function useBoundProp<T extends PropValue = PropValue, P extends PropType = PropType>(): PropKeyContextValue<T, P>;
237
242
  declare function useBoundProp<TKey extends string, TValue extends PropValue>(propTypeUtil: PropTypeUtil<TKey, TValue>): UseBoundProp<TValue>;
238
243
 
239
244
  type ControlReplacement = {
@@ -279,4 +284,4 @@ type UseInternalStateOptions<TValue> = {
279
284
  };
280
285
  declare const useSyncExternalState: <TValue>({ external, setExternal, persistWhen, fallback, }: UseInternalStateOptions<TValue>) => readonly [TValue, (setter: ((value: TValue) => TValue) | TValue) => void];
281
286
 
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 };
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 };