@arbor-education/design-system.components 0.19.0 → 0.20.0

package/src/components/formField/inputs/time/TimeInput.stories.tsx

@@ -10,7 +10,7 @@ import {
   Title,
 } from '@storybook/addon-docs/blocks';
 import { FormField } from 'Components/formField/FormField';
-import { TimeInput, type TimeValue } from './TimeInput';
+import { TimeInput, type TimeValue } from './TimeInput.js';
 
 // ---------------------------------------------------------------------------
 // Docs page content

package/src/components/formField/inputs/time/TimeInput.test.tsx

@@ -2,7 +2,7 @@ import '@testing-library/jest-dom/vitest';
 import { fireEvent, render, screen } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
 import { afterEach, beforeEach, describe, expect, test, vi } from 'vitest';
-import { TimeInput } from './TimeInput';
+import { TimeInput } from './TimeInput.js';
 
 describe('TimeInput', () => {
   beforeEach(() => {

package/src/components/formField/label/Label.stories.tsx

@@ -9,7 +9,7 @@ import {
   Title,
 } from '@storybook/addon-docs/blocks';
 import { TextInput } from 'Components/formField/inputs/text/TextInput';
-import { Label } from './Label';
+import { Label } from './Label.js';
 
 // ---------------------------------------------------------------------------
 // Docs page content

package/src/components/formField/label/Label.test.tsx

@@ -1,6 +1,6 @@
 import { expect, test } from 'vitest';
 import { render, screen } from '@testing-library/react';
-import { Label } from './Label';
+import { Label } from './Label.js';
 import '@testing-library/jest-dom/vitest';
 
 test('Label says hello', () => {

package/src/components/heading/Heading.stories.tsx

@@ -8,7 +8,7 @@ import {
   Subtitle,
   Title,
 } from '@storybook/addon-docs/blocks';
-import { Heading } from './Heading';
+import { Heading } from './Heading.js';
 import { Button } from 'Components/button/Button';
 import { EditableText } from 'Components/editableText/EditableText';
 import { TooltipWrapper } from 'Components/tooltip/TooltipWrapper';

package/src/components/heading/Heading.test.tsx

@@ -1,6 +1,6 @@
 import { describe, expect, test } from 'vitest';
 import { render, screen } from '@testing-library/react';
-import { Heading } from './Heading';
+import { Heading } from './Heading.js';
 import '@testing-library/jest-dom/vitest';
 
 describe('Heading', () => {

package/src/components/icoText/IcoText.stories.tsx

@@ -8,7 +8,7 @@ import {
   Subtitle,
   Title,
 } from '@storybook/addon-docs/blocks';
-import { IcoText } from './IcoText';
+import { IcoText } from './IcoText.js';
 
 // ---------------------------------------------------------------------------
 // Docs page content

package/src/components/icoText/IcoText.test.tsx

@@ -1,7 +1,7 @@
 import { render, screen, within } from '@testing-library/react';
 import '@testing-library/jest-dom/vitest';
 import { describe, expect, test } from 'vitest';
-import { IcoText } from './IcoText';
+import { IcoText } from './IcoText.js';
 
 describe('IcoText', () => {
   test('renders icon children before content children and keeps content in the content wrapper', () => {

package/src/components/icon/Icon.stories.tsx

@@ -9,9 +9,9 @@ import {
   Title,
 } from '@storybook/addon-docs/blocks';
 import { Button } from 'Components/button/Button';
-import { Icon } from './Icon';
-import { allowedIcons } from './allowedIcons';
-import { iconSizes } from './types';
+import { Icon } from './Icon.js';
+import { allowedIcons } from './allowedIcons.js';
+import { iconSizes } from './types.js';
 
 // ---------------------------------------------------------------------------
 // Docs page content

package/src/components/icon/Icon.test.tsx

@@ -1,8 +1,8 @@
 import { describe, expect, test } from 'vitest';
 import { render, screen } from '@testing-library/react';
-import { Icon } from './Icon';
+import { Icon } from './Icon.js';
 import '@testing-library/jest-dom/vitest';
-import { allowedIcons, type IconName } from './allowedIcons';
+import { allowedIcons, type IconName } from './allowedIcons.js';
 
 describe('Icon', () => {
   Object.keys(allowedIcons).forEach((icon) => {

package/src/components/icon/Icon.tsx

@@ -1,5 +1,5 @@
-import type { CustomIconProps, IconSize } from './types';
-import { allowedIcons, type IconName } from './allowedIcons';
+import type { CustomIconProps, IconSize } from './types.js';
+import { allowedIcons, type IconName } from './allowedIcons.js';
 import classNames from 'classnames';
 
 type IconProps = {

package/src/components/icon/allowedIcons.tsx

@@ -89,11 +89,11 @@ import {
   Users,
   UsersRound, X,
 } from 'lucide-react';
-import { AskArbor } from './customIcons/AskArbor';
-import type { CustomIconProps } from './types';
-import { CheckSolid } from './customIcons/CheckSolid';
-import { Google } from './customIcons/Google';
-import { XSolid } from './customIcons/XSolid';
+import { AskArbor } from './customIcons/AskArbor.js';
+import type { CustomIconProps } from './types.js';
+import { CheckSolid } from './customIcons/CheckSolid.js';
+import { Google } from './customIcons/Google.js';
+import { XSolid } from './customIcons/XSolid.js';
 
 export const allowedIcons = {
   // lucide icons

package/src/components/icon/customIcons/AskArbor.tsx

@@ -1,4 +1,4 @@
-import type { CustomIconProps } from '../types';
+import type { CustomIconProps } from '../types.js';
 
 export const AskArbor = (props: CustomIconProps) => {
   const { size, color, ...rest } = props;

package/src/components/icon/customIcons/CheckSolid.tsx

@@ -1,4 +1,4 @@
-import type { CustomIconProps } from '../types';
+import type { CustomIconProps } from '../types.js';
 import { useMemoGenerateUuid } from 'Utils/hooks/useMemoGenerateUuid';
 
 export const CheckSolid = (props: CustomIconProps) => {

package/src/components/icon/customIcons/Google.tsx

@@ -1,4 +1,4 @@
-import type { CustomIconProps } from '../types';
+import type { CustomIconProps } from '../types.js';
 
 export const Google = (props: CustomIconProps) => {
   // eslint-disable-next-line @typescript-eslint/no-unused-vars

package/src/components/icon/customIcons/XSolid.tsx

@@ -1,4 +1,4 @@
-import type { CustomIconProps } from '../types';
+import type { CustomIconProps } from '../types.js';
 import { useMemoGenerateUuid } from 'Utils/hooks/useMemoGenerateUuid';
 
 export const XSolid = (props: CustomIconProps) => {

package/src/components/kpiCard/KPICard.stories.tsx

@@ -9,7 +9,7 @@ import {
   Title,
 } from '@storybook/addon-docs/blocks';
 import { fn } from 'storybook/test';
-import { KPICard } from './KPICard';
+import { KPICard } from './KPICard.js';
 import { Progress } from 'Components/progress/Progress';
 import { KVPList } from 'Components/kvpList/KVPList';
 

package/src/components/kpiCard/KPICard.test.tsx

@@ -1,7 +1,7 @@
 import { fireEvent, render, screen } from '@testing-library/react';
 import '@testing-library/jest-dom/vitest';
 import { describe, expect, test, vi } from 'vitest';
-import { KPICard } from './KPICard';
+import { KPICard } from './KPICard.js';
 import { KVPList } from 'Components/kvpList/KVPList';
 
 describe('KPICard', () => {

package/src/components/kvpList/KVPList.stories.tsx

@@ -9,7 +9,7 @@ import {
   Title,
 } from '@storybook/addon-docs/blocks';
 import { Progress } from 'Components/progress/Progress';
-import { KVPList } from './KVPList';
+import { KVPList } from './KVPList.js';
 
 // ---------------------------------------------------------------------------
 // Docs page content

package/src/components/kvpList/KVPList.test.tsx

@@ -1,7 +1,7 @@
 import '@testing-library/jest-dom/vitest';
 import { render, screen } from '@testing-library/react';
 import { describe, expect, test } from 'vitest';
-import { KVPList } from './KVPList';
+import { KVPList } from './KVPList.js';
 
 describe('KVPList', () => {
   test('renders term and definition semantics', () => {

package/src/components/modal/Modal.stories.tsx

@@ -9,7 +9,7 @@ import {
   Subtitle,
   Title,
 } from '@storybook/addon-docs/blocks';
-import { Modal } from './Modal';
+import { Modal } from './Modal.js';
 import { Button } from 'Components/button/Button';
 import { FormField } from 'Components/formField/FormField';
 import { Dropdown } from 'Components/dropdown/Dropdown';

package/src/components/modal/Modal.test.tsx

@@ -1,7 +1,7 @@
 import { describe, expect, test, vi } from 'vitest';
 import { render, screen } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
-import { Modal } from './Modal';
+import { Modal } from './Modal.js';
 import '@testing-library/jest-dom/vitest';
 
 describe('Modal', () => {

package/src/components/modal/Modal.tsx

@@ -1,12 +1,12 @@
 import classNames from 'classnames';
 import { Dialog } from 'radix-ui';
-import { ModalHeader, type ModalHeaderProps } from './ModalHeader';
-import { ModalFooter, type ModalFooterProps } from './ModalFooter';
-import { ModalBody, type ModalBodyProps } from './ModalBody';
-import { PopupParentContext } from 'Utils/PopupParentContext';
+import { ModalHeader, type ModalHeaderProps } from './ModalHeader.js';
+import { ModalFooter, type ModalFooterProps } from './ModalFooter.js';
+import { ModalBody, type ModalBodyProps } from './ModalBody.js';
+import { PopupParentContext } from 'Utils/popupParent/PopupParentContext';
 import { createContext, useRef } from 'react';
-import { ModalCloseButon } from './ModalCloseButton';
-import { ModalTitle } from './ModalTitle';
+import { ModalCloseButon } from './ModalCloseButton.js';
+import { ModalTitle } from './ModalTitle.js';
 import type { ButtonProps } from 'Components/button/Button';
 
 type ModalContextValue = {

package/src/components/modal/ModalCloseButton.tsx

@@ -1,5 +1,5 @@
 import { useContext, useEffect } from 'react';
-import { ModalContext } from './Modal';
+import { ModalContext } from './Modal.js';
 import { Button, type ButtonProps } from 'Components/button/Button';
 import classNames from 'classnames';
 

package/src/components/modal/modalManager/ModalManager.stories.tsx

@@ -7,7 +7,7 @@ import {
   Subtitle,
   Title,
 } from '@storybook/addon-docs/blocks';
-import { ModalManager } from './ModalManager';
+import { ModalManager } from './ModalManager.js';
 import { Modal } from 'Components/modal/Modal';
 import { Button } from 'Components/button/Button';
 import { FormField } from 'Components/formField/FormField';

package/src/components/modal/modalManager/ModalManager.test.tsx

@@ -1,6 +1,6 @@
 import { describe, expect, test } from 'vitest';
 import { render, screen, waitFor } from '@testing-library/react';
-import { ModalManager } from './ModalManager';
+import { ModalManager } from './ModalManager.js';
 import { ModalUtils } from 'Utils/ModalUtils';
 import PubSub from 'Utils/PubSub';
 import { MODAL } from 'Utils/Constants';

package/src/components/pill/Pill.stories.tsx

@@ -10,7 +10,7 @@ import {
 } from '@storybook/addon-docs/blocks';
 import { useState } from 'react';
 import { fn } from 'storybook/test';
-import { Pill } from './Pill';
+import { Pill } from './Pill.js';
 
 // ---------------------------------------------------------------------------
 // Docs page content

package/src/components/pill/Pill.test.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 import { render, screen, fireEvent } from '@testing-library/react';
-import { Pill } from './Pill';
+import { Pill } from './Pill.js';
 import { describe, expect, it, vi } from 'vitest';
 import '@testing-library/jest-dom/vitest';
 

package/src/components/progress/Progress.stories.tsx

@@ -10,7 +10,7 @@ import {
 } from '@storybook/addon-docs/blocks';
 import { useEffect, useState } from 'react';
 import { Button } from 'Components/button/Button';
-import { Progress } from './Progress';
+import { Progress } from './Progress.js';
 
 // ---------------------------------------------------------------------------
 // Docs page content

package/src/components/progress/Progress.test.tsx

@@ -1,5 +1,5 @@
 import { expect, test, describe } from 'vitest';
-import { Progress } from './Progress';
+import { Progress } from './Progress.js';
 import { render } from '@testing-library/react';
 import '@testing-library/jest-dom/vitest';
 

package/src/components/row/Row.stories.tsx

@@ -10,7 +10,7 @@ import {
 } from '@storybook/addon-docs/blocks';
 import { fn } from 'storybook/test';
 
-import { Row } from './Row';
+import { Row } from './Row.js';
 
 // ---------------------------------------------------------------------------
 // Content strings for the custom DocsPage

package/src/components/row/Row.test.tsx

@@ -1,6 +1,6 @@
 import { expect, test, describe, vi } from 'vitest';
 import { render, screen, fireEvent } from '@testing-library/react';
-import { Row } from './Row';
+import { Row } from './Row.js';
 import '@testing-library/jest-dom/vitest';
 
 describe('Row component', () => {

package/src/components/searchBar/SearchBar.stories.tsx

@@ -9,7 +9,7 @@ import {
   Title,
 } from '@storybook/addon-docs/blocks';
 import { useEffect, useState } from 'react';
-import { SearchBar } from './SearchBar';
+import { SearchBar } from './SearchBar.js';
 
 // ---------------------------------------------------------------------------
 // Docs page content

package/src/components/searchBar/SearchBar.test.tsx

@@ -1,7 +1,7 @@
 import { describe, expect, test, vi, beforeEach } from 'vitest';
 import { render, screen, fireEvent } from '@testing-library/react';
 import '@testing-library/jest-dom/vitest';
-import { SearchBar } from './SearchBar';
+import { SearchBar } from './SearchBar.js';
 import userEvent from '@testing-library/user-event';
 
 const setSearchMock = vi.fn();

package/src/components/section/Section.stories.tsx

@@ -11,7 +11,7 @@ import {
 import { fn } from 'storybook/test';
 
 import { Row } from 'Components/row/Row';
-import { Section } from './Section';
+import { Section } from './Section.js';
 
 // ---------------------------------------------------------------------------
 // Content strings for the custom DocsPage

package/src/components/section/Section.test.tsx

@@ -1,6 +1,6 @@
 import { expect, test, describe, vi } from 'vitest';
 import { render, screen, fireEvent } from '@testing-library/react';
-import { Section } from './Section';
+import { Section } from './Section.js';
 import '@testing-library/jest-dom/vitest';
 
 describe('Section component', () => {

package/src/components/separator/Separator.stories.tsx

@@ -8,7 +8,7 @@ import {
   Subtitle,
   Title,
 } from '@storybook/addon-docs/blocks';
-import { Separator } from './Separator';
+import { Separator } from './Separator.js';
 
 // ---------------------------------------------------------------------------
 // Docs page content

package/src/components/separator/Separator.test.tsx

@@ -1,6 +1,6 @@
 import { expect, test } from 'vitest';
 import { render, screen } from '@testing-library/react';
-import { Separator } from './Separator';
+import { Separator } from './Separator.js';
 import '@testing-library/jest-dom/vitest';
 
 test('Separator says hello', () => {

package/src/components/singleUser/SingleUser.stories.tsx

@@ -9,7 +9,7 @@ import {
   Title,
 } from '@storybook/addon-docs/blocks';
 
-import { SingleUser } from './SingleUser';
+import { SingleUser } from './SingleUser.js';
 
 // ---------------------------------------------------------------------------
 // Content strings for the custom DocsPage

package/src/components/singleUser/SingleUser.test.tsx

@@ -1,7 +1,7 @@
 import '@testing-library/jest-dom/vitest';
 import { render, screen } from '@testing-library/react';
 import { describe, expect, test } from 'vitest';
-import { SingleUser } from './SingleUser';
+import { SingleUser } from './SingleUser.js';
 
 describe('SingleUser', () => {
   test('renders label text', () => {

package/src/components/slideover/Slideover.test.tsx

@@ -1,6 +1,6 @@
 import { expect, test, describe, vi } from 'vitest';
 import { render, screen, fireEvent } from '@testing-library/react';
-import { Slideover } from './Slideover';
+import { Slideover } from './Slideover.js';
 import '@testing-library/jest-dom/vitest';
 import { SlideoverUtils } from 'Utils/SlideoverUtils';
 

package/src/components/slideoverManager/SlideoverManager.stories.tsx

@@ -6,7 +6,7 @@ import {
   Subtitle,
   Title,
 } from '@storybook/addon-docs/blocks';
-import { SlideoverManager } from './SlideoverManager';
+import { SlideoverManager } from './SlideoverManager.js';
 import { SlideoverUtils } from 'Utils/SlideoverUtils';
 import { Button } from 'Components/button/Button';
 import { FormField } from 'Components/formField/FormField';

package/src/components/slideoverManager/SlideoverManager.test.tsx

@@ -1,6 +1,6 @@
 import { expect, test, describe } from 'vitest';
 import { render, screen, act } from '@testing-library/react';
-import { SlideoverManager } from './SlideoverManager';
+import { SlideoverManager } from './SlideoverManager.js';
 import '@testing-library/jest-dom/vitest';
 import { SlideoverUtils } from 'Utils/SlideoverUtils';
 import type { SlideoverProps } from 'Components/slideover/Slideover';

package/src/components/slideoverManager/SlideoverManager.tsx

@@ -3,7 +3,7 @@ import { Slideover, type SlideoverProps } from 'Components/slideover/Slideover';
 import { useEffect, useRef, useState } from 'react';
 import { SLIDEOVER } from 'Utils/Constants';
 import { usePubSub } from 'Utils/hooks/usePubSub';
-import { PopupParentContext } from 'Utils/PopupParentContext';
+import { PopupParentContext } from 'Utils/popupParent/PopupParentContext';
 
 type SlideoverManagerProps = {
   slideovers: SlideoverProps[];

package/src/components/table/DSDefaultColDef.ts

@@ -5,7 +5,7 @@ import type {
   SuppressMouseEventHandlingParams,
   ValueFormatterFunc,
 } from 'ag-grid-community';
-import { cellColorStyles } from './cellColorStyles';
+import { cellColorStyles } from './cellColorStyles.js';
 
 // checks if the value is wrapped in a object with a value property
 const isWrappedValue = (value: unknown): value is { value: unknown } => {

package/src/components/table/Table.stories.tsx

@@ -10,26 +10,26 @@ import {
   Title,
 } from '@storybook/addon-docs/blocks';
 import { type Column, type ColDef, type ColGroupDef } from 'ag-grid-enterprise';
-import { Table } from './Table';
+import { Table } from './Table.js';
 import { Button } from 'Components/button/Button';
 
 import { useState, type ComponentProps } from 'react';
-import { RowCountInfo } from './pagination/RowCountInfo';
-import { PaginationPanel } from './pagination/PaginationPanel';
-import { HideColumnsDropdown } from './tableControls/HideColumnsDropdown';
-import { TableControls } from './tableControls/TableControls';
+import { RowCountInfo } from './pagination/RowCountInfo.js';
+import { PaginationPanel } from './pagination/PaginationPanel.js';
+import { HideColumnsDropdown } from './tableControls/HideColumnsDropdown.js';
+import { TableControls } from './tableControls/TableControls.js';
 import { ModalManager } from 'Components/modal/modalManager/ModalManager';
 import { Modal } from 'Components/modal/Modal';
 import { ModalUtils } from 'Utils/ModalUtils';
-import type { SemanticColorKey } from './cellColorStyles';
+import type { SemanticColorKey } from './cellColorStyles.js';
 import {
   BooleanFilter,
   doesBooleanFilterPass,
-} from './columnFilters/BooleanFilter/BooleanFilter';
+} from './columnFilters/BooleanFilter/BooleanFilter.js';
 import {
   doesTimeFilterPass,
   TimeFilter,
-} from './columnFilters/TimeFilter/TimeFilter';
+} from './columnFilters/TimeFilter/TimeFilter.js';
 import type { CustomCellRendererProps } from 'ag-grid-react';
 
 type TableProps = ComponentProps<typeof Table>;

package/src/components/table/Table.test.tsx

@@ -1,10 +1,10 @@
 import { describe, expect, expectTypeOf, test, vi } from 'vitest';
 import { render, screen, waitFor, fireEvent } from '@testing-library/react';
-import { Table } from './Table';
+import { Table } from './Table.js';
 import '@testing-library/jest-dom/vitest';
 import { BulkActionsDropdown } from 'Components/table/tableControls/BulkActionsDropdown';
 import { HideColumnsDropdown } from 'Components/table/tableControls/HideColumnsDropdown';
-import { TableSettingsDropdown } from './tableControls/TableSettingsDropdown';
+import { TableSettingsDropdown } from './tableControls/TableSettingsDropdown.js';
 import userEvent from '@testing-library/user-event';
 import type { GridApi } from 'ag-grid-enterprise';
 import type { Column } from 'ag-grid-community';

package/src/components/table/Table.tsx

@@ -1,40 +1,40 @@
 import { AllEnterpriseModule, ModuleRegistry, type GridApi } from 'ag-grid-enterprise';
 import { AgGridReact, type AgGridReactProps } from 'ag-grid-react';
-import { defaultTheme } from './theme/defaultTheme';
+import { defaultTheme } from './theme/defaultTheme.js';
 import classNames from 'classnames';
 import { useContext, useRef, useState, type ReactNode } from 'react';
-import { TableFooter } from './TableFooter';
-import { TableHeader } from './TableHeader';
-import { GridApiContext } from './GridApiContext';
-import { PaginationPanel } from './pagination/PaginationPanel';
-import { PageSizeSelector } from './pagination/PageSizeSelector';
-import { PaginationControls } from './pagination/PaginationControls';
-import { RowCountInfo } from './pagination/RowCountInfo';
-import { BulkActionsDropdown } from './tableControls/BulkActionsDropdown';
-import { HideColumnsDropdown } from './tableControls/HideColumnsDropdown';
-import { useTableSettings, type UseTableSettingsParams } from './useTableSettings';
+import { TableFooter } from './TableFooter.js';
+import { TableHeader } from './TableHeader.js';
+import { GridApiContext } from './GridApiContext.js';
+import { PaginationPanel } from './pagination/PaginationPanel.js';
+import { PageSizeSelector } from './pagination/PageSizeSelector.js';
+import { PaginationControls } from './pagination/PaginationControls.js';
+import { RowCountInfo } from './pagination/RowCountInfo.js';
+import { BulkActionsDropdown } from './tableControls/BulkActionsDropdown.js';
+import { HideColumnsDropdown } from './tableControls/HideColumnsDropdown.js';
+import { useTableSettings, type UseTableSettingsParams } from './useTableSettings.js';
 import { setAgGridLicenseKey } from 'Utils/setAgGridLicenseKey';
-import { PopupParentContext } from 'Utils/PopupParentContext';
-import { toggleRowSelectionInCurrentRange } from './toggleRowSelectionInCurrentRange';
-import { defaultValueFormatter, DSDefaultColDef, shouldSuppressFocus } from './DSDefaultColDef';
-import { NumberCellEditor } from './cellEditors/NumberCellEditor';
-import { ButtonCellRenderer } from './cellRenderers/ButtonCellRenderer';
-import { InlineTextCellRenderer } from './cellRenderers/InlineTextCellRenderer';
-import { SelectDropdownCellRenderer } from './cellRenderers/SelectDropdownCellRenderer';
-import { tidyTheme } from './theme/tidyTheme';
+import { PopupParentContext } from 'Utils/popupParent/PopupParentContext';
+import { toggleRowSelectionInCurrentRange } from './toggleRowSelectionInCurrentRange.js';
+import { defaultValueFormatter, DSDefaultColDef, shouldSuppressFocus } from './DSDefaultColDef.js';
+import { NumberCellEditor } from './cellEditors/NumberCellEditor.js';
+import { ButtonCellRenderer } from './cellRenderers/ButtonCellRenderer.js';
+import { InlineTextCellRenderer } from './cellRenderers/InlineTextCellRenderer.js';
+import { SelectDropdownCellRenderer } from './cellRenderers/SelectDropdownCellRenderer.js';
+import { tidyTheme } from './theme/tidyTheme.js';
 import { focusFirstFocusableElement } from 'Utils/focusFirstFocusableElement';
-import { BooleanFilter } from './columnFilters/BooleanFilter/BooleanFilter';
-import { TimeFilter } from './columnFilters/TimeFilter/TimeFilter';
-import { DateCellEditor } from './cellEditors/DateCellEditor';
-import { TableSettingsDropdown, TABLE_SETTINGS_ITEMS } from './tableControls/TableSettingsDropdown';
-import { TableControls, type TableControlsProps, type BulkAction as BulkActionType } from './tableControls/TableControls';
-import type { HideColumnsDropdownProps } from './tableControls/HideColumnsDropdown';
-import { TABLE_SPACING } from './tableConsts';
-import { TableSettingsContext } from './TableSettingsContext';
-import { BooleanCellRenderer } from './cellRenderers/BooleanCellRenderer';
-import { CheckboxCellRenderer } from './cellRenderers/CheckboxCellRenderer';
-import { ComboboxCellRenderer } from './cellRenderers/ComboboxCellRenderer';
-import { DefaultCellRenderer } from './cellRenderers/DefaultCellRenderer';
+import { BooleanFilter } from './columnFilters/BooleanFilter/BooleanFilter.js';
+import { TimeFilter } from './columnFilters/TimeFilter/TimeFilter.js';
+import { DateCellEditor } from './cellEditors/DateCellEditor.js';
+import { TableSettingsDropdown, TABLE_SETTINGS_ITEMS } from './tableControls/TableSettingsDropdown.js';
+import { TableControls, type TableControlsProps, type BulkAction as BulkActionType } from './tableControls/TableControls.js';
+import type { HideColumnsDropdownProps } from './tableControls/HideColumnsDropdown.js';
+import { TABLE_SPACING } from './tableConsts.js';
+import { TableSettingsContext } from './TableSettingsContext.js';
+import { BooleanCellRenderer } from './cellRenderers/BooleanCellRenderer.js';
+import { CheckboxCellRenderer } from './cellRenderers/CheckboxCellRenderer.js';
+import { ComboboxCellRenderer } from './cellRenderers/ComboboxCellRenderer.js';
+import { DefaultCellRenderer } from './cellRenderers/DefaultCellRenderer.js';
 
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
 type TableProps<TData = any> = {
@@ -55,7 +55,7 @@ setAgGridLicenseKey();
 
 ModuleRegistry.registerModules([AllEnterpriseModule]);
 
-export { TableSettingsContext } from './TableSettingsContext';
+export { TableSettingsContext } from './TableSettingsContext.js';
 
 export const Table = (props: TableProps) => {
   const {

package/src/components/table/TableFooter.stories.tsx

@@ -9,8 +9,8 @@ import {
   Title,
 } from '@storybook/addon-docs/blocks';
 import { fn } from 'storybook/test';
-import { TableFooter } from './TableFooter';
-import { PaginationPanel } from './pagination/PaginationPanel';
+import { TableFooter } from './TableFooter.js';
+import { PaginationPanel } from './pagination/PaginationPanel.js';
 
 // ---------------------------------------------------------------------------
 // Docs page content

package/src/components/table/TableHeader.stories.tsx

@@ -10,8 +10,8 @@ import {
   Title,
 } from '@storybook/addon-docs/blocks';
 import { fn } from 'storybook/test';
-import { TableHeader } from './TableHeader';
-import { TableControls } from './tableControls/TableControls';
+import { TableHeader } from './TableHeader.js';
+import { TableControls } from './tableControls/TableControls.js';
 
 // ---------------------------------------------------------------------------
 // Docs page content