fix: When deleting property during search in advanced panel - remove it from results (#4950)

## Description

1. What is this PR about (link the issue and add a short description)

## Steps for reproduction

1. click button
2. expect xyz

## Code Review

- [ ] hi @kof, I need you to do
  - conceptual review (architecture, feature-correctness)
  - detailed review (read every line)
  - test it on preview

## Before requesting a review

- [ ] made a self-review
- [ ] added inline comments where things may be not obvious (the "why",
not "what")

## Before merging

- [ ] tested locally and on preview environment (preview dev login:
0000)
- [ ] updated [test
cases](https://github.com/webstudio-is/webstudio/blob/main/apps/builder/docs/test-cases.md)
document
- [ ] added tests
- [ ] if any new env variables are added, added them to `.env` file

Author: kof

apps/builder/app/builder/shared/css-editor/css-editor.tsx

@@ -340,7 +340,7 @@ export const CssEditor = ({
     },
   }));
 
-  const advancedProperties = Array.from(styleMap.keys()) as Array<CssProperty>;
+  const advancedProperties = Array.from(styleMap.keys());
 
   const currentProperties =
     searchProperties ??
@@ -394,7 +394,7 @@ export const CssEditor = ({
       keys: ["property", "value"],
     }).map(({ property }) => property);
 
-    setSearchProperties(matched as CssProperty[]);
+    setSearchProperties(matched);
   };
 
   const afterChangingStyles = () => {
@@ -407,6 +407,25 @@ export const CssEditor = ({
     });
   };
 
+  const handleDeleteProperty: DeleteProperty = (property, options = {}) => {
+    onDeleteProperty(property, options);
+    if (options.isEphemeral === true) {
+      return;
+    }
+    setSearchProperties(
+      searchProperties?.filter((searchProperty) => searchProperty !== property)
+    );
+  };
+
+  const handleDeleteAllDeclarations = (styleMap: CssStyleMap) => {
+    setSearchProperties(
+      searchProperties?.filter(
+        (searchProperty) => styleMap.has(searchProperty) === false
+      )
+    );
+    onDeleteAllDeclarations(styleMap);
+  };
+
   return (
     <>
       {showSearch && (
@@ -420,8 +439,8 @@ export const CssEditor = ({
       )}
       <CssEditorContextMenu
         onPaste={handleInsertStyles}
-        onDeleteProperty={onDeleteProperty}
-        onDeleteAllDeclarations={onDeleteAllDeclarations}
+        onDeleteProperty={handleDeleteProperty}
+        onDeleteAllDeclarations={handleDeleteAllDeclarations}
         styleMap={styleMap}
         properties={
           searchProperties ?? [...recentProperties, ...currentProperties]
@@ -446,7 +465,7 @@ export const CssEditor = ({
                       }
                     }}
                     onReset={afterChangingStyles}
-                    onDeleteProperty={onDeleteProperty}
+                    onDeleteProperty={handleDeleteProperty}
                     onSetProperty={onSetProperty}
                   />
                 );
@@ -493,7 +512,7 @@ export const CssEditor = ({
                 <LazyRender key={property}>
                   <AdvancedDeclarationLonghand
                     property={property}
-                    onDeleteProperty={onDeleteProperty}
+                    onDeleteProperty={handleDeleteProperty}
                     onSetProperty={onSetProperty}
                   />
                 </LazyRender>