Skip to content

Commit c28c4b4

Browse files
authored
Support NodeNext packages (#281)
* Switch `module` and `moduleResolution` to `NodeNext` in `tsconfig.json` * Add changeset * Fix lint error * Fix more `NodeNext` errors * Fix build
1 parent e5943cf commit c28c4b4

File tree

140 files changed

+315
-300
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

140 files changed

+315
-300
lines changed

.changeset/cold-pianos-rest.md

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
"svelte-ux": minor
3+
---
4+
5+
Support `NodeNext` packages

packages/svelte-ux/src/docs/Blockquote.svelte

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
<script lang="ts">
22
import { mdiInformation } from '@mdi/js';
33
import Icon from '../lib/components/Icon.svelte';
4-
import { cls } from '$lib/utils/styles';
4+
import { cls } from '$lib/utils/styles.js';
55
</script>
66

77
<div

packages/svelte-ux/src/lib/actions/scroll.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import type { Action, ActionReturn } from 'svelte/action';
2-
import { isVisibleInScrollParent, scrollIntoView as scrollIntoViewUtil } from '$lib/utils/dom';
3-
import type { EventWithTarget } from '$lib/types';
2+
import { isVisibleInScrollParent, scrollIntoView as scrollIntoViewUtil } from '$lib/utils/dom.js';
3+
import type { EventWithTarget } from '$lib/types/index.js';
44

55
export type ScrollIntoViewOptions = {
66
condition: boolean | ((node: HTMLElement) => boolean);

packages/svelte-ux/src/lib/components/AppBar.svelte

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -4,9 +4,9 @@
44
import { showDrawer } from './AppLayout.svelte';
55
import Breadcrumb from './Breadcrumb.svelte';
66
import Button from './Button.svelte';
7-
import { browser } from '../utils/env';
8-
import { cls } from '../utils/styles';
9-
import { getComponentClasses } from './theme';
7+
import { browser } from '../utils/env.js';
8+
import { cls } from '../utils/styles.js';
9+
import { getComponentClasses } from './theme.js';
1010
1111
export let title: string | number | Array<string | number> = '';
1212
export let menuIcon: string | null = mdiMenu;

packages/svelte-ux/src/lib/components/AppLayout.svelte

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,15 @@
11
<script context="module">
22
import { writable } from 'svelte/store';
3-
import { browser } from '../utils/env';
3+
import { browser } from '../utils/env.js';
44
export const showDrawer = writable(browser ? window.innerWidth >= breakpoints.md : true);
55
</script>
66

77
<script lang="ts">
88
import Backdrop from './Backdrop.svelte';
99
10-
import { breakpoints, mdScreen } from '../stores/matchMedia';
11-
import { cls } from '../utils/styles';
12-
import { getComponentClasses } from './theme';
10+
import { breakpoints, mdScreen } from '../stores/matchMedia.js';
11+
import { cls } from '../utils/styles.js';
12+
import { getComponentClasses } from './theme.js';
1313
1414
export let navWidth = 240;
1515
export let headerHeight = 64;

packages/svelte-ux/src/lib/components/Avatar.svelte

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
<script lang="ts">
2-
import { cls } from '../utils/styles';
2+
import { cls } from '../utils/styles.js';
33
import Icon from './Icon.svelte';
4-
import { getComponentClasses } from './theme';
4+
import { getComponentClasses } from './theme.js';
55
66
export let size: 'sm' | 'md' | 'lg' | 'unset' = 'md';
77
export let icon: string | undefined = undefined;

packages/svelte-ux/src/lib/components/Backdrop.svelte

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,8 +2,8 @@
22
import { fade, type FadeParams } from 'svelte/transition';
33
44
import { portal as portalAction, type PortalOptions } from '../actions/portal';
5-
import { cls } from '../utils/styles';
6-
import { getComponentClasses } from './theme';
5+
import { cls } from '../utils/styles.js';
6+
import { getComponentClasses } from './theme.js';
77
88
export let blur: boolean = false;
99
export let portal: PortalOptions = false;

packages/svelte-ux/src/lib/components/Badge.svelte

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
<script lang="ts">
2-
import { cls } from '../utils/styles';
3-
import { getComponentClasses } from './theme';
2+
import { cls } from '../utils/styles.js';
3+
import { getComponentClasses } from './theme.js';
44
55
export let value: number = $$slots.value ? 1 : 0;
66
export let small = false;

packages/svelte-ux/src/lib/components/Breadcrumb.svelte

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,8 +2,8 @@
22
import { mdiChevronRight } from '@mdi/js';
33
44
import Icon from './Icon.svelte';
5-
import { cls } from '../utils/styles';
6-
import { getComponentClasses } from './theme';
5+
import { cls } from '../utils/styles.js';
6+
import { getComponentClasses } from './theme.js';
77
88
export let items: (string | null | undefined)[] = [];
99
export let divider: string | undefined = undefined;

packages/svelte-ux/src/lib/components/Button.svelte

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -3,14 +3,14 @@
33
44
import Icon from './Icon.svelte';
55
import ProgressCircle from './ProgressCircle.svelte';
6-
import { cls } from '../utils/styles';
6+
import { cls } from '../utils/styles.js';
77
import { multi } from '../actions/multi';
88
import type { Actions } from '../actions/multi';
9-
import type { ButtonColor, ButtonSize } from '$lib/types';
9+
import type { ButtonColor, ButtonSize } from '$lib/types/index.js';
1010
import { getButtonGroup } from './ButtonGroup.svelte';
11-
import { asIconData, type IconInput } from '$lib/utils/icons';
12-
import type { ButtonRounded, ButtonVariant } from '$lib/types';
13-
import { getComponentSettings } from './settings';
11+
import { asIconData, type IconInput } from '$lib/utils/icons.js';
12+
import type { ButtonRounded, ButtonVariant } from '$lib/types/index.js';
13+
import { getComponentSettings } from './settings.js';
1414
1515
const { classes: settingsClasses, defaults } = getComponentSettings('Button');
1616

packages/svelte-ux/src/lib/components/ButtonGroup.svelte

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
<script lang="ts" context="module">
22
import { type ComponentProps, setContext, getContext } from 'svelte';
33
import type Button from './Button.svelte';
4-
import type { ButtonColor, ButtonSize } from '$lib/types';
5-
import type { ButtonRounded, ButtonVariant } from '$lib/types';
4+
import type { ButtonColor, ButtonSize } from '$lib/types/index.js';
5+
import type { ButtonRounded, ButtonVariant } from '$lib/types/index.js';
66
77
type ButtonGroupContext = {
88
variant: ButtonVariant | undefined;
@@ -23,8 +23,8 @@
2323
</script>
2424

2525
<script lang="ts">
26-
import { cls } from '../utils/styles';
27-
import { getComponentSettings } from './settings';
26+
import { cls } from '../utils/styles.js';
27+
import { getComponentSettings } from './settings.js';
2828
2929
const { classes: settingsClasses, defaults } = getComponentSettings('ButtonGroup');
3030

packages/svelte-ux/src/lib/components/Card.svelte

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,8 +4,8 @@
44
import ProgressCircle from './ProgressCircle.svelte';
55
import Header from './Header.svelte';
66
import Overlay from './Overlay.svelte';
7-
import { cls } from '../utils/styles';
8-
import { getComponentClasses } from './theme';
7+
import { cls } from '../utils/styles.js';
8+
import { getComponentClasses } from './theme.js';
99
1010
export let title: string | string[] | null = null;
1111
export let subheading: string | string[] | null = null;

packages/svelte-ux/src/lib/components/Checkbox.svelte

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,8 +3,8 @@
33
44
import Icon from './Icon.svelte';
55
import { uniqueId } from '../utils/string';
6-
import { cls } from '../utils/styles';
7-
import { getComponentClasses } from './theme';
6+
import { cls } from '../utils/styles.js';
7+
import { getComponentClasses } from './theme.js';
88
99
export let id = uniqueId('checkbox-');
1010
export let name = '';

packages/svelte-ux/src/lib/components/Code.svelte

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,8 +2,8 @@
22
import Prism from 'prismjs';
33
import 'prism-svelte';
44
5-
import { cls } from '$lib/utils/styles';
6-
import { getComponentClasses } from './theme';
5+
import { cls } from '$lib/utils/styles.js';
6+
import { getComponentClasses } from './theme.js';
77
import CopyButton from './CopyButton.svelte';
88
99
export let source: string | null = null;

packages/svelte-ux/src/lib/components/Collapse.svelte

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2,11 +2,11 @@
22
import { createEventDispatcher } from 'svelte';
33
import { slide } from 'svelte/transition';
44
import { mdiChevronDown } from '@mdi/js';
5-
import { cls } from '../utils/styles';
5+
import { cls } from '../utils/styles.js';
66
77
import Icon from './Icon.svelte';
8-
import type { TransitionParams } from '$lib/types';
9-
import { getComponentClasses } from './theme';
8+
import type { TransitionParams } from '$lib/types/index.js';
9+
import { getComponentClasses } from './theme.js';
1010
1111
/**
1212
* @slot {{ active: number }} trigger - Primary content to trigger the show/hide

packages/svelte-ux/src/lib/components/CopyButton.svelte

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
<script lang="ts">
22
import { mdiContentCopy } from '@mdi/js';
33
4-
import { cls } from '../utils/styles';
4+
import { cls } from '../utils/styles.js';
55
import Button from './Button.svelte';
6-
import { getComponentSettings } from './settings';
6+
import { getComponentSettings } from './settings.js';
77
import { slide } from 'svelte/transition';
88
let className: string | undefined = undefined;
99
export { className as class };

packages/svelte-ux/src/lib/components/DateButton.svelte

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5,8 +5,8 @@
55
import Button from './Button.svelte';
66
import { DateToken, getDateFuncsByPeriodType, PeriodType } from '../utils/date';
77
import type { SelectedDate } from '../utils/date';
8-
import { cls } from '../utils/styles';
9-
import { getComponentSettings, getSettings } from './settings';
8+
import { cls } from '../utils/styles.js';
9+
import { getComponentSettings, getSettings } from './settings.js';
1010
1111
const dispatch = createEventDispatcher();
1212

packages/svelte-ux/src/lib/components/DateField.svelte

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,8 +2,8 @@
22
import { createEventDispatcher, type ComponentProps } from 'svelte';
33
import { parse as parseDate } from 'date-fns';
44
import { PeriodType } from '../utils';
5-
import { getComponentSettings, getSettings } from './settings';
6-
import { cls } from '../utils/styles';
5+
import { getComponentSettings, getSettings } from './settings.js';
6+
import { cls } from '../utils/styles.js';
77
88
import Field from './Field.svelte';
99

packages/svelte-ux/src/lib/components/DatePickerField.svelte

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@
88
import Dialog from './Dialog.svelte';
99
import { DateToken, getDateFuncsByPeriodType, PeriodType } from '../utils/date';
1010
import DateSelect from './DateSelect.svelte';
11-
import { getComponentSettings, getSettings } from './settings';
11+
import { getComponentSettings, getSettings } from './settings.js';
1212
1313
const dispatch = createEventDispatcher();
1414
const { classes: settingsClasses, defaults } = getComponentSettings('DatePickerField');

packages/svelte-ux/src/lib/components/DateRange.svelte

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -11,16 +11,16 @@
1111
} from '../utils/date';
1212
import { getDateRangePresets } from '../utils/dateRange';
1313
import type { DateRange } from '../utils/dateRange';
14-
import { cls } from '../utils/styles';
14+
import { cls } from '../utils/styles.js';
1515
import { omit } from '../utils/object';
1616
1717
import DateSelect from './DateSelect.svelte';
1818
import MenuField from './MenuField.svelte';
1919
import ToggleGroup from './ToggleGroup.svelte';
2020
import ToggleOption from './ToggleOption.svelte';
21-
import { getComponentClasses } from './theme';
22-
import { mdScreen } from '$lib/stores/matchMedia';
23-
import { getSettings } from './settings';
21+
import { getComponentClasses } from './theme.js';
22+
import { mdScreen } from '$lib/stores/matchMedia.js';
23+
import { getSettings } from './settings.js';
2424
2525
export let selected: DateRange | null = { from: null, to: null, periodType: null };
2626
let className: string | undefined = undefined;

packages/svelte-ux/src/lib/components/DateRangeDisplay.svelte

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
<script lang="ts">
22
import { PeriodType, getDateFuncsByPeriodType, type FormatDateOptions } from '../utils/date';
33
import type { DateRange } from '../utils/dateRange';
4-
import { getSettings } from './settings';
4+
import { getSettings } from './settings.js';
55
66
export let value: DateRange | null | undefined;
77

packages/svelte-ux/src/lib/components/DateRangeField.svelte

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -10,8 +10,8 @@
1010
1111
import { PeriodType, getDateFuncsByPeriodType } from '../utils/date';
1212
import { getDateRangePresets, type DateRange as DateRangeType } from '../utils/dateRange';
13-
import { cls } from '../utils/styles';
14-
import { getComponentSettings, getSettings } from './settings';
13+
import { cls } from '../utils/styles.js';
14+
import { getComponentSettings, getSettings } from './settings.js';
1515
1616
const dispatch = createEventDispatcher();
1717
const { format, localeSettings } = getSettings();

packages/svelte-ux/src/lib/components/Dialog.svelte

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -7,12 +7,12 @@
77
88
import { focusMove } from '../actions/focus';
99
import { portal as portalAction, type PortalOptions } from '../actions/portal';
10-
import { cls } from '../utils/styles';
10+
import { cls } from '../utils/styles.js';
1111
1212
import Backdrop from './Backdrop.svelte';
1313
import ProgressCircle from './ProgressCircle.svelte';
1414
import Overlay from './Overlay.svelte';
15-
import { getComponentClasses } from './theme';
15+
import { getComponentClasses } from './theme.js';
1616
1717
const dispatch = createEventDispatcher();
1818

packages/svelte-ux/src/lib/components/DividerDot.svelte

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
<script lang="ts">
2-
import { cls } from '../utils/styles';
3-
import { getComponentClasses } from './theme';
2+
import { cls } from '../utils/styles.js';
3+
import { getComponentClasses } from './theme.js';
44
55
const settingsClasses = getComponentClasses('DividerDot');
66
</script>

packages/svelte-ux/src/lib/components/Drawer.svelte

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -8,8 +8,8 @@
88
99
import { focusMove } from '../actions/focus';
1010
import { portal as portalAction, type PortalOptions } from '../actions/portal';
11-
import { cls } from '../utils/styles';
12-
import { getComponentClasses } from './theme';
11+
import { cls } from '../utils/styles.js';
12+
import { getComponentClasses } from './theme.js';
1313
1414
const dispatch = createEventDispatcher();
1515

packages/svelte-ux/src/lib/components/Duration.svelte

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
<script lang="ts">
22
import { DurationUnits, getDuration, humanizeDuration, type Duration } from '../utils/duration';
33
import timerStore from '../stores/timerStore';
4-
import { getComponentClasses } from './theme';
5-
import { cls } from '$lib/utils/styles';
4+
import { getComponentClasses } from './theme.js';
5+
import { cls } from '$lib/utils/styles.js';
66
77
export let start: Date | undefined = undefined;
88
export let end: Date | undefined = undefined;

packages/svelte-ux/src/lib/components/EmptyMessage.svelte

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
<script lang="ts">
2-
import { cls } from '../utils/styles';
3-
import { getComponentClasses } from './theme';
2+
import { cls } from '../utils/styles.js';
3+
import { getComponentClasses } from './theme.js';
44
55
const settingsClasses = getComponentClasses('EmptyMessage');
66
</script>

packages/svelte-ux/src/lib/components/ExpansionPanel.svelte

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
<script lang="ts">
22
import Collapse from './Collapse.svelte';
3-
import { cls } from '../utils/styles';
4-
import { getComponentClasses } from './theme';
3+
import { cls } from '../utils/styles.js';
4+
import { getComponentClasses } from './theme.js';
55
66
/**
77
* Controls how first, last, and gap between are calculated

packages/svelte-ux/src/lib/components/Field.svelte

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,9 +3,9 @@
33
import { mdiClose, mdiInformationOutline } from '@mdi/js';
44
import { uniqueId } from 'lodash-es';
55
6-
import { cls } from '../utils/styles';
6+
import { cls } from '../utils/styles.js';
77
import { type LabelPlacement, DEFAULT_LABEL_PLACEMENT } from '../types';
8-
import { getComponentSettings } from './settings';
8+
import { getComponentSettings } from './settings.js';
99
1010
import Button from './Button.svelte';
1111
import Icon from './Icon.svelte';

packages/svelte-ux/src/lib/components/Form.svelte

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,8 +3,8 @@
33
import type { Schema } from 'zod';
44
55
import formStore from '../stores/formStore';
6-
import { getComponentClasses } from './theme';
7-
import { cls } from '$lib/utils/styles';
6+
import { getComponentClasses } from './theme.js';
7+
import { cls } from '$lib/utils/styles.js';
88
99
const dispatch = createEventDispatcher();
1010

packages/svelte-ux/src/lib/components/Gooey.svelte

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
<script lang="ts">
22
import type { SVGAttributes } from 'svelte/elements';
33
4-
import { uniqueId } from '$lib/utils/string';
5-
import { cls } from '$lib/utils/styles';
6-
import { getComponentClasses } from './theme';
4+
import { uniqueId } from '$lib/utils/string.js';
5+
import { cls } from '$lib/utils/styles.js';
6+
import { getComponentClasses } from './theme.js';
77
88
/** Apply gaussian blur. Required unless blurring externally (`filter: blur()`, etc) */
99
export let blur: number | undefined = undefined;

packages/svelte-ux/src/lib/components/Header.svelte

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
<script lang="ts">
2-
import { cls } from '$lib/utils/styles';
2+
import { cls } from '$lib/utils/styles.js';
33
import Breadcrumb from './Breadcrumb.svelte';
4-
import { getComponentClasses } from './theme';
4+
import { getComponentClasses } from './theme.js';
55
66
export let title: string | string[] | null = null;
77
export let subheading: string | string[] | null = null;

packages/svelte-ux/src/lib/components/Icon.svelte

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -6,8 +6,8 @@
66
import type { IconDefinition } from '@fortawesome/fontawesome-common-types';
77
88
import { uniqueId } from '../utils/string';
9-
import { cls } from '../utils/styles';
10-
import { getComponentClasses } from './theme';
9+
import { cls } from '../utils/styles.js';
10+
import { getComponentClasses } from './theme.js';
1111
1212
export let size: string | number = '1.5em';
1313
export let width = size;

0 commit comments

Comments
 (0)