@dosgato/dialog 0.0.12 → 0.0.13
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/FieldAutocomplete.svelte +13 -6
- package/FieldHidden.svelte +14 -0
- package/FieldHidden.svelte.d.ts +20 -0
- package/Form.svelte +3 -3
- package/chooser/Asset.svelte +1 -0
- package/chooser/AssetFolder.svelte +1 -0
- package/chooser/Page.svelte +1 -0
- package/index.d.ts +2 -0
- package/index.js +2 -0
- package/package.json +3 -2
package/FieldAutocomplete.svelte
CHANGED
|
@@ -21,11 +21,6 @@ let popupvalue = undefined;
|
|
|
21
21
|
let savedLabel = '';
|
|
22
22
|
let changed = false;
|
|
23
23
|
let menuid;
|
|
24
|
-
if (defaultValue) {
|
|
25
|
-
const selected = choices.find(c => c.value === defaultValue);
|
|
26
|
-
inputvalue = selected.label || selected.value;
|
|
27
|
-
savedLabel = inputvalue;
|
|
28
|
-
}
|
|
29
24
|
const liveTextId = randomid();
|
|
30
25
|
const helpTextId = randomid();
|
|
31
26
|
$: filteredChoices = changed
|
|
@@ -48,9 +43,21 @@ async function checkifchanged(e) {
|
|
|
48
43
|
changed = true;
|
|
49
44
|
}, 1);
|
|
50
45
|
}
|
|
46
|
+
const valueToLabel = {};
|
|
47
|
+
for (const choice of choices)
|
|
48
|
+
valueToLabel[choice.value] = choice.label || choice.value;
|
|
49
|
+
let set = false;
|
|
50
|
+
function reactToInitialValue(value) {
|
|
51
|
+
if (!value || set)
|
|
52
|
+
return;
|
|
53
|
+
inputvalue = valueToLabel[value];
|
|
54
|
+
savedLabel = inputvalue;
|
|
55
|
+
set = true;
|
|
56
|
+
}
|
|
51
57
|
</script>
|
|
52
58
|
|
|
53
|
-
<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>
|
|
59
|
+
<FieldStandard bind:id {label} {path} {required} {defaultValue} {conditional} serialize={!notNull && nullableSerialize} deserialize={!notNull && nullableDeserialize} let:value let:setVal let:valid let:invalid let:id let:onBlur let:onChange let:messagesid>
|
|
60
|
+
{@const _ = reactToInitialValue(value)}
|
|
54
61
|
<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}>
|
|
55
62
|
<PopupMenu bind:menuid align="bottomleft" items={filteredChoices} buttonelement={inputelement} bind:value={popupvalue} on:change={onchangepopup(setVal)} emptyText="No options available"/>
|
|
56
63
|
{#if helptext.length}
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
<script>import { Field, nullableSerialize, nullableDeserialize, FormStore, FORM_CONTEXT } from '@txstate-mws/svelte-forms';
|
|
2
|
+
import { getContext } from 'svelte';
|
|
3
|
+
export let id = undefined;
|
|
4
|
+
export let path;
|
|
5
|
+
export let value = '';
|
|
6
|
+
export let notNull = false;
|
|
7
|
+
export let conditional = undefined;
|
|
8
|
+
const store = getContext(FORM_CONTEXT);
|
|
9
|
+
$: store.setField(path, value);
|
|
10
|
+
</script>
|
|
11
|
+
|
|
12
|
+
<Field {path} {conditional} serialize={!notNull && nullableSerialize} deserialize={!notNull && nullableDeserialize} let:value>
|
|
13
|
+
<input type="hidden" name={path} {value} {id}>
|
|
14
|
+
</Field>
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import { SvelteComponentTyped } from "svelte";
|
|
2
|
+
declare const __propDef: {
|
|
3
|
+
props: {
|
|
4
|
+
id?: string | undefined;
|
|
5
|
+
path: string;
|
|
6
|
+
value?: string;
|
|
7
|
+
notNull?: boolean;
|
|
8
|
+
conditional?: boolean | undefined;
|
|
9
|
+
};
|
|
10
|
+
events: {
|
|
11
|
+
[evt: string]: CustomEvent<any>;
|
|
12
|
+
};
|
|
13
|
+
slots: {};
|
|
14
|
+
};
|
|
15
|
+
export declare type FieldHiddenProps = typeof __propDef.props;
|
|
16
|
+
export declare type FieldHiddenEvents = typeof __propDef.events;
|
|
17
|
+
export declare type FieldHiddenSlots = typeof __propDef.slots;
|
|
18
|
+
export default class FieldHidden extends SvelteComponentTyped<FieldHiddenProps, FieldHiddenEvents, FieldHiddenSlots> {
|
|
19
|
+
}
|
|
20
|
+
export {};
|
package/Form.svelte
CHANGED
|
@@ -13,7 +13,7 @@ export let preload = undefined;
|
|
|
13
13
|
setContext(CHOOSER_API_CONTEXT, chooserClient);
|
|
14
14
|
</script>
|
|
15
15
|
|
|
16
|
-
<Form bind:store class="{className} dialog-form" {submit} {validate} on:saved {autocomplete} {name} {preload} let:messages let:
|
|
16
|
+
<Form bind:store class="{className} dialog-form" {submit} {validate} on:saved {autocomplete} {name} {preload} let:messages let:showingInlineErrors let:saved let:valid let:invalid let:validating let:submitting>
|
|
17
17
|
<slot {messages} {saved} {validating} {submitting} {valid} {invalid} />
|
|
18
18
|
<div class="form-errors" aria-live='assertive'>
|
|
19
19
|
{#if messages.length}
|
|
@@ -21,11 +21,11 @@ setContext(CHOOSER_API_CONTEXT, chooserClient);
|
|
|
21
21
|
{#each messages as message}
|
|
22
22
|
<li>{message.message}</li>
|
|
23
23
|
{/each}
|
|
24
|
-
{#if
|
|
24
|
+
{#if showingInlineErrors}
|
|
25
25
|
<li>More errors. See inline messages for details.</li>
|
|
26
26
|
{/if}
|
|
27
27
|
</ul>
|
|
28
|
-
{:else if
|
|
28
|
+
{:else if showingInlineErrors}
|
|
29
29
|
This form contains validation errors. See inline messages for details.
|
|
30
30
|
{/if}
|
|
31
31
|
</div>
|
package/chooser/Asset.svelte
CHANGED
package/chooser/Page.svelte
CHANGED
package/index.d.ts
CHANGED
|
@@ -7,6 +7,7 @@ export { default as FieldChooserLink } from './FieldChooserLink.svelte';
|
|
|
7
7
|
export { default as FieldDate } from './FieldDate.svelte';
|
|
8
8
|
export { default as FieldDateTime } from './FieldDateTime.svelte';
|
|
9
9
|
export { default as FieldDualListbox } from './FieldDualListbox.svelte';
|
|
10
|
+
export { default as FieldHidden } from './FieldHidden.svelte';
|
|
10
11
|
export { default as FieldMultiple } from './FieldMultiple.svelte';
|
|
11
12
|
export { default as FieldMultiselect } from './FieldMultiselect.svelte';
|
|
12
13
|
export { default as FieldNumber } from './FieldNumber.svelte';
|
|
@@ -15,6 +16,7 @@ export { default as FieldSelect } from './FieldSelect.svelte';
|
|
|
15
16
|
export { default as FieldStandard } from './FieldStandard.svelte';
|
|
16
17
|
export { default as FieldText } from './FieldText.svelte';
|
|
17
18
|
export { default as FieldTextArea } from './FieldTextArea.svelte';
|
|
19
|
+
export { default as FileIcon } from './FileIcon.svelte';
|
|
18
20
|
export { default as Form } from './Form.svelte';
|
|
19
21
|
export { default as Icon } from './Icon.svelte';
|
|
20
22
|
export { default as InlineMessage } from './InlineMessage.svelte';
|
package/index.js
CHANGED
|
@@ -7,6 +7,7 @@ export { default as FieldChooserLink } from './FieldChooserLink.svelte';
|
|
|
7
7
|
export { default as FieldDate } from './FieldDate.svelte';
|
|
8
8
|
export { default as FieldDateTime } from './FieldDateTime.svelte';
|
|
9
9
|
export { default as FieldDualListbox } from './FieldDualListbox.svelte';
|
|
10
|
+
export { default as FieldHidden } from './FieldHidden.svelte';
|
|
10
11
|
export { default as FieldMultiple } from './FieldMultiple.svelte';
|
|
11
12
|
export { default as FieldMultiselect } from './FieldMultiselect.svelte';
|
|
12
13
|
export { default as FieldNumber } from './FieldNumber.svelte';
|
|
@@ -15,6 +16,7 @@ export { default as FieldSelect } from './FieldSelect.svelte';
|
|
|
15
16
|
export { default as FieldStandard } from './FieldStandard.svelte';
|
|
16
17
|
export { default as FieldText } from './FieldText.svelte';
|
|
17
18
|
export { default as FieldTextArea } from './FieldTextArea.svelte';
|
|
19
|
+
export { default as FileIcon } from './FileIcon.svelte';
|
|
18
20
|
export { default as Form } from './Form.svelte';
|
|
19
21
|
export { default as Icon } from './Icon.svelte';
|
|
20
22
|
export { default as InlineMessage } from './InlineMessage.svelte';
|
package/package.json
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@dosgato/dialog",
|
|
3
3
|
"description": "A component library for building forms that edit a JSON document.",
|
|
4
|
-
"version": "0.0.
|
|
4
|
+
"version": "0.0.13",
|
|
5
5
|
"dependencies": {
|
|
6
6
|
"@txstate-mws/svelte-components": "^1.2.11",
|
|
7
|
-
"@txstate-mws/svelte-forms": "^0.0.
|
|
7
|
+
"@txstate-mws/svelte-forms": "^0.0.21",
|
|
8
8
|
"@iconify/svelte": "^2.2.1",
|
|
9
9
|
"@iconify-icons/mdi": "^1.2.22",
|
|
10
10
|
"txstate-utils": "^1.7.3"
|
|
@@ -35,6 +35,7 @@
|
|
|
35
35
|
"./FieldDate.svelte": "./FieldDate.svelte",
|
|
36
36
|
"./FieldDateTime.svelte": "./FieldDateTime.svelte",
|
|
37
37
|
"./FieldDualListbox.svelte": "./FieldDualListbox.svelte",
|
|
38
|
+
"./FieldHidden.svelte": "./FieldHidden.svelte",
|
|
38
39
|
"./FieldMultiple.svelte": "./FieldMultiple.svelte",
|
|
39
40
|
"./FieldMultiselect.svelte": "./FieldMultiselect.svelte",
|
|
40
41
|
"./FieldNumber.svelte": "./FieldNumber.svelte",
|