1  <script lang="ts">
 2    interface Props {
 3      type: 'parent' | 'child' | 'standalone';
 4      isTranscendent?: boolean;
 5      expanded?: boolean;
 6      size?: 'sm' | 'md' | 'lg';
 7    }
 8  
 9    let { type, isTranscendent = false, expanded = false, size = 'md' }: Props = $props();
10  
11    const sizeClasses = {
12      sm: 'w-4 h-4',
13      md: 'w-5 h-5',
14      lg: 'w-6 h-6',
15    };
16  
17    // Icon paths
18    const folderClosed = 'M2 6a2 2 0 012-2h5l2 2h5a2 2 0 012 2v6a2 2 0 01-2 2H4a2 2 0 01-2-2V6z';
19    const folderOpen = 'M2 6a2 2 0 012-2h4l2 2h4a2 2 0 012 2v1H8a3 3 0 00-3 3v1.5a1.5 1.5 0 01-3 0V6z M6 12a2 2 0 012-2h8a2 2 0 012 2v2a2 2 0 01-2 2H8a2 2 0 01-2-2v-2z';
20    const globe = 'M10 18a8 8 0 100-16 8 8 0 000 16zM4.332 8.027a6.012 6.012 0 011.912-2.706C6.512 5.73 6.974 6 7.5 6A1.5 1.5 0 019 7.5V8a2 2 0 004 0 2 2 0 011.523-1.943A5.977 5.977 0 0116 10c0 .34-.028.675-.083 1H15a2 2 0 00-2 2v2.197A5.973 5.973 0 0110 16v-2a2 2 0 00-2-2 2 2 0 01-2-2 2 2 0 00-1.668-1.973z';
21    const lockClosed = 'M5 9V7a5 5 0 0110 0v2a2 2 0 012 2v5a2 2 0 01-2 2H5a2 2 0 01-2-2v-5a2 2 0 012-2zm8-2v2H7V7a3 3 0 016 0z';
22  </script>
23  
24  <svg
25    class="{sizeClasses[size]} flex-shrink-0 {isTranscendent ? 'text-phosphor' : type === 'parent' ? 'text-phosphor-light' : 'text-text-muted'}"
26    fill="currentColor"
27    viewBox="0 0 20 20"
28  >
29    {#if isTranscendent}
30      <path fill-rule="evenodd" d={lockClosed} clip-rule="evenodd" />
31    {:else if type === 'parent'}
32      {#if expanded}
33        <path d={folderOpen} />
34      {:else}
35        <path d={folderClosed} />
36      {/if}
37    {:else}
38      <path fill-rule="evenodd" d={globe} clip-rule="evenodd" />
39    {/if}
40  </svg>