@perses-dev/components 0.50.3 → 0.51.0-beta.1

package/dist/cjs/LineChart/LineChart.js

@@ -45,7 +45,6 @@ const _utils = require("../utils");
     _renderers.CanvasRenderer
 ]);
 const LineChart = /*#__PURE__*/ (0, _react.forwardRef)(function LineChart({ height, data, yAxis, format, grid, legend, tooltipConfig = _TimeSeriesTooltip.DEFAULT_TOOLTIP_CONFIG, noDataVariant = 'message', syncGroup, onDataZoom, onDoubleClick, __experimentalEChartsOptionsOverride }, ref) {
-    var _option_tooltip;
     const chartsTheme = (0, _context.useChartsTheme)();
     const chartRef = (0, _react.useRef)();
     const [showTooltip, setShowTooltip] = (0, _react.useState)(true);
@@ -84,10 +83,8 @@ const LineChart = /*#__PURE__*/ (0, _react.forwardRef)(function LineChart({ heig
                     }, 10);
                 }
                 if (onDataZoom === undefined || params.batch[0] === undefined) return;
-                var _params_batch__startValue;
-                const startIndex = (_params_batch__startValue = params.batch[0].startValue) !== null && _params_batch__startValue !== void 0 ? _params_batch__startValue : 0;
-                var _params_batch__endValue;
-                const endIndex = (_params_batch__endValue = params.batch[0].endValue) !== null && _params_batch__endValue !== void 0 ? _params_batch__endValue : data.xAxis.length - 1;
+                const startIndex = params.batch[0].startValue ?? 0;
+                const endIndex = params.batch[0].endValue ?? data.xAxis.length - 1;
                 const xAxisStartValue = data.xAxis[startIndex];
                 const xAxisEndValue = data.xAxis[endIndex];
                 if (xAxisStartValue !== undefined && xAxisEndValue !== undefined) {
@@ -115,8 +112,7 @@ const LineChart = /*#__PURE__*/ (0, _react.forwardRef)(function LineChart({ heig
         // The "chart" `noDataVariant` is only used when the `timeSeries` is an
         // empty array because a `null` value will throw an error.
         if (data.timeSeries === null || data.timeSeries.length === 0 && noDataVariant === 'message') return noDataOption;
-        var _data_rangeMs;
-        const rangeMs = (_data_rangeMs = data.rangeMs) !== null && _data_rangeMs !== void 0 ? _data_rangeMs : (0, _utils.getDateRange)(data.xAxis);
+        const rangeMs = data.rangeMs ?? (0, _utils.getDateRange)(data.xAxis);
         const option = {
             series: data.timeSeries,
             xAxis: {
@@ -250,7 +246,7 @@ const LineChart = /*#__PURE__*/ (0, _react.forwardRef)(function LineChart({ heig
             }
         },
         children: [
-            showTooltip === true && ((_option_tooltip = option.tooltip) === null || _option_tooltip === void 0 ? void 0 : _option_tooltip.showContent) === false && tooltipConfig.hidden !== true && /*#__PURE__*/ (0, _jsxruntime.jsx)(_TimeSeriesTooltip.LineChartTooltip, {
+            showTooltip === true && option.tooltip?.showContent === false && tooltipConfig.hidden !== true && /*#__PURE__*/ (0, _jsxruntime.jsx)(_TimeSeriesTooltip.LineChartTooltip, {
                 chartRef: chartRef,
                 chartData: data,
                 wrapLabels: tooltipConfig.wrapLabels,

package/dist/cjs/LinksEditor/LinksEditor.js

@@ -94,56 +94,47 @@ function LinkControl({ control, index }) {
                     /*#__PURE__*/ (0, _jsxruntime.jsx)(_reacthookform.Controller, {
                         control: control,
                         name: `panelDefinition.spec.links.${index}.url`,
-                        render: ({ field, fieldState })=>{
-                            var _fieldState_error;
-                            return /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.TextField, {
+                        render: ({ field, fieldState })=>/*#__PURE__*/ (0, _jsxruntime.jsx)(_material.TextField, {
                                 ...field,
                                 required: true,
                                 fullWidth: true,
                                 label: "URL",
                                 error: !!fieldState.error,
-                                helperText: (_fieldState_error = fieldState.error) === null || _fieldState_error === void 0 ? void 0 : _fieldState_error.message,
+                                helperText: fieldState.error?.message,
                                 onChange: (event)=>{
                                     field.onChange(event);
                                 }
-                            });
-                        }
+                            })
                     }),
                     /*#__PURE__*/ (0, _jsxruntime.jsx)(_reacthookform.Controller, {
                         control: control,
                         name: `panelDefinition.spec.links.${index}.name`,
-                        render: ({ field, fieldState })=>{
-                            var _fieldState_error;
-                            return /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.TextField, {
+                        render: ({ field, fieldState })=>/*#__PURE__*/ (0, _jsxruntime.jsx)(_material.TextField, {
                                 ...field,
                                 fullWidth: true,
                                 label: "Name",
                                 defaultValue: "",
                                 error: !!fieldState.error,
-                                helperText: (_fieldState_error = fieldState.error) === null || _fieldState_error === void 0 ? void 0 : _fieldState_error.message,
+                                helperText: fieldState.error?.message,
                                 onChange: (event)=>{
                                     field.onChange(event);
                                 }
-                            });
-                        }
+                            })
                     }),
                     /*#__PURE__*/ (0, _jsxruntime.jsx)(_reacthookform.Controller, {
                         control: control,
                         name: `panelDefinition.spec.links.${index}.tooltip`,
-                        render: ({ field, fieldState })=>{
-                            var _fieldState_error;
-                            return /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.TextField, {
+                        render: ({ field, fieldState })=>/*#__PURE__*/ (0, _jsxruntime.jsx)(_material.TextField, {
                                 ...field,
                                 fullWidth: true,
                                 label: "Tooltip",
                                 defaultValue: "",
                                 error: !!fieldState.error,
-                                helperText: (_fieldState_error = fieldState.error) === null || _fieldState_error === void 0 ? void 0 : _fieldState_error.message,
+                                helperText: fieldState.error?.message,
                                 onChange: (event)=>{
                                     field.onChange(event);
                                 }
-                            });
-                        }
+                            })
                     })
                 ]
             }),

package/dist/cjs/Overlay/Overlay.js

@@ -59,7 +59,7 @@ function LoadingOverlay(props) {
             height: '100%',
             alignItems: 'center',
             justifyContent: 'center',
-            padding: '0 10px'
+            px: 1
         },
         children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.Skeleton, {
             variant: variant,

package/dist/cjs/SettingsAutocomplete/SettingsAutocomplete.js

@@ -26,8 +26,7 @@ function SettingsAutocomplete({ options, renderInput = (params)=>/*#__PURE__*/ (
         ...params
     }), ...otherProps }) {
     const getOptionLabel = (option)=>{
-        var _option_label;
-        return (_option_label = option.label) !== null && _option_label !== void 0 ? _option_label : option.id;
+        return option.label ?? option.id;
     };
     // Note: this component currently is not virtualized because it is specific
     // to being used for settings, which generally have a pretty small list of

package/dist/cjs/StatChart/StatChart.js

@@ -50,16 +50,14 @@ const SERIES_NAME_MAX_FONT_SIZE = 30;
 const SERIES_NAME_FONT_WEIGHT = 400;
 const VALUE_FONT_WEIGHT = 700;
 const StatChart = (props)=>{
-    var _data_seriesData, _data_seriesData1;
     const { width, height, data, sparkline, showSeriesName, format, valueFontSize } = props;
     const chartsTheme = (0, _context.useChartsTheme)();
     const color = data.color;
     const formattedValue = (0, _formatStatChartValue.formatStatChartValue)(data.calculatedValue, format);
     const containerPadding = chartsTheme.container.padding.default;
-    var _data_seriesData_name;
     // calculate series name font size and height
     let seriesNameFontSize = (0, _calculateFontSize.useOptimalFontSize)({
-        text: (_data_seriesData_name = data === null || data === void 0 ? void 0 : (_data_seriesData = data.seriesData) === null || _data_seriesData === void 0 ? void 0 : _data_seriesData.name) !== null && _data_seriesData_name !== void 0 ? _data_seriesData_name : '',
+        text: data?.seriesData?.name ?? '',
         fontWeight: SERIES_NAME_FONT_WEIGHT,
         width,
         height: height * 0.125,
@@ -158,7 +156,7 @@ const StatChart = (props)=>{
             showSeriesName && /*#__PURE__*/ (0, _jsxruntime.jsx)(SeriesName, {
                 padding: containerPadding,
                 fontSize: seriesNameFontSize,
-                children: (_data_seriesData1 = data.seriesData) === null || _data_seriesData1 === void 0 ? void 0 : _data_seriesData1.name
+                children: data.seriesData?.name
             }),
             /*#__PURE__*/ (0, _jsxruntime.jsx)(Value, {
                 variant: "h3",
@@ -192,7 +190,7 @@ const SeriesName = (0, _material.styled)(_material.Typography, {
 const Value = (0, _material.styled)(_material.Typography, {
     shouldForwardProp: (prop)=>prop !== 'color' && prop !== 'padding' && prop !== 'fontSize' && prop !== 'sparkline'
 })(({ theme, color, padding, fontSize, sparkline })=>({
-        color: color !== null && color !== void 0 ? color : theme.palette.text.primary,
+        color: color ?? theme.palette.text.primary,
         fontSize: `${fontSize}px`,
         padding: sparkline ? `${padding}px ${padding}px 0 ${padding}px` : ` 0 ${padding}px`,
         whiteSpace: 'nowrap',

package/dist/cjs/StatChart/calculateFontSize.js

@@ -39,10 +39,8 @@ function useOptimalFontSize({ text, fontWeight, width, height, lineHeight, maxSi
         return Number(fontSizeOverride);
     }
     const textStyle = echartsTheme.textStyle;
-    var _Number;
-    const fontSize = (_Number = Number(textStyle === null || textStyle === void 0 ? void 0 : textStyle.fontSize)) !== null && _Number !== void 0 ? _Number : 12;
-    var _textStyle_fontFamily;
-    const fontFamily = (_textStyle_fontFamily = textStyle === null || textStyle === void 0 ? void 0 : textStyle.fontFamily) !== null && _textStyle_fontFamily !== void 0 ? _textStyle_fontFamily : 'Lato';
+    const fontSize = Number(textStyle?.fontSize) ?? 12;
+    const fontFamily = textStyle?.fontFamily ?? 'Lato';
     // set the font on the canvas context
     const fontStyle = `${fontWeight} ${fontSize}px ${fontFamily}`;
     ctx.font = fontStyle;

package/dist/cjs/StatusHistoryChart/StatusHistoryChart.js

@@ -45,7 +45,6 @@ const StatusHistoryChart = (props)=>{
     const { timeZone } = (0, _TimeZoneProvider.useTimeZone)();
     const chartsTheme = (0, _ChartsProvider.useChartsTheme)();
     const theme = (0, _material.useTheme)();
-    var _timeScale_rangeMs;
     const option = {
         tooltip: {
             appendToBody: true,
@@ -75,7 +74,7 @@ const StatusHistoryChart = (props)=>{
             },
             axisLabel: {
                 hideOverlap: true,
-                formatter: (0, _getformattedaxislabel.getFormattedStatusHistoryAxisLabel)((_timeScale_rangeMs = timeScale === null || timeScale === void 0 ? void 0 : timeScale.rangeMs) !== null && _timeScale_rangeMs !== void 0 ? _timeScale_rangeMs : 0, timeZone)
+                formatter: (0, _getformattedaxislabel.getFormattedStatusHistoryAxisLabel)(timeScale?.rangeMs ?? 0, timeZone)
             }
         },
         yAxis: {

package/dist/cjs/Table/Table.js

@@ -35,11 +35,11 @@ const DEFAULT_GET_ROW_ID = (data, index)=>{
 // does not do deep equality checking for objects and arrays.
 const DEFAULT_ROW_SELECTION = {};
 const DEFAULT_SORTING = [];
-function Table({ data, columns, cellConfigs, density = 'standard', defaultColumnWidth = _tablemodel.DEFAULT_COLUMN_WIDTH, checkboxSelection, onRowSelectionChange, onSortingChange, getCheckboxColor, getRowId = DEFAULT_GET_ROW_ID, rowSelection = DEFAULT_ROW_SELECTION, sorting = DEFAULT_SORTING, rowSelectionVariant = 'standard', ...otherProps }) {
+function Table({ data, columns, cellConfigs, density = 'standard', defaultColumnWidth = _tablemodel.DEFAULT_COLUMN_WIDTH, defaultColumnHeight = 'auto', checkboxSelection, onRowSelectionChange, onSortingChange, getCheckboxColor, getRowId = DEFAULT_GET_ROW_ID, rowSelection = DEFAULT_ROW_SELECTION, sorting = DEFAULT_SORTING, rowSelectionVariant = 'standard', ...otherProps }) {
     const theme = (0, _material.useTheme)();
     const handleRowSelectionChange = (rowSelectionUpdater)=>{
         const newRowSelection = typeof rowSelectionUpdater === 'function' ? rowSelectionUpdater(rowSelection) : rowSelectionUpdater;
-        onRowSelectionChange === null || onRowSelectionChange === void 0 ? void 0 : onRowSelectionChange(newRowSelection);
+        onRowSelectionChange?.(newRowSelection);
     };
     const handleRowSelectionEvent = (0, _react.useCallback)((table, row, isModified)=>{
         if (rowSelectionVariant === 'standard' || isModified) {
@@ -53,7 +53,7 @@ function Table({ data, columns, cellConfigs, density = 'standard', defaultColumn
                 table.toggleAllRowsSelected();
             } else {
                 // Focus the selected row.
-                onRowSelectionChange === null || onRowSelectionChange === void 0 ? void 0 : onRowSelectionChange({
+                onRowSelectionChange?.({
                     [row.id]: true
                 });
             }
@@ -64,14 +64,14 @@ function Table({ data, columns, cellConfigs, density = 'standard', defaultColumn
     ]);
     const handleCheckboxChange = (0, _react.useCallback)((e, table, row)=>{
         const nativePointerEvent = e.nativeEvent && (e.nativeEvent instanceof MouseEvent || e.nativeEvent instanceof KeyboardEvent) ? e.nativeEvent : undefined;
-        const isModifed = !!(nativePointerEvent === null || nativePointerEvent === void 0 ? void 0 : nativePointerEvent.metaKey) || !!(nativePointerEvent === null || nativePointerEvent === void 0 ? void 0 : nativePointerEvent.shiftKey);
+        const isModifed = !!nativePointerEvent?.metaKey || !!nativePointerEvent?.shiftKey;
         handleRowSelectionEvent(table, row, isModifed);
     }, [
         handleRowSelectionEvent
     ]);
     const handleSortingChange = (sortingUpdater)=>{
         const newSorting = typeof sortingUpdater === 'function' ? sortingUpdater(sorting) : sortingUpdater;
-        onSortingChange === null || onSortingChange === void 0 ? void 0 : onSortingChange(newSorting);
+        onSortingChange?.(newSorting);
     };
     const checkboxColumn = (0, _react.useMemo)(()=>{
         return {
@@ -93,7 +93,7 @@ function Table({ data, columns, cellConfigs, density = 'standard', defaultColumn
                     onChange: (e)=>{
                         handleCheckboxChange(e, table, row);
                     },
-                    color: getCheckboxColor === null || getCheckboxColor === void 0 ? void 0 : getCheckboxColor(row.original),
+                    color: getCheckboxColor?.(row.original),
                     density: density
                 });
             },
@@ -145,6 +145,7 @@ function Table({ data, columns, cellConfigs, density = 'standard', defaultColumn
         ...otherProps,
         density: density,
         defaultColumnWidth: defaultColumnWidth,
+        defaultColumnHeight: defaultColumnHeight,
         onRowClick: handleRowClick,
         rows: table.getRowModel().rows,
         columns: table.getAllFlatColumns(),

package/dist/cjs/Table/TableCell.js

@@ -39,7 +39,7 @@ const StyledMuiTableCell = (0, _material.styled)(_material.TableCell)(({ theme }
             borderRadius: 0
         }
     }));
-function TableCell({ children, density, variant, width, focusState = 'none', onFocusTrigger, isFirstColumn, isLastColumn, description, align, color, backgroundColor, ...otherProps }) {
+function TableCell({ children, density, variant, width, defaultColumnHeight, focusState = 'none', onFocusTrigger, isFirstColumn, isLastColumn, description, align, color, backgroundColor, ...otherProps }) {
     const theme = (0, _material.useTheme)();
     const elRef = (0, _react.useRef)();
     const isHeader = variant === 'head';
@@ -51,9 +51,8 @@ function TableCell({ children, density, variant, width, focusState = 'none', onF
         focusState
     ]);
     const handleFocus = (e)=>{
-        var _e_currentTarget;
         // From https://zellwk.com/blog/keyboard-focusable-elements/
-        const nestedFocusTarget = (_e_currentTarget = e.currentTarget) === null || _e_currentTarget === void 0 ? void 0 : _e_currentTarget.querySelector('a[href], button, input, textarea, select, details,[role="button"]');
+        const nestedFocusTarget = e.currentTarget?.querySelector('a[href], button, input, textarea, select, details,[role="button"]');
         if (nestedFocusTarget) {
             // If the cell has a focusable child, focus it instead. Mostly used for
             // checkbox cells, but could have other uses.
@@ -66,7 +65,7 @@ function TableCell({ children, density, variant, width, focusState = 'none', onF
         // plays with the triggering of focus with keyboard interactions.
         // These report that a focus event happened, so we can adjust the current
         // tabindex and focuses to the right cell.
-        onFocusTrigger === null || onFocusTrigger === void 0 ? void 0 : onFocusTrigger(e);
+        onFocusTrigger?.(e);
     };
     return /*#__PURE__*/ (0, _jsxruntime.jsx)(StyledMuiTableCell, {
         ...otherProps,
@@ -93,7 +92,7 @@ function TableCell({ children, density, variant, width, focusState = 'none', onF
                 minWidth: '100%',
                 whiteSpace: 'nowrap',
                 overflow: 'visible',
-                backgroundColor: `${backgroundColor !== null && backgroundColor !== void 0 ? backgroundColor : theme.palette.background.default} !important`,
+                backgroundColor: `${backgroundColor ?? theme.palette.background.default} !important`,
                 outline: `solid 1px ${theme.palette.info.main}`,
                 outlineOffset: '-1px'
             }
@@ -103,8 +102,10 @@ function TableCell({ children, density, variant, width, focusState = 'none', onF
             id: "original-cell",
             sx: {
                 ...(0, _tablemodel.getTableCellLayout)(theme, density, {
+                    isHeader,
                     isLastColumn,
-                    isFirstColumn
+                    isFirstColumn,
+                    defaultColumnHeight
                 }),
                 position: 'relative',
                 // Text truncation. Currently enforced on all cells. We may control
@@ -118,8 +119,8 @@ function TableCell({ children, density, variant, width, focusState = 'none', onF
                 flexDirection: 'inherit'
             },
             style: {
-                backgroundColor: backgroundColor !== null && backgroundColor !== void 0 ? backgroundColor : 'inherit',
-                color: color !== null && color !== void 0 ? color : 'inherit'
+                backgroundColor: backgroundColor ?? 'inherit',
+                color: color ?? 'inherit'
             },
             title: description,
             "aria-label": description,

package/dist/cjs/Table/VirtualizedTable.js

@@ -33,7 +33,7 @@ const _TableHeaderCell = require("./TableHeaderCell");
 const _TableCell = require("./TableCell");
 const _VirtualizedTableContainer = require("./VirtualizedTableContainer");
 const _useVirtualizedTableKeyboardNav = require("./hooks/useVirtualizedTableKeyboardNav");
-function VirtualizedTable({ width, height, density, defaultColumnWidth, onRowClick, onRowMouseOver, onRowMouseOut, rows, columns, headers, cellConfigs }) {
+function VirtualizedTable({ width, height, density, defaultColumnWidth, defaultColumnHeight, onRowClick, onRowMouseOver, onRowMouseOut, rows, columns, headers, cellConfigs }) {
     const virtuosoRef = (0, _react.useRef)(null);
     // Use a ref for these values because they are only needed for keyboard
     // focus interactions and setting them on state will lead to a significant
@@ -86,10 +86,10 @@ function VirtualizedTable({ width, height, density, defaultColumnWidth, onRowCli
                     onClick: (e)=>onRowClick(e, row.id),
                     density: density,
                     onMouseOver: (e)=>{
-                        onRowMouseOver === null || onRowMouseOver === void 0 ? void 0 : onRowMouseOver(e, rowEventOpts);
+                        onRowMouseOver?.(e, rowEventOpts);
                     },
                     onMouseOut: (e)=>{
-                        onRowMouseOut === null || onRowMouseOut === void 0 ? void 0 : onRowMouseOut(e, rowEventOpts);
+                        onRowMouseOut?.(e, rowEventOpts);
                     }
                 });
             },
@@ -123,7 +123,6 @@ function VirtualizedTable({ width, height, density, defaultColumnWidth, onRowCli
                         return /*#__PURE__*/ (0, _jsxruntime.jsx)(_TableRow.TableRow, {
                             density: density,
                             children: headerGroup.headers.map((header, i, headers)=>{
-                                var _column_columnDef_meta, _column_columnDef_meta1;
                                 const column = header.column;
                                 const position = {
                                     row: 0,
@@ -136,10 +135,11 @@ function VirtualizedTable({ width, height, density, defaultColumnWidth, onRowCli
                                     sortDirection: typeof isSorted === 'string' ? isSorted : undefined,
                                     nextSortDirection: typeof nextSorting === 'string' ? nextSorting : undefined,
                                     width: column.getSize() || defaultColumnWidth,
-                                    align: (_column_columnDef_meta = column.columnDef.meta) === null || _column_columnDef_meta === void 0 ? void 0 : _column_columnDef_meta.align,
+                                    defaultColumnHeight: defaultColumnHeight,
+                                    align: column.columnDef.meta?.align,
                                     variant: "head",
                                     density: density,
-                                    description: (_column_columnDef_meta1 = column.columnDef.meta) === null || _column_columnDef_meta1 === void 0 ? void 0 : _column_columnDef_meta1.headerDescription,
+                                    description: column.columnDef.meta?.headerDescription,
                                     focusState: getFocusState(position),
                                     onFocusTrigger: ()=>keyboardNav.onCellFocus(position),
                                     isFirstColumn: i === 0,
@@ -158,17 +158,16 @@ function VirtualizedTable({ width, height, density, defaultColumnWidth, onRowCli
                 }
                 return /*#__PURE__*/ (0, _jsxruntime.jsx)(_jsxruntime.Fragment, {
                     children: row.getVisibleCells().map((cell, i, cells)=>{
-                        var _cell_column_columnDef_meta, _cell_column_columnDef_meta1;
                         const position = {
                             // Add 1 to the row index because the header is row 0
                             row: index + 1,
                             column: i
                         };
                         const cellContext = cell.getContext();
-                        const cellConfig = cellConfigs === null || cellConfigs === void 0 ? void 0 : cellConfigs[cellContext.cell.id];
+                        const cellConfig = cellConfigs?.[cellContext.cell.id];
                         const cellRenderFn = cell.column.columnDef.cell;
                         const cellContent = typeof cellRenderFn === 'function' ? cellRenderFn(cellContext) : null;
-                        const cellDescriptionDef = (_cell_column_columnDef_meta = cell.column.columnDef.meta) === null || _cell_column_columnDef_meta === void 0 ? void 0 : _cell_column_columnDef_meta.cellDescription;
+                        const cellDescriptionDef = cell.column.columnDef.meta?.cellDescription;
                         let description = undefined;
                         if (typeof cellDescriptionDef === 'function') {
                             // If the cell description is a function, set the value using
@@ -180,21 +179,21 @@ function VirtualizedTable({ width, height, density, defaultColumnWidth, onRowCli
                             // cell content.
                             description = cellContent;
                         }
-                        var _cellConfig_textColor, _cellConfig_backgroundColor;
                         return /*#__PURE__*/ (0, _jsxruntime.jsx)(_TableCell.TableCell, {
                             "data-testid": cell.id,
-                            title: description || (cellConfig === null || cellConfig === void 0 ? void 0 : cellConfig.text) || cellContent,
+                            title: description || cellConfig?.text || cellContent,
                             width: cell.column.getSize() || defaultColumnWidth,
-                            align: (_cell_column_columnDef_meta1 = cell.column.columnDef.meta) === null || _cell_column_columnDef_meta1 === void 0 ? void 0 : _cell_column_columnDef_meta1.align,
+                            defaultColumnHeight: defaultColumnHeight,
+                            align: cell.column.columnDef.meta?.align,
                             density: density,
                             focusState: getFocusState(position),
                             onFocusTrigger: ()=>keyboardNav.onCellFocus(position),
                             isFirstColumn: i === 0,
                             isLastColumn: i === cells.length - 1,
                             description: description,
-                            color: (_cellConfig_textColor = cellConfig === null || cellConfig === void 0 ? void 0 : cellConfig.textColor) !== null && _cellConfig_textColor !== void 0 ? _cellConfig_textColor : undefined,
-                            backgroundColor: (_cellConfig_backgroundColor = cellConfig === null || cellConfig === void 0 ? void 0 : cellConfig.backgroundColor) !== null && _cellConfig_backgroundColor !== void 0 ? _cellConfig_backgroundColor : undefined,
-                            children: (cellConfig === null || cellConfig === void 0 ? void 0 : cellConfig.text) || cellContent
+                            color: cellConfig?.textColor ?? undefined,
+                            backgroundColor: cellConfig?.backgroundColor ?? undefined,
+                            children: cellConfig?.text || cellContent
                         }, cell.id);
                     })
                 });

package/dist/cjs/Table/hooks/useTableKeyboardNav.js

@@ -78,7 +78,7 @@ function useTableKeyboardNav({ maxRows, maxColumns, onActiveCellChange }) {
                     column: nextColumn,
                     row: nextRow
                 };
-                const newPosition = (onActiveCellChange === null || onActiveCellChange === void 0 ? void 0 : onActiveCellChange(e, curActiveCell, defaultNewPosition)) || defaultNewPosition;
+                const newPosition = onActiveCellChange?.(e, curActiveCell, defaultNewPosition) || defaultNewPosition;
                 if (newPosition.row === curActiveCell.row && newPosition.column === curActiveCell.column) {
                     // Return original to avoid creating a new object if nothing
                     // changed.

package/dist/cjs/Table/hooks/useVirtualizedTableKeyboardNav.js

@@ -28,14 +28,12 @@ function useVirtualizedTableKeyboardNav({ visibleRange, virtualTable, maxRows, m
         onActiveCellChange: (e, currentPosition, defaultNewPosition)=>{
             const key = e.key;
             const defaultValueChanged = defaultNewPosition && (currentPosition.column !== defaultNewPosition.column || currentPosition.row !== defaultNewPosition.row);
-            var _defaultNewPosition_row;
-            const nextRow = (_defaultNewPosition_row = defaultNewPosition === null || defaultNewPosition === void 0 ? void 0 : defaultNewPosition.row) !== null && _defaultNewPosition_row !== void 0 ? _defaultNewPosition_row : currentPosition.row;
+            const nextRow = defaultNewPosition?.row ?? currentPosition.row;
             if (key === 'ArrowDown' && defaultValueChanged) {
                 // Use default cell position. Shift the virtual table scroll position
                 // when needed to make the active cell visible.
                 if (nextRow - 1 < visibleRange.current.startIndex || nextRow - 1 > visibleRange.current.endIndex) {
-                    var _virtualTable_current;
-                    (_virtualTable_current = virtualTable.current) === null || _virtualTable_current === void 0 ? void 0 : _virtualTable_current.scrollToIndex({
+                    virtualTable.current?.scrollToIndex({
                         index: nextRow - 1,
                         align: 'end'
                     });
@@ -44,28 +42,25 @@ function useVirtualizedTableKeyboardNav({ visibleRange, virtualTable, maxRows, m
                 // Use default cell position. Shift the virtual table scroll position
                 // when needed to make the active cell visible.
                 if (nextRow - 1 < visibleRange.current.startIndex || nextRow - 1 > visibleRange.current.endIndex) {
-                    var _virtualTable_current1;
-                    (_virtualTable_current1 = virtualTable.current) === null || _virtualTable_current1 === void 0 ? void 0 : _virtualTable_current1.scrollToIndex({
+                    virtualTable.current?.scrollToIndex({
                         index: nextRow - 1,
                         align: 'start'
                     });
                 }
             } else if (defaultValueChanged && (key === 'Home' || key === 'End')) {
-                var // Use default cell position. Shift the virtual table scroll position
+                // Use default cell position. Shift the virtual table scroll position
                 // when needed to make the active cell visible.
-                _virtualTable_current2;
-                (_virtualTable_current2 = virtualTable.current) === null || _virtualTable_current2 === void 0 ? void 0 : _virtualTable_current2.scrollToIndex({
+                virtualTable.current?.scrollToIndex({
                     index: Math.max(nextRow - 1, 0),
                     align: 'start'
                 });
             } else if (key === 'PageDown') {
-                var _virtualTable_current3;
                 // Full handling of logic for `PageDown` because there is no default.
                 e.preventDefault();
                 let nextRow = currentPosition.row;
                 // Add 1 to account for header
                 nextRow = Math.min(maxRows - 1, visibleRange.current.endIndex + 1);
-                (_virtualTable_current3 = virtualTable.current) === null || _virtualTable_current3 === void 0 ? void 0 : _virtualTable_current3.scrollToIndex({
+                virtualTable.current?.scrollToIndex({
                     index: nextRow - 1,
                     align: 'start'
                 });
@@ -74,12 +69,11 @@ function useVirtualizedTableKeyboardNav({ visibleRange, virtualTable, maxRows, m
                     column: currentPosition.column
                 };
             } else if (key === 'PageUp') {
-                var _virtualTable_current4;
                 // Full handling of logic for `PageUp` because there is no default.
                 let nextRow = currentPosition.row;
                 // Minus 1 to account for header
                 nextRow = Math.max(0, visibleRange.current.startIndex - 1);
-                (_virtualTable_current4 = virtualTable.current) === null || _virtualTable_current4 === void 0 ? void 0 : _virtualTable_current4.scrollToIndex({
+                virtualTable.current?.scrollToIndex({
                     index: nextRow - 1,
                     align: 'end'
                 });

package/dist/cjs/Table/model/table-model.js

@@ -21,6 +21,9 @@ function _export(target, all) {
     });
 }
 _export(exports, {
+    DEFAULT_COLUMN_HEIGHT: function() {
+        return DEFAULT_COLUMN_HEIGHT;
+    },
     DEFAULT_COLUMN_WIDTH: function() {
         return DEFAULT_COLUMN_WIDTH;
     },
@@ -32,14 +35,15 @@ _export(exports, {
     }
 });
 const DEFAULT_COLUMN_WIDTH = 150;
+const DEFAULT_COLUMN_HEIGHT = 40;
 function calculateTableCellHeight(lineHeight, paddingY) {
     // Doing a bunch of math to enforce height to avoid weirdness with mismatched
     // heights based on customization of cell contents.
-    const lineHeightNum = typeof lineHeight === 'string' ? parseInt(lineHeight, 10) : lineHeight !== null && lineHeight !== void 0 ? lineHeight : 0;
+    const lineHeightNum = typeof lineHeight === 'string' ? parseInt(lineHeight, 10) : lineHeight ?? 0;
     const verticalPaddingNum = typeof paddingY === 'string' ? parseInt(paddingY, 10) : paddingY;
     return lineHeightNum + verticalPaddingNum * 2;
 }
-function getTableCellLayout(theme, density, { isLastColumn, isFirstColumn } = {}) {
+function getTableCellLayout(theme, density, { isHeader, isLastColumn, isFirstColumn, defaultColumnHeight } = {}) {
     // Density Standard
     let paddingY = theme.spacing(1);
     let basePaddingX = theme.spacing(1.25);
@@ -66,9 +70,10 @@ function getTableCellLayout(theme, density, { isLastColumn, isFirstColumn } = {}
         lineHeight = theme.typography.body1.lineHeight;
         fontSize = theme.typography.body1.fontSize;
     }
+    const height = isHeader || !defaultColumnHeight || defaultColumnHeight === 'auto' ? calculateTableCellHeight(lineHeight, paddingY) : defaultColumnHeight;
     return {
         padding: `${paddingY} ${paddingRight} ${paddingY} ${paddingLeft}`,
-        height: calculateTableCellHeight(lineHeight, paddingY),
+        height: height,
         fontSize: fontSize,
         lineHeight: lineHeight
     };