@elementor/editor-controls 0.4.1 → 0.5.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 (29) hide show
  1. package/CHANGELOG.md +12 -0
  2. package/dist/index.d.mts +35 -18
  3. package/dist/index.d.ts +35 -18
  4. package/dist/index.js +363 -575
  5. package/dist/index.js.map +1 -1
  6. package/dist/index.mjs +347 -565
  7. package/dist/index.mjs.map +1 -1
  8. package/package.json +3 -2
  9. package/src/bound-prop-context/errors.ts +16 -0
  10. package/src/bound-prop-context/index.ts +3 -0
  11. package/src/bound-prop-context/prop-context.tsx +48 -0
  12. package/src/bound-prop-context/prop-key-context.tsx +103 -0
  13. package/src/bound-prop-context/use-bound-prop.ts +69 -0
  14. package/src/components/repeater.tsx +3 -13
  15. package/src/controls/background-control/background-control.tsx +19 -42
  16. package/src/controls/background-control/background-overlay/background-overlay-repeater-control.tsx +32 -48
  17. package/src/controls/box-shadow-repeater-control.tsx +75 -139
  18. package/src/controls/color-control.tsx +16 -20
  19. package/src/controls/equal-unequal-sizes-control.tsx +65 -139
  20. package/src/controls/gap-control.tsx +20 -25
  21. package/src/controls/image-control.tsx +19 -34
  22. package/src/controls/image-media-control.tsx +1 -1
  23. package/src/controls/link-control.tsx +57 -58
  24. package/src/controls/linked-dimensions-control.tsx +25 -54
  25. package/src/controls/number-control.tsx +1 -1
  26. package/src/controls/stroke-control.tsx +18 -48
  27. package/src/controls/url-control.tsx +4 -14
  28. package/src/index.ts +3 -2
  29. package/src/bound-prop-context.tsx +0 -67
package/CHANGELOG.md CHANGED
@@ -1,5 +1,17 @@
1
1
  # @elementor/editor-controls
2
2
 
3
+ ## 0.5.0
4
+
5
+ ### Minor Changes
6
+
7
+ - a2245c5: Change prop provider infra to support nested props.
8
+
9
+ ### Patch Changes
10
+
11
+ - 5fc8d7b: Removed extra prop provider from background control.
12
+ - Updated dependencies [a2245c5]
13
+ - @elementor/editor-props@0.6.0
14
+
3
15
  ## 0.4.1
4
16
 
5
17
  ### Patch Changes
package/dist/index.d.mts CHANGED
@@ -1,6 +1,6 @@
1
1
  import * as React from 'react';
2
2
  import { ComponentType, ReactNode, PropsWithChildren } from 'react';
3
- import { StringPropValue, PropValue, PropKey, SizePropValue, PropTypeUtil, CreateOptions } from '@elementor/editor-props';
3
+ import { StringPropValue, PropTypeUtil, PropValue, PropKey, SizePropValue, CreateOptions, PropType } from '@elementor/editor-props';
4
4
  import { UnstableColorFieldProps, ToggleButtonProps, StackProps } from '@elementor/ui';
5
5
 
6
6
  type AnyComponentType = ComponentType<any>;
@@ -21,10 +21,10 @@ declare const TextControl: ControlComponent<({ placeholder }: {
21
21
  placeholder?: string;
22
22
  }) => React.JSX.Element>;
23
23
 
24
- type Props$3 = {
24
+ type Props$4 = {
25
25
  placeholder?: string;
26
26
  };
27
- declare const TextAreaControl: ControlComponent<({ placeholder }: Props$3) => React.JSX.Element>;
27
+ declare const TextAreaControl: ControlComponent<({ placeholder }: Props$4) => React.JSX.Element>;
28
28
 
29
29
  type Unit = 'px' | '%' | 'em' | 'rem' | 'vw' | 'vh';
30
30
  type SizeControlProps = {
@@ -38,7 +38,7 @@ declare const StrokeControl: ControlComponent<() => React.JSX.Element>;
38
38
 
39
39
  declare const BoxShadowRepeaterControl: ControlComponent<() => React.JSX.Element>;
40
40
 
41
- type Props$2 = {
41
+ type Props$3 = {
42
42
  options: Array<{
43
43
  label: string;
44
44
  value: StringPropValue['value'];
@@ -46,9 +46,12 @@ type Props$2 = {
46
46
  }>;
47
47
  onChange?: (newValue: string | null, previousValue: string | null | undefined) => void;
48
48
  };
49
- declare const SelectControl: ControlComponent<({ options, onChange }: Props$2) => React.JSX.Element>;
49
+ declare const SelectControl: ControlComponent<({ options, onChange }: Props$3) => React.JSX.Element>;
50
50
 
51
- declare const ColorControl: ControlComponent<(props: Partial<Omit<UnstableColorFieldProps, "value" | "onChange">>) => React.JSX.Element>;
51
+ type Props$2 = Partial<Omit<UnstableColorFieldProps, 'value' | 'onChange'>> & {
52
+ propTypeUtil?: PropTypeUtil<string, string>;
53
+ };
54
+ declare const ColorControl: ControlComponent<({ propTypeUtil, ...props }: Props$2) => React.JSX.Element>;
52
55
 
53
56
  type RenderContentProps = {
54
57
  size: ToggleButtonProps['size'];
@@ -140,23 +143,37 @@ type ControlActionsProviderProps = PropsWithChildren<ControlActionsContext>;
140
143
  declare const ControlActionsProvider: ({ children, items }: ControlActionsProviderProps) => React.JSX.Element;
141
144
  declare const useControlActions: () => ControlActionsContext;
142
145
 
143
- type BoundPropContext<T extends PropValue> = {
146
+ type SetValueMeta = {
147
+ bind?: PropKey;
148
+ };
149
+ type SetValue<T> = (value: T, options?: CreateOptions, meta?: SetValueMeta) => void;
150
+ type PropContext<T extends PropValue, P extends PropType> = {
151
+ setValue: SetValue<T>;
152
+ value: T | null;
153
+ propType: P;
154
+ };
155
+ declare const PropContext: React.Context<PropContext<PropValue, PropType> | null>;
156
+ type PropProviderProps<T extends PropValue, P extends PropType> = React.PropsWithChildren<PropContext<T, P>>;
157
+ declare const PropProvider: <T extends PropValue, P extends PropType>({ children, value, setValue, propType, }: PropProviderProps<T, P>) => React.JSX.Element;
158
+
159
+ type PropKeyContextValue<T, P> = {
144
160
  bind: PropKey;
145
- setValue: (value: T | null) => void;
161
+ setValue: SetValue<T>;
146
162
  value: T;
163
+ propType: P;
147
164
  };
148
- type BoundPropProviderProps<T extends PropValue> = BoundPropContext<T> & {
149
- children: React.ReactNode;
150
- setValue: (value: T | null) => void;
151
- };
152
- declare const BoundPropProvider: ({ children, value, setValue, bind }: BoundPropProviderProps<PropValue>) => React.JSX.Element;
153
- type SetValue<T> = (value: T | null, options?: CreateOptions) => void;
154
- type UseBoundProp<TValue> = {
165
+ type PropKeyProviderProps = React.PropsWithChildren<{
166
+ bind: PropKey;
167
+ }>;
168
+ declare const PropKeyProvider: ({ children, bind }: PropKeyProviderProps) => React.JSX.Element;
169
+
170
+ type UseBoundProp<TValue extends PropValue> = {
155
171
  bind: PropKey;
156
- setValue: SetValue<TValue>;
172
+ setValue: SetValue<TValue | null>;
157
173
  value: TValue;
174
+ propType: PropType;
158
175
  };
159
- declare function useBoundProp<TValue extends PropValue>(): BoundPropContext<TValue>;
176
+ declare function useBoundProp<T extends PropValue = PropValue>(): PropKeyContextValue<T, PropType>;
160
177
  declare function useBoundProp<TKey extends string, TValue extends PropValue>(propTypeUtil: PropTypeUtil<TKey, TValue>): UseBoundProp<TValue>;
161
178
 
162
179
  type ReplaceWhenParams = {
@@ -180,4 +197,4 @@ type UseInternalStateOptions<TValue> = {
180
197
  };
181
198
  declare const useSyncExternalState: <TValue>({ external, setExternal, persistWhen, fallback, }: UseInternalStateOptions<TValue>) => readonly [TValue, (setter: ((value: TValue) => TValue) | TValue) => void];
182
199
 
183
- export { BackgroundControl, BoundPropProvider, type BoundPropProviderProps, BoxShadowRepeaterControl, ColorControl, type ControlActionsItems, ControlActionsProvider, type ControlComponent, ControlLabel, ControlReplacementProvider, ControlToggleButtonGroup, type EqualUnequalItems, EqualUnequalSizesControl, FontFamilyControl, GapControl, ImageControl, LinkControl, LinkedDimensionsControl, NumberControl, SelectControl, SizeControl, StrokeControl, TextAreaControl, TextControl, type ToggleButtonGroupItem, ToggleControl, UrlControl, createControlReplacement, useBoundProp, useControlActions, useSyncExternalState };
200
+ export { BackgroundControl, BoxShadowRepeaterControl, ColorControl, type ControlActionsItems, ControlActionsProvider, type ControlComponent, ControlLabel, ControlReplacementProvider, ControlToggleButtonGroup, type EqualUnequalItems, EqualUnequalSizesControl, FontFamilyControl, GapControl, ImageControl, LinkControl, LinkedDimensionsControl, NumberControl, PropKeyProvider, PropProvider, type PropProviderProps, SelectControl, type SetValue, SizeControl, StrokeControl, TextAreaControl, TextControl, type ToggleButtonGroupItem, ToggleControl, UrlControl, createControlReplacement, useBoundProp, useControlActions, useSyncExternalState };
package/dist/index.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  import * as React from 'react';
2
2
  import { ComponentType, ReactNode, PropsWithChildren } from 'react';
3
- import { StringPropValue, PropValue, PropKey, SizePropValue, PropTypeUtil, CreateOptions } from '@elementor/editor-props';
3
+ import { StringPropValue, PropTypeUtil, PropValue, PropKey, SizePropValue, CreateOptions, PropType } from '@elementor/editor-props';
4
4
  import { UnstableColorFieldProps, ToggleButtonProps, StackProps } from '@elementor/ui';
5
5
 
6
6
  type AnyComponentType = ComponentType<any>;
@@ -21,10 +21,10 @@ declare const TextControl: ControlComponent<({ placeholder }: {
21
21
  placeholder?: string;
22
22
  }) => React.JSX.Element>;
23
23
 
24
- type Props$3 = {
24
+ type Props$4 = {
25
25
  placeholder?: string;
26
26
  };
27
- declare const TextAreaControl: ControlComponent<({ placeholder }: Props$3) => React.JSX.Element>;
27
+ declare const TextAreaControl: ControlComponent<({ placeholder }: Props$4) => React.JSX.Element>;
28
28
 
29
29
  type Unit = 'px' | '%' | 'em' | 'rem' | 'vw' | 'vh';
30
30
  type SizeControlProps = {
@@ -38,7 +38,7 @@ declare const StrokeControl: ControlComponent<() => React.JSX.Element>;
38
38
 
39
39
  declare const BoxShadowRepeaterControl: ControlComponent<() => React.JSX.Element>;
40
40
 
41
- type Props$2 = {
41
+ type Props$3 = {
42
42
  options: Array<{
43
43
  label: string;
44
44
  value: StringPropValue['value'];
@@ -46,9 +46,12 @@ type Props$2 = {
46
46
  }>;
47
47
  onChange?: (newValue: string | null, previousValue: string | null | undefined) => void;
48
48
  };
49
- declare const SelectControl: ControlComponent<({ options, onChange }: Props$2) => React.JSX.Element>;
49
+ declare const SelectControl: ControlComponent<({ options, onChange }: Props$3) => React.JSX.Element>;
50
50
 
51
- declare const ColorControl: ControlComponent<(props: Partial<Omit<UnstableColorFieldProps, "value" | "onChange">>) => React.JSX.Element>;
51
+ type Props$2 = Partial<Omit<UnstableColorFieldProps, 'value' | 'onChange'>> & {
52
+ propTypeUtil?: PropTypeUtil<string, string>;
53
+ };
54
+ declare const ColorControl: ControlComponent<({ propTypeUtil, ...props }: Props$2) => React.JSX.Element>;
52
55
 
53
56
  type RenderContentProps = {
54
57
  size: ToggleButtonProps['size'];
@@ -140,23 +143,37 @@ type ControlActionsProviderProps = PropsWithChildren<ControlActionsContext>;
140
143
  declare const ControlActionsProvider: ({ children, items }: ControlActionsProviderProps) => React.JSX.Element;
141
144
  declare const useControlActions: () => ControlActionsContext;
142
145
 
143
- type BoundPropContext<T extends PropValue> = {
146
+ type SetValueMeta = {
147
+ bind?: PropKey;
148
+ };
149
+ type SetValue<T> = (value: T, options?: CreateOptions, meta?: SetValueMeta) => void;
150
+ type PropContext<T extends PropValue, P extends PropType> = {
151
+ setValue: SetValue<T>;
152
+ value: T | null;
153
+ propType: P;
154
+ };
155
+ declare const PropContext: React.Context<PropContext<PropValue, PropType> | null>;
156
+ type PropProviderProps<T extends PropValue, P extends PropType> = React.PropsWithChildren<PropContext<T, P>>;
157
+ declare const PropProvider: <T extends PropValue, P extends PropType>({ children, value, setValue, propType, }: PropProviderProps<T, P>) => React.JSX.Element;
158
+
159
+ type PropKeyContextValue<T, P> = {
144
160
  bind: PropKey;
145
- setValue: (value: T | null) => void;
161
+ setValue: SetValue<T>;
146
162
  value: T;
163
+ propType: P;
147
164
  };
148
- type BoundPropProviderProps<T extends PropValue> = BoundPropContext<T> & {
149
- children: React.ReactNode;
150
- setValue: (value: T | null) => void;
151
- };
152
- declare const BoundPropProvider: ({ children, value, setValue, bind }: BoundPropProviderProps<PropValue>) => React.JSX.Element;
153
- type SetValue<T> = (value: T | null, options?: CreateOptions) => void;
154
- type UseBoundProp<TValue> = {
165
+ type PropKeyProviderProps = React.PropsWithChildren<{
166
+ bind: PropKey;
167
+ }>;
168
+ declare const PropKeyProvider: ({ children, bind }: PropKeyProviderProps) => React.JSX.Element;
169
+
170
+ type UseBoundProp<TValue extends PropValue> = {
155
171
  bind: PropKey;
156
- setValue: SetValue<TValue>;
172
+ setValue: SetValue<TValue | null>;
157
173
  value: TValue;
174
+ propType: PropType;
158
175
  };
159
- declare function useBoundProp<TValue extends PropValue>(): BoundPropContext<TValue>;
176
+ declare function useBoundProp<T extends PropValue = PropValue>(): PropKeyContextValue<T, PropType>;
160
177
  declare function useBoundProp<TKey extends string, TValue extends PropValue>(propTypeUtil: PropTypeUtil<TKey, TValue>): UseBoundProp<TValue>;
161
178
 
162
179
  type ReplaceWhenParams = {
@@ -180,4 +197,4 @@ type UseInternalStateOptions<TValue> = {
180
197
  };
181
198
  declare const useSyncExternalState: <TValue>({ external, setExternal, persistWhen, fallback, }: UseInternalStateOptions<TValue>) => readonly [TValue, (setter: ((value: TValue) => TValue) | TValue) => void];
182
199
 
183
- export { BackgroundControl, BoundPropProvider, type BoundPropProviderProps, BoxShadowRepeaterControl, ColorControl, type ControlActionsItems, ControlActionsProvider, type ControlComponent, ControlLabel, ControlReplacementProvider, ControlToggleButtonGroup, type EqualUnequalItems, EqualUnequalSizesControl, FontFamilyControl, GapControl, ImageControl, LinkControl, LinkedDimensionsControl, NumberControl, SelectControl, SizeControl, StrokeControl, TextAreaControl, TextControl, type ToggleButtonGroupItem, ToggleControl, UrlControl, createControlReplacement, useBoundProp, useControlActions, useSyncExternalState };
200
+ export { BackgroundControl, BoxShadowRepeaterControl, ColorControl, type ControlActionsItems, ControlActionsProvider, type ControlComponent, ControlLabel, ControlReplacementProvider, ControlToggleButtonGroup, type EqualUnequalItems, EqualUnequalSizesControl, FontFamilyControl, GapControl, ImageControl, LinkControl, LinkedDimensionsControl, NumberControl, PropKeyProvider, PropProvider, type PropProviderProps, SelectControl, type SetValue, SizeControl, StrokeControl, TextAreaControl, TextControl, type ToggleButtonGroupItem, ToggleControl, UrlControl, createControlReplacement, useBoundProp, useControlActions, useSyncExternalState };