@redis-ui/table 3.3.2 → 3.4.1

package/dist/Table/Table.types.d.ts

@@ -1,3 +1,4 @@
+import { ReactElement, ReactNode } from 'react';
 import { TableExpandableRowParams } from './plugins/ExpandableRowPlugin';
 import { TablePaginationParams } from './plugins/PaginationPlugin';
 import { TableRowSelectionParams } from './plugins/RowSelectionPlugin';
@@ -18,3 +19,7 @@ export interface TableProps<T extends object> extends TableSortingParams, TableC
 export type ColumnSizeUnit = 'fraction' | 'px' | 'rem';
 /** @deprecated use {@link ColumnSizeUnit} instead */
 export type CellSizingUnits = ColumnSizeUnit;
+export type CellContainerComponent = ({ children }: {
+    children: ReactNode;
+}) => ReactElement;
+export type ColumnCellContainer = 'flex' | 'ellipsis' | CellContainerComponent;

package/dist/Table/components/TableBodyCell/components/CellContainers/CellContainers.cjs

@@ -0,0 +1,21 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("../../../../../node_modules/react/jsx-runtime.cjs");
+const CellContainers_style = require("./CellContainers.style.cjs");
+const EllipsisContainer = (props) => jsxRuntime.jsxRuntimeExports.jsx(CellContainers_style.FlexContainer, {
+  children: jsxRuntime.jsxRuntimeExports.jsx(CellContainers_style.EllipsisContainer, {
+    ...props,
+    ellipsis: true,
+    tooltipOnEllipsis: true
+  })
+});
+const containers = {
+  flex: CellContainers_style.FlexContainer,
+  ellipsis: EllipsisContainer
+};
+const getCellContainer = (containerOrType) => {
+  if (!containerOrType) return void 0;
+  if (typeof containerOrType === "string") return containers[containerOrType];
+  return containerOrType;
+};
+exports.getCellContainer = getCellContainer;

package/dist/Table/components/TableBodyCell/components/CellContainers/CellContainers.d.ts

@@ -0,0 +1,2 @@
+import type { CellContainerComponent, ColumnCellContainer } from '../../../../Table.types';
+export declare const getCellContainer: (containerOrType: ColumnCellContainer | undefined) => CellContainerComponent | undefined;

package/dist/Table/components/TableBodyCell/components/CellContainers/CellContainers.js

@@ -0,0 +1,21 @@
+import { j as jsxRuntimeExports } from "../../../../../node_modules/react/jsx-runtime.js";
+import { FlexContainer, EllipsisContainer as EllipsisContainer$1 } from "./CellContainers.style.js";
+const EllipsisContainer = (props) => jsxRuntimeExports.jsx(FlexContainer, {
+  children: jsxRuntimeExports.jsx(EllipsisContainer$1, {
+    ...props,
+    ellipsis: true,
+    tooltipOnEllipsis: true
+  })
+});
+const containers = {
+  flex: FlexContainer,
+  ellipsis: EllipsisContainer
+};
+const getCellContainer = (containerOrType) => {
+  if (!containerOrType) return void 0;
+  if (typeof containerOrType === "string") return containers[containerOrType];
+  return containerOrType;
+};
+export {
+  getCellContainer
+};

package/dist/Table/components/TableBodyCell/components/CellContainers/CellContainers.style.cjs

@@ -0,0 +1,16 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const _styled = require("styled-components");
+const redisUiComponents = require("@redislabsdev/redis-ui-components");
+const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
+const _styled__default = /* @__PURE__ */ _interopDefault(_styled);
+const FlexContainer = _styled__default.default(redisUiComponents.FlexGroup).withConfig({
+  displayName: "CellContainersstyle__FlexContainer",
+  componentId: "RedisUI__sc-1w37zg2-0"
+})(["height:100%;width:100%;max-width:100%;overflow:hidden;svg{flex:none;}"]);
+const EllipsisContainer = _styled__default.default(redisUiComponents.Typography.Base).withConfig({
+  displayName: "CellContainersstyle__EllipsisContainer",
+  componentId: "RedisUI__sc-1w37zg2-1"
+})(["flex:0 1 auto;white-space:inherit;text-align:start;"]);
+exports.EllipsisContainer = EllipsisContainer;
+exports.FlexContainer = FlexContainer;

package/dist/Table/components/TableBodyCell/components/CellContainers/CellContainers.style.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+export declare const FlexContainer: import("styled-components").StyledComponent<({ gap, direction, align, justify, wrap, ...restProps }: import("@redislabsdev/redis-ui-components").FlexGroupProps) => import("react/jsx-runtime").JSX.Element, any, {}, never>;
+export declare const EllipsisContainer: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@redislabsdev/redis-ui-components").TypographyBaseProps & import("react").RefAttributes<HTMLElement>>, any, {}, never>;

package/dist/Table/components/TableBodyCell/components/CellContainers/CellContainers.style.js

@@ -0,0 +1,14 @@
+import _styled from "styled-components";
+import { FlexGroup, Typography } from "@redislabsdev/redis-ui-components";
+const FlexContainer = _styled(FlexGroup).withConfig({
+  displayName: "CellContainersstyle__FlexContainer",
+  componentId: "RedisUI__sc-1w37zg2-0"
+})(["height:100%;width:100%;max-width:100%;overflow:hidden;svg{flex:none;}"]);
+const EllipsisContainer = _styled(Typography.Base).withConfig({
+  displayName: "CellContainersstyle__EllipsisContainer",
+  componentId: "RedisUI__sc-1w37zg2-1"
+})(["flex:0 1 auto;white-space:inherit;text-align:start;"]);
+export {
+  EllipsisContainer,
+  FlexContainer
+};

package/dist/Table/components/TableBodyCell/components/CellContainers/CellContainers.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/Table/components/TableBodyCell/components/Compose/Compose.cjs

@@ -3,14 +3,20 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("../../../../../node_modules/react/jsx-runtime.cjs");
 const redisUiComponents = require("@redislabsdev/redis-ui-components");
 const table_utils = require("../../../../utils/table.utils.cjs");
+const CellContainers = require("../CellContainers/CellContainers.cjs");
 const Table_style = require("../../../../Table.style.cjs");
 const TableBodyCellCompose = redisUiComponents.forwardRefWithGenerics(({
   cell,
   style,
+  children,
   ...restProps
 }, ref) => {
-  var _a, _b;
-  const columnCellProps = (_b = (_a = cell.column.columnDef).getCellProps) == null ? void 0 : _b.call(_a, cell.row.original, cell);
+  const {
+    getCellProps,
+    cellContainer
+  } = cell.column.columnDef;
+  const columnCellProps = getCellProps == null ? void 0 : getCellProps(cell.row.original, cell);
+  const CellContainer = CellContainers.getCellContainer(cellContainer);
   return jsxRuntime.jsxRuntimeExports.jsx(Table_style.TableBodyCell, {
     ...restProps,
     ...columnCellProps,
@@ -19,7 +25,10 @@ const TableBodyCellCompose = redisUiComponents.forwardRefWithGenerics(({
       width: table_utils.getWidth(cell.column),
       ...style,
       ...columnCellProps == null ? void 0 : columnCellProps.style
-    }
+    },
+    children: CellContainer ? jsxRuntime.jsxRuntimeExports.jsx(CellContainer, {
+      children
+    }) : children
   });
 });
 exports.TableBodyCellCompose = TableBodyCellCompose;

package/dist/Table/components/TableBodyCell/components/Compose/Compose.js

@@ -1,14 +1,20 @@
 import { j as jsxRuntimeExports } from "../../../../../node_modules/react/jsx-runtime.js";
 import { forwardRefWithGenerics } from "@redislabsdev/redis-ui-components";
 import { getWidth } from "../../../../utils/table.utils.js";
+import { getCellContainer } from "../CellContainers/CellContainers.js";
 import { TableBodyCell } from "../../../../Table.style.js";
 const TableBodyCellCompose = forwardRefWithGenerics(({
   cell,
   style,
+  children,
   ...restProps
 }, ref) => {
-  var _a, _b;
-  const columnCellProps = (_b = (_a = cell.column.columnDef).getCellProps) == null ? void 0 : _b.call(_a, cell.row.original, cell);
+  const {
+    getCellProps,
+    cellContainer
+  } = cell.column.columnDef;
+  const columnCellProps = getCellProps == null ? void 0 : getCellProps(cell.row.original, cell);
+  const CellContainer = getCellContainer(cellContainer);
   return jsxRuntimeExports.jsx(TableBodyCell, {
     ...restProps,
     ...columnCellProps,
@@ -17,7 +23,10 @@ const TableBodyCellCompose = forwardRefWithGenerics(({
       width: getWidth(cell.column),
       ...style,
       ...columnCellProps == null ? void 0 : columnCellProps.style
-    }
+    },
+    children: CellContainer ? jsxRuntimeExports.jsx(CellContainer, {
+      children
+    }) : children
   });
 });
 export {

package/dist/Table/tanStackExtendedTypes.d.ts

@@ -1,7 +1,7 @@
 import '@tanstack/table-core';
 import { Cell, Header } from '@tanstack/react-table';
 import { HTMLAttributes } from 'react';
-import { ColumnSizeUnit } from './Table.types';
+import { ColumnCellContainer, ColumnSizeUnit } from './Table.types';
 declare module '@tanstack/table-core' {
     interface StringHeaderIdentifier {
         isHeaderHidden?: boolean;
@@ -9,6 +9,7 @@ declare module '@tanstack/table-core' {
         sizeUnit?: ColumnSizeUnit;
         getHeaderCellProps?: VoidFunction;
         getCellProps?: VoidFunction;
+        cellContainer?: ColumnCellContainer;
     }
     interface IdIdentifier<TData, TValue> {
         isHeaderHidden?: boolean;
@@ -16,5 +17,6 @@ declare module '@tanstack/table-core' {
         sizeUnit?: ColumnSizeUnit;
         getHeaderCellProps?: (header: Header<TData, unknown>) => HTMLAttributes<HTMLTableCellElement> & Record<string, unknown>;
         getCellProps?: (data: TData, cell: Cell<TData, unknown>) => HTMLAttributes<HTMLTableCellElement> & Record<string, unknown>;
+        cellContainer?: ColumnCellContainer;
     }
 }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@redis-ui/table",
   "license": "UNLICENSED",
-  "version": "3.3.2",
+  "version": "3.4.1",
   "type": "module",
   "publishConfig": {
     "registry": "https://npm.pkg.github.com/"
@@ -32,7 +32,7 @@
     "@redis-ui/styles": "^14.4.2"
   },
   "dependencies": {
-    "@redis-ui/components": "^41.5.0",
+    "@redis-ui/components": "^42.0.0",
     "@redis-ui/icons": "^6.6.0",
     "@tanstack/react-table": "^8.9.8",
     "type-fest": "^3.13.1"