@dosgato/dialog 1.4.4 → 1.5.0

package/dist/iconpicker/FieldIconPicker.svelte

@@ -7,7 +7,7 @@
   import { getDescribedBy } from '../helpers'
   export let id: string | undefined = undefined
   export let path: string
-  export let label: string = ''
+  export let label = ''
   export let required = false
   export let defaultValue: { icon: string, prefix: string } = { icon: 'fa-graduation-cap', prefix: 'fas' }
   export let conditional: boolean | undefined = undefined
@@ -16,7 +16,7 @@
   const labelid = randomid()
   const descid = randomid()
 
-  let modalOpen: boolean = false
+  let modalOpen = false
   let selected: { icon: string, prefix: string } = defaultValue
 
   const iconToPrefix: Record<string, string> = {}
@@ -30,8 +30,8 @@
 
   let visibleIcons = FontAwesomeIcons
 
-  let searchVal: string = ''
-  let category: string = 'all'
+  let searchVal = ''
+  let category = 'all'
 
   $:iconCountMessage = visibleIcons.length === FontAwesomeIcons.length ? 'Showing all icons' : `Showing ${visibleIcons.length} icons`
 
@@ -59,7 +59,6 @@
     }
   }
 
-
   function onSearch () {
     visibleIcons = FontAwesomeIcons.filter(i => {
       const searchValLC = searchVal.toLowerCase()
@@ -78,9 +77,7 @@
     if (category === 'all') {
       visibleIcons = FontAwesomeIcons
     } else {
-      visibleIcons = FontAwesomeIcons.filter(i => {
-        return categoriesToIcons[category].icons.includes(i.class)
-      })
+      visibleIcons = FontAwesomeIcons.filter(i => categoriesToIcons[category].icons.includes(i.class))
     }
     if (visibleIcons.findIndex(i => i.class === selected.icon) < 0) {
       onSelectIcon(visibleIcons[0].class)
@@ -113,9 +110,9 @@
   }
 </script>
 
-<FieldStandard bind:id {path} {descid} {label} {required} {defaultValue} {conditional} {helptext} let:value let:valid let:invalid let:id let:onBlur let:setVal let:messagesid let:helptextid>
+<FieldStandard bind:id {path} {descid} {label} {required} {defaultValue} {conditional} {helptext} let:value let:valid let:invalid let:id={fieldid} let:onBlur let:setVal let:messagesid let:helptextid>
   <Icon icon={`${value.prefix === 'fab' ? 'fa7-brands' : 'fa7-solid'}:${value.icon?.slice(3) ?? 'graduation-cap'}`}/>
-  <button type="button" {id} class="select-icon" on:click={() => { modalOpen = true }} aria-describedby={getDescribedBy([descid, messagesid, helptextid])} on:blur={onBlur}>Select New Icon</button>
+  <button type="button" id={fieldid} class="select-icon" on:click={() => { modalOpen = true }} aria-describedby={getDescribedBy([descid, messagesid, helptextid])} on:blur={onBlur}>Select New Icon</button>
   {#if modalOpen}
   <Modal>
     <section>
@@ -162,7 +159,6 @@
 {/if}
 </FieldStandard>
 
-
 <style>
   .select-icon {
     border-radius: 0.25em;

package/dist/imageposition/FieldImagePosition.svelte

@@ -11,7 +11,7 @@
   export let id: string | undefined = undefined
   export let path: string
   export let imageSrc: string | undefined
-  export let label: string = ''
+  export let label = ''
   export let required = false
   export let conditional: boolean | undefined = undefined
   export let helptext: string | undefined = undefined
@@ -27,7 +27,7 @@
   const descid = randomid()
   const labelid = randomid()
 
-  let modalOpen: boolean = false
+  let modalOpen = false
   function showModal () {
     if (!modalOpen) {
       x = ($val?.x ?? 50) / 25
@@ -71,7 +71,6 @@
     boxes[y + x * 5].focus()
   }
 
-
   const positionText: Record<number, Record<number, string>> = {
     0: {
       0: 'Top Left Corner',
@@ -137,8 +136,8 @@
           <div class="image-container">
             <img class="crop-image" src={imageSrc} alt="" />
             <div class="overlay" role="radiogroup" aria-labelledby={labelid}>
-              {#each Array.from(Array(5).keys()) as col}
-                {#each Array.from(Array(5).keys()) as row}
+              {#each Array.from(Array(5).keys()) as col (col)}
+                {#each Array.from(Array(5).keys()) as row (row)}
                   <div
                     bind:this={boxes[col + row * 5]}
                     class="box"

package/dist/imageposition/index.d.ts

@@ -1,2 +1,2 @@
 export { default as FieldImagePosition } from './FieldImagePosition.svelte';
-export * from './position.js';
+export type * from './position.js';

package/dist/imageposition/index.js

@@ -1,2 +1 @@
 export { default as FieldImagePosition } from './FieldImagePosition.svelte';
-export * from './position.js';

package/dist/tagpicker/FieldTagPicker.svelte

@@ -4,7 +4,7 @@
   import { isNotBlank } from 'txstate-utils'
   import { TAG_API_CONTEXT, type Tag, type TagClient, type TagGroup } from './TagAPI'
   import trashIcon from '@iconify-icons/ph/trash-simple-fill'
-  import { Icon } from '..';
+  import { Icon } from '..'
   import type { PopupMenuItem } from '@txstate-mws/svelte-components'
 
   export let path: string
@@ -64,7 +64,6 @@
     return item.group ? `${item.group}: ${tag}` : tag
   }
 
-
 </script>
 
 <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?">

package/dist/tree/Tree.svelte

@@ -178,9 +178,9 @@
   onMount(async () => {
     document.addEventListener('dragend', onDragEnd)
     headerSizes.set(calcHeaderSizes()) // seems to need a kick on first mount
-    await new Promise(resolve => requestAnimationFrame(resolve))
+    await new Promise(resolve => { requestAnimationFrame(resolve) })
     // need to wait long enough for headers to redraw before trying to mount the rows
-    await new Promise(resolve => requestAnimationFrame(resolve))
+    await new Promise(resolve => { requestAnimationFrame(resolve) })
     mounted = true
     await store.refresh()
   })
@@ -234,7 +234,6 @@
   {/if}
 </div>
 {#if mounted && myRootItems?.length}
-  <!-- svelte-ignore a11y-no-noninteractive-element-to-interactive-role -->
   <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}>
     {#each myRootItems as item, i (item.id)}
       <TreeNode

package/dist/tree/TreeCell.svelte

@@ -11,7 +11,7 @@
   $: headerComponent = header.component as any
 </script>
 
-{#each leadingIcons as icon}
+{#each leadingIcons as icon (icon.icon)}
   <span class={['icon', icon.class?.trim()].filter(isNotBlank).join(' ')}>
     <Icon icon={icon.icon} tooltip={icon.tooltip} inline width="1.5em" hiddenLabel={icon.label} />
   </span>
@@ -25,7 +25,7 @@
 {/if}
 {#if trailingIcons.length}
   <span class="trailing-icons">
-    {#each trailingIcons as icon}
+    {#each trailingIcons as icon (icon.icon)}
       <span class={['icon', icon.class?.trim()].filter(isNotBlank).join(' ')}>
         <Icon icon={icon.icon} tooltip={icon.tooltip} inline width="1.5em" hiddenLabel={icon.label} />
       </span>

package/dist/tree/TreeNode.svelte

@@ -56,15 +56,13 @@
     if (['Enter', ' '].includes(e.key)) {
       e.preventDefault()
       e.stopPropagation()
-      if ($store.selected && $store.selected.size === 1 && $store.selected.has(item.id)) dispatch('choose', item)
-      else {
-        if (e.metaKey || e.altKey) {
-          store.select(item, { clear: false, toggle: true })
-        } else if (e.shiftKey) {
-          shiftClick()
-        } else {
-          store.select(item, { clear: true })
-        }
+      if ($store.selected?.size === 1 && $store.selected.has(item.id)) dispatch('choose', item)
+      else if (e.metaKey || e.altKey) {
+        store.select(item, { clear: false, toggle: true })
+      } else if (e.shiftKey) {
+        shiftClick()
+      } else {
+        store.select(item, { clear: true })
       }
     } else if (e.key === 'Escape') {
       store.deselect()
@@ -115,7 +113,8 @@
     const selectedNodes = treenodes.filter(n => n.matches('.selected'))
     const firstSelected = selectedNodes[0]
     if (!firstSelected || (selectedNodes.length === 1 && firstSelected === nodeelement)) {
-      return store.select(item, { toggle: true })
+      store.select(item, { toggle: true })
+      return
     }
     const lastSelected = selectedNodes[selectedNodes.length - 1]
     const selectingdownward = firstSelected.compareDocumentPosition(nodeelement) === Node.DOCUMENT_POSITION_FOLLOWING
@@ -199,26 +198,26 @@
   }
   function onDragEnter (e: DragEvent) {
     if (!dropZone) dragOver = 0
-    else dragOver++
+    else dragOver += 1
     onDragOver(e)
   }
   function onDragEnterAbove (e: DragEvent) {
     if (!dropAbove) dragOverAbove = 0
-    else dragOverAbove++
+    else dragOverAbove += 1
     onDragOverAbove(e)
   }
   function onDragLeave (e: DragEvent) {
     if (!dropZone) dragOver = 0
-    else dragOver--
+    else dragOver -= 1
   }
   function onDragLeaveAbove (e: DragEvent) {
     if (!dropAbove) dragOverAbove = 0
-    else dragOverAbove--
+    else dragOverAbove -= 1
   }
 
-  let display = $focused && $focused.id === item.id
+  let display = $focused?.id === item.id
   onMount(() => {
-    if ($focused && $focused.id === item.id) nodeelement.scrollIntoView({ block: 'center' })
+    if ($focused?.id === item.id) nodeelement.scrollIntoView({ block: 'center' })
     nodeelement.addEventListener('lazy', () => { display = true })
     lazyObserver!.observe(nodeelement)
     return () => lazyObserver!.unobserve(nodeelement)
@@ -252,7 +251,7 @@
     role="treeitem"
     data-id={item.id}
     draggable={isDraggable}
-    tabindex={$focused && $focused.id === item.id ? 0 : -1}
+    tabindex={$focused?.id === item.id ? 0 : -1}
     aria-level={level}
     aria-posinset={posinset}
     aria-setsize={setsize}

package/package.json

@@ -1,14 +1,14 @@
 {
   "name": "@dosgato/dialog",
   "description": "A component library for building forms that edit a JSON document.",
-  "version": "1.4.4",
+  "version": "1.5.0",
   "scripts": {
     "prepublishOnly": "svelte-package",
     "dev": "vite dev --force",
     "package": "svelte-package",
     "check": "svelte-check --tsconfig ./tsconfig.json",
     "check:watch": "svelte-check --tsconfig ./tsconfig.json --watch",
-    "lint": "eslint --ignore-path .gitignore ."
+    "lint": "eslint ."
   },
   "main": "./dist/index.js",
   "exports": {
@@ -20,32 +20,39 @@
     "./package.json": "./package.json"
   },
   "dependencies": {
-    "@codemirror/lang-javascript": "^6.1.7",
     "@codemirror/lang-css": "^6.2.1",
     "@codemirror/lang-html": "^6.4.3",
-    "@iconify/svelte": "^4.0.0 || ^5.0.0",
+    "@codemirror/lang-javascript": "^6.1.7",
     "@iconify-icons/mdi": "^1.2.22",
     "@iconify-icons/ph": "^1.2.2",
+    "@iconify/svelte": "^4.0.0 || ^5.0.0",
     "@txstate-mws/svelte-components": "^1.6.11",
     "@txstate-mws/svelte-forms": "^2.0.0",
+    "@typescript/vfs": "^1.6.4",
+    "@valtown/codemirror-ts": "^2.3.1",
+    "cm6-graphql": "0.2.1",
     "codemirror": "^6.0.1",
     "txstate-utils": "^1.8.0"
   },
   "devDependencies": {
+    "@eslint/compat": "^2.0.3",
+    "@stylistic/eslint-plugin": "^2.10.1",
     "@sveltejs/adapter-auto": "^7.0.0",
     "@sveltejs/kit": "^2.0.1",
     "@sveltejs/package": "^2.0.1",
     "@sveltejs/vite-plugin-svelte": "^6.0.0",
-    "eslint-config-standard-with-typescript": "^43.0.0",
+    "eslint-config-love": "^151.0.0",
     "eslint-plugin-svelte": "^3.0.0",
-    "svelte-check": "^4.0.0",
     "svelte": "^5.0.0",
+    "svelte-check": "^4.0.0",
     "typescript": "^5.0.2",
     "vite": "^7.0.0"
   },
   "peerDependencies": {
     "svelte": "^3.53.1 || ^4.0.0 || ^5.0.0"
   },
-  "files": ["dist"],
+  "files": [
+    "dist"
+  ],
   "type": "module"
 }