@douglasneuroinformatics/libui 5.0.2 → 6.1.0

package/src/components/TextArea/TextArea.spec.tsx

@@ -2,7 +2,7 @@ import { render, screen } from '@testing-library/react';
 import { userEvent } from '@testing-library/user-event';
 import { describe, expect, it } from 'vitest';
 
-import { TextArea } from './TextArea';
+import { TextArea } from './TextArea.tsx';
 
 const TEST_ID = 'text-area';
 

package/src/components/TextArea/TextArea.stories.tsx

@@ -1,6 +1,6 @@
 import type { Meta, StoryObj } from '@storybook/react-vite';
 
-import { TextArea } from './TextArea';
+import { TextArea } from './TextArea.tsx';
 
 type Story = StoryObj<typeof TextArea>;
 

package/src/components/TextArea/TextArea.tsx

@@ -1,6 +1,6 @@
 import * as React from 'react';
 
-import { cn } from '@/utils';
+import { cn } from '#utils';
 
 export type TextAreaProps = React.TextareaHTMLAttributes<HTMLTextAreaElement>;
 

package/src/components/ThemeToggle/ThemeToggle.stories.tsx

@@ -1,6 +1,6 @@
 import type { Meta, StoryObj } from '@storybook/react-vite';
 
-import { ThemeToggle } from './ThemeToggle';
+import { ThemeToggle } from './ThemeToggle.tsx';
 
 type Story = StoryObj<typeof ThemeToggle>;
 

package/src/components/ThemeToggle/ThemeToggle.tsx

@@ -1,10 +1,10 @@
 import { MoonIcon, SunIcon } from 'lucide-react';
 
-import { useTheme } from '@/hooks/useTheme';
+import { useTheme } from '#hooks';
 
-import { Button } from '../Button';
+import { Button } from '../Button/Button.tsx';
 
-import type { ButtonProps } from '../Button';
+import type { ButtonProps } from '../Button/Button.tsx';
 
 export type ThemeToggleProps = Omit<ButtonProps, 'children' | 'size'>;
 
@@ -25,8 +25,8 @@ export const ThemeToggle = ({ onClick, variant = 'outline', ...props }: ThemeTog
       }}
       {...props}
     >
-      <SunIcon className="rotate-0 scale-100 transition-all dark:-rotate-90 dark:scale-0" />
-      <MoonIcon className="absolute rotate-90 scale-0 transition-all dark:rotate-0 dark:scale-100" />
+      <SunIcon className="scale-100 rotate-0 transition-all dark:scale-0 dark:-rotate-90" />
+      <MoonIcon className="absolute scale-0 rotate-90 transition-all dark:scale-100 dark:rotate-0" />
     </Button>
   );
 };

package/src/components/Tooltip/Tooltip.stories.tsx

@@ -3,7 +3,7 @@ import { Fragment } from 'react';
 import type { Meta, StoryObj } from '@storybook/react-vite';
 import { DownloadIcon } from 'lucide-react';
 
-import { Tooltip } from './Tooltip';
+import { Tooltip } from './Tooltip.tsx';
 
 type Story = StoryObj<typeof Tooltip>;
 

package/src/components/Tooltip/Tooltip.tsx

@@ -1,6 +1,6 @@
-import { TooltipContent } from './TooltipContent';
-import { TooltipRoot } from './TooltipRoot';
-import { TooltipTrigger } from './TooltipTrigger';
+import { TooltipContent } from './TooltipContent.tsx';
+import { TooltipRoot } from './TooltipRoot.tsx';
+import { TooltipTrigger } from './TooltipTrigger.tsx';
 
 export const Tooltip = Object.assign(TooltipRoot, {
   Content: TooltipContent,

package/src/components/Tooltip/TooltipContent.tsx

@@ -2,7 +2,7 @@ import * as React from 'react';
 
 import { Content } from '@radix-ui/react-tooltip';
 
-import { cn } from '@/utils';
+import { cn } from '#utils';
 
 export type TooltipContentProps = {
   /** The preferred alignment against the trigger, which may change when collisions occur. */
@@ -24,7 +24,7 @@ export const TooltipContent = React.forwardRef<React.ElementRef<typeof Content>,
     return (
       <Content
         className={cn(
-          'z-50 overflow-hidden rounded-md bg-primary px-3 py-1.5 text-xs text-primary-foreground animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2',
+          'bg-primary text-primary-foreground animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 overflow-hidden rounded-md px-3 py-1.5 text-xs',
           className
         )}
         collisionPadding={collisionPadding}

package/src/components/Tooltip/TooltipTrigger.tsx

@@ -2,9 +2,9 @@ import { forwardRef } from 'react';
 
 import { Trigger } from '@radix-ui/react-tooltip';
 
-import { Button } from '../Button';
+import { Button } from '../Button/Button.tsx';
 
-import type { ButtonProps } from '../Button';
+import type { ButtonProps } from '../Button/Button.tsx';
 
 export type TooltipTriggerProps = Omit<ButtonProps, 'asChild'>;
 

package/src/components/index.ts

@@ -1,56 +1,36 @@
-export * from './Accordion';
-export * from './ActionDropdown';
-export * from './AlertDialog';
-export * from './ArrowToggle';
-export * from './Avatar';
-export * from './Badge';
-export * from './Breadcrumb';
-export * from './Button';
-export * from './Card';
-export * from './Chart';
-export * from './Checkbox';
-export * from './ClientTable';
-export * from './Collapsible';
-export * from './Command';
-export * from './ContextMenu';
-export * from './CopyButton';
-export * from './DataTable';
-export * from './DatePicker';
-export * from './Dialog';
-export * from './Drawer';
-export * from './DropdownButton';
-export * from './DropdownMenu';
-export * from './ErrorBoundary';
-export * from './ErrorFallback';
-export * from './FileDropzone';
-export * from './Form';
-export * from './Heading';
-export * from './HoverCard';
-export * from './Input';
-export * from './Label';
-export * from './LanguageToggle';
-export * from './LineGraph';
-export * from './ListboxDropdown';
-export * from './MenuBar';
-export * from './OneTimePasswordInput';
-export * from './Popover';
-export * from './Progress';
-export * from './RadioGroup';
-export * from './Resizable';
-export * from './ScrollArea';
-export * from './SearchBar';
-export * from './Select';
-export * from './Separator';
-export * from './Sheet';
-export * from './Slider';
-export * from './Spinner';
-export * from './SpinnerIcon';
-export * from './StatisticCard';
-export * from './Switch';
-export * from './Table';
-export * from './Tabs';
-export * from './TextArea';
-export * from './ThemeToggle';
-export * from './Tooltip';
-
-export { /** @deprecated */ NotificationHub } from '@/providers/CoreProvider/NotificationHub';
+export * from './ActionDropdown/ActionDropdown.tsx';
+export * from './ArrowToggle/ArrowToggle.tsx';
+export * from './Badge/Badge.tsx';
+export * from './Button/Button.tsx';
+export * from './Card/Card.tsx';
+export * from './Checkbox/Checkbox.tsx';
+export * from './ClientTable/ClientTable.tsx';
+export * from './CopyButton/CopyButton.tsx';
+export * from './DataTable/DataTable.tsx';
+export * from './DatePicker/DatePicker.tsx';
+export * from './Dialog/Dialog.tsx';
+export * from './DropdownButton/DropdownButton.tsx';
+export * from './DropdownMenu/DropdownMenu.tsx';
+export * from './FileDropzone/FileDropzone.tsx';
+export * from './Form/Form.tsx';
+export * from './Heading/Heading.tsx';
+export * from './HoverCard/HoverCard.tsx';
+export * from './Input/Input.tsx';
+export * from './Label/Label.tsx';
+export * from './LanguageToggle/LanguageToggle.tsx';
+export * from './ListboxDropdown/ListboxDropdown.tsx';
+export * from './OneTimePasswordInput/OneTimePasswordInput.tsx';
+export * from './Popover/Popover.tsx';
+export * from './RadioGroup/RadioGroup.tsx';
+export * from './SearchBar/SearchBar.tsx';
+export * from './Select/Select.tsx';
+export * from './Separator/Separator.tsx';
+export * from './Sheet/Sheet.tsx';
+export * from './Slider/Slider.tsx';
+export * from './Spinner/Spinner.tsx';
+export * from './StatisticCard/StatisticCard.tsx';
+export * from './Table/Table.tsx';
+export * from './Tabs/Tabs.tsx';
+export * from './TextArea/TextArea.tsx';
+export * from './ThemeToggle/ThemeToggle.tsx';
+export * from './Tooltip/Tooltip.tsx';

package/src/hooks/index.ts

@@ -1,14 +1,13 @@
-export * from './useChart';
-export * from './useDestructiveAction';
-export * from './useDownload';
-export * from './useEventCallback';
-export * from './useEventListener';
-export * from './useInterval';
-export * from './useIsomorphicLayoutEffect';
-export * from './useMediaQuery';
-export * from './useNotificationsStore';
-export * from './useOnClickOutside';
-export * from './useStorage';
-export * from './useTheme';
-export * from './useTranslation';
-export * from './useWindowSize';
+export * from './useDestructiveAction/useDestructiveAction.ts';
+export * from './useDownload/useDownload.ts';
+export * from './useEventCallback/useEventCallback.ts';
+export * from './useEventListener/useEventListener.ts';
+export * from './useInterval/useInterval.ts';
+export * from './useIsomorphicLayoutEffect/useIsomorphicLayoutEffect.ts';
+export * from './useMediaQuery/useMediaQuery.ts';
+export * from './useNotificationsStore/useNotificationsStore.ts';
+export * from './useOnClickOutside/useOnClickOutside.ts';
+export * from './useStorage/useStorage.ts';
+export * from './useTheme/useTheme.ts';
+export * from './useTranslation/useTranslation.ts';
+export * from './useWindowSize/useWindowSize.ts';

package/src/hooks/useDestructiveAction/useDestructiveAction.test.ts

@@ -1,10 +1,14 @@
 import { act, renderHook } from '@testing-library/react';
 import { beforeEach, describe, expect, it, vi } from 'vitest';
 
-import { useDestructiveAction } from './useDestructiveAction';
-import { useDestructiveActionStore } from './useDestructiveActionStore';
-
-import type { DestructiveAction, DestructiveActionOptions, DestructiveActionParams } from './useDestructiveActionStore';
+import { useDestructiveAction } from './useDestructiveAction.ts';
+import { useDestructiveActionStore } from './useDestructiveActionStore.ts';
+
+import type {
+  DestructiveAction,
+  DestructiveActionOptions,
+  DestructiveActionParams
+} from './useDestructiveActionStore.ts';
 
 vi.mock('./useDestructiveActionStore', () => ({
   useDestructiveActionStore: vi.fn()

package/src/hooks/useDestructiveAction/useDestructiveAction.ts

@@ -1,8 +1,12 @@
 import { useCallback } from 'react';
 
-import { useDestructiveActionStore } from './useDestructiveActionStore';
+import { useDestructiveActionStore } from './useDestructiveActionStore.ts';
 
-import type { DestructiveAction, DestructiveActionOptions, DestructiveActionParams } from './useDestructiveActionStore';
+import type {
+  DestructiveAction,
+  DestructiveActionOptions,
+  DestructiveActionParams
+} from './useDestructiveActionStore.ts';
 
 /**
  * Returns a function that accepts a destructive action and optional configuration.

package/src/hooks/useDestructiveAction/useDestructiveActionStore.test.ts

@@ -1,9 +1,9 @@
 import { act, renderHook } from '@testing-library/react';
 import { afterEach, describe, expect, it, vi } from 'vitest';
 
-import { useDestructiveActionStore } from './useDestructiveActionStore';
+import { useDestructiveActionStore } from './useDestructiveActionStore.ts';
 
-import type { DestructiveAction, DestructiveActionOptions } from './useDestructiveActionStore';
+import type { DestructiveAction, DestructiveActionOptions } from './useDestructiveActionStore.ts';
 
 describe('useDestructiveActionStore', () => {
   afterEach(() => {

package/src/hooks/useDownload/useDownload.test.ts

@@ -1,13 +1,13 @@
 import { act, renderHook } from '@testing-library/react';
 import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
 
-import { useDownload } from './useDownload';
+import { useDownload } from './useDownload.ts';
 
 const mockNotificationsStore = {
   addNotification: vi.fn()
 };
 
-vi.mock('../useNotificationsStore', () => ({
+vi.mock('../useNotificationsStore/useNotificationsStore.ts', () => ({
   useNotificationsStore: () => mockNotificationsStore
 }));
 

package/src/hooks/useDownload/useDownload.ts

@@ -2,7 +2,7 @@ import { useEffect, useState } from 'react';
 
 import type { Promisable } from 'type-fest';
 
-import { useNotificationsStore } from '../useNotificationsStore';
+import { useNotificationsStore } from '../useNotificationsStore/useNotificationsStore.ts';
 
 type DownloadTextOptions = {
   blobType: 'text/csv' | 'text/plain';

package/src/hooks/useEventCallback/useEventCallback.test.tsx

@@ -1,7 +1,7 @@
 import { fireEvent, render, renderHook, screen } from '@testing-library/react';
 import { describe, expect, it, vi } from 'vitest';
 
-import { useEventCallback } from './useEventCallback';
+import { useEventCallback } from './useEventCallback.ts';
 
 describe('useEventCallback', () => {
   it('should not call the callback during render', () => {

package/src/hooks/useEventCallback/useEventCallback.ts

@@ -1,6 +1,6 @@
 import { useCallback, useRef } from 'react';
 
-import { useIsomorphicLayoutEffect } from '../useIsomorphicLayoutEffect';
+import { useIsomorphicLayoutEffect } from '../useIsomorphicLayoutEffect/useIsomorphicLayoutEffect.ts';
 
 export function useEventCallback<Args extends unknown[], R>(fn: (...args: Args) => R) {
   const ref = useRef<typeof fn>(() => {

package/src/hooks/useEventListener/useEventListener.test.tsx

@@ -1,7 +1,7 @@
 import { fireEvent, renderHook } from '@testing-library/react';
 import { afterEach, describe, expect, it, vi } from 'vitest';
 
-import { useEventListener } from './useEventListener';
+import { useEventListener } from './useEventListener.ts';
 
 describe('useEventListener', () => {
   afterEach(() => {

package/src/hooks/useEventListener/useEventListener.ts

@@ -1,7 +1,7 @@
 import { useEffect, useRef } from 'react';
 import type { RefObject } from 'react';
 
-import { useIsomorphicLayoutEffect } from '../useIsomorphicLayoutEffect';
+import { useIsomorphicLayoutEffect } from '../useIsomorphicLayoutEffect/useIsomorphicLayoutEffect.ts';
 
 // MediaQueryList Event based useEventListener interface
 function useEventListener<K extends keyof MediaQueryListEventMap>(

package/src/hooks/useInterval/useInterval.test.ts

@@ -1,7 +1,7 @@
 import { renderHook } from '@testing-library/react';
 import { beforeEach, describe, expect, it, vi } from 'vitest';
 
-import { useInterval } from './useInterval';
+import { useInterval } from './useInterval.ts';
 
 describe('useInterval()', () => {
   beforeEach(() => {

package/src/hooks/useInterval/useInterval.ts

@@ -1,6 +1,6 @@
 import { useEffect, useRef } from 'react';
 
-import { useIsomorphicLayoutEffect } from '../useIsomorphicLayoutEffect';
+import { useIsomorphicLayoutEffect } from '../useIsomorphicLayoutEffect/useIsomorphicLayoutEffect.ts';
 
 export function useInterval(callback: () => void, delay: null | number) {
   const savedCallback = useRef(callback);

package/src/hooks/useIsomorphicLayoutEffect/useIsomorphicLayoutEffect.test.ts

@@ -4,7 +4,7 @@ import { beforeEach, describe, expect, it, vi } from 'vitest';
 
 const isBrowser = vi.fn();
 
-vi.mock('@/utils', () => ({ isBrowser }));
+vi.mock('#utils', () => ({ isBrowser }));
 
 describe('useIsomorphicLayoutEffect', () => {
   beforeEach(() => {

package/src/hooks/useIsomorphicLayoutEffect/useIsomorphicLayoutEffect.ts

@@ -1,5 +1,5 @@
 import { useEffect, useLayoutEffect } from 'react';
 
-import { isBrowser } from '@/utils';
+import { isBrowser } from '#utils';
 
 export const useIsomorphicLayoutEffect = isBrowser() ? useLayoutEffect : useEffect;

package/src/hooks/useMediaQuery/useMediaQuery.test.ts

@@ -1,12 +1,12 @@
 import { renderHook } from '@testing-library/react';
 import { afterEach, describe, expect, it, vi } from 'vitest';
 
-import { mockMatchMedia } from '@/testing/mocks';
-import { isBrowser } from '@/utils';
+import { mockMatchMedia } from '#testing:mocks';
+import { isBrowser } from '#utils';
 
-import { useMediaQuery } from './useMediaQuery';
+import { useMediaQuery } from './useMediaQuery.ts';
 
-vi.mock('@/utils', () => ({ isBrowser: vi.fn(() => true) }));
+vi.mock('#utils', () => ({ isBrowser: vi.fn(() => true) }));
 
 describe('useMediaQuery', () => {
   afterEach(() => {

package/src/hooks/useMediaQuery/useMediaQuery.ts

@@ -1,6 +1,6 @@
 import { useEffect, useState } from 'react';
 
-import { isBrowser } from '@/utils';
+import { isBrowser } from '#utils';
 
 /**
  * Get the result of an arbitrary CSS media query

package/src/hooks/useNotificationsStore/useNotificationsStore.test.ts

@@ -1,7 +1,7 @@
 import { act, renderHook } from '@testing-library/react';
 import { describe, expect, it } from 'vitest';
 
-import { useNotificationsStore } from './useNotificationsStore';
+import { useNotificationsStore } from './useNotificationsStore.ts';
 
 describe('useNotificationsStore', () => {
   it('should render and return an object', () => {

package/src/hooks/useOnClickOutside/useOnClickOutside.test.ts

@@ -1,7 +1,7 @@
 import { act, fireEvent, renderHook } from '@testing-library/react';
 import { describe, expect, it, vi } from 'vitest';
 
-import { useOnClickOutside } from './useOnClickOutside';
+import { useOnClickOutside } from './useOnClickOutside.ts';
 
 describe('useOnClickOutside', () => {
   it('should call the handler when a clicking outside the element', () => {

package/src/hooks/useOnClickOutside/useOnClickOutside.ts

@@ -1,6 +1,6 @@
 import type { RefObject } from 'react';
 
-import { useEventListener } from '../useEventListener';
+import { useEventListener } from '../useEventListener/useEventListener.ts';
 
 type Handler = (event: MouseEvent) => void;
 

package/src/hooks/useStorage/useLocalStorage.test.ts

@@ -1,13 +1,13 @@
 import { renderHook } from '@testing-library/react';
 import { describe, it, vi } from 'vitest';
 
-import { mockStorage } from '@/testing/mocks';
+import { mockStorage } from '#testing:mocks';
 
-import { useLocalStorage } from './useLocalStorage';
+import { useLocalStorage } from './useLocalStorage.ts';
 
 mockStorage('localStorage');
 
-vi.mock('@/utils', () => ({ isBrowser: vi.fn(() => true) }));
+vi.mock('#utils', () => ({ isBrowser: vi.fn(() => true) }));
 
 describe('useLocalStorage()', () => {
   it('should render', () => {

package/src/hooks/useStorage/useLocalStorage.ts

@@ -1,8 +1,8 @@
 import type { Dispatch, SetStateAction } from 'react';
 
-import { useStorage } from './useStorage';
+import { useStorage } from './useStorage.ts';
 
-import type { UseStorageOptions } from './useStorage';
+import type { UseStorageOptions } from './useStorage.ts';
 
 /** Custom hook that uses local storage to persist state across page reloads */
 export function useLocalStorage<T>(

package/src/hooks/useStorage/useSessionStorage.test.ts

@@ -1,13 +1,13 @@
 import { renderHook } from '@testing-library/react';
 import { describe, it, vi } from 'vitest';
 
-import { mockStorage } from '@/testing/mocks';
+import { mockStorage } from '#testing:mocks';
 
-import { useSessionStorage } from './useSessionStorage';
+import { useSessionStorage } from './useSessionStorage.ts';
 
 mockStorage('sessionStorage');
 
-vi.mock('@/utils', () => ({ isBrowser: vi.fn(() => true) }));
+vi.mock('#utils', () => ({ isBrowser: vi.fn(() => true) }));
 
 describe('useSessionStorage()', () => {
   it('should render', () => {

package/src/hooks/useStorage/useSessionStorage.ts

@@ -1,8 +1,8 @@
 import type { Dispatch, SetStateAction } from 'react';
 
-import { useStorage } from './useStorage';
+import { useStorage } from './useStorage.ts';
 
-import type { UseStorageOptions } from './useStorage';
+import type { UseStorageOptions } from './useStorage.ts';
 
 /** Custom hook that uses session storage to persist state across page reloads */
 export function useSessionStorage<T>(

package/src/hooks/useStorage/useStorage.test.ts

@@ -1,17 +1,17 @@
 import { act, renderHook } from '@testing-library/react';
 import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
 
-import { mockStorage } from '@/testing/mocks';
-import { isBrowser } from '@/utils';
+import { mockStorage } from '#testing:mocks';
+import { isBrowser } from '#utils';
 
-import { useStorage } from './useStorage';
+import { useStorage } from './useStorage.ts';
 
-import type { StorageName } from './useStorage';
+import type { StorageName } from './useStorage.ts';
 
 const storages: StorageName[] = ['localStorage', 'sessionStorage'];
 storages.forEach(mockStorage);
 
-vi.mock('@/utils', () => ({ isBrowser: vi.fn(() => true) }));
+vi.mock('#utils', () => ({ isBrowser: vi.fn(() => true) }));
 
 describe('useStorage()', () => {
   storages.forEach((storageName) => {

package/src/hooks/useStorage/useStorage.ts

@@ -1,10 +1,10 @@
 import { useCallback, useEffect, useState } from 'react';
 import type { Dispatch, SetStateAction } from 'react';
 
-import { isBrowser } from '@/utils';
+import { isBrowser } from '#utils';
 
-import { useEventCallback } from '../useEventCallback';
-import { useEventListener } from '../useEventListener';
+import { useEventCallback } from '../useEventCallback/useEventCallback.ts';
+import { useEventListener } from '../useEventListener/useEventListener.ts';
 
 type StorageName = 'localStorage' | 'sessionStorage';
 

package/src/hooks/useTheme/useTheme.test.ts

@@ -1,14 +1,14 @@
 import { act, renderHook, waitFor } from '@testing-library/react';
 import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
 
-import { mockMatchMedia, mockStorage } from '@/testing/mocks';
-import { isBrowser } from '@/utils';
+import { mockMatchMedia, mockStorage } from '#testing:mocks';
+import { isBrowser } from '#utils';
 
-import { DEFAULT_THEME, SYS_DARK_MEDIA_QUERY, THEME_ATTRIBUTE, THEME_KEY, useTheme } from './useTheme';
+import { DEFAULT_THEME, SYS_DARK_MEDIA_QUERY, THEME_ATTRIBUTE, THEME_KEY, useTheme } from './useTheme.ts';
 
 mockStorage('localStorage');
 
-vi.mock('@/utils', () => ({ isBrowser: vi.fn(() => true) }));
+vi.mock('#utils', () => ({ isBrowser: vi.fn(() => true) }));
 
 describe('useTheme', () => {
   beforeEach(() => {

package/src/hooks/useTheme/useTheme.ts

@@ -1,7 +1,7 @@
 import { useEffect, useState } from 'react';
 
 // this is required since our storybook manager plugin cannot use vite aliases
-import { isBrowser } from '../../utils';
+import { isBrowser } from '../../utils/index.ts';
 
 type Theme = 'dark' | 'light';
 

package/src/hooks/useTranslation/useTranslation.ts

@@ -6,10 +6,10 @@ import type {
   TranslationKeyForNamespace,
   TranslationNamespace,
   TranslatorType
-} from '@/i18n';
+} from '#i18n';
 
 // this is required since our storybook manager plugin cannot use vite aliases
-import { i18n } from '../../i18n';
+import { i18n } from '../../i18n/index.ts';
 
 export function useTranslation(): TranslatorType<TranslationKey>;
 export function useTranslation<TNamespace extends TranslationNamespace>(

package/src/hooks/useWindowSize/useWindowSize.test.ts

@@ -1,7 +1,7 @@
 import { act, renderHook } from '@testing-library/react';
 import { describe, expect, it } from 'vitest';
 
-import { useWindowSize } from './useWindowSize';
+import { useWindowSize } from './useWindowSize.ts';
 
 const setupHook = () => renderHook(() => useWindowSize());
 

package/src/hooks/useWindowSize/useWindowSize.ts

@@ -1,7 +1,7 @@
 import { useState } from 'react';
 
-import { useEventListener } from '../useEventListener';
-import { useIsomorphicLayoutEffect } from '../useIsomorphicLayoutEffect';
+import { useEventListener } from '../useEventListener/useEventListener.ts';
+import { useIsomorphicLayoutEffect } from '../useIsomorphicLayoutEffect/useIsomorphicLayoutEffect.ts';
 
 export type WindowSize = {
   height: number;

package/src/i18n/__tests__/translator.test.ts

@@ -1,6 +1,6 @@
 import { describe, expect, it, vi } from 'vitest';
 
-import { Translator } from '../translator';
+import { Translator } from '../translator.ts';
 
 describe('Translator', () => {
   const translator = new Translator();