@dosgato/dialog 1.2.6 → 1.2.7

package/dist/FieldDateTime.svelte

@@ -1,6 +1,7 @@
 <script>import { datetimeSerialize, datetimeDeserialize } from '@txstate-mws/svelte-forms';
 import FieldStandard from './FieldStandard.svelte';
 import Input from './Input.svelte';
+import { createEventDispatcher } from 'svelte';
 let className = '';
 export { className as class };
 export let id = undefined;
@@ -16,23 +17,26 @@ export let related = 0;
 export let extradescid = undefined;
 export let helptext = undefined;
 export let inputelement = undefined;
-let showBadInputMessage = false;
-function wrapOnBlur(onBlur) {
-    const date = new Date(inputelement.value);
-    showBadInputMessage = inputelement.validity.badInput || !(date instanceof Date && !isNaN(date.valueOf()));
-    onBlur();
+const dispatch = createEventDispatcher();
+function onChange(setVal) {
+    return () => {
+        if (inputelement) {
+            const date = new Date(inputelement.value);
+            const invalid = inputelement.validity.badInput || !(date instanceof Date && !isNaN(date.valueOf()));
+            if (invalid) {
+                setVal(undefined);
+                dispatch('change', undefined);
+            }
+            else {
+                setVal(datetimeDeserialize(inputelement.value));
+                dispatch('change', datetimeDeserialize(inputelement.value));
+            }
+        }
+    };
 }
 </script>
 
-<FieldStandard bind:id {label} {path} {required} {defaultValue} {conditional} {related} {helptext} serialize={datetimeSerialize} deserialize={datetimeDeserialize} let:value let:valid let:invalid let:id let:onBlur let:onChange let:helptextid let:messagesid>
-  {#if showBadInputMessage}<div class="bad-input-warning" aria-live='polite'>{`Field ${label}`} must include both a date and time</div>{/if}
-  <Input bind:inputelement={inputelement} type="datetime-local" name={path} {value} {id} class="dialog-input {className}" onBlur={() => { wrapOnBlur(onBlur) }} {onChange} {valid} {invalid} {min} {max} {step} {extradescid} {messagesid} {helptextid}/>
+<FieldStandard bind:id {label} {path} {required} {defaultValue} {conditional} {related} {helptext} serialize={datetimeSerialize} deserialize={datetimeDeserialize} let:value let:valid let:invalid let:id let:onBlur let:helptextid let:messagesid let:setVal>
+  <Input bind:inputelement={inputelement} type="datetime-local" name={path} {value} {id} class="dialog-input {className}" {onBlur} onChange={onChange(setVal)} {valid} {invalid} {min} {max} {step} {extradescid} {messagesid} {helptextid}/>
 </FieldStandard>
 
-<style>
-  .bad-input-warning {
-    margin-bottom: 0.3em;
-    color: var(--dg-danger-bg, #9a3332);
-  }
-
-</style>

package/dist/FieldDateTime.svelte.d.ts

@@ -21,6 +21,8 @@ declare const __propDef: {
         inputelement?: HTMLInputElement;
     };
     events: {
+        change: CustomEvent<any>;
+    } & {
         [evt: string]: CustomEvent<any>;
     };
     slots: {};

package/dist/chooser/Chooser.svelte

@@ -90,7 +90,7 @@ function iconForItem(item) {
       {#if $store.initialized}
         <Tree headers={[
           { label: 'Path', id: 'name', grow: 4, icon: item => iconForItem(item), get: 'name' }
-        ]} singleSelect store={treeStore} on:deselect={onDeselect} on:choose={onChoose} />
+        ]} singleSelect store={treeStore} on:deselect={onDeselect} on:choose={onChoose} searchable='name' />
       {/if}
     </section>
     <ChooserPreview {thumbnailExpanded} {previewId} {store} on:thumbnailsizechange={() => { thumbnailExpanded = !thumbnailExpanded }}/>

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@dosgato/dialog",
   "description": "A component library for building forms that edit a JSON document.",
-  "version": "1.2.6",
+  "version": "1.2.7",
   "scripts": {
     "prepublishOnly": "svelte-package",
     "dev": "vite dev --force",