@elementor/editor-editing-panel 4.0.0-502 → 4.0.0-504

package/dist/index.d.mts

@@ -2,7 +2,7 @@ import * as _elementor_locations from '@elementor/locations';
 import { StyleDefinition, StyleDefinitionVariant, StyleDefinitionState, StyleDefinitionID } from '@elementor/editor-styles';
 import * as react from 'react';
 import { FC, PropsWithChildren, ReactNode, Dispatch, ElementType as ElementType$1, ComponentProps, ComponentType } from 'react';
-import { Control as Control$1, ElementControl, Element, ElementType, ControlLayout } from '@elementor/editor-elements';
+import { Control as Control$1, ElementControl, Element, ElementType, ControlLayout, ControlItem } from '@elementor/editor-elements';
 import * as _elementor_editor_props from '@elementor/editor-props';
 import { PropKey, PropTypeUtil, PropsSchema, ObjectPropType } from '@elementor/editor-props';
 import * as _emotion_styled from '@emotion/styled';
@@ -1357,4 +1357,32 @@ type LicenseConfig = {
 };
 declare function setLicenseConfig(newConfig: Partial<LicenseConfig>): void;
 
-export { Control as BaseControl, type ControlType, CustomCssIndicator, ElementProvider, FIELD_TYPE, HISTORY_DEBOUNCE_WAIT, SectionContent, SettingsControl, SettingsField, StyleIndicator, StyleTabSection, StylesProviderCannotUpdatePropsError, type ValidationEvent, type ValidationResult, controlActionsMenu, controlsRegistry, createTopLevelObjectType, doApplyClasses, doGetAppliedClasses, doUnapplyClass, getControlReplacements, getFieldIndicators, getSubtitle, getTitle, init, injectIntoClassSelectorActions, injectIntoCssClassConvert, injectIntoPanelHeaderTop, injectIntoStyleTab, registerControlReplacement, registerEditingPanelReplacement, registerFieldIndicator, registerStyleProviderToColors, setLicenseConfig, stylesInheritanceTransformersRegistry, useClassesProp, useCustomCss, useElement, useFontFamilies, usePanelActions, usePanelStatus, useStateByElement, useStyle, useStylesRerender };
+type DynamicTags = Record<DynamicTag['name'], DynamicTag>;
+type DynamicTag = {
+    name: string;
+    label: string;
+    group: string;
+    categories: string[];
+    atomic_controls: ControlItem[];
+    props_schema: PropsSchema;
+    meta?: {
+        origin: string;
+        required_license: string;
+    };
+};
+type DynamicTagsManager = {
+    createTag: (id: string, name: string, settings: Record<string, unknown>) => TagInstance;
+    loadTagDataFromCache: (tag: TagInstance) => unknown;
+    refreshCacheFromServer: (callback: () => void) => void;
+};
+type TagInstance = {
+    options: {
+        id: string;
+        name: string;
+    };
+    model: {
+        toJSON: () => Record<string, unknown>;
+    };
+};
+
+export { Control as BaseControl, type ControlType, CustomCssIndicator, type DynamicTag, type DynamicTags, type DynamicTagsManager, ElementProvider, FIELD_TYPE, HISTORY_DEBOUNCE_WAIT, SectionContent, SettingsControl, SettingsField, StyleIndicator, StyleTabSection, StylesProviderCannotUpdatePropsError, type ValidationEvent, type ValidationResult, controlActionsMenu, controlsRegistry, createTopLevelObjectType, doApplyClasses, doGetAppliedClasses, doUnapplyClass, getControlReplacements, getFieldIndicators, getSubtitle, getTitle, init, injectIntoClassSelectorActions, injectIntoCssClassConvert, injectIntoPanelHeaderTop, injectIntoStyleTab, registerControlReplacement, registerEditingPanelReplacement, registerFieldIndicator, registerStyleProviderToColors, setLicenseConfig, stylesInheritanceTransformersRegistry, useClassesProp, useCustomCss, useElement, useFontFamilies, usePanelActions, usePanelStatus, useStateByElement, useStyle, useStylesRerender };

package/dist/index.d.ts

@@ -2,7 +2,7 @@ import * as _elementor_locations from '@elementor/locations';
 import { StyleDefinition, StyleDefinitionVariant, StyleDefinitionState, StyleDefinitionID } from '@elementor/editor-styles';
 import * as react from 'react';
 import { FC, PropsWithChildren, ReactNode, Dispatch, ElementType as ElementType$1, ComponentProps, ComponentType } from 'react';
-import { Control as Control$1, ElementControl, Element, ElementType, ControlLayout } from '@elementor/editor-elements';
+import { Control as Control$1, ElementControl, Element, ElementType, ControlLayout, ControlItem } from '@elementor/editor-elements';
 import * as _elementor_editor_props from '@elementor/editor-props';
 import { PropKey, PropTypeUtil, PropsSchema, ObjectPropType } from '@elementor/editor-props';
 import * as _emotion_styled from '@emotion/styled';
@@ -1357,4 +1357,32 @@ type LicenseConfig = {
 };
 declare function setLicenseConfig(newConfig: Partial<LicenseConfig>): void;
 
-export { Control as BaseControl, type ControlType, CustomCssIndicator, ElementProvider, FIELD_TYPE, HISTORY_DEBOUNCE_WAIT, SectionContent, SettingsControl, SettingsField, StyleIndicator, StyleTabSection, StylesProviderCannotUpdatePropsError, type ValidationEvent, type ValidationResult, controlActionsMenu, controlsRegistry, createTopLevelObjectType, doApplyClasses, doGetAppliedClasses, doUnapplyClass, getControlReplacements, getFieldIndicators, getSubtitle, getTitle, init, injectIntoClassSelectorActions, injectIntoCssClassConvert, injectIntoPanelHeaderTop, injectIntoStyleTab, registerControlReplacement, registerEditingPanelReplacement, registerFieldIndicator, registerStyleProviderToColors, setLicenseConfig, stylesInheritanceTransformersRegistry, useClassesProp, useCustomCss, useElement, useFontFamilies, usePanelActions, usePanelStatus, useStateByElement, useStyle, useStylesRerender };
+type DynamicTags = Record<DynamicTag['name'], DynamicTag>;
+type DynamicTag = {
+    name: string;
+    label: string;
+    group: string;
+    categories: string[];
+    atomic_controls: ControlItem[];
+    props_schema: PropsSchema;
+    meta?: {
+        origin: string;
+        required_license: string;
+    };
+};
+type DynamicTagsManager = {
+    createTag: (id: string, name: string, settings: Record<string, unknown>) => TagInstance;
+    loadTagDataFromCache: (tag: TagInstance) => unknown;
+    refreshCacheFromServer: (callback: () => void) => void;
+};
+type TagInstance = {
+    options: {
+        id: string;
+        name: string;
+    };
+    model: {
+        toJSON: () => Record<string, unknown>;
+    };
+};
+
+export { Control as BaseControl, type ControlType, CustomCssIndicator, type DynamicTag, type DynamicTags, type DynamicTagsManager, ElementProvider, FIELD_TYPE, HISTORY_DEBOUNCE_WAIT, SectionContent, SettingsControl, SettingsField, StyleIndicator, StyleTabSection, StylesProviderCannotUpdatePropsError, type ValidationEvent, type ValidationResult, controlActionsMenu, controlsRegistry, createTopLevelObjectType, doApplyClasses, doGetAppliedClasses, doUnapplyClass, getControlReplacements, getFieldIndicators, getSubtitle, getTitle, init, injectIntoClassSelectorActions, injectIntoCssClassConvert, injectIntoPanelHeaderTop, injectIntoStyleTab, registerControlReplacement, registerEditingPanelReplacement, registerFieldIndicator, registerStyleProviderToColors, setLicenseConfig, stylesInheritanceTransformersRegistry, useClassesProp, useCustomCss, useElement, useFontFamilies, usePanelActions, usePanelStatus, useStateByElement, useStyle, useStylesRerender };

package/dist/index.js

@@ -1788,7 +1788,7 @@ function EditorPanelErrorFallback() {
 // src/components/editing-panel-tabs.tsx
 var import_react35 = require("react");
 var React82 = __toESM(require("react"));
-var import_editor_v1_adapters6 = require("@elementor/editor-v1-adapters");
+var import_editor_v1_adapters8 = require("@elementor/editor-v1-adapters");
 var import_ui37 = require("@elementor/ui");
 var import_i18n56 = require("@wordpress/i18n");
 
@@ -2876,22 +2876,11 @@ var import_ui21 = require("@elementor/ui");
 var import_i18n11 = require("@wordpress/i18n");
 
 // src/hooks/use-direction.ts
+var import_editor_v1_adapters5 = require("@elementor/editor-v1-adapters");
 var import_ui19 = require("@elementor/ui");
-
-// src/sync/get-elementor-globals.ts
-var getElementorConfig = () => {
-  const extendedWindow2 = window;
-  return extendedWindow2.elementor?.config ?? {};
-};
-var getElementorFrontendConfig = () => {
-  const extendedWindow2 = window;
-  return extendedWindow2.elementorFrontend?.config ?? {};
-};
-
-// src/hooks/use-direction.ts
 function useDirection() {
   const theme = (0, import_ui19.useTheme)();
-  const isUiRtl = "rtl" === theme.direction, isSiteRtl = !!getElementorFrontendConfig()?.is_rtl;
+  const isUiRtl = "rtl" === theme.direction, isSiteRtl = !!(0, import_editor_v1_adapters5.getElementorFrontendConfig)()?.is_rtl;
   return { isSiteRtl, isUiRtl };
 }
 
@@ -3130,14 +3119,14 @@ var import_editor_elements12 = require("@elementor/editor-elements");
 var import_i18n28 = require("@wordpress/i18n");
 
 // src/hooks/use-computed-style.ts
-var import_editor_v1_adapters5 = require("@elementor/editor-v1-adapters");
+var import_editor_v1_adapters6 = require("@elementor/editor-v1-adapters");
 function useComputedStyle(elementId) {
-  return (0, import_editor_v1_adapters5.__privateUseListenTo)(
+  return (0, import_editor_v1_adapters6.__privateUseListenTo)(
     [
-      (0, import_editor_v1_adapters5.windowEvent)("elementor/device-mode/change"),
-      (0, import_editor_v1_adapters5.commandEndEvent)("document/elements/reset-style"),
-      (0, import_editor_v1_adapters5.commandEndEvent)("document/elements/settings"),
-      (0, import_editor_v1_adapters5.commandEndEvent)("document/elements/paste-style")
+      (0, import_editor_v1_adapters6.windowEvent)("elementor/device-mode/change"),
+      (0, import_editor_v1_adapters6.commandEndEvent)("document/elements/reset-style"),
+      (0, import_editor_v1_adapters6.commandEndEvent)("document/elements/settings"),
+      (0, import_editor_v1_adapters6.commandEndEvent)("document/elements/paste-style")
     ],
     () => {
       if (!elementId) {
@@ -4198,6 +4187,7 @@ var import_i18n42 = require("@wordpress/i18n");
 
 // src/components/style-sections/typography-section/hooks/use-font-families.ts
 var import_react29 = require("react");
+var import_editor_v1_adapters7 = require("@elementor/editor-v1-adapters");
 var import_i18n41 = require("@wordpress/i18n");
 var supportedCategories = {
   system: (0, import_i18n41.__)("System", "elementor"),
@@ -4205,7 +4195,7 @@ var supportedCategories = {
   googlefonts: (0, import_i18n41.__)("Google Fonts", "elementor")
 };
 var getFontFamilies = () => {
-  const { controls } = getElementorConfig();
+  const { controls } = (0, import_editor_v1_adapters7.getElementorConfig)();
   const options12 = controls?.font?.options;
   if (!options12) {
     return null;
@@ -4778,7 +4768,7 @@ var EditingPanelTabs = () => {
 var PanelTabContent = () => {
   const editorDefaults = useDefaultPanelSettings();
   const defaultComponentTab = editorDefaults.defaultTab;
-  const isInteractionsActive = (0, import_editor_v1_adapters6.isExperimentActive)("e_interactions");
+  const isInteractionsActive = (0, import_editor_v1_adapters8.isExperimentActive)("e_interactions");
   const [currentTab, setCurrentTab] = useStateByElement("tab", defaultComponentTab);
   const { getTabProps, getTabPanelProps, getTabsProps } = (0, import_ui37.useTabs)(currentTab);
   return /* @__PURE__ */ React82.createElement(ScrollProvider, null, /* @__PURE__ */ React82.createElement(import_ui37.Stack, { direction: "column", sx: { width: "100%" } }, /* @__PURE__ */ React82.createElement(import_ui37.Stack, { sx: { ...stickyHeaderStyles, top: 0 } }, /* @__PURE__ */ React82.createElement(
@@ -4821,11 +4811,11 @@ var EditingPanel = () => {
 // src/init.ts
 var import_editor = require("@elementor/editor");
 var import_editor_panels3 = require("@elementor/editor-panels");
-var import_editor_v1_adapters8 = require("@elementor/editor-v1-adapters");
+var import_editor_v1_adapters12 = require("@elementor/editor-v1-adapters");
 
 // src/hooks/use-open-editor-panel.ts
 var import_react36 = require("react");
-var import_editor_v1_adapters7 = require("@elementor/editor-v1-adapters");
+var import_editor_v1_adapters9 = require("@elementor/editor-v1-adapters");
 
 // src/panel.ts
 var import_editor_panels2 = require("@elementor/editor-panels");
@@ -4849,7 +4839,7 @@ var isAtomicWidgetSelected = () => {
 var useOpenEditorPanel = () => {
   const { open } = usePanelActions();
   (0, import_react36.useEffect)(() => {
-    return (0, import_editor_v1_adapters7.__privateListenTo)((0, import_editor_v1_adapters7.commandStartEvent)("panel/editor/open"), () => {
+    return (0, import_editor_v1_adapters9.__privateListenTo)((0, import_editor_v1_adapters9.commandStartEvent)("panel/editor/open"), () => {
       if (isAtomicWidgetSelected()) {
         open();
       }
@@ -4869,8 +4859,8 @@ var import_react37 = require("react");
 var import_editor_ui9 = require("@elementor/editor-ui");
 var import_i18n58 = require("@wordpress/i18n");
 function getCustomCssPromotion() {
-  const extendedWindow2 = window;
-  return extendedWindow2.elementor?.config?.v4Promotions?.customCss;
+  const extendedWindow = window;
+  return extendedWindow.elementor?.config?.v4Promotions?.customCss;
 }
 var CustomCssSection = () => {
   const [showInfoTip, setShowInfoTip] = (0, import_react37.useState)(false);
@@ -5303,26 +5293,60 @@ var import_editor_props18 = require("@elementor/editor-props");
 var import_icons23 = require("@elementor/icons");
 
 // src/dynamics/hooks/use-dynamic-tag.ts
-var import_react39 = require("react");
+var import_react40 = require("react");
 
 // src/dynamics/hooks/use-prop-dynamic-tags.ts
-var import_react38 = require("react");
+var import_react39 = require("react");
 var import_editor_controls53 = require("@elementor/editor-controls");
 
 // src/dynamics/sync/get-atomic-dynamic-tags.ts
-var getAtomicDynamicTags = () => {
-  const { atomicDynamicTags } = getElementorConfig();
+var import_editor_v1_adapters10 = require("@elementor/editor-v1-adapters");
+
+// src/hooks/use-license-config.ts
+var import_react38 = require("react");
+var config = { expired: false };
+var listeners = /* @__PURE__ */ new Set();
+function setLicenseConfig(newConfig) {
+  config = { ...config, ...newConfig };
+  listeners.forEach((listener) => listener());
+}
+function getLicenseConfig() {
+  return config;
+}
+function subscribe(listener) {
+  listeners.add(listener);
+  return () => listeners.delete(listener);
+}
+function useLicenseConfig() {
+  return (0, import_react38.useSyncExternalStore)(subscribe, getLicenseConfig, getLicenseConfig);
+}
+
+// src/dynamics/sync/get-atomic-dynamic-tags.ts
+var getAtomicDynamicTags = (shouldFilterByLicense = true) => {
+  const { atomicDynamicTags } = (0, import_editor_v1_adapters10.getElementorConfig)();
   if (!atomicDynamicTags) {
     return null;
   }
   return {
-    tags: atomicDynamicTags.tags,
+    tags: shouldFilterByLicense ? filterByLicense(atomicDynamicTags.tags) : atomicDynamicTags.tags,
     groups: atomicDynamicTags.groups
   };
 };
+var filterByLicense = (tags) => {
+  const { expired } = getLicenseConfig();
+  if (expired) {
+    return Object.fromEntries(
+      Object.entries(tags).filter(
+        ([, tag]) => !(tag?.meta?.origin === "elementor" && tag?.meta?.required_license)
+      )
+    );
+  }
+  return tags;
+};
 
 // src/dynamics/utils.ts
 var import_editor_props17 = require("@elementor/editor-props");
+var import_editor_v1_adapters11 = require("@elementor/editor-v1-adapters");
 var import_schema = require("@elementor/schema");
 var DYNAMIC_PROP_TYPE_KEY = "dynamic";
 var dynamicPropTypeUtil = (0, import_editor_props17.createPropUtils)(
@@ -5334,7 +5358,7 @@ var dynamicPropTypeUtil = (0, import_editor_props17.createPropUtils)(
   })
 );
 var isDynamicTagSupported = (tagName) => {
-  return !!getElementorConfig()?.atomicDynamicTags?.tags?.[tagName];
+  return !!(0, import_editor_v1_adapters11.getElementorConfig)()?.atomicDynamicTags?.tags?.[tagName];
 };
 var isDynamicPropType = (prop) => prop.key === DYNAMIC_PROP_TYPE_KEY;
 var getDynamicPropType = (propType) => {
@@ -5350,16 +5374,27 @@ var supportsDynamic = (propType) => {
 
 // src/dynamics/hooks/use-prop-dynamic-tags.ts
 var usePropDynamicTags = () => {
+  return usePropDynamicTagsInternal(true);
+};
+var useAllPropDynamicTags = () => {
+  return usePropDynamicTagsInternal(false);
+};
+var usePropDynamicTagsInternal = (filterByLicense2) => {
   let categories = [];
   const { propType } = (0, import_editor_controls53.useBoundProp)();
   if (propType) {
     const propDynamicType = getDynamicPropType(propType);
     categories = propDynamicType?.settings.categories || [];
   }
-  return (0, import_react38.useMemo)(() => getDynamicTagsByCategories(categories), [categories.join()]);
+  const categoriesKey = categories.join();
+  return (0, import_react39.useMemo)(
+    () => getDynamicTagsByCategories(categories, filterByLicense2),
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [categoriesKey, filterByLicense2]
+  );
 };
-var getDynamicTagsByCategories = (categories) => {
-  const { tags, groups } = getAtomicDynamicTags() || {};
+var getDynamicTagsByCategories = (categories, filterByLicense2) => {
+  const { tags, groups } = getAtomicDynamicTags(filterByLicense2) || {};
   if (!categories.length || !tags || !groups) {
     return [];
   }
@@ -5385,8 +5420,8 @@ var getDynamicTagsByCategories = (categories) => {
 
 // src/dynamics/hooks/use-dynamic-tag.ts
 var useDynamicTag = (tagName) => {
-  const dynamicTags = usePropDynamicTags();
-  return (0, import_react39.useMemo)(() => dynamicTags.find((tag) => tag.name === tagName) ?? null, [dynamicTags, tagName]);
+  const dynamicTags = useAllPropDynamicTags();
+  return (0, import_react40.useMemo)(() => dynamicTags.find((tag) => tag.name === tagName) ?? null, [dynamicTags, tagName]);
 };
 
 // src/dynamics/components/background-control-dynamic-tag.tsx
@@ -5414,25 +5449,6 @@ var import_icons25 = require("@elementor/icons");
 var import_ui41 = require("@elementor/ui");
 var import_i18n62 = require("@wordpress/i18n");
 
-// src/hooks/use-license-config.ts
-var import_react40 = require("react");
-var config = { expired: false };
-var listeners = /* @__PURE__ */ new Set();
-function setLicenseConfig(newConfig) {
-  config = { ...config, ...newConfig };
-  listeners.forEach((listener) => listener());
-}
-function getConfig() {
-  return config;
-}
-function subscribe(listener) {
-  listeners.add(listener);
-  return () => listeners.delete(listener);
-}
-function useLicenseConfig() {
-  return (0, import_react40.useSyncExternalStore)(subscribe, getConfig, getConfig);
-}
-
 // src/hooks/use-persist-dynamic-value.ts
 var import_session9 = require("@elementor/session");
 var usePersistDynamicValue = (propKey) => {
@@ -5855,7 +5871,6 @@ var DynamicTagsManagerNotFoundError = (0, import_utils9.createError)({
 });
 
 // src/dynamics/dynamic-transformer.ts
-var extendedWindow = window;
 var dynamicTransformer = (0, import_editor_canvas2.createTransformer)((value, { propType }) => {
   if (!value?.name || !isDynamicTagSupported(value.name)) {
     return propType?.default ?? null;
@@ -5870,7 +5885,7 @@ function simpleTransform(props) {
   return Object.fromEntries(transformed);
 }
 function getDynamicValue(name, settings) {
-  const { dynamicTags } = extendedWindow.elementor ?? {};
+  const { dynamicTags } = window.elementor ?? {};
   if (!dynamicTags) {
     throw new DynamicTagsManagerNotFoundError();
   }
@@ -6678,7 +6693,7 @@ function init4() {
   init();
 }
 var blockV1Panel = () => {
-  (0, import_editor_v1_adapters8.blockCommand)({
+  (0, import_editor_v1_adapters12.blockCommand)({
     command: "panel/editor/open",
     condition: isAtomicWidgetSelected
   });