flipper-ui 0.26.1 → 0.26.7

package/core/Advertise.d.ts

@@ -1,4 +1,3 @@
-import { FC } from 'react';
 import type { DefaultProps } from './types';
 interface AdvertiseProps extends DefaultProps {
     comment: string;
@@ -6,5 +5,5 @@ interface AdvertiseProps extends DefaultProps {
     commentStyle?: object;
     authorStyle?: object;
 }
-declare const Advertise: FC<AdvertiseProps>;
+declare const Advertise: ({ comment, author, padding, commentStyle, authorStyle, ...otherProps }: AdvertiseProps) => JSX.Element;
 export default Advertise;

package/core/AutoComplete.d.ts

@@ -1,4 +1,4 @@
-import React, { ReactNode, FC, ChangeEvent, KeyboardEvent, CSSProperties, Ref, FocusEvent } from 'react';
+import React, { ReactNode, ChangeEvent, KeyboardEvent, CSSProperties, Ref, FocusEvent } from 'react';
 interface AutoCompleteProps {
     autoFocus?: boolean;
     defaultIsOpen?: boolean;
@@ -36,5 +36,5 @@ interface ISelected {
     subheader?: boolean;
 }
 declare type TSelected = ISelected | string;
-declare const AutoComplete: FC<AutoCompleteProps>;
+declare const AutoComplete: (props: AutoCompleteProps) => JSX.Element;
 export default AutoComplete;

package/core/Avatar.d.ts

@@ -1,4 +1,4 @@
-import { FC } from 'react';
+import React from 'react';
 import type { DefaultProps } from './types';
 interface AvatarProps extends DefaultProps {
     name?: string;
@@ -7,6 +7,7 @@ interface AvatarProps extends DefaultProps {
     src?: string;
     imgProps?: object;
     primary?: boolean;
+    children: React.ReactNode;
 }
-declare const Avatar: FC<AvatarProps>;
+declare const Avatar: ({ children, primary, className, ...otherProps }: AvatarProps) => JSX.Element;
 export default Avatar;

package/core/Badge.d.ts

@@ -1,7 +1,8 @@
-import { FC } from 'react';
+import React from 'react';
 import { BadgeProps as MuiBadgeProps } from '@material-ui/core/Badge';
 import type { DefaultProps } from './types';
-interface BadgeProps extends DefaultProps, MuiBadgeProps {
+export interface BadgeProps extends DefaultProps, MuiBadgeProps {
+    children: React.ReactNode;
     max?: number;
     counter: number | string;
     position?: {
@@ -11,5 +12,5 @@ interface BadgeProps extends DefaultProps, MuiBadgeProps {
         right?: number;
     };
 }
-declare const Badge: FC<BadgeProps>;
+declare const Badge: (props: BadgeProps) => JSX.Element;
 export default Badge;

package/core/Box.d.ts

@@ -1,7 +1,8 @@
-import { FC } from 'react';
+import React from 'react';
 import type { DefaultProps } from './types';
-interface BoxProps extends DefaultProps {
+export interface BoxProps extends DefaultProps {
     minHeight?: number;
+    children: React.ReactNode;
 }
-declare const Box: FC<BoxProps>;
+declare const Box: ({ children, margin, padding, style, minHeight, ...otherProps }: BoxProps) => JSX.Element;
 export default Box;

package/core/Button.d.ts

@@ -1,4 +1,4 @@
-import { FC, ElementType, MouseEvent } from 'react';
+import React, { ElementType, MouseEvent } from 'react';
 import { DefaultProps } from './types';
 export interface ButtonProps extends DefaultProps {
     disabled?: boolean;
@@ -11,7 +11,8 @@ export interface ButtonProps extends DefaultProps {
     fullWidth?: boolean;
     variant?: 'text' | 'outlined' | 'contained' | 'dashed';
     target?: string;
+    children?: React.ReactNode;
     onClick?(event: MouseEvent<HTMLButtonElement>): void;
 }
-declare const Button: FC<ButtonProps>;
+declare const Button: ({ children, margin, padding, style, variant, ...otherProps }: ButtonProps) => JSX.Element;
 export default Button;

package/core/Card.d.ts

@@ -1,4 +1,3 @@
-import { FC } from 'react';
 import { DefaultProps } from './types';
 import { CardProps } from '@material-ui/core/Card';
 import { CardActionAreaProps } from '@material-ui/core/CardActionArea';
@@ -6,10 +5,10 @@ import { CardActionsProps } from '@material-ui/core/CardActions';
 import { CardContentProps } from '@material-ui/core/CardContent';
 import { CardMediaProps } from '@material-ui/core/CardMedia';
 import { CardHeaderProps } from '@material-ui/core/CardHeader';
-export declare const CardActionArea: FC<DefaultProps & CardActionAreaProps>;
-export declare const CardActions: FC<DefaultProps & CardActionsProps>;
-export declare const CardContent: FC<DefaultProps & CardContentProps>;
-export declare const CardMedia: FC<DefaultProps & CardMediaProps>;
-export declare const CardHeader: FC<DefaultProps & CardHeaderProps>;
-declare const Card: FC<DefaultProps & CardProps>;
+export declare const CardActionArea: ({ margin, padding, style, ...otherProps }: DefaultProps & CardActionAreaProps) => JSX.Element;
+export declare const CardActions: ({ margin, padding, style, ...otherProps }: DefaultProps & CardActionsProps) => JSX.Element;
+export declare const CardContent: ({ margin, padding, style, ...otherProps }: DefaultProps & CardContentProps) => JSX.Element;
+export declare const CardMedia: ({ margin, padding, style, ...otherProps }: DefaultProps & CardMediaProps) => JSX.Element;
+export declare const CardHeader: ({ margin, padding, style, ...otherProps }: DefaultProps & CardHeaderProps) => JSX.Element;
+declare const Card: ({ margin, padding, style, ...otherProps }: DefaultProps & CardProps) => JSX.Element;
 export default Card;

package/core/Chapter.d.ts

@@ -1,11 +1,12 @@
-import { CSSProperties, FC } from 'react';
-import { DefaultProps } from './types';
 import type { TypographyProps } from '@material-ui/core/Typography';
+import React, { CSSProperties } from 'react';
+import { DefaultProps } from './types';
 interface LineProps extends DefaultProps {
     primary?: boolean;
     width?: string;
     variant?: TypographyProps['variant'];
     childrenStyle?: CSSProperties;
+    children?: React.ReactNode;
 }
-declare const Chapter: FC<LineProps>;
+declare const Chapter: ({ padding, margin, style, childrenStyle, children, variant, ...otherProps }: LineProps) => JSX.Element;
 export default Chapter;

package/core/Chapter.js

@@ -17,7 +17,7 @@ var _excluded = ["padding", "margin", "style", "childrenStyle", "children", "var
 var _templateObject, _templateObject2;
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-var StyledLine = _styledComponents["default"].hr(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n    --color: ", ";\n    flex: 1;\n    min-height: .75px;\n    max-height: 3px;\n    align-self: center;\n    background-color: var(--color);\n"])), function (props) {
+var StyledLine = _styledComponents["default"].hr(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n    --color: ", ";\n    flex: 1;\n    min-height: 0.75px;\n    max-height: 3px;\n    align-self: center;\n    background-color: var(--color);\n"])), function (props) {
   return props.primary ? _colors.primary.normal : _colors.background.normal;
 });
 var Container = _styledComponents["default"].div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["\n    display: flex;\n\n    & hr:first-child {\n        margin-right: 10px;\n    }\n\n    & hr:last-child {\n        margin-left: 10px;\n    }\n"])));

package/core/Checkbox.d.ts

@@ -1,6 +1,6 @@
 import React, { ChangeEvent, ReactNode } from 'react';
 import { DefaultProps } from './types';
-interface CheckboxProps extends DefaultProps {
+export interface CheckboxProps extends DefaultProps {
     name: string;
     label?: ReactNode;
     color?: 'primary' | 'secondary' | 'default';

package/core/Chip.d.ts

@@ -1,8 +1,7 @@
-import { FC } from 'react';
 import { DefaultProps } from './types';
 import { ChipProps } from '@material-ui/core/Chip';
-interface IChipProps extends DefaultProps {
+export interface IChipProps extends DefaultProps {
     square?: boolean;
 }
-declare const Chip: FC<ChipProps & IChipProps>;
+declare const Chip: ({ square, padding, margin, style, ...otherProps }: ChipProps & IChipProps) => JSX.Element;
 export default Chip;

package/core/ChipField.js

@@ -22,6 +22,7 @@ var ChipField = function ChipField(props) {
     });
   }, [props.values]);
   return /*#__PURE__*/_react["default"].createElement(StyledChipInput, (0, _extends2["default"])({}, props, {
+    id: "chip-field-root",
     alwaysShowPlaceholder: true,
     value: values
   }));

package/core/Collapse.d.ts

@@ -1,4 +1,4 @@
-import { FC } from 'react';
+import React from 'react';
 import { DefaultProps } from './types';
 interface CollapseProps extends DefaultProps {
     collapsedHeight?: string;
@@ -7,6 +7,7 @@ interface CollapseProps extends DefaultProps {
         enter?: number;
         exit?: number;
     } | 'auto';
+    children?: React.ReactNode;
 }
-declare const Collapse: FC<CollapseProps>;
+declare const Collapse: ({ children, padding, margin, style, ...otherProps }: CollapseProps) => JSX.Element;
 export default Collapse;

package/core/Container.d.ts

@@ -1,4 +1,3 @@
-import { FC } from 'react';
 import { DefaultProps } from './types';
-declare const Container: FC<DefaultProps>;
+declare const Container: ({ children, padding, margin, style, ...otherProps }: DefaultProps) => JSX.Element;
 export default Container;

package/core/Content.d.ts

@@ -1,4 +1,3 @@
-import { FC } from 'react';
 import { DefaultProps } from './types';
-declare const Content: FC<DefaultProps>;
+declare const Content: ({ children, padding, margin, style, ...otherProps }: DefaultProps) => JSX.Element;
 export default Content;

package/core/DataTable/DataTable.d.ts

@@ -1,6 +1,6 @@
 import React, { MutableRefObject, CSSProperties } from 'react';
 import { ColumnSpec, Data, DataTableController, Errors, PaginationOptions, RowViewComponent, StackView } from './types';
-export declare type DataTableProps<D extends Data, V extends StackView = {}> = {
+export declare type DataTableProps<D extends Data, V extends StackView = Record<string, unknown>> = {
     /**
      * The data to be shown in the table
      */

package/core/DataTable/DataTablePaginationActions.js

@@ -11,8 +11,6 @@ var _FirstPage = _interopRequireDefault(require("@material-ui/icons/FirstPage"))
 var _LastPage = _interopRequireDefault(require("@material-ui/icons/LastPage"));
 var _KeyboardArrowLeft = _interopRequireDefault(require("@material-ui/icons/KeyboardArrowLeft"));
 var _KeyboardArrowRight = _interopRequireDefault(require("@material-ui/icons/KeyboardArrowRight"));
-/* eslint-disable @typescript-eslint/interface-name-prefix */
-
 var PAGINATION_WRAPPER_STYLE = {
   display: 'flex',
   marginLeft: '12px'

package/core/DataTable/DataTableQueryPaginated.d.ts

@@ -1,6 +1,6 @@
 import React, { MutableRefObject, CSSProperties } from 'react';
 import { ColumnSpec, Data, DataTableController, Errors, PaginationOptions, RowViewComponent, StackView } from './types';
-export declare type DataTableProps<D extends Data, V extends StackView = {}> = {
+export declare type DataTableProps<D extends Data, V extends StackView = Record<string, unknown>> = {
     /**
      * The data to be shown in the table
      */

package/core/DataTable/DataTableQueryPaginated.js

@@ -71,7 +71,7 @@ var DataTableQueryPaginated = function DataTableQueryPaginated(props) {
       return data;
     }
     return data;
-  }, [pagination.disabled, data, perPage, page, newRow]);
+  }, [pagination.disabled, data]);
   var _useRowsState = (0, _useRowsState2.useRowsState)(rows, newRow),
     getRowState = _useRowsState.getRowState,
     setEditableRowState = _useRowsState.setEditableRowState,

package/core/DataTable/types.d.ts

@@ -1,5 +1,5 @@
 import type { CSSProperties, FunctionComponent } from 'react';
-declare type RecordUnknown = Record<string, unknown>;
+export declare type RecordUnknown = Record<string, unknown>;
 export declare type StackView = RecordUnknown;
 export declare type Identifier = string | number;
 export interface Data extends RecordUnknown {

package/core/DataTable/types.js

@@ -4,7 +4,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.RowMode = void 0;
-/* eslint-disable @typescript-eslint/interface-name-prefix */
 var RowMode;
 exports.RowMode = RowMode;
 (function (RowMode) {

package/core/DataTable/usePaginated.d.ts

@@ -1,3 +1,5 @@
+/// <reference types="react" />
+import { Data } from './types';
 export interface IDataProps {
     id: string;
     product: string;
@@ -5,14 +7,15 @@ export interface IDataProps {
     quantity: number;
     date: Date;
 }
-export declare const generateRandomDate: (size: number) => IDataProps[];
+export declare const generateRandomDate: (size: number) => Data[];
 export declare const usePaginated: () => {
-    data: IDataProps[];
-    setData: (data: any) => void;
+    data: Data[];
+    setData: import("react").Dispatch<import("react").SetStateAction<Data[]>>;
     totalElements: number;
     actualPage: number;
     size: number;
     handleChangePage: (newPage: number) => void;
     handleChangePerPage: (value: number) => void;
     loading: boolean;
+    mockData: Data[];
 };

package/core/DataTable/usePaginated.js

@@ -10,14 +10,13 @@ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/sli
 var _faker = _interopRequireDefault(require("faker"));
 var _splitEvery = _interopRequireDefault(require("ramda/es/splitEvery"));
 var _react = require("react");
-var _uuid = require("uuid");
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 var generateRandomDate = function generateRandomDate(size) {
   var content = [];
   for (var i = 0; i < size; i++) {
     content.push({
-      id: (0, _uuid.v4)(),
+      id: i,
       product: _faker["default"].vehicle.model(),
       price: _faker["default"].datatype["float"]({
         min: 0,
@@ -127,7 +126,8 @@ var usePaginated = function usePaginated() {
     size: state.size,
     handleChangePage: handleChangePage,
     handleChangePerPage: handleChangePerPage,
-    loading: loading
+    loading: loading,
+    mockData: mockData
   };
 };
 exports.usePaginated = usePaginated;

package/core/DateTime.d.ts

@@ -1,4 +1,4 @@
-import React, { FC } from 'react';
+import React from 'react';
 import DateFnsUtils from '@date-io/date-fns';
 import { DefaultProps } from './types';
 import { KeyboardDatePickerProps } from '@material-ui/pickers/DatePicker';
@@ -15,5 +15,5 @@ interface IProps {
     onChange(date: MaterialUiPickersDate | null, value?: string): void;
 }
 declare type DateTimeProps = Omit<KeyboardDatePickerProps, 'margin' | 'onChange'> & Omit<KeyboardDateTimePickerProps, 'margin' | 'onChange'> & Omit<KeyboardTimePickerProps, 'margin' | 'onChange'> & IProps & DefaultProps;
-declare const DateTime: FC<DateTimeProps>;
+declare const DateTime: ({ padding, margin, style, format, variant, inputVariant, ampm, invalidDateMessage, minDateMessage, maxDateMessage, locale, type, ...otherProps }: DateTimeProps) => JSX.Element;
 export default DateTime;

package/core/DateTime.js

@@ -54,7 +54,7 @@ var DateTime = function DateTime(_ref) {
       padding: padding
     }, style),
     inputProps: _objectSpread({
-      autocomplete: 'off'
+      autoComplete: 'off'
     }, otherProps.inputProps),
     InputAdornmentProps: _objectSpread({
       style: {

package/core/Dialog.d.ts

@@ -1,4 +1,4 @@
-import { CSSProperties, ReactNode, FC } from 'react';
+import { CSSProperties, ReactNode } from 'react';
 import { DefaultProps } from './types';
 interface DialogProps extends DefaultProps {
     open: boolean;
@@ -23,5 +23,5 @@ interface DialogProps extends DefaultProps {
     scroll?: 'body' | 'paper' | 'unset-paper' | 'unset-body';
     onClose?: (event: Event) => void;
 }
-declare const Dialog: FC<DialogProps>;
+declare const Dialog: ({ snippet, style, padding, margin, scroll, PaperProps, open, fullScreen, fullWidth, maxWidth, onClose, titleAction, titleWrapperStyle, titleStyle, titleActionStyle, contentStyle, contentTextStyle, actionsStyle, actions, content, text, title, snippetStyle, snippetContentStyle }: DialogProps) => JSX.Element;
 export default Dialog;

package/core/Divider.d.ts

@@ -1,8 +1,7 @@
-import { FC } from 'react';
 import { DefaultProps } from './types';
 interface DividerProps extends DefaultProps {
     inset?: boolean;
     light?: boolean;
 }
-declare const Divider: FC<DividerProps>;
+declare const Divider: ({ margin, padding, style, ...otherProps }: DividerProps) => JSX.Element;
 export default Divider;

package/core/Drawer.d.ts

@@ -1,9 +1,8 @@
 import { DrawerProps as MuiDrawerProps } from '@material-ui/core/Drawer';
-import { FC } from 'react';
 import { DefaultProps } from './types';
 interface DrawerProps extends MuiDrawerProps, DefaultProps {
     top?: number;
     width?: number;
 }
-declare const Drawer: FC<DrawerProps>;
+declare const Drawer: (props: DrawerProps) => JSX.Element;
 export default Drawer;

package/core/EditableTable.js

@@ -51,7 +51,7 @@ var CustomRemove = (0, _styledComponents["default"])(_materialTable.MTableEditRo
     }
   }
 });
-var CustomRows = (0, _styledComponents["default"])(_materialTable.MTableBodyRow)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2["default"])(["\n    transition: opacity 200ms ease;\n    button {\n        display: none;\n    };\n    &:hover {\n        background: -moz-linear-gradient(left,", " 0%, ", " 100%);\n        background: -webkit-linear-gradient(left,", " 0%,", " 100%);\n        background: linear-gradient(to right,", " 0%,", " 100%);\n    };\n    &:hover button {\n        display: inline-block !important;\n    };\n    td {\n        min-width: 64px;\n    };\n"])), _colors.DARK, _colors.GREY, _colors.DARK, _colors.GREY, _colors.DARK, _colors.GREY);
+var CustomRows = (0, _styledComponents["default"])(_materialTable.MTableBodyRow)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2["default"])(["\n    transition: opacity 200ms ease;\n    button {\n        display: none;\n    }\n    &:hover {\n        background: -moz-linear-gradient(left, ", " 0%, ", " 100%);\n        background: -webkit-linear-gradient(left, ", " 0%, ", " 100%);\n        background: linear-gradient(to right, ", " 0%, ", " 100%);\n    }\n    &:hover button {\n        display: inline-block !important;\n    }\n    td {\n        min-width: 64px;\n    }\n"])), _colors.DARK, _colors.GREY, _colors.DARK, _colors.GREY, _colors.DARK, _colors.GREY);
 var RightPagination = _styledComponents["default"].div(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2["default"])(["\n    & > div {\n        display: block;\n        float: right;\n    }\n"])));
 var Wrapper = _styledComponents["default"].div(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2["default"])(["\n    & > div {\n        justify-content: flex-end;\n    }\n"])));
 var EditableTable = function EditableTable(props) {

package/core/ExpansionPanel.d.ts

@@ -1,4 +1,4 @@
-import React, { ReactNode, FC } from 'react';
+import React, { ReactNode } from 'react';
 import { PaperProps } from './Paper';
 interface ExpansionPanelProps extends PaperProps {
     actions?: ReactNode;
@@ -14,7 +14,7 @@ interface ExpansionPanelProps extends PaperProps {
     helperIcon?: React.ReactNode;
     helperButtonPosition?: 'left' | 'right';
     onHelperClick?: () => void;
-    onChange?: (event?: any, expanded?: any) => void;
+    onChange?: (event?: React.ChangeEvent<Record<string, unknown>>, expanded?: boolean) => void;
 }
-declare const ExpansionPanel: FC<ExpansionPanelProps>;
+declare const ExpansionPanel: ({ actions, details, expandIcon, margin, padding, style, summary, summaryStyle, detailsStyle, actionsStyle, onHelperClick, helperIcon, helperButtonPosition, ...otherProps }: ExpansionPanelProps) => JSX.Element;
 export default ExpansionPanel;

package/core/ExpansionPanel.js

@@ -20,7 +20,7 @@ var _excluded = ["actions", "details", "expandIcon", "margin", "padding", "style
 var _templateObject;
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-var ExpansionPanelHeaderWrapper = _styledComponents["default"].div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n    display: flex;\n    flex-direction: rows;\n    align-items: center;\n    button {\n        display: none;  \n    }\n    :hover button {\n        display: flex;\n    }\n"])));
+var ExpansionPanelHeaderWrapper = _styledComponents["default"].div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n    display: flex;\n    flex-direction: rows;\n    align-items: center;\n    button {\n        display: none;\n    }\n    :hover button {\n        display: flex;\n    }\n"])));
 var ExpansionPanel = function ExpansionPanel(_ref) {
   var actions = _ref.actions,
     details = _ref.details,

package/core/Fab.d.ts

@@ -8,7 +8,7 @@ interface FabProps extends DefaultProps {
     href?: string;
     variant?: 'round' | 'extended';
     onClick?: (event?: MouseEvent<HTMLElement>) => void;
-    children: React.ReactElement<{}>;
+    children: React.ReactElement<Record<string, unknown>>;
 }
 declare const Fab: ({ children, margin, padding, style, variant, ...otherProps }: FabProps) => JSX.Element;
 export default Fab;

package/core/Fade.d.ts

@@ -6,7 +6,7 @@ interface FadeProps extends DefaultProps {
         enter?: number;
         exit?: number;
     };
-    children?: React.ReactElement<{}>;
+    children: React.ReactElement<Record<string, unknown>>;
 }
 declare const Fade: ({ children, padding, margin, style, ...otherProps }: FadeProps) => JSX.Element;
 export default Fade;

package/core/Grow.d.ts

@@ -6,7 +6,7 @@ interface GrowProps extends DefaultProps {
         enter?: number;
         exit?: number;
     } | 'auto';
-    children?: React.ReactElement<{}>;
+    children?: React.ReactElement<Record<string, unknown>>;
 }
 declare const Grow: ({ children, padding, margin, style, ...otherProps }: GrowProps) => JSX.Element;
 export default Grow;

package/core/Header.d.ts

@@ -1,8 +1,7 @@
-import { FC } from 'react';
 import { PaperProps } from './Paper';
-interface HeaderProps extends PaperProps {
+export interface HeaderProps extends PaperProps {
     position?: 'absolute' | 'fixed' | 'static' | 'sticky';
     color?: 'default' | 'inherit' | 'primary' | 'secondary';
 }
-declare const Header: FC<HeaderProps>;
+declare const Header: ({ children, padding, margin, style, elevation, ...otherProps }: HeaderProps) => JSX.Element;
 export default Header;

package/core/IconButton.d.ts

@@ -1,9 +1,9 @@
-import { FC, MouseEvent } from 'react';
+import { MouseEvent } from 'react';
 import { DefaultProps } from './types';
-interface IconButtonProps extends DefaultProps {
+export interface IconButtonProps extends DefaultProps {
     color?: 'default' | 'inherit' | 'primary' | 'secondary';
     disabled?: boolean;
     onClick?(event: MouseEvent<HTMLButtonElement>): void;
 }
-declare const IconButton: FC<IconButtonProps>;
+declare const IconButton: ({ children, padding, margin, style, ...otherProps }: IconButtonProps) => JSX.Element;
 export default IconButton;

package/core/InputAdornment.d.ts

@@ -1,7 +1,6 @@
-import { FC } from 'react';
 import { DefaultProps } from './types';
 export interface InputAdornmentProps extends DefaultProps {
     position: 'start' | 'end';
 }
-declare const InputAdornment: FC<InputAdornmentProps>;
+declare const InputAdornment: ({ children, ...otherProps }: InputAdornmentProps) => JSX.Element;
 export default InputAdornment;

package/core/InputBase.d.ts

@@ -1,4 +1,4 @@
-import { ChangeEvent, ReactNode, FC } from 'react';
+import { ChangeEvent, ReactNode } from 'react';
 import { DefaultProps } from './types';
 export interface InputAdornmentProps extends DefaultProps {
     autoComplete?: string;
@@ -22,5 +22,5 @@ export interface InputAdornmentProps extends DefaultProps {
     type?: string;
     value?: string | number | boolean;
 }
-declare const InputAdornment: FC<InputAdornmentProps>;
+declare const InputAdornment: ({ margin, padding, style, autoComplete, ...otherProps }: InputAdornmentProps) => JSX.Element;
 export default InputAdornment;

package/core/Line.d.ts

@@ -1,8 +1,7 @@
-import { FC } from 'react';
 import { DefaultProps } from './types';
 interface LineProps extends DefaultProps {
     primary?: boolean;
     width?: string;
 }
-declare const Line: FC<LineProps>;
+declare const Line: ({ padding, margin, style, ...otherProps }: LineProps) => JSX.Element;
 export default Line;

package/core/Line.js

@@ -16,7 +16,7 @@ var _excluded = ["padding", "margin", "style"];
 var _templateObject;
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-var StyledLine = _styledComponents["default"].hr(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n    flex: 1;\n    border: 1px solid ", ";\n"])), function (props) {
+var StyledLine = _styledComponents["default"].hr(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n    flex: 1;\n    border: 1px solid\n        ", ";\n"])), function (props) {
   return props.primary ? _colors.primary.normal : _colors.background.normal;
 });
 var Line = function Line(_ref) {

package/core/List.d.ts

@@ -1,9 +1,8 @@
-import { FC } from 'react';
 import { DefaultProps } from './types';
 interface ListProps extends DefaultProps {
     title?: string;
     dense?: boolean;
     color?: 'primary' | 'secondary' | 'default' | 'inherit';
 }
-declare const List: FC<ListProps>;
+declare const List: ({ title, padding, margin, style, children, className, color, ...otherProps }: ListProps) => JSX.Element;
 export default List;

package/core/ListItem.d.ts

@@ -1,4 +1,4 @@
-import { MouseEvent, FC } from 'react';
+import { MouseEvent } from 'react';
 import { DefaultProps } from './types';
 import { Omit } from 'ramda';
 interface ListItemProps extends Omit<DefaultProps, 'name'> {
@@ -12,5 +12,5 @@ interface ListItemProps extends Omit<DefaultProps, 'name'> {
     disabled?: boolean;
     onClick?: (event?: MouseEvent) => void;
 }
-declare const ListItem: FC<ListItemProps>;
+declare const ListItem: (props: ListItemProps) => JSX.Element;
 export default ListItem;

package/core/MaskField.d.ts

@@ -1,6 +1,6 @@
-import React, { Component } from 'react';
+import React from 'react';
 import { TextFieldProps } from './TextField';
-interface MaskFieldProps {
+export interface MaskFieldProps {
     mask?: string;
     type?: 'text' | 'tel' | 'password';
     decimalSeparator?: string;
@@ -10,7 +10,5 @@ interface MaskFieldProps {
     fixedDecimalScale?: boolean;
     customInput?: React.ComponentType<TextFieldProps>;
 }
-declare class MaskField extends Component<TextFieldProps & MaskFieldProps> {
-    render(): JSX.Element;
-}
+declare const MaskField: (props: TextFieldProps & MaskFieldProps) => JSX.Element;
 export default MaskField;