@elementor/editor-controls 0.18.0 → 0.19.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 +21 -0
- package/dist/index.js +24 -14
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +33 -23
- package/dist/index.mjs.map +1 -1
- package/package.json +3 -3
- package/src/components/control-label.tsx +2 -6
- package/src/components/control-toggle-button-group.tsx +2 -4
- package/src/controls/background-control/background-overlay/background-overlay-repeater-control.tsx +6 -1
- package/src/controls/box-shadow-repeater-control.tsx +3 -5
- package/src/controls/equal-unequal-sizes-control.tsx +1 -1
- package/src/controls/gap-control.tsx +3 -3
- package/src/controls/linked-dimensions-control.tsx +5 -5
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,26 @@
|
|
|
1
1
|
# @elementor/editor-controls
|
|
2
2
|
|
|
3
|
+
## 0.19.0
|
|
4
|
+
|
|
5
|
+
### Minor Changes
|
|
6
|
+
|
|
7
|
+
- 869906f: Allow the user to publish the page after clicking one of the linked buttons
|
|
8
|
+
|
|
9
|
+
### Patch Changes
|
|
10
|
+
|
|
11
|
+
- 8523f8c: Updated tabs styles
|
|
12
|
+
- Updated dependencies [5387bcf]
|
|
13
|
+
- Updated dependencies [efd54a9]
|
|
14
|
+
- @elementor/editor-elements@0.6.5
|
|
15
|
+
- @elementor/editor-props@0.11.1
|
|
16
|
+
|
|
17
|
+
## 0.18.1
|
|
18
|
+
|
|
19
|
+
### Patch Changes
|
|
20
|
+
|
|
21
|
+
- 85facff: Set fixed max-width for toggle-buttons-group item.
|
|
22
|
+
- e67bdcb: Update control label spacing.
|
|
23
|
+
|
|
3
24
|
## 0.18.0
|
|
4
25
|
|
|
5
26
|
### Minor Changes
|
package/dist/index.js
CHANGED
|
@@ -222,7 +222,7 @@ var resolveUnionPropType = (propType, key) => {
|
|
|
222
222
|
var React3 = __toESM(require("react"));
|
|
223
223
|
var import_ui = require("@elementor/ui");
|
|
224
224
|
var ControlLabel = ({ children }) => {
|
|
225
|
-
return /* @__PURE__ */ React3.createElement(import_ui.
|
|
225
|
+
return /* @__PURE__ */ React3.createElement(import_ui.FormLabel, { size: "tiny" }, children);
|
|
226
226
|
};
|
|
227
227
|
|
|
228
228
|
// src/create-control.tsx
|
|
@@ -1004,7 +1004,7 @@ var Control2 = ({
|
|
|
1004
1004
|
bind,
|
|
1005
1005
|
children,
|
|
1006
1006
|
sx
|
|
1007
|
-
}) => /* @__PURE__ */ React22.createElement(PropKeyProvider, { bind }, /* @__PURE__ */ React22.createElement(import_ui18.Grid, { item: true, xs: 6, sx }, /* @__PURE__ */ React22.createElement(import_ui18.Grid, { container: true, gap:
|
|
1007
|
+
}) => /* @__PURE__ */ React22.createElement(PropKeyProvider, { bind }, /* @__PURE__ */ React22.createElement(import_ui18.Grid, { item: true, xs: 6, sx }, /* @__PURE__ */ React22.createElement(import_ui18.Grid, { container: true, gap: 0.75, alignItems: "center" }, /* @__PURE__ */ React22.createElement(import_ui18.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React22.createElement(import_ui18.FormLabel, { size: "tiny" }, label)), /* @__PURE__ */ React22.createElement(import_ui18.Grid, { item: true, xs: 12 }, children))));
|
|
1008
1008
|
var ItemLabel = ({ value }) => {
|
|
1009
1009
|
const { position, hOffset, vOffset, blur, spread } = value.value;
|
|
1010
1010
|
const { size: blurSize = "", unit: blurUnit = "" } = blur?.value || {};
|
|
@@ -1057,7 +1057,6 @@ var import_ui19 = require("@elementor/ui");
|
|
|
1057
1057
|
var StyledToggleButtonGroup = (0, import_ui19.styled)(import_ui19.ToggleButtonGroup)`
|
|
1058
1058
|
${({ justify }) => `justify-content: ${justify};`}
|
|
1059
1059
|
`;
|
|
1060
|
-
var MAX_VISIBLE_ITEMS = 4;
|
|
1061
1060
|
var ControlToggleButtonGroup = ({
|
|
1062
1061
|
justify = "end",
|
|
1063
1062
|
size = "tiny",
|
|
@@ -1081,8 +1080,8 @@ var ControlToggleButtonGroup = ({
|
|
|
1081
1080
|
sx: {
|
|
1082
1081
|
direction: isRtl ? "rtl /* @noflip */" : "ltr /* @noflip */",
|
|
1083
1082
|
display: "grid",
|
|
1084
|
-
gridTemplateColumns: `repeat(${items.length},
|
|
1085
|
-
width:
|
|
1083
|
+
gridTemplateColumns: `repeat(${items.length}, minmax(0, 25%))`,
|
|
1084
|
+
width: `100%`
|
|
1086
1085
|
}
|
|
1087
1086
|
},
|
|
1088
1087
|
items.map(
|
|
@@ -1271,7 +1270,7 @@ function EqualUnequalSizesControl({
|
|
|
1271
1270
|
/* @__PURE__ */ React26.createElement(PropProvider, { propType: multiSizePropType, value: getMultiSizeValues(), setValue: setNestedProp }, /* @__PURE__ */ React26.createElement(PopoverContent, { p: 1.5 }, /* @__PURE__ */ React26.createElement(PopoverGridContainer, null, /* @__PURE__ */ React26.createElement(MultiSizeValueControl, { item: items[0] }), /* @__PURE__ */ React26.createElement(MultiSizeValueControl, { item: items[1] })), /* @__PURE__ */ React26.createElement(PopoverGridContainer, null, /* @__PURE__ */ React26.createElement(MultiSizeValueControl, { item: items[2] }), /* @__PURE__ */ React26.createElement(MultiSizeValueControl, { item: items[3] }))))
|
|
1272
1271
|
));
|
|
1273
1272
|
}
|
|
1274
|
-
var MultiSizeValueControl = ({ item }) => /* @__PURE__ */ React26.createElement(PropKeyProvider, { bind: item.bind }, /* @__PURE__ */ React26.createElement(import_ui21.Grid, { item: true, xs: 6 }, /* @__PURE__ */ React26.createElement(import_ui21.Grid, { container: true, gap:
|
|
1273
|
+
var MultiSizeValueControl = ({ item }) => /* @__PURE__ */ React26.createElement(PropKeyProvider, { bind: item.bind }, /* @__PURE__ */ React26.createElement(import_ui21.Grid, { item: true, xs: 6 }, /* @__PURE__ */ React26.createElement(import_ui21.Grid, { container: true, gap: 0.75, alignItems: "center" }, /* @__PURE__ */ React26.createElement(import_ui21.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React26.createElement(ControlLabel, null, item.label)), /* @__PURE__ */ React26.createElement(import_ui21.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React26.createElement(SizeControl, { startIcon: item.icon })))));
|
|
1275
1274
|
|
|
1276
1275
|
// src/controls/linked-dimensions-control.tsx
|
|
1277
1276
|
var React27 = __toESM(require("react"));
|
|
@@ -1294,7 +1293,7 @@ var LinkedDimensionsControl = createControl(
|
|
|
1294
1293
|
const isLinked = !dimensionsValue && !sizeValue ? true : !!sizeValue;
|
|
1295
1294
|
const onLinkToggle = () => {
|
|
1296
1295
|
if (!isLinked) {
|
|
1297
|
-
setSizeValue(dimensionsValue["block-start"]?.value);
|
|
1296
|
+
setSizeValue(dimensionsValue["block-start"]?.value ?? null);
|
|
1298
1297
|
return;
|
|
1299
1298
|
}
|
|
1300
1299
|
const value = sizeValue ? import_editor_props13.sizePropTypeUtil.create(sizeValue) : null;
|
|
@@ -1320,7 +1319,7 @@ var LinkedDimensionsControl = createControl(
|
|
|
1320
1319
|
onChange: onLinkToggle
|
|
1321
1320
|
},
|
|
1322
1321
|
/* @__PURE__ */ React27.createElement(LinkedIcon, { fontSize: "tiny" })
|
|
1323
|
-
))), /* @__PURE__ */ React27.createElement(import_ui22.Stack, { direction: "row", gap: 2, flexWrap: "nowrap" }, /* @__PURE__ */ React27.createElement(import_ui22.Grid, { container: true, gap:
|
|
1322
|
+
))), /* @__PURE__ */ React27.createElement(import_ui22.Stack, { direction: "row", gap: 2, flexWrap: "nowrap" }, /* @__PURE__ */ React27.createElement(import_ui22.Grid, { container: true, gap: 0.75, alignItems: "center" }, /* @__PURE__ */ React27.createElement(import_ui22.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React27.createElement(ControlLabel, null, (0, import_i18n7.__)("Top", "elementor"))), /* @__PURE__ */ React27.createElement(import_ui22.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React27.createElement(
|
|
1324
1323
|
Control3,
|
|
1325
1324
|
{
|
|
1326
1325
|
bind: "block-start",
|
|
@@ -1328,7 +1327,7 @@ var LinkedDimensionsControl = createControl(
|
|
|
1328
1327
|
isLinked,
|
|
1329
1328
|
extendedValues
|
|
1330
1329
|
}
|
|
1331
|
-
))), /* @__PURE__ */ React27.createElement(import_ui22.Grid, { container: true, gap:
|
|
1330
|
+
))), /* @__PURE__ */ React27.createElement(import_ui22.Grid, { container: true, gap: 0.75, alignItems: "center" }, /* @__PURE__ */ React27.createElement(import_ui22.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React27.createElement(ControlLabel, null, isSiteRtl ? (0, import_i18n7.__)("Left", "elementor") : (0, import_i18n7.__)("Right", "elementor"))), /* @__PURE__ */ React27.createElement(import_ui22.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React27.createElement(
|
|
1332
1331
|
Control3,
|
|
1333
1332
|
{
|
|
1334
1333
|
bind: "inline-end",
|
|
@@ -1336,7 +1335,7 @@ var LinkedDimensionsControl = createControl(
|
|
|
1336
1335
|
isLinked,
|
|
1337
1336
|
extendedValues
|
|
1338
1337
|
}
|
|
1339
|
-
)))), /* @__PURE__ */ React27.createElement(import_ui22.Stack, { direction: "row", gap: 2, flexWrap: "nowrap" }, /* @__PURE__ */ React27.createElement(import_ui22.Grid, { container: true, gap:
|
|
1338
|
+
)))), /* @__PURE__ */ React27.createElement(import_ui22.Stack, { direction: "row", gap: 2, flexWrap: "nowrap" }, /* @__PURE__ */ React27.createElement(import_ui22.Grid, { container: true, gap: 0.75, alignItems: "center" }, /* @__PURE__ */ React27.createElement(import_ui22.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React27.createElement(ControlLabel, null, (0, import_i18n7.__)("Bottom", "elementor"))), /* @__PURE__ */ React27.createElement(import_ui22.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React27.createElement(
|
|
1340
1339
|
Control3,
|
|
1341
1340
|
{
|
|
1342
1341
|
bind: "block-end",
|
|
@@ -1344,7 +1343,7 @@ var LinkedDimensionsControl = createControl(
|
|
|
1344
1343
|
isLinked,
|
|
1345
1344
|
extendedValues
|
|
1346
1345
|
}
|
|
1347
|
-
))), /* @__PURE__ */ React27.createElement(import_ui22.Grid, { container: true, gap:
|
|
1346
|
+
))), /* @__PURE__ */ React27.createElement(import_ui22.Grid, { container: true, gap: 0.75, alignItems: "center" }, /* @__PURE__ */ React27.createElement(import_ui22.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React27.createElement(ControlLabel, null, isSiteRtl ? (0, import_i18n7.__)("Right", "elementor") : (0, import_i18n7.__)("Left", "elementor"))), /* @__PURE__ */ React27.createElement(import_ui22.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React27.createElement(
|
|
1348
1347
|
Control3,
|
|
1349
1348
|
{
|
|
1350
1349
|
bind: "inline-start",
|
|
@@ -1928,7 +1927,7 @@ var GapControl = createControl(({ label }) => {
|
|
|
1928
1927
|
const isLinked = !directionValue && !sizeValue ? true : !!sizeValue;
|
|
1929
1928
|
const onLinkToggle = () => {
|
|
1930
1929
|
if (!isLinked) {
|
|
1931
|
-
setSizeValue(directionValue?.column?.value);
|
|
1930
|
+
setSizeValue(directionValue?.column?.value ?? null);
|
|
1932
1931
|
return;
|
|
1933
1932
|
}
|
|
1934
1933
|
const value = sizeValue ? import_editor_props17.sizePropTypeUtil.create(sizeValue) : null;
|
|
@@ -1952,7 +1951,7 @@ var GapControl = createControl(({ label }) => {
|
|
|
1952
1951
|
onChange: onLinkToggle
|
|
1953
1952
|
},
|
|
1954
1953
|
/* @__PURE__ */ React32.createElement(LinkedIcon, { fontSize: "tiny" })
|
|
1955
|
-
))), /* @__PURE__ */ React32.createElement(import_ui27.Stack, { direction: "row", gap: 2, flexWrap: "nowrap" }, /* @__PURE__ */ React32.createElement(import_ui27.Grid, { container: true, gap:
|
|
1954
|
+
))), /* @__PURE__ */ React32.createElement(import_ui27.Stack, { direction: "row", gap: 2, flexWrap: "nowrap" }, /* @__PURE__ */ React32.createElement(import_ui27.Grid, { container: true, gap: 0.75, alignItems: "center" }, /* @__PURE__ */ React32.createElement(import_ui27.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React32.createElement(ControlLabel, null, (0, import_i18n10.__)("Column", "elementor"))), /* @__PURE__ */ React32.createElement(import_ui27.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React32.createElement(Control4, { bind: "column", isLinked }))), /* @__PURE__ */ React32.createElement(import_ui27.Grid, { container: true, gap: 0.75, alignItems: "center" }, /* @__PURE__ */ React32.createElement(import_ui27.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React32.createElement(ControlLabel, null, (0, import_i18n10.__)("Row", "elementor"))), /* @__PURE__ */ React32.createElement(import_ui27.Grid, { item: true, xs: 12 }, /* @__PURE__ */ React32.createElement(Control4, { bind: "row", isLinked })))));
|
|
1956
1955
|
});
|
|
1957
1956
|
var Control4 = ({ bind, isLinked }) => {
|
|
1958
1957
|
if (isLinked) {
|
|
@@ -2498,7 +2497,18 @@ var Content2 = () => {
|
|
|
2498
2497
|
color: initialBackgroundColorOverlay.value,
|
|
2499
2498
|
gradient: initialBackgroundGradientOverlay.value
|
|
2500
2499
|
});
|
|
2501
|
-
return /* @__PURE__ */ React40.createElement(import_ui36.Box, { sx: { width: "100%" } }, /* @__PURE__ */ React40.createElement(import_ui36.Box, { sx: { borderBottom: 1, borderColor: "divider" } }, /* @__PURE__ */ React40.createElement(
|
|
2500
|
+
return /* @__PURE__ */ React40.createElement(import_ui36.Box, { sx: { width: "100%" } }, /* @__PURE__ */ React40.createElement(import_ui36.Box, { sx: { borderBottom: 1, borderColor: "divider" } }, /* @__PURE__ */ React40.createElement(
|
|
2501
|
+
import_ui36.Tabs,
|
|
2502
|
+
{
|
|
2503
|
+
size: "small",
|
|
2504
|
+
variant: "fullWidth",
|
|
2505
|
+
...getTabsProps(),
|
|
2506
|
+
"aria-label": (0, import_i18n17.__)("Background Overlay", "elementor")
|
|
2507
|
+
},
|
|
2508
|
+
/* @__PURE__ */ React40.createElement(import_ui36.Tab, { label: (0, import_i18n17.__)("Image", "elementor"), ...getTabProps("image") }),
|
|
2509
|
+
/* @__PURE__ */ React40.createElement(import_ui36.Tab, { label: (0, import_i18n17.__)("Gradient", "elementor"), ...getTabProps("gradient") }),
|
|
2510
|
+
/* @__PURE__ */ React40.createElement(import_ui36.Tab, { label: (0, import_i18n17.__)("Color", "elementor"), ...getTabProps("color") })
|
|
2511
|
+
)), /* @__PURE__ */ React40.createElement(import_ui36.TabPanel, { sx: { p: 1.5 }, ...getTabPanelProps("image") }, /* @__PURE__ */ React40.createElement(PopoverContent, null, /* @__PURE__ */ React40.createElement(ImageOverlayContent, null))), /* @__PURE__ */ React40.createElement(import_ui36.TabPanel, { sx: { p: 1.5 }, ...getTabPanelProps("gradient") }, /* @__PURE__ */ React40.createElement(BackgroundGradientColorControl, null)), /* @__PURE__ */ React40.createElement(import_ui36.TabPanel, { sx: { p: 1.5 }, ...getTabPanelProps("color") }, /* @__PURE__ */ React40.createElement(PopoverContent, null, /* @__PURE__ */ React40.createElement(ColorOverlayContent, null))));
|
|
2502
2512
|
};
|
|
2503
2513
|
var ItemIcon2 = ({ value }) => {
|
|
2504
2514
|
switch (value.$$type) {
|