obsidian-book-tracker/src/ui/components/suggesters/PropertySuggest.svelte

63 lines
1.2 KiB
Svelte

<script module lang="ts">
export type Property = {
name: string;
type: string;
};
</script>
<script lang="ts">
import type { App } from "obsidian";
import TextInputSuggest, { type Item } from "./TextInputSuggest.svelte";
type Props = {
app: App;
id: string;
asString?: boolean;
value?: Property | string;
accepts?: string[];
disabled?: boolean;
onSelected?: (propertyOrName: Property | string) => void;
};
let {
app,
id,
asString,
value = $bindable(),
accepts,
disabled,
onSelected,
}: Props = $props();
let items: Item<Property | string>[] = $state([]);
async function handleChange(query: string) {
const typesContent = await app.vault.adapter.read(
app.vault.configDir + "/types.json",
);
const types = JSON.parse(typesContent).types as Record<string, string>;
items = Object.entries(types)
.filter(([name, type]) => {
if (accepts && !accepts.includes(type as string)) {
return false;
}
return name.toLowerCase().includes(query.toLowerCase());
})
.map(([name, type]) => ({
text: name,
value: asString ? name : { name, type },
}));
}
</script>
<TextInputSuggest
{id}
{items}
bind:value
{disabled}
onChange={handleChange}
{onSelected}
/>