@fattureincloud/fic-design-system 0.7.8 → 0.7.9

package/dist/components/newTable/Table.d.ts

@@ -30,5 +30,5 @@ import { TableProps } from './types';
  * @param {function} renderEmptyState Render a custom empty state for the table's body
  * @param {function} onRowClick Callback called after a click on a row, returns the row
  */
-declare const Table: <T>({ data, columns, isSelectable, onRowSelectionChange, favorites, onFavoritesChange, toggles, onTogglesChange, rowSize, headerSize, isFavoritesSortable, isTogglesSortable, sortable, sortDescFirst, enableSettings, settingsDropdownConfig, rowActions, bulkActions, isLoading, allSelectedCTA, noPagination, pageSize: pageLength, listSize, paginationPreviousText, paginationNextText, onPaginationChange, uniqueId, onSort, renderEmptyState, onRowClick, }: TableProps<T>) => JSX.Element;
+declare const Table: <T>({ data, columns, isSelectable, onRowSelectionChange, favorites, onFavoritesChange, toggles, onTogglesChange, rowSize, headerSize, isFavoritesSortable, isTogglesSortable, sortable, sortDescFirst, enableSettings, settingsDropdownConfig, rowActions, bulkActions, isLoading, allSelectedCTA, noPagination, pageSize: pageLength, listSize, paginationPreviousText, paginationNextText, onPaginationChange, uniqueId, onSort, renderEmptyState, onRowClick, bodyHeight, totalPages, }: TableProps<T>) => JSX.Element;
 export default Table;

package/dist/components/newTable/components/body/Body.d.ts

@@ -1,11 +1,10 @@
 /// <reference types="react" />
 import { Row } from '@tanstack/react-table';
-import { CellProps } from 'react-table';
 import { TableProps } from '../../types';
-interface BodyProps<T> extends Pick<TableProps<T>, 'rowSize'> {
+interface BodyProps<T> extends Pick<TableProps<T>, 'rowSize' | 'bodyHeight'> {
     rows: Row<T>[];
     isLoading?: boolean;
-    onRowClick?: (row: Row<CellProps | T>) => void;
+    onRowClick?: (row: Row<T>) => void;
 }
-declare const Body: <T>({ rows, rowSize, isLoading, onRowClick }: BodyProps<T>) => JSX.Element;
+declare const Body: <T>({ rows, rowSize, isLoading, onRowClick, bodyHeight }: BodyProps<T>) => JSX.Element;
 export default Body;

package/dist/components/newTable/components/cell/customActionCell/CustomActionCell.d.ts

@@ -7,6 +7,8 @@ interface Props<T> extends ActionColumnDef<T> {
     isFavorite?: boolean;
     isToggled?: boolean;
     column: Column<T, unknown>;
+    maxWidth?: number;
+    minWidth?: number;
 }
-declare const CustomActionCell: <T>({ actionType, row, isFavorite, isToggled, onActionChange, rowActions, column, }: Props<T>) => JSX.Element;
+declare const CustomActionCell: <T>({ actionType, row, isFavorite, isToggled, onActionChange, rowActions, column, maxWidth, minWidth, }: Props<T>) => JSX.Element;
 export default CustomActionCell;

package/dist/components/newTable/components/cell/customCell/CustomCell.d.ts

@@ -8,5 +8,5 @@ declare type Props<CellProps> = {
     rowSize?: RowSize;
     onRowClick?: (row: Row<CellProps>) => void;
 } & CustomCellProps & AccessorColumnDef<CellProps> & ActionColumnDef<CellProps> & AdditionalColumnDef<CellProps>;
-declare const CustomCell: <CellProps>({ content, isEditable, tag, unitSymbol, headline, leadingIcon, avatar, actionType, row, rowSize, onActionChange, isFavorite, isToggled, hover, onChange, trailingMicroTag, minWidth, rowActions, context, onRowClick, }: Props<CellProps>) => JSX.Element;
+declare const CustomCell: <CellProps>({ content, isEditable, tag, unitSymbol, headline, leadingIcon, avatar, actionType, row, rowSize, onActionChange, isFavorite, isToggled, hover, onChange, trailingMicroTag, minWidth, rowActions, context, onRowClick, maxWidth, }: Props<CellProps>) => JSX.Element;
 export default CustomCell;

package/dist/components/newTable/components/cell/hooks/useCellValues.d.ts

@@ -10,6 +10,7 @@ interface CellValues<T> {
     values: CustomCellProps;
     onActionChange?: (id: string) => void;
     minWidth?: number;
+    maxWidth?: number;
     rowActions?: RowActions<T>;
 }
 declare const useCellValues: <T>(cell: TCell<T, unknown>, row: Row<T>) => CellValues<T>;

package/dist/components/newTable/components/cell/loadingCell/LoadingCell.d.ts

@@ -2,6 +2,7 @@
 interface LoadingCellProps {
     isActionCell?: boolean;
     minWidth?: number;
+    maxWidth?: number;
 }
-declare const LoadingCell: ({ isActionCell, minWidth }: LoadingCellProps) => JSX.Element;
+declare const LoadingCell: ({ isActionCell, minWidth, maxWidth }: LoadingCellProps) => JSX.Element;
 export default LoadingCell;

package/dist/components/newTable/components/cell/styled.d.ts

@@ -1,6 +1,7 @@
-export declare const Td: import("styled-components").StyledComponent<"td", import("styled-components").DefaultTheme, {
+export declare const Td: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {
     cellHasOnClick: boolean;
     minWidth?: number | undefined;
+    maxWidth?: number | undefined;
 }, never>;
 export declare const Wrapper: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
 export declare const LeadingIconContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;

package/dist/components/newTable/components/header/headerCell/styled.d.ts

@@ -3,6 +3,7 @@ export declare const TextHeaderCell: import("styled-components").StyledComponent
 export declare const Th: import("styled-components").StyledComponent<"td", import("styled-components").DefaultTheme, {
     size?: RowSize | undefined;
     minWidth?: number | undefined;
+    maxWidth?: number | undefined;
     sortable: boolean;
 }, never>;
 export declare const TextHeaderCellWrapper: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, {}, never>;

package/dist/components/newTable/components/header/hooks/useHeaderValues.d.ts

@@ -8,6 +8,7 @@ interface HeaderValues<T> {
     isSorted: boolean;
     isSortedDesc: string | null;
     minWidth?: number;
+    maxWidth?: number;
     tooltip?: TooltipProps;
 }
 declare const useHeaderValues: <T>(header: Header<T, unknown>) => HeaderValues<T>;

package/dist/components/newTable/components/row/styled.d.ts

@@ -1,5 +1,5 @@
 import { RowSize } from '../../types';
-export declare const TRow: import("styled-components").StyledComponent<"tr", import("styled-components").DefaultTheme, {
+export declare const TRow: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {
     mouseHover?: boolean | undefined;
     size?: RowSize | undefined;
     selected?: boolean | undefined;

package/dist/components/newTable/types.d.ts

@@ -38,6 +38,8 @@ export interface TableProps<T> {
     onPaginationChange?: (pagination: PaginationState) => void;
     renderEmptyState?: () => JSX.Element;
     onRowClick?: (row: Row<T>) => void;
+    bodyHeight?: number;
+    totalPages?: number;
 }
 interface SettingsDropdownConfig {
     settingsTooltip?: TooltipProps;
@@ -88,6 +90,7 @@ export declare type ActionColumnDef<T> = {
 export declare type AdditionalColumnDef<T> = {
     unitSymbol?: string;
     minWidth?: number;
+    maxWidth?: number;
     headerTooltip?: TooltipProps;
     customCell?: (row: Row<T>) => JSX.Element;
 };
@@ -107,6 +110,7 @@ export declare type ColumnsType<T> = ({
 interface BaseColumnsType<T> {
     key: keyof T | Lowercase<keyof typeof ActionType>;
     customCell?: () => JSX.Element;
+    maxWidth?: number;
 }
 interface CustomCellWithAvatar extends BasicCustomCell {
     avatar?: AvatarProps;

package/dist/components/pagination/Pagination.d.ts

@@ -10,6 +10,7 @@ import { PaginationProps } from './types';
  * @param {number} currentPage Used to set the current page number
  * @param {string} prevText Define previous label text
  * @param {string} nextText Define next label text
+ * @param {number} totalPages Define number of pages
  */
 declare const Pagination: (props: PaginationProps) => JSX.Element;
 export default Pagination;

package/dist/components/pagination/types.d.ts

@@ -15,6 +15,7 @@ export declare type PaginationProps = {
     currentPage: number;
     prevText: string;
     nextText: string;
+    totalPages?: number;
 };
 declare type PaginationNumbersStatus = 'normal' | 'hover' | 'active';
 declare type PaginationButtonsStatus = 'normal' | 'disabled';

package/dist/index.css

@@ -0,0 +1,128 @@
+.DS-ReactTable {
+  position: relative;
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  overflow: hidden;
+}
+
+.DS-ReactTable .DS-rt-table {
+  -webkit-box-flex: 1;
+  -ms-flex: 1;
+  flex: 1;
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  -webkit-box-align: stretch;
+  -ms-flex-align: stretch;
+  align-items: stretch;
+  width: 100%;
+  border-collapse: collapse;
+  overflow-x: auto;
+  overflow-y: hidden;
+}
+
+.DS-ReactTable .DS-rt-thead {
+  -webkit-box-flex: 1;
+  -ms-flex: 1 0 auto;
+  flex: 1 0 auto;
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  cursor: default;
+}
+
+.DS-ReactTable .DS-rt-thead .DS-rt-th {
+  position: relative;
+}
+.DS-ReactTable .DS-rt-thead .DS-rt-td {
+  line-height: normal;
+  position: relative;
+}
+
+.DS-ReactTable .DS-rt-thead .DS-rt-resizable-header:last-child {
+  overflow: hidden;
+}
+.DS-ReactTable .DS-rt-thead .DS-rt-resizable-header-content {
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+.DS-ReactTable .DS-rt-thead.DS-header .DS-rt-th:after {
+  content: "";
+  display: block;
+  position: absolute;
+}
+
+.DS-ReactTable .DS-rt-tbody {
+  display: flex;
+  flex-direction: column;
+  overflow: auto;
+}
+
+.DS-ReactTable .DS-rt-tbody .DS-rt-tr-group {
+  flex: none;
+}
+
+.DS-ReactTable .DS-rt-tr-group {
+  -webkit-box-flex: 1;
+  -ms-flex: 1 0 auto;
+  flex: 1 0 auto;
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  -webkit-box-align: stretch;
+  -ms-flex-align: stretch;
+  align-items: stretch;
+  cursor: pointer;
+}
+
+.DS-ReactTable .DS-rt-tr {
+  flex: 1 0 auto;
+  display: inline-flex;
+  flex-direction: row;
+  flex-wrap: wrap;
+  align-content: center;
+  justify-content: center;
+  align-items: center;
+}
+
+.DS-ReactTable .DS-rt-th {
+  -webkit-box-flex: 1;
+  -ms-flex: 1;
+  flex: 1;
+  white-space: nowrap;
+  vertical-align: middle;
+  align-self: center;
+  overflow: hidden;
+}
+
+.DS-ReactTable .DS-rt-td {
+  -webkit-box-flex: 1;
+  -ms-flex: 1;
+  flex: 1;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  align-self: center;
+  overflow: hidden;
+}

package/dist/index.esm.css

@@ -0,0 +1,128 @@
+.DS-ReactTable {
+  position: relative;
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  overflow: hidden;
+}
+
+.DS-ReactTable .DS-rt-table {
+  -webkit-box-flex: 1;
+  -ms-flex: 1;
+  flex: 1;
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  -webkit-box-align: stretch;
+  -ms-flex-align: stretch;
+  align-items: stretch;
+  width: 100%;
+  border-collapse: collapse;
+  overflow-x: auto;
+  overflow-y: hidden;
+}
+
+.DS-ReactTable .DS-rt-thead {
+  -webkit-box-flex: 1;
+  -ms-flex: 1 0 auto;
+  flex: 1 0 auto;
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  cursor: default;
+}
+
+.DS-ReactTable .DS-rt-thead .DS-rt-th {
+  position: relative;
+}
+.DS-ReactTable .DS-rt-thead .DS-rt-td {
+  line-height: normal;
+  position: relative;
+}
+
+.DS-ReactTable .DS-rt-thead .DS-rt-resizable-header:last-child {
+  overflow: hidden;
+}
+.DS-ReactTable .DS-rt-thead .DS-rt-resizable-header-content {
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+.DS-ReactTable .DS-rt-thead.DS-header .DS-rt-th:after {
+  content: "";
+  display: block;
+  position: absolute;
+}
+
+.DS-ReactTable .DS-rt-tbody {
+  display: flex;
+  flex-direction: column;
+  overflow: auto;
+}
+
+.DS-ReactTable .DS-rt-tbody .DS-rt-tr-group {
+  flex: none;
+}
+
+.DS-ReactTable .DS-rt-tr-group {
+  -webkit-box-flex: 1;
+  -ms-flex: 1 0 auto;
+  flex: 1 0 auto;
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  -webkit-box-align: stretch;
+  -ms-flex-align: stretch;
+  align-items: stretch;
+  cursor: pointer;
+}
+
+.DS-ReactTable .DS-rt-tr {
+  flex: 1 0 auto;
+  display: inline-flex;
+  flex-direction: row;
+  flex-wrap: wrap;
+  align-content: center;
+  justify-content: center;
+  align-items: center;
+}
+
+.DS-ReactTable .DS-rt-th {
+  -webkit-box-flex: 1;
+  -ms-flex: 1;
+  flex: 1;
+  white-space: nowrap;
+  vertical-align: middle;
+  align-self: center;
+  overflow: hidden;
+}
+
+.DS-ReactTable .DS-rt-td {
+  -webkit-box-flex: 1;
+  -ms-flex: 1;
+  flex: 1;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  align-self: center;
+  overflow: hidden;
+}