@dosgato/dialog 0.0.11 → 0.0.12

package/ButtonGroup.svelte

@@ -47,7 +47,7 @@ function onKeyDown(choice, idx) {
 <ul class="dialog-btn-group" class:disabled class:valid class:invalid aria-disabled={disabled} role="radiogroup" aria-labelledby={groupid} on:blur>
   {#each choices as choice, i}
     {@const selected = choice.value === value}
-    <li bind:this={elements[i]} role="radio" class:selected tabindex={selected ? 0 : -1} aria-controls={ariaControls} on:click={onClick(choice, i)} on:keydown={onKeyDown(choice, i)} on:blur aria-describedby="{groupid} {messagesid}">{choice.label || choice.value}</li>
+    <li bind:this={elements[i]} role="radio" class:selected aria-checked={selected} tabindex={selected ? 0 : -1} aria-controls={ariaControls} on:click={onClick(choice, i)} on:keydown={onKeyDown(choice, i)} on:blur aria-describedby="{groupid} {messagesid}">{choice.label || choice.value}</li>
   {/each}
 </ul>
 

package/FieldAutocomplete.svelte

@@ -20,12 +20,12 @@ let inputvalue = '';
 let popupvalue = undefined;
 let savedLabel = '';
 let changed = false;
+let menuid;
 if (defaultValue) {
     const selected = choices.find(c => c.value === defaultValue);
     inputvalue = selected.label || selected.value;
     savedLabel = inputvalue;
 }
-const listId = randomid();
 const liveTextId = randomid();
 const helpTextId = randomid();
 $: filteredChoices = changed
@@ -51,8 +51,8 @@ async function checkifchanged(e) {
 </script>
 
 <FieldStandard bind:id {label} {path} {required} {defaultValue} {conditional} serialize={!notNull && nullableSerialize} deserialize={!notNull && nullableDeserialize} let:setVal let:valid let:invalid let:id let:onBlur let:onChange let:messagesid>
-  <input bind:this={inputelement} bind:value={inputvalue} {id} {placeholder} class="dialog-input {className}" class:valid class:invalid aria-invalid={invalid} {onBlur} {onChange} aria-owns={listId} autocapitalize="none" type="text" autocomplete="off"  aria-autocomplete="list" role="combobox" aria-expanded="false" {disabled} aria-describedby={`${messagesid ?? ''} ${helptext.length ? helpTextId : ''}`} on:keydown={checkifchanged}>
-  <PopupMenu align="bottomleft" items={filteredChoices} buttonelement={inputelement} bind:value={popupvalue} on:change={onchangepopup(setVal)} emptyText="No options available"/>
+  <input bind:this={inputelement} bind:value={inputvalue} {id} {placeholder} class="dialog-input {className}" class:valid class:invalid aria-invalid={invalid} aria-expanded={false} aria-controls={menuid} {onBlur} {onChange} autocapitalize="none" type="text" autocomplete="off" aria-autocomplete="list" role="combobox" {disabled} aria-describedby={`${messagesid ?? ''} ${helptext.length ? helpTextId : ''}`} on:keydown={checkifchanged}>
+  <PopupMenu bind:menuid align="bottomleft" items={filteredChoices} buttonelement={inputelement} bind:value={popupvalue} on:change={onchangepopup(setVal)} emptyText="No options available"/>
   {#if helptext.length}
     <span id={helpTextId} class="field-help-text">{helptext}</span>
   {/if}

package/FieldMultiselect.svelte

@@ -13,7 +13,12 @@ export let getOptions;
 // that it finds, so that we can display labels on pills
 let valueToLabel = {};
 async function wrapGetOptions(search) {
-    const opts = await getOptions(search);
+    let opts = await getOptions(search);
+    // if no options are returned with the search term, we can end up with an infinite loop
+    // the first time reactToValue calls wrapGetOptions
+    if (opts.length === 0) {
+        opts = await getOptions('');
+    }
     for (const opt of opts)
         valueToLabel[opt.value] = opt.label || opt.value;
     valueToLabel = valueToLabel;

package/package.json

@@ -1,9 +1,9 @@
 {
   "name": "@dosgato/dialog",
   "description": "A component library for building forms that edit a JSON document.",
-  "version": "0.0.11",
+  "version": "0.0.12",
   "dependencies": {
-    "@txstate-mws/svelte-components": "^1.2.9",
+    "@txstate-mws/svelte-components": "^1.2.11",
     "@txstate-mws/svelte-forms": "^0.0.18",
     "@iconify/svelte": "^2.2.1",
     "@iconify-icons/mdi": "^1.2.22",