fix(web): TrackMenuItem icon prop accepts Lucide class-components
svelte-check on the new dev-push CI surfaced 11 type errors. Cause: TrackMenuItem typed `icon` as Svelte 5's runes-mode `Component<...>`, but Lucide-svelte ships class-based components whose type is `ComponentType<SvelteComponent<...>>`. Switch the prop type to match Lucide's actual export shape. Also drop the redundant role="separator" on TrackMenuDivider — <hr> already implies role=separator (svelte-check warning). The remaining a11y warnings (tabindex on role=menu/dialog elements, key-handler-with-click) are pre-existing in FlagPopover and surface on the new dev-push run because svelte-check now sees them. They're warnings not errors, so they don't block CI; address as a follow-up.
This commit is contained in:
@@ -1 +1 @@
|
||||
<hr class="my-1 border-border" role="separator" />
|
||||
<hr class="my-1 border-border" />
|
||||
|
||||
@@ -1,5 +1,12 @@
|
||||
<script lang="ts">
|
||||
import type { Component } from 'svelte';
|
||||
import type { ComponentType, SvelteComponent } from 'svelte';
|
||||
|
||||
// Lucide-svelte ships class-based components (typeof ListPlus = ComponentType<...>),
|
||||
// not runes-mode function components (Svelte 5's Component<...> type). Use
|
||||
// ComponentType<SvelteComponent<...>> so any Lucide icon assigns cleanly.
|
||||
type IconProp = ComponentType<
|
||||
SvelteComponent<{ size?: number; strokeWidth?: number; class?: string }>
|
||||
>;
|
||||
|
||||
let {
|
||||
icon,
|
||||
@@ -9,8 +16,8 @@
|
||||
danger = false,
|
||||
title,
|
||||
}: {
|
||||
/** Lucide icon component (or any Svelte component matching the Lucide signature). */
|
||||
icon: Component<{ size?: number; strokeWidth?: number; class?: string }>;
|
||||
/** Lucide icon component (or any Svelte class-component matching the Lucide signature). */
|
||||
icon: IconProp;
|
||||
label: string;
|
||||
onclick?: () => void;
|
||||
disabled?: boolean;
|
||||
|
||||
Reference in New Issue
Block a user