svelte-toolkit/sui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

combobox: implement loading state w/ new listeners & lazy mode

Browse Source
This commit is contained in:
Elijah Duffy
2025-07-15 15:07:14 -07:00
parent e905eab6e7
commit bb44a946e1
2 changed files with 112 additions and 35 deletions
Download Patch File Download Diff File Expand all files Collapse all files

41
src/routes/+page.svelte
View File

@@ -120,18 +120,35 @@
<div class="component">
<p class="title">Combobox</p>
<Combobox
name="example-combobox"
label="Select an option"
placeholder="Choose..."
options={[
{ value: 'option1', label: 'Option 1' },
{ value: 'option2', label: 'Option 2' },
{ value: 'option3', label: 'Option 3' }
]}
onchange={(e) => console.log('Selected:', e.value)}
onvalidate={(e) => console.log('Validation:', e.detail)}
/>
<InputGroup>
<Combobox
name="example-combobox"
label="Select an option"
placeholder="Choose..."
options={[
{ value: 'option1', label: 'Option 1' },
{ value: 'option2', label: 'Option 2' },
{ value: 'option3', label: 'Option 3', disabled: true }
]}
onchange={(e) => console.log('Selected:', e.value)}
onvalidate={(e) => console.log('Validation:', e.detail)}
/>
<Combobox
loading
label="Loading state combobox"
placeholder="Choose..."
options={[
{ value: 'option1', label: 'Option 1' },
{ value: 'option2', label: 'Option 2' },
{ value: 'option3', label: 'Option 3' }
]}
onchange={(e) => console.log('Selected:', e.value)}
onvalidate={(e) => console.log('Validation:', e.detail)}
/>
<Combobox label="Lazy combobox" placeholder="Choose..." options={[]} lazy />
</InputGroup>
</div>
<div class="component">