metonym / svelte-typeahead

Accessible, fuzzy search typeahead component
https://metonym.github.io/svelte-typeahead
MIT License
223 stars 17 forks source link

Svelte-check error when using placeholder #85

Open beholdr opened 1 month ago

beholdr commented 1 month ago

Hello, I've got an error when run svelte-check if I’m using placeholder attribute on a Typeahead component:

<Typeahead placeholder="Text" />

Error: Object literal may only specify known properties, and '"placeholder"' does not exist in type 'TypeaheadProps<string | number | Record<string, any>>'. (ts)

beholdr commented 1 month ago

svelte-typeahead depends on svelte-search 1.1 which cause this type error. When I update typings in node_modules/svelte-search/types/Search.d.ts to:

- export interface SearchProps
-   extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["input"]> {
+ import type { HTMLInputAttributes } from "svelte/elements";
+
+ export interface SearchProps extends HTMLInputAttributes {

Then error is gone.

Maybe you can update svelte-typeahead dependency to current svelte-search version?

beholdr commented 1 month ago

As a workaround I found a way to please svelte-check with such hack:

<script lang="ts">
  import type { ComponentProps, ComponentType, SvelteComponent } from 'svelte'
  import Typeahead from 'svelte-typeahead'

  interface PropsWithPlaceholder extends ComponentProps<Typeahead> {
    placeholder?: string
  }
  const input: ComponentType<SvelteComponent<PropsWithPlaceholder>> = Typeahead
</script>

<svelte:component this={input} hideLabel placeholder="XXX" />

But it's better to fix this in svelte-search code.

metonym commented 1 month ago

Thanks for reporting – agree that the svelte-search dependency upgrade is likely the culprit. Did you want to take a pass at this?

beholdr commented 1 month ago

I'm sorry, but I can't assist you with that at the moment. I have already selected another library because of issue #28.