@elementor/editor-controls 0.6.0 → 0.6.1
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 +14 -0
- package/dist/index.js +59 -28
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +64 -30
- package/dist/index.mjs.map +1 -1
- package/package.json +3 -3
- package/src/controls/equal-unequal-sizes-control.tsx +1 -1
- package/src/controls/image-media-control.tsx +1 -1
- package/src/controls/link-control.tsx +2 -2
- package/src/controls/linked-dimensions-control.tsx +60 -34
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,19 @@
|
|
|
1
1
|
# @elementor/editor-controls
|
|
2
2
|
|
|
3
|
+
## 0.6.1
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- bd1b038: Change text for Mixed state
|
|
8
|
+
- 4e5ea74: support SVG upload
|
|
9
|
+
- 7582ba6: Modify linked dimensions control functionality
|
|
10
|
+
- 7654921: Allow any strings in link control
|
|
11
|
+
- Updated dependencies [4e5ea74]
|
|
12
|
+
- Updated dependencies [7582ba6]
|
|
13
|
+
- Updated dependencies [7654921]
|
|
14
|
+
- @elementor/wp-media@0.3.0
|
|
15
|
+
- @elementor/editor-props@0.7.1
|
|
16
|
+
|
|
3
17
|
## 0.6.0
|
|
4
18
|
|
|
5
19
|
### Minor Changes
|
package/dist/index.js
CHANGED
|
@@ -320,7 +320,7 @@ var ImageMediaControl = createControl(() => {
|
|
|
320
320
|
const { data: attachment, isFetching } = (0, import_wp_media.useWpMediaAttachment)(id?.value || null);
|
|
321
321
|
const src = attachment?.url ?? url?.value ?? null;
|
|
322
322
|
const { open } = (0, import_wp_media.useWpMediaFrame)({
|
|
323
|
-
types: ["image"],
|
|
323
|
+
types: ["image", "image/svg+xml"],
|
|
324
324
|
multiple: false,
|
|
325
325
|
selected: id?.value || null,
|
|
326
326
|
onSelect: (selectedAttachment) => {
|
|
@@ -1068,7 +1068,7 @@ function EqualUnequalSizesControl({
|
|
|
1068
1068
|
}
|
|
1069
1069
|
return splitEqualValue() ?? null;
|
|
1070
1070
|
};
|
|
1071
|
-
return /* @__PURE__ */ React23.createElement(React23.Fragment, null, /* @__PURE__ */ React23.createElement(import_ui18.Grid, { container: true, gap: 2, alignItems: "center", flexWrap: "nowrap", ref: controlRef }, /* @__PURE__ */ React23.createElement(import_ui18.Grid, { item: true, xs: 6 }, /* @__PURE__ */ React23.createElement(ControlLabel, null, label)), /* @__PURE__ */ React23.createElement(import_ui18.Grid, { item: true, xs: 6 }, /* @__PURE__ */ React23.createElement(import_ui18.Stack, { direction: "row", alignItems: "center", gap: 1 }, /* @__PURE__ */ React23.createElement(SizeControl, { placeholder: (0, import_i18n6.__)("
|
|
1071
|
+
return /* @__PURE__ */ React23.createElement(React23.Fragment, null, /* @__PURE__ */ React23.createElement(import_ui18.Grid, { container: true, gap: 2, alignItems: "center", flexWrap: "nowrap", ref: controlRef }, /* @__PURE__ */ React23.createElement(import_ui18.Grid, { item: true, xs: 6 }, /* @__PURE__ */ React23.createElement(ControlLabel, null, label)), /* @__PURE__ */ React23.createElement(import_ui18.Grid, { item: true, xs: 6 }, /* @__PURE__ */ React23.createElement(import_ui18.Stack, { direction: "row", alignItems: "center", gap: 1 }, /* @__PURE__ */ React23.createElement(SizeControl, { placeholder: (0, import_i18n6.__)("Mixed", "elementor") }), /* @__PURE__ */ React23.createElement(
|
|
1072
1072
|
import_ui18.ToggleButton,
|
|
1073
1073
|
{
|
|
1074
1074
|
size: "tiny",
|
|
@@ -1108,33 +1108,31 @@ var import_icons4 = require("@elementor/icons");
|
|
|
1108
1108
|
var import_ui19 = require("@elementor/ui");
|
|
1109
1109
|
var import_i18n7 = require("@wordpress/i18n");
|
|
1110
1110
|
var LinkedDimensionsControl = createControl(({ label }) => {
|
|
1111
|
-
const { value, setValue, propType } = useBoundProp(import_editor_props14.
|
|
1112
|
-
const {
|
|
1113
|
-
const
|
|
1111
|
+
const { value: dimensionsValue, setValue: setDimensionsValue, propType } = useBoundProp(import_editor_props14.dimensionsPropTypeUtil);
|
|
1112
|
+
const { value: sizeValue, setValue: setSizeValue } = useBoundProp(import_editor_props14.sizePropTypeUtil);
|
|
1113
|
+
const isLinked = !dimensionsValue && !sizeValue ? true : !!sizeValue;
|
|
1114
|
+
const setValue = (newValue) => {
|
|
1114
1115
|
if (!isLinked) {
|
|
1115
|
-
|
|
1116
|
+
setDimensionsValue(newValue);
|
|
1117
|
+
return;
|
|
1116
1118
|
}
|
|
1117
|
-
|
|
1118
|
-
setValue({
|
|
1119
|
-
isLinked,
|
|
1120
|
-
top: newDimension,
|
|
1121
|
-
right: newDimension,
|
|
1122
|
-
bottom: newDimension,
|
|
1123
|
-
left: newDimension
|
|
1124
|
-
});
|
|
1119
|
+
setSizeValue(newValue.top);
|
|
1125
1120
|
};
|
|
1126
|
-
const
|
|
1127
|
-
|
|
1128
|
-
|
|
1129
|
-
|
|
1130
|
-
|
|
1131
|
-
|
|
1132
|
-
|
|
1133
|
-
|
|
1134
|
-
|
|
1121
|
+
const onLinkToggle = () => {
|
|
1122
|
+
if (!isLinked) {
|
|
1123
|
+
setSizeValue(dimensionsValue?.top.value);
|
|
1124
|
+
return;
|
|
1125
|
+
}
|
|
1126
|
+
const value = sizeValue ? import_editor_props14.sizePropTypeUtil.create(sizeValue) : null;
|
|
1127
|
+
setDimensionsValue({
|
|
1128
|
+
top: value,
|
|
1129
|
+
right: value,
|
|
1130
|
+
bottom: value,
|
|
1131
|
+
left: value
|
|
1132
|
+
});
|
|
1135
1133
|
};
|
|
1136
1134
|
const LinkedIcon = isLinked ? import_icons4.LinkIcon : import_icons4.DetachIcon;
|
|
1137
|
-
return /* @__PURE__ */ React24.createElement(PropProvider, { propType, value, setValue
|
|
1135
|
+
return /* @__PURE__ */ React24.createElement(PropProvider, { propType, value: dimensionsValue, setValue }, /* @__PURE__ */ React24.createElement(import_ui19.Stack, { direction: "row", gap: 2, flexWrap: "nowrap" }, /* @__PURE__ */ React24.createElement(ControlLabel, null, label), /* @__PURE__ */ React24.createElement(
|
|
1138
1136
|
import_ui19.ToggleButton,
|
|
1139
1137
|
{
|
|
1140
1138
|
"aria-label": (0, import_i18n7.__)("Link Inputs", "elementor"),
|
|
@@ -1142,12 +1140,45 @@ var LinkedDimensionsControl = createControl(({ label }) => {
|
|
|
1142
1140
|
value: "check",
|
|
1143
1141
|
selected: isLinked,
|
|
1144
1142
|
sx: { marginLeft: "auto" },
|
|
1145
|
-
onChange:
|
|
1143
|
+
onChange: onLinkToggle
|
|
1146
1144
|
},
|
|
1147
1145
|
/* @__PURE__ */ React24.createElement(LinkedIcon, { fontSize: "tiny" })
|
|
1148
|
-
)), /* @__PURE__ */ React24.createElement(import_ui19.Stack, { direction: "row", gap: 2, flexWrap: "nowrap" }, /* @__PURE__ */ React24.createElement(import_ui19.Grid, { container: true, gap: 1, alignItems: "center" }, /* @__PURE__ */ React24.createElement(import_ui19.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React24.createElement(ControlLabel, null, (0, import_i18n7.__)("Top", "elementor"))), /* @__PURE__ */ React24.createElement(import_ui19.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React24.createElement(
|
|
1146
|
+
)), /* @__PURE__ */ React24.createElement(import_ui19.Stack, { direction: "row", gap: 2, flexWrap: "nowrap" }, /* @__PURE__ */ React24.createElement(import_ui19.Grid, { container: true, gap: 1, alignItems: "center" }, /* @__PURE__ */ React24.createElement(import_ui19.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React24.createElement(ControlLabel, null, (0, import_i18n7.__)("Top", "elementor"))), /* @__PURE__ */ React24.createElement(import_ui19.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React24.createElement(
|
|
1147
|
+
Control3,
|
|
1148
|
+
{
|
|
1149
|
+
bind: "top",
|
|
1150
|
+
startIcon: /* @__PURE__ */ React24.createElement(import_icons4.SideTopIcon, { fontSize: "tiny" }),
|
|
1151
|
+
isLinked
|
|
1152
|
+
}
|
|
1153
|
+
))), /* @__PURE__ */ React24.createElement(import_ui19.Grid, { container: true, gap: 1, alignItems: "center" }, /* @__PURE__ */ React24.createElement(import_ui19.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React24.createElement(ControlLabel, null, (0, import_i18n7.__)("Right", "elementor"))), /* @__PURE__ */ React24.createElement(import_ui19.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React24.createElement(
|
|
1154
|
+
Control3,
|
|
1155
|
+
{
|
|
1156
|
+
bind: "right",
|
|
1157
|
+
startIcon: /* @__PURE__ */ React24.createElement(import_icons4.SideRightIcon, { fontSize: "tiny" }),
|
|
1158
|
+
isLinked
|
|
1159
|
+
}
|
|
1160
|
+
)))), /* @__PURE__ */ React24.createElement(import_ui19.Stack, { direction: "row", gap: 2, flexWrap: "nowrap" }, /* @__PURE__ */ React24.createElement(import_ui19.Grid, { container: true, gap: 1, alignItems: "center" }, /* @__PURE__ */ React24.createElement(import_ui19.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React24.createElement(ControlLabel, null, (0, import_i18n7.__)("Bottom", "elementor"))), /* @__PURE__ */ React24.createElement(import_ui19.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React24.createElement(
|
|
1161
|
+
Control3,
|
|
1162
|
+
{
|
|
1163
|
+
bind: "bottom",
|
|
1164
|
+
startIcon: /* @__PURE__ */ React24.createElement(import_icons4.SideBottomIcon, { fontSize: "tiny" }),
|
|
1165
|
+
isLinked
|
|
1166
|
+
}
|
|
1167
|
+
))), /* @__PURE__ */ React24.createElement(import_ui19.Grid, { container: true, gap: 1, alignItems: "center" }, /* @__PURE__ */ React24.createElement(import_ui19.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React24.createElement(ControlLabel, null, (0, import_i18n7.__)("Left", "elementor"))), /* @__PURE__ */ React24.createElement(import_ui19.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React24.createElement(
|
|
1168
|
+
Control3,
|
|
1169
|
+
{
|
|
1170
|
+
bind: "left",
|
|
1171
|
+
startIcon: /* @__PURE__ */ React24.createElement(import_icons4.SideLeftIcon, { fontSize: "tiny" }),
|
|
1172
|
+
isLinked
|
|
1173
|
+
}
|
|
1174
|
+
)))));
|
|
1149
1175
|
});
|
|
1150
|
-
var Control3 = ({ bind, startIcon }) =>
|
|
1176
|
+
var Control3 = ({ bind, startIcon, isLinked }) => {
|
|
1177
|
+
if (isLinked) {
|
|
1178
|
+
return /* @__PURE__ */ React24.createElement(SizeControl, { startIcon });
|
|
1179
|
+
}
|
|
1180
|
+
return /* @__PURE__ */ React24.createElement(PropKeyProvider, { bind }, /* @__PURE__ */ React24.createElement(SizeControl, { startIcon }));
|
|
1181
|
+
};
|
|
1151
1182
|
|
|
1152
1183
|
// src/controls/font-family-control.tsx
|
|
1153
1184
|
var import_react10 = require("react");
|
|
@@ -1329,7 +1360,7 @@ var LinkControl = createControl((props) => {
|
|
|
1329
1360
|
{
|
|
1330
1361
|
allowCustomValues: Object.keys(options).length ? allowCustomValues : true,
|
|
1331
1362
|
options,
|
|
1332
|
-
propType: import_editor_props17.
|
|
1363
|
+
propType: import_editor_props17.urlPropTypeUtil,
|
|
1333
1364
|
placeholder
|
|
1334
1365
|
}
|
|
1335
1366
|
)), /* @__PURE__ */ React27.createElement(PropKeyProvider, { bind: "isTargetBlank" }, /* @__PURE__ */ React27.createElement(SwitchControl, null))))));
|