@digital-ai/dot-components 1.21.2 → 2.0.0-rc.2

package/lib/components/table/TablePagination.d.ts

@@ -7,9 +7,9 @@ export interface TablePaginationProps extends CommonProps {
     /** Total number of rows (-1 if unknown) */
     count: number;
     /** Callback fired when the page is changed */
-    onChangePage: (newPage: number) => void;
+    onPageChange: (newPage: number) => void;
     /** Callback fired when the number of rows per page is changed */
-    onChangeRowsPerPage?: (event: ChangeEvent<HTMLTextAreaElement | HTMLInputElement>) => void;
+    onRowsPerPageChange?: (event: ChangeEvent<HTMLTextAreaElement | HTMLInputElement>) => void;
     /** The zero-based index of the current page */
     page?: number;
     /** The number of rows per page */
@@ -18,4 +18,4 @@ export interface TablePaginationProps extends CommonProps {
     typography: TypographyVariant;
 }
 /** This component wraps the TablePagination component from @material-ui. */
-export declare const DotTablePagination: ({ ariaLabel, className, count, "data-testid": dataTestId, onChangePage, onChangeRowsPerPage, page, rowsPerPage, typography, }: TablePaginationProps) => JSX.Element;
+export declare const DotTablePagination: ({ ariaLabel, className, count, "data-testid": dataTestId, onPageChange, onRowsPerPageChange, page, rowsPerPage, typography, }: TablePaginationProps) => JSX.Element;

package/lib/components/table/TableRow.styles.d.ts

@@ -1,2 +1,2 @@
 export declare const rootClassName = "dot-tr";
-export declare const StyledTableRowStyles: import("styled-components").StyledComponent<import("@material-ui/core/OverridableComponent").OverridableComponent<import("@material-ui/core").TableRowTypeMap<{}, "tr">>, any, {}, never>;
+export declare const StyledTableRowStyles: import("styled-components").StyledComponent<import("@mui/material/OverridableComponent").OverridableComponent<import("@mui/material").TableRowTypeMap<{}, "tr">>, any, {}, never>;

package/lib/components/table/TableSelectionToolbar.styles.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 export declare const rootClassName = "dot-table-selection-toolbar";
 export declare const StyledTableSelectionToolbar: import("styled-components").StyledComponent<({ ariaLabel, children, className, "data-testid": dataTestId, variant, }: import("../action-toolbar/ActionToolbar").DotActionBarProps) => JSX.Element, any, {}, never>;

package/lib/components/table/utils/helpers.d.ts

@@ -1,9 +1,7 @@
 import { ReactNode } from 'react';
 import { TypographyVariant } from '../../typography/Typography';
 import { TableRowProps } from '../Table';
-import { DotColumnHeader } from '../TableHeader';
-export declare const getFormattedTableCellValue: (value: unknown, typographyVariant: TypographyVariant) => ReactNode;
+export declare const getFormattedTableCellValue: (value: any, typographyVariant: TypographyVariant) => ReactNode;
 export declare const getContainerMaxHeightStyle: (stickyHeader?: boolean, maxHeight?: string) => string;
-export declare const checkIfActionColumnExist: (columns: DotColumnHeader[], tableData: TableRowProps[]) => boolean;
 export declare const getSelectedRowIds: (id: string, isChecked: boolean, selectedIds: string[]) => string[];
 export declare const getBulkSelectedRowIds: (isChecked: boolean, selectedIds: string[], pageData: TableRowProps[]) => string[];

package/lib/components/table/utils/models.d.ts

@@ -1,5 +1,5 @@
-import { TableRowProps } from '../Table';
 import { ReactNode } from 'react';
+import { TableRowProps } from '../Table';
 export declare type RowSelectionChangeHandler = (isChecked: boolean, rowId: string) => void;
 export declare type MultiSelectState = 'unchecked' | 'checked' | 'indeterminate';
 export declare type TableRowSelectChangeHandler = (isChecked: boolean, selectedTableRowIds: string[]) => void;

package/lib/components/tabs/Tabs.d.ts

@@ -1,7 +1,6 @@
-/// <reference types="react" />
 import { CommonProps } from '../CommonProps';
 export declare type TabsColor = 'primary' | 'secondary';
-export declare type TabsScrollButtons = 'auto' | 'desktop' | 'off' | 'on';
+export declare type TabsScrollButtons = 'auto' | boolean;
 export declare type TabsVariant = 'fullWidth' | 'scrollable' | 'standard';
 export interface TabProps extends CommonProps {
     /** If true, the tab will be disabled. */

package/lib/components/tabs/Tabs.styles.d.ts

@@ -1,2 +1,2 @@
 export declare const rootClassName = "dot-tabs";
-export declare const StyledTabs: import("styled-components").StyledComponent<import("@material-ui/core/OverridableComponent").OverridableComponent<import("@material-ui/core").TabsTypeMap<{}, import("@material-ui/core").ExtendButtonBase<import("@material-ui/core").ButtonBaseTypeMap<{}, "button">>>>, any, {}, never>;
+export declare const StyledTabs: import("styled-components").StyledComponent<import("@mui/material/OverridableComponent").OverridableComponent<import("@mui/material").TabsTypeMap<{}, import("@mui/material").ExtendButtonBase<import("@mui/material").ButtonBaseTypeMap<{}, "button">>>>, any, {}, never>;

package/lib/components/truncate-with-tooltip/TruncateWithTooltip.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { CommonProps } from '../CommonProps';
 export interface TruncateWithTooltipProps extends CommonProps {
     charactersLimit?: number;

package/lib/components/truncate-with-tooltip/TruncateWithTooltip.styles.d.ts

@@ -1,3 +1,3 @@
-import { Tooltip } from '@material-ui/core';
+import { Tooltip } from '@mui/material';
 export declare const rootClassName = "dot-truncate-with-tooltip";
 export declare const StyledTruncateWithTooltip: import("styled-components").StyledComponent<typeof Tooltip, any, {}, never>;

package/lib/components/typography/Typography.d.ts

@@ -1,6 +1,6 @@
 import { ElementType, ReactNode } from 'react';
 import { CommonProps } from '../CommonProps';
-export declare type TypographyVariant = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'subtitle1' | 'subtitle2' | 'body1' | 'body2' | 'caption' | 'button' | 'overline' | 'srOnly' | 'inherit';
+export declare type TypographyVariant = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'subtitle1' | 'subtitle2' | 'body1' | 'body2' | 'caption' | 'button' | 'overline' | 'inherit';
 export interface TypographyProps extends CommonProps {
     /** The content of the component. */
     children: ReactNode;

package/lib/testing-utils/index.d.ts

@@ -1,10 +1,10 @@
-import React, { ReactNode } from 'react';
+import { ReactNode } from 'react';
 export { mockResizeObserver } from './resize-observer-mock';
 declare const renderWithTheme: (ui: ReactNode) => {
     container: HTMLElement;
     baseElement: Element;
     debug: (baseElement?: Element | DocumentFragment | (Element | DocumentFragment)[], maxLength?: number, options?: import("pretty-format").PrettyFormatOptions) => void;
-    rerender: (ui: React.ReactElement<any, string | React.JSXElementConstructor<any>>) => void;
+    rerender: (ui: import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>) => void;
     unmount: () => void;
     asFragment: () => DocumentFragment;
     getByLabelText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").SelectorMatcherOptions) => HTMLElement;

package/lib/theme-provider/ThemeProvider.d.ts

@@ -1,17 +1,14 @@
 import { ReactNode } from 'react';
-import { Theme } from '@material-ui/core';
-import { TypographyOptions } from '@material-ui/core/styles/createTypography';
+import { Theme } from '@mui/material';
+import { TypographyOptions } from '@mui/material/styles/createTypography';
 import { AvatarPaletteColorOptions } from '../../../../../typings/material/index';
-export declare type ThemeOptions = 'light' | 'dark' | 'agility-light' | 'agility-dark';
+export declare type ThemeOptions = 'light' | 'dark';
 export declare const typographyOptions: TypographyOptions;
 export declare const avatarColors: AvatarPaletteColorOptions;
-export declare const agilityLightTheme: Theme;
-export declare const agilityDarkTheme: Theme;
 export declare const darkTheme: Theme;
 export declare const lightTheme: Theme;
-interface ThemeProviderProps {
+export interface ThemeProviderProps {
     children: ReactNode;
     theme?: Theme | ThemeOptions;
 }
 export declare function DotThemeProvider({ children, theme, }: ThemeProviderProps): JSX.Element;
-export {};

package/lib/theme-provider/colors/light-theme-colors.d.ts

@@ -99,5 +99,4 @@ export declare const pA100 = "#ff9cd1";
 export declare const pA200 = "#ff69b9";
 export declare const pA400 = "#ff36a2";
 export declare const pA700 = "#ff1d96";
-export declare const agilityGreen = "#79b522";
-export declare const agilityLightGreen = "#e4efd3";
+export declare const selectedGray = "rgba(0, 0, 0, 0.12)";

package/package.json

@@ -1,12 +1,11 @@
 {
   "name": "@digital-ai/dot-components",
-  "version": "1.21.2",
+  "version": "2.0.0-rc.2",
   "private": false,
   "license": "SEE LICENSE IN <LICENSE.md>",
   "contributors": [
     "Keith Stewart <kstewart@digial.ai>",
     "Matt Haff <mhaff@digital.ai>",
-    "Josh Schoen <jschoen@digital.ai>",
     "Bojan Kocijan <Bojan.Kocijan@digital.ai>"
   ],
   "repository": {
@@ -26,13 +25,13 @@
   },
   "author": "Keith Stewart",
   "dependencies": {
-    "@material-ui/lab": "4.0.0-alpha.56",
-    "@material-ui/core": "4.12.3",
+    "@mui/material": "^5.2.5",
+    "@mui/styles": "^5.2.3",
     "react-dropzone": "^11.4.2",
     "react-grid-layout": "^1.3.4",
     "styled-components": "^5.2.1"
   },
   "peerDependencies": {
-    "react": "^16.8.0 || ^17.0.0"
+    "react": "^17.0.2 || ^18.0.0"
   }
 }