refactor: consolidate CodeMirror editors into unified AE_Comp_Editor_CodeMirror component

2026-01-29 14:16:35 -05:00
parent 3d7b68e7ce
commit 363d94a36b
10 changed files with 323 additions and 92 deletions
--- a/src/lib/ae_elements/AE_Object_Flags.svelte
+++ b/src/lib/ae_elements/AE_Object_Flags.svelte
@@ -0,0 +1,131 @@
+<script lang="ts">
+    /**
+     * AE_ObjectFlags.svelte
+     * GENERIC Aether Object Flags & Visibility Toggles
+     * Manages: alert, private, public, personal, professional, template
+     */
+    import {
+        Siren, MessageSquareWarning, Fingerprint,
+        Globe, BookHeart, BriefcaseBusiness, NotepadTextDashed,
+        Settings
+    } from '@lucide/svelte';
+    import { ae_loc } from '$lib/stores/ae_stores';
+
+    interface Props {
+        // The object containing the flags (bindable)
+        obj: any;
+
+        // Visibility configuration (optional overrides)
+        show_labels?: boolean;
+        hide_alert?: boolean;
+        hide_private?: boolean;
+        hide_public?: boolean;
+        hide_personal?: boolean;
+        hide_professional?: boolean;
+        hide_template?: boolean;
+
+        // Callbacks
+        on_toggle?: (prop: string, newValue: boolean) => void;
+
+        // Styling
+        container_class?: string;
+    }
+
+    let {
+        obj = $bindable(),
+        show_labels = true,
+        hide_alert: hide_alert = false,
+        hide_private: hide_private = false,
+        hide_public: hide_public = false,
+        hide_personal: hide_personal = false,
+        hide_professional: hide_professional = false,
+        hide_template: hide_template = false,
+        on_toggle: onToggle,
+        container_class = "flex flex-row flex-wrap gap-1 items-center justify-evenly py-2 border-y border-surface-500/10"
+    }: Props = $props();
+
+    function handle_toggle(prop: string) {
+        obj[prop] = !obj[prop];
+        if (onToggle) onToggle(prop, obj[prop]);
+    }
+</script>
+
+<div class={container_class}>
+    {#if show_labels}
+        <span class="text-xs text-surface-500 flex items-center gap-1 uppercase font-bold tracking-wider mr-2">
+            <Settings size="1.1em" /> Flags:
+        </span>
+    {/if}
+
+    <!-- Alert Status -->
+    {#if !hide_alert}
+        <button
+            type="button"
+            onclick={() => handle_toggle('alert')}
+            class="btn-icon btn-icon-sm preset-tonal-secondary hover:preset-filled-secondary-500 transition"
+            title="Toggle Alert Status"
+        >
+            <Siren size="1.2em" class={obj?.alert ? 'text-error-500' : 'opacity-40'} />
+        </button>
+    {/if}
+
+    <!-- Private / E2EE -->
+    {#if !hide_private}
+        <button
+            type="button"
+            onclick={() => handle_toggle('private')}
+            class="btn-icon btn-icon-sm preset-tonal-secondary hover:preset-filled-secondary-500 transition"
+            title="Toggle Private/Encrypted"
+        >
+            <Fingerprint size="1.2em" class={obj?.private ? 'text-success-500' : 'opacity-40'} />
+        </button>
+    {/if}
+
+    <!-- Public Visibility -->
+    {#if !hide_public}
+        <button
+            type="button"
+            onclick={() => handle_toggle('public')}
+            class="btn-icon btn-icon-sm preset-tonal-secondary hover:preset-filled-secondary-500 transition"
+            title="Toggle Public Visibility"
+        >
+            <Globe size="1.2em" class={obj?.public ? 'text-success-500' : 'opacity-40'} />
+        </button>
+    {/if}
+
+    <!-- Personal Scope -->
+    {#if !hide_personal}
+        <button
+            type="button"
+            onclick={() => handle_toggle('personal')}
+            class="btn-icon btn-icon-sm preset-tonal-secondary hover:preset-filled-secondary-500 transition"
+            title="Toggle Personal Scope"
+        >
+            <BookHeart size="1.2em" class={obj?.personal ? 'text-success-500' : 'opacity-40'} />
+        </button>
+    {/if}
+
+    <!-- Professional Scope -->
+    {#if !hide_professional}
+        <button
+            type="button"
+            onclick={() => handle_toggle('professional')}
+            class="btn-icon btn-icon-sm preset-tonal-secondary hover:preset-filled-secondary-500 transition"
+            title="Toggle Professional Scope"
+        >
+            <BriefcaseBusiness size="1.2em" class={obj?.professional ? 'text-success-500' : 'opacity-40'} />
+        </button>
+    {/if}
+
+    <!-- Template Status -->
+    {#if !hide_template && $ae_loc.edit_mode}
+        <button
+            type="button"
+            onclick={() => handle_toggle('template')}
+            class="btn-icon btn-icon-sm preset-tonal-secondary hover:preset-filled-secondary-500 transition"
+            title="Toggle Template Mode"
+        >
+            <NotepadTextDashed size="1.2em" class={obj?.template ? 'text-success-500' : 'opacity-40'} />
+        </button>
+    {/if}
+</div>