@elementor/editor-editing-panel 1.48.0 → 1.50.0

package/dist/index.mjs

@@ -148,6 +148,12 @@ var getStylesProviderThemeColor = (provider) => {
   }
   return getStyleProviderColors(provider).getThemeColor;
 };
+function getTempStylesProviderThemeColor(provider) {
+  if (isElementsStylesProvider(provider)) {
+    return (theme) => theme.palette.primary.main;
+  }
+  return getStylesProviderThemeColor(provider);
+}
 
 // src/components/creatable-autocomplete/creatable-autocomplete.tsx
 import * as React4 from "react";
@@ -492,6 +498,7 @@ import {
   bindTrigger,
   Chip as Chip2,
   Stack as Stack2,
+  ThemeProvider,
   Typography as Typography2,
   UnstableChipGroup,
   usePopupState
@@ -833,7 +840,7 @@ function StateMenuItem({ state, closeMenu, ...props }) {
         StyleIndicator,
         {
           "aria-label": __2("Has style", "elementor"),
-          getColor: getStylesProviderThemeColor(provider ?? "")
+          getColor: getTempStylesProviderThemeColor(provider ?? "")
         }
       ), state ?? "normal")
     )
@@ -910,7 +917,7 @@ function CssClassItem(props) {
   const providerActions = provider ? stylesRepository3.getProviderByKey(provider)?.actions : null;
   const allowRename = Boolean(providerActions?.update) && userCan(provider ?? "")?.update;
   const isShowingState = isActive && meta.state;
-  return /* @__PURE__ */ React7.createElement(React7.Fragment, null, /* @__PURE__ */ React7.createElement(
+  return /* @__PURE__ */ React7.createElement(ThemeProvider, { palette: "default" }, /* @__PURE__ */ React7.createElement(
     UnstableChipGroup,
     {
       ref: setChipRef,
@@ -988,7 +995,7 @@ var EMPTY_OPTION = {
   label: __4("local", "elementor"),
   value: null,
   fixed: true,
-  color: "accent",
+  color: getTempStylesProviderColorName("accent"),
   icon: /* @__PURE__ */ React8.createElement(MapPinIcon, null),
   provider: null
 };
@@ -1099,13 +1106,19 @@ function useOptions() {
         label: styleDef.label,
         value: styleDef.id,
         fixed: isElements,
-        color: getStylesProviderColorName(provider.getKey()),
+        color: getTempStylesProviderColorName(getStylesProviderColorName(provider.getKey())),
         icon: isElements ? /* @__PURE__ */ React8.createElement(MapPinIcon, null) : null,
         provider: provider.getKey()
       };
     });
   });
 }
+function getTempStylesProviderColorName(color) {
+  if (color === "accent") {
+    return "primary";
+  }
+  return color;
+}
 function useCreateAction() {
   const [provider, createAction] = useCreateAndApplyClass();
   if (!provider || !createAction) {
@@ -1171,7 +1184,7 @@ import * as React86 from "react";
 import { ControlActionsProvider, ControlReplacementsProvider } from "@elementor/editor-controls";
 import { useSelectedElement } from "@elementor/editor-elements";
 import { Panel, PanelBody, PanelHeader, PanelHeaderTitle } from "@elementor/editor-panels";
-import { ThemeProvider as ThemeProvider2 } from "@elementor/editor-ui";
+import { ThemeProvider as ThemeProvider3 } from "@elementor/editor-ui";
 import { AtomIcon } from "@elementor/icons";
 import { SessionStorageProvider as SessionStorageProvider3 } from "@elementor/session";
 import { ErrorBoundary } from "@elementor/ui";
@@ -1249,7 +1262,7 @@ function EditorPanelErrorFallback() {
 
 // src/components/editing-panel-tabs.tsx
 import * as React85 from "react";
-import { Fragment as Fragment10 } from "react";
+import { Fragment as Fragment9 } from "react";
 import { isExperimentActive as isExperimentActive17 } from "@elementor/editor-v1-adapters";
 import { Divider as Divider6, Stack as Stack15, Tab, TabPanel, Tabs, useTabs } from "@elementor/ui";
 import { __ as __61 } from "@wordpress/i18n";
@@ -2408,7 +2421,7 @@ var StylesInheritanceInfotip = ({ inheritanceChain, propType, path, label, child
   const toggleInfotip = () => setShowInfotip((prev) => !prev);
   const closeInfotip = () => setShowInfotip(false);
   const key = path.join(".");
-  const sectionWidth = useSectionWidth() + SECTION_PADDING_INLINE;
+  const sectionWidth = useSectionWidth();
   const resolve = useMemo5(() => {
     return createPropsResolver({
       transformers: stylesInheritanceTransformersRegistry,
@@ -2827,10 +2840,10 @@ import { __ as __17 } from "@wordpress/i18n";
 
 // src/styles-inheritance/components/ui-providers.tsx
 import * as React38 from "react";
-import { DirectionProvider, ThemeProvider } from "@elementor/ui";
+import { DirectionProvider, ThemeProvider as ThemeProvider2 } from "@elementor/ui";
 var UiProviders = ({ children }) => {
   const { isSiteRtl } = useDirection();
-  return /* @__PURE__ */ React38.createElement(DirectionProvider, { rtl: isSiteRtl }, /* @__PURE__ */ React38.createElement(ThemeProvider, null, children));
+  return /* @__PURE__ */ React38.createElement(DirectionProvider, { rtl: isSiteRtl }, /* @__PURE__ */ React38.createElement(ThemeProvider2, null, children));
 };
 
 // src/components/style-sections/border-section/border-radius-field.tsx
@@ -2901,11 +2914,12 @@ var OpacityControlField = () => {
 
 // src/components/style-sections/effects-section/effects-section.tsx
 var BOX_SHADOW_LABEL = __19("Box shadow", "elementor");
-var FILTER_LABEL = __19("Filter", "elementor");
+var FILTER_LABEL = __19("Filters", "elementor");
 var TRANSFORM_LABEL = __19("Transform", "elementor");
+var BACKDROP_FILTER_LABEL = __19("Backdrop filters", "elementor");
 var EffectsSection = () => {
   const isVersion331Active = isExperimentActive10(EXPERIMENTAL_FEATURES.V_3_31);
-  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(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(TransformRepeaterControl, null)), /* @__PURE__ */ React42.createElement(PanelDivider, null), /* @__PURE__ */ React42.createElement(StylesField, { bind: "filter", propDisplayName: FILTER_LABEL }, /* @__PURE__ */ React42.createElement(FilterRepeaterControl, null))));
+  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(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(TransformRepeaterControl, null)), /* @__PURE__ */ React42.createElement(PanelDivider, null), /* @__PURE__ */ React42.createElement(StylesField, { bind: "filter", propDisplayName: FILTER_LABEL }, /* @__PURE__ */ React42.createElement(FilterRepeaterControl, null)), /* @__PURE__ */ React42.createElement(PanelDivider, null), /* @__PURE__ */ React42.createElement(StylesField, { bind: "backdrop-filter", propDisplayName: BACKDROP_FILTER_LABEL }, /* @__PURE__ */ React42.createElement(FilterRepeaterControl, { filterPropName: "backdrop-filter" }))));
 };
 
 // src/components/style-sections/layout-section/layout-section.tsx
@@ -3273,7 +3287,7 @@ var FlexDirectionField = () => {
 
 // src/components/style-sections/layout-section/flex-order-field.tsx
 import * as React49 from "react";
-import { useState as useState10 } from "react";
+import { useEffect as useEffect4, useState as useState10 } from "react";
 import { ControlToggleButtonGroup, NumberControl } from "@elementor/editor-controls";
 import { ArrowDownSmallIcon as ArrowDownSmallIcon2, ArrowUpSmallIcon as ArrowUpSmallIcon2, PencilIcon } from "@elementor/icons";
 import { Grid as Grid2 } from "@elementor/ui";
@@ -3317,6 +3331,10 @@ var FlexOrderField = () => {
     history: { propDisplayName: ORDER_LABEL }
   });
   const [groupControlValue, setGroupControlValue] = useState10(getGroupControlValue(order?.value || null));
+  useEffect4(() => {
+    const newGroupControlValue = getGroupControlValue(order?.value || null);
+    setGroupControlValue(newGroupControlValue);
+  }, [order?.value]);
   const handleToggleButtonChange = (group) => {
     setGroupControlValue(group);
     if (!group || group === CUSTOM) {
@@ -4474,7 +4492,7 @@ var EditingPanelTabs = () => {
   return (
     // When switching between elements, the local states should be reset. We are using key to rerender the tabs.
     // Reference: https://react.dev/learn/preserving-and-resetting-state#resetting-a-form-with-a-key
-    /* @__PURE__ */ React85.createElement(Fragment10, { key: element.id }, /* @__PURE__ */ React85.createElement(PanelTabContent, null))
+    /* @__PURE__ */ React85.createElement(Fragment9, { key: element.id }, /* @__PURE__ */ React85.createElement(PanelTabContent, null))
   );
 };
 var PanelTabContent = () => {
@@ -4509,7 +4527,7 @@ var EditingPanel = () => {
     return null;
   }
   const panelTitle = __62("Edit %s", "elementor").replace("%s", elementType.title);
-  return /* @__PURE__ */ React86.createElement(ErrorBoundary, { fallback: /* @__PURE__ */ React86.createElement(EditorPanelErrorFallback, null) }, /* @__PURE__ */ React86.createElement(SessionStorageProvider3, { prefix: "elementor" }, /* @__PURE__ */ React86.createElement(ThemeProvider2, null, /* @__PURE__ */ React86.createElement(Panel, null, /* @__PURE__ */ React86.createElement(PanelHeader, null, /* @__PURE__ */ React86.createElement(PanelHeaderTitle, null, panelTitle), /* @__PURE__ */ React86.createElement(AtomIcon, { fontSize: "small", sx: { color: "text.tertiary" } })), /* @__PURE__ */ React86.createElement(PanelBody, null, /* @__PURE__ */ React86.createElement(ControlActionsProvider, { items: menuItems }, /* @__PURE__ */ React86.createElement(ControlReplacementsProvider, { replacements: controlReplacements }, /* @__PURE__ */ React86.createElement(ElementProvider, { element, elementType }, /* @__PURE__ */ React86.createElement(EditingPanelTabs, null)))))))));
+  return /* @__PURE__ */ React86.createElement(ErrorBoundary, { fallback: /* @__PURE__ */ React86.createElement(EditorPanelErrorFallback, null) }, /* @__PURE__ */ React86.createElement(SessionStorageProvider3, { prefix: "elementor" }, /* @__PURE__ */ React86.createElement(ThemeProvider3, null, /* @__PURE__ */ React86.createElement(Panel, null, /* @__PURE__ */ React86.createElement(PanelHeader, null, /* @__PURE__ */ React86.createElement(PanelHeaderTitle, null, panelTitle), /* @__PURE__ */ React86.createElement(AtomIcon, { fontSize: "small", sx: { color: "text.tertiary" } })), /* @__PURE__ */ React86.createElement(PanelBody, null, /* @__PURE__ */ React86.createElement(ControlActionsProvider, { items: menuItems }, /* @__PURE__ */ React86.createElement(ControlReplacementsProvider, { replacements: controlReplacements }, /* @__PURE__ */ React86.createElement(ElementProvider, { element, elementType }, /* @__PURE__ */ React86.createElement(EditingPanelTabs, null)))))))));
 };
 
 // src/panel.ts
@@ -4518,12 +4536,12 @@ var { panel, usePanelActions, usePanelStatus } = createPanel({
   component: EditingPanel
 });
 
-// src/components/popover-scrollable-content.tsx
+// src/components/popover-body.tsx
 import * as React87 from "react";
-import { PopoverScrollableContent as BasePopoverScrollableContent } from "@elementor/editor-ui";
-var PopoverScrollableContent = (props) => {
+import { PopoverBody as BasePopoverBody } from "@elementor/editor-ui";
+var PopoverBody = (props) => {
   const sectionWidth = useSectionWidth();
-  return /* @__PURE__ */ React87.createElement(BasePopoverScrollableContent, { ...props, width: sectionWidth });
+  return /* @__PURE__ */ React87.createElement(BasePopoverBody, { ...props, width: sectionWidth });
 };
 
 // src/init.ts
@@ -4532,7 +4550,7 @@ import { __registerPanel as registerPanel } from "@elementor/editor-panels";
 import { blockCommand, isExperimentActive as isExperimentActive18 } from "@elementor/editor-v1-adapters";
 
 // src/hooks/use-open-editor-panel.ts
-import { useEffect as useEffect4 } from "react";
+import { useEffect as useEffect5 } from "react";
 import { __privateListenTo as listenTo, commandStartEvent } from "@elementor/editor-v1-adapters";
 
 // src/sync/is-atomic-widget-selected.ts
@@ -4549,7 +4567,7 @@ var isAtomicWidgetSelected = () => {
 // src/hooks/use-open-editor-panel.ts
 var useOpenEditorPanel = () => {
   const { open } = usePanelActions();
-  useEffect4(() => {
+  useEffect5(() => {
     return listenTo(commandStartEvent("panel/editor/open"), () => {
       if (isAtomicWidgetSelected()) {
         open();
@@ -4674,12 +4692,12 @@ var Content = ({ rawValue }) => {
 // src/dynamics/components/dynamic-selection-control.tsx
 import * as React91 from "react";
 import { ControlFormLabel as ControlFormLabel5, useBoundProp as useBoundProp6 } from "@elementor/editor-controls";
-import { PopoverHeader as PopoverHeader3, PopoverScrollableContent as PopoverScrollableContent2 } from "@elementor/editor-ui";
+import { PopoverHeader as PopoverHeader3 } from "@elementor/editor-ui";
 import { DatabaseIcon as DatabaseIcon3, SettingsIcon, XIcon } from "@elementor/icons";
 import {
   bindPopover as bindPopover2,
   bindTrigger as bindTrigger2,
-  Box as Box8,
+  Box as Box7,
   Divider as Divider8,
   Grid as Grid5,
   IconButton as IconButton5,
@@ -4729,12 +4747,12 @@ var DynamicControl = ({ bind, children }) => {
 };
 
 // src/dynamics/components/dynamic-selection.tsx
-import { Fragment as Fragment12, useState as useState13 } from "react";
+import { Fragment as Fragment11, useState as useState13 } from "react";
 import * as React90 from "react";
 import { useBoundProp as useBoundProp5 } from "@elementor/editor-controls";
 import { PopoverHeader as PopoverHeader2, PopoverMenuList, PopoverSearch } from "@elementor/editor-ui";
 import { DatabaseIcon as DatabaseIcon2 } from "@elementor/icons";
-import { Box as Box7, Divider as Divider7, Link as Link2, Stack as Stack16, Typography as Typography5, useTheme as useTheme3 } from "@elementor/ui";
+import { Divider as Divider7, Link as Link2, Stack as Stack16, Typography as Typography5, useTheme as useTheme3 } from "@elementor/ui";
 import { __ as __63 } from "@wordpress/i18n";
 var SIZE6 = "tiny";
 var DynamicSelection = ({ close: closePopover }) => {
@@ -4770,21 +4788,21 @@ var DynamicSelection = ({ close: closePopover }) => {
       label: item.label
     }))
   ]);
-  return /* @__PURE__ */ React90.createElement(React90.Fragment, null, /* @__PURE__ */ React90.createElement(
+  return /* @__PURE__ */ React90.createElement(PopoverBody, null, /* @__PURE__ */ React90.createElement(
     PopoverHeader2,
     {
       title: __63("Dynamic tags", "elementor"),
       onClose: closePopover,
       icon: /* @__PURE__ */ React90.createElement(DatabaseIcon2, { fontSize: SIZE6 })
     }
-  ), /* @__PURE__ */ React90.createElement(Stack16, null, hasNoDynamicTags ? /* @__PURE__ */ React90.createElement(NoDynamicTags, null) : /* @__PURE__ */ React90.createElement(Fragment12, null, /* @__PURE__ */ React90.createElement(
+  ), hasNoDynamicTags ? /* @__PURE__ */ React90.createElement(NoDynamicTags, null) : /* @__PURE__ */ React90.createElement(Fragment11, null, /* @__PURE__ */ React90.createElement(
     PopoverSearch,
     {
       value: searchValue,
       onSearch: handleSearch,
       placeholder: __63("Search dynamic tags\u2026", "elementor")
     }
-  ), /* @__PURE__ */ React90.createElement(Divider7, null), /* @__PURE__ */ React90.createElement(PopoverScrollableContent, null, /* @__PURE__ */ React90.createElement(
+  ), /* @__PURE__ */ React90.createElement(Divider7, null), /* @__PURE__ */ React90.createElement(
     PopoverMenuList,
     {
       items: virtualizedItems,
@@ -4794,7 +4812,7 @@ var DynamicSelection = ({ close: closePopover }) => {
       itemStyle: (item) => item.type === "item" ? { paddingInlineStart: theme.spacing(3.5) } : {},
       noResultsComponent: /* @__PURE__ */ React90.createElement(NoResults, { searchValue, onClear: () => setSearchValue("") })
     }
-  )))));
+  )));
 };
 var NoResults = ({ searchValue, onClear }) => /* @__PURE__ */ React90.createElement(
   Stack16,
@@ -4811,7 +4829,7 @@ var NoResults = ({ searchValue, onClear }) => /* @__PURE__ */ React90.createElem
   /* @__PURE__ */ React90.createElement(Typography5, { align: "center", variant: "subtitle2" }, __63("Sorry, nothing matched", "elementor"), /* @__PURE__ */ React90.createElement("br", null), "\u201C", searchValue, "\u201D."),
   /* @__PURE__ */ React90.createElement(Typography5, { align: "center", variant: "caption", sx: { display: "flex", flexDirection: "column" } }, __63("Try something else.", "elementor"), /* @__PURE__ */ React90.createElement(Link2, { color: "text.secondary", variant: "caption", component: "button", onClick: onClear }, __63("Clear & try again", "elementor")))
 );
-var NoDynamicTags = () => /* @__PURE__ */ React90.createElement(Box7, { sx: { overflowY: "hidden", height: 297, width: 220 } }, /* @__PURE__ */ React90.createElement(Divider7, null), /* @__PURE__ */ React90.createElement(
+var NoDynamicTags = () => /* @__PURE__ */ React90.createElement(React90.Fragment, null, /* @__PURE__ */ React90.createElement(Divider7, null), /* @__PURE__ */ React90.createElement(
   Stack16,
   {
     gap: 1,
@@ -4857,7 +4875,7 @@ var DynamicSelectionControl = () => {
   if (!dynamicTag) {
     throw new Error(`Dynamic tag ${tagName} not found`);
   }
-  return /* @__PURE__ */ React91.createElement(Box8, null, /* @__PURE__ */ React91.createElement(
+  return /* @__PURE__ */ React91.createElement(Box7, null, /* @__PURE__ */ React91.createElement(
     Tag,
     {
       fullWidth: true,
@@ -4887,7 +4905,7 @@ var DynamicSelectionControl = () => {
       },
       ...bindPopover2(selectionPopoverState)
     },
-    /* @__PURE__ */ React91.createElement(Stack17, null, /* @__PURE__ */ React91.createElement(DynamicSelection, { close: selectionPopoverState.close }))
+    /* @__PURE__ */ React91.createElement(PopoverBody, null, /* @__PURE__ */ React91.createElement(DynamicSelection, { close: selectionPopoverState.close }))
   ));
 };
 var DynamicSettingsPopover = ({ dynamicTag }) => {
@@ -4901,21 +4919,21 @@ var DynamicSettingsPopover = ({ dynamicTag }) => {
     {
       disablePortal: true,
       disableScrollLock: true,
-      anchorOrigin: { vertical: "bottom", horizontal: "center" },
+      anchorOrigin: { vertical: "bottom", horizontal: "right" },
+      transformOrigin: { vertical: "top", horizontal: "right" },
       PaperProps: {
-        sx: { my: 0.5 }
+        sx: { my: 1 }
       },
       ...bindPopover2(popupState)
     },
-    /* @__PURE__ */ React91.createElement(
+    /* @__PURE__ */ React91.createElement(PopoverBody, null, /* @__PURE__ */ React91.createElement(
       PopoverHeader3,
       {
         title: dynamicTag.label,
         onClose: popupState.close,
         icon: /* @__PURE__ */ React91.createElement(DatabaseIcon3, { fontSize: SIZE7 })
       }
-    ),
-    /* @__PURE__ */ React91.createElement(DynamicSettings, { controls: dynamicTag.atomic_controls })
+    ), /* @__PURE__ */ React91.createElement(DynamicSettings, { controls: dynamicTag.atomic_controls }))
   ));
 };
 var DynamicSettings = ({ controls }) => {
@@ -4924,13 +4942,21 @@ var DynamicSettings = ({ controls }) => {
   if (!tabs.length) {
     return null;
   }
-  return /* @__PURE__ */ React91.createElement(PopoverScrollableContent2, null, /* @__PURE__ */ React91.createElement(Tabs2, { size: "small", variant: "fullWidth", ...getTabsProps() }, tabs.map(({ value }, index) => /* @__PURE__ */ React91.createElement(Tab2, { key: index, label: value.label, sx: { px: 1, py: 0.5 }, ...getTabProps(index) }))), /* @__PURE__ */ React91.createElement(Divider8, null), tabs.map(({ value }, index) => {
-    return /* @__PURE__ */ React91.createElement(TabPanel2, { key: index, sx: { flexGrow: 1, py: 0 }, ...getTabPanelProps(index) }, /* @__PURE__ */ React91.createElement(Stack17, { p: 2, gap: 2 }, value.items.map((item) => {
-      if (item.type === "control") {
-        return /* @__PURE__ */ React91.createElement(Control3, { key: item.value.bind, control: item.value });
-      }
-      return null;
-    })));
+  return /* @__PURE__ */ React91.createElement(React91.Fragment, null, /* @__PURE__ */ React91.createElement(Tabs2, { size: "small", variant: "fullWidth", ...getTabsProps() }, tabs.map(({ value }, index) => /* @__PURE__ */ React91.createElement(Tab2, { key: index, label: value.label, sx: { px: 1, py: 0.5 }, ...getTabProps(index) }))), /* @__PURE__ */ React91.createElement(Divider8, null), tabs.map(({ value }, index) => {
+    return /* @__PURE__ */ React91.createElement(
+      TabPanel2,
+      {
+        key: index,
+        sx: { flexGrow: 1, py: 0, overflowY: "auto" },
+        ...getTabPanelProps(index)
+      },
+      /* @__PURE__ */ React91.createElement(Stack17, { p: 2, gap: 2 }, value.items.map((item) => {
+        if (item.type === "control") {
+          return /* @__PURE__ */ React91.createElement(Control3, { key: item.value.bind, control: item.value });
+        }
+        return null;
+      }))
+    );
   }));
 };
 var Control3 = ({ control }) => {
@@ -5041,7 +5067,7 @@ function initResetStyleProps() {
     useProps: useResetStyleValueProps
   });
 }
-var EXCLUDED_BINDS = ["order", "flex-grow", "flex-shrink", "flex-basis"];
+var EXCLUDED_BINDS = ["flex-grow", "flex-shrink", "flex-basis"];
 function useResetStyleValueProps() {
   const isStyle = useIsStyle();
   const { value, setValue, path, bind } = useBoundProp8();
@@ -5210,7 +5236,7 @@ var blockV1Panel = () => {
 };
 export {
   EXPERIMENTAL_FEATURES,
-  PopoverScrollableContent,
+  PopoverBody,
   controlActionsMenu,
   init3 as init,
   injectIntoClassSelectorActions,