@elementor/editor-components 3.35.0-332 → 3.35.0-334
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/dist/index.js +87 -52
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +79 -44
- package/dist/index.mjs.map +1 -1
- package/package.json +20 -20
- package/src/components/overridable-props/overridable-prop-control.tsx +16 -13
- package/src/components/overridable-props/overridable-prop-indicator.tsx +17 -12
- package/src/create-component-type.ts +75 -17
- package/src/provider/overridable-prop-context.tsx +16 -0
package/dist/index.mjs
CHANGED
|
@@ -4,7 +4,7 @@ import {
|
|
|
4
4
|
registerElementType,
|
|
5
5
|
settingsTransformersRegistry as settingsTransformersRegistry2
|
|
6
6
|
} from "@elementor/editor-canvas";
|
|
7
|
-
import { getV1CurrentDocument
|
|
7
|
+
import { getV1CurrentDocument } from "@elementor/editor-documents";
|
|
8
8
|
import {
|
|
9
9
|
FIELD_TYPE,
|
|
10
10
|
injectIntoPanelHeaderTop,
|
|
@@ -544,6 +544,21 @@ var onElementDrop = (_args, element) => {
|
|
|
544
544
|
|
|
545
545
|
// src/create-component-type.ts
|
|
546
546
|
var TYPE = "e-component";
|
|
547
|
+
var updateGroups = (groups, config) => {
|
|
548
|
+
const disableMap = new Map(Object.entries(config.disable ?? {}));
|
|
549
|
+
const addMap = new Map(Object.entries(config.add ?? {}));
|
|
550
|
+
return groups.map((group) => {
|
|
551
|
+
const disabledActions = disableMap.get(group.name) ?? [];
|
|
552
|
+
const addConfig = addMap.get(group.name);
|
|
553
|
+
const updatedActions = group.actions.map(
|
|
554
|
+
(action) => disabledActions.includes(action.name) ? { ...action, isEnabled: () => false } : action
|
|
555
|
+
);
|
|
556
|
+
if (addConfig) {
|
|
557
|
+
updatedActions.splice(addConfig.index, 0, addConfig.action);
|
|
558
|
+
}
|
|
559
|
+
return { ...group, actions: updatedActions };
|
|
560
|
+
});
|
|
561
|
+
};
|
|
547
562
|
function createComponentType(options) {
|
|
548
563
|
const legacyWindow = window;
|
|
549
564
|
return class extends legacyWindow.elementor.modules.elements.types.Widget {
|
|
@@ -551,7 +566,7 @@ function createComponentType(options) {
|
|
|
551
566
|
return options.type;
|
|
552
567
|
}
|
|
553
568
|
getView() {
|
|
554
|
-
return createComponentView(options);
|
|
569
|
+
return createComponentView({ ...options });
|
|
555
570
|
}
|
|
556
571
|
};
|
|
557
572
|
}
|
|
@@ -594,21 +609,32 @@ function createComponentView(options) {
|
|
|
594
609
|
if (!componentId) {
|
|
595
610
|
return filteredGroups;
|
|
596
611
|
}
|
|
597
|
-
const
|
|
598
|
-
|
|
599
|
-
|
|
600
|
-
|
|
601
|
-
|
|
602
|
-
|
|
603
|
-
|
|
604
|
-
|
|
605
|
-
|
|
606
|
-
|
|
607
|
-
|
|
608
|
-
|
|
612
|
+
const newGroups = updateGroups(
|
|
613
|
+
filteredGroups,
|
|
614
|
+
this._getContextMenuConfig()
|
|
615
|
+
);
|
|
616
|
+
return newGroups;
|
|
617
|
+
}
|
|
618
|
+
_getContextMenuConfig() {
|
|
619
|
+
const legacyWindow = this.legacyWindow || window;
|
|
620
|
+
const elementorWithConfig = legacyWindow.elementor;
|
|
621
|
+
const isAdministrator = elementorWithConfig.config?.user?.is_administrator ?? false;
|
|
622
|
+
const addedGroup = {
|
|
623
|
+
general: {
|
|
624
|
+
index: 1,
|
|
625
|
+
action: {
|
|
626
|
+
name: "edit component",
|
|
627
|
+
icon: "eicon-edit",
|
|
628
|
+
title: () => __4("Edit Component", "elementor"),
|
|
629
|
+
isEnabled: () => true,
|
|
630
|
+
callback: (_, eventData) => this.editComponent(eventData)
|
|
631
|
+
}
|
|
609
632
|
}
|
|
610
|
-
|
|
611
|
-
|
|
633
|
+
};
|
|
634
|
+
const disabledGroup = {
|
|
635
|
+
clipboard: ["pasteStyle", "resetStyle"]
|
|
636
|
+
};
|
|
637
|
+
return { add: isAdministrator ? addedGroup : {}, disable: disabledGroup };
|
|
612
638
|
}
|
|
613
639
|
async switchDocument() {
|
|
614
640
|
const { isAllowedToSwitchDocument, lockedBy } = await apiClient.getComponentLockStatus(
|
|
@@ -1627,7 +1653,7 @@ var EditModeDialog = ({ lockedBy }) => {
|
|
|
1627
1653
|
};
|
|
1628
1654
|
|
|
1629
1655
|
// src/components/overridable-props/overridable-prop-control.tsx
|
|
1630
|
-
import * as
|
|
1656
|
+
import * as React14 from "react";
|
|
1631
1657
|
import { ControlReplacementsProvider, PropKeyProvider, PropProvider, useBoundProp } from "@elementor/editor-controls";
|
|
1632
1658
|
import { createTopLevelObjectType, useElement } from "@elementor/editor-editing-panel";
|
|
1633
1659
|
import { __getState as getState6 } from "@elementor/store";
|
|
@@ -1646,6 +1672,15 @@ var componentOverridablePropTypeUtil = createPropUtils(
|
|
|
1646
1672
|
})
|
|
1647
1673
|
);
|
|
1648
1674
|
|
|
1675
|
+
// src/provider/overridable-prop-context.tsx
|
|
1676
|
+
import * as React13 from "react";
|
|
1677
|
+
import { createContext as createContext2, useContext as useContext2 } from "react";
|
|
1678
|
+
var OverridablePropContext = createContext2(null);
|
|
1679
|
+
function OverridablePropProvider({ children, ...props }) {
|
|
1680
|
+
return /* @__PURE__ */ React13.createElement(OverridablePropContext.Provider, { value: props }, children);
|
|
1681
|
+
}
|
|
1682
|
+
var useOverridablePropValue = () => useContext2(OverridablePropContext)?.value;
|
|
1683
|
+
|
|
1649
1684
|
// src/store/actions/update-overridable-prop-origin-value.ts
|
|
1650
1685
|
import { __dispatch as dispatch4, __getState as getState5 } from "@elementor/store";
|
|
1651
1686
|
function updateOverridablePropOriginValue(componentId, propValue) {
|
|
@@ -1703,7 +1738,7 @@ function OverridablePropControl({
|
|
|
1703
1738
|
}
|
|
1704
1739
|
});
|
|
1705
1740
|
const objectPlaceholder = placeholder ? { [bind]: placeholder } : void 0;
|
|
1706
|
-
return /* @__PURE__ */
|
|
1741
|
+
return /* @__PURE__ */ React14.createElement(OverridablePropProvider, { value }, /* @__PURE__ */ React14.createElement(
|
|
1707
1742
|
PropProvider,
|
|
1708
1743
|
{
|
|
1709
1744
|
...propContext,
|
|
@@ -1712,14 +1747,13 @@ function OverridablePropControl({
|
|
|
1712
1747
|
value: { [bind]: value.origin_value },
|
|
1713
1748
|
placeholder: objectPlaceholder
|
|
1714
1749
|
},
|
|
1715
|
-
/* @__PURE__ */
|
|
1716
|
-
);
|
|
1750
|
+
/* @__PURE__ */ React14.createElement(PropKeyProvider, { bind }, /* @__PURE__ */ React14.createElement(ControlReplacementsProvider, { replacements: [] }, /* @__PURE__ */ React14.createElement(OriginalControl, { ...props })))
|
|
1751
|
+
));
|
|
1717
1752
|
}
|
|
1718
1753
|
|
|
1719
1754
|
// src/components/overridable-props/overridable-prop-indicator.tsx
|
|
1720
|
-
import * as
|
|
1755
|
+
import * as React17 from "react";
|
|
1721
1756
|
import { useBoundProp as useBoundProp2 } from "@elementor/editor-controls";
|
|
1722
|
-
import { getV1CurrentDocument } from "@elementor/editor-documents";
|
|
1723
1757
|
import { useElement as useElement2 } from "@elementor/editor-editing-panel";
|
|
1724
1758
|
import { getWidgetsCache } from "@elementor/editor-elements";
|
|
1725
1759
|
import { __getState as getState9 } from "@elementor/store";
|
|
@@ -1869,7 +1903,7 @@ function removeProps({
|
|
|
1869
1903
|
}
|
|
1870
1904
|
|
|
1871
1905
|
// src/components/overridable-props/indicator.tsx
|
|
1872
|
-
import * as
|
|
1906
|
+
import * as React15 from "react";
|
|
1873
1907
|
import { forwardRef } from "react";
|
|
1874
1908
|
import { CheckIcon, PlusIcon } from "@elementor/icons";
|
|
1875
1909
|
import { Box as Box8, styled as styled2 } from "@elementor/ui";
|
|
@@ -1929,17 +1963,17 @@ var Content = styled2(Box8)`
|
|
|
1929
1963
|
}
|
|
1930
1964
|
}
|
|
1931
1965
|
`;
|
|
1932
|
-
var Indicator = forwardRef(({ isOpen, isOverridable, ...props }, ref) => /* @__PURE__ */
|
|
1966
|
+
var Indicator = forwardRef(({ isOpen, isOverridable, ...props }, ref) => /* @__PURE__ */ React15.createElement(Content, { ref, ...props, className: isOpen || isOverridable ? "enlarged" : "" }, /* @__PURE__ */ React15.createElement(
|
|
1933
1967
|
IconContainer,
|
|
1934
1968
|
{
|
|
1935
1969
|
className: "icon",
|
|
1936
1970
|
"aria-label": isOverridable ? __12("Overridable property", "elementor") : __12("Make prop overridable", "elementor")
|
|
1937
1971
|
},
|
|
1938
|
-
isOverridable ? /* @__PURE__ */
|
|
1972
|
+
isOverridable ? /* @__PURE__ */ React15.createElement(CheckIcon, { fontSize: SIZE }) : /* @__PURE__ */ React15.createElement(PlusIcon, { fontSize: SIZE })
|
|
1939
1973
|
)));
|
|
1940
1974
|
|
|
1941
1975
|
// src/components/overridable-props/overridable-prop-form.tsx
|
|
1942
|
-
import * as
|
|
1976
|
+
import * as React16 from "react";
|
|
1943
1977
|
import { useState as useState4 } from "react";
|
|
1944
1978
|
import { Form as Form2, MenuListItem as MenuListItem2 } from "@elementor/editor-ui";
|
|
1945
1979
|
import { Button as Button3, FormLabel as FormLabel2, Grid as Grid2, Select, Stack as Stack7, TextField as TextField3, Typography as Typography6 } from "@elementor/ui";
|
|
@@ -1954,7 +1988,7 @@ function OverridablePropForm({ onSubmit, groups, currentValue }) {
|
|
|
1954
1988
|
const isCreate = currentValue === void 0;
|
|
1955
1989
|
const title = isCreate ? __13("Create new property", "elementor") : __13("Update property", "elementor");
|
|
1956
1990
|
const ctaLabel = isCreate ? __13("Create", "elementor") : __13("Update", "elementor");
|
|
1957
|
-
return /* @__PURE__ */
|
|
1991
|
+
return /* @__PURE__ */ React16.createElement(Form2, { onSubmit: () => onSubmit({ label: propLabel ?? "", group }) }, /* @__PURE__ */ React16.createElement(Stack7, { alignItems: "start", width: "268px" }, /* @__PURE__ */ React16.createElement(
|
|
1958
1992
|
Stack7,
|
|
1959
1993
|
{
|
|
1960
1994
|
direction: "row",
|
|
@@ -1963,8 +1997,8 @@ function OverridablePropForm({ onSubmit, groups, currentValue }) {
|
|
|
1963
1997
|
px: 1.5,
|
|
1964
1998
|
sx: { columnGap: 0.5, borderBottom: "1px solid", borderColor: "divider", width: "100%", mb: 1.5 }
|
|
1965
1999
|
},
|
|
1966
|
-
/* @__PURE__ */
|
|
1967
|
-
), /* @__PURE__ */
|
|
2000
|
+
/* @__PURE__ */ React16.createElement(Typography6, { variant: "caption", sx: { color: "text.primary", fontWeight: "500", lineHeight: 1 } }, title)
|
|
2001
|
+
), /* @__PURE__ */ React16.createElement(Grid2, { container: true, gap: 0.75, alignItems: "start", px: 1.5, mb: 1.5 }, /* @__PURE__ */ React16.createElement(Grid2, { item: true, xs: 12 }, /* @__PURE__ */ React16.createElement(FormLabel2, { size: "tiny" }, name)), /* @__PURE__ */ React16.createElement(Grid2, { item: true, xs: 12 }, /* @__PURE__ */ React16.createElement(
|
|
1968
2002
|
TextField3,
|
|
1969
2003
|
{
|
|
1970
2004
|
name,
|
|
@@ -1974,7 +2008,7 @@ function OverridablePropForm({ onSubmit, groups, currentValue }) {
|
|
|
1974
2008
|
value: propLabel ?? "",
|
|
1975
2009
|
onChange: (e) => setPropLabel(e.target.value)
|
|
1976
2010
|
}
|
|
1977
|
-
))), /* @__PURE__ */
|
|
2011
|
+
))), /* @__PURE__ */ React16.createElement(Grid2, { container: true, gap: 0.75, alignItems: "start", px: 1.5, mb: 1.5 }, /* @__PURE__ */ React16.createElement(Grid2, { item: true, xs: 12 }, /* @__PURE__ */ React16.createElement(FormLabel2, { size: "tiny" }, groupName)), /* @__PURE__ */ React16.createElement(Grid2, { item: true, xs: 12 }, /* @__PURE__ */ React16.createElement(
|
|
1978
2012
|
Select,
|
|
1979
2013
|
{
|
|
1980
2014
|
name: groupName,
|
|
@@ -1991,8 +2025,8 @@ function OverridablePropForm({ onSubmit, groups, currentValue }) {
|
|
|
1991
2025
|
return groups?.find(({ value }) => value === selectedValue)?.label ?? selectedValue;
|
|
1992
2026
|
}
|
|
1993
2027
|
},
|
|
1994
|
-
(groups ?? [DEFAULT_GROUP]).map(({ label: groupLabel, ...props }) => /* @__PURE__ */
|
|
1995
|
-
))), /* @__PURE__ */
|
|
2028
|
+
(groups ?? [DEFAULT_GROUP]).map(({ label: groupLabel, ...props }) => /* @__PURE__ */ React16.createElement(MenuListItem2, { key: props.value, ...props, value: props.value ?? "" }, groupLabel))
|
|
2029
|
+
))), /* @__PURE__ */ React16.createElement(Stack7, { direction: "row", justifyContent: "flex-end", alignSelf: "end", mt: 1.5, py: 1, px: 1.5 }, /* @__PURE__ */ React16.createElement(Button3, { type: "submit", disabled: !propLabel, variant: "contained", color: "primary", size: "small" }, ctaLabel))));
|
|
1996
2030
|
}
|
|
1997
2031
|
|
|
1998
2032
|
// src/components/overridable-props/utils/get-overridable-prop.ts
|
|
@@ -2012,15 +2046,12 @@ function getOverridableProp({
|
|
|
2012
2046
|
var FORBIDDEN_KEYS = ["_cssid", "attributes"];
|
|
2013
2047
|
function OverridablePropIndicator() {
|
|
2014
2048
|
const { bind } = useBoundProp2();
|
|
2015
|
-
const
|
|
2016
|
-
if (
|
|
2049
|
+
const componentId = selectCurrentComponentId(getState9());
|
|
2050
|
+
if (!isPropAllowed(bind) || !componentId) {
|
|
2017
2051
|
return null;
|
|
2018
2052
|
}
|
|
2019
|
-
|
|
2020
|
-
|
|
2021
|
-
}
|
|
2022
|
-
const overridableProps = selectOverridableProps(getState9(), currentDocument.id);
|
|
2023
|
-
return /* @__PURE__ */ React16.createElement(Content2, { componentId: currentDocument.id, overridableProps });
|
|
2053
|
+
const overridableProps = selectOverridableProps(getState9(), componentId);
|
|
2054
|
+
return /* @__PURE__ */ React17.createElement(Content2, { componentId, overridableProps });
|
|
2024
2055
|
}
|
|
2025
2056
|
function Content2({ componentId, overridableProps }) {
|
|
2026
2057
|
const {
|
|
@@ -2028,7 +2059,11 @@ function Content2({ componentId, overridableProps }) {
|
|
|
2028
2059
|
elementType
|
|
2029
2060
|
} = useElement2();
|
|
2030
2061
|
const { value, bind, propType } = useBoundProp2();
|
|
2031
|
-
const
|
|
2062
|
+
const contextOverridableValue = useOverridablePropValue();
|
|
2063
|
+
const { value: boundPropOverridableValue, setValue: setOverridableValue } = useBoundProp2(
|
|
2064
|
+
componentOverridablePropTypeUtil
|
|
2065
|
+
);
|
|
2066
|
+
const overridableValue = boundPropOverridableValue ?? contextOverridableValue;
|
|
2032
2067
|
const popupState = usePopupState2({
|
|
2033
2068
|
variant: "popover"
|
|
2034
2069
|
});
|
|
@@ -2057,7 +2092,7 @@ function Content2({ componentId, overridableProps }) {
|
|
|
2057
2092
|
popupState.close();
|
|
2058
2093
|
};
|
|
2059
2094
|
const overridableConfig = overridableValue ? getOverridableProp({ componentId, overrideKey: overridableValue.override_key }) : void 0;
|
|
2060
|
-
return /* @__PURE__ */
|
|
2095
|
+
return /* @__PURE__ */ React17.createElement(React17.Fragment, null, /* @__PURE__ */ React17.createElement(Tooltip2, { placement: "top", title: __14("Override Property", "elementor") }, /* @__PURE__ */ React17.createElement(Indicator, { ...triggerProps, isOpen: !!popoverProps.open, isOverridable: !!overridableValue })), /* @__PURE__ */ React17.createElement(
|
|
2061
2096
|
Popover2,
|
|
2062
2097
|
{
|
|
2063
2098
|
disableScrollLock: true,
|
|
@@ -2074,7 +2109,7 @@ function Content2({ componentId, overridableProps }) {
|
|
|
2074
2109
|
},
|
|
2075
2110
|
...popoverProps
|
|
2076
2111
|
},
|
|
2077
|
-
/* @__PURE__ */
|
|
2112
|
+
/* @__PURE__ */ React17.createElement(
|
|
2078
2113
|
OverridablePropForm,
|
|
2079
2114
|
{
|
|
2080
2115
|
onSubmit: handleSubmit,
|
|
@@ -2378,7 +2413,7 @@ function init() {
|
|
|
2378
2413
|
(options) => createComponentType({ ...options, showLockedByModal: openEditModeDialog })
|
|
2379
2414
|
);
|
|
2380
2415
|
registerDataHook("dependency", "editor/documents/close", (args) => {
|
|
2381
|
-
const document =
|
|
2416
|
+
const document = getV1CurrentDocument();
|
|
2382
2417
|
if (document.config.type === COMPONENT_DOCUMENT_TYPE) {
|
|
2383
2418
|
args.mode = "autosave";
|
|
2384
2419
|
}
|
|
@@ -2408,7 +2443,7 @@ function init() {
|
|
|
2408
2443
|
component: ComponentPanelHeader
|
|
2409
2444
|
});
|
|
2410
2445
|
registerDataHook("after", "editor/documents/attach-preview", async () => {
|
|
2411
|
-
const { id, config } =
|
|
2446
|
+
const { id, config } = getV1CurrentDocument();
|
|
2412
2447
|
if (id) {
|
|
2413
2448
|
removeComponentStyles(id);
|
|
2414
2449
|
}
|