@elementor/editor-controls 3.32.0-27 → 3.32.0-28

package/dist/index.mjs

@@ -4881,7 +4881,15 @@ var toTransitionSelectorValue = (label) => {
   }
   return null;
 };
-var TransitionSelector = () => {
+var findByValue = (value) => {
+  for (const category of transitionProperties) {
+    const property = category.properties.find((prop) => prop.value === value);
+    if (property) {
+      return property.label;
+    }
+  }
+};
+var TransitionSelector = ({ recentlyUsedList }) => {
   const { value, setValue } = useBoundProp(keyValuePropTypeUtil2);
   const {
     value: { value: transitionValue },
@@ -4889,6 +4897,25 @@ var TransitionSelector = () => {
   } = value;
   const defaultRef = useRef20(null);
   const popoverState = usePopupState7({ variant: "popover" });
+  const getItemList = () => {
+    const recentItems = recentlyUsedList.map((item) => findByValue(item)).filter((item) => !!item);
+    const filteredItems = transitionsItemsList.map((category) => {
+      return {
+        ...category,
+        items: category.items.filter((item) => !recentItems.includes(item))
+      };
+    });
+    if (recentItems.length === 0) {
+      return filteredItems;
+    }
+    return [
+      {
+        label: __39("Recent", "elementor"),
+        items: recentItems
+      },
+      ...filteredItems
+    ];
+  };
   const handleTransitionPropertyChange = (newLabel) => {
     const newValue = toTransitionSelectorValue(newLabel);
     if (!newValue) {
@@ -4930,7 +4957,7 @@ var TransitionSelector = () => {
     /* @__PURE__ */ React80.createElement(
       ItemSelector,
       {
-        itemsList: transitionsItemsList,
+        itemsList: getItemList(),
         selectedItem: transitionValue,
         onItemChange: handleTransitionPropertyChange,
         onClose: popoverState.close,
@@ -4948,13 +4975,15 @@ var DURATION_CONFIG = {
   units: ["s", "ms"],
   defaultUnit: "ms"
 };
-var getSelectionSizeProps = () => {
+var getSelectionSizeProps = (recentlyUsedList) => {
   return {
     selectionLabel: __40("Type", "elementor"),
     sizeLabel: __40("Duration", "elementor"),
     selectionConfig: {
       component: TransitionSelector,
-      props: {}
+      props: {
+        recentlyUsedList
+      }
     },
     sizeConfigMap: {
       ...transitionProperties.reduce(
@@ -4969,14 +4998,14 @@ var getSelectionSizeProps = () => {
     }
   };
 };
-function getChildControlConfig() {
+function getChildControlConfig(recentlyUsedList) {
   return {
     propTypeUtil: selectionSizePropTypeUtil2,
     component: SelectionSizeControl,
-    props: getSelectionSizeProps()
+    props: getSelectionSizeProps(recentlyUsedList)
   };
 }
-var TransitionRepeaterControl = createControl(() => {
+var TransitionRepeaterControl = createControl((props) => {
   return /* @__PURE__ */ React81.createElement(
     RepeatableControl,
     {
@@ -4987,7 +5016,7 @@ var TransitionRepeaterControl = createControl(() => {
       showDuplicate: false,
       showToggle: true,
       initialValues: initialTransitionValue,
-      childControlConfig: getChildControlConfig(),
+      childControlConfig: getChildControlConfig(props.recentlyUsedList),
       propKey: "transition"
     }
   );