feat: command template csv

src/components/md-commander/index.tsx

@@ -1,19 +1,25 @@
 import { customElement, noShadowDOM } from "solid-element";
-import { onMount, onCleanup, Show } from "solid-js";
+import { onMount, onCleanup, Show, createEffect } from "solid-js";
 import { useCommander } from "./hooks";
 import { CommanderInput } from "./CommanderInput";
 import { CommanderEntries } from "./CommanderEntries";
 import { TrackerView } from "./TrackerView";
 import { TabBar } from "./TabBar";
-import type { MdCommanderProps, TrackerAttribute } from "./types";
+import type { MdCommanderProps } from "./types";
+import {loadElementSrc, resolvePath} from "../utils/path";
+import {loadCommandTemplates} from "./utils/commandTemplates";
 
 customElement<MdCommanderProps>(
   "md-commander",
-  { placeholder: "", class: "", height: "" },
+  { placeholder: "", class: "", height: "", commandTemplates: "" },
   (props, { element }) => {
     noShadowDOM();
-
+    const {articlePath, rawSrc} = loadElementSrc(element as any);
     const commander = useCommander(props.commands);
+    createEffect(async () => {
+      if(!rawSrc) return;
+      await loadCommandTemplates(commander.commands, resolvePath(articlePath, rawSrc));
+    });
 
     const handleKeyDown = (e: KeyboardEvent) => {
       if (commander.showCompletions() && commander.completions().length > 0) {

src/components/utils/path.ts

@@ -37,3 +37,14 @@ export function resolvePath(base: string, relative: string): string {
 
   return '/' + baseParts.join('/');
 }
+
+
+export function loadElementSrc(element?: { textContent: string, closest: (arg0: string) => HTMLElement }){
+  const rawSrc = element?.textContent;
+  if(element) element.textContent = "";
+
+  const articleEl = element?.closest('article[data-src]');
+  const articlePath = articleEl?.getAttribute('data-src') || '';
+
+  return { articlePath, rawSrc };
+}