@elementor/editor-editing-panel 1.50.0 → 3.32.0-20
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.
- package/CHANGELOG.md +0 -27
- package/dist/index.d.mts +78 -47
- package/dist/index.d.ts +78 -47
- package/dist/index.js +1723 -1384
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +1510 -1143
- package/dist/index.mjs.map +1 -1
- package/package.json +22 -22
- package/src/components/css-classes/css-class-convert-local.tsx +77 -0
- package/src/components/css-classes/css-class-item.tsx +15 -1
- package/src/components/css-classes/css-class-menu.tsx +8 -1
- package/src/components/css-classes/local-class-sub-menu.tsx +23 -0
- package/src/components/css-classes/use-apply-and-unapply-class.ts +7 -50
- package/src/components/css-classes/use-can-convert-local-class-to-global.ts +22 -0
- package/src/components/custom-css.tsx +21 -0
- package/src/components/editing-panel-tabs.tsx +1 -5
- package/src/components/section.tsx +1 -5
- package/src/components/settings-tab.tsx +6 -15
- package/src/components/style-sections/effects-section/effects-section.tsx +30 -22
- package/src/components/style-sections/layout-section/display-field.tsx +11 -20
- package/src/components/style-sections/layout-section/flex-size-field.tsx +86 -52
- package/src/components/style-sections/position-section/offset-field.tsx +2 -2
- package/src/components/style-sections/position-section/position-section.tsx +2 -8
- package/src/components/style-sections/size-section/size-section.tsx +16 -31
- package/src/components/style-sections/typography-section/typography-section.tsx +2 -19
- package/src/components/style-tab-collapsible-content.tsx +1 -5
- package/src/components/style-tab-section.tsx +1 -5
- package/src/components/style-tab.tsx +15 -2
- package/src/controls-actions.ts +1 -1
- package/src/controls-registry/conditional-field.tsx +26 -0
- package/src/controls-registry/control.tsx +2 -2
- package/src/controls-registry/controls-registry.tsx +44 -3
- package/src/controls-registry/settings-field.tsx +33 -45
- package/src/controls-registry/styles-field.tsx +14 -14
- package/src/dynamics/components/dynamic-selection-control.tsx +2 -2
- package/src/errors.ts +10 -0
- package/src/hooks/use-custom-css.ts +184 -0
- package/src/hooks/use-state-by-element.ts +1 -4
- package/src/hooks/use-styles-fields.ts +129 -106
- package/src/index.ts +9 -10
- package/src/init.ts +2 -5
- package/src/popover-action.tsx +36 -15
- package/src/reset-style-props.tsx +2 -6
- package/src/styles-inheritance/components/infotip/value-component.tsx +1 -0
- package/src/styles-inheritance/components/styles-inheritance-indicator.tsx +6 -23
- package/src/styles-inheritance/components/styles-inheritance-infotip.tsx +17 -8
- package/src/styles-inheritance/consts.ts +0 -4
- package/src/styles-inheritance/init.ts +1 -4
- package/src/styles-inheritance/transformers/background-color-overlay-transformer.tsx +5 -1
- package/src/styles-inheritance/transformers/background-gradient-overlay-transformer.tsx +3 -3
- package/src/styles-inheritance/transformers/background-image-overlay-transformer.tsx +2 -1
- package/src/utils/prop-dependency-utils.ts +156 -0
- package/src/components/style-sections/size-section/object-position-field.tsx +0 -15
- package/src/sync/experiments-flags.ts +0 -5
- /package/src/components/style-sections/{layout-section → effects-section}/opacity-control-field.tsx +0 -0
package/CHANGELOG.md
CHANGED
|
@@ -1,32 +1,5 @@
|
|
|
1
1
|
# Change Log
|
|
2
2
|
|
|
3
|
-
## 1.50.0
|
|
4
|
-
|
|
5
|
-
### Minor Changes
|
|
6
|
-
|
|
7
|
-
- 64b3e09: Adds support for the backdrop-filter css property to atomic widgets.
|
|
8
|
-
- 3d530f6: Change the positioning of the advanced dynamic tags settings.
|
|
9
|
-
|
|
10
|
-
### Patch Changes
|
|
11
|
-
|
|
12
|
-
- 22b87fb: Add temporary theme provider to css class selector.
|
|
13
|
-
- 0db150c: Update the popover height.
|
|
14
|
-
- Updated dependencies [64b3e09]
|
|
15
|
-
- Updated dependencies [3904505]
|
|
16
|
-
- Updated dependencies [0db150c]
|
|
17
|
-
- Updated dependencies [cdbd491]
|
|
18
|
-
- Updated dependencies [b90d7db]
|
|
19
|
-
- @elementor/editor-controls@1.5.0
|
|
20
|
-
- @elementor/editor-canvas@0.28.0
|
|
21
|
-
- @elementor/editor-props@0.18.0
|
|
22
|
-
- @elementor/editor-ui@0.14.2
|
|
23
|
-
- @elementor/editor-styles-repository@0.10.7
|
|
24
|
-
- @elementor/editor-elements@0.9.2
|
|
25
|
-
- @elementor/editor-styles@0.6.14
|
|
26
|
-
- @elementor/editor@0.21.1
|
|
27
|
-
- @elementor/editor-documents@0.13.10
|
|
28
|
-
- @elementor/editor-panels@0.17.1
|
|
29
|
-
|
|
30
3
|
## 1.49.0
|
|
31
4
|
|
|
32
5
|
### Minor Changes
|
package/dist/index.d.mts
CHANGED
|
@@ -1,27 +1,37 @@
|
|
|
1
1
|
import { FontCategory } from '@elementor/editor-controls';
|
|
2
2
|
export { useBoundProp } from '@elementor/editor-controls';
|
|
3
|
+
import * as _elementor_locations from '@elementor/locations';
|
|
4
|
+
import { StyleDefinition } from '@elementor/editor-styles';
|
|
3
5
|
import * as React from 'react';
|
|
4
6
|
import { ElementType, ComponentType } from 'react';
|
|
7
|
+
import { PopoverBody as PopoverBody$1 } from '@elementor/editor-ui';
|
|
5
8
|
import * as _elementor_editor_props from '@elementor/editor-props';
|
|
6
|
-
import { ChipProps, Theme } from '@elementor/ui';
|
|
7
|
-
import * as _elementor_locations from '@elementor/locations';
|
|
8
9
|
import * as _elementor_menus from '@elementor/menus';
|
|
9
|
-
import {
|
|
10
|
+
import { ChipProps, Theme } from '@elementor/ui';
|
|
10
11
|
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
12
|
+
type ValidationResult = {
|
|
13
|
+
isValid: true;
|
|
14
|
+
errorMessage: null;
|
|
15
|
+
} | {
|
|
16
|
+
isValid: false;
|
|
17
|
+
errorMessage: string;
|
|
14
18
|
};
|
|
19
|
+
type ValidationEvent = 'inputChange' | 'create';
|
|
15
20
|
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
21
|
+
declare const injectIntoCssClassConvert: (args: _elementor_locations.InjectArgs<{
|
|
22
|
+
styleDef: StyleDefinition | null;
|
|
23
|
+
successCallback: (newId: string) => void;
|
|
24
|
+
canConvert: boolean;
|
|
25
|
+
}>) => void;
|
|
26
|
+
|
|
27
|
+
declare const injectIntoClassSelectorActions: (args: _elementor_locations.InjectArgs<object>) => void;
|
|
28
|
+
|
|
29
|
+
type Props = React.ComponentProps<typeof PopoverBody$1>;
|
|
30
|
+
declare const PopoverBody: (props: Props) => React.JSX.Element;
|
|
31
|
+
|
|
32
|
+
declare const useFontFamilies: () => FontCategory[];
|
|
33
|
+
|
|
34
|
+
declare const useSectionWidth: () => number;
|
|
25
35
|
|
|
26
36
|
declare const registerControlReplacement: (replacement: {
|
|
27
37
|
component: React.ComponentType;
|
|
@@ -30,32 +40,6 @@ declare const registerControlReplacement: (replacement: {
|
|
|
30
40
|
}) => boolean;
|
|
31
41
|
}) => void;
|
|
32
42
|
|
|
33
|
-
type Colors = {
|
|
34
|
-
name: ChipProps['color'];
|
|
35
|
-
getThemeColor: ((theme: Theme) => string) | null;
|
|
36
|
-
};
|
|
37
|
-
declare const registerStyleProviderToColors: (provider: string, colors: Colors) => void;
|
|
38
|
-
|
|
39
|
-
declare const injectIntoClassSelectorActions: (args: _elementor_locations.InjectArgs<object>) => void;
|
|
40
|
-
|
|
41
|
-
declare const usePanelActions: () => {
|
|
42
|
-
open: () => Promise<void>;
|
|
43
|
-
close: () => Promise<void>;
|
|
44
|
-
};
|
|
45
|
-
declare const usePanelStatus: () => {
|
|
46
|
-
isOpen: boolean;
|
|
47
|
-
isBlocked: boolean;
|
|
48
|
-
};
|
|
49
|
-
|
|
50
|
-
type ValidationResult = {
|
|
51
|
-
isValid: true;
|
|
52
|
-
errorMessage: null;
|
|
53
|
-
} | {
|
|
54
|
-
isValid: false;
|
|
55
|
-
errorMessage: string;
|
|
56
|
-
};
|
|
57
|
-
type ValidationEvent = 'inputChange' | 'create';
|
|
58
|
-
|
|
59
43
|
type ActionProps = {
|
|
60
44
|
title: string;
|
|
61
45
|
visible?: boolean;
|
|
@@ -64,18 +48,65 @@ type ActionProps = {
|
|
|
64
48
|
};
|
|
65
49
|
declare function Action({ title, visible, icon: Icon, onClick }: ActionProps): React.JSX.Element | null;
|
|
66
50
|
|
|
51
|
+
type PopoverActionProps = {
|
|
52
|
+
title: string;
|
|
53
|
+
visible?: boolean;
|
|
54
|
+
icon: ElementType;
|
|
55
|
+
content: ComponentType<{
|
|
56
|
+
close: () => void;
|
|
57
|
+
}>;
|
|
58
|
+
};
|
|
59
|
+
declare function PopoverAction({ title, visible, icon: Icon, content: PopoverContent }: PopoverActionProps): React.JSX.Element | null;
|
|
60
|
+
|
|
67
61
|
declare const controlActionsMenu: _elementor_menus.Menu<{
|
|
68
62
|
Action: typeof Action;
|
|
69
63
|
PopoverAction: typeof PopoverAction;
|
|
70
64
|
}, "default">;
|
|
71
65
|
|
|
72
|
-
declare
|
|
66
|
+
declare function init(): void;
|
|
73
67
|
|
|
74
|
-
|
|
75
|
-
|
|
68
|
+
declare const usePanelActions: () => {
|
|
69
|
+
open: () => Promise<void>;
|
|
70
|
+
close: () => Promise<void>;
|
|
71
|
+
};
|
|
72
|
+
declare const usePanelStatus: () => {
|
|
73
|
+
isOpen: boolean;
|
|
74
|
+
isBlocked: boolean;
|
|
75
|
+
};
|
|
76
76
|
|
|
77
|
-
|
|
77
|
+
type Colors = {
|
|
78
|
+
name: ChipProps['color'];
|
|
79
|
+
getThemeColor: ((theme: Theme) => string) | null;
|
|
80
|
+
};
|
|
81
|
+
declare const registerStyleProviderToColors: (provider: string, colors: Colors) => void;
|
|
78
82
|
|
|
79
|
-
declare
|
|
83
|
+
declare const stylesInheritanceTransformersRegistry: {
|
|
84
|
+
register(type: _elementor_editor_props.PropTypeKey, transformer: ((value: any, options: {
|
|
85
|
+
key: string;
|
|
86
|
+
signal?: AbortSignal;
|
|
87
|
+
}) => unknown) & {
|
|
88
|
+
__transformer: true;
|
|
89
|
+
}): any;
|
|
90
|
+
registerFallback(transformer: ((value: any, options: {
|
|
91
|
+
key: string;
|
|
92
|
+
signal?: AbortSignal;
|
|
93
|
+
}) => unknown) & {
|
|
94
|
+
__transformer: true;
|
|
95
|
+
}): any;
|
|
96
|
+
get(type: _elementor_editor_props.PropTypeKey): (((value: any, options: {
|
|
97
|
+
key: string;
|
|
98
|
+
signal?: AbortSignal;
|
|
99
|
+
}) => unknown) & {
|
|
100
|
+
__transformer: true;
|
|
101
|
+
}) | null;
|
|
102
|
+
all(): {
|
|
103
|
+
[x: string]: ((value: any, options: {
|
|
104
|
+
key: string;
|
|
105
|
+
signal?: AbortSignal;
|
|
106
|
+
}) => unknown) & {
|
|
107
|
+
__transformer: true;
|
|
108
|
+
};
|
|
109
|
+
};
|
|
110
|
+
};
|
|
80
111
|
|
|
81
|
-
export {
|
|
112
|
+
export { type PopoverActionProps, PopoverBody, type ValidationEvent, type ValidationResult, controlActionsMenu, init, injectIntoClassSelectorActions, injectIntoCssClassConvert, registerControlReplacement, registerStyleProviderToColors, stylesInheritanceTransformersRegistry, useFontFamilies, usePanelActions, usePanelStatus, useSectionWidth };
|
package/dist/index.d.ts
CHANGED
|
@@ -1,27 +1,37 @@
|
|
|
1
1
|
import { FontCategory } from '@elementor/editor-controls';
|
|
2
2
|
export { useBoundProp } from '@elementor/editor-controls';
|
|
3
|
+
import * as _elementor_locations from '@elementor/locations';
|
|
4
|
+
import { StyleDefinition } from '@elementor/editor-styles';
|
|
3
5
|
import * as React from 'react';
|
|
4
6
|
import { ElementType, ComponentType } from 'react';
|
|
7
|
+
import { PopoverBody as PopoverBody$1 } from '@elementor/editor-ui';
|
|
5
8
|
import * as _elementor_editor_props from '@elementor/editor-props';
|
|
6
|
-
import { ChipProps, Theme } from '@elementor/ui';
|
|
7
|
-
import * as _elementor_locations from '@elementor/locations';
|
|
8
9
|
import * as _elementor_menus from '@elementor/menus';
|
|
9
|
-
import {
|
|
10
|
+
import { ChipProps, Theme } from '@elementor/ui';
|
|
10
11
|
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
12
|
+
type ValidationResult = {
|
|
13
|
+
isValid: true;
|
|
14
|
+
errorMessage: null;
|
|
15
|
+
} | {
|
|
16
|
+
isValid: false;
|
|
17
|
+
errorMessage: string;
|
|
14
18
|
};
|
|
19
|
+
type ValidationEvent = 'inputChange' | 'create';
|
|
15
20
|
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
21
|
+
declare const injectIntoCssClassConvert: (args: _elementor_locations.InjectArgs<{
|
|
22
|
+
styleDef: StyleDefinition | null;
|
|
23
|
+
successCallback: (newId: string) => void;
|
|
24
|
+
canConvert: boolean;
|
|
25
|
+
}>) => void;
|
|
26
|
+
|
|
27
|
+
declare const injectIntoClassSelectorActions: (args: _elementor_locations.InjectArgs<object>) => void;
|
|
28
|
+
|
|
29
|
+
type Props = React.ComponentProps<typeof PopoverBody$1>;
|
|
30
|
+
declare const PopoverBody: (props: Props) => React.JSX.Element;
|
|
31
|
+
|
|
32
|
+
declare const useFontFamilies: () => FontCategory[];
|
|
33
|
+
|
|
34
|
+
declare const useSectionWidth: () => number;
|
|
25
35
|
|
|
26
36
|
declare const registerControlReplacement: (replacement: {
|
|
27
37
|
component: React.ComponentType;
|
|
@@ -30,32 +40,6 @@ declare const registerControlReplacement: (replacement: {
|
|
|
30
40
|
}) => boolean;
|
|
31
41
|
}) => void;
|
|
32
42
|
|
|
33
|
-
type Colors = {
|
|
34
|
-
name: ChipProps['color'];
|
|
35
|
-
getThemeColor: ((theme: Theme) => string) | null;
|
|
36
|
-
};
|
|
37
|
-
declare const registerStyleProviderToColors: (provider: string, colors: Colors) => void;
|
|
38
|
-
|
|
39
|
-
declare const injectIntoClassSelectorActions: (args: _elementor_locations.InjectArgs<object>) => void;
|
|
40
|
-
|
|
41
|
-
declare const usePanelActions: () => {
|
|
42
|
-
open: () => Promise<void>;
|
|
43
|
-
close: () => Promise<void>;
|
|
44
|
-
};
|
|
45
|
-
declare const usePanelStatus: () => {
|
|
46
|
-
isOpen: boolean;
|
|
47
|
-
isBlocked: boolean;
|
|
48
|
-
};
|
|
49
|
-
|
|
50
|
-
type ValidationResult = {
|
|
51
|
-
isValid: true;
|
|
52
|
-
errorMessage: null;
|
|
53
|
-
} | {
|
|
54
|
-
isValid: false;
|
|
55
|
-
errorMessage: string;
|
|
56
|
-
};
|
|
57
|
-
type ValidationEvent = 'inputChange' | 'create';
|
|
58
|
-
|
|
59
43
|
type ActionProps = {
|
|
60
44
|
title: string;
|
|
61
45
|
visible?: boolean;
|
|
@@ -64,18 +48,65 @@ type ActionProps = {
|
|
|
64
48
|
};
|
|
65
49
|
declare function Action({ title, visible, icon: Icon, onClick }: ActionProps): React.JSX.Element | null;
|
|
66
50
|
|
|
51
|
+
type PopoverActionProps = {
|
|
52
|
+
title: string;
|
|
53
|
+
visible?: boolean;
|
|
54
|
+
icon: ElementType;
|
|
55
|
+
content: ComponentType<{
|
|
56
|
+
close: () => void;
|
|
57
|
+
}>;
|
|
58
|
+
};
|
|
59
|
+
declare function PopoverAction({ title, visible, icon: Icon, content: PopoverContent }: PopoverActionProps): React.JSX.Element | null;
|
|
60
|
+
|
|
67
61
|
declare const controlActionsMenu: _elementor_menus.Menu<{
|
|
68
62
|
Action: typeof Action;
|
|
69
63
|
PopoverAction: typeof PopoverAction;
|
|
70
64
|
}, "default">;
|
|
71
65
|
|
|
72
|
-
declare
|
|
66
|
+
declare function init(): void;
|
|
73
67
|
|
|
74
|
-
|
|
75
|
-
|
|
68
|
+
declare const usePanelActions: () => {
|
|
69
|
+
open: () => Promise<void>;
|
|
70
|
+
close: () => Promise<void>;
|
|
71
|
+
};
|
|
72
|
+
declare const usePanelStatus: () => {
|
|
73
|
+
isOpen: boolean;
|
|
74
|
+
isBlocked: boolean;
|
|
75
|
+
};
|
|
76
76
|
|
|
77
|
-
|
|
77
|
+
type Colors = {
|
|
78
|
+
name: ChipProps['color'];
|
|
79
|
+
getThemeColor: ((theme: Theme) => string) | null;
|
|
80
|
+
};
|
|
81
|
+
declare const registerStyleProviderToColors: (provider: string, colors: Colors) => void;
|
|
78
82
|
|
|
79
|
-
declare
|
|
83
|
+
declare const stylesInheritanceTransformersRegistry: {
|
|
84
|
+
register(type: _elementor_editor_props.PropTypeKey, transformer: ((value: any, options: {
|
|
85
|
+
key: string;
|
|
86
|
+
signal?: AbortSignal;
|
|
87
|
+
}) => unknown) & {
|
|
88
|
+
__transformer: true;
|
|
89
|
+
}): any;
|
|
90
|
+
registerFallback(transformer: ((value: any, options: {
|
|
91
|
+
key: string;
|
|
92
|
+
signal?: AbortSignal;
|
|
93
|
+
}) => unknown) & {
|
|
94
|
+
__transformer: true;
|
|
95
|
+
}): any;
|
|
96
|
+
get(type: _elementor_editor_props.PropTypeKey): (((value: any, options: {
|
|
97
|
+
key: string;
|
|
98
|
+
signal?: AbortSignal;
|
|
99
|
+
}) => unknown) & {
|
|
100
|
+
__transformer: true;
|
|
101
|
+
}) | null;
|
|
102
|
+
all(): {
|
|
103
|
+
[x: string]: ((value: any, options: {
|
|
104
|
+
key: string;
|
|
105
|
+
signal?: AbortSignal;
|
|
106
|
+
}) => unknown) & {
|
|
107
|
+
__transformer: true;
|
|
108
|
+
};
|
|
109
|
+
};
|
|
110
|
+
};
|
|
80
111
|
|
|
81
|
-
export {
|
|
112
|
+
export { type PopoverActionProps, PopoverBody, type ValidationEvent, type ValidationResult, controlActionsMenu, init, injectIntoClassSelectorActions, injectIntoCssClassConvert, registerControlReplacement, registerStyleProviderToColors, stylesInheritanceTransformersRegistry, useFontFamilies, usePanelActions, usePanelStatus, useSectionWidth };
|