@dosgato/dialog 1.4.5 → 1.5.0

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 (61) hide show
  1. package/dist/Dialog.svelte +3 -3
  2. package/dist/FieldAutocomplete.svelte +19 -15
  3. package/dist/FieldCheckbox.svelte +4 -4
  4. package/dist/FieldChoices.svelte +11 -7
  5. package/dist/FieldChooserLink.svelte +30 -32
  6. package/dist/FieldDate.svelte +3 -3
  7. package/dist/FieldDateTime.svelte +3 -4
  8. package/dist/FieldDualListbox.svelte +9 -11
  9. package/dist/FieldIdentifier.svelte +2 -2
  10. package/dist/FieldMultiple.svelte +6 -5
  11. package/dist/FieldMultiselect.svelte +5 -5
  12. package/dist/FieldNumber.svelte +3 -3
  13. package/dist/FieldRadio.svelte +3 -7
  14. package/dist/FieldSelect.svelte +4 -8
  15. package/dist/FieldStandard.svelte +5 -3
  16. package/dist/FieldStandard.svelte.d.ts +4 -2
  17. package/dist/FieldText.svelte +6 -5
  18. package/dist/FieldText.svelte.d.ts +2 -1
  19. package/dist/FieldTextArea.svelte +3 -4
  20. package/dist/FileIcon.svelte +1 -1
  21. package/dist/Form.svelte +4 -4
  22. package/dist/FormDialog.svelte +2 -2
  23. package/dist/Icon.svelte +10 -6
  24. package/dist/InlineMessage.svelte +3 -3
  25. package/dist/InlineMessages.svelte +1 -1
  26. package/dist/Input.svelte +3 -3
  27. package/dist/Input.svelte.d.ts +2 -1
  28. package/dist/Listbox.svelte +3 -4
  29. package/dist/Radio.svelte +0 -1
  30. package/dist/Switcher.svelte +1 -1
  31. package/dist/Tabs.svelte +3 -4
  32. package/dist/Tooltip.svelte +6 -5
  33. package/dist/chooser/AssetTabs.svelte +19 -17
  34. package/dist/chooser/AssetTabs.svelte.d.ts +1 -1
  35. package/dist/chooser/Chooser.svelte +3 -3
  36. package/dist/chooser/Chooser.svelte.d.ts +5 -5
  37. package/dist/chooser/ChooserStore.js +2 -2
  38. package/dist/chooser/UploadUI.svelte +4 -4
  39. package/dist/code/FieldCodeEditor.svelte +3 -3
  40. package/dist/code/FieldGraphQLEditor.svelte +28 -0
  41. package/dist/code/FieldGraphQLEditor.svelte.d.ts +36 -0
  42. package/dist/code/FieldTypeScriptEditor.svelte +27 -0
  43. package/dist/code/FieldTypeScriptEditor.svelte.d.ts +34 -0
  44. package/dist/code/GraphQLEditor.svelte +145 -0
  45. package/dist/code/GraphQLEditor.svelte.d.ts +35 -0
  46. package/dist/code/TypeScriptEditor.svelte +186 -0
  47. package/dist/code/TypeScriptEditor.svelte.d.ts +33 -0
  48. package/dist/code/index.d.ts +2 -0
  49. package/dist/code/index.js +2 -0
  50. package/dist/colorpicker/FieldColorPicker.svelte +2 -2
  51. package/dist/cropper/FieldCropper.svelte +8 -10
  52. package/dist/cropper/cropper.js +9 -11
  53. package/dist/iconpicker/FieldIconPicker.svelte +7 -11
  54. package/dist/imageposition/FieldImagePosition.svelte +4 -5
  55. package/dist/imageposition/index.d.ts +1 -1
  56. package/dist/imageposition/index.js +0 -1
  57. package/dist/tagpicker/FieldTagPicker.svelte +1 -2
  58. package/dist/tree/Tree.svelte +2 -3
  59. package/dist/tree/TreeCell.svelte +2 -2
  60. package/dist/tree/TreeNode.svelte +16 -17
  61. package/package.json +14 -7
@@ -11,7 +11,7 @@
11
11
  export let id: string | undefined = undefined
12
12
  export let path: string
13
13
  export let imageSrc: string | undefined
14
- export let label: string = ''
14
+ export let label = ''
15
15
  export let required = false
16
16
  export let conditional: boolean | undefined = undefined
17
17
  export let helptext: string | undefined = undefined
@@ -27,7 +27,7 @@
27
27
  const descid = randomid()
28
28
  const labelid = randomid()
29
29
 
30
- let modalOpen: boolean = false
30
+ let modalOpen = false
31
31
  function showModal () {
32
32
  if (!modalOpen) {
33
33
  x = ($val?.x ?? 50) / 25
@@ -71,7 +71,6 @@
71
71
  boxes[y + x * 5].focus()
72
72
  }
73
73
 
74
-
75
74
  const positionText: Record<number, Record<number, string>> = {
76
75
  0: {
77
76
  0: 'Top Left Corner',
@@ -137,8 +136,8 @@
137
136
  <div class="image-container">
138
137
  <img class="crop-image" src={imageSrc} alt="" />
139
138
  <div class="overlay" role="radiogroup" aria-labelledby={labelid}>
140
- {#each Array.from(Array(5).keys()) as col}
141
- {#each Array.from(Array(5).keys()) as row}
139
+ {#each Array.from(Array(5).keys()) as col (col)}
140
+ {#each Array.from(Array(5).keys()) as row (row)}
142
141
  <div
143
142
  bind:this={boxes[col + row * 5]}
144
143
  class="box"
@@ -1,2 +1,2 @@
1
1
  export { default as FieldImagePosition } from './FieldImagePosition.svelte';
2
- export * from './position.js';
2
+ export type * from './position.js';
@@ -1,2 +1 @@
1
1
  export { default as FieldImagePosition } from './FieldImagePosition.svelte';
2
- export * from './position.js';
@@ -4,7 +4,7 @@
4
4
  import { isNotBlank } from 'txstate-utils'
5
5
  import { TAG_API_CONTEXT, type Tag, type TagClient, type TagGroup } from './TagAPI'
6
6
  import trashIcon from '@iconify-icons/ph/trash-simple-fill'
7
- import { Icon } from '..';
7
+ import { Icon } from '..'
8
8
  import type { PopupMenuItem } from '@txstate-mws/svelte-components'
9
9
 
10
10
  export let path: string
@@ -64,7 +64,6 @@
64
64
  return item.group ? `${item.group}: ${tag}` : tag
65
65
  }
66
66
 
67
-
68
67
  </script>
69
68
 
70
69
  <FieldMultiselect {path} {label} {getOptions} {lookupByValue} {conditional} {required} {extradescid} {helptext} {emptyText} {placeholder} {menuClass} {menuContainerClass} {menuItemClass} {menuItemHilitedClass} {menuCategoryClass} selectedItemLabel={showTitleInDialog ? selectedItemLabel : undefined} includeDeleteAll confirmDelete="Are you sure you want to remove all tag selections?">
@@ -178,9 +178,9 @@
178
178
  onMount(async () => {
179
179
  document.addEventListener('dragend', onDragEnd)
180
180
  headerSizes.set(calcHeaderSizes()) // seems to need a kick on first mount
181
- await new Promise(resolve => requestAnimationFrame(resolve))
181
+ await new Promise(resolve => { requestAnimationFrame(resolve) })
182
182
  // need to wait long enough for headers to redraw before trying to mount the rows
183
- await new Promise(resolve => requestAnimationFrame(resolve))
183
+ await new Promise(resolve => { requestAnimationFrame(resolve) })
184
184
  mounted = true
185
185
  await store.refresh()
186
186
  })
@@ -234,7 +234,6 @@
234
234
  {/if}
235
235
  </div>
236
236
  {#if mounted && myRootItems?.length}
237
- <!-- svelte-ignore a11y-no-noninteractive-element-to-interactive-role -->
238
237
  <ul bind:this={store.treeElement} role="tree" class:resizing={!!dragtargetid} on:mousemove={dragtargetid ? headerDrag : undefined} on:touchmove={dragtargetid ? headerDrag : undefined} on:mouseup={headerDragEnd} on:touchend={headerDragEnd} on:keyup={onKeyUp}>
239
238
  {#each myRootItems as item, i (item.id)}
240
239
  <TreeNode
@@ -11,7 +11,7 @@
11
11
  $: headerComponent = header.component as any
12
12
  </script>
13
13
 
14
- {#each leadingIcons as icon}
14
+ {#each leadingIcons as icon (icon.icon)}
15
15
  <span class={['icon', icon.class?.trim()].filter(isNotBlank).join(' ')}>
16
16
  <Icon icon={icon.icon} tooltip={icon.tooltip} inline width="1.5em" hiddenLabel={icon.label} />
17
17
  </span>
@@ -25,7 +25,7 @@
25
25
  {/if}
26
26
  {#if trailingIcons.length}
27
27
  <span class="trailing-icons">
28
- {#each trailingIcons as icon}
28
+ {#each trailingIcons as icon (icon.icon)}
29
29
  <span class={['icon', icon.class?.trim()].filter(isNotBlank).join(' ')}>
30
30
  <Icon icon={icon.icon} tooltip={icon.tooltip} inline width="1.5em" hiddenLabel={icon.label} />
31
31
  </span>
@@ -56,15 +56,13 @@
56
56
  if (['Enter', ' '].includes(e.key)) {
57
57
  e.preventDefault()
58
58
  e.stopPropagation()
59
- if ($store.selected && $store.selected.size === 1 && $store.selected.has(item.id)) dispatch('choose', item)
60
- else {
61
- if (e.metaKey || e.altKey) {
62
- store.select(item, { clear: false, toggle: true })
63
- } else if (e.shiftKey) {
64
- shiftClick()
65
- } else {
66
- store.select(item, { clear: true })
67
- }
59
+ if ($store.selected?.size === 1 && $store.selected.has(item.id)) dispatch('choose', item)
60
+ else if (e.metaKey || e.altKey) {
61
+ store.select(item, { clear: false, toggle: true })
62
+ } else if (e.shiftKey) {
63
+ shiftClick()
64
+ } else {
65
+ store.select(item, { clear: true })
68
66
  }
69
67
  } else if (e.key === 'Escape') {
70
68
  store.deselect()
@@ -115,7 +113,8 @@
115
113
  const selectedNodes = treenodes.filter(n => n.matches('.selected'))
116
114
  const firstSelected = selectedNodes[0]
117
115
  if (!firstSelected || (selectedNodes.length === 1 && firstSelected === nodeelement)) {
118
- return store.select(item, { toggle: true })
116
+ store.select(item, { toggle: true })
117
+ return
119
118
  }
120
119
  const lastSelected = selectedNodes[selectedNodes.length - 1]
121
120
  const selectingdownward = firstSelected.compareDocumentPosition(nodeelement) === Node.DOCUMENT_POSITION_FOLLOWING
@@ -199,26 +198,26 @@
199
198
  }
200
199
  function onDragEnter (e: DragEvent) {
201
200
  if (!dropZone) dragOver = 0
202
- else dragOver++
201
+ else dragOver += 1
203
202
  onDragOver(e)
204
203
  }
205
204
  function onDragEnterAbove (e: DragEvent) {
206
205
  if (!dropAbove) dragOverAbove = 0
207
- else dragOverAbove++
206
+ else dragOverAbove += 1
208
207
  onDragOverAbove(e)
209
208
  }
210
209
  function onDragLeave (e: DragEvent) {
211
210
  if (!dropZone) dragOver = 0
212
- else dragOver--
211
+ else dragOver -= 1
213
212
  }
214
213
  function onDragLeaveAbove (e: DragEvent) {
215
214
  if (!dropAbove) dragOverAbove = 0
216
- else dragOverAbove--
215
+ else dragOverAbove -= 1
217
216
  }
218
217
 
219
- let display = $focused && $focused.id === item.id
218
+ let display = $focused?.id === item.id
220
219
  onMount(() => {
221
- if ($focused && $focused.id === item.id) nodeelement.scrollIntoView({ block: 'center' })
220
+ if ($focused?.id === item.id) nodeelement.scrollIntoView({ block: 'center' })
222
221
  nodeelement.addEventListener('lazy', () => { display = true })
223
222
  lazyObserver!.observe(nodeelement)
224
223
  return () => lazyObserver!.unobserve(nodeelement)
@@ -252,7 +251,7 @@
252
251
  role="treeitem"
253
252
  data-id={item.id}
254
253
  draggable={isDraggable}
255
- tabindex={$focused && $focused.id === item.id ? 0 : -1}
254
+ tabindex={$focused?.id === item.id ? 0 : -1}
256
255
  aria-level={level}
257
256
  aria-posinset={posinset}
258
257
  aria-setsize={setsize}
package/package.json CHANGED
@@ -1,14 +1,14 @@
1
1
  {
2
2
  "name": "@dosgato/dialog",
3
3
  "description": "A component library for building forms that edit a JSON document.",
4
- "version": "1.4.5",
4
+ "version": "1.5.0",
5
5
  "scripts": {
6
6
  "prepublishOnly": "svelte-package",
7
7
  "dev": "vite dev --force",
8
8
  "package": "svelte-package",
9
9
  "check": "svelte-check --tsconfig ./tsconfig.json",
10
10
  "check:watch": "svelte-check --tsconfig ./tsconfig.json --watch",
11
- "lint": "eslint --ignore-path .gitignore ."
11
+ "lint": "eslint ."
12
12
  },
13
13
  "main": "./dist/index.js",
14
14
  "exports": {
@@ -20,32 +20,39 @@
20
20
  "./package.json": "./package.json"
21
21
  },
22
22
  "dependencies": {
23
- "@codemirror/lang-javascript": "^6.1.7",
24
23
  "@codemirror/lang-css": "^6.2.1",
25
24
  "@codemirror/lang-html": "^6.4.3",
26
- "@iconify/svelte": "^4.0.0 || ^5.0.0",
25
+ "@codemirror/lang-javascript": "^6.1.7",
27
26
  "@iconify-icons/mdi": "^1.2.22",
28
27
  "@iconify-icons/ph": "^1.2.2",
28
+ "@iconify/svelte": "^4.0.0 || ^5.0.0",
29
29
  "@txstate-mws/svelte-components": "^1.6.11",
30
30
  "@txstate-mws/svelte-forms": "^2.0.0",
31
+ "@typescript/vfs": "^1.6.4",
32
+ "@valtown/codemirror-ts": "^2.3.1",
33
+ "cm6-graphql": "0.2.1",
31
34
  "codemirror": "^6.0.1",
32
35
  "txstate-utils": "^1.8.0"
33
36
  },
34
37
  "devDependencies": {
38
+ "@eslint/compat": "^2.0.3",
39
+ "@stylistic/eslint-plugin": "^2.10.1",
35
40
  "@sveltejs/adapter-auto": "^7.0.0",
36
41
  "@sveltejs/kit": "^2.0.1",
37
42
  "@sveltejs/package": "^2.0.1",
38
43
  "@sveltejs/vite-plugin-svelte": "^6.0.0",
39
- "eslint-config-standard-with-typescript": "^43.0.0",
44
+ "eslint-config-love": "^151.0.0",
40
45
  "eslint-plugin-svelte": "^3.0.0",
41
- "svelte-check": "^4.0.0",
42
46
  "svelte": "^5.0.0",
47
+ "svelte-check": "^4.0.0",
43
48
  "typescript": "^5.0.2",
44
49
  "vite": "^7.0.0"
45
50
  },
46
51
  "peerDependencies": {
47
52
  "svelte": "^3.53.1 || ^4.0.0 || ^5.0.0"
48
53
  },
49
- "files": ["dist"],
54
+ "files": [
55
+ "dist"
56
+ ],
50
57
  "type": "module"
51
58
  }