@instructure/ui-table 11.7.4-snapshot-11 → 11.7.4-snapshot-49

package/lib/Table/v2/Body/index.js

@@ -10,9 +10,9 @@ var _safeCloneElement = require("@instructure/ui-react-utils/lib/safeCloneElemen
 var _omitProps = require("@instructure/ui-react-utils/lib/omitProps.js");
 var _latest = require("@instructure/ui-view/latest");
 var _emotion = require("@instructure/emotion");
-var _styles = _interopRequireDefault(require("./styles"));
-var _props = require("./props");
-var _TableContext = _interopRequireDefault(require("../TableContext"));
+var _styles = _interopRequireDefault(require("./styles.js"));
+var _props = require("./props.js");
+var _TableContext = _interopRequireDefault(require("../TableContext.js"));
 var _jsxRuntime = require("@emotion/react/jsx-runtime");
 var _dec, _class;
 /*
@@ -45,7 +45,7 @@ id: Table.Body
 ---
 **/
 let Body = exports.Body = (_dec = (0, _emotion.withStyleNew)(_styles.default), _dec(_class = class Body extends _react.Component {
-  static displayName = "Body";
+  static displayName = 'Body';
   static componentId = 'Table.Body';
   static contextType = _TableContext.default;
   static allowedProps = _props.allowedProps;

package/lib/Table/v2/Cell/index.js

@@ -10,9 +10,9 @@ var _omitProps = require("@instructure/ui-react-utils/lib/omitProps.js");
 var _callRenderProp = require("@instructure/ui-react-utils/lib/callRenderProp.js");
 var _latest = require("@instructure/ui-view/latest");
 var _emotion = require("@instructure/emotion");
-var _styles = _interopRequireDefault(require("./styles"));
-var _props = require("./props");
-var _TableContext = _interopRequireDefault(require("../TableContext"));
+var _styles = _interopRequireDefault(require("./styles.js"));
+var _props = require("./props.js");
+var _TableContext = _interopRequireDefault(require("../TableContext.js"));
 var _jsxRuntime = require("@emotion/react/jsx-runtime");
 var _dec, _class;
 /*
@@ -45,7 +45,7 @@ id: Table.Cell
 ---
 **/
 let Cell = exports.Cell = (_dec = (0, _emotion.withStyleNew)(_styles.default), _dec(_class = class Cell extends _react.Component {
-  static displayName = "Cell";
+  static displayName = 'Cell';
   static componentId = 'Table.Cell';
   static contextType = _TableContext.default;
   static allowedProps = _props.allowedProps;

package/lib/Table/v2/ColHeader/index.js

@@ -9,8 +9,8 @@ var _react = require("react");
 var _omitProps = require("@instructure/ui-react-utils/lib/omitProps.js");
 var _callRenderProp = require("@instructure/ui-react-utils/lib/callRenderProp.js");
 var _emotion = require("@instructure/emotion");
-var _styles = _interopRequireDefault(require("./styles"));
-var _props = require("./props");
+var _styles = _interopRequireDefault(require("./styles.js"));
+var _props = require("./props.js");
 var _uiIcons = require("@instructure/ui-icons");
 var _jsxRuntime = require("@emotion/react/jsx-runtime");
 var _dec, _class;
@@ -44,7 +44,7 @@ id: Table.ColHeader
 ---
 **/
 let ColHeader = exports.ColHeader = (_dec = (0, _emotion.withStyleNew)(_styles.default), _dec(_class = class ColHeader extends _react.Component {
-  static displayName = "ColHeader";
+  static displayName = 'ColHeader';
   static componentId = 'Table.ColHeader';
   static allowedProps = _props.allowedProps;
   static defaultProps = {

package/lib/Table/v2/Head/index.js

@@ -13,9 +13,9 @@ var _ScreenReaderContent = require("@instructure/ui-a11y-content/lib/ScreenReade
 var _uiIcons = require("@instructure/ui-icons");
 var _console = require("@instructure/console");
 var _emotion = require("@instructure/emotion");
-var _styles = _interopRequireDefault(require("./styles"));
-var _props = require("./props");
-var _TableContext = _interopRequireDefault(require("../TableContext"));
+var _styles = _interopRequireDefault(require("./styles.js"));
+var _props = require("./props.js");
+var _TableContext = _interopRequireDefault(require("../TableContext.js"));
 var _jsxRuntime = require("@emotion/react/jsx-runtime");
 var _dec, _class;
 /*
@@ -48,7 +48,7 @@ id: Table.Head
 ---
 **/
 let Head = exports.Head = (_dec = (0, _emotion.withStyleNew)(_styles.default), _dec(_class = class Head extends _react.Component {
-  static displayName = "Head";
+  static displayName = 'Head';
   static componentId = 'Table.Head';
   static contextType = _TableContext.default;
   static allowedProps = _props.allowedProps;

package/lib/Table/v2/Row/index.js

@@ -10,9 +10,9 @@ var _omitProps = require("@instructure/ui-react-utils/lib/omitProps.js");
 var _safeCloneElement = require("@instructure/ui-react-utils/lib/safeCloneElement.js");
 var _latest = require("@instructure/ui-view/latest");
 var _emotion = require("@instructure/emotion");
-var _styles = _interopRequireDefault(require("./styles"));
-var _props = require("./props");
-var _TableContext = _interopRequireDefault(require("../TableContext"));
+var _styles = _interopRequireDefault(require("./styles.js"));
+var _props = require("./props.js");
+var _TableContext = _interopRequireDefault(require("../TableContext.js"));
 var _jsxRuntime = require("@emotion/react/jsx-runtime");
 var _dec, _class;
 /*
@@ -45,7 +45,7 @@ id: Table.Row
 ---
 **/
 let Row = exports.Row = (_dec = (0, _emotion.withStyleNew)(_styles.default), _dec(_class = class Row extends _react.Component {
-  static displayName = "Row";
+  static displayName = 'Row';
   static componentId = 'Table.Row';
   static contextType = _TableContext.default;
   static allowedProps = _props.allowedProps;

package/lib/Table/v2/RowHeader/index.js

@@ -10,9 +10,9 @@ var _omitProps = require("@instructure/ui-react-utils/lib/omitProps.js");
 var _callRenderProp = require("@instructure/ui-react-utils/lib/callRenderProp.js");
 var _latest = require("@instructure/ui-view/latest");
 var _emotion = require("@instructure/emotion");
-var _styles = _interopRequireDefault(require("./styles"));
-var _props = require("./props");
-var _TableContext = _interopRequireDefault(require("../TableContext"));
+var _styles = _interopRequireDefault(require("./styles.js"));
+var _props = require("./props.js");
+var _TableContext = _interopRequireDefault(require("../TableContext.js"));
 var _jsxRuntime = require("@emotion/react/jsx-runtime");
 var _dec, _class;
 /*
@@ -45,7 +45,7 @@ id: Table.RowHeader
 ---
 **/
 let RowHeader = exports.RowHeader = (_dec = (0, _emotion.withStyleNew)(_styles.default), _dec(_class = class RowHeader extends _react.Component {
-  static displayName = "RowHeader";
+  static displayName = 'RowHeader';
   static componentId = 'Table.RowHeader';
   static contextType = _TableContext.default;
   static allowedProps = _props.allowedProps;

package/lib/Table/v2/index.js

@@ -11,15 +11,15 @@ var _omitProps = require("@instructure/ui-react-utils/lib/omitProps.js");
 var _latest = require("@instructure/ui-view/latest");
 var _ScreenReaderContent = require("@instructure/ui-a11y-content/lib/ScreenReaderContent");
 var _emotion = require("@instructure/emotion");
-var _styles = _interopRequireDefault(require("./styles"));
-var _Head = require("./Head");
-var _Body = require("./Body");
-var _Row = require("./Row");
-var _ColHeader = require("./ColHeader");
-var _RowHeader = require("./RowHeader");
-var _Cell = require("./Cell");
-var _props = require("./props");
-var _TableContext = _interopRequireDefault(require("./TableContext"));
+var _styles = _interopRequireDefault(require("./styles.js"));
+var _index = require("./Head/index.js");
+var _index2 = require("./Body/index.js");
+var _index3 = require("./Row/index.js");
+var _index4 = require("./ColHeader/index.js");
+var _index5 = require("./RowHeader/index.js");
+var _index6 = require("./Cell/index.js");
+var _props = require("./props.js");
+var _TableContext = _interopRequireDefault(require("./TableContext.js"));
 var _console = require("@instructure/console");
 var _jsxRuntime = require("@emotion/react/jsx-runtime");
 var _dec, _class;
@@ -52,7 +52,7 @@ category: components
 ---
 **/
 let Table = exports.Table = (_dec = (0, _emotion.withStyleNew)(_styles.default), _dec(_class = class Table extends _react.Component {
-  static displayName = "Table";
+  static displayName = 'Table';
   static componentId = 'Table';
   static allowedProps = _props.allowedProps;
   static defaultProps = {
@@ -60,12 +60,12 @@ let Table = exports.Table = (_dec = (0, _emotion.withStyleNew)(_styles.default),
     hover: false,
     layout: 'auto'
   };
-  static Head = _Head.Head;
-  static Body = _Body.Body;
-  static Row = _Row.Row;
-  static ColHeader = _ColHeader.ColHeader;
-  static RowHeader = _RowHeader.RowHeader;
-  static Cell = _Cell.Cell;
+  static Head = _index.Head;
+  static Body = _index2.Body;
+  static Row = _index3.Row;
+  static ColHeader = _index4.ColHeader;
+  static RowHeader = _index5.RowHeader;
+  static Cell = _index6.Cell;
   ref = null;
   // Reference to hidden aria-live region for announcing caption changes to screen readers
   _liveRegionRef = null;

package/lib/exports/a.js

@@ -6,25 +6,25 @@ Object.defineProperty(exports, "__esModule", {
 Object.defineProperty(exports, "Table", {
   enumerable: true,
   get: function () {
-    return _v.Table;
+    return _index.Table;
   }
 });
 Object.defineProperty(exports, "TableBody", {
   enumerable: true,
   get: function () {
-    return _Body.Body;
+    return _index2.Body;
   }
 });
 Object.defineProperty(exports, "TableCell", {
   enumerable: true,
   get: function () {
-    return _Cell.Cell;
+    return _index3.Cell;
   }
 });
 Object.defineProperty(exports, "TableColHeader", {
   enumerable: true,
   get: function () {
-    return _ColHeader.ColHeader;
+    return _index4.ColHeader;
   }
 });
 Object.defineProperty(exports, "TableContext", {
@@ -36,26 +36,26 @@ Object.defineProperty(exports, "TableContext", {
 Object.defineProperty(exports, "TableHead", {
   enumerable: true,
   get: function () {
-    return _Head.Head;
+    return _index5.Head;
   }
 });
 Object.defineProperty(exports, "TableRow", {
   enumerable: true,
   get: function () {
-    return _Row.Row;
+    return _index6.Row;
   }
 });
 Object.defineProperty(exports, "TableRowHeader", {
   enumerable: true,
   get: function () {
-    return _RowHeader.RowHeader;
+    return _index7.RowHeader;
   }
 });
-var _v = require("../Table/v1");
-var _TableContext = require("../Table/v1/TableContext");
-var _Body = require("../Table/v1/Body");
-var _Cell = require("../Table/v1/Cell");
-var _ColHeader = require("../Table/v1/ColHeader");
-var _Head = require("../Table/v1/Head");
-var _Row = require("../Table/v1/Row");
-var _RowHeader = require("../Table/v1/RowHeader");
+var _index = require("../Table/v1/index.js");
+var _TableContext = require("../Table/v1/TableContext.js");
+var _index2 = require("../Table/v1/Body/index.js");
+var _index3 = require("../Table/v1/Cell/index.js");
+var _index4 = require("../Table/v1/ColHeader/index.js");
+var _index5 = require("../Table/v1/Head/index.js");
+var _index6 = require("../Table/v1/Row/index.js");
+var _index7 = require("../Table/v1/RowHeader/index.js");

package/lib/exports/b.js

@@ -6,25 +6,25 @@ Object.defineProperty(exports, "__esModule", {
 Object.defineProperty(exports, "Table", {
   enumerable: true,
   get: function () {
-    return _v.Table;
+    return _index.Table;
   }
 });
 Object.defineProperty(exports, "TableBody", {
   enumerable: true,
   get: function () {
-    return _Body.Body;
+    return _index2.Body;
   }
 });
 Object.defineProperty(exports, "TableCell", {
   enumerable: true,
   get: function () {
-    return _Cell.Cell;
+    return _index3.Cell;
   }
 });
 Object.defineProperty(exports, "TableColHeader", {
   enumerable: true,
   get: function () {
-    return _ColHeader.ColHeader;
+    return _index4.ColHeader;
   }
 });
 Object.defineProperty(exports, "TableContext", {
@@ -36,26 +36,26 @@ Object.defineProperty(exports, "TableContext", {
 Object.defineProperty(exports, "TableHead", {
   enumerable: true,
   get: function () {
-    return _Head.Head;
+    return _index5.Head;
   }
 });
 Object.defineProperty(exports, "TableRow", {
   enumerable: true,
   get: function () {
-    return _Row.Row;
+    return _index6.Row;
   }
 });
 Object.defineProperty(exports, "TableRowHeader", {
   enumerable: true,
   get: function () {
-    return _RowHeader.RowHeader;
+    return _index7.RowHeader;
   }
 });
-var _v = require("../Table/v2");
-var _TableContext = require("../Table/v2/TableContext");
-var _Body = require("../Table/v2/Body");
-var _Cell = require("../Table/v2/Cell");
-var _ColHeader = require("../Table/v2/ColHeader");
-var _Head = require("../Table/v2/Head");
-var _Row = require("../Table/v2/Row");
-var _RowHeader = require("../Table/v2/RowHeader");
+var _index = require("../Table/v2/index.js");
+var _TableContext = require("../Table/v2/TableContext.js");
+var _index2 = require("../Table/v2/Body/index.js");
+var _index3 = require("../Table/v2/Cell/index.js");
+var _index4 = require("../Table/v2/ColHeader/index.js");
+var _index5 = require("../Table/v2/Head/index.js");
+var _index6 = require("../Table/v2/Row/index.js");
+var _index7 = require("../Table/v2/RowHeader/index.js");

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@instructure/ui-table",
-  "version": "11.7.4-snapshot-11",
+  "version": "11.7.4-snapshot-49",
   "description": "A styled HTML table component",
   "author": "Instructure, Inc. Engineering and Product Design",
   "module": "./es/index.js",
@@ -15,25 +15,25 @@
   "license": "MIT",
   "dependencies": {
     "@babel/runtime": "^7.29.2",
-    "@instructure/console": "11.7.4-snapshot-11",
-    "@instructure/shared-types": "11.7.4-snapshot-11",
-    "@instructure/emotion": "11.7.4-snapshot-11",
-    "@instructure/ui-a11y-content": "11.7.4-snapshot-11",
-    "@instructure/ui-icons": "11.7.4-snapshot-11",
-    "@instructure/ui-react-utils": "11.7.4-snapshot-11",
-    "@instructure/ui-simple-select": "11.7.4-snapshot-11",
-    "@instructure/ui-themes": "11.7.4-snapshot-11",
-    "@instructure/ui-utils": "11.7.4-snapshot-11",
-    "@instructure/ui-view": "11.7.4-snapshot-11"
+    "@instructure/console": "11.7.4-snapshot-49",
+    "@instructure/emotion": "11.7.4-snapshot-49",
+    "@instructure/ui-a11y-content": "11.7.4-snapshot-49",
+    "@instructure/shared-types": "11.7.4-snapshot-49",
+    "@instructure/ui-icons": "11.7.4-snapshot-49",
+    "@instructure/ui-react-utils": "11.7.4-snapshot-49",
+    "@instructure/ui-themes": "11.7.4-snapshot-49",
+    "@instructure/ui-utils": "11.7.4-snapshot-49",
+    "@instructure/ui-view": "11.7.4-snapshot-49",
+    "@instructure/ui-simple-select": "11.7.4-snapshot-49"
   },
   "devDependencies": {
     "@testing-library/jest-dom": "^6.6.3",
     "@testing-library/react": "15.0.7",
     "@testing-library/user-event": "^14.6.1",
     "vitest": "^3.2.2",
-    "@instructure/ui-color-utils": "11.7.4-snapshot-11",
-    "@instructure/ui-babel-preset": "11.7.4-snapshot-11",
-    "@instructure/ui-axe-check": "11.7.4-snapshot-11"
+    "@instructure/ui-axe-check": "11.7.4-snapshot-49",
+    "@instructure/ui-babel-preset": "11.7.4-snapshot-49",
+    "@instructure/ui-color-utils": "11.7.4-snapshot-49"
   },
   "peerDependencies": {
     "react": ">=18 <=19"

package/src/Table/v1/Body/index.tsx

@@ -34,11 +34,11 @@ import { safeCloneElement, omitProps } from '@instructure/ui-react-utils'
 import { View } from '@instructure/ui-view/v11_6'
 import { withStyle } from '@instructure/emotion'
 
-import generateStyle from './styles'
-import generateComponentTheme from './theme'
+import generateStyle from './styles.js'
+import generateComponentTheme from './theme.js'
 import type { TableBodyProps } from './props'
-import { allowedProps } from './props'
-import TableContext from '../TableContext'
+import { allowedProps } from './props.js'
+import TableContext from '../TableContext.js'
 
 /**
 ---
@@ -48,6 +48,7 @@ id: Table.Body
 **/
 @withStyle(generateStyle, generateComponentTheme)
 class Body extends Component<TableBodyProps> {
+  static displayName = 'Body'
   static readonly componentId = 'Table.Body'
   static contextType = TableContext
   declare context: ContextType<typeof TableContext>

package/src/Table/v1/Cell/index.tsx

@@ -29,11 +29,11 @@ import { View } from '@instructure/ui-view/v11_6'
 
 import { withStyle } from '@instructure/emotion'
 
-import generateStyle from './styles'
-import generateComponentTheme from './theme'
+import generateStyle from './styles.js'
+import generateComponentTheme from './theme.js'
 import type { TableCellProps } from './props'
-import { allowedProps } from './props'
-import TableContext from '../TableContext'
+import { allowedProps } from './props.js'
+import TableContext from '../TableContext.js'
 
 /**
 ---
@@ -43,6 +43,7 @@ id: Table.Cell
 **/
 @withStyle(generateStyle, generateComponentTheme)
 class Cell extends Component<TableCellProps> {
+  static displayName = 'Cell'
   static readonly componentId = 'Table.Cell'
   static contextType = TableContext
   declare context: ContextType<typeof TableContext>

package/src/Table/v1/ColHeader/index.tsx

@@ -33,10 +33,10 @@ import {
 
 import { withStyle } from '@instructure/emotion'
 
-import generateStyle from './styles'
-import generateComponentTheme from './theme'
+import generateStyle from './styles.js'
+import generateComponentTheme from './theme.js'
 import type { TableColHeaderProps } from './props'
-import { allowedProps } from './props'
+import { allowedProps } from './props.js'
 
 /**
 ---
@@ -46,6 +46,7 @@ id: Table.ColHeader
 **/
 @withStyle(generateStyle, generateComponentTheme)
 class ColHeader extends Component<TableColHeaderProps> {
+  static displayName = 'ColHeader'
   static readonly componentId = 'Table.ColHeader'
 
   static allowedProps = allowedProps

package/src/Table/v1/Head/index.tsx

@@ -33,14 +33,14 @@ import { warn } from '@instructure/console'
 
 import { withStyle } from '@instructure/emotion'
 
-import generateStyle from './styles'
-import generateComponentTheme from './theme'
+import generateStyle from './styles.js'
+import generateComponentTheme from './theme.js'
 
 import type { TableColHeaderProps } from '../ColHeader/props'
 import type { TableHeadProps } from './props'
 import type { RowChild } from '../props'
-import { allowedProps } from './props'
-import TableContext from '../TableContext'
+import { allowedProps } from './props.js'
+import TableContext from '../TableContext.js'
 
 /**
 ---
@@ -50,6 +50,7 @@ id: Table.Head
 **/
 @withStyle(generateStyle, generateComponentTheme)
 class Head extends Component<TableHeadProps> {
+  static displayName = 'Head'
   static readonly componentId = 'Table.Head'
   static contextType = TableContext
   declare context: ContextType<typeof TableContext>

package/src/Table/v1/Head/props.ts

@@ -28,7 +28,7 @@ import type {
   TableHeadTheme
 } from '@instructure/shared-types'
 import type { WithStyleProps, ComponentStyle } from '@instructure/emotion'
-import { RowChild } from '../props'
+import { RowChild } from '../props.js'
 
 type TableHeadOwnProps = {
   /**

package/src/Table/v1/Row/index.tsx

@@ -35,12 +35,12 @@ import { View } from '@instructure/ui-view/v11_6'
 
 import { withStyle } from '@instructure/emotion'
 
-import generateStyle from './styles'
-import generateComponentTheme from './theme'
+import generateStyle from './styles.js'
+import generateComponentTheme from './theme.js'
 
 import type { TableRowProps } from './props'
-import { allowedProps } from './props'
-import TableContext from '../TableContext'
+import { allowedProps } from './props.js'
+import TableContext from '../TableContext.js'
 
 /**
 ---
@@ -50,6 +50,7 @@ id: Table.Row
 **/
 @withStyle(generateStyle, generateComponentTheme)
 class Row extends Component<TableRowProps> {
+  static displayName = 'Row'
   static readonly componentId = 'Table.Row'
   static contextType = TableContext
   declare context: ContextType<typeof TableContext>

package/src/Table/v1/RowHeader/index.tsx

@@ -29,11 +29,11 @@ import { View } from '@instructure/ui-view/v11_6'
 
 import { withStyle } from '@instructure/emotion'
 
-import generateStyle from './styles'
-import generateComponentTheme from './theme'
+import generateStyle from './styles.js'
+import generateComponentTheme from './theme.js'
 import type { TableRowHeaderProps } from './props'
-import { allowedProps } from './props'
-import TableContext from '../TableContext'
+import { allowedProps } from './props.js'
+import TableContext from '../TableContext.js'
 
 /**
 ---
@@ -43,6 +43,7 @@ id: Table.RowHeader
 **/
 @withStyle(generateStyle, generateComponentTheme)
 class RowHeader extends Component<TableRowHeaderProps> {
+  static displayName = 'RowHeader'
   static readonly componentId = 'Table.RowHeader'
   static contextType = TableContext
   declare context: ContextType<typeof TableContext>

package/src/Table/v1/index.tsx

@@ -30,20 +30,20 @@ import { ScreenReaderContent } from '@instructure/ui-a11y-content'
 
 import { withStyle } from '@instructure/emotion'
 
-import generateStyle from './styles'
-import generateComponentTheme from './theme'
+import generateStyle from './styles.js'
+import generateComponentTheme from './theme.js'
 
-import { Head } from './Head'
-import { Body } from './Body'
-import { Row } from './Row'
-import { ColHeader } from './ColHeader'
-import { RowHeader } from './RowHeader'
-import { Cell } from './Cell'
+import { Head } from './Head/index.js'
+import { Body } from './Body/index.js'
+import { Row } from './Row/index.js'
+import { ColHeader } from './ColHeader/index.js'
+import { RowHeader } from './RowHeader/index.js'
+import { Cell } from './Cell/index.js'
 
 import type { TableProps } from './props'
 
-import { allowedProps } from './props'
-import TableContext from './TableContext'
+import { allowedProps } from './props.js'
+import TableContext from './TableContext.js'
 import { error } from '@instructure/console'
 
 /**
@@ -53,6 +53,7 @@ category: components
 **/
 @withStyle(generateStyle, generateComponentTheme)
 class Table extends Component<TableProps> {
+  static displayName = 'Table'
   static readonly componentId = 'Table'
 
   static allowedProps = allowedProps

package/src/Table/v2/Body/index.tsx

@@ -34,10 +34,10 @@ import { safeCloneElement, omitProps } from '@instructure/ui-react-utils'
 import { View } from '@instructure/ui-view/latest'
 import { withStyleNew } from '@instructure/emotion'
 
-import generateStyle from './styles'
+import generateStyle from './styles.js'
 import type { TableBodyProps } from './props'
-import { allowedProps } from './props'
-import TableContext from '../TableContext'
+import { allowedProps } from './props.js'
+import TableContext from '../TableContext.js'
 
 /**
 ---
@@ -47,6 +47,7 @@ id: Table.Body
 **/
 @withStyleNew(generateStyle)
 class Body extends Component<TableBodyProps> {
+  static displayName = 'Body'
   static readonly componentId = 'Table.Body'
   static contextType = TableContext
   declare context: ContextType<typeof TableContext>

package/src/Table/v2/Cell/index.tsx

@@ -29,10 +29,10 @@ import { View } from '@instructure/ui-view/latest'
 
 import { withStyleNew } from '@instructure/emotion'
 
-import generateStyle from './styles'
+import generateStyle from './styles.js'
 import type { TableCellProps } from './props'
-import { allowedProps } from './props'
-import TableContext from '../TableContext'
+import { allowedProps } from './props.js'
+import TableContext from '../TableContext.js'
 
 /**
 ---
@@ -42,6 +42,7 @@ id: Table.Cell
 **/
 @withStyleNew(generateStyle)
 class Cell extends Component<TableCellProps> {
+  static displayName = 'Cell'
   static readonly componentId = 'Table.Cell'
   static contextType = TableContext
   declare context: ContextType<typeof TableContext>

package/src/Table/v2/ColHeader/index.tsx

@@ -28,9 +28,9 @@ import { omitProps, callRenderProp } from '@instructure/ui-react-utils'
 
 import { withStyleNew } from '@instructure/emotion'
 
-import generateStyle from './styles'
+import generateStyle from './styles.js'
 import type { TableColHeaderProps } from './props'
-import { allowedProps } from './props'
+import { allowedProps } from './props.js'
 import {
   ChevronsUpDownInstUIIcon,
   ChevronUpInstUIIcon,
@@ -45,6 +45,7 @@ id: Table.ColHeader
 **/
 @withStyleNew(generateStyle)
 class ColHeader extends Component<TableColHeaderProps> {
+  static displayName = 'ColHeader'
   static readonly componentId = 'Table.ColHeader'
 
   static allowedProps = allowedProps