flipper-ui 0.31.6 → 0.32.0

package/README.md

@@ -1,22 +1,18 @@
-<!-- Logo -->
 <p align="center">
-  <img width="150" src="logo.png" alt="Flipper-UI logo" />
+  <img width="150" src="./src/images/logo.png" alt="Flipper-UI logo" />
 </p>
 
-<!-- Name -->
 <h1 align="center">Flipper-UI</h1>
 
-<!-- Badges -->
+
 <div align="center">
+React UI based on the <br/>
 
-[React](http://facebook.github.io/react/) UI toolkit for the web.
+`@material-ui/core` and `@mui/material` <br/>
+toolkit for the web.
 
 [![npm package](https://img.shields.io/npm/v/flipper-ui/latest.svg)](https://www.npmjs.com/package/flipper-ui)
 [![npm downloads](https://img.shields.io/npm/dm/flipper-ui.svg)](https://www.npmjs.com/package/flipper-ui)
-[![Dependencies](https://img.shields.io/david/nginformatica/flipper-ui.svg?style=flat-square)](https://david-dm.org/nginformatica/flipper-ui)
-[![DevDependencies](https://img.shields.io/david/dev/nginformatica/flipper-ui.svg)](https://david-dm.org/nginformatica/flipper-ui?type=dev)
-[![Build Status](https://travis-ci.org/nginformatica/flipper-ui.svg?branch=master)](https://travis-ci.org/nginformatica/flipper-ui)
-
 </div>
 
 ## Installation
@@ -24,10 +20,11 @@
 Flipper-UI is available as an [npm package](https://www.npmjs.com/package/flipper-ui).
 
 ```sh
-// with npm
 npm install flipper-ui
 
-// with yarn
+```
+
+```sh
 yarn add flipper-ui
 ```
 
@@ -35,71 +32,26 @@ yarn add flipper-ui
 
 Here is a quick example to get you started, **it's all you need**:
 
-```jsx
+```tsx
 import React from 'react'
-import ReactDOM from 'react-dom'
+import { render } from 'react-dom'
 import { Button } from 'flipper-ui'
 
-function App() {
+const App = () => {
   return (
     <Button variant="contained" color="primary">
       Hello World
     </Button>
-  );
+  )
 }
 
-ReactDOM.render(<App />, document.querySelector('#app'));
+render(<App />, document.getElementById('root'))
 ```
 
-## Components
-
-- [x] Advertise
-- [x] AppBar/Header
-- [x] AutoComplete
-- [x] Avatar
-- [x] Badge
-- [x] Box
-- [x] Button
-- [x] Checkbox
-- [x] Chip
-- [x] Collapse
-- [x] DatePicker
-- [x] Dialog
-- [x] Divider
-- [x] Expansion Panel
-- [x] Menu
-- [x] Fade
-- [x] Floating Action Button
-- [x] Grow
-- [x] Icon
-- [x] Icon Button
-- [x] List
-- [x] ListItem
-- [x] Paper
-- [x] Progress
-- [x] Sidebar/Drawer
-- [x] Switcher
-- [x] Radio
-- [x] RadioGroup
-- [x] Select
-- [x] Slide
-- [x] Snackbar
-- [x] Table
-- [x] Tabs
-- [x] TextArea
-- [x] TextField
-- [x] Tooltip
-- [x] Typography
-- [x] Zoom
-
-## Next Components
-
-- [ ] Carousel/Gallery
-- [ ] Tree
-
 ## Documentation
 
-Check out our [documentation website](https://nginformatica.github.io/flipper-ui/).
+Check out our [documentation website](https://flipper-ui.ngi.com.br/?path=/docs/introduction--docs). You can also interact with the components there!
+
 
 ## Contributing
 

package/core/data-display/actions/actions.stories.d.ts

@@ -0,0 +1,6 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import Actions from '.';
+declare const meta: Meta<typeof Actions>;
+export default meta;
+type Story = StoryObj<typeof Actions>;
+export declare const actions: Story;

package/{experimental → core/data-display}/actions/index.d.ts

@@ -4,7 +4,9 @@ export interface IProps {
     padding?: number | string;
     margin?: number | string;
     align?: 'flex-end' | 'flex-start' | 'center';
-    disabled?: boolean;
+    prefix?: string;
+    buttons?: Array<'confirm' | 'cancel'>;
+    actionButtonColor?: ButtonProps['color'];
     names?: {
         cancel: string;
         confirm: string;
@@ -14,17 +16,11 @@ export interface IProps {
         confirm: string;
     };
     readonly?: boolean;
-    prefix?: string;
-    buttons?: Array<'confirm' | 'cancel'>;
-    actionButtonColor?: ButtonProps['color'];
+    disabled?: boolean;
+    disabledCancel?: boolean;
+    disabledConfirm?: boolean;
     onCancel?(): void | boolean;
     onConfirm(): void;
 }
-interface IWrapper {
-    padding?: IProps['padding'];
-    margin?: IProps['margin'];
-    align: IProps['align'];
-}
-export declare const Wrapper: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").Substitute<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, IWrapper>>;
-export declare const Actions: (props: IProps) => React.JSX.Element;
+declare const Actions: (props: IProps) => React.JSX.Element;
 export default Actions;

package/core/data-display/actions/index.js

@@ -0,0 +1,32 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _button = _interopRequireDefault(require("../../inputs/button"));
+var _styles = require("./styles");
+var Actions = function Actions(props) {
+  var showButton = !props.readonly && (!props.buttons || props.buttons.includes('confirm'));
+  return /*#__PURE__*/_react["default"].createElement(_styles.Wrapper, {
+    align: props.align || 'flex-end',
+    padding: props.padding,
+    margin: props.margin
+  }, (!props.buttons || props.buttons.includes('cancel')) && /*#__PURE__*/_react["default"].createElement(_button["default"], {
+    margin: "0 16px",
+    disabled: props.disabled || props.disabledCancel,
+    name: props.names ? props.names.cancel : 'cancel-action',
+    "data-testid": "cancel-action",
+    onClick: props.onCancel
+  }, props.labels ? props.labels.cancel : 'Cancelar'), showButton && /*#__PURE__*/_react["default"].createElement(_button["default"], {
+    color: props.actionButtonColor || 'secondary',
+    variant: "contained",
+    disabled: props.disabled || props.disabledConfirm,
+    name: props.names ? props.names.confirm : 'confirm-action',
+    "data-testid": "confirm-action",
+    onClick: props.onConfirm
+  }, props.labels ? props.labels.confirm : 'Confirmar'));
+};
+var _default = exports["default"] = Actions;

package/core/data-display/actions/styles.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+interface IWrapper {
+    padding?: number | string;
+    margin?: number | string;
+    align?: 'flex-end' | 'flex-start' | 'center';
+}
+export declare const Wrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, IWrapper>> & string;
+export {};

package/{experimental/fab → core/data-display/actions}/styles.js

@@ -8,4 +8,10 @@ exports.Wrapper = void 0;
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
 var _styledComponents = _interopRequireDefault(require("styled-components"));
 var _templateObject;
-var Wrapper = exports.Wrapper = _styledComponents["default"].div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n    position: absolute;\n    left: 0;\n    top: 0;\n    bottom: 0;\n    right: 0;\n    display: flex;\n    align-items: center;\n    justify-content: flex-end;\n    opacity: 0;\n    transition: opacity 200ms ease;\n    &:hover {\n        opacity: 1;\n    }\n"])));
+var Wrapper = exports.Wrapper = _styledComponents["default"].div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n    grid-area: actions;\n    display: flex;\n    flex: 1;\n    justify-content: ", ";\n    padding: ", ";\n    margin: ", ";\n"])), function (props) {
+  return props.align;
+}, function (props) {
+  return props.padding;
+}, function (props) {
+  return props.margin;
+});

package/core/data-display/advertise/styles.d.ts

@@ -1,8 +1,8 @@
 /// <reference types="react" />
-export declare const AdvertiseTypography: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").FastOmit<{
+export declare const AdvertiseTypography: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<{
     align?: import("@material-ui/core").PropTypes.Alignment | undefined;
     children?: import("react").ReactNode;
-    color?: "inherit" | "initial" | "primary" | "secondary" | "textPrimary" | "textSecondary" | "error" | undefined;
+    color?: "inherit" | "primary" | "secondary" | "initial" | "error" | "textPrimary" | "textSecondary" | undefined;
     display?: "initial" | "block" | "inline" | undefined;
     gutterBottom?: boolean | undefined;
     noWrap?: boolean | undefined;
@@ -11,10 +11,10 @@ export declare const AdvertiseTypography: import("styled-components").IStyledCom
     variantMapping?: Partial<Record<import("@material-ui/core").TypographyVariant | "srOnly", string>> | undefined;
 } & import("@material-ui/core/OverridableComponent").CommonProps<import("@material-ui/core").TypographyTypeMap<{}, "span">> & Pick<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & {
     ref?: ((instance: HTMLSpanElement | null) => void) | import("react").RefObject<HTMLSpanElement> | null | undefined;
-}, "ref" | "slot" | "title" | "key" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "autoFocus" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "nonce" | "spellCheck" | "tabIndex" | "translate" | "radioGroup" | "role" | "about" | "content" | "datatype" | "inlist" | "prefix" | "property" | "rel" | "resource" | "rev" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-braillelabel" | "aria-brailleroledescription" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colindextext" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-description" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowindextext" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onResize" | "onResizeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerLeave" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture"> & import("../../types").DefaultProps, never>> & Omit<({ children, margin, padding, style, variant, ...otherProps }: {
+}, "color" | "role" | "onClick" | "children" | "id" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "autoFocus" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "lang" | "nonce" | "slot" | "spellCheck" | "tabIndex" | "title" | "translate" | "radioGroup" | "about" | "content" | "datatype" | "inlist" | "prefix" | "property" | "rel" | "resource" | "rev" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-braillelabel" | "aria-brailleroledescription" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colindextext" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-description" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowindextext" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onResize" | "onResizeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerLeave" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "ref" | "key"> & import("../../types").DefaultProps, never>> & string & Omit<({ children, margin, padding, style, variant, ...otherProps }: {
     align?: import("@material-ui/core").PropTypes.Alignment | undefined;
     children?: import("react").ReactNode;
-    color?: "inherit" | "initial" | "primary" | "secondary" | "textPrimary" | "textSecondary" | "error" | undefined;
+    color?: "inherit" | "primary" | "secondary" | "initial" | "error" | "textPrimary" | "textSecondary" | undefined;
     display?: "initial" | "block" | "inline" | undefined;
     gutterBottom?: boolean | undefined;
     noWrap?: boolean | undefined;
@@ -23,5 +23,5 @@ export declare const AdvertiseTypography: import("styled-components").IStyledCom
     variantMapping?: Partial<Record<import("@material-ui/core").TypographyVariant | "srOnly", string>> | undefined;
 } & import("@material-ui/core/OverridableComponent").CommonProps<import("@material-ui/core").TypographyTypeMap<{}, "span">> & Pick<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & {
     ref?: ((instance: HTMLSpanElement | null) => void) | import("react").RefObject<HTMLSpanElement> | null | undefined;
-}, "ref" | "slot" | "title" | "key" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "autoFocus" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "nonce" | "spellCheck" | "tabIndex" | "translate" | "radioGroup" | "role" | "about" | "content" | "datatype" | "inlist" | "prefix" | "property" | "rel" | "resource" | "rev" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-braillelabel" | "aria-brailleroledescription" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colindextext" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-description" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowindextext" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onResize" | "onResizeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerLeave" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture"> & import("../../types").DefaultProps) => import("react").JSX.Element, keyof import("react").Component<any, {}, any>>;
-export declare const Paper: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").FastOmit<import("@/core/surfaces/paper").PaperProps, never>> & Omit<({ children, style, padding, margin, ...otherProps }: import("@/core/surfaces/paper").PaperProps) => import("react").JSX.Element, keyof import("react").Component<any, {}, any>>;
+}, "color" | "role" | "onClick" | "children" | "id" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "autoFocus" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "lang" | "nonce" | "slot" | "spellCheck" | "tabIndex" | "title" | "translate" | "radioGroup" | "about" | "content" | "datatype" | "inlist" | "prefix" | "property" | "rel" | "resource" | "rev" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-braillelabel" | "aria-brailleroledescription" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colindextext" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-description" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowindextext" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onResize" | "onResizeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerLeave" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "ref" | "key"> & import("../../types").DefaultProps) => import("react").JSX.Element, keyof import("react").Component<any, {}, any>>;
+export declare const Paper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("@/core/surfaces/paper").PaperProps, never>> & string & Omit<({ children, style, padding, margin, ...otherProps }: import("@/core/surfaces/paper").PaperProps) => import("react").JSX.Element, keyof import("react").Component<any, {}, any>>;

package/core/data-display/avatar/avatar.stories.d.ts

@@ -1,5 +1,9 @@
-declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react").ReactRenderer, import(".").AvatarProps>;
-export default _default;
-export declare const Default: any;
-export declare const Primary: any;
-export declare const WithChildren: any;
+import type { Meta, StoryObj } from '@storybook/react';
+import Avatar from '.';
+declare const meta: Meta<typeof Avatar>;
+export default meta;
+type Story = StoryObj<typeof Avatar>;
+export declare const avatar: Story;
+export declare const avatarWithCustomSize: Story;
+export declare const avatarWithoutImage: Story;
+export declare const avatarWithCustomIcon: Story;

package/core/data-display/avatar/index.d.ts

@@ -1,11 +1,10 @@
 import React from 'react';
-import type { ReactNode } from 'react';
-import type { DefaultProps } from '../../types';
-import type { AvatarProps as MuiAvatarProps } from '@material-ui/core';
-export interface AvatarProps extends DefaultProps, MuiAvatarProps {
-    primary?: boolean;
-    children?: ReactNode;
-    'data-testid'?: string;
+import type { CSSProperties, ReactNode } from 'react';
+export interface IProps {
+    name?: string;
+    icon?: ReactNode;
+    src?: string;
+    style?: CSSProperties;
 }
-export declare const Avatar: ({ children, primary, className, ...otherProps }: AvatarProps) => React.JSX.Element;
+declare const Avatar: (props: IProps) => React.JSX.Element;
 export default Avatar;

package/core/data-display/avatar/index.js

@@ -4,28 +4,17 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports["default"] = exports.Avatar = void 0;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+exports["default"] = void 0;
+var _Avatar2 = _interopRequireDefault(require("@mui/material/Avatar"));
+var _take2 = _interopRequireDefault(require("ramda/es/take"));
 var _react = _interopRequireDefault(require("react"));
-var _Avatar = _interopRequireDefault(require("@material-ui/core/Avatar"));
-var _styles = require("@material-ui/core/styles");
-var _excluded = ["children", "primary", "className"];
-var useStyles = (0, _styles.makeStyles)(function (theme) {
-  return (0, _styles.createStyles)({
-    primary: {
-      backgroundColor: theme.palette.primary.main
+var Avatar = function Avatar(props) {
+  var getChild = function getChild() {
+    if (props.name) {
+      return (0, _take2["default"])(1, props.name.toUpperCase());
     }
-  });
-});
-var Avatar = exports.Avatar = function Avatar(_ref) {
-  var children = _ref.children,
-    primary = _ref.primary,
-    className = _ref.className,
-    otherProps = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
-  var classes = useStyles();
-  return /*#__PURE__*/_react["default"].createElement(_Avatar["default"], (0, _extends2["default"])({}, otherProps, {
-    className: "".concat(className ? className : '', " ").concat(primary ? classes['primary'] : '')
-  }), children);
+    return props.icon;
+  };
+  return /*#__PURE__*/_react["default"].createElement(_Avatar2["default"], props, getChild());
 };
 var _default = exports["default"] = Avatar;

package/core/data-display/badge/index.js

@@ -5,11 +5,11 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = void 0;
+var _Badge2 = _interopRequireDefault(require("@material-ui/core/Badge"));
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _react = _interopRequireDefault(require("react"));
-var _Badge = _interopRequireDefault(require("@material-ui/core/Badge"));
 var _styles = require("@material-ui/core/styles");
 var _excluded = ["children", "counter", "padding", "margin", "position", "style"];
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
@@ -30,7 +30,7 @@ var Badge = function Badge(props) {
     style = _props$style === void 0 ? {} : _props$style,
     otherProps = (0, _objectWithoutProperties2["default"])(props, _excluded);
   var classes = useBadgeStyles(position);
-  return /*#__PURE__*/_react["default"].createElement(_Badge["default"], (0, _extends2["default"])({
+  return /*#__PURE__*/_react["default"].createElement(_Badge2["default"], (0, _extends2["default"])({
     badgeContent: counter,
     classes: classes,
     style: _objectSpread({

package/core/data-display/chapter/styles.d.ts

@@ -1,4 +1,4 @@
 /// <reference types="react" />
 import type { LineProps } from '.';
-export declare const StyledLine: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, LineProps>>;
-export declare const Container: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>;
+export declare const StyledLine: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, LineProps>> & string;
+export declare const Container: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;

package/core/data-display/chip/index.js

@@ -5,11 +5,11 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = void 0;
+var _Chip2 = _interopRequireDefault(require("@material-ui/core/Chip"));
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _react = _interopRequireDefault(require("react"));
-var _Chip = _interopRequireDefault(require("@material-ui/core/Chip"));
 var _styles = require("@material-ui/core/styles");
 var _excluded = ["square", "padding", "margin", "style"];
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
@@ -30,7 +30,7 @@ var Chip = function Chip(_ref) {
     style = _ref$style === void 0 ? {} : _ref$style,
     otherProps = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
   var classes = useStyles();
-  return /*#__PURE__*/_react["default"].createElement(_Chip["default"], (0, _extends2["default"])({
+  return /*#__PURE__*/_react["default"].createElement(_Chip2["default"], (0, _extends2["default"])({
     classes: square ? classes : undefined,
     style: _objectSpread({
       padding: padding,

package/core/data-display/data-table/data-table-field.js

@@ -5,13 +5,17 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = exports.DataTableField = void 0;
+var _Table2 = _interopRequireDefault(require("@mui/material/Table"));
+var _TableBody2 = _interopRequireDefault(require("@mui/material/TableBody"));
+var _TableHead2 = _interopRequireDefault(require("@mui/material/TableHead"));
+var _TableCell2 = _interopRequireDefault(require("@mui/material/TableCell"));
+var _Checkbox2 = _interopRequireDefault(require("@mui/material/Checkbox"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _react = _interopRequireDefault(require("react"));
-var _material = require("@mui/material");
-var _ = require("../../..");
+var _textField = _interopRequireDefault(require("../../inputs/text-field"));
 var _styles = require("./styles");
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; } // eslint-disable-next-line @typescript-eslint/consistent-type-imports
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var DataTableField = exports.DataTableField = function DataTableField(props) {
   var rows = props.rows,
     header = props.header,
@@ -75,7 +79,7 @@ var DataTableField = exports.DataTableField = function DataTableField(props) {
           return /*#__PURE__*/_react["default"].createElement(_styles.TableCellRows, {
             key: i,
             align: "center"
-          }, column.editable && checkboxProps !== null && checkboxProps !== void 0 && checkboxProps.checkRow && checkboxProps.checkRow[index] ? /*#__PURE__*/_react["default"].createElement(_.TextField, {
+          }, column.editable && checkboxProps !== null && checkboxProps !== void 0 && checkboxProps.checkRow && checkboxProps.checkRow[index] ? /*#__PURE__*/_react["default"].createElement(_textField["default"], {
             fullWidth: true,
             key: "".concat(column.field, "-").concat(i),
             type: column.type,
@@ -102,9 +106,9 @@ var DataTableField = exports.DataTableField = function DataTableField(props) {
         onClick: function onClick(event) {
           return handleTableRow(event, index);
         }
-      }, checkbox && /*#__PURE__*/_react["default"].createElement(_material.TableCell, {
+      }, checkbox && /*#__PURE__*/_react["default"].createElement(_TableCell2["default"], {
         padding: "checkbox"
-      }, /*#__PURE__*/_react["default"].createElement(_material.Checkbox, {
+      }, /*#__PURE__*/_react["default"].createElement(_Checkbox2["default"], {
         color: "primary",
         checked: (checkboxProps === null || checkboxProps === void 0 || (_checkboxProps$checkR2 = checkboxProps.checkRow) === null || _checkboxProps$checkR2 === void 0 ? void 0 : _checkboxProps$checkR2[index]) !== undefined ? checkboxProps.checkRow[index] : false,
         onChange: function onChange() {
@@ -113,11 +117,11 @@ var DataTableField = exports.DataTableField = function DataTableField(props) {
       })), columns);
     });
   };
-  return /*#__PURE__*/_react["default"].createElement(_material.Table, {
+  return /*#__PURE__*/_react["default"].createElement(_Table2["default"], {
     "data-testid": "data-table-field"
-  }, /*#__PURE__*/_react["default"].createElement(_material.TableHead, null, checkbox && /*#__PURE__*/_react["default"].createElement(_material.TableCell, {
+  }, /*#__PURE__*/_react["default"].createElement(_TableHead2["default"], null, checkbox && /*#__PURE__*/_react["default"].createElement(_TableCell2["default"], {
     padding: "checkbox"
-  }, /*#__PURE__*/_react["default"].createElement(_material.Checkbox, {
+  }, /*#__PURE__*/_react["default"].createElement(_Checkbox2["default"], {
     color: "primary",
     checked: (checkboxProps === null || checkboxProps === void 0 ? void 0 : checkboxProps.checkAllRows) !== undefined ? checkboxProps.checkAllRows : false,
     onChange: function onChange() {
@@ -126,10 +130,10 @@ var DataTableField = exports.DataTableField = function DataTableField(props) {
       }
     }
   })), header.map(function (item, i) {
-    return /*#__PURE__*/_react["default"].createElement(_material.TableCell, {
+    return /*#__PURE__*/_react["default"].createElement(_TableCell2["default"], {
       key: i,
       align: "center"
     }, item.title);
-  })), /*#__PURE__*/_react["default"].createElement(_material.TableBody, null, tableBody(rows, header)));
+  })), /*#__PURE__*/_react["default"].createElement(_TableBody2["default"], null, tableBody(rows, header)));
 };
 var _default = exports["default"] = DataTableField;

package/core/data-display/data-table/data-table-pagination-actions.js

@@ -5,10 +5,13 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.makeDataTablePaginationActions = void 0;
+var _LastPage2 = _interopRequireDefault(require("@mui/icons-material/LastPage"));
+var _KeyboardArrowRight2 = _interopRequireDefault(require("@mui/icons-material/KeyboardArrowRight"));
+var _KeyboardArrowLeft2 = _interopRequireDefault(require("@mui/icons-material/KeyboardArrowLeft"));
+var _FirstPage2 = _interopRequireDefault(require("@mui/icons-material/FirstPage"));
 var _react = _interopRequireDefault(require("react"));
 var _iconButton = _interopRequireDefault(require("../../inputs/icon-button"));
 var _styles = require("./styles");
-var _icons = require("../../../icons");
 var makeDataTablePaginationActions = exports.makeDataTablePaginationActions = function makeDataTablePaginationActions(_ref) {
   var showFirstButton = _ref.showFirstButton,
     showLastButton = _ref.showLastButton,
@@ -35,18 +38,18 @@ var makeDataTablePaginationActions = exports.makeDataTablePaginationActions = fu
       disabled: page === 0 || clickable,
       "aria-label": "first page",
       onClick: handleFirstPageButtonClick
-    }, /*#__PURE__*/_react["default"].createElement(_icons.FirstPage, null)), /*#__PURE__*/_react["default"].createElement(_iconButton["default"], {
+    }, /*#__PURE__*/_react["default"].createElement(_FirstPage2["default"], null)), /*#__PURE__*/_react["default"].createElement(_iconButton["default"], {
       disabled: page === 0 || clickable,
       "aria-label": "previous page",
       onClick: handleBackButtonClick
-    }, /*#__PURE__*/_react["default"].createElement(_icons.KeyboardArrowLeft, null)), /*#__PURE__*/_react["default"].createElement(_iconButton["default"], {
+    }, /*#__PURE__*/_react["default"].createElement(_KeyboardArrowLeft2["default"], null)), /*#__PURE__*/_react["default"].createElement(_iconButton["default"], {
       disabled: page >= totalPages || clickable,
       "aria-label": "next page",
       onClick: handleNextButtonClick
-    }, /*#__PURE__*/_react["default"].createElement(_icons.KeyboardArrowRight, null)), showLastButton && /*#__PURE__*/_react["default"].createElement(_iconButton["default"], {
+    }, /*#__PURE__*/_react["default"].createElement(_KeyboardArrowRight2["default"], null)), showLastButton && /*#__PURE__*/_react["default"].createElement(_iconButton["default"], {
       disabled: page >= totalPages || clickable,
       "aria-label": "last page",
       onClick: handleLastPageButtonClick
-    }, /*#__PURE__*/_react["default"].createElement(_icons.LastPage, null)));
+    }, /*#__PURE__*/_react["default"].createElement(_LastPage2["default"], null)));
   };
 };

package/core/data-display/data-table/data-table-query-paginated.js

@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = exports.DataTableQueryPaginated = void 0;
+var _last2 = _interopRequireDefault(require("ramda/es/last"));
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _react = _interopRequireWildcard(require("react"));
@@ -18,13 +19,12 @@ var _TableFooter = _interopRequireDefault(require("@material-ui/core/TableFooter
 var _TableHead = _interopRequireDefault(require("@material-ui/core/TableHead"));
 var _TablePagination = _interopRequireDefault(require("@material-ui/core/TablePagination"));
 var _TableRow = _interopRequireDefault(require("@material-ui/core/TableRow"));
-var _last = _interopRequireDefault(require("ramda/es/last"));
 var _dataTablePaginationActions = require("./data-table-pagination-actions");
 var _rows = require("./rows");
 var _types = require("./types");
 var _useRowsState2 = require("./use-rows-state");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var defaultPagination = {
@@ -128,7 +128,7 @@ var DataTableQueryPaginated = exports.DataTableQueryPaginated = function DataTab
   var rowsList = (0, _react.useMemo)(function () {
     return rows.map(function (row) {
       var rowState = getRowState(row.id);
-      var lastView = (rowState === null || rowState === void 0 ? void 0 : rowState.stackView) && (0, _last["default"])(rowState.stackView);
+      var lastView = (rowState === null || rowState === void 0 ? void 0 : rowState.stackView) && (0, _last2["default"])(rowState.stackView);
       var view = lastView && (rowViews === null || rowViews === void 0 ? void 0 : rowViews[lastView]);
       var mode = (rowState === null || rowState === void 0 ? void 0 : rowState.mode) || _types.RowMode.View;
       return /*#__PURE__*/_react["default"].createElement(_TableRow["default"], {

package/core/data-display/data-table/data-table.d.ts

@@ -16,6 +16,9 @@ export type DataTableProps<D extends Data, V extends StackView = Record<string,
     controllerRef?: MutableRefObject<DataTableController<D, V> | undefined>;
     hidden?: boolean;
     rowViews?: Record<keyof V, RowViewComponent<D>>;
+    size?: 'small' | 'medium';
+    renderEmptyRows?: boolean;
+    hideSelect?: boolean;
     checkbox?: boolean;
     checkboxProps?: {
         checkRow?: boolean[];