@elementor/editor-editing-panel 1.37.0 → 1.38.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.
- package/CHANGELOG.md +6 -0
- package/dist/index.js +231 -209
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +183 -161
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
- package/src/components/style-sections/typography-section/column-count-field.tsx +22 -0
- package/src/components/style-sections/typography-section/column-gap-field.tsx +22 -0
- package/src/components/style-sections/typography-section/typography-section.tsx +14 -0
package/dist/index.js
CHANGED
|
@@ -34,12 +34,12 @@ __export(index_exports, {
|
|
|
34
34
|
init: () => init2,
|
|
35
35
|
injectIntoClassSelectorActions: () => injectIntoClassSelectorActions,
|
|
36
36
|
registerControlReplacement: () => registerControlReplacement,
|
|
37
|
-
useBoundProp: () =>
|
|
37
|
+
useBoundProp: () => import_editor_controls55.useBoundProp,
|
|
38
38
|
usePanelActions: () => usePanelActions,
|
|
39
39
|
usePanelStatus: () => usePanelStatus
|
|
40
40
|
});
|
|
41
41
|
module.exports = __toCommonJS(index_exports);
|
|
42
|
-
var
|
|
42
|
+
var import_editor_controls55 = require("@elementor/editor-controls");
|
|
43
43
|
|
|
44
44
|
// src/control-replacement.tsx
|
|
45
45
|
var import_editor_controls = require("@elementor/editor-controls");
|
|
@@ -949,15 +949,15 @@ function useHandleApply(appliedIds, setAppliedIds) {
|
|
|
949
949
|
var import_editor_panels2 = require("@elementor/editor-panels");
|
|
950
950
|
|
|
951
951
|
// src/components/editing-panel.tsx
|
|
952
|
-
var
|
|
953
|
-
var
|
|
952
|
+
var React74 = __toESM(require("react"));
|
|
953
|
+
var import_editor_controls49 = require("@elementor/editor-controls");
|
|
954
954
|
var import_editor_elements8 = require("@elementor/editor-elements");
|
|
955
955
|
var import_editor_panels = require("@elementor/editor-panels");
|
|
956
956
|
var import_editor_ui4 = require("@elementor/editor-ui");
|
|
957
957
|
var import_icons23 = require("@elementor/icons");
|
|
958
958
|
var import_session5 = require("@elementor/session");
|
|
959
|
-
var
|
|
960
|
-
var
|
|
959
|
+
var import_ui62 = require("@elementor/ui");
|
|
960
|
+
var import_i18n50 = require("@wordpress/i18n");
|
|
961
961
|
|
|
962
962
|
// src/controls-actions.ts
|
|
963
963
|
var import_menus = require("@elementor/menus");
|
|
@@ -1013,10 +1013,10 @@ function EditorPanelErrorFallback() {
|
|
|
1013
1013
|
}
|
|
1014
1014
|
|
|
1015
1015
|
// src/components/editing-panel-tabs.tsx
|
|
1016
|
-
var
|
|
1016
|
+
var React73 = __toESM(require("react"));
|
|
1017
1017
|
var import_react26 = require("react");
|
|
1018
|
-
var
|
|
1019
|
-
var
|
|
1018
|
+
var import_ui61 = require("@elementor/ui");
|
|
1019
|
+
var import_i18n49 = require("@wordpress/i18n");
|
|
1020
1020
|
|
|
1021
1021
|
// src/contexts/scroll-context.tsx
|
|
1022
1022
|
var React10 = __toESM(require("react"));
|
|
@@ -1240,13 +1240,13 @@ var Control2 = ({ control }) => {
|
|
|
1240
1240
|
};
|
|
1241
1241
|
|
|
1242
1242
|
// src/components/style-tab.tsx
|
|
1243
|
-
var
|
|
1243
|
+
var React72 = __toESM(require("react"));
|
|
1244
1244
|
var import_react25 = require("react");
|
|
1245
1245
|
var import_editor_props7 = require("@elementor/editor-props");
|
|
1246
1246
|
var import_editor_responsive2 = require("@elementor/editor-responsive");
|
|
1247
1247
|
var import_session4 = require("@elementor/session");
|
|
1248
|
-
var
|
|
1249
|
-
var
|
|
1248
|
+
var import_ui60 = require("@elementor/ui");
|
|
1249
|
+
var import_i18n48 = require("@wordpress/i18n");
|
|
1250
1250
|
|
|
1251
1251
|
// src/contexts/styles-inheritance-context.tsx
|
|
1252
1252
|
var React17 = __toESM(require("react"));
|
|
@@ -2921,21 +2921,40 @@ var SpacingSection = () => {
|
|
|
2921
2921
|
};
|
|
2922
2922
|
|
|
2923
2923
|
// src/components/style-sections/typography-section/typography-section.tsx
|
|
2924
|
-
var
|
|
2924
|
+
var React71 = __toESM(require("react"));
|
|
2925
|
+
var import_editor_v1_adapters8 = require("@elementor/editor-v1-adapters");
|
|
2925
2926
|
|
|
2926
|
-
// src/components/style-sections/typography-section/
|
|
2927
|
+
// src/components/style-sections/typography-section/column-count-field.tsx
|
|
2927
2928
|
var React56 = __toESM(require("react"));
|
|
2928
2929
|
var import_editor_controls34 = require("@elementor/editor-controls");
|
|
2929
2930
|
var import_ui46 = require("@elementor/ui");
|
|
2931
|
+
var import_i18n32 = require("@wordpress/i18n");
|
|
2932
|
+
var ColumnCountField = () => {
|
|
2933
|
+
return /* @__PURE__ */ React56.createElement(StylesField, { bind: "column-count" }, /* @__PURE__ */ React56.createElement(import_ui46.Grid, { container: true, gap: 2, alignItems: "center", flexWrap: "nowrap" }, /* @__PURE__ */ React56.createElement(import_ui46.Grid, { item: true, xs: 6 }, /* @__PURE__ */ React56.createElement(ControlLabel, null, (0, import_i18n32.__)("Columns", "elementor"))), /* @__PURE__ */ React56.createElement(import_ui46.Grid, { item: true, xs: 6 }, /* @__PURE__ */ React56.createElement(import_editor_controls34.NumberControl, { shouldForceInt: true, min: 0, step: 1 }))));
|
|
2934
|
+
};
|
|
2935
|
+
|
|
2936
|
+
// src/components/style-sections/typography-section/column-gap-field.tsx
|
|
2937
|
+
var React57 = __toESM(require("react"));
|
|
2938
|
+
var import_editor_controls35 = require("@elementor/editor-controls");
|
|
2939
|
+
var import_ui47 = require("@elementor/ui");
|
|
2930
2940
|
var import_i18n33 = require("@wordpress/i18n");
|
|
2941
|
+
var ColumnGapField = () => {
|
|
2942
|
+
return /* @__PURE__ */ React57.createElement(StylesField, { bind: "column-gap" }, /* @__PURE__ */ React57.createElement(import_ui47.Grid, { container: true, gap: 2, alignItems: "center", flexWrap: "nowrap" }, /* @__PURE__ */ React57.createElement(import_ui47.Grid, { item: true, xs: 6 }, /* @__PURE__ */ React57.createElement(ControlLabel, null, (0, import_i18n33.__)("Column gap", "elementor"))), /* @__PURE__ */ React57.createElement(import_ui47.Grid, { item: true, xs: 6 }, /* @__PURE__ */ React57.createElement(import_editor_controls35.SizeControl, null))));
|
|
2943
|
+
};
|
|
2944
|
+
|
|
2945
|
+
// src/components/style-sections/typography-section/font-family-field.tsx
|
|
2946
|
+
var React58 = __toESM(require("react"));
|
|
2947
|
+
var import_editor_controls36 = require("@elementor/editor-controls");
|
|
2948
|
+
var import_ui48 = require("@elementor/ui");
|
|
2949
|
+
var import_i18n35 = require("@wordpress/i18n");
|
|
2931
2950
|
|
|
2932
2951
|
// src/components/style-sections/typography-section/hooks/use-font-families.ts
|
|
2933
2952
|
var import_react24 = require("react");
|
|
2934
|
-
var
|
|
2953
|
+
var import_i18n34 = require("@wordpress/i18n");
|
|
2935
2954
|
var supportedCategories = {
|
|
2936
|
-
system: (0,
|
|
2937
|
-
custom: (0,
|
|
2938
|
-
googlefonts: (0,
|
|
2955
|
+
system: (0, import_i18n34.__)("System", "elementor"),
|
|
2956
|
+
custom: (0, import_i18n34.__)("Custom Fonts", "elementor"),
|
|
2957
|
+
googlefonts: (0, import_i18n34.__)("Google Fonts", "elementor")
|
|
2939
2958
|
};
|
|
2940
2959
|
var getFontFamilies = () => {
|
|
2941
2960
|
const { controls } = getElementorConfig();
|
|
@@ -2972,188 +2991,188 @@ var FontFamilyField = () => {
|
|
|
2972
2991
|
if (fontFamilies.length === 0) {
|
|
2973
2992
|
return null;
|
|
2974
2993
|
}
|
|
2975
|
-
return /* @__PURE__ */
|
|
2994
|
+
return /* @__PURE__ */ React58.createElement(StylesField, { bind: "font-family" }, /* @__PURE__ */ React58.createElement(import_ui48.Grid, { container: true, gap: 2, alignItems: "center", flexWrap: "nowrap" }, /* @__PURE__ */ React58.createElement(import_ui48.Grid, { item: true, xs: 6 }, /* @__PURE__ */ React58.createElement(ControlLabel, null, (0, import_i18n35.__)("Font family", "elementor"))), /* @__PURE__ */ React58.createElement(import_ui48.Grid, { item: true, xs: 6, sx: { minWidth: 0 } }, /* @__PURE__ */ React58.createElement(import_editor_controls36.FontFamilyControl, { fontFamilies }))));
|
|
2976
2995
|
};
|
|
2977
2996
|
|
|
2978
2997
|
// src/components/style-sections/typography-section/font-size-field.tsx
|
|
2979
|
-
var
|
|
2980
|
-
var
|
|
2981
|
-
var
|
|
2982
|
-
var
|
|
2998
|
+
var React59 = __toESM(require("react"));
|
|
2999
|
+
var import_editor_controls37 = require("@elementor/editor-controls");
|
|
3000
|
+
var import_ui49 = require("@elementor/ui");
|
|
3001
|
+
var import_i18n36 = require("@wordpress/i18n");
|
|
2983
3002
|
var FontSizeField = () => {
|
|
2984
|
-
return /* @__PURE__ */
|
|
3003
|
+
return /* @__PURE__ */ React59.createElement(StylesField, { bind: "font-size" }, /* @__PURE__ */ React59.createElement(import_ui49.Grid, { container: true, gap: 2, alignItems: "center", flexWrap: "nowrap" }, /* @__PURE__ */ React59.createElement(import_ui49.Grid, { item: true, xs: 6 }, /* @__PURE__ */ React59.createElement(ControlLabel, null, (0, import_i18n36.__)("Font size", "elementor"))), /* @__PURE__ */ React59.createElement(import_ui49.Grid, { item: true, xs: 6 }, /* @__PURE__ */ React59.createElement(import_editor_controls37.SizeControl, null))));
|
|
2985
3004
|
};
|
|
2986
3005
|
|
|
2987
3006
|
// src/components/style-sections/typography-section/font-style-field.tsx
|
|
2988
|
-
var
|
|
2989
|
-
var
|
|
3007
|
+
var React60 = __toESM(require("react"));
|
|
3008
|
+
var import_editor_controls38 = require("@elementor/editor-controls");
|
|
2990
3009
|
var import_icons18 = require("@elementor/icons");
|
|
2991
|
-
var
|
|
2992
|
-
var
|
|
3010
|
+
var import_ui50 = require("@elementor/ui");
|
|
3011
|
+
var import_i18n37 = require("@wordpress/i18n");
|
|
2993
3012
|
var options7 = [
|
|
2994
3013
|
{
|
|
2995
3014
|
value: "normal",
|
|
2996
|
-
label: (0,
|
|
2997
|
-
renderContent: ({ size }) => /* @__PURE__ */
|
|
3015
|
+
label: (0, import_i18n37.__)("Normal", "elementor"),
|
|
3016
|
+
renderContent: ({ size }) => /* @__PURE__ */ React60.createElement(import_icons18.MinusIcon, { fontSize: size }),
|
|
2998
3017
|
showTooltip: true
|
|
2999
3018
|
},
|
|
3000
3019
|
{
|
|
3001
3020
|
value: "italic",
|
|
3002
|
-
label: (0,
|
|
3003
|
-
renderContent: ({ size }) => /* @__PURE__ */
|
|
3021
|
+
label: (0, import_i18n37.__)("Italic", "elementor"),
|
|
3022
|
+
renderContent: ({ size }) => /* @__PURE__ */ React60.createElement(import_icons18.ItalicIcon, { fontSize: size }),
|
|
3004
3023
|
showTooltip: true
|
|
3005
3024
|
}
|
|
3006
3025
|
];
|
|
3007
|
-
var FontStyleField = () => /* @__PURE__ */
|
|
3026
|
+
var FontStyleField = () => /* @__PURE__ */ React60.createElement(StylesField, { bind: "font-style" }, /* @__PURE__ */ React60.createElement(import_ui50.Grid, { container: true, gap: 2, alignItems: "center", flexWrap: "nowrap" }, /* @__PURE__ */ React60.createElement(import_ui50.Grid, { item: true, xs: 6 }, /* @__PURE__ */ React60.createElement(import_editor_controls38.ControlFormLabel, null, (0, import_i18n37.__)("Font style", "elementor"))), /* @__PURE__ */ React60.createElement(import_ui50.Grid, { item: true, xs: 6, display: "flex", justifyContent: "end" }, /* @__PURE__ */ React60.createElement(import_editor_controls38.ToggleControl, { options: options7 }))));
|
|
3008
3027
|
|
|
3009
3028
|
// src/components/style-sections/typography-section/font-weight-field.tsx
|
|
3010
|
-
var
|
|
3011
|
-
var
|
|
3012
|
-
var
|
|
3013
|
-
var
|
|
3029
|
+
var React61 = __toESM(require("react"));
|
|
3030
|
+
var import_editor_controls39 = require("@elementor/editor-controls");
|
|
3031
|
+
var import_ui51 = require("@elementor/ui");
|
|
3032
|
+
var import_i18n38 = require("@wordpress/i18n");
|
|
3014
3033
|
var fontWeightOptions = [
|
|
3015
|
-
{ value: "100", label: (0,
|
|
3016
|
-
{ value: "200", label: (0,
|
|
3017
|
-
{ value: "300", label: (0,
|
|
3018
|
-
{ value: "400", label: (0,
|
|
3019
|
-
{ value: "500", label: (0,
|
|
3020
|
-
{ value: "600", label: (0,
|
|
3021
|
-
{ value: "700", label: (0,
|
|
3022
|
-
{ value: "800", label: (0,
|
|
3023
|
-
{ value: "900", label: (0,
|
|
3034
|
+
{ value: "100", label: (0, import_i18n38.__)("100 - Thin", "elementor") },
|
|
3035
|
+
{ value: "200", label: (0, import_i18n38.__)("200 - Extra light", "elementor") },
|
|
3036
|
+
{ value: "300", label: (0, import_i18n38.__)("300 - Light", "elementor") },
|
|
3037
|
+
{ value: "400", label: (0, import_i18n38.__)("400 - Normal", "elementor") },
|
|
3038
|
+
{ value: "500", label: (0, import_i18n38.__)("500 - Medium", "elementor") },
|
|
3039
|
+
{ value: "600", label: (0, import_i18n38.__)("600 - Semi bold", "elementor") },
|
|
3040
|
+
{ value: "700", label: (0, import_i18n38.__)("700 - Bold", "elementor") },
|
|
3041
|
+
{ value: "800", label: (0, import_i18n38.__)("800 - Extra bold", "elementor") },
|
|
3042
|
+
{ value: "900", label: (0, import_i18n38.__)("900 - Black", "elementor") }
|
|
3024
3043
|
];
|
|
3025
3044
|
var FontWeightField = () => {
|
|
3026
|
-
return /* @__PURE__ */
|
|
3045
|
+
return /* @__PURE__ */ React61.createElement(StylesField, { bind: "font-weight" }, /* @__PURE__ */ React61.createElement(import_ui51.Grid, { container: true, gap: 2, alignItems: "center", flexWrap: "nowrap" }, /* @__PURE__ */ React61.createElement(import_ui51.Grid, { item: true, xs: 6 }, /* @__PURE__ */ React61.createElement(ControlLabel, null, (0, import_i18n38.__)("Font weight", "elementor"))), /* @__PURE__ */ React61.createElement(import_ui51.Grid, { item: true, xs: 6, sx: { overflow: "hidden" } }, /* @__PURE__ */ React61.createElement(import_editor_controls39.SelectControl, { options: fontWeightOptions }))));
|
|
3027
3046
|
};
|
|
3028
3047
|
|
|
3029
3048
|
// src/components/style-sections/typography-section/letter-spacing-field.tsx
|
|
3030
|
-
var
|
|
3031
|
-
var
|
|
3032
|
-
var
|
|
3033
|
-
var
|
|
3049
|
+
var React62 = __toESM(require("react"));
|
|
3050
|
+
var import_editor_controls40 = require("@elementor/editor-controls");
|
|
3051
|
+
var import_ui52 = require("@elementor/ui");
|
|
3052
|
+
var import_i18n39 = require("@wordpress/i18n");
|
|
3034
3053
|
var LetterSpacingField = () => {
|
|
3035
|
-
return /* @__PURE__ */
|
|
3054
|
+
return /* @__PURE__ */ React62.createElement(StylesField, { bind: "letter-spacing" }, /* @__PURE__ */ React62.createElement(import_ui52.Grid, { container: true, gap: 2, alignItems: "center", flexWrap: "nowrap" }, /* @__PURE__ */ React62.createElement(import_ui52.Grid, { item: true, xs: 6 }, /* @__PURE__ */ React62.createElement(ControlLabel, null, (0, import_i18n39.__)("Letter spacing", "elementor"))), /* @__PURE__ */ React62.createElement(import_ui52.Grid, { item: true, xs: 6 }, /* @__PURE__ */ React62.createElement(import_editor_controls40.SizeControl, null))));
|
|
3036
3055
|
};
|
|
3037
3056
|
|
|
3038
3057
|
// src/components/style-sections/typography-section/line-height-field.tsx
|
|
3039
|
-
var
|
|
3040
|
-
var
|
|
3041
|
-
var
|
|
3042
|
-
var
|
|
3058
|
+
var React63 = __toESM(require("react"));
|
|
3059
|
+
var import_editor_controls41 = require("@elementor/editor-controls");
|
|
3060
|
+
var import_ui53 = require("@elementor/ui");
|
|
3061
|
+
var import_i18n40 = require("@wordpress/i18n");
|
|
3043
3062
|
var LineHeightField = () => {
|
|
3044
|
-
return /* @__PURE__ */
|
|
3063
|
+
return /* @__PURE__ */ React63.createElement(StylesField, { bind: "line-height" }, /* @__PURE__ */ React63.createElement(import_ui53.Grid, { container: true, gap: 2, alignItems: "center", flexWrap: "nowrap" }, /* @__PURE__ */ React63.createElement(import_ui53.Grid, { item: true, xs: 6 }, /* @__PURE__ */ React63.createElement(ControlLabel, null, (0, import_i18n40.__)("Line height", "elementor"))), /* @__PURE__ */ React63.createElement(import_ui53.Grid, { item: true, xs: 6 }, /* @__PURE__ */ React63.createElement(import_editor_controls41.SizeControl, null))));
|
|
3045
3064
|
};
|
|
3046
3065
|
|
|
3047
3066
|
// src/components/style-sections/typography-section/text-alignment-field.tsx
|
|
3048
|
-
var
|
|
3049
|
-
var
|
|
3067
|
+
var React64 = __toESM(require("react"));
|
|
3068
|
+
var import_editor_controls42 = require("@elementor/editor-controls");
|
|
3050
3069
|
var import_icons19 = require("@elementor/icons");
|
|
3051
|
-
var
|
|
3052
|
-
var
|
|
3053
|
-
var AlignStartIcon = (0,
|
|
3054
|
-
var AlignEndIcon = (0,
|
|
3070
|
+
var import_ui54 = require("@elementor/ui");
|
|
3071
|
+
var import_i18n41 = require("@wordpress/i18n");
|
|
3072
|
+
var AlignStartIcon = (0, import_ui54.withDirection)(import_icons19.AlignLeftIcon);
|
|
3073
|
+
var AlignEndIcon = (0, import_ui54.withDirection)(import_icons19.AlignRightIcon);
|
|
3055
3074
|
var options8 = [
|
|
3056
3075
|
{
|
|
3057
3076
|
value: "start",
|
|
3058
|
-
label: (0,
|
|
3059
|
-
renderContent: ({ size }) => /* @__PURE__ */
|
|
3077
|
+
label: (0, import_i18n41.__)("Start", "elementor"),
|
|
3078
|
+
renderContent: ({ size }) => /* @__PURE__ */ React64.createElement(AlignStartIcon, { fontSize: size }),
|
|
3060
3079
|
showTooltip: true
|
|
3061
3080
|
},
|
|
3062
3081
|
{
|
|
3063
3082
|
value: "center",
|
|
3064
|
-
label: (0,
|
|
3065
|
-
renderContent: ({ size }) => /* @__PURE__ */
|
|
3083
|
+
label: (0, import_i18n41.__)("Center", "elementor"),
|
|
3084
|
+
renderContent: ({ size }) => /* @__PURE__ */ React64.createElement(import_icons19.AlignCenterIcon, { fontSize: size }),
|
|
3066
3085
|
showTooltip: true
|
|
3067
3086
|
},
|
|
3068
3087
|
{
|
|
3069
3088
|
value: "end",
|
|
3070
|
-
label: (0,
|
|
3071
|
-
renderContent: ({ size }) => /* @__PURE__ */
|
|
3089
|
+
label: (0, import_i18n41.__)("End", "elementor"),
|
|
3090
|
+
renderContent: ({ size }) => /* @__PURE__ */ React64.createElement(AlignEndIcon, { fontSize: size }),
|
|
3072
3091
|
showTooltip: true
|
|
3073
3092
|
},
|
|
3074
3093
|
{
|
|
3075
3094
|
value: "justify",
|
|
3076
|
-
label: (0,
|
|
3077
|
-
renderContent: ({ size }) => /* @__PURE__ */
|
|
3095
|
+
label: (0, import_i18n41.__)("Justify", "elementor"),
|
|
3096
|
+
renderContent: ({ size }) => /* @__PURE__ */ React64.createElement(import_icons19.AlignJustifiedIcon, { fontSize: size }),
|
|
3078
3097
|
showTooltip: true
|
|
3079
3098
|
}
|
|
3080
3099
|
];
|
|
3081
3100
|
var TextAlignmentField = () => {
|
|
3082
|
-
return /* @__PURE__ */
|
|
3101
|
+
return /* @__PURE__ */ React64.createElement(StylesField, { bind: "text-align" }, /* @__PURE__ */ React64.createElement(import_ui54.Grid, { container: true, gap: 2, alignItems: "center", flexWrap: "nowrap" }, /* @__PURE__ */ React64.createElement(import_ui54.Grid, { item: true, xs: 6 }, /* @__PURE__ */ React64.createElement(ControlLabel, null, (0, import_i18n41.__)("Text align", "elementor"))), /* @__PURE__ */ React64.createElement(import_ui54.Grid, { item: true, xs: 6, display: "flex", justifyContent: "end" }, /* @__PURE__ */ React64.createElement(import_editor_controls42.ToggleControl, { options: options8 }))));
|
|
3083
3102
|
};
|
|
3084
3103
|
|
|
3085
3104
|
// src/components/style-sections/typography-section/text-color-field.tsx
|
|
3086
|
-
var
|
|
3087
|
-
var
|
|
3088
|
-
var
|
|
3089
|
-
var
|
|
3105
|
+
var React65 = __toESM(require("react"));
|
|
3106
|
+
var import_editor_controls43 = require("@elementor/editor-controls");
|
|
3107
|
+
var import_ui55 = require("@elementor/ui");
|
|
3108
|
+
var import_i18n42 = require("@wordpress/i18n");
|
|
3090
3109
|
var TextColorField = () => {
|
|
3091
|
-
return /* @__PURE__ */
|
|
3110
|
+
return /* @__PURE__ */ React65.createElement(StylesField, { bind: "color" }, /* @__PURE__ */ React65.createElement(import_ui55.Grid, { container: true, gap: 2, alignItems: "center", flexWrap: "nowrap" }, /* @__PURE__ */ React65.createElement(import_ui55.Grid, { item: true, xs: 6 }, /* @__PURE__ */ React65.createElement(ControlLabel, null, (0, import_i18n42.__)("Text color", "elementor"))), /* @__PURE__ */ React65.createElement(import_ui55.Grid, { item: true, xs: 6 }, /* @__PURE__ */ React65.createElement(import_editor_controls43.ColorControl, null))));
|
|
3092
3111
|
};
|
|
3093
3112
|
|
|
3094
3113
|
// src/components/style-sections/typography-section/text-decoration-field.tsx
|
|
3095
|
-
var
|
|
3096
|
-
var
|
|
3114
|
+
var React66 = __toESM(require("react"));
|
|
3115
|
+
var import_editor_controls44 = require("@elementor/editor-controls");
|
|
3097
3116
|
var import_icons20 = require("@elementor/icons");
|
|
3098
|
-
var
|
|
3099
|
-
var
|
|
3117
|
+
var import_ui56 = require("@elementor/ui");
|
|
3118
|
+
var import_i18n43 = require("@wordpress/i18n");
|
|
3100
3119
|
var options9 = [
|
|
3101
3120
|
{
|
|
3102
3121
|
value: "none",
|
|
3103
|
-
label: (0,
|
|
3104
|
-
renderContent: ({ size }) => /* @__PURE__ */
|
|
3122
|
+
label: (0, import_i18n43.__)("None", "elementor"),
|
|
3123
|
+
renderContent: ({ size }) => /* @__PURE__ */ React66.createElement(import_icons20.MinusIcon, { fontSize: size }),
|
|
3105
3124
|
showTooltip: true,
|
|
3106
3125
|
exclusive: true
|
|
3107
3126
|
},
|
|
3108
3127
|
{
|
|
3109
3128
|
value: "underline",
|
|
3110
|
-
label: (0,
|
|
3111
|
-
renderContent: ({ size }) => /* @__PURE__ */
|
|
3129
|
+
label: (0, import_i18n43.__)("Underline", "elementor"),
|
|
3130
|
+
renderContent: ({ size }) => /* @__PURE__ */ React66.createElement(import_icons20.UnderlineIcon, { fontSize: size }),
|
|
3112
3131
|
showTooltip: true
|
|
3113
3132
|
},
|
|
3114
3133
|
{
|
|
3115
3134
|
value: "line-through",
|
|
3116
|
-
label: (0,
|
|
3117
|
-
renderContent: ({ size }) => /* @__PURE__ */
|
|
3135
|
+
label: (0, import_i18n43.__)("Line-through", "elementor"),
|
|
3136
|
+
renderContent: ({ size }) => /* @__PURE__ */ React66.createElement(import_icons20.StrikethroughIcon, { fontSize: size }),
|
|
3118
3137
|
showTooltip: true
|
|
3119
3138
|
},
|
|
3120
3139
|
{
|
|
3121
3140
|
value: "overline",
|
|
3122
|
-
label: (0,
|
|
3123
|
-
renderContent: ({ size }) => /* @__PURE__ */
|
|
3141
|
+
label: (0, import_i18n43.__)("Overline", "elementor"),
|
|
3142
|
+
renderContent: ({ size }) => /* @__PURE__ */ React66.createElement(import_icons20.OverlineIcon, { fontSize: size }),
|
|
3124
3143
|
showTooltip: true
|
|
3125
3144
|
}
|
|
3126
3145
|
];
|
|
3127
|
-
var TextDecorationField = () => /* @__PURE__ */
|
|
3146
|
+
var TextDecorationField = () => /* @__PURE__ */ React66.createElement(StylesField, { bind: "text-decoration" }, /* @__PURE__ */ React66.createElement(import_ui56.Grid, { container: true, gap: 2, alignItems: "center", flexWrap: "nowrap" }, /* @__PURE__ */ React66.createElement(import_ui56.Grid, { item: true, xs: 6 }, /* @__PURE__ */ React66.createElement(ControlLabel, null, (0, import_i18n43.__)("Line decoration", "elementor"))), /* @__PURE__ */ React66.createElement(import_ui56.Grid, { item: true, xs: 6, display: "flex", justifyContent: "end" }, /* @__PURE__ */ React66.createElement(import_editor_controls44.ToggleControl, { options: options9, exclusive: false }))));
|
|
3128
3147
|
|
|
3129
3148
|
// src/components/style-sections/typography-section/text-direction-field.tsx
|
|
3130
|
-
var
|
|
3131
|
-
var
|
|
3149
|
+
var React67 = __toESM(require("react"));
|
|
3150
|
+
var import_editor_controls45 = require("@elementor/editor-controls");
|
|
3132
3151
|
var import_icons21 = require("@elementor/icons");
|
|
3133
|
-
var
|
|
3134
|
-
var
|
|
3152
|
+
var import_ui57 = require("@elementor/ui");
|
|
3153
|
+
var import_i18n44 = require("@wordpress/i18n");
|
|
3135
3154
|
var options10 = [
|
|
3136
3155
|
{
|
|
3137
3156
|
value: "ltr",
|
|
3138
|
-
label: (0,
|
|
3139
|
-
renderContent: ({ size }) => /* @__PURE__ */
|
|
3157
|
+
label: (0, import_i18n44.__)("Left to right", "elementor"),
|
|
3158
|
+
renderContent: ({ size }) => /* @__PURE__ */ React67.createElement(import_icons21.TextDirectionLtrIcon, { fontSize: size }),
|
|
3140
3159
|
showTooltip: true
|
|
3141
3160
|
},
|
|
3142
3161
|
{
|
|
3143
3162
|
value: "rtl",
|
|
3144
|
-
label: (0,
|
|
3145
|
-
renderContent: ({ size }) => /* @__PURE__ */
|
|
3163
|
+
label: (0, import_i18n44.__)("Right to left", "elementor"),
|
|
3164
|
+
renderContent: ({ size }) => /* @__PURE__ */ React67.createElement(import_icons21.TextDirectionRtlIcon, { fontSize: size }),
|
|
3146
3165
|
showTooltip: true
|
|
3147
3166
|
}
|
|
3148
3167
|
];
|
|
3149
3168
|
var TextDirectionField = () => {
|
|
3150
|
-
return /* @__PURE__ */
|
|
3169
|
+
return /* @__PURE__ */ React67.createElement(StylesField, { bind: "direction" }, /* @__PURE__ */ React67.createElement(import_ui57.Grid, { container: true, gap: 2, alignItems: "center", flexWrap: "nowrap" }, /* @__PURE__ */ React67.createElement(import_ui57.Grid, { item: true, xs: 6 }, /* @__PURE__ */ React67.createElement(ControlLabel, null, (0, import_i18n44.__)("Direction", "elementor"))), /* @__PURE__ */ React67.createElement(import_ui57.Grid, { item: true, xs: 6, display: "flex", justifyContent: "end" }, /* @__PURE__ */ React67.createElement(import_editor_controls45.ToggleControl, { options: options10 }))));
|
|
3151
3170
|
};
|
|
3152
3171
|
|
|
3153
3172
|
// src/components/style-sections/typography-section/text-stroke-field.tsx
|
|
3154
|
-
var
|
|
3155
|
-
var
|
|
3156
|
-
var
|
|
3173
|
+
var React68 = __toESM(require("react"));
|
|
3174
|
+
var import_editor_controls46 = require("@elementor/editor-controls");
|
|
3175
|
+
var import_i18n45 = require("@wordpress/i18n");
|
|
3157
3176
|
var initTextStroke = {
|
|
3158
3177
|
$$type: "stroke",
|
|
3159
3178
|
value: {
|
|
@@ -3179,64 +3198,67 @@ var TextStrokeField = () => {
|
|
|
3179
3198
|
setTextStroke(null);
|
|
3180
3199
|
};
|
|
3181
3200
|
const hasTextStroke = Boolean(textStroke);
|
|
3182
|
-
return /* @__PURE__ */
|
|
3201
|
+
return /* @__PURE__ */ React68.createElement(StylesField, { bind: "stroke" }, /* @__PURE__ */ React68.createElement(
|
|
3183
3202
|
AddOrRemoveContent,
|
|
3184
3203
|
{
|
|
3185
|
-
label: (0,
|
|
3204
|
+
label: (0, import_i18n45.__)("Text stroke", "elementor"),
|
|
3186
3205
|
isAdded: hasTextStroke,
|
|
3187
3206
|
onAdd: addTextStroke,
|
|
3188
3207
|
onRemove: removeTextStroke
|
|
3189
3208
|
},
|
|
3190
|
-
/* @__PURE__ */
|
|
3209
|
+
/* @__PURE__ */ React68.createElement(import_editor_controls46.StrokeControl, null)
|
|
3191
3210
|
));
|
|
3192
3211
|
};
|
|
3193
3212
|
|
|
3194
3213
|
// src/components/style-sections/typography-section/transform-field.tsx
|
|
3195
|
-
var
|
|
3196
|
-
var
|
|
3214
|
+
var React69 = __toESM(require("react"));
|
|
3215
|
+
var import_editor_controls47 = require("@elementor/editor-controls");
|
|
3197
3216
|
var import_icons22 = require("@elementor/icons");
|
|
3198
|
-
var
|
|
3199
|
-
var
|
|
3217
|
+
var import_ui58 = require("@elementor/ui");
|
|
3218
|
+
var import_i18n46 = require("@wordpress/i18n");
|
|
3200
3219
|
var options11 = [
|
|
3201
3220
|
{
|
|
3202
3221
|
value: "none",
|
|
3203
|
-
label: (0,
|
|
3204
|
-
renderContent: ({ size }) => /* @__PURE__ */
|
|
3222
|
+
label: (0, import_i18n46.__)("None", "elementor"),
|
|
3223
|
+
renderContent: ({ size }) => /* @__PURE__ */ React69.createElement(import_icons22.MinusIcon, { fontSize: size }),
|
|
3205
3224
|
showTooltip: true
|
|
3206
3225
|
},
|
|
3207
3226
|
{
|
|
3208
3227
|
value: "capitalize",
|
|
3209
|
-
label: (0,
|
|
3210
|
-
renderContent: ({ size }) => /* @__PURE__ */
|
|
3228
|
+
label: (0, import_i18n46.__)("Capitalize", "elementor"),
|
|
3229
|
+
renderContent: ({ size }) => /* @__PURE__ */ React69.createElement(import_icons22.LetterCaseIcon, { fontSize: size }),
|
|
3211
3230
|
showTooltip: true
|
|
3212
3231
|
},
|
|
3213
3232
|
{
|
|
3214
3233
|
value: "uppercase",
|
|
3215
|
-
label: (0,
|
|
3216
|
-
renderContent: ({ size }) => /* @__PURE__ */
|
|
3234
|
+
label: (0, import_i18n46.__)("Uppercase", "elementor"),
|
|
3235
|
+
renderContent: ({ size }) => /* @__PURE__ */ React69.createElement(import_icons22.LetterCaseUpperIcon, { fontSize: size }),
|
|
3217
3236
|
showTooltip: true
|
|
3218
3237
|
},
|
|
3219
3238
|
{
|
|
3220
3239
|
value: "lowercase",
|
|
3221
|
-
label: (0,
|
|
3222
|
-
renderContent: ({ size }) => /* @__PURE__ */
|
|
3240
|
+
label: (0, import_i18n46.__)("Lowercase", "elementor"),
|
|
3241
|
+
renderContent: ({ size }) => /* @__PURE__ */ React69.createElement(import_icons22.LetterCaseLowerIcon, { fontSize: size }),
|
|
3223
3242
|
showTooltip: true
|
|
3224
3243
|
}
|
|
3225
3244
|
];
|
|
3226
|
-
var TransformField = () => /* @__PURE__ */
|
|
3245
|
+
var TransformField = () => /* @__PURE__ */ React69.createElement(StylesField, { bind: "text-transform" }, /* @__PURE__ */ React69.createElement(import_ui58.Grid, { container: true, gap: 2, alignItems: "center", flexWrap: "nowrap" }, /* @__PURE__ */ React69.createElement(import_ui58.Grid, { item: true, xs: 6 }, /* @__PURE__ */ React69.createElement(ControlLabel, null, (0, import_i18n46.__)("Text transform", "elementor"))), /* @__PURE__ */ React69.createElement(import_ui58.Grid, { item: true, xs: 6, display: "flex", justifyContent: "end" }, /* @__PURE__ */ React69.createElement(import_editor_controls47.ToggleControl, { options: options11 }))));
|
|
3227
3246
|
|
|
3228
3247
|
// src/components/style-sections/typography-section/word-spacing-field.tsx
|
|
3229
|
-
var
|
|
3230
|
-
var
|
|
3231
|
-
var
|
|
3232
|
-
var
|
|
3248
|
+
var React70 = __toESM(require("react"));
|
|
3249
|
+
var import_editor_controls48 = require("@elementor/editor-controls");
|
|
3250
|
+
var import_ui59 = require("@elementor/ui");
|
|
3251
|
+
var import_i18n47 = require("@wordpress/i18n");
|
|
3233
3252
|
var WordSpacingField = () => {
|
|
3234
|
-
return /* @__PURE__ */
|
|
3253
|
+
return /* @__PURE__ */ React70.createElement(StylesField, { bind: "word-spacing" }, /* @__PURE__ */ React70.createElement(import_ui59.Grid, { container: true, gap: 2, alignItems: "center", flexWrap: "nowrap" }, /* @__PURE__ */ React70.createElement(import_ui59.Grid, { item: true, xs: 6 }, /* @__PURE__ */ React70.createElement(ControlLabel, null, (0, import_i18n47.__)("Word spacing", "elementor"))), /* @__PURE__ */ React70.createElement(import_ui59.Grid, { item: true, xs: 6 }, /* @__PURE__ */ React70.createElement(import_editor_controls48.SizeControl, null))));
|
|
3235
3254
|
};
|
|
3236
3255
|
|
|
3237
3256
|
// src/components/style-sections/typography-section/typography-section.tsx
|
|
3238
3257
|
var TypographySection = () => {
|
|
3239
|
-
|
|
3258
|
+
const [columnCount] = useStylesField("column-count");
|
|
3259
|
+
const isVersion330Active = (0, import_editor_v1_adapters8.isExperimentActive)("e_v_3_30");
|
|
3260
|
+
const hasMultiColumns = columnCount?.value && columnCount?.value > 1;
|
|
3261
|
+
return /* @__PURE__ */ React71.createElement(SectionContent, null, /* @__PURE__ */ React71.createElement(FontFamilyField, null), /* @__PURE__ */ React71.createElement(FontWeightField, null), /* @__PURE__ */ React71.createElement(FontSizeField, null), /* @__PURE__ */ React71.createElement(PanelDivider, null), /* @__PURE__ */ React71.createElement(TextAlignmentField, null), /* @__PURE__ */ React71.createElement(TextColorField, null), /* @__PURE__ */ React71.createElement(CollapsibleContent, null, /* @__PURE__ */ React71.createElement(SectionContent, { sx: { pt: 2 } }, /* @__PURE__ */ React71.createElement(LineHeightField, null), /* @__PURE__ */ React71.createElement(LetterSpacingField, null), /* @__PURE__ */ React71.createElement(WordSpacingField, null), isVersion330Active && /* @__PURE__ */ React71.createElement(React71.Fragment, null, /* @__PURE__ */ React71.createElement(ColumnCountField, null), hasMultiColumns && /* @__PURE__ */ React71.createElement(ColumnGapField, null)), /* @__PURE__ */ React71.createElement(PanelDivider, null), /* @__PURE__ */ React71.createElement(TextDecorationField, null), /* @__PURE__ */ React71.createElement(TransformField, null), /* @__PURE__ */ React71.createElement(TextDirectionField, null), /* @__PURE__ */ React71.createElement(FontStyleField, null), /* @__PURE__ */ React71.createElement(TextStrokeField, null))));
|
|
3240
3262
|
};
|
|
3241
3263
|
|
|
3242
3264
|
// src/components/style-tab.tsx
|
|
@@ -3253,7 +3275,7 @@ var StyleTab = () => {
|
|
|
3253
3275
|
const [activeStyleDefId, setActiveStyleDefId] = useActiveStyleDefId(currentClassesProp);
|
|
3254
3276
|
const [activeStyleState, setActiveStyleState] = (0, import_react25.useState)(null);
|
|
3255
3277
|
const breakpoint = (0, import_editor_responsive2.useActiveBreakpoint)();
|
|
3256
|
-
return /* @__PURE__ */
|
|
3278
|
+
return /* @__PURE__ */ React72.createElement(ClassesPropProvider, { prop: currentClassesProp }, /* @__PURE__ */ React72.createElement(
|
|
3257
3279
|
StyleProvider,
|
|
3258
3280
|
{
|
|
3259
3281
|
meta: { breakpoint, state: activeStyleState },
|
|
@@ -3264,12 +3286,12 @@ var StyleTab = () => {
|
|
|
3264
3286
|
},
|
|
3265
3287
|
setMetaState: setActiveStyleState
|
|
3266
3288
|
},
|
|
3267
|
-
/* @__PURE__ */
|
|
3289
|
+
/* @__PURE__ */ React72.createElement(import_session4.SessionStorageProvider, { prefix: activeStyleDefId ?? "" }, /* @__PURE__ */ React72.createElement(StyleInheritanceProvider, null, /* @__PURE__ */ React72.createElement(ClassesHeader, null, /* @__PURE__ */ React72.createElement(CssClassSelector, null), /* @__PURE__ */ React72.createElement(import_ui60.Divider, null)), /* @__PURE__ */ React72.createElement(SectionsList, null, /* @__PURE__ */ React72.createElement(Section, { title: (0, import_i18n48.__)("Layout", "elementor") }, /* @__PURE__ */ React72.createElement(LayoutSection, null)), /* @__PURE__ */ React72.createElement(Section, { title: (0, import_i18n48.__)("Spacing", "elementor") }, /* @__PURE__ */ React72.createElement(SpacingSection, null)), /* @__PURE__ */ React72.createElement(Section, { title: (0, import_i18n48.__)("Size", "elementor") }, /* @__PURE__ */ React72.createElement(SizeSection, null)), /* @__PURE__ */ React72.createElement(Section, { title: (0, import_i18n48.__)("Position", "elementor") }, /* @__PURE__ */ React72.createElement(PositionSection, null)), /* @__PURE__ */ React72.createElement(Section, { title: (0, import_i18n48.__)("Typography", "elementor") }, /* @__PURE__ */ React72.createElement(TypographySection, null)), /* @__PURE__ */ React72.createElement(Section, { title: (0, import_i18n48.__)("Background", "elementor") }, /* @__PURE__ */ React72.createElement(BackgroundSection, null)), /* @__PURE__ */ React72.createElement(Section, { title: (0, import_i18n48.__)("Border", "elementor") }, /* @__PURE__ */ React72.createElement(BorderSection, null)), /* @__PURE__ */ React72.createElement(Section, { title: (0, import_i18n48.__)("Effects", "elementor") }, /* @__PURE__ */ React72.createElement(EffectsSection, null)))))
|
|
3268
3290
|
));
|
|
3269
3291
|
};
|
|
3270
3292
|
function ClassesHeader({ children }) {
|
|
3271
3293
|
const scrollDirection = useScrollDirection();
|
|
3272
|
-
return /* @__PURE__ */
|
|
3294
|
+
return /* @__PURE__ */ React72.createElement(import_ui60.Stack, { sx: { ...stickyHeaderStyles, top: scrollDirection === "up" ? TABS_HEADER_HEIGHT : 0 } }, children);
|
|
3273
3295
|
}
|
|
3274
3296
|
function useCurrentClassesProp() {
|
|
3275
3297
|
const { elementType } = useElement();
|
|
@@ -3288,15 +3310,15 @@ var EditingPanelTabs = () => {
|
|
|
3288
3310
|
return (
|
|
3289
3311
|
// When switching between elements, the local states should be reset. We are using key to rerender the tabs.
|
|
3290
3312
|
// Reference: https://react.dev/learn/preserving-and-resetting-state#resetting-a-form-with-a-key
|
|
3291
|
-
/* @__PURE__ */
|
|
3313
|
+
/* @__PURE__ */ React73.createElement(import_react26.Fragment, { key: element.id }, /* @__PURE__ */ React73.createElement(PanelTabContent, null))
|
|
3292
3314
|
);
|
|
3293
3315
|
};
|
|
3294
3316
|
var PanelTabContent = () => {
|
|
3295
3317
|
const defaultComponentTab = "settings";
|
|
3296
3318
|
const [currentTab, setCurrentTab] = useStateByElement("tab", defaultComponentTab);
|
|
3297
|
-
const { getTabProps, getTabPanelProps, getTabsProps } = (0,
|
|
3298
|
-
return /* @__PURE__ */
|
|
3299
|
-
|
|
3319
|
+
const { getTabProps, getTabPanelProps, getTabsProps } = (0, import_ui61.useTabs)(currentTab);
|
|
3320
|
+
return /* @__PURE__ */ React73.createElement(ScrollProvider, null, /* @__PURE__ */ React73.createElement(import_ui61.Stack, { direction: "column", sx: { width: "100%" } }, /* @__PURE__ */ React73.createElement(import_ui61.Stack, { sx: { ...stickyHeaderStyles, top: 0 } }, /* @__PURE__ */ React73.createElement(
|
|
3321
|
+
import_ui61.Tabs,
|
|
3300
3322
|
{
|
|
3301
3323
|
variant: "fullWidth",
|
|
3302
3324
|
size: "small",
|
|
@@ -3307,9 +3329,9 @@ var PanelTabContent = () => {
|
|
|
3307
3329
|
setCurrentTab(newValue);
|
|
3308
3330
|
}
|
|
3309
3331
|
},
|
|
3310
|
-
/* @__PURE__ */
|
|
3311
|
-
/* @__PURE__ */
|
|
3312
|
-
), /* @__PURE__ */
|
|
3332
|
+
/* @__PURE__ */ React73.createElement(import_ui61.Tab, { label: (0, import_i18n49.__)("General", "elementor"), ...getTabProps("settings") }),
|
|
3333
|
+
/* @__PURE__ */ React73.createElement(import_ui61.Tab, { label: (0, import_i18n49.__)("Style", "elementor"), ...getTabProps("style") })
|
|
3334
|
+
), /* @__PURE__ */ React73.createElement(import_ui61.Divider, null)), /* @__PURE__ */ React73.createElement(import_ui61.TabPanel, { ...getTabPanelProps("settings"), disablePadding: true }, /* @__PURE__ */ React73.createElement(SettingsTab, null)), /* @__PURE__ */ React73.createElement(import_ui61.TabPanel, { ...getTabPanelProps("style"), disablePadding: true }, /* @__PURE__ */ React73.createElement(StyleTab, null))));
|
|
3313
3335
|
};
|
|
3314
3336
|
|
|
3315
3337
|
// src/components/editing-panel.tsx
|
|
@@ -3321,8 +3343,8 @@ var EditingPanel = () => {
|
|
|
3321
3343
|
if (!element || !elementType) {
|
|
3322
3344
|
return null;
|
|
3323
3345
|
}
|
|
3324
|
-
const panelTitle = (0,
|
|
3325
|
-
return /* @__PURE__ */
|
|
3346
|
+
const panelTitle = (0, import_i18n50.__)("Edit %s", "elementor").replace("%s", elementType.title);
|
|
3347
|
+
return /* @__PURE__ */ React74.createElement(import_ui62.ErrorBoundary, { fallback: /* @__PURE__ */ React74.createElement(EditorPanelErrorFallback, null) }, /* @__PURE__ */ React74.createElement(import_session5.SessionStorageProvider, { prefix: "elementor" }, /* @__PURE__ */ React74.createElement(import_editor_ui4.ThemeProvider, null, /* @__PURE__ */ React74.createElement(import_editor_panels.Panel, null, /* @__PURE__ */ React74.createElement(import_editor_panels.PanelHeader, null, /* @__PURE__ */ React74.createElement(import_editor_panels.PanelHeaderTitle, null, panelTitle), /* @__PURE__ */ React74.createElement(import_icons23.AtomIcon, { fontSize: "small", sx: { color: "text.tertiary" } })), /* @__PURE__ */ React74.createElement(import_editor_panels.PanelBody, null, /* @__PURE__ */ React74.createElement(import_editor_controls49.ControlActionsProvider, { items: menuItems }, /* @__PURE__ */ React74.createElement(import_editor_controls49.ControlReplacementsProvider, { replacements: controlReplacements }, /* @__PURE__ */ React74.createElement(ElementProvider, { element, elementType }, /* @__PURE__ */ React74.createElement(EditingPanelTabs, null)))))))));
|
|
3326
3348
|
};
|
|
3327
3349
|
|
|
3328
3350
|
// src/panel.ts
|
|
@@ -3335,11 +3357,11 @@ var { panel, usePanelActions, usePanelStatus } = (0, import_editor_panels2.__cre
|
|
|
3335
3357
|
var import_editor = require("@elementor/editor");
|
|
3336
3358
|
var import_editor_current_user = require("@elementor/editor-current-user");
|
|
3337
3359
|
var import_editor_panels3 = require("@elementor/editor-panels");
|
|
3338
|
-
var
|
|
3360
|
+
var import_editor_v1_adapters10 = require("@elementor/editor-v1-adapters");
|
|
3339
3361
|
|
|
3340
3362
|
// src/hooks/use-open-editor-panel.ts
|
|
3341
3363
|
var import_react27 = require("react");
|
|
3342
|
-
var
|
|
3364
|
+
var import_editor_v1_adapters9 = require("@elementor/editor-v1-adapters");
|
|
3343
3365
|
|
|
3344
3366
|
// src/sync/is-atomic-widget-selected.ts
|
|
3345
3367
|
var import_editor_elements9 = require("@elementor/editor-elements");
|
|
@@ -3356,7 +3378,7 @@ var isAtomicWidgetSelected = () => {
|
|
|
3356
3378
|
var useOpenEditorPanel = () => {
|
|
3357
3379
|
const { open } = usePanelActions();
|
|
3358
3380
|
(0, import_react27.useEffect)(() => {
|
|
3359
|
-
return (0,
|
|
3381
|
+
return (0, import_editor_v1_adapters9.__privateListenTo)((0, import_editor_v1_adapters9.commandStartEvent)("panel/editor/open"), () => {
|
|
3360
3382
|
if (isAtomicWidgetSelected()) {
|
|
3361
3383
|
open();
|
|
3362
3384
|
}
|
|
@@ -3374,16 +3396,16 @@ var EditingPanelHooks = () => {
|
|
|
3374
3396
|
var import_editor_canvas3 = require("@elementor/editor-canvas");
|
|
3375
3397
|
|
|
3376
3398
|
// src/dynamics/components/dynamic-selection-control.tsx
|
|
3377
|
-
var
|
|
3378
|
-
var
|
|
3399
|
+
var React78 = __toESM(require("react"));
|
|
3400
|
+
var import_editor_controls53 = require("@elementor/editor-controls");
|
|
3379
3401
|
var import_icons25 = require("@elementor/icons");
|
|
3380
|
-
var
|
|
3381
|
-
var
|
|
3402
|
+
var import_ui65 = require("@elementor/ui");
|
|
3403
|
+
var import_i18n52 = require("@wordpress/i18n");
|
|
3382
3404
|
|
|
3383
3405
|
// src/components/popover-content.tsx
|
|
3384
|
-
var
|
|
3385
|
-
var
|
|
3386
|
-
var PopoverContent = ({ alignItems, gap = 1.5, p, children }) => /* @__PURE__ */
|
|
3406
|
+
var React75 = __toESM(require("react"));
|
|
3407
|
+
var import_ui63 = require("@elementor/ui");
|
|
3408
|
+
var PopoverContent = ({ alignItems, gap = 1.5, p, children }) => /* @__PURE__ */ React75.createElement(import_ui63.Stack, { alignItems, gap, p }, children);
|
|
3387
3409
|
|
|
3388
3410
|
// src/hooks/use-persist-dynamic-value.ts
|
|
3389
3411
|
var import_session6 = require("@elementor/session");
|
|
@@ -3394,15 +3416,15 @@ var usePersistDynamicValue = (propKey) => {
|
|
|
3394
3416
|
};
|
|
3395
3417
|
|
|
3396
3418
|
// src/dynamics/dynamic-control.tsx
|
|
3397
|
-
var
|
|
3398
|
-
var
|
|
3419
|
+
var React76 = __toESM(require("react"));
|
|
3420
|
+
var import_editor_controls51 = require("@elementor/editor-controls");
|
|
3399
3421
|
|
|
3400
3422
|
// src/dynamics/hooks/use-dynamic-tag.ts
|
|
3401
3423
|
var import_react29 = require("react");
|
|
3402
3424
|
|
|
3403
3425
|
// src/dynamics/hooks/use-prop-dynamic-tags.ts
|
|
3404
3426
|
var import_react28 = require("react");
|
|
3405
|
-
var
|
|
3427
|
+
var import_editor_controls50 = require("@elementor/editor-controls");
|
|
3406
3428
|
|
|
3407
3429
|
// src/dynamics/sync/get-elementor-config.ts
|
|
3408
3430
|
var getElementorConfig2 = () => {
|
|
@@ -3448,7 +3470,7 @@ var dynamicPropTypeUtil = (0, import_editor_props8.createPropUtils)(
|
|
|
3448
3470
|
// src/dynamics/hooks/use-prop-dynamic-tags.ts
|
|
3449
3471
|
var usePropDynamicTags = () => {
|
|
3450
3472
|
let categories = [];
|
|
3451
|
-
const { propType } = (0,
|
|
3473
|
+
const { propType } = (0, import_editor_controls50.useBoundProp)();
|
|
3452
3474
|
if (propType) {
|
|
3453
3475
|
const propDynamicType = getDynamicPropType(propType);
|
|
3454
3476
|
categories = propDynamicType?.settings.categories || [];
|
|
@@ -3474,7 +3496,7 @@ var useDynamicTag = (tagName) => {
|
|
|
3474
3496
|
|
|
3475
3497
|
// src/dynamics/dynamic-control.tsx
|
|
3476
3498
|
var DynamicControl = ({ bind, children }) => {
|
|
3477
|
-
const { value, setValue } = (0,
|
|
3499
|
+
const { value, setValue } = (0, import_editor_controls51.useBoundProp)(dynamicPropTypeUtil);
|
|
3478
3500
|
const { name = "", settings } = value ?? {};
|
|
3479
3501
|
const dynamicTag = useDynamicTag(name);
|
|
3480
3502
|
if (!dynamicTag) {
|
|
@@ -3493,22 +3515,22 @@ var DynamicControl = ({ bind, children }) => {
|
|
|
3493
3515
|
});
|
|
3494
3516
|
};
|
|
3495
3517
|
const propType = createTopLevelOjectType({ schema: dynamicTag.props_schema });
|
|
3496
|
-
return /* @__PURE__ */
|
|
3518
|
+
return /* @__PURE__ */ React76.createElement(import_editor_controls51.PropProvider, { propType, setValue: setDynamicValue, value: { [bind]: dynamicValue } }, /* @__PURE__ */ React76.createElement(import_editor_controls51.PropKeyProvider, { bind }, children));
|
|
3497
3519
|
};
|
|
3498
3520
|
|
|
3499
3521
|
// src/dynamics/components/dynamic-selection.tsx
|
|
3500
|
-
var
|
|
3522
|
+
var React77 = __toESM(require("react"));
|
|
3501
3523
|
var import_react30 = require("react");
|
|
3502
|
-
var
|
|
3524
|
+
var import_editor_controls52 = require("@elementor/editor-controls");
|
|
3503
3525
|
var import_icons24 = require("@elementor/icons");
|
|
3504
|
-
var
|
|
3505
|
-
var
|
|
3526
|
+
var import_ui64 = require("@elementor/ui");
|
|
3527
|
+
var import_i18n51 = require("@wordpress/i18n");
|
|
3506
3528
|
var SIZE3 = "tiny";
|
|
3507
3529
|
var DynamicSelection = ({ onSelect }) => {
|
|
3508
3530
|
const [searchValue, setSearchValue] = (0, import_react30.useState)("");
|
|
3509
3531
|
const { groups: dynamicGroups } = getAtomicDynamicTags() || {};
|
|
3510
|
-
const { value: anyValue } = (0,
|
|
3511
|
-
const { bind, value: dynamicValue, setValue } = (0,
|
|
3532
|
+
const { value: anyValue } = (0, import_editor_controls52.useBoundProp)();
|
|
3533
|
+
const { bind, value: dynamicValue, setValue } = (0, import_editor_controls52.useBoundProp)(dynamicPropTypeUtil);
|
|
3512
3534
|
const [, updatePropValueHistory] = usePersistDynamicValue(bind);
|
|
3513
3535
|
const isCurrentValueDynamic = !!dynamicValue;
|
|
3514
3536
|
const options12 = useFilteredOptions(searchValue);
|
|
@@ -3523,28 +3545,28 @@ var DynamicSelection = ({ onSelect }) => {
|
|
|
3523
3545
|
setValue({ name: value, settings: { label } });
|
|
3524
3546
|
onSelect?.();
|
|
3525
3547
|
};
|
|
3526
|
-
return /* @__PURE__ */
|
|
3527
|
-
|
|
3548
|
+
return /* @__PURE__ */ React77.createElement(import_ui64.Stack, null, hasNoDynamicTags ? /* @__PURE__ */ React77.createElement(NoDynamicTags, null) : /* @__PURE__ */ React77.createElement(import_react30.Fragment, null, /* @__PURE__ */ React77.createElement(import_ui64.Box, { px: 1.5, pb: 1 }, /* @__PURE__ */ React77.createElement(
|
|
3549
|
+
import_ui64.TextField,
|
|
3528
3550
|
{
|
|
3529
3551
|
fullWidth: true,
|
|
3530
3552
|
size: SIZE3,
|
|
3531
3553
|
value: searchValue,
|
|
3532
3554
|
onChange: handleSearch,
|
|
3533
|
-
placeholder: (0,
|
|
3555
|
+
placeholder: (0, import_i18n51.__)("Search dynamic tags\u2026", "elementor"),
|
|
3534
3556
|
InputProps: {
|
|
3535
|
-
startAdornment: /* @__PURE__ */
|
|
3557
|
+
startAdornment: /* @__PURE__ */ React77.createElement(import_ui64.InputAdornment, { position: "start" }, /* @__PURE__ */ React77.createElement(import_icons24.SearchIcon, { fontSize: SIZE3 }))
|
|
3536
3558
|
}
|
|
3537
3559
|
}
|
|
3538
|
-
)), /* @__PURE__ */
|
|
3539
|
-
|
|
3560
|
+
)), /* @__PURE__ */ React77.createElement(import_ui64.Divider, null), /* @__PURE__ */ React77.createElement(import_ui64.Box, { sx: { overflowY: "auto", height: 260, width: 220 } }, options12.length > 0 ? /* @__PURE__ */ React77.createElement(import_ui64.MenuList, { role: "listbox", tabIndex: 0 }, options12.map(([category, items3], index) => /* @__PURE__ */ React77.createElement(import_react30.Fragment, { key: index }, /* @__PURE__ */ React77.createElement(
|
|
3561
|
+
import_ui64.MenuSubheader,
|
|
3540
3562
|
{
|
|
3541
3563
|
sx: { px: 1.5, typography: "caption", color: "text.tertiary" }
|
|
3542
3564
|
},
|
|
3543
3565
|
dynamicGroups?.[category]?.title || category
|
|
3544
3566
|
), items3.map(({ value, label: tagLabel }) => {
|
|
3545
3567
|
const isSelected = isCurrentValueDynamic && value === dynamicValue?.name;
|
|
3546
|
-
return /* @__PURE__ */
|
|
3547
|
-
|
|
3568
|
+
return /* @__PURE__ */ React77.createElement(
|
|
3569
|
+
import_ui64.MenuItem,
|
|
3548
3570
|
{
|
|
3549
3571
|
key: value,
|
|
3550
3572
|
selected: isSelected,
|
|
@@ -3554,10 +3576,10 @@ var DynamicSelection = ({ onSelect }) => {
|
|
|
3554
3576
|
},
|
|
3555
3577
|
tagLabel
|
|
3556
3578
|
);
|
|
3557
|
-
})))) : /* @__PURE__ */
|
|
3579
|
+
})))) : /* @__PURE__ */ React77.createElement(NoResults, { searchValue, onClear: () => setSearchValue("") }))));
|
|
3558
3580
|
};
|
|
3559
|
-
var NoResults = ({ searchValue, onClear }) => /* @__PURE__ */
|
|
3560
|
-
|
|
3581
|
+
var NoResults = ({ searchValue, onClear }) => /* @__PURE__ */ React77.createElement(
|
|
3582
|
+
import_ui64.Stack,
|
|
3561
3583
|
{
|
|
3562
3584
|
gap: 1,
|
|
3563
3585
|
alignItems: "center",
|
|
@@ -3567,12 +3589,12 @@ var NoResults = ({ searchValue, onClear }) => /* @__PURE__ */ React75.createElem
|
|
|
3567
3589
|
color: "text.secondary",
|
|
3568
3590
|
sx: { pb: 3.5 }
|
|
3569
3591
|
},
|
|
3570
|
-
/* @__PURE__ */
|
|
3571
|
-
/* @__PURE__ */
|
|
3572
|
-
/* @__PURE__ */
|
|
3592
|
+
/* @__PURE__ */ React77.createElement(import_icons24.DatabaseIcon, { fontSize: "large" }),
|
|
3593
|
+
/* @__PURE__ */ React77.createElement(import_ui64.Typography, { align: "center", variant: "subtitle2" }, (0, import_i18n51.__)("Sorry, nothing matched", "elementor"), /* @__PURE__ */ React77.createElement("br", null), "\u201C", searchValue, "\u201D."),
|
|
3594
|
+
/* @__PURE__ */ React77.createElement(import_ui64.Typography, { align: "center", variant: "caption" }, (0, import_i18n51.__)("Try something else.", "elementor"), "\xA0", /* @__PURE__ */ React77.createElement(import_ui64.Link, { color: "text.secondary", variant: "caption", component: "button", onClick: onClear }, (0, import_i18n51.__)("Clear & try again", "elementor")))
|
|
3573
3595
|
);
|
|
3574
|
-
var NoDynamicTags = () => /* @__PURE__ */
|
|
3575
|
-
|
|
3596
|
+
var NoDynamicTags = () => /* @__PURE__ */ React77.createElement(import_ui64.Box, { sx: { overflowY: "hidden", height: 297, width: 220 } }, /* @__PURE__ */ React77.createElement(import_ui64.Divider, null), /* @__PURE__ */ React77.createElement(
|
|
3597
|
+
import_ui64.Stack,
|
|
3576
3598
|
{
|
|
3577
3599
|
gap: 1,
|
|
3578
3600
|
alignItems: "center",
|
|
@@ -3582,9 +3604,9 @@ var NoDynamicTags = () => /* @__PURE__ */ React75.createElement(import_ui62.Box,
|
|
|
3582
3604
|
color: "text.secondary",
|
|
3583
3605
|
sx: { pb: 3.5 }
|
|
3584
3606
|
},
|
|
3585
|
-
/* @__PURE__ */
|
|
3586
|
-
/* @__PURE__ */
|
|
3587
|
-
/* @__PURE__ */
|
|
3607
|
+
/* @__PURE__ */ React77.createElement(import_icons24.DatabaseIcon, { fontSize: "large" }),
|
|
3608
|
+
/* @__PURE__ */ React77.createElement(import_ui64.Typography, { align: "center", variant: "subtitle2" }, (0, import_i18n51.__)("Streamline your workflow with dynamic tags", "elementor")),
|
|
3609
|
+
/* @__PURE__ */ React77.createElement(import_ui64.Typography, { align: "center", variant: "caption" }, (0, import_i18n51.__)("You\u2019ll need Elementor Pro to use this feature.", "elementor"))
|
|
3588
3610
|
));
|
|
3589
3611
|
var useFilteredOptions = (searchValue) => {
|
|
3590
3612
|
const dynamicTags = usePropDynamicTags();
|
|
@@ -3605,10 +3627,10 @@ var useFilteredOptions = (searchValue) => {
|
|
|
3605
3627
|
// src/dynamics/components/dynamic-selection-control.tsx
|
|
3606
3628
|
var SIZE4 = "tiny";
|
|
3607
3629
|
var DynamicSelectionControl = () => {
|
|
3608
|
-
const { setValue: setAnyValue } = (0,
|
|
3609
|
-
const { bind, value } = (0,
|
|
3630
|
+
const { setValue: setAnyValue } = (0, import_editor_controls53.useBoundProp)();
|
|
3631
|
+
const { bind, value } = (0, import_editor_controls53.useBoundProp)(dynamicPropTypeUtil);
|
|
3610
3632
|
const [propValueFromHistory] = usePersistDynamicValue(bind);
|
|
3611
|
-
const selectionPopoverState = (0,
|
|
3633
|
+
const selectionPopoverState = (0, import_ui65.usePopupState)({ variant: "popover" });
|
|
3612
3634
|
const { name: tagName = "" } = value;
|
|
3613
3635
|
const dynamicTag = useDynamicTag(tagName);
|
|
3614
3636
|
const removeDynamicTag = () => {
|
|
@@ -3617,62 +3639,62 @@ var DynamicSelectionControl = () => {
|
|
|
3617
3639
|
if (!dynamicTag) {
|
|
3618
3640
|
throw new Error(`Dynamic tag ${tagName} not found`);
|
|
3619
3641
|
}
|
|
3620
|
-
return /* @__PURE__ */
|
|
3621
|
-
|
|
3642
|
+
return /* @__PURE__ */ React78.createElement(import_ui65.Box, null, /* @__PURE__ */ React78.createElement(
|
|
3643
|
+
import_ui65.UnstableTag,
|
|
3622
3644
|
{
|
|
3623
3645
|
fullWidth: true,
|
|
3624
3646
|
showActionsOnHover: true,
|
|
3625
3647
|
label: dynamicTag.label,
|
|
3626
|
-
startIcon: /* @__PURE__ */
|
|
3627
|
-
...(0,
|
|
3628
|
-
actions: /* @__PURE__ */
|
|
3629
|
-
|
|
3648
|
+
startIcon: /* @__PURE__ */ React78.createElement(import_icons25.DatabaseIcon, { fontSize: SIZE4 }),
|
|
3649
|
+
...(0, import_ui65.bindTrigger)(selectionPopoverState),
|
|
3650
|
+
actions: /* @__PURE__ */ React78.createElement(React78.Fragment, null, /* @__PURE__ */ React78.createElement(DynamicSettingsPopover, { dynamicTag }), /* @__PURE__ */ React78.createElement(
|
|
3651
|
+
import_ui65.IconButton,
|
|
3630
3652
|
{
|
|
3631
3653
|
size: SIZE4,
|
|
3632
3654
|
onClick: removeDynamicTag,
|
|
3633
|
-
"aria-label": (0,
|
|
3655
|
+
"aria-label": (0, import_i18n52.__)("Remove dynamic value", "elementor")
|
|
3634
3656
|
},
|
|
3635
|
-
/* @__PURE__ */
|
|
3657
|
+
/* @__PURE__ */ React78.createElement(import_icons25.XIcon, { fontSize: SIZE4 })
|
|
3636
3658
|
))
|
|
3637
3659
|
}
|
|
3638
|
-
), /* @__PURE__ */
|
|
3639
|
-
|
|
3660
|
+
), /* @__PURE__ */ React78.createElement(
|
|
3661
|
+
import_ui65.Popover,
|
|
3640
3662
|
{
|
|
3641
3663
|
disablePortal: true,
|
|
3642
3664
|
disableScrollLock: true,
|
|
3643
3665
|
anchorOrigin: { vertical: "bottom", horizontal: "left" },
|
|
3644
|
-
...(0,
|
|
3666
|
+
...(0, import_ui65.bindPopover)(selectionPopoverState)
|
|
3645
3667
|
},
|
|
3646
|
-
/* @__PURE__ */
|
|
3668
|
+
/* @__PURE__ */ React78.createElement(import_ui65.Stack, null, /* @__PURE__ */ React78.createElement(import_ui65.Stack, { direction: "row", alignItems: "center", pl: 1.5, pr: 0.5, py: 1.5 }, /* @__PURE__ */ React78.createElement(import_icons25.DatabaseIcon, { fontSize: SIZE4, sx: { mr: 0.5 } }), /* @__PURE__ */ React78.createElement(import_ui65.Typography, { variant: "subtitle2" }, (0, import_i18n52.__)("Dynamic tags", "elementor")), /* @__PURE__ */ React78.createElement(import_ui65.IconButton, { size: SIZE4, sx: { ml: "auto" }, onClick: selectionPopoverState.close }, /* @__PURE__ */ React78.createElement(import_icons25.XIcon, { fontSize: SIZE4 }))), /* @__PURE__ */ React78.createElement(DynamicSelection, { onSelect: selectionPopoverState.close }))
|
|
3647
3669
|
));
|
|
3648
3670
|
};
|
|
3649
3671
|
var DynamicSettingsPopover = ({ dynamicTag }) => {
|
|
3650
|
-
const popupState = (0,
|
|
3672
|
+
const popupState = (0, import_ui65.usePopupState)({ variant: "popover" });
|
|
3651
3673
|
const hasDynamicSettings = !!dynamicTag.atomic_controls.length;
|
|
3652
3674
|
if (!hasDynamicSettings) {
|
|
3653
3675
|
return null;
|
|
3654
3676
|
}
|
|
3655
|
-
return /* @__PURE__ */
|
|
3656
|
-
|
|
3677
|
+
return /* @__PURE__ */ React78.createElement(React78.Fragment, null, /* @__PURE__ */ React78.createElement(import_ui65.IconButton, { size: SIZE4, ...(0, import_ui65.bindTrigger)(popupState), "aria-label": (0, import_i18n52.__)("Settings", "elementor") }, /* @__PURE__ */ React78.createElement(import_icons25.SettingsIcon, { fontSize: SIZE4 })), /* @__PURE__ */ React78.createElement(
|
|
3678
|
+
import_ui65.Popover,
|
|
3657
3679
|
{
|
|
3658
3680
|
disablePortal: true,
|
|
3659
3681
|
disableScrollLock: true,
|
|
3660
3682
|
anchorOrigin: { vertical: "bottom", horizontal: "center" },
|
|
3661
|
-
...(0,
|
|
3683
|
+
...(0, import_ui65.bindPopover)(popupState)
|
|
3662
3684
|
},
|
|
3663
|
-
/* @__PURE__ */
|
|
3685
|
+
/* @__PURE__ */ React78.createElement(import_ui65.Paper, { component: import_ui65.Stack, sx: { minHeight: "300px", width: "220px" } }, /* @__PURE__ */ React78.createElement(import_ui65.Stack, { direction: "row", alignItems: "center", px: 1.5, pt: 2, pb: 1 }, /* @__PURE__ */ React78.createElement(import_icons25.DatabaseIcon, { fontSize: SIZE4, sx: { mr: 0.5 } }), /* @__PURE__ */ React78.createElement(import_ui65.Typography, { variant: "subtitle2" }, dynamicTag.label), /* @__PURE__ */ React78.createElement(import_ui65.IconButton, { sx: { ml: "auto" }, size: SIZE4, onClick: popupState.close }, /* @__PURE__ */ React78.createElement(import_icons25.XIcon, { fontSize: SIZE4 }))), /* @__PURE__ */ React78.createElement(DynamicSettings, { controls: dynamicTag.atomic_controls }))
|
|
3664
3686
|
));
|
|
3665
3687
|
};
|
|
3666
3688
|
var DynamicSettings = ({ controls }) => {
|
|
3667
3689
|
const tabs = controls.filter(({ type }) => type === "section");
|
|
3668
|
-
const { getTabsProps, getTabProps, getTabPanelProps } = (0,
|
|
3690
|
+
const { getTabsProps, getTabProps, getTabPanelProps } = (0, import_ui65.useTabs)(0);
|
|
3669
3691
|
if (!tabs.length) {
|
|
3670
3692
|
return null;
|
|
3671
3693
|
}
|
|
3672
|
-
return /* @__PURE__ */
|
|
3673
|
-
return /* @__PURE__ */
|
|
3694
|
+
return /* @__PURE__ */ React78.createElement(React78.Fragment, null, /* @__PURE__ */ React78.createElement(import_ui65.Tabs, { size: "small", variant: "fullWidth", ...getTabsProps() }, tabs.map(({ value }, index) => /* @__PURE__ */ React78.createElement(import_ui65.Tab, { key: index, label: value.label, sx: { px: 1, py: 0.5 }, ...getTabProps(index) }))), /* @__PURE__ */ React78.createElement(import_ui65.Divider, null), tabs.map(({ value }, index) => {
|
|
3695
|
+
return /* @__PURE__ */ React78.createElement(import_ui65.TabPanel, { key: index, sx: { flexGrow: 1, py: 0 }, ...getTabPanelProps(index) }, /* @__PURE__ */ React78.createElement(PopoverContent, { p: 2, gap: 2 }, value.items.map((item) => {
|
|
3674
3696
|
if (item.type === "control") {
|
|
3675
|
-
return /* @__PURE__ */
|
|
3697
|
+
return /* @__PURE__ */ React78.createElement(Control3, { key: item.value.bind, control: item.value });
|
|
3676
3698
|
}
|
|
3677
3699
|
return null;
|
|
3678
3700
|
})));
|
|
@@ -3682,7 +3704,7 @@ var Control3 = ({ control }) => {
|
|
|
3682
3704
|
if (!getControl(control.type)) {
|
|
3683
3705
|
return null;
|
|
3684
3706
|
}
|
|
3685
|
-
return /* @__PURE__ */
|
|
3707
|
+
return /* @__PURE__ */ React78.createElement(DynamicControl, { bind: control.bind }, /* @__PURE__ */ React78.createElement(import_ui65.Grid, { container: true, gap: 0.75 }, control.label ? /* @__PURE__ */ React78.createElement(import_ui65.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React78.createElement(import_editor_controls53.ControlFormLabel, null, control.label)) : null, /* @__PURE__ */ React78.createElement(import_ui65.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React78.createElement(Control, { type: control.type, props: control.props }))));
|
|
3686
3708
|
};
|
|
3687
3709
|
|
|
3688
3710
|
// src/dynamics/dynamic-transformer.ts
|
|
@@ -3735,18 +3757,18 @@ function getDynamicValue(name, settings) {
|
|
|
3735
3757
|
}
|
|
3736
3758
|
|
|
3737
3759
|
// src/dynamics/hooks/use-prop-dynamic-action.tsx
|
|
3738
|
-
var
|
|
3739
|
-
var
|
|
3760
|
+
var React79 = __toESM(require("react"));
|
|
3761
|
+
var import_editor_controls54 = require("@elementor/editor-controls");
|
|
3740
3762
|
var import_icons26 = require("@elementor/icons");
|
|
3741
|
-
var
|
|
3763
|
+
var import_i18n53 = require("@wordpress/i18n");
|
|
3742
3764
|
var usePropDynamicAction = () => {
|
|
3743
|
-
const { propType } = (0,
|
|
3765
|
+
const { propType } = (0, import_editor_controls54.useBoundProp)();
|
|
3744
3766
|
const visible = !!propType && supportsDynamic(propType);
|
|
3745
3767
|
return {
|
|
3746
3768
|
visible,
|
|
3747
3769
|
icon: import_icons26.DatabaseIcon,
|
|
3748
|
-
title: (0,
|
|
3749
|
-
popoverContent: ({ closePopover }) => /* @__PURE__ */
|
|
3770
|
+
title: (0, import_i18n53.__)("Dynamic tags", "elementor"),
|
|
3771
|
+
popoverContent: ({ closePopover }) => /* @__PURE__ */ React79.createElement(DynamicSelection, { onSelect: closePopover })
|
|
3750
3772
|
};
|
|
3751
3773
|
};
|
|
3752
3774
|
|
|
@@ -3780,7 +3802,7 @@ function init2() {
|
|
|
3780
3802
|
init();
|
|
3781
3803
|
}
|
|
3782
3804
|
var blockV1Panel = () => {
|
|
3783
|
-
(0,
|
|
3805
|
+
(0, import_editor_v1_adapters10.blockCommand)({
|
|
3784
3806
|
command: "panel/editor/open",
|
|
3785
3807
|
condition: isAtomicWidgetSelected
|
|
3786
3808
|
});
|