From a37f4628642bdd28d2c946dd350c144c62345bef Mon Sep 17 00:00:00 2001 From: Jos de Jong Date: Fri, 8 Dec 2023 12:20:59 +0100 Subject: [PATCH] chore: fix TypeScript issues (WIP) --- src/lib/components/JSONEditor.svelte | 2 + src/lib/components/JSONEditor.test.ts | 9 +- .../controls/contextmenu/ContextMenu.svelte | 10 +- .../contextmenu/ContextMenuPointer.svelte | 8 +- .../NavigationBarPathEditor.svelte | 10 +- .../modes/tablemode/ColumnHeader.svelte | 2 +- .../modes/tablemode/TableMode.svelte | 2 +- .../contextmenu/TableContextMenu.svelte | 2 +- .../components/modes/textmode/TextMode.svelte | 17 +-- .../modes/textmode/menu/TextMenu.svelte | 26 ++--- .../components/modes/treemode/JSONNode.svelte | 110 +++++++++++------- .../components/modes/treemode/TreeMode.svelte | 19 +-- .../modes/treemode/ValidationErrorIcon.svelte | 6 +- .../modes/treemode/menu/SearchBox.svelte | 6 +- src/lib/utils/cssUtils.ts | 2 +- src/lib/utils/domUtils.ts | 8 +- tsconfig.json | 2 +- 17 files changed, 134 insertions(+), 107 deletions(-) diff --git a/src/lib/components/JSONEditor.svelte b/src/lib/components/JSONEditor.svelte index 20bab62b..b096e2fd 100644 --- a/src/lib/components/JSONEditor.svelte +++ b/src/lib/components/JSONEditor.svelte @@ -423,6 +423,8 @@ $: { debug('mode changed to', mode) + // eslint-disable-next-line @typescript-eslint/ban-ts-comment + // @ts-expect-error if (mode === 'code') { // check for 'code' is here for backward compatibility (deprecated since v0.4.0) console.warn( diff --git a/src/lib/components/JSONEditor.test.ts b/src/lib/components/JSONEditor.test.ts index f59befb1..efe0745e 100644 --- a/src/lib/components/JSONEditor.test.ts +++ b/src/lib/components/JSONEditor.test.ts @@ -2,9 +2,10 @@ import { beforeEach, afterEach, test, describe, expect, vi } from 'vitest' import '@testing-library/jest-dom' import { render, screen } from '@testing-library/svelte' import JSONEditor from './JSONEditor.svelte' +import { type Content, Mode } from '$lib/types.js' describe('JSONEditor', () => { - const content = { + const content: Content = { json: [{ id: 1 }, { id: 2, name: 'Joe' }, { id: 3 }] } @@ -27,7 +28,7 @@ describe('JSONEditor', () => { test('render tree mode', () => { const { container } = render(JSONEditor, { props: { - mode: 'tree', + mode: Mode.tree, content } }) @@ -41,7 +42,7 @@ describe('JSONEditor', () => { test('render text mode', () => { const { container } = render(JSONEditor, { props: { - mode: 'text', + mode: Mode.text, content } }) @@ -55,7 +56,7 @@ describe('JSONEditor', () => { test('render table mode', () => { const { container } = render(JSONEditor, { props: { - mode: 'table', + mode: Mode.table, content } }) diff --git a/src/lib/components/controls/contextmenu/ContextMenu.svelte b/src/lib/components/controls/contextmenu/ContextMenu.svelte index 441d420d..f6436c7b 100644 --- a/src/lib/components/controls/contextmenu/ContextMenu.svelte +++ b/src/lib/components/controls/contextmenu/ContextMenu.svelte @@ -40,19 +40,19 @@ ArrowRight: 'Right' } - function handleKeyDown(event) { + function handleKeyDown(event: KeyboardEvent & { currentTarget: EventTarget & HTMLDivElement }) { const combo = keyComboFromEvent(event) const direction: 'Up' | 'Down' | 'Left' | 'Right' | undefined = directionByCombo[combo] - if (direction && event.target) { + if (direction && event.currentTarget) { event.preventDefault() const buttons: HTMLButtonElement[] = Array.from( refContextMenu.querySelectorAll('button:not([disabled])') ) - const nearest = findNearestElement({ + const nearest = findNearestElement({ allElements: buttons, - currentElement: event.target, + currentElement: event.currentTarget as unknown as HTMLButtonElement, direction, hasPrio: (element: HTMLButtonElement) => { return element.getAttribute('data-type') !== 'jse-open-dropdown' @@ -75,7 +75,7 @@ tabindex="-1" class="jse-contextmenu" bind:this={refContextMenu} - on:keydown={handleKeyDown} + on:keydown={(event) => handleKeyDown(event)} > {#each items as item} {#if isMenuButton(item)} diff --git a/src/lib/components/controls/contextmenu/ContextMenuPointer.svelte b/src/lib/components/controls/contextmenu/ContextMenuPointer.svelte index d2e6b6d3..f17c6073 100644 --- a/src/lib/components/controls/contextmenu/ContextMenuPointer.svelte +++ b/src/lib/components/controls/contextmenu/ContextMenuPointer.svelte @@ -13,10 +13,10 @@ export let selected: boolean export let onContextMenu: OnContextMenu - function handleClick(event) { - let buttonElem = event.target + function handleClick(event: MouseEvent & { currentTarget: EventTarget & HTMLButtonElement }) { + let buttonElem: Element | null = event.currentTarget while (buttonElem && buttonElem.nodeName !== 'BUTTON') { - buttonElem = buttonElem.parentNode + buttonElem = buttonElem.parentNode as Element } if (buttonElem) { @@ -39,7 +39,7 @@ class="jse-context-menu-pointer" class:jse-selected={selected} title={CONTEXT_MENU_EXPLANATION} - on:click={handleClick} + on:click={(event) => handleClick(event)} > diff --git a/src/lib/components/controls/navigationBar/NavigationBarPathEditor.svelte b/src/lib/components/controls/navigationBar/NavigationBarPathEditor.svelte index b7e7cd45..7d0fd589 100644 --- a/src/lib/components/controls/navigationBar/NavigationBarPathEditor.svelte +++ b/src/lib/components/controls/navigationBar/NavigationBarPathEditor.svelte @@ -53,7 +53,7 @@ } catch (error) { return { path: undefined, - error + error: error as Error } } } @@ -64,7 +64,7 @@ } } - function handleInput(event) { + function handleInput(event: Event & { currentTarget: EventTarget & HTMLInputElement }) { inputPath = event.currentTarget.value } @@ -81,7 +81,7 @@ if (result.path !== undefined) { onChange(result.path) } else { - onError(result.error) + onError(result.error as Error) } } } @@ -89,7 +89,7 @@ function handleCopy() { copyToClipBoard(inputPath) copied = true - copiedTimer = setTimeout(() => (copied = false), copiedDelay) + copiedTimer = window.setTimeout(() => (copied = false), copiedDelay) focus() } @@ -108,7 +108,7 @@ type="button" class="jse-navigation-bar-validation-error" use:tooltip={{ - text: inputValidationError, + text: String(inputValidationError || ''), ...absolutePopupContext }} > diff --git a/src/lib/components/modes/tablemode/ColumnHeader.svelte b/src/lib/components/modes/tablemode/ColumnHeader.svelte index 5a7474ca..0aa54d99 100644 --- a/src/lib/components/modes/tablemode/ColumnHeader.svelte +++ b/src/lib/components/modes/tablemode/ColumnHeader.svelte @@ -4,7 +4,7 @@ import type { JSONPath } from 'immutable-json-patch' import type { SortedColumn } from '$lib/types.js' import { SortDirection } from '$lib/types.js' - import { stringifyJSONPath } from '../../../utils/pathUtils.js' + import { stringifyJSONPath } from '$lib/utils/pathUtils.js' import Icon from 'svelte-awesome' import { faCaretDown, faCaretUp } from '@fortawesome/free-solid-svg-icons' import { isEmpty, isEqual } from 'lodash-es' diff --git a/src/lib/components/modes/tablemode/TableMode.svelte b/src/lib/components/modes/tablemode/TableMode.svelte index 3aa90bfb..519df43f 100644 --- a/src/lib/components/modes/tablemode/TableMode.svelte +++ b/src/lib/components/modes/tablemode/TableMode.svelte @@ -689,7 +689,7 @@ } function findNextInside(path: JSONPath): JSONSelection { - const index = parseInt(path[0]) + const index = parseInt(path[0], 10) const nextPath = [String(index + 1), ...path.slice(1)] return existsIn(json, nextPath) diff --git a/src/lib/components/modes/tablemode/contextmenu/TableContextMenu.svelte b/src/lib/components/modes/tablemode/contextmenu/TableContextMenu.svelte index 36683456..f0e41c7f 100644 --- a/src/lib/components/modes/tablemode/contextmenu/TableContextMenu.svelte +++ b/src/lib/components/modes/tablemode/contextmenu/TableContextMenu.svelte @@ -58,7 +58,7 @@ $: canEnforceString = canEditValue && !isObjectOrArray(focusValue) $: enforceString = - selection != null + selection != null && focusValue !== undefined ? getEnforceString( focusValue, documentState.enforceStringMap, diff --git a/src/lib/components/modes/textmode/TextMode.svelte b/src/lib/components/modes/textmode/TextMode.svelte index f68d6184..a2680022 100644 --- a/src/lib/components/modes/textmode/TextMode.svelte +++ b/src/lib/components/modes/textmode/TextMode.svelte @@ -283,7 +283,7 @@ return true } catch (err) { - onError(err) + onError(err as Error) } return false @@ -305,7 +305,7 @@ return true } catch (err) { - onError(err) + onError(err as Error) } return false @@ -325,7 +325,7 @@ jsonStatus = JSON_STATUS_VALID jsonParseError = null } catch (err) { - onError(err) + onError(err as Error) } } @@ -353,7 +353,7 @@ } }) } catch (err) { - onError(err) + onError(err as Error) } } @@ -396,7 +396,7 @@ } }) } catch (err) { - onError(err) + onError(err as Error) } } @@ -460,12 +460,15 @@ function handleSelectValidationError(validationError: ValidationError) { debug('select validation error', validationError) - const richValidationError = toRichValidationError(validationError) + const { from, to } = toRichValidationError(validationError) + if (from === null || to === null) { + return + } // we take "to" as head, not as anchor, because the scrollIntoView will // move to the head, and when a large whole object is selected as a whole, // we want to scroll to the start of the object and not the end - setSelection(richValidationError.from, richValidationError.to) + setSelection(from, to) focus() } diff --git a/src/lib/components/modes/textmode/menu/TextMenu.svelte b/src/lib/components/modes/textmode/menu/TextMenu.svelte index 7b12870e..802e7725 100644 --- a/src/lib/components/modes/textmode/menu/TextMenu.svelte +++ b/src/lib/components/modes/textmode/menu/TextMenu.svelte @@ -13,19 +13,19 @@ import type { MenuItem, OnRenderMenuWithoutContext } from '$lib/types' export let readOnly = false - export let onFormat - export let onCompact - export let onSort - export let onTransform - export let onToggleSearch - export let onUndo - export let onRedo - export let canUndo - export let canRedo - export let canFormat - export let canCompact - export let canSort - export let canTransform + export let onFormat: () => boolean + export let onCompact: () => boolean + export let onSort: () => void + export let onTransform: () => void + export let onToggleSearch: () => void + export let onUndo: () => void + export let onRedo: () => void + export let canUndo: boolean + export let canRedo: boolean + export let canFormat: boolean + export let canCompact: boolean + export let canSort: boolean + export let canTransform: boolean export let onRenderMenu: OnRenderMenuWithoutContext const searchItem: MenuItem = { diff --git a/src/lib/components/modes/treemode/JSONNode.svelte b/src/lib/components/modes/treemode/JSONNode.svelte index bedb7152..b01f00b5 100644 --- a/src/lib/components/modes/treemode/JSONNode.svelte +++ b/src/lib/components/modes/treemode/JSONNode.svelte @@ -58,6 +58,7 @@ import { onMoveSelection } from '$lib/logic/dragging.js' import { forEachIndex, moveItems } from '$lib/utils/arrayUtils.js' import type { + AbsolutePopupOptions, CaretPosition, DraggingState, ExtendedSearchResultItem, @@ -68,7 +69,6 @@ NestedValidationError, RenderedItem, TreeModeContext, - ValidationError, VisibleSection } from '$lib/types' import { SelectionType } from '$lib/types.js' @@ -88,7 +88,9 @@ export let searchResultItemsMap: JSONPointerMap | undefined export let selection: JSONSelection | null export let context: TreeModeContext - export let onDragSelectionStart: MouseEvent + export let onDragSelectionStart: ( + event: MouseEvent & { currentTarget: EventTarget & HTMLDivElement } + ) => void const debug = createDebug('jsoneditor:JSONNode') @@ -112,7 +114,7 @@ let visibleSections: VisibleSection[] | undefined $: visibleSections = visibleSectionsMap ? visibleSectionsMap[pointer] : undefined - let validationError: ValidationError | undefined + let validationError: NestedValidationError | undefined $: validationError = validationErrorsMap ? validationErrorsMap[pointer] : undefined let isNodeSelected: boolean @@ -217,35 +219,34 @@ return items } - function toggleExpand(event) { + function toggleExpand(event: MouseEvent) { event.stopPropagation() const recursive = event.ctrlKey context.onExpand(path, !expanded, recursive) } - function handleExpand(event) { + function handleExpand(event: MouseEvent) { event.stopPropagation() context.onExpand(path, true) } - function handleUpdateKey(oldKey, newKey) { - const operations = rename(path, Object.keys(value), oldKey, newKey) + function handleUpdateKey(oldKey: string, newKey: string): string { + const operations = rename(path, Object.keys(value as JSONObject), oldKey, newKey) context.onPatch(operations) // It is possible that the applied key differs from newKey, // to prevent duplicate keys. Here we figure out the actually applied key - const newKeyUnique = last(parseJSONPointer(operations[0].path)) - - return newKeyUnique + return last(parseJSONPointer(operations[0].path)) || newKey } - function handleMouseDown(event) { + function handleMouseDown(event: MouseEvent & { currentTarget: EventTarget & HTMLDivElement }) { // check if the mouse down is not happening in the key or value input fields or on a button if ( - isContentEditableDiv(event.target) || - (event.which === 1 && isChildOfNodeName(event.target, 'BUTTON')) // left mouse on a button + event.target && + (isContentEditableDiv(event.currentTarget) || + (event.which === 1 && isChildOfNodeName(event.currentTarget, 'BUTTON'))) // left mouse on a button ) { return } @@ -262,7 +263,7 @@ document.addEventListener('mousemove', handleMouseMoveGlobal, true) document.addEventListener('mouseup', handleMouseUpGlobal) - const anchorType = getSelectionTypeFromTarget(event.target) + const anchorType = getSelectionTypeFromTarget(event.currentTarget) const json = context.getJson() const documentState = context.getDocumentState() @@ -296,7 +297,7 @@ } } else { if (anchorType === SelectionType.multi) { - if (root && event.target.hasAttribute('data-path')) { + if (root && event.currentTarget.hasAttribute('data-path')) { const lastCaretPosition = last( getVisibleCaretPositions(value, documentState) ) as CaretPosition @@ -304,13 +305,13 @@ } else { context.onSelect(createMultiSelection(path, path)) } - } else { + } else if (json !== undefined) { context.onSelect(fromSelectionType(json, anchorType, path)) } } } - function handleMouseMove(event) { + function handleMouseMove(event: MouseEvent & { currentTarget: EventTarget & HTMLDivElement }) { if (singleton.selecting) { event.preventDefault() event.stopPropagation() @@ -325,7 +326,7 @@ } } - const selectionType = getSelectionTypeFromTarget(event.target) + const selectionType = getSelectionTypeFromTarget(event.currentTarget) if ( !isEqual(path, singleton.selectionFocus) || @@ -344,11 +345,11 @@ } } - function handleMouseMoveGlobal(event) { + function handleMouseMoveGlobal(event: Event) { context.onDrag(event) } - function handleMouseUpGlobal(event) { + function handleMouseUpGlobal(event: Event) { if (singleton.selecting) { singleton.selecting = false @@ -376,7 +377,9 @@ return clientOffset - contentOffset } - function handleDragSelectionStart(event: MouseEvent) { + function handleDragSelectionStart( + event: MouseEvent & { currentTarget: EventTarget & HTMLDivElement } + ) { if (context.readOnly || !selection) { return } @@ -402,6 +405,9 @@ } const json = context.getJson() + if (json === undefined) { + return + } const initialPath = getStartPath(json, selection) const selectionStartIndex = items.findIndex((item) => isEqual(item.path, initialPath)) const documentState = context.getDocumentState() @@ -413,7 +419,7 @@ }) dragging = { - initialTarget: event.target, + initialTarget: event.currentTarget, initialClientY: event.clientY, initialContentTop: findContentTop(), selectionStartIndex, @@ -431,6 +437,9 @@ function handleDragSelection(event: MouseEvent) { if (dragging) { const json = context.getJson() + if (json === undefined) { + return + } const documentState = context.getDocumentState() const deltaY = calculateDeltaY(dragging, event) @@ -453,9 +462,12 @@ } } - function handleDragSelectionEnd(event) { + function handleDragSelectionEnd(event: MouseEvent) { if (dragging) { const json = context.getJson() + if (json === undefined) { + return + } const documentState = context.getDocumentState() const deltaY = calculateDeltaY(dragging, event) const { operations, updatedSelection } = onMoveSelection({ @@ -475,9 +487,9 @@ } else { // the user did click inside the selection and no contents have been dragged, // select the clicked item - if (event.target === dragging.initialTarget && !dragging.didMoveItems) { - const selectionType = getSelectionTypeFromTarget(event.target) - const path = getDataPathFromTarget(event.target) + if (event.currentTarget === dragging.initialTarget && !dragging.didMoveItems) { + const selectionType = getSelectionTypeFromTarget(event.currentTarget as Element) + const path = getDataPathFromTarget(event.currentTarget as Element) if (path) { context.onSelect(fromSelectionType(json, selectionType, path)) } @@ -515,10 +527,16 @@ } if (Array.isArray(value)) { - const startPath = getStartPath(context.getJson(), selection) - const endPath = getEndPath(context.getJson(), selection) - const startIndex = last(startPath) - const endIndex = last(endPath) + const json = context.getJson() + if (json === undefined) { + return null + } + const startPath = getStartPath(json, selection) + const endPath = getEndPath(json, selection) + const startIndex = parseInt(last(startPath) as string, 10) + const endIndex = parseInt(last(endPath) as string, 10) + + console.log('TEST', { startPath, endPath, startIndex, endIndex }) // find the section where the selection is // if the selection is spread over multiple visible sections, @@ -536,37 +554,41 @@ forEachIndex(start, Math.min(value.length, end), (index) => addHeight(String(index))) } else { // value is Object - Object.keys(value).forEach(addHeight) + Object.keys(value as JSONObject).forEach(addHeight) } return items } - function handleMouseOver(event: MouseEvent) { + function handleMouseOver(event: MouseEvent & { currentTarget: EventTarget & HTMLDivElement }) { if (singleton.selecting || singleton.dragging) { return } event.stopPropagation() - if (isChildOfAttribute(event.target, 'data-type', 'selectable-value')) { + if (isChildOfAttribute(event.currentTarget, 'data-type', 'selectable-value')) { hover = HOVER_COLLECTION - } else if (isChildOfAttribute(event.target, 'data-type', 'insert-selection-area-inside')) { + } else if ( + isChildOfAttribute(event.currentTarget, 'data-type', 'insert-selection-area-inside') + ) { hover = HOVER_INSERT_INSIDE - } else if (isChildOfAttribute(event.target, 'data-type', 'insert-selection-area-after')) { + } else if ( + isChildOfAttribute(event.currentTarget, 'data-type', 'insert-selection-area-after') + ) { hover = HOVER_INSERT_AFTER } clearTimeout(hoverTimer) } - function handleMouseOut(event: MouseEvent) { + function handleMouseOut(event: MouseEvent & { currentTarget: EventTarget & HTMLDivElement }) { event.stopPropagation() // to prevent "flickering" in the hovering state when hovering on the edge // of the insert area context menu button: it's visibility toggles when // `hover` toggles, which will alternating mouseout and mouseover events - hoverTimer = setTimeout(() => (hover = undefined)) + hoverTimer = window.setTimeout(() => (hover = undefined)) } function handleInsertInside(event: MouseEvent) { @@ -587,14 +609,14 @@ } } - function handleInsertInsideOpenContextMenu(props) { + function handleInsertInsideOpenContextMenu(contextMenuProps: AbsolutePopupOptions) { context.onSelect(createInsideSelection(path)) - context.onContextMenu(props) + context.onContextMenu(contextMenuProps) } - function handleInsertAfterOpenContextMenu(props) { + function handleInsertAfterOpenContextMenu(contextMenuProps: AbsolutePopupOptions) { context.onSelect(createAfterSelection(path)) - context.onContextMenu(props) + context.onContextMenu(contextMenuProps) } @@ -660,7 +682,7 @@ {/if} - {#if !context.readOnly && isNodeSelected && selection && (isValueSelection(selection) || isMultiSelection(selection)) && !selection.edit && isEqual(getFocusPath(selection), path)} + {#if !context.readOnly && isNodeSelected && selection && (isValueSelection(selection) || isMultiSelection(selection)) && !isEditingSelection(selection) && isEqual(getFocusPath(selection), path)}
@@ -781,7 +803,7 @@ {/if} - {#if !context.readOnly && isNodeSelected && selection && (isValueSelection(selection) || isMultiSelection(selection)) && !selection.edit && isEqual(getFocusPath(selection), path)} + {#if !context.readOnly && isNodeSelected && selection && (isValueSelection(selection) || isMultiSelection(selection)) && !isEditingSelection(selection) && isEqual(getFocusPath(selection), path)}
@@ -873,7 +895,7 @@ element === refJsonEditor) + function handleWindowMouseDown(event: MouseEvent & { currentTarget: EventTarget & Window }) { + const outsideEditor = !isChildOf( + event.currentTarget as Element, + (element) => element === refJsonEditor + ) if (outsideEditor) { if (isEditingSelection(documentState.selection)) { debug('click outside the editor, stop edit mode') diff --git a/src/lib/components/modes/treemode/ValidationErrorIcon.svelte b/src/lib/components/modes/treemode/ValidationErrorIcon.svelte index b5ea1d20..7960de6f 100644 --- a/src/lib/components/modes/treemode/ValidationErrorIcon.svelte +++ b/src/lib/components/modes/treemode/ValidationErrorIcon.svelte @@ -3,12 +3,12 @@ import Icon from 'svelte-awesome' import { getContext } from 'svelte' import { tooltip } from '../../controls/tooltip/tooltip.js' - import type { AbsolutePopupContext, ValidationError } from '$lib/types.js' + import type { AbsolutePopupContext, NestedValidationError } from '$lib/types.js' const absolutePopupContext = getContext('absolute-popup') - export let validationError: ValidationError - export let onExpand: (event: Event) => void + export let validationError: NestedValidationError + export let onExpand: (event: MouseEvent) => void $: text = validationError.isChildError ? 'Contains invalid data' : validationError.message diff --git a/src/lib/components/modes/treemode/menu/SearchBox.svelte b/src/lib/components/modes/treemode/menu/SearchBox.svelte index 8299cacb..e6ad303d 100644 --- a/src/lib/components/modes/treemode/menu/SearchBox.svelte +++ b/src/lib/components/modes/treemode/menu/SearchBox.svelte @@ -53,7 +53,7 @@ showReplace = !showReplace && !readOnly } - function handleSubmit(event) { + function handleSubmit(event: SubmitEvent & { currentTarget: EventTarget & HTMLFormElement }) { event.preventDefault() const pendingChanges = text !== previousText @@ -66,7 +66,7 @@ } } - function handleKeyDown(event) { + function handleKeyDown(event: KeyboardEvent) { // key events must not be handled by the generic keydown handler of the // whole JSONEditor. event.stopPropagation() @@ -121,7 +121,7 @@ onReplaceAll(text, replaceText) } - function initSearchInput(element) { + function initSearchInput(element: HTMLInputElement) { element.select() } diff --git a/src/lib/utils/cssUtils.ts b/src/lib/utils/cssUtils.ts index 45167b18..7cde8221 100644 --- a/src/lib/utils/cssUtils.ts +++ b/src/lib/utils/cssUtils.ts @@ -6,7 +6,7 @@ * classnames('primary-button', { selected: true }, 'left') * */ -export function classnames(...args: Array>): string { +export function classnames(...args: Array | undefined>): string { const classes = [] for (const arg of args) { diff --git a/src/lib/utils/domUtils.ts b/src/lib/utils/domUtils.ts index 4046f13e..9f4543b0 100644 --- a/src/lib/utils/domUtils.ts +++ b/src/lib/utils/domUtils.ts @@ -273,11 +273,7 @@ export function findParentWithNodeName(element: Element, nodeName: string): Elem return findParent(element, (e) => e.nodeName === nodeName) } -/** - * @param {HTMLElement} target - * @returns {string | null} - */ -export function getSelectionTypeFromTarget(target: HTMLElement): SelectionType { +export function getSelectionTypeFromTarget(target: Element): SelectionType { if (isChildOfAttribute(target, 'data-type', 'selectable-key')) { return SelectionType.key } @@ -314,7 +310,7 @@ export function decodeDataPath(pathStr: string): JSONPath { /** * Find the data path of the given element. Traverses the parent nodes until find */ -export function getDataPathFromTarget(target: HTMLElement): JSONPath | null { +export function getDataPathFromTarget(target: Element): JSONPath | null { const parent = findParent(target, (element) => { return element?.hasAttribute ? element.hasAttribute('data-path') : false }) diff --git a/tsconfig.json b/tsconfig.json index 8688eea5..95bb2f55 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -1,7 +1,7 @@ { "extends": "./.svelte-kit/tsconfig.json", "compilerOptions": { - "moduleResolution": "node", + "moduleResolution": "bundler", "module": "es2020", "lib": ["es2020", "dom"], "target": "es2020",