refactor: attribute editing

src/components/md-commander/index.tsx

@@ -1,11 +1,10 @@
 import { customElement, noShadowDOM } from "solid-element";
-import { onMount, onCleanup, createSignal, Show } from "solid-js";
+import { onMount, onCleanup, Show } from "solid-js";
 import { useCommander } from "./hooks";
 import { CommanderInput } from "./CommanderInput";
 import { CommanderEntries } from "./CommanderEntries";
 import { TrackerView } from "./TrackerView";
 import { TabBar } from "./TabBar";
-import { AttributeEditor } from "./AttributeEditor";
 import type { MdCommanderProps, TrackerAttribute } from "./types";
 
 customElement<MdCommanderProps>(
@@ -15,11 +14,6 @@ customElement<MdCommanderProps>(
     noShadowDOM();
 
     const commander = useCommander(props.commands);
-    const [editingAttr, setEditingAttr] = createSignal<{
-      index: number;
-      attrName: string;
-      attr: TrackerAttribute;
-    } | null>(null);
 
     const handleKeyDown = (e: KeyboardEvent) => {
       if (commander.showCompletions() && commander.completions().length > 0) {
@@ -43,11 +37,7 @@ customElement<MdCommanderProps>(
           return;
         }
         if (e.key === "Escape") {
-          if (editingAttr()) {
-            setEditingAttr(null);
-          } else {
-            commander.setShowCompletions(false);
-          }
+          commander.setShowCompletions(false);
           return;
         }
       }
@@ -100,7 +90,7 @@ customElement<MdCommanderProps>(
             <TrackerView
               items={commander.trackerItems}
               onEditAttribute={(index, attrName, attr) =>
-                setEditingAttr({ index, attrName, attr })
+                  commander.updateTrackerAttributeByIndex(index, attrName, attr)
               }
               onRemoveClass={commander.removeTrackerItemClassByIndex}
               onMoveUp={(index) => commander.moveTrackerItemByIndex(index, "up")}
@@ -138,20 +128,6 @@ customElement<MdCommanderProps>(
             onAcceptCompletion={commander.acceptCompletion}
           />
         </div>
-
-        {/* 属性编辑器弹窗 */}
-        <Show when={editingAttr()}>
-          <AttributeEditor
-            attribute={() => editingAttr()!.attr}
-            onUpdate={(attr) => {
-              const data = editingAttr();
-              if (data) {
-                commander.updateTrackerAttributeByIndex(data.index, data.attrName, attr);
-              }
-            }}
-            onClose={() => setEditingAttr(null)}
-          />
-        </Show>
       </div>
     );
   },