[WINDOW]: switch package to native esm. (#166)

.changeset/yellow-pears-rule.md

@@ -0,0 +1,5 @@
+---
+"@resembli/react-virtualized-window": minor
+---
+
+Make react-virtualized-window an esm module

packages/react-virtualized-window/package.json

@@ -6,6 +6,7 @@
   "version": "0.7.1",
   "types": "src/index.ts",
   "main": "src/index.ts",
+  "type": "module",
   "publishConfig": {
     "main": "dist/index.js",
     "types": "dist/types/index.d.ts"

packages/react-virtualized-window/src/PinnedColumn.tsx

@@ -1,7 +1,7 @@
 import * as React from "react"
 
-import { RenderItem } from "./RenderItem"
-import type { GridProps } from "./types"
+import { RenderItem } from "./RenderItem.js"
+import type { GridProps } from "./types.js"
 
 interface PinnedColumnsProps<T> {
   totalWidth: number

packages/react-virtualized-window/src/RenderItem.tsx

@@ -1,6 +1,6 @@
 import * as React from "react"
 
-import type { CellMeta, GridProps } from "./types"
+import type { CellMeta, GridProps } from "./types.js"
 
 type RenderItemsProps<T> = {
   Component: GridProps<T>["children"]

packages/react-virtualized-window/src/components/Grid.tsx

@@ -1,19 +1,19 @@
 import * as React from "react"
 
-import { PinnedColumn } from "../PinnedColumn"
-import { ScrollDiv } from "../ScrollDiv"
-import { SizingDiv } from "../SizingDiv"
-import { StickyDiv } from "../StickyDiv"
-import { getScrollbarWidth } from "../getScrollbarWidth"
-import type { GridProps } from "../types"
-import { useDataDimension } from "../useDataDimension"
-import { useIndicesForDimensions } from "../useDimensionIndices"
-import { useScrollAdjustWindowDims } from "../useScrollAdjustedDim"
-import { useScrollItems } from "../useScrollItems"
-import { useSmartSticky } from "../useSmartSticky"
-import { useWindowApi } from "../useWindowApi"
-import { useWindowDimensions } from "../useWindowDimensions"
-import { useWindowScroll } from "../useWindowScroll"
+import { PinnedColumn } from "../PinnedColumn.js"
+import { ScrollDiv } from "../ScrollDiv.js"
+import { SizingDiv } from "../SizingDiv.js"
+import { StickyDiv } from "../StickyDiv.js"
+import { getScrollbarWidth } from "../getScrollbarWidth.js"
+import type { GridProps } from "../types.js"
+import { useDataDimension } from "../useDataDimension.js"
+import { useIndicesForDimensions } from "../useDimensionIndices.js"
+import { useScrollAdjustWindowDims } from "../useScrollAdjustedDim.js"
+import { useScrollItems } from "../useScrollItems.js"
+import { useSmartSticky } from "../useSmartSticky.js"
+import { useWindowApi } from "../useWindowApi.js"
+import { useWindowDimensions } from "../useWindowDimensions.js"
+import { useWindowScroll } from "../useWindowScroll.js"
 
 export function Grid<T, L = unknown, R = unknown>({
   data,

packages/react-virtualized-window/src/components/List.tsx

@@ -1,7 +1,7 @@
 import * as React from "react"
 
-import type { CellMeta, NumberOrPercent, VirtualWindowBaseProps } from "../types"
-import { Grid } from "./Grid"
+import type { CellMeta, NumberOrPercent, VirtualWindowBaseProps } from "../types.js"
+import { Grid } from "./Grid.js"
 
 export interface ListProps<T> extends VirtualWindowBaseProps<T> {
   data: T[]

packages/react-virtualized-window/src/index.ts

@@ -1,5 +1,5 @@
-export { List } from "./components/List"
-export { Grid } from "./components/Grid"
+export { List } from "./components/List.js"
+export { Grid } from "./components/Grid.js"
 
 export type { ListProps } from "./components/List"
 export type { VirtualWindowApi } from "./useWindowApi"

packages/react-virtualized-window/src/types.ts

@@ -1,4 +1,4 @@
-import type { VirtualWindowApi } from "./useWindowApi"
+import type { VirtualWindowApi } from "./useWindowApi.js"
 
 export type NumberOrPercent = number | `${number}%`
 

packages/react-virtualized-window/src/useDataDimension.ts

@@ -1,6 +1,6 @@
 import * as React from "react"
 
-import type { NumberOrPercent } from "./types"
+import type { NumberOrPercent } from "./types.js"
 
 interface UseDataDimensionArgs {
   count: number

packages/react-virtualized-window/src/useScrollAdjustedDim.ts

@@ -1,8 +1,8 @@
 import * as React from "react"
 
-import { getScrollbarWidth } from "./getScrollbarWidth"
-import type { NumberOrPercent } from "./types"
-import { dimToNumber } from "./utils"
+import { getScrollbarWidth } from "./getScrollbarWidth.js"
+import type { NumberOrPercent } from "./types.js"
+import { dimToNumber } from "./utils.js"
 
 interface UseScrollAdjustedWindowDimsArgs {
   height: number

packages/react-virtualized-window/src/useScrollItems.tsx

@@ -1,7 +1,7 @@
 import * as React from "react"
 
-import { RenderItem } from "./RenderItem"
-import type { GridProps } from "./types"
+import { RenderItem } from "./RenderItem.js"
+import type { GridProps } from "./types.js"
 
 interface ScrollItemArgs<T> {
   vertStart: number

packages/react-virtualized-window/src/utils.ts

@@ -1,4 +1,4 @@
-import type { NumberOrPercent } from "./types"
+import type { NumberOrPercent } from "./types.js"
 
 export function percentToNumber(percent: string) {
   return parseFloat(percent) / 100.0