rgossiaux / svelte-headlessui

Unofficial Svelte port of the Headless UI component library
https://svelte-headlessui.goss.io
MIT License
1.78k stars 96 forks source link

Prefetch erroring on MenuItem with Href #95

Closed vhscom closed 2 years ago

vhscom commented 2 years ago

Describe the bug Just started seeing this with kit version 440 and above. When I create a MenuItem like:

<MenuItem
  href="/account/signin"
  sveltekit:prefetch
  class={({ active }) =>
    classes(
      active ? 'bg-gray-100 dark:bg-gray-800' : '',
      'block px-4 py-2 text-sm text-gray-700 dark:text-white'
    )}
>
  Sign in
</MenuItem>

I receive a type error on sveltekit:prefetch now whereas before sveltekit beta 440 I did not:

Error: Type '{ href: string; "sveltekit:prefetch": true; class: ({ active }: { active: boolean; disabled: boolean; }) => string; }' is not assignable to type 'IntrinsicAttributes & Omit<TRenderProps<{ active: boolean; disabled: boolean; }, SupportedAs, "a">, "as" | TInternalProps | "static" | "unmount"> & { ...; } & { ...; }'.
  Property 'sveltekit:prefetch' does not exist on type 'IntrinsicAttributes & Omit<TRenderProps<{ active: boolean; disabled: boolean; }, SupportedAs, "a">, "as" | TInternalProps | "static" | "unmount"> & { ...; } & { ...; }'. (ts)

To Reproduce Please share one of:

EDIT: Disclosure buttons also seem to be affected. I ended up dropping the prefetches so I could ship the latest SK at the expense of performance for now. Here's the specific commit showing the removal of the sveltekit:prefetch and could be used to reproduce the issue by restoring one of the dropped attributes for MenuItem or the DisclosureButton.

Library version Add the version of svelte-headlessui that you are using here.

@rgossiaux/svelte-headlessui@1.0.1
rgossiaux commented 2 years ago

Thanks for the report! This should be fixed in 1.0.2 now.

vhscom commented 2 years ago

Fix confirmed. Thanks!