@elementor/editor-editing-panel 1.47.0 → 1.48.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 +37 -0
- package/dist/index.js +431 -348
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +433 -354
- package/dist/index.mjs.map +1 -1
- package/package.json +13 -14
- package/src/components/style-sections/border-section/border-field.tsx +14 -7
- package/src/components/style-sections/effects-section/effects-section.tsx +12 -3
- package/src/components/style-sections/layout-section/flex-order-field.tsx +24 -18
- package/src/components/style-sections/layout-section/flex-size-field.tsx +14 -16
- package/src/components/style-sections/layout-section/layout-section.tsx +9 -2
- package/src/components/style-sections/layout-section/utils/rotated-icon.tsx +6 -1
- package/src/components/style-sections/position-section/position-section.tsx +19 -8
- package/src/components/style-sections/size-section/size-section.tsx +4 -1
- package/src/components/style-sections/typography-section/text-stroke-field.tsx +3 -1
- package/src/components/style-sections/typography-section/typography-section.tsx +6 -1
- package/src/components/style-tab.tsx +1 -1
- package/src/controls-registry/settings-field.tsx +21 -5
- package/src/controls-registry/styles-field.tsx +5 -3
- package/src/hooks/use-styles-field.ts +3 -4
- package/src/hooks/use-styles-fields.ts +141 -73
- package/src/init.ts +0 -6
package/dist/index.js
CHANGED
|
@@ -1195,7 +1195,7 @@ var import_editor_ui5 = require("@elementor/editor-ui");
|
|
|
1195
1195
|
var import_icons24 = require("@elementor/icons");
|
|
1196
1196
|
var import_session5 = require("@elementor/session");
|
|
1197
1197
|
var import_ui45 = require("@elementor/ui");
|
|
1198
|
-
var
|
|
1198
|
+
var import_i18n62 = require("@wordpress/i18n");
|
|
1199
1199
|
|
|
1200
1200
|
// src/controls-actions.ts
|
|
1201
1201
|
var import_menus = require("@elementor/menus");
|
|
@@ -1272,7 +1272,7 @@ var React85 = __toESM(require("react"));
|
|
|
1272
1272
|
var import_react38 = require("react");
|
|
1273
1273
|
var import_editor_v1_adapters18 = require("@elementor/editor-v1-adapters");
|
|
1274
1274
|
var import_ui44 = require("@elementor/ui");
|
|
1275
|
-
var
|
|
1275
|
+
var import_i18n61 = require("@wordpress/i18n");
|
|
1276
1276
|
|
|
1277
1277
|
// src/contexts/scroll-context.tsx
|
|
1278
1278
|
var React12 = __toESM(require("react"));
|
|
@@ -1431,6 +1431,7 @@ var import_react15 = require("react");
|
|
|
1431
1431
|
var import_editor_controls3 = require("@elementor/editor-controls");
|
|
1432
1432
|
var import_editor_documents2 = require("@elementor/editor-documents");
|
|
1433
1433
|
var import_editor_elements3 = require("@elementor/editor-elements");
|
|
1434
|
+
var import_editor_props3 = require("@elementor/editor-props");
|
|
1434
1435
|
var import_editor_v1_adapters3 = require("@elementor/editor-v1-adapters");
|
|
1435
1436
|
var import_i18n5 = require("@wordpress/i18n");
|
|
1436
1437
|
|
|
@@ -1450,8 +1451,8 @@ var createTopLevelOjectType = ({ schema }) => {
|
|
|
1450
1451
|
// src/controls-registry/settings-field.tsx
|
|
1451
1452
|
var SettingsField = ({ bind, children, propDisplayName }) => {
|
|
1452
1453
|
const { element, elementType } = useElement();
|
|
1453
|
-
const
|
|
1454
|
-
const value = { [bind]:
|
|
1454
|
+
const elementSettingValues = (0, import_editor_elements3.useElementSettings)(element.id, Object.keys(elementType.propsSchema));
|
|
1455
|
+
const value = { [bind]: elementSettingValues?.[bind] };
|
|
1455
1456
|
const propType = createTopLevelOjectType({ schema: elementType.propsSchema });
|
|
1456
1457
|
const undoableUpdateElementProp = useUndoableUpdateElementProp({
|
|
1457
1458
|
propKey: bind,
|
|
@@ -1466,8 +1467,19 @@ var SettingsField = ({ bind, children, propDisplayName }) => {
|
|
|
1466
1467
|
(0, import_editor_elements3.updateElementSettings)({ id: element.id, props: newValue });
|
|
1467
1468
|
}
|
|
1468
1469
|
};
|
|
1469
|
-
|
|
1470
|
+
const isDisabled = (prop) => getDisableState(prop, elementSettingValues);
|
|
1471
|
+
return /* @__PURE__ */ React15.createElement(import_editor_controls3.PropProvider, { propType, value, setValue, isDisabled }, /* @__PURE__ */ React15.createElement(import_editor_controls3.PropKeyProvider, { bind }, children));
|
|
1470
1472
|
};
|
|
1473
|
+
function getDisableState(propType, elementValues) {
|
|
1474
|
+
const disablingDependencies = propType.dependencies?.filter(({ effect }) => effect === "disable") || [];
|
|
1475
|
+
if (!disablingDependencies.length) {
|
|
1476
|
+
return false;
|
|
1477
|
+
}
|
|
1478
|
+
if (disablingDependencies.length > 1) {
|
|
1479
|
+
throw new Error("Multiple disabling dependencies are not supported.");
|
|
1480
|
+
}
|
|
1481
|
+
return (0, import_editor_props3.shouldApplyEffect)(disablingDependencies[0], elementValues);
|
|
1482
|
+
}
|
|
1471
1483
|
function useUndoableUpdateElementProp({
|
|
1472
1484
|
propKey,
|
|
1473
1485
|
elementId,
|
|
@@ -1660,17 +1672,17 @@ function populateChildControlProps(props) {
|
|
|
1660
1672
|
// src/components/style-tab.tsx
|
|
1661
1673
|
var React84 = __toESM(require("react"));
|
|
1662
1674
|
var import_react37 = require("react");
|
|
1663
|
-
var
|
|
1675
|
+
var import_editor_props11 = require("@elementor/editor-props");
|
|
1664
1676
|
var import_editor_responsive3 = require("@elementor/editor-responsive");
|
|
1665
1677
|
var import_session4 = require("@elementor/session");
|
|
1666
1678
|
var import_ui43 = require("@elementor/ui");
|
|
1667
|
-
var
|
|
1679
|
+
var import_i18n60 = require("@wordpress/i18n");
|
|
1668
1680
|
|
|
1669
1681
|
// src/contexts/styles-inheritance-context.tsx
|
|
1670
1682
|
var React20 = __toESM(require("react"));
|
|
1671
1683
|
var import_react20 = require("react");
|
|
1672
1684
|
var import_editor_elements4 = require("@elementor/editor-elements");
|
|
1673
|
-
var
|
|
1685
|
+
var import_editor_props6 = require("@elementor/editor-props");
|
|
1674
1686
|
var import_editor_responsive = require("@elementor/editor-responsive");
|
|
1675
1687
|
var import_editor_styles = require("@elementor/editor-styles");
|
|
1676
1688
|
var import_editor_styles_repository7 = require("@elementor/editor-styles-repository");
|
|
@@ -1684,10 +1696,10 @@ var useStylesRerender = () => {
|
|
|
1684
1696
|
};
|
|
1685
1697
|
|
|
1686
1698
|
// src/styles-inheritance/create-styles-inheritance.ts
|
|
1687
|
-
var
|
|
1699
|
+
var import_editor_props5 = require("@elementor/editor-props");
|
|
1688
1700
|
|
|
1689
1701
|
// src/styles-inheritance/create-snapshots-manager.ts
|
|
1690
|
-
var
|
|
1702
|
+
var import_editor_props4 = require("@elementor/editor-props");
|
|
1691
1703
|
|
|
1692
1704
|
// src/styles-inheritance/utils.ts
|
|
1693
1705
|
var DEFAULT_STATE = "normal";
|
|
@@ -1787,7 +1799,7 @@ function buildInitialSnapshotFromStyles(styles) {
|
|
|
1787
1799
|
variant: { props }
|
|
1788
1800
|
} = styleData;
|
|
1789
1801
|
Object.entries(props).forEach(([key, value]) => {
|
|
1790
|
-
const filteredValue = (0,
|
|
1802
|
+
const filteredValue = (0, import_editor_props4.filterEmptyValues)(value);
|
|
1791
1803
|
if (filteredValue === null) {
|
|
1792
1804
|
return;
|
|
1793
1805
|
}
|
|
@@ -1833,7 +1845,7 @@ function createStylesInheritance(styleDefs, breakpointsRoot) {
|
|
|
1833
1845
|
inheritanceChain = inheritanceChain.map(({ value: styleValue, ...rest }) => ({
|
|
1834
1846
|
...rest,
|
|
1835
1847
|
value: getValueByPath(styleValue, nextFields, filterPropType)
|
|
1836
|
-
})).filter(({ value: styleValue }) => !(0,
|
|
1848
|
+
})).filter(({ value: styleValue }) => !(0, import_editor_props5.isEmpty)(styleValue));
|
|
1837
1849
|
}
|
|
1838
1850
|
return inheritanceChain;
|
|
1839
1851
|
}
|
|
@@ -1875,7 +1887,7 @@ function getValueByPath(value, path, filterPropType) {
|
|
|
1875
1887
|
if (!currentScope) {
|
|
1876
1888
|
return null;
|
|
1877
1889
|
}
|
|
1878
|
-
if ((0,
|
|
1890
|
+
if ((0, import_editor_props5.isTransformable)(currentScope)) {
|
|
1879
1891
|
return currentScope.value?.[key] ?? null;
|
|
1880
1892
|
}
|
|
1881
1893
|
if (typeof currentScope === "object") {
|
|
@@ -1885,7 +1897,7 @@ function getValueByPath(value, path, filterPropType) {
|
|
|
1885
1897
|
}, value);
|
|
1886
1898
|
}
|
|
1887
1899
|
function shouldUseOriginalValue(filterPropType, value) {
|
|
1888
|
-
return !!filterPropType && (0,
|
|
1900
|
+
return !!filterPropType && (0, import_editor_props5.isTransformable)(value) && filterPropType.key !== value.$$type;
|
|
1889
1901
|
}
|
|
1890
1902
|
var getFilterPropType = (propType, path) => {
|
|
1891
1903
|
if (!propType || propType.kind !== "union") {
|
|
@@ -1943,7 +1955,7 @@ var useAppliedStyles = () => {
|
|
|
1943
1955
|
const baseStyles = useBaseStyles();
|
|
1944
1956
|
useStylesRerender();
|
|
1945
1957
|
const classesProp = (0, import_editor_elements4.useElementSetting)(element.id, currentClassesProp);
|
|
1946
|
-
const appliedStyles =
|
|
1958
|
+
const appliedStyles = import_editor_props6.classesPropTypeUtil.extract(classesProp) ?? [];
|
|
1947
1959
|
return import_editor_styles_repository7.stylesRepository.all().filter((style) => [...baseStyles, ...appliedStyles].includes(style.id));
|
|
1948
1960
|
};
|
|
1949
1961
|
var useBaseStyles = () => {
|
|
@@ -1995,39 +2007,24 @@ var import_react21 = require("react");
|
|
|
1995
2007
|
var import_editor_elements6 = require("@elementor/editor-elements");
|
|
1996
2008
|
var import_editor_styles2 = require("@elementor/editor-styles");
|
|
1997
2009
|
var import_editor_styles_repository8 = require("@elementor/editor-styles-repository");
|
|
2010
|
+
var import_editor_styles_repository9 = require("@elementor/editor-styles-repository");
|
|
1998
2011
|
var import_editor_v1_adapters6 = require("@elementor/editor-v1-adapters");
|
|
1999
2012
|
var import_i18n7 = require("@wordpress/i18n");
|
|
2000
2013
|
function useStylesFields(propNames) {
|
|
2001
|
-
const {
|
|
2002
|
-
|
|
2003
|
-
|
|
2004
|
-
const
|
|
2005
|
-
const
|
|
2014
|
+
const {
|
|
2015
|
+
element: { id: elementId }
|
|
2016
|
+
} = useElement();
|
|
2017
|
+
const { id: styleId, meta, provider, canEdit } = useStyle();
|
|
2018
|
+
const undoableUpdateStyle = useUndoableUpdateStyle({ elementId, meta });
|
|
2019
|
+
const undoableCreateElementStyle = useUndoableCreateElementStyle({ elementId, meta });
|
|
2006
2020
|
useStylesRerender();
|
|
2007
|
-
const values = getProps({
|
|
2008
|
-
|
|
2009
|
-
styleId
|
|
2010
|
-
|
|
2011
|
-
|
|
2012
|
-
|
|
2013
|
-
});
|
|
2014
|
-
const setValues = (props) => {
|
|
2015
|
-
if (id === null) {
|
|
2016
|
-
undoableCreateElementStyle({
|
|
2017
|
-
elementId: element.id,
|
|
2018
|
-
classesProp,
|
|
2019
|
-
meta,
|
|
2020
|
-
props
|
|
2021
|
-
});
|
|
2022
|
-
return;
|
|
2021
|
+
const values = getProps({ elementId, styleId, provider, meta, propNames });
|
|
2022
|
+
const setValues = (props, { history: { propDisplayName } }) => {
|
|
2023
|
+
if (styleId === null) {
|
|
2024
|
+
undoableCreateElementStyle({ props, propDisplayName });
|
|
2025
|
+
} else {
|
|
2026
|
+
undoableUpdateStyle({ provider, styleId, props, propDisplayName });
|
|
2023
2027
|
}
|
|
2024
|
-
undoableUpdateStyle({
|
|
2025
|
-
elementId: element.id,
|
|
2026
|
-
styleId: id,
|
|
2027
|
-
provider,
|
|
2028
|
-
meta,
|
|
2029
|
-
props
|
|
2030
|
-
});
|
|
2031
2028
|
};
|
|
2032
2029
|
return { values, setValues, canEdit };
|
|
2033
2030
|
}
|
|
@@ -2044,39 +2041,52 @@ function getProps({ styleId, elementId, provider, meta, propNames }) {
|
|
|
2044
2041
|
propNames.map((key) => [key, variant?.props[key] ?? null])
|
|
2045
2042
|
);
|
|
2046
2043
|
}
|
|
2047
|
-
function useUndoableCreateElementStyle(
|
|
2044
|
+
function useUndoableCreateElementStyle({
|
|
2045
|
+
elementId,
|
|
2046
|
+
meta
|
|
2047
|
+
}) {
|
|
2048
|
+
const classesProp = useClassesProp();
|
|
2048
2049
|
return (0, import_react21.useMemo)(() => {
|
|
2050
|
+
const isVersion331Active = (0, import_editor_v1_adapters6.isExperimentActive)(EXPERIMENTAL_FEATURES.V_3_31);
|
|
2051
|
+
const createStyleArgs = { elementId, classesProp, meta, label: import_editor_styles_repository9.ELEMENTS_STYLES_RESERVED_LABEL };
|
|
2049
2052
|
return (0, import_editor_v1_adapters6.undoable)(
|
|
2050
2053
|
{
|
|
2051
|
-
do: (
|
|
2052
|
-
return (0, import_editor_elements6.createElementStyle)({
|
|
2053
|
-
...payload,
|
|
2054
|
-
label: import_editor_styles_repository8.ELEMENTS_STYLES_RESERVED_LABEL
|
|
2055
|
-
});
|
|
2054
|
+
do: ({ props }) => {
|
|
2055
|
+
return (0, import_editor_elements6.createElementStyle)({ ...createStyleArgs, props });
|
|
2056
2056
|
},
|
|
2057
|
-
undo: (
|
|
2057
|
+
undo: (_, styleId) => {
|
|
2058
2058
|
(0, import_editor_elements6.deleteElementStyle)(elementId, styleId);
|
|
2059
2059
|
},
|
|
2060
|
-
redo: (
|
|
2061
|
-
return (0, import_editor_elements6.createElementStyle)({
|
|
2062
|
-
...payload,
|
|
2063
|
-
styleId,
|
|
2064
|
-
label: import_editor_styles_repository8.ELEMENTS_STYLES_RESERVED_LABEL
|
|
2065
|
-
});
|
|
2060
|
+
redo: ({ props }, styleId) => {
|
|
2061
|
+
return (0, import_editor_elements6.createElementStyle)({ ...createStyleArgs, props, styleId });
|
|
2066
2062
|
}
|
|
2067
2063
|
},
|
|
2068
2064
|
{
|
|
2069
|
-
title: (
|
|
2070
|
-
|
|
2065
|
+
title: () => {
|
|
2066
|
+
if (isVersion331Active) {
|
|
2067
|
+
return localStyleHistoryTitlesV331.title({ elementId });
|
|
2068
|
+
}
|
|
2069
|
+
return historyTitlesV330.title({ elementId });
|
|
2070
|
+
},
|
|
2071
|
+
subtitle: ({ propDisplayName }) => {
|
|
2072
|
+
if (isVersion331Active) {
|
|
2073
|
+
return localStyleHistoryTitlesV331.subtitle({ propDisplayName });
|
|
2074
|
+
}
|
|
2075
|
+
return historyTitlesV330.subtitle;
|
|
2076
|
+
}
|
|
2071
2077
|
}
|
|
2072
2078
|
);
|
|
2073
|
-
}, []);
|
|
2079
|
+
}, [classesProp, elementId, meta]);
|
|
2074
2080
|
}
|
|
2075
|
-
function useUndoableUpdateStyle(
|
|
2081
|
+
function useUndoableUpdateStyle({
|
|
2082
|
+
elementId,
|
|
2083
|
+
meta
|
|
2084
|
+
}) {
|
|
2076
2085
|
return (0, import_react21.useMemo)(() => {
|
|
2086
|
+
const isVersion331Active = (0, import_editor_v1_adapters6.isExperimentActive)(EXPERIMENTAL_FEATURES.V_3_31);
|
|
2077
2087
|
return (0, import_editor_v1_adapters6.undoable)(
|
|
2078
2088
|
{
|
|
2079
|
-
do: ({
|
|
2089
|
+
do: ({ provider, styleId, props }) => {
|
|
2080
2090
|
if (!provider.actions.updateProps) {
|
|
2081
2091
|
throw new StylesProviderCannotUpdatePropsError({
|
|
2082
2092
|
context: { providerKey: provider.getKey() }
|
|
@@ -2084,26 +2094,37 @@ function useUndoableUpdateStyle() {
|
|
|
2084
2094
|
}
|
|
2085
2095
|
const style = provider.actions.get(styleId, { elementId });
|
|
2086
2096
|
const prevProps = getCurrentProps(style, meta);
|
|
2087
|
-
provider.actions.updateProps(
|
|
2088
|
-
{
|
|
2089
|
-
id: styleId,
|
|
2090
|
-
meta,
|
|
2091
|
-
props
|
|
2092
|
-
},
|
|
2093
|
-
{ elementId }
|
|
2094
|
-
);
|
|
2097
|
+
provider.actions.updateProps({ id: styleId, meta, props }, { elementId });
|
|
2095
2098
|
return prevProps;
|
|
2096
2099
|
},
|
|
2097
|
-
undo: ({
|
|
2100
|
+
undo: ({ provider, styleId }, prevProps) => {
|
|
2098
2101
|
provider.actions.updateProps?.({ id: styleId, meta, props: prevProps }, { elementId });
|
|
2099
2102
|
}
|
|
2100
2103
|
},
|
|
2101
2104
|
{
|
|
2102
|
-
title: ({
|
|
2103
|
-
|
|
2105
|
+
title: ({ provider }) => {
|
|
2106
|
+
if (isVersion331Active) {
|
|
2107
|
+
const isLocal = (0, import_editor_styles_repository8.isElementsStylesProvider)(provider.getKey());
|
|
2108
|
+
if (isLocal) {
|
|
2109
|
+
return localStyleHistoryTitlesV331.title({ elementId });
|
|
2110
|
+
}
|
|
2111
|
+
return defaultHistoryTitlesV331.title({ provider });
|
|
2112
|
+
}
|
|
2113
|
+
return historyTitlesV330.title({ elementId });
|
|
2114
|
+
},
|
|
2115
|
+
subtitle: ({ provider, styleId, propDisplayName }) => {
|
|
2116
|
+
if (isVersion331Active) {
|
|
2117
|
+
const isLocal = (0, import_editor_styles_repository8.isElementsStylesProvider)(provider.getKey());
|
|
2118
|
+
if (isLocal) {
|
|
2119
|
+
return localStyleHistoryTitlesV331.subtitle({ propDisplayName });
|
|
2120
|
+
}
|
|
2121
|
+
return defaultHistoryTitlesV331.subtitle({ provider, styleId, elementId, propDisplayName });
|
|
2122
|
+
}
|
|
2123
|
+
return historyTitlesV330.subtitle;
|
|
2124
|
+
}
|
|
2104
2125
|
}
|
|
2105
2126
|
);
|
|
2106
|
-
}, []);
|
|
2127
|
+
}, [elementId, meta]);
|
|
2107
2128
|
}
|
|
2108
2129
|
function getCurrentProps(style, meta) {
|
|
2109
2130
|
if (!style) {
|
|
@@ -2113,15 +2134,40 @@ function getCurrentProps(style, meta) {
|
|
|
2113
2134
|
const props = variant?.props ?? {};
|
|
2114
2135
|
return structuredClone(props);
|
|
2115
2136
|
}
|
|
2137
|
+
var historyTitlesV330 = {
|
|
2138
|
+
title: ({ elementId }) => (0, import_editor_elements6.getElementLabel)(elementId),
|
|
2139
|
+
subtitle: (0, import_i18n7.__)("Style edited", "elementor")
|
|
2140
|
+
};
|
|
2141
|
+
var defaultHistoryTitlesV331 = {
|
|
2142
|
+
title: ({ provider }) => {
|
|
2143
|
+
const providerLabel = provider.labels?.singular;
|
|
2144
|
+
return providerLabel ? capitalize(providerLabel) : (0, import_i18n7.__)("Style", "elementor");
|
|
2145
|
+
},
|
|
2146
|
+
subtitle: ({ provider, styleId, elementId, propDisplayName }) => {
|
|
2147
|
+
const styleLabel = provider.actions.get(styleId, { elementId })?.label;
|
|
2148
|
+
if (!styleLabel) {
|
|
2149
|
+
throw new Error(`Style ${styleId} not found`);
|
|
2150
|
+
}
|
|
2151
|
+
return (0, import_i18n7.__)(`%s$1 %s$2 edited`, "elementor").replace("%s$1", styleLabel).replace("%s$2", propDisplayName);
|
|
2152
|
+
}
|
|
2153
|
+
};
|
|
2154
|
+
var localStyleHistoryTitlesV331 = {
|
|
2155
|
+
title: ({ elementId }) => (0, import_editor_elements6.getElementLabel)(elementId),
|
|
2156
|
+
subtitle: ({ propDisplayName }) => (
|
|
2157
|
+
// translators: %s is the name of the style property being edited
|
|
2158
|
+
(0, import_i18n7.__)(`%s edited`, "elementor").replace("%s", propDisplayName)
|
|
2159
|
+
)
|
|
2160
|
+
};
|
|
2161
|
+
function capitalize(str) {
|
|
2162
|
+
return str.charAt(0).toUpperCase() + str.slice(1);
|
|
2163
|
+
}
|
|
2116
2164
|
|
|
2117
2165
|
// src/hooks/use-styles-field.ts
|
|
2118
|
-
function useStylesField(propName) {
|
|
2166
|
+
function useStylesField(propName, meta) {
|
|
2119
2167
|
const { values, setValues, canEdit } = useStylesFields([propName]);
|
|
2120
2168
|
const value = values?.[propName] ?? null;
|
|
2121
2169
|
const setValue = (newValue) => {
|
|
2122
|
-
setValues({
|
|
2123
|
-
[propName]: newValue
|
|
2124
|
-
});
|
|
2170
|
+
setValues({ [propName]: newValue }, meta);
|
|
2125
2171
|
};
|
|
2126
2172
|
return { value, setValue, canEdit };
|
|
2127
2173
|
}
|
|
@@ -2129,8 +2175,8 @@ function useStylesField(propName) {
|
|
|
2129
2175
|
// src/styles-inheritance/components/styles-inheritance-indicator.tsx
|
|
2130
2176
|
var React26 = __toESM(require("react"));
|
|
2131
2177
|
var import_editor_controls5 = require("@elementor/editor-controls");
|
|
2132
|
-
var
|
|
2133
|
-
var
|
|
2178
|
+
var import_editor_props7 = require("@elementor/editor-props");
|
|
2179
|
+
var import_editor_styles_repository12 = require("@elementor/editor-styles-repository");
|
|
2134
2180
|
var import_editor_v1_adapters8 = require("@elementor/editor-v1-adapters");
|
|
2135
2181
|
var import_ui23 = require("@elementor/ui");
|
|
2136
2182
|
var import_i18n11 = require("@wordpress/i18n");
|
|
@@ -2181,7 +2227,7 @@ function useDirection() {
|
|
|
2181
2227
|
|
|
2182
2228
|
// src/styles-inheritance/hooks/use-normalized-inheritance-chain-items.tsx
|
|
2183
2229
|
var import_react22 = require("react");
|
|
2184
|
-
var
|
|
2230
|
+
var import_editor_styles_repository10 = require("@elementor/editor-styles-repository");
|
|
2185
2231
|
var import_i18n8 = require("@wordpress/i18n");
|
|
2186
2232
|
var MAXIMUM_ITEMS = 2;
|
|
2187
2233
|
var useNormalizedInheritanceChainItems = (inheritanceChain, bind, resolve) => {
|
|
@@ -2193,7 +2239,7 @@ var useNormalizedInheritanceChainItems = (inheritanceChain, bind, resolve) => {
|
|
|
2193
2239
|
);
|
|
2194
2240
|
const validItems = normalizedItems.map((item) => ({
|
|
2195
2241
|
...item,
|
|
2196
|
-
displayLabel:
|
|
2242
|
+
displayLabel: import_editor_styles_repository10.ELEMENTS_BASE_STYLES_PROVIDER_KEY !== item.provider ? item.displayLabel : (0, import_i18n8.__)("Base", "elementor")
|
|
2197
2243
|
})).filter((item) => !item.value || item.displayLabel !== "").slice(0, MAXIMUM_ITEMS);
|
|
2198
2244
|
setItems(validItems);
|
|
2199
2245
|
})();
|
|
@@ -2270,13 +2316,13 @@ var BreakpointIcon = ({ breakpoint }) => {
|
|
|
2270
2316
|
|
|
2271
2317
|
// src/styles-inheritance/components/infotip/label-chip.tsx
|
|
2272
2318
|
var React22 = __toESM(require("react"));
|
|
2273
|
-
var
|
|
2319
|
+
var import_editor_styles_repository11 = require("@elementor/editor-styles-repository");
|
|
2274
2320
|
var import_icons5 = require("@elementor/icons");
|
|
2275
2321
|
var import_ui19 = require("@elementor/ui");
|
|
2276
2322
|
var import_i18n9 = require("@wordpress/i18n");
|
|
2277
2323
|
var SIZE4 = "tiny";
|
|
2278
2324
|
var LabelChip = ({ displayLabel, provider }) => {
|
|
2279
|
-
const isBaseStyle = provider ===
|
|
2325
|
+
const isBaseStyle = provider === import_editor_styles_repository11.ELEMENTS_BASE_STYLES_PROVIDER_KEY;
|
|
2280
2326
|
const chipIcon = isBaseStyle ? /* @__PURE__ */ React22.createElement(import_ui19.Tooltip, { title: (0, import_i18n9.__)("Inherited from base styles", "elementor"), placement: "top" }, /* @__PURE__ */ React22.createElement(import_icons5.InfoCircleIcon, { fontSize: SIZE4 })) : void 0;
|
|
2281
2327
|
return /* @__PURE__ */ React22.createElement(
|
|
2282
2328
|
import_ui19.Chip,
|
|
@@ -2460,9 +2506,9 @@ var StylesInheritanceIndicator = () => {
|
|
|
2460
2506
|
var Indicator = ({ inheritanceChain, path, propType }) => {
|
|
2461
2507
|
const { id: currentStyleId, provider: currentStyleProvider, meta: currentStyleMeta } = useStyle();
|
|
2462
2508
|
const currentItem = currentStyleId ? getValueFromInheritanceChain(inheritanceChain, currentStyleId, currentStyleMeta) : null;
|
|
2463
|
-
const hasValue = !(0,
|
|
2509
|
+
const hasValue = !(0, import_editor_props7.isEmpty)(currentItem?.value);
|
|
2464
2510
|
const [actualStyle] = inheritanceChain;
|
|
2465
|
-
if (!(0, import_editor_v1_adapters8.isExperimentActive)(EXPERIMENTAL_FEATURES.V_3_31) && actualStyle.provider ===
|
|
2511
|
+
if (!(0, import_editor_v1_adapters8.isExperimentActive)(EXPERIMENTAL_FEATURES.V_3_31) && actualStyle.provider === import_editor_styles_repository12.ELEMENTS_BASE_STYLES_PROVIDER_KEY) {
|
|
2466
2512
|
return null;
|
|
2467
2513
|
}
|
|
2468
2514
|
const isFinalValue = currentItem === actualStyle;
|
|
@@ -2496,8 +2542,10 @@ var getLabel = ({ isFinalValue, hasValue }) => {
|
|
|
2496
2542
|
};
|
|
2497
2543
|
|
|
2498
2544
|
// src/controls-registry/styles-field.tsx
|
|
2499
|
-
var StylesField = ({ bind, placeholder, children }) => {
|
|
2500
|
-
const { value, setValue, canEdit } = useStylesField(bind
|
|
2545
|
+
var StylesField = ({ bind, placeholder, propDisplayName, children }) => {
|
|
2546
|
+
const { value, setValue, canEdit } = useStylesField(bind, {
|
|
2547
|
+
history: { propDisplayName }
|
|
2548
|
+
});
|
|
2501
2549
|
const isVersion331Active = (0, import_editor_v1_adapters9.isExperimentActive)("e_v_3_31");
|
|
2502
2550
|
const stylesInheritanceChain = useStylesInheritanceChain([bind]);
|
|
2503
2551
|
const stylesSchema = (0, import_editor_styles3.getStylesSchema)();
|
|
@@ -2527,7 +2575,7 @@ var StylesField = ({ bind, placeholder, children }) => {
|
|
|
2527
2575
|
value: values,
|
|
2528
2576
|
setValue: setValues,
|
|
2529
2577
|
placeholder: placeholderValues,
|
|
2530
|
-
|
|
2578
|
+
isDisabled: () => !canEdit
|
|
2531
2579
|
},
|
|
2532
2580
|
/* @__PURE__ */ React27.createElement(import_editor_controls6.PropKeyProvider, { bind }, children)
|
|
2533
2581
|
)
|
|
@@ -2655,7 +2703,7 @@ var BorderStyleField = () => /* @__PURE__ */ React35.createElement(StylesField,
|
|
|
2655
2703
|
// src/components/style-sections/border-section/border-width-field.tsx
|
|
2656
2704
|
var React36 = __toESM(require("react"));
|
|
2657
2705
|
var import_editor_controls11 = require("@elementor/editor-controls");
|
|
2658
|
-
var
|
|
2706
|
+
var import_editor_props8 = require("@elementor/editor-props");
|
|
2659
2707
|
var import_icons7 = require("@elementor/icons");
|
|
2660
2708
|
var import_ui29 = require("@elementor/ui");
|
|
2661
2709
|
var import_i18n15 = require("@wordpress/i18n");
|
|
@@ -2693,12 +2741,13 @@ var BorderWidthField = () => {
|
|
|
2693
2741
|
label: BORDER_WIDTH_LABEL,
|
|
2694
2742
|
icon: /* @__PURE__ */ React36.createElement(import_icons7.SideAllIcon, { fontSize: "tiny" }),
|
|
2695
2743
|
tooltipLabel: (0, import_i18n15.__)("Adjust borders", "elementor"),
|
|
2696
|
-
multiSizePropTypeUtil:
|
|
2744
|
+
multiSizePropTypeUtil: import_editor_props8.borderWidthPropTypeUtil
|
|
2697
2745
|
}
|
|
2698
2746
|
));
|
|
2699
2747
|
};
|
|
2700
2748
|
|
|
2701
2749
|
// src/components/style-sections/border-section/border-field.tsx
|
|
2750
|
+
var BORDER_LABEL = (0, import_i18n16.__)("Border", "elementor");
|
|
2702
2751
|
var initialBorder = {
|
|
2703
2752
|
"border-width": { $$type: "size", value: { size: 1, unit: "px" } },
|
|
2704
2753
|
"border-color": { $$type: "color", value: "#000000" },
|
|
@@ -2706,15 +2755,19 @@ var initialBorder = {
|
|
|
2706
2755
|
};
|
|
2707
2756
|
var BorderField = () => {
|
|
2708
2757
|
const { values, setValues, canEdit } = useStylesFields(Object.keys(initialBorder));
|
|
2758
|
+
const meta = { history: { propDisplayName: BORDER_LABEL } };
|
|
2709
2759
|
const addBorder = () => {
|
|
2710
|
-
setValues(initialBorder);
|
|
2760
|
+
setValues(initialBorder, meta);
|
|
2711
2761
|
};
|
|
2712
2762
|
const removeBorder = () => {
|
|
2713
|
-
setValues(
|
|
2714
|
-
|
|
2715
|
-
|
|
2716
|
-
|
|
2717
|
-
|
|
2763
|
+
setValues(
|
|
2764
|
+
{
|
|
2765
|
+
"border-width": null,
|
|
2766
|
+
"border-color": null,
|
|
2767
|
+
"border-style": null
|
|
2768
|
+
},
|
|
2769
|
+
meta
|
|
2770
|
+
);
|
|
2718
2771
|
};
|
|
2719
2772
|
const hasBorder = Object.values(values ?? {}).some(Boolean);
|
|
2720
2773
|
return /* @__PURE__ */ React37.createElement(
|
|
@@ -2724,7 +2777,7 @@ var BorderField = () => {
|
|
|
2724
2777
|
onAdd: addBorder,
|
|
2725
2778
|
onRemove: removeBorder,
|
|
2726
2779
|
disabled: !canEdit,
|
|
2727
|
-
renderLabel: () => /* @__PURE__ */ React37.createElement(import_editor_controls12.ControlFormLabel, null,
|
|
2780
|
+
renderLabel: () => /* @__PURE__ */ React37.createElement(import_editor_controls12.ControlFormLabel, null, BORDER_LABEL)
|
|
2728
2781
|
},
|
|
2729
2782
|
/* @__PURE__ */ React37.createElement(BorderWidthField, null),
|
|
2730
2783
|
/* @__PURE__ */ React37.createElement(BorderColorField, null),
|
|
@@ -2735,7 +2788,7 @@ var BorderField = () => {
|
|
|
2735
2788
|
// src/components/style-sections/border-section/border-radius-field.tsx
|
|
2736
2789
|
var React39 = __toESM(require("react"));
|
|
2737
2790
|
var import_editor_controls13 = require("@elementor/editor-controls");
|
|
2738
|
-
var
|
|
2791
|
+
var import_editor_props9 = require("@elementor/editor-props");
|
|
2739
2792
|
var import_icons8 = require("@elementor/icons");
|
|
2740
2793
|
var import_ui31 = require("@elementor/ui");
|
|
2741
2794
|
var import_i18n17 = require("@wordpress/i18n");
|
|
@@ -2789,7 +2842,7 @@ var BorderRadiusField = () => {
|
|
|
2789
2842
|
label: BORDER_RADIUS_LABEL,
|
|
2790
2843
|
icon: /* @__PURE__ */ React39.createElement(import_icons8.BorderCornersIcon, { fontSize: "tiny" }),
|
|
2791
2844
|
tooltipLabel: (0, import_i18n17.__)("Adjust corners", "elementor"),
|
|
2792
|
-
multiSizePropTypeUtil:
|
|
2845
|
+
multiSizePropTypeUtil: import_editor_props9.borderRadiusPropTypeUtil
|
|
2793
2846
|
}
|
|
2794
2847
|
)));
|
|
2795
2848
|
};
|
|
@@ -2817,16 +2870,17 @@ var OpacityControlField = () => {
|
|
|
2817
2870
|
// src/components/style-sections/effects-section/effects-section.tsx
|
|
2818
2871
|
var BOX_SHADOW_LABEL = (0, import_i18n19.__)("Box shadow", "elementor");
|
|
2819
2872
|
var FILTER_LABEL = (0, import_i18n19.__)("Filter", "elementor");
|
|
2873
|
+
var TRANSFORM_LABEL = (0, import_i18n19.__)("Transform", "elementor");
|
|
2820
2874
|
var EffectsSection = () => {
|
|
2821
2875
|
const isVersion331Active = (0, import_editor_v1_adapters10.isExperimentActive)(EXPERIMENTAL_FEATURES.V_3_31);
|
|
2822
|
-
return /* @__PURE__ */ React42.createElement(SectionContent, null, /* @__PURE__ */ React42.createElement(OpacityControlField, null), /* @__PURE__ */ React42.createElement(PanelDivider, null), /* @__PURE__ */ React42.createElement(StylesField, { bind: "box-shadow", propDisplayName: BOX_SHADOW_LABEL }, /* @__PURE__ */ React42.createElement(import_editor_controls15.BoxShadowRepeaterControl, null)), isVersion331Active && /* @__PURE__ */ React42.createElement(React42.Fragment, null, /* @__PURE__ */ React42.createElement(PanelDivider, null), /* @__PURE__ */ React42.createElement(StylesField, { bind: "filter", propDisplayName: FILTER_LABEL }, /* @__PURE__ */ React42.createElement(import_editor_controls15.FilterRepeaterControl, null))));
|
|
2876
|
+
return /* @__PURE__ */ React42.createElement(SectionContent, null, isVersion331Active && /* @__PURE__ */ React42.createElement(React42.Fragment, null, /* @__PURE__ */ React42.createElement(OpacityControlField, null), /* @__PURE__ */ React42.createElement(PanelDivider, null)), /* @__PURE__ */ React42.createElement(StylesField, { bind: "box-shadow", propDisplayName: BOX_SHADOW_LABEL }, /* @__PURE__ */ React42.createElement(import_editor_controls15.BoxShadowRepeaterControl, null)), isVersion331Active && /* @__PURE__ */ React42.createElement(React42.Fragment, null, /* @__PURE__ */ React42.createElement(PanelDivider, null), /* @__PURE__ */ React42.createElement(StylesField, { bind: "transform", propDisplayName: TRANSFORM_LABEL }, /* @__PURE__ */ React42.createElement(import_editor_controls15.TransformRepeaterControl, null)), /* @__PURE__ */ React42.createElement(PanelDivider, null), /* @__PURE__ */ React42.createElement(StylesField, { bind: "filter", propDisplayName: FILTER_LABEL }, /* @__PURE__ */ React42.createElement(import_editor_controls15.FilterRepeaterControl, null))));
|
|
2823
2877
|
};
|
|
2824
2878
|
|
|
2825
2879
|
// src/components/style-sections/layout-section/layout-section.tsx
|
|
2826
2880
|
var React54 = __toESM(require("react"));
|
|
2827
2881
|
var import_editor_controls26 = require("@elementor/editor-controls");
|
|
2828
2882
|
var import_editor_elements7 = require("@elementor/editor-elements");
|
|
2829
|
-
var
|
|
2883
|
+
var import_i18n31 = require("@wordpress/i18n");
|
|
2830
2884
|
|
|
2831
2885
|
// src/hooks/use-computed-style.ts
|
|
2832
2886
|
var import_editor_v1_adapters11 = require("@elementor/editor-v1-adapters");
|
|
@@ -2858,12 +2912,14 @@ var React44 = __toESM(require("react"));
|
|
|
2858
2912
|
var import_editor_controls16 = require("@elementor/editor-controls");
|
|
2859
2913
|
var import_icons9 = require("@elementor/icons");
|
|
2860
2914
|
var import_ui33 = require("@elementor/ui");
|
|
2861
|
-
var
|
|
2915
|
+
var import_i18n21 = require("@wordpress/i18n");
|
|
2862
2916
|
|
|
2863
2917
|
// src/components/style-sections/layout-section/utils/rotated-icon.tsx
|
|
2864
2918
|
var React43 = __toESM(require("react"));
|
|
2865
2919
|
var import_react25 = require("react");
|
|
2866
2920
|
var import_ui32 = require("@elementor/ui");
|
|
2921
|
+
var import_i18n20 = require("@wordpress/i18n");
|
|
2922
|
+
var FLEX_DIRECTION_LABEL = (0, import_i18n20.__)("Flex direction", "elementor");
|
|
2867
2923
|
var CLOCKWISE_ANGLES = {
|
|
2868
2924
|
row: 0,
|
|
2869
2925
|
column: 90,
|
|
@@ -2888,7 +2944,9 @@ var RotatedIcon = ({
|
|
|
2888
2944
|
return /* @__PURE__ */ React43.createElement(Icon, { fontSize: size, sx: { transition: ".3s", rotate: `${rotate.current}deg` } });
|
|
2889
2945
|
};
|
|
2890
2946
|
var useGetTargetAngle = (isClockwise, offset, disableRotationForReversed, existingRef) => {
|
|
2891
|
-
const { value: direction } = useStylesField("flex-direction"
|
|
2947
|
+
const { value: direction } = useStylesField("flex-direction", {
|
|
2948
|
+
history: { propDisplayName: FLEX_DIRECTION_LABEL }
|
|
2949
|
+
});
|
|
2892
2950
|
const isRtl = "rtl" === (0, import_ui32.useTheme)().direction;
|
|
2893
2951
|
const rotationMultiplier = isRtl ? -1 : 1;
|
|
2894
2952
|
const angleMap = isClockwise ? CLOCKWISE_ANGLES : COUNTER_CLOCKWISE_ANGLES;
|
|
@@ -2904,7 +2962,7 @@ var useGetTargetAngle = (isClockwise, offset, disableRotationForReversed, existi
|
|
|
2904
2962
|
};
|
|
2905
2963
|
|
|
2906
2964
|
// src/components/style-sections/layout-section/align-content-field.tsx
|
|
2907
|
-
var ALIGN_CONTENT_LABEL = (0,
|
|
2965
|
+
var ALIGN_CONTENT_LABEL = (0, import_i18n21.__)("Align content", "elementor");
|
|
2908
2966
|
var StartIcon = (0, import_ui33.withDirection)(import_icons9.JustifyTopIcon);
|
|
2909
2967
|
var EndIcon = (0, import_ui33.withDirection)(import_icons9.JustifyBottomIcon);
|
|
2910
2968
|
var iconProps = {
|
|
@@ -2915,37 +2973,37 @@ var iconProps = {
|
|
|
2915
2973
|
var options = [
|
|
2916
2974
|
{
|
|
2917
2975
|
value: "start",
|
|
2918
|
-
label: (0,
|
|
2976
|
+
label: (0, import_i18n21.__)("Start", "elementor"),
|
|
2919
2977
|
renderContent: ({ size }) => /* @__PURE__ */ React44.createElement(RotatedIcon, { icon: StartIcon, size, ...iconProps }),
|
|
2920
2978
|
showTooltip: true
|
|
2921
2979
|
},
|
|
2922
2980
|
{
|
|
2923
2981
|
value: "center",
|
|
2924
|
-
label: (0,
|
|
2982
|
+
label: (0, import_i18n21.__)("Center", "elementor"),
|
|
2925
2983
|
renderContent: ({ size }) => /* @__PURE__ */ React44.createElement(RotatedIcon, { icon: import_icons9.JustifyCenterIcon, size, ...iconProps }),
|
|
2926
2984
|
showTooltip: true
|
|
2927
2985
|
},
|
|
2928
2986
|
{
|
|
2929
2987
|
value: "end",
|
|
2930
|
-
label: (0,
|
|
2988
|
+
label: (0, import_i18n21.__)("End", "elementor"),
|
|
2931
2989
|
renderContent: ({ size }) => /* @__PURE__ */ React44.createElement(RotatedIcon, { icon: EndIcon, size, ...iconProps }),
|
|
2932
2990
|
showTooltip: true
|
|
2933
2991
|
},
|
|
2934
2992
|
{
|
|
2935
2993
|
value: "space-between",
|
|
2936
|
-
label: (0,
|
|
2994
|
+
label: (0, import_i18n21.__)("Space between", "elementor"),
|
|
2937
2995
|
renderContent: ({ size }) => /* @__PURE__ */ React44.createElement(RotatedIcon, { icon: import_icons9.JustifySpaceBetweenVerticalIcon, size, ...iconProps }),
|
|
2938
2996
|
showTooltip: true
|
|
2939
2997
|
},
|
|
2940
2998
|
{
|
|
2941
2999
|
value: "space-around",
|
|
2942
|
-
label: (0,
|
|
3000
|
+
label: (0, import_i18n21.__)("Space around", "elementor"),
|
|
2943
3001
|
renderContent: ({ size }) => /* @__PURE__ */ React44.createElement(RotatedIcon, { icon: import_icons9.JustifySpaceAroundVerticalIcon, size, ...iconProps }),
|
|
2944
3002
|
showTooltip: true
|
|
2945
3003
|
},
|
|
2946
3004
|
{
|
|
2947
3005
|
value: "space-evenly",
|
|
2948
|
-
label: (0,
|
|
3006
|
+
label: (0, import_i18n21.__)("Space evenly", "elementor"),
|
|
2949
3007
|
renderContent: ({ size }) => /* @__PURE__ */ React44.createElement(RotatedIcon, { icon: import_icons9.JustifyDistributeVerticalIcon, size, ...iconProps }),
|
|
2950
3008
|
showTooltip: true
|
|
2951
3009
|
}
|
|
@@ -2957,8 +3015,8 @@ var React45 = __toESM(require("react"));
|
|
|
2957
3015
|
var import_editor_controls17 = require("@elementor/editor-controls");
|
|
2958
3016
|
var import_icons10 = require("@elementor/icons");
|
|
2959
3017
|
var import_ui34 = require("@elementor/ui");
|
|
2960
|
-
var
|
|
2961
|
-
var ALIGN_ITEMS_LABEL = (0,
|
|
3018
|
+
var import_i18n22 = require("@wordpress/i18n");
|
|
3019
|
+
var ALIGN_ITEMS_LABEL = (0, import_i18n22.__)("Align items", "elementor");
|
|
2962
3020
|
var StartIcon2 = (0, import_ui34.withDirection)(import_icons10.LayoutAlignLeftIcon);
|
|
2963
3021
|
var EndIcon2 = (0, import_ui34.withDirection)(import_icons10.LayoutAlignRightIcon);
|
|
2964
3022
|
var iconProps2 = {
|
|
@@ -2968,25 +3026,25 @@ var iconProps2 = {
|
|
|
2968
3026
|
var options2 = [
|
|
2969
3027
|
{
|
|
2970
3028
|
value: "start",
|
|
2971
|
-
label: (0,
|
|
3029
|
+
label: (0, import_i18n22.__)("Start", "elementor"),
|
|
2972
3030
|
renderContent: ({ size }) => /* @__PURE__ */ React45.createElement(RotatedIcon, { icon: StartIcon2, size, ...iconProps2 }),
|
|
2973
3031
|
showTooltip: true
|
|
2974
3032
|
},
|
|
2975
3033
|
{
|
|
2976
3034
|
value: "center",
|
|
2977
|
-
label: (0,
|
|
3035
|
+
label: (0, import_i18n22.__)("Center", "elementor"),
|
|
2978
3036
|
renderContent: ({ size }) => /* @__PURE__ */ React45.createElement(RotatedIcon, { icon: import_icons10.LayoutAlignCenterIcon, size, ...iconProps2 }),
|
|
2979
3037
|
showTooltip: true
|
|
2980
3038
|
},
|
|
2981
3039
|
{
|
|
2982
3040
|
value: "end",
|
|
2983
|
-
label: (0,
|
|
3041
|
+
label: (0, import_i18n22.__)("End", "elementor"),
|
|
2984
3042
|
renderContent: ({ size }) => /* @__PURE__ */ React45.createElement(RotatedIcon, { icon: EndIcon2, size, ...iconProps2 }),
|
|
2985
3043
|
showTooltip: true
|
|
2986
3044
|
},
|
|
2987
3045
|
{
|
|
2988
3046
|
value: "stretch",
|
|
2989
|
-
label: (0,
|
|
3047
|
+
label: (0, import_i18n22.__)("Stretch", "elementor"),
|
|
2990
3048
|
renderContent: ({ size }) => /* @__PURE__ */ React45.createElement(RotatedIcon, { icon: import_icons10.LayoutDistributeVerticalIcon, size, ...iconProps2 }),
|
|
2991
3049
|
showTooltip: true
|
|
2992
3050
|
}
|
|
@@ -3000,8 +3058,8 @@ var React46 = __toESM(require("react"));
|
|
|
3000
3058
|
var import_editor_controls18 = require("@elementor/editor-controls");
|
|
3001
3059
|
var import_icons11 = require("@elementor/icons");
|
|
3002
3060
|
var import_ui35 = require("@elementor/ui");
|
|
3003
|
-
var
|
|
3004
|
-
var ALIGN_SELF_LABEL = (0,
|
|
3061
|
+
var import_i18n23 = require("@wordpress/i18n");
|
|
3062
|
+
var ALIGN_SELF_LABEL = (0, import_i18n23.__)("Align self", "elementor");
|
|
3005
3063
|
var ALIGN_SELF_CHILD_OFFSET_MAP = {
|
|
3006
3064
|
row: 90,
|
|
3007
3065
|
"row-reverse": 90,
|
|
@@ -3016,7 +3074,7 @@ var iconProps3 = {
|
|
|
3016
3074
|
var getOptions = (parentStyleDirection) => [
|
|
3017
3075
|
{
|
|
3018
3076
|
value: "start",
|
|
3019
|
-
label: (0,
|
|
3077
|
+
label: (0, import_i18n23.__)("Start", "elementor"),
|
|
3020
3078
|
renderContent: ({ size }) => /* @__PURE__ */ React46.createElement(
|
|
3021
3079
|
RotatedIcon,
|
|
3022
3080
|
{
|
|
@@ -3030,7 +3088,7 @@ var getOptions = (parentStyleDirection) => [
|
|
|
3030
3088
|
},
|
|
3031
3089
|
{
|
|
3032
3090
|
value: "center",
|
|
3033
|
-
label: (0,
|
|
3091
|
+
label: (0, import_i18n23.__)("Center", "elementor"),
|
|
3034
3092
|
renderContent: ({ size }) => /* @__PURE__ */ React46.createElement(
|
|
3035
3093
|
RotatedIcon,
|
|
3036
3094
|
{
|
|
@@ -3044,7 +3102,7 @@ var getOptions = (parentStyleDirection) => [
|
|
|
3044
3102
|
},
|
|
3045
3103
|
{
|
|
3046
3104
|
value: "end",
|
|
3047
|
-
label: (0,
|
|
3105
|
+
label: (0, import_i18n23.__)("End", "elementor"),
|
|
3048
3106
|
renderContent: ({ size }) => /* @__PURE__ */ React46.createElement(
|
|
3049
3107
|
RotatedIcon,
|
|
3050
3108
|
{
|
|
@@ -3058,7 +3116,7 @@ var getOptions = (parentStyleDirection) => [
|
|
|
3058
3116
|
},
|
|
3059
3117
|
{
|
|
3060
3118
|
value: "stretch",
|
|
3061
|
-
label: (0,
|
|
3119
|
+
label: (0, import_i18n23.__)("Stretch", "elementor"),
|
|
3062
3120
|
renderContent: ({ size }) => /* @__PURE__ */ React46.createElement(
|
|
3063
3121
|
RotatedIcon,
|
|
3064
3122
|
{
|
|
@@ -3077,25 +3135,25 @@ var AlignSelfChild = ({ parentStyleDirection }) => /* @__PURE__ */ React46.creat
|
|
|
3077
3135
|
var React47 = __toESM(require("react"));
|
|
3078
3136
|
var import_editor_controls19 = require("@elementor/editor-controls");
|
|
3079
3137
|
var import_editor_v1_adapters12 = require("@elementor/editor-v1-adapters");
|
|
3080
|
-
var
|
|
3081
|
-
var DISPLAY_LABEL = (0,
|
|
3138
|
+
var import_i18n24 = require("@wordpress/i18n");
|
|
3139
|
+
var DISPLAY_LABEL = (0, import_i18n24.__)("Display", "elementor");
|
|
3082
3140
|
var displayFieldItems = [
|
|
3083
3141
|
{
|
|
3084
3142
|
value: "block",
|
|
3085
|
-
renderContent: () => (0,
|
|
3086
|
-
label: (0,
|
|
3143
|
+
renderContent: () => (0, import_i18n24.__)("Block", "elementor"),
|
|
3144
|
+
label: (0, import_i18n24.__)("Block", "elementor"),
|
|
3087
3145
|
showTooltip: true
|
|
3088
3146
|
},
|
|
3089
3147
|
{
|
|
3090
3148
|
value: "flex",
|
|
3091
|
-
renderContent: () => (0,
|
|
3092
|
-
label: (0,
|
|
3149
|
+
renderContent: () => (0, import_i18n24.__)("Flex", "elementor"),
|
|
3150
|
+
label: (0, import_i18n24.__)("Flex", "elementor"),
|
|
3093
3151
|
showTooltip: true
|
|
3094
3152
|
},
|
|
3095
3153
|
{
|
|
3096
3154
|
value: "inline-block",
|
|
3097
|
-
renderContent: () => (0,
|
|
3098
|
-
label: (0,
|
|
3155
|
+
renderContent: () => (0, import_i18n24.__)("In-blk", "elementor"),
|
|
3156
|
+
label: (0, import_i18n24.__)("Inline-block", "elementor"),
|
|
3099
3157
|
showTooltip: true
|
|
3100
3158
|
}
|
|
3101
3159
|
];
|
|
@@ -3105,15 +3163,15 @@ var DisplayField = () => {
|
|
|
3105
3163
|
if (isDisplayNoneFeatureActive) {
|
|
3106
3164
|
items3.push({
|
|
3107
3165
|
value: "none",
|
|
3108
|
-
renderContent: () => (0,
|
|
3109
|
-
label: (0,
|
|
3166
|
+
renderContent: () => (0, import_i18n24.__)("None", "elementor"),
|
|
3167
|
+
label: (0, import_i18n24.__)("None", "elementor"),
|
|
3110
3168
|
showTooltip: true
|
|
3111
3169
|
});
|
|
3112
3170
|
}
|
|
3113
3171
|
items3.push({
|
|
3114
3172
|
value: "inline-flex",
|
|
3115
|
-
renderContent: () => (0,
|
|
3116
|
-
label: (0,
|
|
3173
|
+
renderContent: () => (0, import_i18n24.__)("In-flx", "elementor"),
|
|
3174
|
+
label: (0, import_i18n24.__)("Inline-flex", "elementor"),
|
|
3117
3175
|
showTooltip: true
|
|
3118
3176
|
});
|
|
3119
3177
|
const placeholder = useDisplayPlaceholderValue();
|
|
@@ -3126,12 +3184,12 @@ var React48 = __toESM(require("react"));
|
|
|
3126
3184
|
var import_editor_controls20 = require("@elementor/editor-controls");
|
|
3127
3185
|
var import_icons12 = require("@elementor/icons");
|
|
3128
3186
|
var import_ui36 = require("@elementor/ui");
|
|
3129
|
-
var
|
|
3130
|
-
var
|
|
3187
|
+
var import_i18n25 = require("@wordpress/i18n");
|
|
3188
|
+
var FLEX_DIRECTION_LABEL2 = (0, import_i18n25.__)("Direction", "elementor");
|
|
3131
3189
|
var options3 = [
|
|
3132
3190
|
{
|
|
3133
3191
|
value: "row",
|
|
3134
|
-
label: (0,
|
|
3192
|
+
label: (0, import_i18n25.__)("Row", "elementor"),
|
|
3135
3193
|
renderContent: ({ size }) => {
|
|
3136
3194
|
const StartIcon5 = (0, import_ui36.withDirection)(import_icons12.ArrowRightIcon);
|
|
3137
3195
|
return /* @__PURE__ */ React48.createElement(StartIcon5, { fontSize: size });
|
|
@@ -3140,13 +3198,13 @@ var options3 = [
|
|
|
3140
3198
|
},
|
|
3141
3199
|
{
|
|
3142
3200
|
value: "column",
|
|
3143
|
-
label: (0,
|
|
3201
|
+
label: (0, import_i18n25.__)("Column", "elementor"),
|
|
3144
3202
|
renderContent: ({ size }) => /* @__PURE__ */ React48.createElement(import_icons12.ArrowDownSmallIcon, { fontSize: size }),
|
|
3145
3203
|
showTooltip: true
|
|
3146
3204
|
},
|
|
3147
3205
|
{
|
|
3148
3206
|
value: "row-reverse",
|
|
3149
|
-
label: (0,
|
|
3207
|
+
label: (0, import_i18n25.__)("Reversed row", "elementor"),
|
|
3150
3208
|
renderContent: ({ size }) => {
|
|
3151
3209
|
const EndIcon5 = (0, import_ui36.withDirection)(import_icons12.ArrowLeftIcon);
|
|
3152
3210
|
return /* @__PURE__ */ React48.createElement(EndIcon5, { fontSize: size });
|
|
@@ -3155,13 +3213,13 @@ var options3 = [
|
|
|
3155
3213
|
},
|
|
3156
3214
|
{
|
|
3157
3215
|
value: "column-reverse",
|
|
3158
|
-
label: (0,
|
|
3216
|
+
label: (0, import_i18n25.__)("Reversed column", "elementor"),
|
|
3159
3217
|
renderContent: ({ size }) => /* @__PURE__ */ React48.createElement(import_icons12.ArrowUpSmallIcon, { fontSize: size }),
|
|
3160
3218
|
showTooltip: true
|
|
3161
3219
|
}
|
|
3162
3220
|
];
|
|
3163
3221
|
var FlexDirectionField = () => {
|
|
3164
|
-
return /* @__PURE__ */ React48.createElement(StylesField, { bind: "flex-direction", propDisplayName:
|
|
3222
|
+
return /* @__PURE__ */ React48.createElement(StylesField, { bind: "flex-direction", propDisplayName: FLEX_DIRECTION_LABEL2 }, /* @__PURE__ */ React48.createElement(UiProviders, null, /* @__PURE__ */ React48.createElement(StylesFieldLayout, { label: FLEX_DIRECTION_LABEL2 }, /* @__PURE__ */ React48.createElement(import_editor_controls20.ToggleControl, { options: options3 }))));
|
|
3165
3223
|
};
|
|
3166
3224
|
|
|
3167
3225
|
// src/components/style-sections/layout-section/flex-order-field.tsx
|
|
@@ -3170,8 +3228,8 @@ var import_react26 = require("react");
|
|
|
3170
3228
|
var import_editor_controls21 = require("@elementor/editor-controls");
|
|
3171
3229
|
var import_icons13 = require("@elementor/icons");
|
|
3172
3230
|
var import_ui37 = require("@elementor/ui");
|
|
3173
|
-
var
|
|
3174
|
-
var ORDER_LABEL = (0,
|
|
3231
|
+
var import_i18n26 = require("@wordpress/i18n");
|
|
3232
|
+
var ORDER_LABEL = (0, import_i18n26.__)("Order", "elementor");
|
|
3175
3233
|
var FIRST_DEFAULT_VALUE = -99999;
|
|
3176
3234
|
var LAST_DEFAULT_VALUE = 99999;
|
|
3177
3235
|
var FIRST = "first";
|
|
@@ -3184,25 +3242,31 @@ var orderValueMap = {
|
|
|
3184
3242
|
var items = [
|
|
3185
3243
|
{
|
|
3186
3244
|
value: FIRST,
|
|
3187
|
-
label: (0,
|
|
3245
|
+
label: (0, import_i18n26.__)("First", "elementor"),
|
|
3188
3246
|
renderContent: ({ size }) => /* @__PURE__ */ React49.createElement(import_icons13.ArrowUpSmallIcon, { fontSize: size }),
|
|
3189
3247
|
showTooltip: true
|
|
3190
3248
|
},
|
|
3191
3249
|
{
|
|
3192
3250
|
value: LAST,
|
|
3193
|
-
label: (0,
|
|
3251
|
+
label: (0, import_i18n26.__)("Last", "elementor"),
|
|
3194
3252
|
renderContent: ({ size }) => /* @__PURE__ */ React49.createElement(import_icons13.ArrowDownSmallIcon, { fontSize: size }),
|
|
3195
3253
|
showTooltip: true
|
|
3196
3254
|
},
|
|
3197
3255
|
{
|
|
3198
3256
|
value: CUSTOM,
|
|
3199
|
-
label: (0,
|
|
3257
|
+
label: (0, import_i18n26.__)("Custom", "elementor"),
|
|
3200
3258
|
renderContent: ({ size }) => /* @__PURE__ */ React49.createElement(import_icons13.PencilIcon, { fontSize: size }),
|
|
3201
3259
|
showTooltip: true
|
|
3202
3260
|
}
|
|
3203
3261
|
];
|
|
3204
3262
|
var FlexOrderField = () => {
|
|
3205
|
-
const {
|
|
3263
|
+
const {
|
|
3264
|
+
value: order,
|
|
3265
|
+
setValue: setOrder,
|
|
3266
|
+
canEdit
|
|
3267
|
+
} = useStylesField("order", {
|
|
3268
|
+
history: { propDisplayName: ORDER_LABEL }
|
|
3269
|
+
});
|
|
3206
3270
|
const [groupControlValue, setGroupControlValue] = (0, import_react26.useState)(getGroupControlValue(order?.value || null));
|
|
3207
3271
|
const handleToggleButtonChange = (group) => {
|
|
3208
3272
|
setGroupControlValue(group);
|
|
@@ -3212,7 +3276,7 @@ var FlexOrderField = () => {
|
|
|
3212
3276
|
}
|
|
3213
3277
|
setOrder({ $$type: "number", value: orderValueMap[group] });
|
|
3214
3278
|
};
|
|
3215
|
-
return /* @__PURE__ */ React49.createElement(StylesField, { bind: "order", propDisplayName: ORDER_LABEL }, /* @__PURE__ */ React49.createElement(UiProviders, null, /* @__PURE__ */ React49.createElement(
|
|
3279
|
+
return /* @__PURE__ */ React49.createElement(StylesField, { bind: "order", propDisplayName: ORDER_LABEL }, /* @__PURE__ */ React49.createElement(UiProviders, null, /* @__PURE__ */ React49.createElement(SectionContent, null, /* @__PURE__ */ React49.createElement(StylesFieldLayout, { label: ORDER_LABEL }, /* @__PURE__ */ React49.createElement(
|
|
3216
3280
|
import_editor_controls21.ControlToggleButtonGroup,
|
|
3217
3281
|
{
|
|
3218
3282
|
items,
|
|
@@ -3221,14 +3285,14 @@ var FlexOrderField = () => {
|
|
|
3221
3285
|
exclusive: true,
|
|
3222
3286
|
disabled: !canEdit
|
|
3223
3287
|
}
|
|
3224
|
-
), CUSTOM === groupControlValue && /* @__PURE__ */ React49.createElement(import_ui37.Grid, { container: true, gap: 2, alignItems: "center", flexWrap: "nowrap" }, /* @__PURE__ */ React49.createElement(import_ui37.Grid, { item: true, xs: 6 }, /* @__PURE__ */ React49.createElement(ControlLabel, null, (0,
|
|
3288
|
+
)), CUSTOM === groupControlValue && /* @__PURE__ */ React49.createElement(import_ui37.Grid, { container: true, gap: 2, alignItems: "center", flexWrap: "nowrap" }, /* @__PURE__ */ React49.createElement(import_ui37.Grid, { item: true, xs: 6 }, /* @__PURE__ */ React49.createElement(ControlLabel, null, (0, import_i18n26.__)("Custom order", "elementor"))), /* @__PURE__ */ React49.createElement(import_ui37.Grid, { item: true, xs: 6, sx: { display: "flex", justifyContent: "end" } }, /* @__PURE__ */ React49.createElement(
|
|
3225
3289
|
import_editor_controls21.NumberControl,
|
|
3226
3290
|
{
|
|
3227
3291
|
min: FIRST_DEFAULT_VALUE + 1,
|
|
3228
3292
|
max: LAST_DEFAULT_VALUE - 1,
|
|
3229
3293
|
shouldForceInt: true
|
|
3230
3294
|
}
|
|
3231
|
-
))))))
|
|
3295
|
+
))))));
|
|
3232
3296
|
};
|
|
3233
3297
|
var getGroupControlValue = (order) => {
|
|
3234
3298
|
if (LAST_DEFAULT_VALUE === order) {
|
|
@@ -3244,27 +3308,27 @@ var getGroupControlValue = (order) => {
|
|
|
3244
3308
|
var React50 = __toESM(require("react"));
|
|
3245
3309
|
var import_react27 = require("react");
|
|
3246
3310
|
var import_editor_controls22 = require("@elementor/editor-controls");
|
|
3247
|
-
var
|
|
3311
|
+
var import_editor_props10 = require("@elementor/editor-props");
|
|
3248
3312
|
var import_icons14 = require("@elementor/icons");
|
|
3249
|
-
var
|
|
3250
|
-
var FLEX_SIZE_LABEL = (0,
|
|
3313
|
+
var import_i18n27 = require("@wordpress/i18n");
|
|
3314
|
+
var FLEX_SIZE_LABEL = (0, import_i18n27.__)("Flex Size", "elementor");
|
|
3251
3315
|
var DEFAULT = 1;
|
|
3252
3316
|
var items2 = [
|
|
3253
3317
|
{
|
|
3254
3318
|
value: "flex-grow",
|
|
3255
|
-
label: (0,
|
|
3319
|
+
label: (0, import_i18n27.__)("Grow", "elementor"),
|
|
3256
3320
|
renderContent: ({ size }) => /* @__PURE__ */ React50.createElement(import_icons14.ExpandIcon, { fontSize: size }),
|
|
3257
3321
|
showTooltip: true
|
|
3258
3322
|
},
|
|
3259
3323
|
{
|
|
3260
3324
|
value: "flex-shrink",
|
|
3261
|
-
label: (0,
|
|
3325
|
+
label: (0, import_i18n27.__)("Shrink", "elementor"),
|
|
3262
3326
|
renderContent: ({ size }) => /* @__PURE__ */ React50.createElement(import_icons14.ShrinkIcon, { fontSize: size }),
|
|
3263
3327
|
showTooltip: true
|
|
3264
3328
|
},
|
|
3265
3329
|
{
|
|
3266
3330
|
value: "custom",
|
|
3267
|
-
label: (0,
|
|
3331
|
+
label: (0, import_i18n27.__)("Custom", "elementor"),
|
|
3268
3332
|
renderContent: ({ size }) => /* @__PURE__ */ React50.createElement(import_icons14.PencilIcon, { fontSize: size }),
|
|
3269
3333
|
showTooltip: true
|
|
3270
3334
|
}
|
|
@@ -3277,27 +3341,27 @@ var FlexSizeField = () => {
|
|
|
3277
3341
|
const currentGroup = (0, import_react27.useMemo)(() => getActiveGroup({ grow, shrink, basis }), [grow, shrink, basis]), [activeGroup, setActiveGroup] = (0, import_react27.useState)(currentGroup);
|
|
3278
3342
|
const onChangeGroup = (group = null) => {
|
|
3279
3343
|
setActiveGroup(group);
|
|
3344
|
+
let props;
|
|
3280
3345
|
if (!group || group === "custom") {
|
|
3281
|
-
|
|
3346
|
+
props = {
|
|
3282
3347
|
"flex-basis": null,
|
|
3283
3348
|
"flex-grow": null,
|
|
3284
3349
|
"flex-shrink": null
|
|
3285
|
-
}
|
|
3286
|
-
|
|
3287
|
-
|
|
3288
|
-
if (group === "flex-grow") {
|
|
3289
|
-
setValues({
|
|
3350
|
+
};
|
|
3351
|
+
} else if (group === "flex-grow") {
|
|
3352
|
+
props = {
|
|
3290
3353
|
"flex-basis": null,
|
|
3291
|
-
"flex-grow":
|
|
3354
|
+
"flex-grow": import_editor_props10.numberPropTypeUtil.create(DEFAULT),
|
|
3292
3355
|
"flex-shrink": null
|
|
3293
|
-
}
|
|
3294
|
-
|
|
3356
|
+
};
|
|
3357
|
+
} else {
|
|
3358
|
+
props = {
|
|
3359
|
+
"flex-basis": null,
|
|
3360
|
+
"flex-grow": null,
|
|
3361
|
+
"flex-shrink": import_editor_props10.numberPropTypeUtil.create(DEFAULT)
|
|
3362
|
+
};
|
|
3295
3363
|
}
|
|
3296
|
-
setValues({
|
|
3297
|
-
"flex-basis": null,
|
|
3298
|
-
"flex-grow": null,
|
|
3299
|
-
"flex-shrink": import_editor_props9.numberPropTypeUtil.create(DEFAULT)
|
|
3300
|
-
});
|
|
3364
|
+
setValues(props, { history: { propDisplayName: FLEX_SIZE_LABEL } });
|
|
3301
3365
|
};
|
|
3302
3366
|
return /* @__PURE__ */ React50.createElement(UiProviders, null, /* @__PURE__ */ React50.createElement(SectionContent, null, /* @__PURE__ */ React50.createElement(StylesField, { bind: activeGroup ?? "", propDisplayName: FLEX_SIZE_LABEL }, /* @__PURE__ */ React50.createElement(StylesFieldLayout, { label: FLEX_SIZE_LABEL }, /* @__PURE__ */ React50.createElement(
|
|
3303
3367
|
import_editor_controls22.ControlToggleButtonGroup,
|
|
@@ -3312,7 +3376,7 @@ var FlexSizeField = () => {
|
|
|
3312
3376
|
};
|
|
3313
3377
|
var FlexCustomField = () => {
|
|
3314
3378
|
const flexBasisRowRef = (0, import_react27.useRef)(null);
|
|
3315
|
-
return /* @__PURE__ */ React50.createElement(React50.Fragment, null, /* @__PURE__ */ React50.createElement(StylesField, { bind: "flex-grow", propDisplayName: FLEX_SIZE_LABEL }, /* @__PURE__ */ React50.createElement(StylesFieldLayout, { label: (0,
|
|
3379
|
+
return /* @__PURE__ */ React50.createElement(React50.Fragment, null, /* @__PURE__ */ React50.createElement(StylesField, { bind: "flex-grow", propDisplayName: FLEX_SIZE_LABEL }, /* @__PURE__ */ React50.createElement(StylesFieldLayout, { label: (0, import_i18n27.__)("Grow", "elementor") }, /* @__PURE__ */ React50.createElement(import_editor_controls22.NumberControl, { min: 0, shouldForceInt: true }))), /* @__PURE__ */ React50.createElement(StylesField, { bind: "flex-shrink", propDisplayName: FLEX_SIZE_LABEL }, /* @__PURE__ */ React50.createElement(StylesFieldLayout, { label: (0, import_i18n27.__)("Shrink", "elementor") }, /* @__PURE__ */ React50.createElement(import_editor_controls22.NumberControl, { min: 0, shouldForceInt: true }))), /* @__PURE__ */ React50.createElement(StylesField, { bind: "flex-basis", propDisplayName: FLEX_SIZE_LABEL }, /* @__PURE__ */ React50.createElement(StylesFieldLayout, { label: (0, import_i18n27.__)("Basis", "elementor"), ref: flexBasisRowRef }, /* @__PURE__ */ React50.createElement(import_editor_controls22.SizeControl, { extendedOptions: ["auto"], anchorRef: flexBasisRowRef }))));
|
|
3316
3380
|
};
|
|
3317
3381
|
var getActiveGroup = ({
|
|
3318
3382
|
grow,
|
|
@@ -3337,8 +3401,8 @@ var getActiveGroup = ({
|
|
|
3337
3401
|
// src/components/style-sections/layout-section/gap-control-field.tsx
|
|
3338
3402
|
var React51 = __toESM(require("react"));
|
|
3339
3403
|
var import_editor_controls23 = require("@elementor/editor-controls");
|
|
3340
|
-
var
|
|
3341
|
-
var GAPS_LABEL = (0,
|
|
3404
|
+
var import_i18n28 = require("@wordpress/i18n");
|
|
3405
|
+
var GAPS_LABEL = (0, import_i18n28.__)("Gaps", "elementor");
|
|
3342
3406
|
var GapControlField = () => {
|
|
3343
3407
|
return /* @__PURE__ */ React51.createElement(StylesField, { bind: "gap", propDisplayName: GAPS_LABEL }, /* @__PURE__ */ React51.createElement(import_editor_controls23.GapControl, { label: GAPS_LABEL }));
|
|
3344
3408
|
};
|
|
@@ -3348,8 +3412,8 @@ var React52 = __toESM(require("react"));
|
|
|
3348
3412
|
var import_editor_controls24 = require("@elementor/editor-controls");
|
|
3349
3413
|
var import_icons15 = require("@elementor/icons");
|
|
3350
3414
|
var import_ui38 = require("@elementor/ui");
|
|
3351
|
-
var
|
|
3352
|
-
var JUSTIFY_CONTENT_LABEL = (0,
|
|
3415
|
+
var import_i18n29 = require("@wordpress/i18n");
|
|
3416
|
+
var JUSTIFY_CONTENT_LABEL = (0, import_i18n29.__)("Justify content", "elementor");
|
|
3353
3417
|
var StartIcon4 = (0, import_ui38.withDirection)(import_icons15.JustifyTopIcon);
|
|
3354
3418
|
var EndIcon4 = (0, import_ui38.withDirection)(import_icons15.JustifyBottomIcon);
|
|
3355
3419
|
var iconProps4 = {
|
|
@@ -3359,37 +3423,37 @@ var iconProps4 = {
|
|
|
3359
3423
|
var options4 = [
|
|
3360
3424
|
{
|
|
3361
3425
|
value: "flex-start",
|
|
3362
|
-
label: (0,
|
|
3426
|
+
label: (0, import_i18n29.__)("Start", "elementor"),
|
|
3363
3427
|
renderContent: ({ size }) => /* @__PURE__ */ React52.createElement(RotatedIcon, { icon: StartIcon4, size, ...iconProps4 }),
|
|
3364
3428
|
showTooltip: true
|
|
3365
3429
|
},
|
|
3366
3430
|
{
|
|
3367
3431
|
value: "center",
|
|
3368
|
-
label: (0,
|
|
3432
|
+
label: (0, import_i18n29.__)("Center", "elementor"),
|
|
3369
3433
|
renderContent: ({ size }) => /* @__PURE__ */ React52.createElement(RotatedIcon, { icon: import_icons15.JustifyCenterIcon, size, ...iconProps4 }),
|
|
3370
3434
|
showTooltip: true
|
|
3371
3435
|
},
|
|
3372
3436
|
{
|
|
3373
3437
|
value: "flex-end",
|
|
3374
|
-
label: (0,
|
|
3438
|
+
label: (0, import_i18n29.__)("End", "elementor"),
|
|
3375
3439
|
renderContent: ({ size }) => /* @__PURE__ */ React52.createElement(RotatedIcon, { icon: EndIcon4, size, ...iconProps4 }),
|
|
3376
3440
|
showTooltip: true
|
|
3377
3441
|
},
|
|
3378
3442
|
{
|
|
3379
3443
|
value: "space-between",
|
|
3380
|
-
label: (0,
|
|
3444
|
+
label: (0, import_i18n29.__)("Space between", "elementor"),
|
|
3381
3445
|
renderContent: ({ size }) => /* @__PURE__ */ React52.createElement(RotatedIcon, { icon: import_icons15.JustifySpaceBetweenVerticalIcon, size, ...iconProps4 }),
|
|
3382
3446
|
showTooltip: true
|
|
3383
3447
|
},
|
|
3384
3448
|
{
|
|
3385
3449
|
value: "space-around",
|
|
3386
|
-
label: (0,
|
|
3450
|
+
label: (0, import_i18n29.__)("Space around", "elementor"),
|
|
3387
3451
|
renderContent: ({ size }) => /* @__PURE__ */ React52.createElement(RotatedIcon, { icon: import_icons15.JustifySpaceAroundVerticalIcon, size, ...iconProps4 }),
|
|
3388
3452
|
showTooltip: true
|
|
3389
3453
|
},
|
|
3390
3454
|
{
|
|
3391
3455
|
value: "space-evenly",
|
|
3392
|
-
label: (0,
|
|
3456
|
+
label: (0, import_i18n29.__)("Space evenly", "elementor"),
|
|
3393
3457
|
renderContent: ({ size }) => /* @__PURE__ */ React52.createElement(RotatedIcon, { icon: import_icons15.JustifyDistributeVerticalIcon, size, ...iconProps4 }),
|
|
3394
3458
|
showTooltip: true
|
|
3395
3459
|
}
|
|
@@ -3400,24 +3464,24 @@ var JustifyContentField = () => /* @__PURE__ */ React52.createElement(StylesFiel
|
|
|
3400
3464
|
var React53 = __toESM(require("react"));
|
|
3401
3465
|
var import_editor_controls25 = require("@elementor/editor-controls");
|
|
3402
3466
|
var import_icons16 = require("@elementor/icons");
|
|
3403
|
-
var
|
|
3404
|
-
var FLEX_WRAP_LABEL = (0,
|
|
3467
|
+
var import_i18n30 = require("@wordpress/i18n");
|
|
3468
|
+
var FLEX_WRAP_LABEL = (0, import_i18n30.__)("Wrap", "elementor");
|
|
3405
3469
|
var options5 = [
|
|
3406
3470
|
{
|
|
3407
3471
|
value: "nowrap",
|
|
3408
|
-
label: (0,
|
|
3472
|
+
label: (0, import_i18n30.__)("No wrap", "elementor"),
|
|
3409
3473
|
renderContent: ({ size }) => /* @__PURE__ */ React53.createElement(import_icons16.ArrowRightIcon, { fontSize: size }),
|
|
3410
3474
|
showTooltip: true
|
|
3411
3475
|
},
|
|
3412
3476
|
{
|
|
3413
3477
|
value: "wrap",
|
|
3414
|
-
label: (0,
|
|
3478
|
+
label: (0, import_i18n30.__)("Wrap", "elementor"),
|
|
3415
3479
|
renderContent: ({ size }) => /* @__PURE__ */ React53.createElement(import_icons16.ArrowBackIcon, { fontSize: size }),
|
|
3416
3480
|
showTooltip: true
|
|
3417
3481
|
},
|
|
3418
3482
|
{
|
|
3419
3483
|
value: "wrap-reverse",
|
|
3420
|
-
label: (0,
|
|
3484
|
+
label: (0, import_i18n30.__)("Reversed wrap", "elementor"),
|
|
3421
3485
|
renderContent: ({ size }) => /* @__PURE__ */ React53.createElement(import_icons16.ArrowForwardIcon, { fontSize: size }),
|
|
3422
3486
|
showTooltip: true
|
|
3423
3487
|
}
|
|
@@ -3427,8 +3491,12 @@ var WrapField = () => {
|
|
|
3427
3491
|
};
|
|
3428
3492
|
|
|
3429
3493
|
// src/components/style-sections/layout-section/layout-section.tsx
|
|
3494
|
+
var DISPLAY_LABEL2 = (0, import_i18n31.__)("Display", "elementor");
|
|
3495
|
+
var FLEX_WRAP_LABEL2 = (0, import_i18n31.__)("Flex wrap", "elementor");
|
|
3430
3496
|
var LayoutSection = () => {
|
|
3431
|
-
const { value: display } = useStylesField("display"
|
|
3497
|
+
const { value: display } = useStylesField("display", {
|
|
3498
|
+
history: { propDisplayName: DISPLAY_LABEL2 }
|
|
3499
|
+
});
|
|
3432
3500
|
const displayPlaceholder = useDisplayPlaceholderValue();
|
|
3433
3501
|
const isDisplayFlex = shouldDisplayFlexFields(display, displayPlaceholder);
|
|
3434
3502
|
const { element } = useElement();
|
|
@@ -3438,10 +3506,12 @@ var LayoutSection = () => {
|
|
|
3438
3506
|
return /* @__PURE__ */ React54.createElement(SectionContent, null, /* @__PURE__ */ React54.createElement(DisplayField, null), isDisplayFlex && /* @__PURE__ */ React54.createElement(FlexFields, null), "flex" === parentStyle?.display && /* @__PURE__ */ React54.createElement(FlexChildFields, { parentStyleDirection }));
|
|
3439
3507
|
};
|
|
3440
3508
|
var FlexFields = () => {
|
|
3441
|
-
const { value: flexWrap } = useStylesField("flex-wrap"
|
|
3509
|
+
const { value: flexWrap } = useStylesField("flex-wrap", {
|
|
3510
|
+
history: { propDisplayName: FLEX_WRAP_LABEL2 }
|
|
3511
|
+
});
|
|
3442
3512
|
return /* @__PURE__ */ React54.createElement(React54.Fragment, null, /* @__PURE__ */ React54.createElement(FlexDirectionField, null), /* @__PURE__ */ React54.createElement(JustifyContentField, null), /* @__PURE__ */ React54.createElement(AlignItemsField, null), /* @__PURE__ */ React54.createElement(PanelDivider, null), /* @__PURE__ */ React54.createElement(GapControlField, null), /* @__PURE__ */ React54.createElement(WrapField, null), ["wrap", "wrap-reverse"].includes(flexWrap?.value) && /* @__PURE__ */ React54.createElement(AlignContentField, null));
|
|
3443
3513
|
};
|
|
3444
|
-
var FlexChildFields = ({ parentStyleDirection }) => /* @__PURE__ */ React54.createElement(React54.Fragment, null, /* @__PURE__ */ React54.createElement(PanelDivider, null), /* @__PURE__ */ React54.createElement(import_editor_controls26.ControlFormLabel, null, (0,
|
|
3514
|
+
var FlexChildFields = ({ parentStyleDirection }) => /* @__PURE__ */ React54.createElement(React54.Fragment, null, /* @__PURE__ */ React54.createElement(PanelDivider, null), /* @__PURE__ */ React54.createElement(import_editor_controls26.ControlFormLabel, null, (0, import_i18n31.__)("Flex child", "elementor")), /* @__PURE__ */ React54.createElement(AlignSelfChild, { parentStyleDirection }), /* @__PURE__ */ React54.createElement(FlexOrderField, null), /* @__PURE__ */ React54.createElement(FlexSizeField, null));
|
|
3445
3515
|
var shouldDisplayFlexFields = (display, local) => {
|
|
3446
3516
|
const value = display?.value ?? local?.value;
|
|
3447
3517
|
if (!value) {
|
|
@@ -3454,6 +3524,7 @@ var shouldDisplayFlexFields = (display, local) => {
|
|
|
3454
3524
|
var React59 = __toESM(require("react"));
|
|
3455
3525
|
var import_editor_v1_adapters13 = require("@elementor/editor-v1-adapters");
|
|
3456
3526
|
var import_session3 = require("@elementor/session");
|
|
3527
|
+
var import_i18n36 = require("@wordpress/i18n");
|
|
3457
3528
|
|
|
3458
3529
|
// src/components/style-sections/position-section/dimensions-field.tsx
|
|
3459
3530
|
var React55 = __toESM(require("react"));
|
|
@@ -3461,7 +3532,7 @@ var import_react28 = require("react");
|
|
|
3461
3532
|
var import_editor_controls27 = require("@elementor/editor-controls");
|
|
3462
3533
|
var import_icons17 = require("@elementor/icons");
|
|
3463
3534
|
var import_ui39 = require("@elementor/ui");
|
|
3464
|
-
var
|
|
3535
|
+
var import_i18n32 = require("@wordpress/i18n");
|
|
3465
3536
|
var InlineStartIcon2 = (0, import_ui39.withDirection)(import_icons17.SideLeftIcon);
|
|
3466
3537
|
var InlineEndIcon2 = (0, import_ui39.withDirection)(import_icons17.SideRightIcon);
|
|
3467
3538
|
var sideIcons = {
|
|
@@ -3470,19 +3541,19 @@ var sideIcons = {
|
|
|
3470
3541
|
"inset-inline-start": /* @__PURE__ */ React55.createElement(RotatedIcon, { icon: InlineStartIcon2, size: "tiny" }),
|
|
3471
3542
|
"inset-inline-end": /* @__PURE__ */ React55.createElement(RotatedIcon, { icon: InlineEndIcon2, size: "tiny" })
|
|
3472
3543
|
};
|
|
3473
|
-
var getInlineStartLabel = (isSiteRtl) => isSiteRtl ? (0,
|
|
3474
|
-
var getInlineEndLabel = (isSiteRtl) => isSiteRtl ? (0,
|
|
3544
|
+
var getInlineStartLabel = (isSiteRtl) => isSiteRtl ? (0, import_i18n32.__)("Right", "elementor") : (0, import_i18n32.__)("Left", "elementor");
|
|
3545
|
+
var getInlineEndLabel = (isSiteRtl) => isSiteRtl ? (0, import_i18n32.__)("Left", "elementor") : (0, import_i18n32.__)("Right", "elementor");
|
|
3475
3546
|
var DimensionsField = () => {
|
|
3476
3547
|
const { isSiteRtl } = useDirection();
|
|
3477
3548
|
const rowRefs = [(0, import_react28.useRef)(null), (0, import_react28.useRef)(null)];
|
|
3478
|
-
return /* @__PURE__ */ React55.createElement(UiProviders, null, /* @__PURE__ */ React55.createElement(import_ui39.Stack, { direction: "row", gap: 2, flexWrap: "nowrap", ref: rowRefs[0] }, /* @__PURE__ */ React55.createElement(DimensionField, { side: "inset-block-start", label: (0,
|
|
3549
|
+
return /* @__PURE__ */ React55.createElement(UiProviders, null, /* @__PURE__ */ React55.createElement(import_ui39.Stack, { direction: "row", gap: 2, flexWrap: "nowrap", ref: rowRefs[0] }, /* @__PURE__ */ React55.createElement(DimensionField, { side: "inset-block-start", label: (0, import_i18n32.__)("Top", "elementor"), rowRef: rowRefs[0] }), /* @__PURE__ */ React55.createElement(
|
|
3479
3550
|
DimensionField,
|
|
3480
3551
|
{
|
|
3481
3552
|
side: "inset-inline-end",
|
|
3482
3553
|
label: getInlineEndLabel(isSiteRtl),
|
|
3483
3554
|
rowRef: rowRefs[0]
|
|
3484
3555
|
}
|
|
3485
|
-
)), /* @__PURE__ */ React55.createElement(import_ui39.Stack, { direction: "row", gap: 2, flexWrap: "nowrap", ref: rowRefs[1] }, /* @__PURE__ */ React55.createElement(DimensionField, { side: "inset-block-end", label: (0,
|
|
3556
|
+
)), /* @__PURE__ */ React55.createElement(import_ui39.Stack, { direction: "row", gap: 2, flexWrap: "nowrap", ref: rowRefs[1] }, /* @__PURE__ */ React55.createElement(DimensionField, { side: "inset-block-end", label: (0, import_i18n32.__)("Bottom", "elementor"), rowRef: rowRefs[1] }), /* @__PURE__ */ React55.createElement(
|
|
3486
3557
|
DimensionField,
|
|
3487
3558
|
{
|
|
3488
3559
|
side: "inset-inline-start",
|
|
@@ -3501,8 +3572,8 @@ var DimensionField = ({
|
|
|
3501
3572
|
var React56 = __toESM(require("react"));
|
|
3502
3573
|
var import_react29 = require("react");
|
|
3503
3574
|
var import_editor_controls28 = require("@elementor/editor-controls");
|
|
3504
|
-
var
|
|
3505
|
-
var OFFSET_LABEL = (0,
|
|
3575
|
+
var import_i18n33 = require("@wordpress/i18n");
|
|
3576
|
+
var OFFSET_LABEL = (0, import_i18n33.__)("Anchor offset", "elementor");
|
|
3506
3577
|
var UNITS = ["px", "em", "rem", "vw", "vh"];
|
|
3507
3578
|
var OffsetField = () => {
|
|
3508
3579
|
const rowRef = (0, import_react29.useRef)(null);
|
|
@@ -3512,14 +3583,14 @@ var OffsetField = () => {
|
|
|
3512
3583
|
// src/components/style-sections/position-section/position-field.tsx
|
|
3513
3584
|
var React57 = __toESM(require("react"));
|
|
3514
3585
|
var import_editor_controls29 = require("@elementor/editor-controls");
|
|
3515
|
-
var
|
|
3516
|
-
var POSITION_LABEL = (0,
|
|
3586
|
+
var import_i18n34 = require("@wordpress/i18n");
|
|
3587
|
+
var POSITION_LABEL = (0, import_i18n34.__)("Position", "elementor");
|
|
3517
3588
|
var positionOptions = [
|
|
3518
|
-
{ label: (0,
|
|
3519
|
-
{ label: (0,
|
|
3520
|
-
{ label: (0,
|
|
3521
|
-
{ label: (0,
|
|
3522
|
-
{ label: (0,
|
|
3589
|
+
{ label: (0, import_i18n34.__)("Static", "elementor"), value: "static" },
|
|
3590
|
+
{ label: (0, import_i18n34.__)("Relative", "elementor"), value: "relative" },
|
|
3591
|
+
{ label: (0, import_i18n34.__)("Absolute", "elementor"), value: "absolute" },
|
|
3592
|
+
{ label: (0, import_i18n34.__)("Fixed", "elementor"), value: "fixed" },
|
|
3593
|
+
{ label: (0, import_i18n34.__)("Sticky", "elementor"), value: "sticky" }
|
|
3523
3594
|
];
|
|
3524
3595
|
var PositionField = ({ onChange }) => {
|
|
3525
3596
|
return /* @__PURE__ */ React57.createElement(StylesField, { bind: "position", propDisplayName: POSITION_LABEL }, /* @__PURE__ */ React57.createElement(StylesFieldLayout, { label: POSITION_LABEL }, /* @__PURE__ */ React57.createElement(import_editor_controls29.SelectControl, { options: positionOptions, onChange })));
|
|
@@ -3528,15 +3599,19 @@ var PositionField = ({ onChange }) => {
|
|
|
3528
3599
|
// src/components/style-sections/position-section/z-index-field.tsx
|
|
3529
3600
|
var React58 = __toESM(require("react"));
|
|
3530
3601
|
var import_editor_controls30 = require("@elementor/editor-controls");
|
|
3531
|
-
var
|
|
3532
|
-
var Z_INDEX_LABEL = (0,
|
|
3602
|
+
var import_i18n35 = require("@wordpress/i18n");
|
|
3603
|
+
var Z_INDEX_LABEL = (0, import_i18n35.__)("Z-index", "elementor");
|
|
3533
3604
|
var ZIndexField = () => {
|
|
3534
3605
|
return /* @__PURE__ */ React58.createElement(StylesField, { bind: "z-index", propDisplayName: Z_INDEX_LABEL }, /* @__PURE__ */ React58.createElement(StylesFieldLayout, { label: Z_INDEX_LABEL }, /* @__PURE__ */ React58.createElement(import_editor_controls30.NumberControl, null)));
|
|
3535
3606
|
};
|
|
3536
3607
|
|
|
3537
3608
|
// src/components/style-sections/position-section/position-section.tsx
|
|
3609
|
+
var POSITION_LABEL2 = (0, import_i18n36.__)("Position", "elementor");
|
|
3610
|
+
var DIMENSIONS_LABEL = (0, import_i18n36.__)("Dimensions", "elementor");
|
|
3538
3611
|
var PositionSection = () => {
|
|
3539
|
-
const { value: positionValue } = useStylesField("position"
|
|
3612
|
+
const { value: positionValue } = useStylesField("position", {
|
|
3613
|
+
history: { propDisplayName: POSITION_LABEL2 }
|
|
3614
|
+
});
|
|
3540
3615
|
const { values: dimensions, setValues: setDimensions } = useStylesFields([
|
|
3541
3616
|
"inset-block-start",
|
|
3542
3617
|
"inset-block-end",
|
|
@@ -3546,19 +3621,23 @@ var PositionSection = () => {
|
|
|
3546
3621
|
const [dimensionsValuesFromHistory, updateDimensionsHistory, clearDimensionsHistory] = usePersistDimensions();
|
|
3547
3622
|
const isCssIdFeatureActive = (0, import_editor_v1_adapters13.isExperimentActive)("e_v_3_30");
|
|
3548
3623
|
const onPositionChange = (newPosition, previousPosition) => {
|
|
3624
|
+
const meta = { history: { propDisplayName: DIMENSIONS_LABEL } };
|
|
3549
3625
|
if (newPosition === "static") {
|
|
3550
3626
|
if (dimensions) {
|
|
3551
3627
|
updateDimensionsHistory(dimensions);
|
|
3552
|
-
setDimensions(
|
|
3553
|
-
|
|
3554
|
-
|
|
3555
|
-
|
|
3556
|
-
|
|
3557
|
-
|
|
3628
|
+
setDimensions(
|
|
3629
|
+
{
|
|
3630
|
+
"inset-block-start": void 0,
|
|
3631
|
+
"inset-block-end": void 0,
|
|
3632
|
+
"inset-inline-start": void 0,
|
|
3633
|
+
"inset-inline-end": void 0
|
|
3634
|
+
},
|
|
3635
|
+
meta
|
|
3636
|
+
);
|
|
3558
3637
|
}
|
|
3559
3638
|
} else if (previousPosition === "static") {
|
|
3560
3639
|
if (dimensionsValuesFromHistory) {
|
|
3561
|
-
setDimensions(dimensionsValuesFromHistory);
|
|
3640
|
+
setDimensions(dimensionsValuesFromHistory, meta);
|
|
3562
3641
|
clearDimensionsHistory();
|
|
3563
3642
|
}
|
|
3564
3643
|
}
|
|
@@ -3579,7 +3658,7 @@ var import_react30 = require("react");
|
|
|
3579
3658
|
var import_editor_controls34 = require("@elementor/editor-controls");
|
|
3580
3659
|
var import_editor_v1_adapters15 = require("@elementor/editor-v1-adapters");
|
|
3581
3660
|
var import_ui41 = require("@elementor/ui");
|
|
3582
|
-
var
|
|
3661
|
+
var import_i18n41 = require("@wordpress/i18n");
|
|
3583
3662
|
|
|
3584
3663
|
// src/components/style-tab-collapsible-content.tsx
|
|
3585
3664
|
var React61 = __toESM(require("react"));
|
|
@@ -3587,9 +3666,9 @@ var import_editor_v1_adapters14 = require("@elementor/editor-v1-adapters");
|
|
|
3587
3666
|
|
|
3588
3667
|
// src/styles-inheritance/components/styles-inheritance-section-indicators.tsx
|
|
3589
3668
|
var React60 = __toESM(require("react"));
|
|
3590
|
-
var
|
|
3669
|
+
var import_editor_styles_repository13 = require("@elementor/editor-styles-repository");
|
|
3591
3670
|
var import_ui40 = require("@elementor/ui");
|
|
3592
|
-
var
|
|
3671
|
+
var import_i18n37 = require("@wordpress/i18n");
|
|
3593
3672
|
var StylesInheritanceSectionIndicators = ({ fields }) => {
|
|
3594
3673
|
const { id, meta, provider } = useStyle();
|
|
3595
3674
|
const snapshot = useStylesInheritanceSnapshot();
|
|
@@ -3600,13 +3679,13 @@ var StylesInheritanceSectionIndicators = ({ fields }) => {
|
|
|
3600
3679
|
if (!hasValues && !hasOverrides) {
|
|
3601
3680
|
return null;
|
|
3602
3681
|
}
|
|
3603
|
-
const hasValueLabel = (0,
|
|
3604
|
-
const hasOverridesLabel = (0,
|
|
3605
|
-
return /* @__PURE__ */ React60.createElement(import_ui40.Tooltip, { title: (0,
|
|
3682
|
+
const hasValueLabel = (0, import_i18n37.__)("Has effective styles", "elementor");
|
|
3683
|
+
const hasOverridesLabel = (0, import_i18n37.__)("Has overridden styles", "elementor");
|
|
3684
|
+
return /* @__PURE__ */ React60.createElement(import_ui40.Tooltip, { title: (0, import_i18n37.__)("Has styles", "elementor"), placement: "top" }, /* @__PURE__ */ React60.createElement(import_ui40.Stack, { direction: "row", sx: { "& > *": { marginInlineStart: -0.25 } }, role: "list" }, hasValues && provider && /* @__PURE__ */ React60.createElement(
|
|
3606
3685
|
StyleIndicator,
|
|
3607
3686
|
{
|
|
3608
3687
|
getColor: getStylesProviderThemeColor(provider.getKey()),
|
|
3609
|
-
"data-variant": (0,
|
|
3688
|
+
"data-variant": (0, import_editor_styles_repository13.isElementsStylesProvider)(provider.getKey()) ? "local" : "global",
|
|
3610
3689
|
role: "listitem",
|
|
3611
3690
|
"aria-label": hasValueLabel
|
|
3612
3691
|
}
|
|
@@ -3663,14 +3742,14 @@ function getStylesInheritanceIndicators(fields) {
|
|
|
3663
3742
|
// src/components/style-sections/size-section/object-fit-field.tsx
|
|
3664
3743
|
var React62 = __toESM(require("react"));
|
|
3665
3744
|
var import_editor_controls31 = require("@elementor/editor-controls");
|
|
3666
|
-
var
|
|
3667
|
-
var OBJECT_FIT_LABEL = (0,
|
|
3745
|
+
var import_i18n38 = require("@wordpress/i18n");
|
|
3746
|
+
var OBJECT_FIT_LABEL = (0, import_i18n38.__)("Object fit", "elementor");
|
|
3668
3747
|
var positionOptions2 = [
|
|
3669
|
-
{ label: (0,
|
|
3670
|
-
{ label: (0,
|
|
3671
|
-
{ label: (0,
|
|
3672
|
-
{ label: (0,
|
|
3673
|
-
{ label: (0,
|
|
3748
|
+
{ label: (0, import_i18n38.__)("Fill", "elementor"), value: "fill" },
|
|
3749
|
+
{ label: (0, import_i18n38.__)("Cover", "elementor"), value: "cover" },
|
|
3750
|
+
{ label: (0, import_i18n38.__)("Contain", "elementor"), value: "contain" },
|
|
3751
|
+
{ label: (0, import_i18n38.__)("None", "elementor"), value: "none" },
|
|
3752
|
+
{ label: (0, import_i18n38.__)("Scale down", "elementor"), value: "scale-down" }
|
|
3674
3753
|
];
|
|
3675
3754
|
var ObjectFitField = () => {
|
|
3676
3755
|
return /* @__PURE__ */ React62.createElement(StylesField, { bind: "object-fit", propDisplayName: OBJECT_FIT_LABEL }, /* @__PURE__ */ React62.createElement(StylesFieldLayout, { label: OBJECT_FIT_LABEL }, /* @__PURE__ */ React62.createElement(import_editor_controls31.SelectControl, { options: positionOptions2 })));
|
|
@@ -3679,8 +3758,8 @@ var ObjectFitField = () => {
|
|
|
3679
3758
|
// src/components/style-sections/size-section/object-position-field.tsx
|
|
3680
3759
|
var React63 = __toESM(require("react"));
|
|
3681
3760
|
var import_editor_controls32 = require("@elementor/editor-controls");
|
|
3682
|
-
var
|
|
3683
|
-
var OBJECT_POSITION_LABEL = (0,
|
|
3761
|
+
var import_i18n39 = require("@wordpress/i18n");
|
|
3762
|
+
var OBJECT_POSITION_LABEL = (0, import_i18n39.__)("Object position", "elementor");
|
|
3684
3763
|
var ObjectPositionField = () => {
|
|
3685
3764
|
return /* @__PURE__ */ React63.createElement(StylesField, { bind: "object-position", propDisplayName: OBJECT_POSITION_LABEL }, /* @__PURE__ */ React63.createElement(import_editor_controls32.PositionControl, null));
|
|
3686
3765
|
};
|
|
@@ -3689,24 +3768,24 @@ var ObjectPositionField = () => {
|
|
|
3689
3768
|
var React64 = __toESM(require("react"));
|
|
3690
3769
|
var import_editor_controls33 = require("@elementor/editor-controls");
|
|
3691
3770
|
var import_icons18 = require("@elementor/icons");
|
|
3692
|
-
var
|
|
3693
|
-
var OVERFLOW_LABEL = (0,
|
|
3771
|
+
var import_i18n40 = require("@wordpress/i18n");
|
|
3772
|
+
var OVERFLOW_LABEL = (0, import_i18n40.__)("Overflow", "elementor");
|
|
3694
3773
|
var options6 = [
|
|
3695
3774
|
{
|
|
3696
3775
|
value: "visible",
|
|
3697
|
-
label: (0,
|
|
3776
|
+
label: (0, import_i18n40.__)("Visible", "elementor"),
|
|
3698
3777
|
renderContent: ({ size }) => /* @__PURE__ */ React64.createElement(import_icons18.EyeIcon, { fontSize: size }),
|
|
3699
3778
|
showTooltip: true
|
|
3700
3779
|
},
|
|
3701
3780
|
{
|
|
3702
3781
|
value: "hidden",
|
|
3703
|
-
label: (0,
|
|
3782
|
+
label: (0, import_i18n40.__)("Hidden", "elementor"),
|
|
3704
3783
|
renderContent: ({ size }) => /* @__PURE__ */ React64.createElement(import_icons18.EyeOffIcon, { fontSize: size }),
|
|
3705
3784
|
showTooltip: true
|
|
3706
3785
|
},
|
|
3707
3786
|
{
|
|
3708
3787
|
value: "auto",
|
|
3709
|
-
label: (0,
|
|
3788
|
+
label: (0, import_i18n40.__)("Auto", "elementor"),
|
|
3710
3789
|
renderContent: ({ size }) => /* @__PURE__ */ React64.createElement(import_icons18.LetterAIcon, { fontSize: size }),
|
|
3711
3790
|
showTooltip: true
|
|
3712
3791
|
}
|
|
@@ -3721,37 +3800,40 @@ var CssSizeProps = [
|
|
|
3721
3800
|
[
|
|
3722
3801
|
{
|
|
3723
3802
|
bind: "width",
|
|
3724
|
-
label: (0,
|
|
3803
|
+
label: (0, import_i18n41.__)("Width", "elementor")
|
|
3725
3804
|
},
|
|
3726
3805
|
{
|
|
3727
3806
|
bind: "height",
|
|
3728
|
-
label: (0,
|
|
3807
|
+
label: (0, import_i18n41.__)("Height", "elementor")
|
|
3729
3808
|
}
|
|
3730
3809
|
],
|
|
3731
3810
|
[
|
|
3732
3811
|
{
|
|
3733
3812
|
bind: "min-width",
|
|
3734
|
-
label: (0,
|
|
3813
|
+
label: (0, import_i18n41.__)("Min width", "elementor")
|
|
3735
3814
|
},
|
|
3736
3815
|
{
|
|
3737
3816
|
bind: "min-height",
|
|
3738
|
-
label: (0,
|
|
3817
|
+
label: (0, import_i18n41.__)("Min height", "elementor")
|
|
3739
3818
|
}
|
|
3740
3819
|
],
|
|
3741
3820
|
[
|
|
3742
3821
|
{
|
|
3743
3822
|
bind: "max-width",
|
|
3744
|
-
label: (0,
|
|
3823
|
+
label: (0, import_i18n41.__)("Max width", "elementor")
|
|
3745
3824
|
},
|
|
3746
3825
|
{
|
|
3747
3826
|
bind: "max-height",
|
|
3748
|
-
label: (0,
|
|
3827
|
+
label: (0, import_i18n41.__)("Max height", "elementor")
|
|
3749
3828
|
}
|
|
3750
3829
|
]
|
|
3751
3830
|
];
|
|
3752
|
-
var ASPECT_RATIO_LABEL = (0,
|
|
3831
|
+
var ASPECT_RATIO_LABEL = (0, import_i18n41.__)("Aspect Ratio", "elementor");
|
|
3832
|
+
var OBJECT_FIT_LABEL2 = (0, import_i18n41.__)("Object fit", "elementor");
|
|
3753
3833
|
var SizeSection = () => {
|
|
3754
|
-
const { value: fitValue } = useStylesField("object-fit"
|
|
3834
|
+
const { value: fitValue } = useStylesField("object-fit", {
|
|
3835
|
+
history: { propDisplayName: OBJECT_FIT_LABEL2 }
|
|
3836
|
+
});
|
|
3755
3837
|
const isNotFill = fitValue && fitValue?.value !== "fill";
|
|
3756
3838
|
const gridRowRefs = [(0, import_react30.useRef)(null), (0, import_react30.useRef)(null), (0, import_react30.useRef)(null)];
|
|
3757
3839
|
const isVersion330Active = (0, import_editor_v1_adapters15.isExperimentActive)(EXPERIMENT_ID);
|
|
@@ -3764,9 +3846,9 @@ var SizeField = ({ label, bind, rowRef, extendedOptions }) => {
|
|
|
3764
3846
|
// src/components/style-sections/spacing-section/spacing-section.tsx
|
|
3765
3847
|
var React66 = __toESM(require("react"));
|
|
3766
3848
|
var import_editor_controls35 = require("@elementor/editor-controls");
|
|
3767
|
-
var
|
|
3768
|
-
var MARGIN_LABEL = (0,
|
|
3769
|
-
var PADDING_LABEL = (0,
|
|
3849
|
+
var import_i18n42 = require("@wordpress/i18n");
|
|
3850
|
+
var MARGIN_LABEL = (0, import_i18n42.__)("Margin", "elementor");
|
|
3851
|
+
var PADDING_LABEL = (0, import_i18n42.__)("Padding", "elementor");
|
|
3770
3852
|
var SpacingSection = () => {
|
|
3771
3853
|
const { isSiteRtl } = useDirection();
|
|
3772
3854
|
return /* @__PURE__ */ React66.createElement(SectionContent, null, /* @__PURE__ */ React66.createElement(StylesField, { bind: "margin", propDisplayName: MARGIN_LABEL }, /* @__PURE__ */ React66.createElement(
|
|
@@ -3782,12 +3864,13 @@ var SpacingSection = () => {
|
|
|
3782
3864
|
// src/components/style-sections/typography-section/typography-section.tsx
|
|
3783
3865
|
var React82 = __toESM(require("react"));
|
|
3784
3866
|
var import_editor_v1_adapters16 = require("@elementor/editor-v1-adapters");
|
|
3867
|
+
var import_i18n59 = require("@wordpress/i18n");
|
|
3785
3868
|
|
|
3786
3869
|
// src/components/style-sections/typography-section/column-count-field.tsx
|
|
3787
3870
|
var React67 = __toESM(require("react"));
|
|
3788
3871
|
var import_editor_controls36 = require("@elementor/editor-controls");
|
|
3789
|
-
var
|
|
3790
|
-
var COLUMN_COUNT_LABEL = (0,
|
|
3872
|
+
var import_i18n43 = require("@wordpress/i18n");
|
|
3873
|
+
var COLUMN_COUNT_LABEL = (0, import_i18n43.__)("Columns", "elementor");
|
|
3791
3874
|
var ColumnCountField = () => {
|
|
3792
3875
|
return /* @__PURE__ */ React67.createElement(StylesField, { bind: "column-count", propDisplayName: COLUMN_COUNT_LABEL }, /* @__PURE__ */ React67.createElement(StylesFieldLayout, { label: COLUMN_COUNT_LABEL }, /* @__PURE__ */ React67.createElement(import_editor_controls36.NumberControl, { shouldForceInt: true, min: 0, step: 1 })));
|
|
3793
3876
|
};
|
|
@@ -3796,8 +3879,8 @@ var ColumnCountField = () => {
|
|
|
3796
3879
|
var React68 = __toESM(require("react"));
|
|
3797
3880
|
var import_react31 = require("react");
|
|
3798
3881
|
var import_editor_controls37 = require("@elementor/editor-controls");
|
|
3799
|
-
var
|
|
3800
|
-
var COLUMN_GAP_LABEL = (0,
|
|
3882
|
+
var import_i18n44 = require("@wordpress/i18n");
|
|
3883
|
+
var COLUMN_GAP_LABEL = (0, import_i18n44.__)("Column gap", "elementor");
|
|
3801
3884
|
var ColumnGapField = () => {
|
|
3802
3885
|
const rowRef = (0, import_react31.useRef)(null);
|
|
3803
3886
|
return /* @__PURE__ */ React68.createElement(StylesField, { bind: "column-gap", propDisplayName: COLUMN_GAP_LABEL }, /* @__PURE__ */ React68.createElement(StylesFieldLayout, { label: COLUMN_GAP_LABEL, ref: rowRef }, /* @__PURE__ */ React68.createElement(import_editor_controls37.SizeControl, { anchorRef: rowRef })));
|
|
@@ -3806,15 +3889,15 @@ var ColumnGapField = () => {
|
|
|
3806
3889
|
// src/components/style-sections/typography-section/font-family-field.tsx
|
|
3807
3890
|
var React69 = __toESM(require("react"));
|
|
3808
3891
|
var import_editor_controls38 = require("@elementor/editor-controls");
|
|
3809
|
-
var
|
|
3892
|
+
var import_i18n46 = require("@wordpress/i18n");
|
|
3810
3893
|
|
|
3811
3894
|
// src/components/style-sections/typography-section/hooks/use-font-families.ts
|
|
3812
3895
|
var import_react32 = require("react");
|
|
3813
|
-
var
|
|
3896
|
+
var import_i18n45 = require("@wordpress/i18n");
|
|
3814
3897
|
var supportedCategories = {
|
|
3815
|
-
system: (0,
|
|
3816
|
-
custom: (0,
|
|
3817
|
-
googlefonts: (0,
|
|
3898
|
+
system: (0, import_i18n45.__)("System", "elementor"),
|
|
3899
|
+
custom: (0, import_i18n45.__)("Custom Fonts", "elementor"),
|
|
3900
|
+
googlefonts: (0, import_i18n45.__)("Google Fonts", "elementor")
|
|
3818
3901
|
};
|
|
3819
3902
|
var getFontFamilies = () => {
|
|
3820
3903
|
const { controls } = getElementorConfig();
|
|
@@ -3846,7 +3929,7 @@ var useFontFamilies = () => {
|
|
|
3846
3929
|
};
|
|
3847
3930
|
|
|
3848
3931
|
// src/components/style-sections/typography-section/font-family-field.tsx
|
|
3849
|
-
var FONT_FAMILY_LABEL = (0,
|
|
3932
|
+
var FONT_FAMILY_LABEL = (0, import_i18n46.__)("Font family", "elementor");
|
|
3850
3933
|
var FontFamilyField = () => {
|
|
3851
3934
|
const fontFamilies = useFontFamilies();
|
|
3852
3935
|
const sectionWidth = useSectionWidth();
|
|
@@ -3860,8 +3943,8 @@ var FontFamilyField = () => {
|
|
|
3860
3943
|
var React70 = __toESM(require("react"));
|
|
3861
3944
|
var import_react33 = require("react");
|
|
3862
3945
|
var import_editor_controls39 = require("@elementor/editor-controls");
|
|
3863
|
-
var
|
|
3864
|
-
var FONT_SIZE_LABEL = (0,
|
|
3946
|
+
var import_i18n47 = require("@wordpress/i18n");
|
|
3947
|
+
var FONT_SIZE_LABEL = (0, import_i18n47.__)("Font size", "elementor");
|
|
3865
3948
|
var FontSizeField = () => {
|
|
3866
3949
|
const rowRef = (0, import_react33.useRef)(null);
|
|
3867
3950
|
return /* @__PURE__ */ React70.createElement(StylesField, { bind: "font-size", propDisplayName: FONT_SIZE_LABEL }, /* @__PURE__ */ React70.createElement(StylesFieldLayout, { label: FONT_SIZE_LABEL, ref: rowRef }, /* @__PURE__ */ React70.createElement(import_editor_controls39.SizeControl, { anchorRef: rowRef })));
|
|
@@ -3871,18 +3954,18 @@ var FontSizeField = () => {
|
|
|
3871
3954
|
var React71 = __toESM(require("react"));
|
|
3872
3955
|
var import_editor_controls40 = require("@elementor/editor-controls");
|
|
3873
3956
|
var import_icons19 = require("@elementor/icons");
|
|
3874
|
-
var
|
|
3875
|
-
var FONT_STYLE_LABEL = (0,
|
|
3957
|
+
var import_i18n48 = require("@wordpress/i18n");
|
|
3958
|
+
var FONT_STYLE_LABEL = (0, import_i18n48.__)("Font style", "elementor");
|
|
3876
3959
|
var options7 = [
|
|
3877
3960
|
{
|
|
3878
3961
|
value: "normal",
|
|
3879
|
-
label: (0,
|
|
3962
|
+
label: (0, import_i18n48.__)("Normal", "elementor"),
|
|
3880
3963
|
renderContent: ({ size }) => /* @__PURE__ */ React71.createElement(import_icons19.MinusIcon, { fontSize: size }),
|
|
3881
3964
|
showTooltip: true
|
|
3882
3965
|
},
|
|
3883
3966
|
{
|
|
3884
3967
|
value: "italic",
|
|
3885
|
-
label: (0,
|
|
3968
|
+
label: (0, import_i18n48.__)("Italic", "elementor"),
|
|
3886
3969
|
renderContent: ({ size }) => /* @__PURE__ */ React71.createElement(import_icons19.ItalicIcon, { fontSize: size }),
|
|
3887
3970
|
showTooltip: true
|
|
3888
3971
|
}
|
|
@@ -3894,18 +3977,18 @@ var FontStyleField = () => {
|
|
|
3894
3977
|
// src/components/style-sections/typography-section/font-weight-field.tsx
|
|
3895
3978
|
var React72 = __toESM(require("react"));
|
|
3896
3979
|
var import_editor_controls41 = require("@elementor/editor-controls");
|
|
3897
|
-
var
|
|
3898
|
-
var FONT_WEIGHT_LABEL = (0,
|
|
3980
|
+
var import_i18n49 = require("@wordpress/i18n");
|
|
3981
|
+
var FONT_WEIGHT_LABEL = (0, import_i18n49.__)("Font weight", "elementor");
|
|
3899
3982
|
var fontWeightOptions = [
|
|
3900
|
-
{ value: "100", label: (0,
|
|
3901
|
-
{ value: "200", label: (0,
|
|
3902
|
-
{ value: "300", label: (0,
|
|
3903
|
-
{ value: "400", label: (0,
|
|
3904
|
-
{ value: "500", label: (0,
|
|
3905
|
-
{ value: "600", label: (0,
|
|
3906
|
-
{ value: "700", label: (0,
|
|
3907
|
-
{ value: "800", label: (0,
|
|
3908
|
-
{ value: "900", label: (0,
|
|
3983
|
+
{ value: "100", label: (0, import_i18n49.__)("100 - Thin", "elementor") },
|
|
3984
|
+
{ value: "200", label: (0, import_i18n49.__)("200 - Extra light", "elementor") },
|
|
3985
|
+
{ value: "300", label: (0, import_i18n49.__)("300 - Light", "elementor") },
|
|
3986
|
+
{ value: "400", label: (0, import_i18n49.__)("400 - Normal", "elementor") },
|
|
3987
|
+
{ value: "500", label: (0, import_i18n49.__)("500 - Medium", "elementor") },
|
|
3988
|
+
{ value: "600", label: (0, import_i18n49.__)("600 - Semi bold", "elementor") },
|
|
3989
|
+
{ value: "700", label: (0, import_i18n49.__)("700 - Bold", "elementor") },
|
|
3990
|
+
{ value: "800", label: (0, import_i18n49.__)("800 - Extra bold", "elementor") },
|
|
3991
|
+
{ value: "900", label: (0, import_i18n49.__)("900 - Black", "elementor") }
|
|
3909
3992
|
];
|
|
3910
3993
|
var FontWeightField = () => {
|
|
3911
3994
|
return /* @__PURE__ */ React72.createElement(StylesField, { bind: "font-weight", propDisplayName: FONT_WEIGHT_LABEL }, /* @__PURE__ */ React72.createElement(StylesFieldLayout, { label: FONT_WEIGHT_LABEL }, /* @__PURE__ */ React72.createElement(import_editor_controls41.SelectControl, { options: fontWeightOptions })));
|
|
@@ -3915,8 +3998,8 @@ var FontWeightField = () => {
|
|
|
3915
3998
|
var React73 = __toESM(require("react"));
|
|
3916
3999
|
var import_react34 = require("react");
|
|
3917
4000
|
var import_editor_controls42 = require("@elementor/editor-controls");
|
|
3918
|
-
var
|
|
3919
|
-
var LETTER_SPACING_LABEL = (0,
|
|
4001
|
+
var import_i18n50 = require("@wordpress/i18n");
|
|
4002
|
+
var LETTER_SPACING_LABEL = (0, import_i18n50.__)("Letter spacing", "elementor");
|
|
3920
4003
|
var LetterSpacingField = () => {
|
|
3921
4004
|
const rowRef = (0, import_react34.useRef)(null);
|
|
3922
4005
|
return /* @__PURE__ */ React73.createElement(StylesField, { bind: "letter-spacing", propDisplayName: LETTER_SPACING_LABEL }, /* @__PURE__ */ React73.createElement(StylesFieldLayout, { label: LETTER_SPACING_LABEL, ref: rowRef }, /* @__PURE__ */ React73.createElement(import_editor_controls42.SizeControl, { anchorRef: rowRef })));
|
|
@@ -3926,8 +4009,8 @@ var LetterSpacingField = () => {
|
|
|
3926
4009
|
var React74 = __toESM(require("react"));
|
|
3927
4010
|
var import_react35 = require("react");
|
|
3928
4011
|
var import_editor_controls43 = require("@elementor/editor-controls");
|
|
3929
|
-
var
|
|
3930
|
-
var LINE_HEIGHT_LABEL = (0,
|
|
4012
|
+
var import_i18n51 = require("@wordpress/i18n");
|
|
4013
|
+
var LINE_HEIGHT_LABEL = (0, import_i18n51.__)("Line height", "elementor");
|
|
3931
4014
|
var LineHeightField = () => {
|
|
3932
4015
|
const rowRef = (0, import_react35.useRef)(null);
|
|
3933
4016
|
return /* @__PURE__ */ React74.createElement(StylesField, { bind: "line-height", propDisplayName: LINE_HEIGHT_LABEL }, /* @__PURE__ */ React74.createElement(StylesFieldLayout, { label: LINE_HEIGHT_LABEL, ref: rowRef }, /* @__PURE__ */ React74.createElement(import_editor_controls43.SizeControl, { anchorRef: rowRef })));
|
|
@@ -3938,32 +4021,32 @@ var React75 = __toESM(require("react"));
|
|
|
3938
4021
|
var import_editor_controls44 = require("@elementor/editor-controls");
|
|
3939
4022
|
var import_icons20 = require("@elementor/icons");
|
|
3940
4023
|
var import_ui42 = require("@elementor/ui");
|
|
3941
|
-
var
|
|
3942
|
-
var TEXT_ALIGNMENT_LABEL = (0,
|
|
4024
|
+
var import_i18n52 = require("@wordpress/i18n");
|
|
4025
|
+
var TEXT_ALIGNMENT_LABEL = (0, import_i18n52.__)("Text align", "elementor");
|
|
3943
4026
|
var AlignStartIcon = (0, import_ui42.withDirection)(import_icons20.AlignLeftIcon);
|
|
3944
4027
|
var AlignEndIcon = (0, import_ui42.withDirection)(import_icons20.AlignRightIcon);
|
|
3945
4028
|
var options8 = [
|
|
3946
4029
|
{
|
|
3947
4030
|
value: "start",
|
|
3948
|
-
label: (0,
|
|
4031
|
+
label: (0, import_i18n52.__)("Start", "elementor"),
|
|
3949
4032
|
renderContent: ({ size }) => /* @__PURE__ */ React75.createElement(AlignStartIcon, { fontSize: size }),
|
|
3950
4033
|
showTooltip: true
|
|
3951
4034
|
},
|
|
3952
4035
|
{
|
|
3953
4036
|
value: "center",
|
|
3954
|
-
label: (0,
|
|
4037
|
+
label: (0, import_i18n52.__)("Center", "elementor"),
|
|
3955
4038
|
renderContent: ({ size }) => /* @__PURE__ */ React75.createElement(import_icons20.AlignCenterIcon, { fontSize: size }),
|
|
3956
4039
|
showTooltip: true
|
|
3957
4040
|
},
|
|
3958
4041
|
{
|
|
3959
4042
|
value: "end",
|
|
3960
|
-
label: (0,
|
|
4043
|
+
label: (0, import_i18n52.__)("End", "elementor"),
|
|
3961
4044
|
renderContent: ({ size }) => /* @__PURE__ */ React75.createElement(AlignEndIcon, { fontSize: size }),
|
|
3962
4045
|
showTooltip: true
|
|
3963
4046
|
},
|
|
3964
4047
|
{
|
|
3965
4048
|
value: "justify",
|
|
3966
|
-
label: (0,
|
|
4049
|
+
label: (0, import_i18n52.__)("Justify", "elementor"),
|
|
3967
4050
|
renderContent: ({ size }) => /* @__PURE__ */ React75.createElement(import_icons20.AlignJustifiedIcon, { fontSize: size }),
|
|
3968
4051
|
showTooltip: true
|
|
3969
4052
|
}
|
|
@@ -3975,8 +4058,8 @@ var TextAlignmentField = () => {
|
|
|
3975
4058
|
// src/components/style-sections/typography-section/text-color-field.tsx
|
|
3976
4059
|
var React76 = __toESM(require("react"));
|
|
3977
4060
|
var import_editor_controls45 = require("@elementor/editor-controls");
|
|
3978
|
-
var
|
|
3979
|
-
var TEXT_COLOR_LABEL = (0,
|
|
4061
|
+
var import_i18n53 = require("@wordpress/i18n");
|
|
4062
|
+
var TEXT_COLOR_LABEL = (0, import_i18n53.__)("Text color", "elementor");
|
|
3980
4063
|
var TextColorField = () => {
|
|
3981
4064
|
return /* @__PURE__ */ React76.createElement(StylesField, { bind: "color", propDisplayName: TEXT_COLOR_LABEL }, /* @__PURE__ */ React76.createElement(StylesFieldLayout, { label: TEXT_COLOR_LABEL }, /* @__PURE__ */ React76.createElement(import_editor_controls45.ColorControl, null)));
|
|
3982
4065
|
};
|
|
@@ -3985,31 +4068,31 @@ var TextColorField = () => {
|
|
|
3985
4068
|
var React77 = __toESM(require("react"));
|
|
3986
4069
|
var import_editor_controls46 = require("@elementor/editor-controls");
|
|
3987
4070
|
var import_icons21 = require("@elementor/icons");
|
|
3988
|
-
var
|
|
3989
|
-
var TEXT_DECORATION_LABEL = (0,
|
|
4071
|
+
var import_i18n54 = require("@wordpress/i18n");
|
|
4072
|
+
var TEXT_DECORATION_LABEL = (0, import_i18n54.__)("Line decoration", "elementor");
|
|
3990
4073
|
var options9 = [
|
|
3991
4074
|
{
|
|
3992
4075
|
value: "none",
|
|
3993
|
-
label: (0,
|
|
4076
|
+
label: (0, import_i18n54.__)("None", "elementor"),
|
|
3994
4077
|
renderContent: ({ size }) => /* @__PURE__ */ React77.createElement(import_icons21.MinusIcon, { fontSize: size }),
|
|
3995
4078
|
showTooltip: true,
|
|
3996
4079
|
exclusive: true
|
|
3997
4080
|
},
|
|
3998
4081
|
{
|
|
3999
4082
|
value: "underline",
|
|
4000
|
-
label: (0,
|
|
4083
|
+
label: (0, import_i18n54.__)("Underline", "elementor"),
|
|
4001
4084
|
renderContent: ({ size }) => /* @__PURE__ */ React77.createElement(import_icons21.UnderlineIcon, { fontSize: size }),
|
|
4002
4085
|
showTooltip: true
|
|
4003
4086
|
},
|
|
4004
4087
|
{
|
|
4005
4088
|
value: "line-through",
|
|
4006
|
-
label: (0,
|
|
4089
|
+
label: (0, import_i18n54.__)("Line-through", "elementor"),
|
|
4007
4090
|
renderContent: ({ size }) => /* @__PURE__ */ React77.createElement(import_icons21.StrikethroughIcon, { fontSize: size }),
|
|
4008
4091
|
showTooltip: true
|
|
4009
4092
|
},
|
|
4010
4093
|
{
|
|
4011
4094
|
value: "overline",
|
|
4012
|
-
label: (0,
|
|
4095
|
+
label: (0, import_i18n54.__)("Overline", "elementor"),
|
|
4013
4096
|
renderContent: ({ size }) => /* @__PURE__ */ React77.createElement(import_icons21.OverlineIcon, { fontSize: size }),
|
|
4014
4097
|
showTooltip: true
|
|
4015
4098
|
}
|
|
@@ -4020,18 +4103,18 @@ var TextDecorationField = () => /* @__PURE__ */ React77.createElement(StylesFiel
|
|
|
4020
4103
|
var React78 = __toESM(require("react"));
|
|
4021
4104
|
var import_editor_controls47 = require("@elementor/editor-controls");
|
|
4022
4105
|
var import_icons22 = require("@elementor/icons");
|
|
4023
|
-
var
|
|
4024
|
-
var TEXT_DIRECTION_LABEL = (0,
|
|
4106
|
+
var import_i18n55 = require("@wordpress/i18n");
|
|
4107
|
+
var TEXT_DIRECTION_LABEL = (0, import_i18n55.__)("Direction", "elementor");
|
|
4025
4108
|
var options10 = [
|
|
4026
4109
|
{
|
|
4027
4110
|
value: "ltr",
|
|
4028
|
-
label: (0,
|
|
4111
|
+
label: (0, import_i18n55.__)("Left to right", "elementor"),
|
|
4029
4112
|
renderContent: ({ size }) => /* @__PURE__ */ React78.createElement(import_icons22.TextDirectionLtrIcon, { fontSize: size }),
|
|
4030
4113
|
showTooltip: true
|
|
4031
4114
|
},
|
|
4032
4115
|
{
|
|
4033
4116
|
value: "rtl",
|
|
4034
|
-
label: (0,
|
|
4117
|
+
label: (0, import_i18n55.__)("Right to left", "elementor"),
|
|
4035
4118
|
renderContent: ({ size }) => /* @__PURE__ */ React78.createElement(import_icons22.TextDirectionRtlIcon, { fontSize: size }),
|
|
4036
4119
|
showTooltip: true
|
|
4037
4120
|
}
|
|
@@ -4043,7 +4126,7 @@ var TextDirectionField = () => {
|
|
|
4043
4126
|
// src/components/style-sections/typography-section/text-stroke-field.tsx
|
|
4044
4127
|
var React79 = __toESM(require("react"));
|
|
4045
4128
|
var import_editor_controls48 = require("@elementor/editor-controls");
|
|
4046
|
-
var
|
|
4129
|
+
var import_i18n56 = require("@wordpress/i18n");
|
|
4047
4130
|
var initTextStroke = {
|
|
4048
4131
|
$$type: "stroke",
|
|
4049
4132
|
value: {
|
|
@@ -4060,9 +4143,11 @@ var initTextStroke = {
|
|
|
4060
4143
|
}
|
|
4061
4144
|
}
|
|
4062
4145
|
};
|
|
4063
|
-
var TEXT_STROKE_LABEL = (0,
|
|
4146
|
+
var TEXT_STROKE_LABEL = (0, import_i18n56.__)("Text stroke", "elementor");
|
|
4064
4147
|
var TextStrokeField = () => {
|
|
4065
|
-
const { value, setValue, canEdit } = useStylesField("stroke"
|
|
4148
|
+
const { value, setValue, canEdit } = useStylesField("stroke", {
|
|
4149
|
+
history: { propDisplayName: TEXT_STROKE_LABEL }
|
|
4150
|
+
});
|
|
4066
4151
|
const addTextStroke = () => {
|
|
4067
4152
|
setValue(initTextStroke);
|
|
4068
4153
|
};
|
|
@@ -4087,30 +4172,30 @@ var TextStrokeField = () => {
|
|
|
4087
4172
|
var React80 = __toESM(require("react"));
|
|
4088
4173
|
var import_editor_controls49 = require("@elementor/editor-controls");
|
|
4089
4174
|
var import_icons23 = require("@elementor/icons");
|
|
4090
|
-
var
|
|
4091
|
-
var TEXT_TRANSFORM_LABEL = (0,
|
|
4175
|
+
var import_i18n57 = require("@wordpress/i18n");
|
|
4176
|
+
var TEXT_TRANSFORM_LABEL = (0, import_i18n57.__)("Text transform", "elementor");
|
|
4092
4177
|
var options11 = [
|
|
4093
4178
|
{
|
|
4094
4179
|
value: "none",
|
|
4095
|
-
label: (0,
|
|
4180
|
+
label: (0, import_i18n57.__)("None", "elementor"),
|
|
4096
4181
|
renderContent: ({ size }) => /* @__PURE__ */ React80.createElement(import_icons23.MinusIcon, { fontSize: size }),
|
|
4097
4182
|
showTooltip: true
|
|
4098
4183
|
},
|
|
4099
4184
|
{
|
|
4100
4185
|
value: "capitalize",
|
|
4101
|
-
label: (0,
|
|
4186
|
+
label: (0, import_i18n57.__)("Capitalize", "elementor"),
|
|
4102
4187
|
renderContent: ({ size }) => /* @__PURE__ */ React80.createElement(import_icons23.LetterCaseIcon, { fontSize: size }),
|
|
4103
4188
|
showTooltip: true
|
|
4104
4189
|
},
|
|
4105
4190
|
{
|
|
4106
4191
|
value: "uppercase",
|
|
4107
|
-
label: (0,
|
|
4192
|
+
label: (0, import_i18n57.__)("Uppercase", "elementor"),
|
|
4108
4193
|
renderContent: ({ size }) => /* @__PURE__ */ React80.createElement(import_icons23.LetterCaseUpperIcon, { fontSize: size }),
|
|
4109
4194
|
showTooltip: true
|
|
4110
4195
|
},
|
|
4111
4196
|
{
|
|
4112
4197
|
value: "lowercase",
|
|
4113
|
-
label: (0,
|
|
4198
|
+
label: (0, import_i18n57.__)("Lowercase", "elementor"),
|
|
4114
4199
|
renderContent: ({ size }) => /* @__PURE__ */ React80.createElement(import_icons23.LetterCaseLowerIcon, { fontSize: size }),
|
|
4115
4200
|
showTooltip: true
|
|
4116
4201
|
}
|
|
@@ -4121,16 +4206,19 @@ var TransformField = () => /* @__PURE__ */ React80.createElement(StylesField, {
|
|
|
4121
4206
|
var React81 = __toESM(require("react"));
|
|
4122
4207
|
var import_react36 = require("react");
|
|
4123
4208
|
var import_editor_controls50 = require("@elementor/editor-controls");
|
|
4124
|
-
var
|
|
4125
|
-
var WORD_SPACING_LABEL = (0,
|
|
4209
|
+
var import_i18n58 = require("@wordpress/i18n");
|
|
4210
|
+
var WORD_SPACING_LABEL = (0, import_i18n58.__)("Word spacing", "elementor");
|
|
4126
4211
|
var WordSpacingField = () => {
|
|
4127
4212
|
const rowRef = (0, import_react36.useRef)(null);
|
|
4128
4213
|
return /* @__PURE__ */ React81.createElement(StylesField, { bind: "word-spacing", propDisplayName: WORD_SPACING_LABEL }, /* @__PURE__ */ React81.createElement(StylesFieldLayout, { label: WORD_SPACING_LABEL, ref: rowRef }, /* @__PURE__ */ React81.createElement(import_editor_controls50.SizeControl, { anchorRef: rowRef })));
|
|
4129
4214
|
};
|
|
4130
4215
|
|
|
4131
4216
|
// src/components/style-sections/typography-section/typography-section.tsx
|
|
4217
|
+
var COLUMN_COUNT_LABEL2 = (0, import_i18n59.__)("Column count", "elementor");
|
|
4132
4218
|
var TypographySection = () => {
|
|
4133
|
-
const { value: columnCount } = useStylesField("column-count"
|
|
4219
|
+
const { value: columnCount } = useStylesField("column-count", {
|
|
4220
|
+
history: { propDisplayName: COLUMN_COUNT_LABEL2 }
|
|
4221
|
+
});
|
|
4134
4222
|
const hasMultiColumns = !!(columnCount?.value && columnCount?.value > 1);
|
|
4135
4223
|
const isVersion330Active = (0, import_editor_v1_adapters16.isExperimentActive)("e_v_3_30");
|
|
4136
4224
|
return /* @__PURE__ */ React82.createElement(SectionContent, null, /* @__PURE__ */ React82.createElement(FontFamilyField, null), /* @__PURE__ */ React82.createElement(FontWeightField, null), /* @__PURE__ */ React82.createElement(FontSizeField, null), /* @__PURE__ */ React82.createElement(PanelDivider, null), /* @__PURE__ */ React82.createElement(TextAlignmentField, null), /* @__PURE__ */ React82.createElement(TextColorField, null), /* @__PURE__ */ React82.createElement(
|
|
@@ -4167,7 +4255,7 @@ var StyleTabSection = ({ section, fields = [] }) => {
|
|
|
4167
4255
|
var TABS_HEADER_HEIGHT = "37px";
|
|
4168
4256
|
var stickyHeaderStyles = {
|
|
4169
4257
|
position: "sticky",
|
|
4170
|
-
zIndex:
|
|
4258
|
+
zIndex: 1100,
|
|
4171
4259
|
opacity: 1,
|
|
4172
4260
|
backgroundColor: "background.default",
|
|
4173
4261
|
transition: "top 300ms ease"
|
|
@@ -4194,7 +4282,7 @@ var StyleTab = () => {
|
|
|
4194
4282
|
section: {
|
|
4195
4283
|
component: LayoutSection,
|
|
4196
4284
|
name: "Layout",
|
|
4197
|
-
title: (0,
|
|
4285
|
+
title: (0, import_i18n60.__)("Layout", "elementor")
|
|
4198
4286
|
},
|
|
4199
4287
|
fields: [
|
|
4200
4288
|
"display",
|
|
@@ -4213,7 +4301,7 @@ var StyleTab = () => {
|
|
|
4213
4301
|
section: {
|
|
4214
4302
|
component: SpacingSection,
|
|
4215
4303
|
name: "Spacing",
|
|
4216
|
-
title: (0,
|
|
4304
|
+
title: (0, import_i18n60.__)("Spacing", "elementor")
|
|
4217
4305
|
},
|
|
4218
4306
|
fields: ["margin", "padding"]
|
|
4219
4307
|
}
|
|
@@ -4223,7 +4311,7 @@ var StyleTab = () => {
|
|
|
4223
4311
|
section: {
|
|
4224
4312
|
component: SizeSection,
|
|
4225
4313
|
name: "Size",
|
|
4226
|
-
title: (0,
|
|
4314
|
+
title: (0, import_i18n60.__)("Size", "elementor")
|
|
4227
4315
|
},
|
|
4228
4316
|
fields: [
|
|
4229
4317
|
"width",
|
|
@@ -4243,7 +4331,7 @@ var StyleTab = () => {
|
|
|
4243
4331
|
section: {
|
|
4244
4332
|
component: PositionSection,
|
|
4245
4333
|
name: "Position",
|
|
4246
|
-
title: (0,
|
|
4334
|
+
title: (0, import_i18n60.__)("Position", "elementor")
|
|
4247
4335
|
},
|
|
4248
4336
|
fields: ["position", "z-index", "scroll-margin-top"]
|
|
4249
4337
|
}
|
|
@@ -4253,7 +4341,7 @@ var StyleTab = () => {
|
|
|
4253
4341
|
section: {
|
|
4254
4342
|
component: TypographySection,
|
|
4255
4343
|
name: "Typography",
|
|
4256
|
-
title: (0,
|
|
4344
|
+
title: (0, import_i18n60.__)("Typography", "elementor")
|
|
4257
4345
|
},
|
|
4258
4346
|
fields: [
|
|
4259
4347
|
"font-family",
|
|
@@ -4278,7 +4366,7 @@ var StyleTab = () => {
|
|
|
4278
4366
|
section: {
|
|
4279
4367
|
component: BackgroundSection,
|
|
4280
4368
|
name: "Background",
|
|
4281
|
-
title: (0,
|
|
4369
|
+
title: (0, import_i18n60.__)("Background", "elementor")
|
|
4282
4370
|
},
|
|
4283
4371
|
fields: ["background"]
|
|
4284
4372
|
}
|
|
@@ -4288,7 +4376,7 @@ var StyleTab = () => {
|
|
|
4288
4376
|
section: {
|
|
4289
4377
|
component: BorderSection,
|
|
4290
4378
|
name: "Border",
|
|
4291
|
-
title: (0,
|
|
4379
|
+
title: (0, import_i18n60.__)("Border", "elementor")
|
|
4292
4380
|
},
|
|
4293
4381
|
fields: ["border-radius", "border-width", "border-color", "border-style"]
|
|
4294
4382
|
}
|
|
@@ -4298,7 +4386,7 @@ var StyleTab = () => {
|
|
|
4298
4386
|
section: {
|
|
4299
4387
|
component: EffectsSection,
|
|
4300
4388
|
name: "Effects",
|
|
4301
|
-
title: (0,
|
|
4389
|
+
title: (0, import_i18n60.__)("Effects", "elementor")
|
|
4302
4390
|
},
|
|
4303
4391
|
fields: ["box-shadow"]
|
|
4304
4392
|
}
|
|
@@ -4312,7 +4400,7 @@ function ClassesHeader({ children }) {
|
|
|
4312
4400
|
function useCurrentClassesProp() {
|
|
4313
4401
|
const { elementType } = useElement();
|
|
4314
4402
|
const prop = Object.entries(elementType.propsSchema).find(
|
|
4315
|
-
([, propType]) => propType.kind === "plain" && propType.key ===
|
|
4403
|
+
([, propType]) => propType.kind === "plain" && propType.key === import_editor_props11.CLASSES_PROP_KEY
|
|
4316
4404
|
);
|
|
4317
4405
|
if (!prop) {
|
|
4318
4406
|
throw new Error("Element does not have a classes prop");
|
|
@@ -4346,8 +4434,8 @@ var PanelTabContent = () => {
|
|
|
4346
4434
|
setCurrentTab(newValue);
|
|
4347
4435
|
}
|
|
4348
4436
|
},
|
|
4349
|
-
/* @__PURE__ */ React85.createElement(import_ui44.Tab, { label: (0,
|
|
4350
|
-
/* @__PURE__ */ React85.createElement(import_ui44.Tab, { label: (0,
|
|
4437
|
+
/* @__PURE__ */ React85.createElement(import_ui44.Tab, { label: (0, import_i18n61.__)("General", "elementor"), ...getTabProps("settings") }),
|
|
4438
|
+
/* @__PURE__ */ React85.createElement(import_ui44.Tab, { label: (0, import_i18n61.__)("Style", "elementor"), ...getTabProps("style") })
|
|
4351
4439
|
), /* @__PURE__ */ React85.createElement(import_ui44.Divider, null)), /* @__PURE__ */ React85.createElement(import_ui44.TabPanel, { ...getTabPanelProps("settings"), disablePadding: true }, /* @__PURE__ */ React85.createElement(SettingsTab, null)), /* @__PURE__ */ React85.createElement(import_ui44.TabPanel, { ...getTabPanelProps("style"), disablePadding: true }, /* @__PURE__ */ React85.createElement(StyleTab, null))));
|
|
4352
4440
|
};
|
|
4353
4441
|
|
|
@@ -4360,7 +4448,7 @@ var EditingPanel = () => {
|
|
|
4360
4448
|
if (!element || !elementType) {
|
|
4361
4449
|
return null;
|
|
4362
4450
|
}
|
|
4363
|
-
const panelTitle = (0,
|
|
4451
|
+
const panelTitle = (0, import_i18n62.__)("Edit %s", "elementor").replace("%s", elementType.title);
|
|
4364
4452
|
return /* @__PURE__ */ React86.createElement(import_ui45.ErrorBoundary, { fallback: /* @__PURE__ */ React86.createElement(EditorPanelErrorFallback, null) }, /* @__PURE__ */ React86.createElement(import_session5.SessionStorageProvider, { prefix: "elementor" }, /* @__PURE__ */ React86.createElement(import_editor_ui5.ThemeProvider, null, /* @__PURE__ */ React86.createElement(import_editor_panels.Panel, null, /* @__PURE__ */ React86.createElement(import_editor_panels.PanelHeader, null, /* @__PURE__ */ React86.createElement(import_editor_panels.PanelHeaderTitle, null, panelTitle), /* @__PURE__ */ React86.createElement(import_icons24.AtomIcon, { fontSize: "small", sx: { color: "text.tertiary" } })), /* @__PURE__ */ React86.createElement(import_editor_panels.PanelBody, null, /* @__PURE__ */ React86.createElement(import_editor_controls51.ControlActionsProvider, { items: menuItems }, /* @__PURE__ */ React86.createElement(import_editor_controls51.ControlReplacementsProvider, { replacements: controlReplacements }, /* @__PURE__ */ React86.createElement(ElementProvider, { element, elementType }, /* @__PURE__ */ React86.createElement(EditingPanelTabs, null)))))))));
|
|
4365
4453
|
};
|
|
4366
4454
|
|
|
@@ -4380,7 +4468,6 @@ var PopoverScrollableContent = (props) => {
|
|
|
4380
4468
|
|
|
4381
4469
|
// src/init.ts
|
|
4382
4470
|
var import_editor = require("@elementor/editor");
|
|
4383
|
-
var import_editor_current_user = require("@elementor/editor-current-user");
|
|
4384
4471
|
var import_editor_panels3 = require("@elementor/editor-panels");
|
|
4385
4472
|
var import_editor_v1_adapters20 = require("@elementor/editor-v1-adapters");
|
|
4386
4473
|
|
|
@@ -4424,7 +4511,7 @@ var import_editor_controls58 = require("@elementor/editor-controls");
|
|
|
4424
4511
|
// src/dynamics/components/background-control-dynamic-tag.tsx
|
|
4425
4512
|
var React88 = __toESM(require("react"));
|
|
4426
4513
|
var import_editor_controls53 = require("@elementor/editor-controls");
|
|
4427
|
-
var
|
|
4514
|
+
var import_editor_props13 = require("@elementor/editor-props");
|
|
4428
4515
|
var import_icons25 = require("@elementor/icons");
|
|
4429
4516
|
|
|
4430
4517
|
// src/dynamics/hooks/use-dynamic-tag.ts
|
|
@@ -4453,7 +4540,7 @@ var getAtomicDynamicTags = () => {
|
|
|
4453
4540
|
};
|
|
4454
4541
|
|
|
4455
4542
|
// src/dynamics/utils.ts
|
|
4456
|
-
var
|
|
4543
|
+
var import_editor_props12 = require("@elementor/editor-props");
|
|
4457
4544
|
var import_schema = require("@elementor/schema");
|
|
4458
4545
|
var DYNAMIC_PROP_TYPE_KEY = "dynamic";
|
|
4459
4546
|
var isDynamicPropType = (prop) => prop.key === DYNAMIC_PROP_TYPE_KEY;
|
|
@@ -4462,12 +4549,12 @@ var getDynamicPropType = (propType) => {
|
|
|
4462
4549
|
return dynamicPropType && isDynamicPropType(dynamicPropType) ? dynamicPropType : null;
|
|
4463
4550
|
};
|
|
4464
4551
|
var isDynamicPropValue = (prop) => {
|
|
4465
|
-
return (0,
|
|
4552
|
+
return (0, import_editor_props12.isTransformable)(prop) && prop.$$type === DYNAMIC_PROP_TYPE_KEY;
|
|
4466
4553
|
};
|
|
4467
4554
|
var supportsDynamic = (propType) => {
|
|
4468
4555
|
return !!getDynamicPropType(propType);
|
|
4469
4556
|
};
|
|
4470
|
-
var dynamicPropTypeUtil = (0,
|
|
4557
|
+
var dynamicPropTypeUtil = (0, import_editor_props12.createPropUtils)(
|
|
4471
4558
|
DYNAMIC_PROP_TYPE_KEY,
|
|
4472
4559
|
import_schema.z.strictObject({
|
|
4473
4560
|
name: import_schema.z.string(),
|
|
@@ -4505,7 +4592,7 @@ var useDynamicTag = (tagName) => {
|
|
|
4505
4592
|
// src/dynamics/components/background-control-dynamic-tag.tsx
|
|
4506
4593
|
var BackgroundControlDynamicTagIcon = () => /* @__PURE__ */ React88.createElement(import_icons25.DatabaseIcon, { fontSize: "tiny" });
|
|
4507
4594
|
var BackgroundControlDynamicTagLabel = ({ value }) => {
|
|
4508
|
-
const context = (0, import_editor_controls53.useBoundProp)(
|
|
4595
|
+
const context = (0, import_editor_controls53.useBoundProp)(import_editor_props13.backgroundImageOverlayPropTypeUtil);
|
|
4509
4596
|
return /* @__PURE__ */ React88.createElement(import_editor_controls53.PropProvider, { ...context, value: value.value }, /* @__PURE__ */ React88.createElement(import_editor_controls53.PropKeyProvider, { bind: "image" }, /* @__PURE__ */ React88.createElement(Wrapper, { rawValue: value.value })));
|
|
4510
4597
|
};
|
|
4511
4598
|
var Wrapper = ({ rawValue }) => {
|
|
@@ -4525,7 +4612,7 @@ var import_editor_controls56 = require("@elementor/editor-controls");
|
|
|
4525
4612
|
var import_editor_ui8 = require("@elementor/editor-ui");
|
|
4526
4613
|
var import_icons27 = require("@elementor/icons");
|
|
4527
4614
|
var import_ui47 = require("@elementor/ui");
|
|
4528
|
-
var
|
|
4615
|
+
var import_i18n64 = require("@wordpress/i18n");
|
|
4529
4616
|
|
|
4530
4617
|
// src/hooks/use-persist-dynamic-value.ts
|
|
4531
4618
|
var import_session6 = require("@elementor/session");
|
|
@@ -4568,7 +4655,7 @@ var import_editor_controls55 = require("@elementor/editor-controls");
|
|
|
4568
4655
|
var import_editor_ui7 = require("@elementor/editor-ui");
|
|
4569
4656
|
var import_icons26 = require("@elementor/icons");
|
|
4570
4657
|
var import_ui46 = require("@elementor/ui");
|
|
4571
|
-
var
|
|
4658
|
+
var import_i18n63 = require("@wordpress/i18n");
|
|
4572
4659
|
var SIZE6 = "tiny";
|
|
4573
4660
|
var DynamicSelection = ({ close: closePopover }) => {
|
|
4574
4661
|
const [searchValue, setSearchValue] = (0, import_react42.useState)("");
|
|
@@ -4606,7 +4693,7 @@ var DynamicSelection = ({ close: closePopover }) => {
|
|
|
4606
4693
|
return /* @__PURE__ */ React90.createElement(React90.Fragment, null, /* @__PURE__ */ React90.createElement(
|
|
4607
4694
|
import_editor_ui7.PopoverHeader,
|
|
4608
4695
|
{
|
|
4609
|
-
title: (0,
|
|
4696
|
+
title: (0, import_i18n63.__)("Dynamic tags", "elementor"),
|
|
4610
4697
|
onClose: closePopover,
|
|
4611
4698
|
icon: /* @__PURE__ */ React90.createElement(import_icons26.DatabaseIcon, { fontSize: SIZE6 })
|
|
4612
4699
|
}
|
|
@@ -4615,7 +4702,7 @@ var DynamicSelection = ({ close: closePopover }) => {
|
|
|
4615
4702
|
{
|
|
4616
4703
|
value: searchValue,
|
|
4617
4704
|
onSearch: handleSearch,
|
|
4618
|
-
placeholder: (0,
|
|
4705
|
+
placeholder: (0, import_i18n63.__)("Search dynamic tags\u2026", "elementor")
|
|
4619
4706
|
}
|
|
4620
4707
|
), /* @__PURE__ */ React90.createElement(import_ui46.Divider, null), /* @__PURE__ */ React90.createElement(PopoverScrollableContent, null, /* @__PURE__ */ React90.createElement(
|
|
4621
4708
|
import_editor_ui7.PopoverMenuList,
|
|
@@ -4641,8 +4728,8 @@ var NoResults = ({ searchValue, onClear }) => /* @__PURE__ */ React90.createElem
|
|
|
4641
4728
|
sx: { pb: 3.5 }
|
|
4642
4729
|
},
|
|
4643
4730
|
/* @__PURE__ */ React90.createElement(import_icons26.DatabaseIcon, { fontSize: "large" }),
|
|
4644
|
-
/* @__PURE__ */ React90.createElement(import_ui46.Typography, { align: "center", variant: "subtitle2" }, (0,
|
|
4645
|
-
/* @__PURE__ */ React90.createElement(import_ui46.Typography, { align: "center", variant: "caption", sx: { display: "flex", flexDirection: "column" } }, (0,
|
|
4731
|
+
/* @__PURE__ */ React90.createElement(import_ui46.Typography, { align: "center", variant: "subtitle2" }, (0, import_i18n63.__)("Sorry, nothing matched", "elementor"), /* @__PURE__ */ React90.createElement("br", null), "\u201C", searchValue, "\u201D."),
|
|
4732
|
+
/* @__PURE__ */ React90.createElement(import_ui46.Typography, { align: "center", variant: "caption", sx: { display: "flex", flexDirection: "column" } }, (0, import_i18n63.__)("Try something else.", "elementor"), /* @__PURE__ */ React90.createElement(import_ui46.Link, { color: "text.secondary", variant: "caption", component: "button", onClick: onClear }, (0, import_i18n63.__)("Clear & try again", "elementor")))
|
|
4646
4733
|
);
|
|
4647
4734
|
var NoDynamicTags = () => /* @__PURE__ */ React90.createElement(import_ui46.Box, { sx: { overflowY: "hidden", height: 297, width: 220 } }, /* @__PURE__ */ React90.createElement(import_ui46.Divider, null), /* @__PURE__ */ React90.createElement(
|
|
4648
4735
|
import_ui46.Stack,
|
|
@@ -4656,8 +4743,8 @@ var NoDynamicTags = () => /* @__PURE__ */ React90.createElement(import_ui46.Box,
|
|
|
4656
4743
|
sx: { pb: 3.5 }
|
|
4657
4744
|
},
|
|
4658
4745
|
/* @__PURE__ */ React90.createElement(import_icons26.DatabaseIcon, { fontSize: "large" }),
|
|
4659
|
-
/* @__PURE__ */ React90.createElement(import_ui46.Typography, { align: "center", variant: "subtitle2" }, (0,
|
|
4660
|
-
/* @__PURE__ */ React90.createElement(import_ui46.Typography, { align: "center", variant: "caption" }, (0,
|
|
4746
|
+
/* @__PURE__ */ React90.createElement(import_ui46.Typography, { align: "center", variant: "subtitle2" }, (0, import_i18n63.__)("Streamline your workflow with dynamic tags", "elementor")),
|
|
4747
|
+
/* @__PURE__ */ React90.createElement(import_ui46.Typography, { align: "center", variant: "caption" }, (0, import_i18n63.__)("You'll need Elementor Pro to use this feature.", "elementor"))
|
|
4661
4748
|
));
|
|
4662
4749
|
var useFilteredOptions = (searchValue) => {
|
|
4663
4750
|
const dynamicTags = usePropDynamicTags();
|
|
@@ -4703,7 +4790,7 @@ var DynamicSelectionControl = () => {
|
|
|
4703
4790
|
{
|
|
4704
4791
|
size: SIZE7,
|
|
4705
4792
|
onClick: removeDynamicTag,
|
|
4706
|
-
"aria-label": (0,
|
|
4793
|
+
"aria-label": (0, import_i18n64.__)("Remove dynamic value", "elementor")
|
|
4707
4794
|
},
|
|
4708
4795
|
/* @__PURE__ */ React91.createElement(import_icons27.XIcon, { fontSize: SIZE7 })
|
|
4709
4796
|
))
|
|
@@ -4729,7 +4816,7 @@ var DynamicSettingsPopover = ({ dynamicTag }) => {
|
|
|
4729
4816
|
if (!hasDynamicSettings) {
|
|
4730
4817
|
return null;
|
|
4731
4818
|
}
|
|
4732
|
-
return /* @__PURE__ */ React91.createElement(React91.Fragment, null, /* @__PURE__ */ React91.createElement(import_ui47.IconButton, { size: SIZE7, ...(0, import_ui47.bindTrigger)(popupState), "aria-label": (0,
|
|
4819
|
+
return /* @__PURE__ */ React91.createElement(React91.Fragment, null, /* @__PURE__ */ React91.createElement(import_ui47.IconButton, { size: SIZE7, ...(0, import_ui47.bindTrigger)(popupState), "aria-label": (0, import_i18n64.__)("Settings", "elementor") }, /* @__PURE__ */ React91.createElement(import_icons27.SettingsIcon, { fontSize: SIZE7 })), /* @__PURE__ */ React91.createElement(
|
|
4733
4820
|
import_ui47.Popover,
|
|
4734
4821
|
{
|
|
4735
4822
|
disablePortal: true,
|
|
@@ -4775,7 +4862,7 @@ var Control3 = ({ control }) => {
|
|
|
4775
4862
|
|
|
4776
4863
|
// src/dynamics/dynamic-transformer.ts
|
|
4777
4864
|
var import_editor_canvas3 = require("@elementor/editor-canvas");
|
|
4778
|
-
var
|
|
4865
|
+
var import_editor_props14 = require("@elementor/editor-props");
|
|
4779
4866
|
|
|
4780
4867
|
// src/dynamics/errors.ts
|
|
4781
4868
|
var import_utils9 = require("@elementor/utils");
|
|
@@ -4793,7 +4880,7 @@ var dynamicTransformer = (0, import_editor_canvas3.createTransformer)((value) =>
|
|
|
4793
4880
|
});
|
|
4794
4881
|
function simpleTransform(props) {
|
|
4795
4882
|
const transformed = Object.entries(props).map(([settingKey, settingValue]) => {
|
|
4796
|
-
const value = (0,
|
|
4883
|
+
const value = (0, import_editor_props14.isTransformable)(settingValue) ? settingValue.value : settingValue;
|
|
4797
4884
|
return [settingKey, value];
|
|
4798
4885
|
});
|
|
4799
4886
|
return Object.fromEntries(transformed);
|
|
@@ -4826,14 +4913,14 @@ function getDynamicValue(name, settings) {
|
|
|
4826
4913
|
var React92 = __toESM(require("react"));
|
|
4827
4914
|
var import_editor_controls57 = require("@elementor/editor-controls");
|
|
4828
4915
|
var import_icons28 = require("@elementor/icons");
|
|
4829
|
-
var
|
|
4916
|
+
var import_i18n65 = require("@wordpress/i18n");
|
|
4830
4917
|
var usePropDynamicAction = () => {
|
|
4831
4918
|
const { propType } = (0, import_editor_controls57.useBoundProp)();
|
|
4832
4919
|
const visible = !!propType && supportsDynamic(propType);
|
|
4833
4920
|
return {
|
|
4834
4921
|
visible,
|
|
4835
4922
|
icon: import_icons28.DatabaseIcon,
|
|
4836
|
-
title: (0,
|
|
4923
|
+
title: (0, import_i18n65.__)("Dynamic tags", "elementor"),
|
|
4837
4924
|
content: ({ close }) => /* @__PURE__ */ React92.createElement(DynamicSelection, { close })
|
|
4838
4925
|
};
|
|
4839
4926
|
};
|
|
@@ -4866,7 +4953,7 @@ var init = () => {
|
|
|
4866
4953
|
// src/reset-style-props.tsx
|
|
4867
4954
|
var import_editor_controls59 = require("@elementor/editor-controls");
|
|
4868
4955
|
var import_icons29 = require("@elementor/icons");
|
|
4869
|
-
var
|
|
4956
|
+
var import_i18n66 = require("@wordpress/i18n");
|
|
4870
4957
|
var { registerAction } = controlActionsMenu;
|
|
4871
4958
|
function initResetStyleProps() {
|
|
4872
4959
|
registerAction({
|
|
@@ -4880,7 +4967,7 @@ function useResetStyleValueProps() {
|
|
|
4880
4967
|
const { value, setValue, path, bind } = (0, import_editor_controls59.useBoundProp)();
|
|
4881
4968
|
return {
|
|
4882
4969
|
visible: isStyle && value !== null && value !== void 0 && path.length <= 2 && !EXCLUDED_BINDS.includes(bind),
|
|
4883
|
-
title: (0,
|
|
4970
|
+
title: (0, import_i18n66.__)("Clear", "elementor"),
|
|
4884
4971
|
icon: import_icons29.BrushBigIcon,
|
|
4885
4972
|
onClick: () => setValue(null)
|
|
4886
4973
|
};
|
|
@@ -4909,7 +4996,7 @@ var StyledUnstableColorIndicator = (0, import_ui48.styled)(import_ui48.UnstableC
|
|
|
4909
4996
|
var React94 = __toESM(require("react"));
|
|
4910
4997
|
var import_editor_canvas6 = require("@elementor/editor-canvas");
|
|
4911
4998
|
var import_ui49 = require("@elementor/ui");
|
|
4912
|
-
var
|
|
4999
|
+
var import_i18n67 = require("@wordpress/i18n");
|
|
4913
5000
|
var backgroundGradientOverlayTransformer = (0, import_editor_canvas6.createTransformer)((value) => /* @__PURE__ */ React94.createElement(import_ui49.Stack, { direction: "row", gap: 10 }, /* @__PURE__ */ React94.createElement(ItemIconGradient, { value }), /* @__PURE__ */ React94.createElement(ItemLabelGradient, { value })));
|
|
4914
5001
|
var ItemIconGradient = ({ value }) => {
|
|
4915
5002
|
const gradient = getGradientValue(value);
|
|
@@ -4917,9 +5004,9 @@ var ItemIconGradient = ({ value }) => {
|
|
|
4917
5004
|
};
|
|
4918
5005
|
var ItemLabelGradient = ({ value }) => {
|
|
4919
5006
|
if (value.type === "linear") {
|
|
4920
|
-
return /* @__PURE__ */ React94.createElement("span", null, (0,
|
|
5007
|
+
return /* @__PURE__ */ React94.createElement("span", null, (0, import_i18n67.__)("Linear Gradient", "elementor"));
|
|
4921
5008
|
}
|
|
4922
|
-
return /* @__PURE__ */ React94.createElement("span", null, (0,
|
|
5009
|
+
return /* @__PURE__ */ React94.createElement("span", null, (0, import_i18n67.__)("Radial Gradient", "elementor"));
|
|
4923
5010
|
};
|
|
4924
5011
|
var getGradientValue = (gradient) => {
|
|
4925
5012
|
const stops = gradient.stops?.map(({ color, offset }) => `${color} ${offset ?? 0}%`)?.join(",");
|
|
@@ -5029,10 +5116,6 @@ function init3() {
|
|
|
5029
5116
|
id: "editing-panel-hooks",
|
|
5030
5117
|
component: EditingPanelHooks
|
|
5031
5118
|
});
|
|
5032
|
-
(0, import_editor.injectIntoLogic)({
|
|
5033
|
-
id: "current-user-data",
|
|
5034
|
-
component: import_editor_current_user.PrefetchUserData
|
|
5035
|
-
});
|
|
5036
5119
|
init();
|
|
5037
5120
|
init2();
|
|
5038
5121
|
if ((0, import_editor_v1_adapters20.isExperimentActive)(EXPERIMENTAL_FEATURES.V_3_30)) {
|