@dosgato/dialog 0.0.19 → 0.0.21

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.
Files changed (95) hide show
  1. package/Button.svelte +77 -0
  2. package/Button.svelte.d.ts +30 -0
  3. package/ButtonGroup.svelte.d.ts +3 -3
  4. package/Checkbox.svelte +2 -1
  5. package/Checkbox.svelte.d.ts +4 -3
  6. package/Container.svelte +18 -19
  7. package/Container.svelte.d.ts +5 -3
  8. package/Dialog.svelte +155 -0
  9. package/Dialog.svelte.d.ts +50 -0
  10. package/FieldAutocomplete.svelte +4 -7
  11. package/FieldAutocomplete.svelte.d.ts +4 -4
  12. package/FieldCheckbox.svelte +3 -2
  13. package/FieldCheckbox.svelte.d.ts +5 -4
  14. package/FieldChoices.svelte +3 -2
  15. package/FieldChoices.svelte.d.ts +4 -3
  16. package/FieldChooserLink.svelte +17 -13
  17. package/FieldChooserLink.svelte.d.ts +4 -5
  18. package/FieldDate.svelte +3 -2
  19. package/FieldDate.svelte.d.ts +4 -3
  20. package/FieldDateTime.svelte +3 -2
  21. package/FieldDateTime.svelte.d.ts +4 -3
  22. package/FieldDualListbox.svelte.d.ts +3 -3
  23. package/FieldHidden.svelte.d.ts +3 -3
  24. package/FieldIdentifier.svelte.d.ts +3 -3
  25. package/FieldMultiple.svelte +14 -7
  26. package/FieldMultiple.svelte.d.ts +6 -3
  27. package/FieldMultiselect.svelte +29 -22
  28. package/FieldMultiselect.svelte.d.ts +3 -3
  29. package/FieldNumber.svelte +3 -2
  30. package/FieldNumber.svelte.d.ts +4 -3
  31. package/FieldRadio.svelte +9 -4
  32. package/FieldRadio.svelte.d.ts +9 -3
  33. package/FieldSelect.svelte +9 -3
  34. package/FieldSelect.svelte.d.ts +9 -3
  35. package/FieldStandard.svelte +8 -3
  36. package/FieldStandard.svelte.d.ts +9 -3
  37. package/FieldText.svelte +3 -2
  38. package/FieldText.svelte.d.ts +4 -3
  39. package/FieldTextArea.svelte +5 -3
  40. package/FieldTextArea.svelte.d.ts +4 -3
  41. package/FileIcon.svelte.d.ts +3 -3
  42. package/Form.svelte +3 -3
  43. package/Form.svelte.d.ts +3 -3
  44. package/FormDialog.svelte +34 -0
  45. package/FormDialog.svelte.d.ts +38 -0
  46. package/Icon.svelte.d.ts +3 -3
  47. package/InlineMessage.svelte.d.ts +3 -3
  48. package/InlineMessages.svelte.d.ts +3 -3
  49. package/Input.svelte +4 -1
  50. package/Input.svelte.d.ts +4 -3
  51. package/Listbox.svelte.d.ts +3 -3
  52. package/Radio.svelte +5 -2
  53. package/Radio.svelte.d.ts +4 -3
  54. package/Tab.svelte +3 -2
  55. package/Tab.svelte.d.ts +3 -3
  56. package/TabStore.d.ts +11 -1
  57. package/TabStore.js +30 -3
  58. package/Tabs.svelte +66 -18
  59. package/Tabs.svelte.d.ts +5 -7
  60. package/chooser/Chooser.svelte +76 -99
  61. package/chooser/Chooser.svelte.d.ts +5 -5
  62. package/chooser/ChooserAPI.d.ts +10 -3
  63. package/chooser/ChooserStore.d.ts +15 -33
  64. package/chooser/ChooserStore.js +32 -149
  65. package/chooser/Details.svelte.d.ts +6 -5
  66. package/chooser/Thumbnail.svelte +9 -2
  67. package/chooser/Thumbnail.svelte.d.ts +6 -5
  68. package/colorpicker/FieldColorPicker.svelte +78 -24
  69. package/colorpicker/FieldColorPicker.svelte.d.ts +5 -6
  70. package/fileIcons.d.ts +2 -1
  71. package/helpers.d.ts +1 -0
  72. package/helpers.js +5 -0
  73. package/iconpicker/FieldIconPicker.svelte +4 -2
  74. package/iconpicker/FieldIconPicker.svelte.d.ts +4 -3
  75. package/index.d.ts +7 -0
  76. package/index.js +7 -0
  77. package/package.json +20 -13
  78. package/tree/LoadIcon.svelte +24 -0
  79. package/tree/LoadIcon.svelte.d.ts +23 -0
  80. package/tree/Tree.svelte +203 -0
  81. package/tree/Tree.svelte.d.ts +28 -0
  82. package/tree/TreeCell.svelte +18 -0
  83. package/tree/TreeCell.svelte.d.ts +18 -0
  84. package/tree/TreeNode.svelte +418 -0
  85. package/tree/TreeNode.svelte.d.ts +30 -0
  86. package/tree/index.d.ts +3 -0
  87. package/tree/index.js +3 -0
  88. package/tree/treestore.d.ts +117 -0
  89. package/tree/treestore.js +336 -0
  90. package/chooser/Asset.svelte +0 -83
  91. package/chooser/Asset.svelte.d.ts +0 -25
  92. package/chooser/AssetFolder.svelte +0 -127
  93. package/chooser/AssetFolder.svelte.d.ts +0 -25
  94. package/chooser/Page.svelte +0 -121
  95. package/chooser/Page.svelte.d.ts +0 -25
@@ -1,121 +0,0 @@
1
- <script>import fileOutline from '@iconify-icons/mdi/file-outline.js';
2
- import fileSyncOutline from '@iconify-icons/mdi/file-sync-outline.js';
3
- import { modifierKey } from '@txstate-mws/svelte-components';
4
- import { createEventDispatcher, getContext } from 'svelte';
5
- import { hashid } from 'txstate-utils';
6
- import { CHOOSER_STORE_CONTEXT } from './ChooserStore';
7
- import Icon from '../Icon.svelte';
8
- export let page;
9
- export let level;
10
- export let posinset;
11
- export let setsize;
12
- export let next;
13
- export let prev;
14
- export let parent = undefined;
15
- const store = getContext(CHOOSER_STORE_CONTEXT);
16
- $: open = page.open && page.children?.length;
17
- $: nextlevel = level + 1;
18
- $: id = hashid(page.id);
19
- $: haveFocus = $store.focus === page.id;
20
- $: isPreview = $store.preview?.id === page.id;
21
- const dispatch = createEventDispatcher();
22
- function onKeyDown(e) {
23
- if (modifierKey(e))
24
- return;
25
- if (['Enter', ' '].includes(e.key)) {
26
- onClick(e);
27
- }
28
- else if (e.key === 'ArrowRight') {
29
- e.preventDefault();
30
- e.stopPropagation();
31
- if (page.open && page.children?.length) {
32
- const child = page.children[0];
33
- store.setFocus(child);
34
- document.getElementById(hashid(child.id)).focus();
35
- }
36
- else {
37
- store.open(page);
38
- }
39
- }
40
- else if (e.key === 'ArrowLeft') {
41
- e.preventDefault();
42
- e.stopPropagation();
43
- if (page.open) {
44
- store.close(page);
45
- }
46
- else if (parent) {
47
- store.setFocus(parent);
48
- document.getElementById(hashid(parent.id)).focus();
49
- }
50
- }
51
- else if (e.key === 'ArrowDown') {
52
- e.preventDefault();
53
- e.stopPropagation();
54
- const mynext = open ? page.children[0] : next;
55
- if (mynext) {
56
- store.setFocus(mynext);
57
- document.getElementById(hashid(mynext.id)).focus();
58
- }
59
- }
60
- else if (e.key === 'ArrowUp') {
61
- e.preventDefault();
62
- e.stopPropagation();
63
- const anyprev = prev;
64
- const myprev = anyprev?.open && anyprev.children?.length && anyprev.path === page.path ? anyprev.children[anyprev.children.length - 1] : prev;
65
- if (myprev) {
66
- store.setFocus(myprev);
67
- document.getElementById(hashid(myprev.id)).focus();
68
- }
69
- }
70
- }
71
- function onClick(e) {
72
- e.preventDefault();
73
- e.stopPropagation();
74
- // if the id was already the same as the one that was clicked, the user
75
- // has clicked it twice, so we should choose the item and end the modal
76
- if ($store.preview?.id === page.id)
77
- dispatch('choose', page);
78
- else {
79
- store.preview(page);
80
- store.toggle(page);
81
- }
82
- }
83
- </script>
84
-
85
- <li
86
- {id}
87
- role="treeitem"
88
- class:isPreview
89
- aria-expanded={!!page.open}
90
- aria-selected={isPreview}
91
- aria-level={level}
92
- aria-setsize={setsize}
93
- aria-posinset={posinset}
94
- aria-busy={page.loading}
95
- tabindex={haveFocus ? 0 : -1}
96
- on:keydown={onKeyDown}
97
- on:click={onClick}
98
- >
99
- <Icon icon={page.open ? fileOutline : (page.loading ? fileSyncOutline : fileOutline)} inline /> {page.name}
100
- </li>
101
- {#if open}
102
- <ul role="group" class="dialog-asset-sublist">
103
- {#each page.children as child, i (child.id)}
104
- {@const setsize = page.children.length}
105
- {@const posinset = i + 1}
106
- {@const subprev = i === 0 ? page : page.children[i - 1]}
107
- {@const subnext = i === setsize - 1 ? next : page.children[i + 1]}
108
- <svelte:self page={child} {setsize} {posinset} level={nextlevel} prev={subprev} next={subnext} parent={page} on:choose />
109
- {/each}
110
- </ul>
111
- {/if}
112
-
113
- <style>
114
- .dialog-asset-sublist {
115
- list-style: none;
116
- padding-left: 1em;
117
- }
118
- li {
119
- cursor: pointer;
120
- }
121
- </style>
@@ -1,25 +0,0 @@
1
- import { SvelteComponentTyped } from "svelte";
2
- import type { UIPage, AnyUIItem } from './ChooserStore';
3
- declare const __propDef: {
4
- props: {
5
- page: UIPage;
6
- level: number;
7
- posinset: number;
8
- setsize: number;
9
- next: AnyUIItem | undefined;
10
- prev: AnyUIItem | undefined;
11
- parent?: UIPage | undefined;
12
- };
13
- events: {
14
- choose: CustomEvent<any>;
15
- } & {
16
- [evt: string]: CustomEvent<any>;
17
- };
18
- slots: {};
19
- };
20
- export declare type PageProps = typeof __propDef.props;
21
- export declare type PageEvents = typeof __propDef.events;
22
- export declare type PageSlots = typeof __propDef.slots;
23
- export default class Page extends SvelteComponentTyped<PageProps, PageEvents, PageSlots> {
24
- }
25
- export {};