svelte-multiselect 11.4.0 → 11.5.1

package/dist/CmdPalette.svelte

@@ -1,6 +1,6 @@
 <script
   lang="ts"
-  generics="Action extends { label: string; action: (label: string) => void } & Record<string, unknown> = { label: string; action: (label: string) => void }"
+  generics="Action extends { label: string; action: (label: string) => void; group?: string } & Record<string, unknown> = { label: string; action: (label: string) => void; group?: string }"
 >import { fade } from 'svelte/transition';
 import MultiSelect from './MultiSelect.svelte';
 let { actions, triggers = [`k`], close_keys = [`Escape`], fade_duration = 200, dialog_style = ``, open = $bindable(false), dialog = $bindable(null), input = $bindable(null), placeholder = `Filter actions...`, dialog_props, ...rest } = $props();
@@ -67,7 +67,7 @@ function trigger_action_and_close({ option }) {
     padding: 0;
     background-color: transparent;
     display: flex;
-    color: white;
+    color: light-dark(#222, #eee);
     z-index: 10;
     font-size: 2.4ex;
   }

package/dist/CmdPalette.svelte.d.ts

@@ -2,9 +2,11 @@ import type { HTMLAttributes } from 'svelte/elements';
 declare function $$render<Action extends {
     label: string;
     action: (label: string) => void;
+    group?: string;
 } & Record<string, unknown> = {
     label: string;
     action: (label: string) => void;
+    group?: string;
 }>(): {
     props: Omit<import("./types").MultiSelectProps<Action>, "options"> & {
         actions: Action[];
@@ -26,9 +28,11 @@ declare function $$render<Action extends {
 declare class __sveltets_Render<Action extends {
     label: string;
     action: (label: string) => void;
+    group?: string;
 } & Record<string, unknown> = {
     label: string;
     action: (label: string) => void;
+    group?: string;
 }> {
     props(): ReturnType<typeof $$render<Action>>['props'];
     events(): ReturnType<typeof $$render<Action>>['events'];
@@ -40,18 +44,22 @@ interface $$IsomorphicComponent {
     new <Action extends {
         label: string;
         action: (label: string) => void;
+        group?: string;
     } & Record<string, unknown> = {
         label: string;
         action: (label: string) => void;
+        group?: string;
     }>(options: import('svelte').ComponentConstructorOptions<ReturnType<__sveltets_Render<Action>['props']>>): import('svelte').SvelteComponent<ReturnType<__sveltets_Render<Action>['props']>, ReturnType<__sveltets_Render<Action>['events']>, ReturnType<__sveltets_Render<Action>['slots']>> & {
         $$bindings?: ReturnType<__sveltets_Render<Action>['bindings']>;
     } & ReturnType<__sveltets_Render<Action>['exports']>;
     <Action extends {
         label: string;
         action: (label: string) => void;
+        group?: string;
     } & Record<string, unknown> = {
         label: string;
         action: (label: string) => void;
+        group?: string;
     }>(internal: unknown, props: ReturnType<__sveltets_Render<Action>['props']> & {}): ReturnType<__sveltets_Render<Action>['exports']>;
     z_$$bindings?: ReturnType<__sveltets_Render<any>['bindings']>;
 }
@@ -59,8 +67,10 @@ declare const CmdPalette: $$IsomorphicComponent;
 type CmdPalette<Action extends {
     label: string;
     action: (label: string) => void;
+    group?: string;
 } & Record<string, unknown> = {
     label: string;
     action: (label: string) => void;
+    group?: string;
 }> = InstanceType<typeof CmdPalette<Action>>;
 export default CmdPalette;

package/dist/CopyButton.svelte

@@ -10,7 +10,7 @@ $effect(() => {
     if (!global && !global_selector)
         return;
     const apply_copy_buttons = () => {
-        const btn_style = `position: absolute; top: 6pt; right: 6pt; ${rest.style ?? ``}`;
+        const style = `position: absolute; top: 6pt; right: 6pt; ${rest.style ?? ``}`;
         const skip_sel = skip_selector ?? as;
         for (const code of document.querySelectorAll(global_selector ?? `pre > code`)) {
             const pre = code.parentElement;
@@ -19,14 +19,7 @@ $effect(() => {
                 !(skip_sel && pre.querySelector(skip_sel))) {
                 mount(CopyButton, {
                     target: pre,
-                    props: {
-                        content,
-                        as,
-                        labels,
-                        ...rest,
-                        style: btn_style,
-                        'data-sms-copy': ``,
-                    },
+                    props: { content, as, labels, ...rest, style, 'data-sms-copy': `` },
                 });
             }
         }

package/dist/FileDetails.svelte

@@ -1,10 +1,25 @@
-<script lang="ts">let { files = $bindable([]), toggle_all_btn_title = `Toggle all`, default_lang = `typescript`, as = `ol`, style = null, title_snippet, button_props, details_props, } = $props();
+<script lang="ts">let { files = $bindable([]), toggle_all_btn_title = `Toggle all`, default_lang = `typescript`, as = `ol`, title_snippet, button_props, details_props, ...rest } = $props();
+// Use reactive state for node refs to avoid binding_property_non_reactive warning
+let node_refs = $state([]);
+// Trim stale refs when files shrink and sync node_refs back to files.node for external access
+$effect(() => {
+    // Trim stale references when files array shrinks to prevent memory leaks
+    if (node_refs.length > files.length) {
+        node_refs.splice(files.length);
+    }
+    for (const [idx, node] of node_refs.entries()) {
+        if (files[idx])
+            files[idx].node = node;
+    }
+});
+// Check if any nodes are open (for button text)
+const any_open = $derived(node_refs.some((node) => node?.open));
 function toggle_all() {
-    const any_open = files.some((file) => file.node?.open);
-    for (const file of files) {
-        if (!file.node)
+    const should_close = node_refs.some((node) => node?.open);
+    for (const node of node_refs) {
+        if (!node)
             continue;
-        file.node.open = !any_open;
+        node.open = !should_close;
     }
 }
 export {};
@@ -12,16 +27,15 @@ export {};
 
 {#if files?.length > 1}
   <button onclick={toggle_all} title={toggle_all_btn_title} {...button_props}>
-    {files.some((file) => file.node?.open) ? `Close` : `Open`} all
+    {any_open ? `Close` : `Open`} all
   </button>
 {/if}
 
-<svelte:element this={as} {style}>
+<svelte:element this={as} {...rest}>
   {#each files as file, idx (file.title)}
     {@const { title, content, language = default_lang } = file ?? {}}
     <li>
-      <!-- https://github.com/sveltejs/svelte/issues/12721#issuecomment-2269544690 -->
-      <details bind:this={file.node} {...details_props}>
+      <details bind:this={node_refs[idx]} {...details_props}>
         {#if title || title_snippet}
           <summary>
             {#if title_snippet}
@@ -33,7 +47,6 @@ export {};
         {/if}
 
         <pre class="language-{language}"><code>{content}</code></pre>
-        <!-- <pre><code>{@html hljs.highlight(content, { language }).value}</code></pre> -->
       </details>
     </li>
   {/each}

package/dist/FileDetails.svelte.d.ts

@@ -11,13 +11,12 @@ type $$ComponentProps = {
     toggle_all_btn_title?: string;
     default_lang?: string;
     as?: string;
-    style?: string | null;
     title_snippet?: Snippet<[{
         idx: number;
     } & File]>;
     button_props?: HTMLAttributes<HTMLButtonElement>;
     details_props?: HTMLDetailsAttributes;
-};
+} & HTMLAttributes<HTMLOListElement>;
 declare const FileDetails: import("svelte").Component<$$ComponentProps, {}, "files">;
 type FileDetails = ReturnType<typeof FileDetails>;
 export default FileDetails;

package/dist/GitHubCorner.svelte

@@ -33,8 +33,8 @@ let { href, title = `View code on GitHub`, aria_label, target = `_self`, color =
   a {
     position: fixed;
     z-index: 1;
-    fill: var(--github-corner-bg, black);
-    color: var(--github-corner-color, white);
+    fill: var(--github-corner-bg, light-dark(#222, #eee));
+    color: var(--github-corner-color, light-dark(#fafafa, #1a1a1a));
     width: var(--github-corner-size, 70px);
   }
   a.top-right {