flipper-ui 0.31.1 → 0.31.3

package/core/data-display/editable-table/index.js

@@ -5,48 +5,46 @@ var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports["default"] = exports.GREY = exports.EditableTable = exports.DARK = void 0;
+exports["default"] = void 0;
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
 var _react = _interopRequireWildcard(require("react"));
 var _ptBR = _interopRequireDefault(require("date-fns/locale/pt-BR"));
 var _materialTable = _interopRequireWildcard(require("material-table"));
 var _omit = _interopRequireDefault(require("ramda/es/omit"));
 var _contains = _interopRequireDefault(require("ramda/es/contains"));
 var _propOr = _interopRequireDefault(require("ramda/es/propOr"));
-var _styledComponents = _interopRequireDefault(require("styled-components"));
 var _listItem = _interopRequireDefault(require("../list-item"));
-var _typography = require("../typography");
-var _autoComplete = require("../../inputs/auto-complete");
-var _button = require("../../inputs/button");
+var _autoComplete = _interopRequireDefault(require("../../inputs/auto-complete"));
+var _button = _interopRequireDefault(require("../../inputs/button"));
 var _dateTime = require("../../inputs/date-time");
-var _maskField = require("../../inputs/mask-field");
+var _maskField = _interopRequireDefault(require("../../inputs/mask-field"));
 var _textField = require("../../inputs/text-field");
-var _icons = require("../../../icons");
 var _localization = require("../../../lib/localization");
-var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6;
-/* eslint-disable @typescript-eslint/no-explicit-any */
-/* eslint-disable max-lines */
+var _styles = require("./styles");
+var _icons = require("../../../icons");
 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 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 DARK = exports.DARK = 'rgba(189,189,189,0)';
-var GREY = exports.GREY = 'rgba(189,189,189,1)';
-var AddRowButton = _styledComponents["default"].div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n    display: flex;\n    align-items: center;\n"])));
-var AddRowText = (0, _styledComponents["default"])(_typography.Typography)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["\n    margin-left: 4px;\n    font-weight: 500 !important;\n"])));
-var FullWidthButton = (0, _styledComponents["default"])(_button.Button)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2["default"])(["\n    width: calc(100% - 24px);\n    margin: 12px !important;\n"])));
-var CustomRemove = (0, _styledComponents["default"])(_materialTable.MTableEditRow)({
-  '& h6': {
-    fontSize: '0.85em'
-  }
-});
-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"])), DARK, GREY, DARK, GREY, DARK, 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 = exports.EditableTable = function EditableTable(props) {
+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 @typescript-eslint/no-explicit-any */
+var handlePagination = function handlePagination(paginationInfo, noRowsExpand, title) {
+  var pagination = !paginationInfo ? {
+    Pagination: function Pagination() {
+      return null;
+    }
+  } : noRowsExpand && {
+    Pagination: function Pagination(item) {
+      return /*#__PURE__*/_react["default"].createElement(_styles.RightPagination, {
+        "data-id": "pagination"
+      }, /*#__PURE__*/_react["default"].createElement(_materialTable.MTablePagination, (0, _extends2["default"])({}, (0, _omit["default"])(['classes'], item), {
+        localization: (0, _localization.getLocalization)(title).pagination
+      })));
+    }
+  };
+  return pagination;
+};
+var EditableTable = function EditableTable(props) {
   var _props$data;
   var addButtonColor = props.color !== 'disabled' && props.color || 'primary';
   var valueRef = (0, _react.useRef)();
@@ -55,7 +53,7 @@ var EditableTable = exports.EditableTable = function EditableTable(props) {
   };
   var renderMaskField = function renderMaskField(item, error) {
     var _item$value;
-    return /*#__PURE__*/_react["default"].createElement(Wrapper, null, /*#__PURE__*/_react["default"].createElement(_maskField.MaskField, (0, _extends2["default"])({}, item, {
+    return /*#__PURE__*/_react["default"].createElement(_styles.Wrapper, null, /*#__PURE__*/_react["default"].createElement(_maskField["default"], (0, _extends2["default"])({}, item, {
       fixedDecimalScale: true,
       error: props.errors ? error : item.error,
       type: "text",
@@ -73,29 +71,16 @@ var EditableTable = exports.EditableTable = function EditableTable(props) {
       }
     })));
   };
-  var renderAddComponent = /*#__PURE__*/_react["default"].createElement(AddRowButton, {
+  var renderAddComponent = /*#__PURE__*/_react["default"].createElement(_styles.AddRowButton, {
     "data-id": "add-row"
-  }, /*#__PURE__*/_react["default"].createElement(_icons.NoteAdd, null), /*#__PURE__*/_react["default"].createElement(AddRowText, null, " Adicionar ", props.title, " "));
-  var pagination = !props.paginationInfo ? {
-    Pagination: function Pagination() {
-      return null;
-    }
-  } : props.noRowsExpand && {
-    Pagination: function Pagination(item) {
-      return /*#__PURE__*/_react["default"].createElement(RightPagination, {
-        "data-id": "pagination"
-      }, /*#__PURE__*/_react["default"].createElement(_materialTable.MTablePagination, (0, _extends2["default"])({}, (0, _omit["default"])(['classes'], item), {
-        localization: (0, _localization.getLocalization)(props.title).pagination
-      })));
-    }
-  };
+  }, /*#__PURE__*/_react["default"].createElement(_icons.NoteAdd, null), /*#__PURE__*/_react["default"].createElement(_styles.AddRowText, null, " Adicionar ", props.title, " "));
   var toolbar = props.noHeader && {
     Toolbar: function Toolbar() {
       return null;
     }
   };
   var renderAutoComplete = function renderAutoComplete(inputProps) {
-    return /*#__PURE__*/_react["default"].createElement(_autoComplete.AutoComplete, {
+    return /*#__PURE__*/_react["default"].createElement(_autoComplete["default"], {
       openOnFocus: true,
       selectTextOnFocus: true,
       "data-testid": "autocomplete-container",
@@ -114,7 +99,7 @@ var EditableTable = exports.EditableTable = function EditableTable(props) {
           name: inputProps.columnDef.field + '-input'
         }, itemProps));
       },
-      actions: props.onClickAdd && /*#__PURE__*/_react["default"].createElement(FullWidthButton, {
+      actions: props.onClickAdd && /*#__PURE__*/_react["default"].createElement(_styles.FullWidthButton, {
         color: addButtonColor,
         name: "dialog-add",
         "data-testid": "dialog-add",
@@ -124,17 +109,13 @@ var EditableTable = exports.EditableTable = function EditableTable(props) {
       onChange: inputProps.onChange
     });
   };
-  return /*#__PURE__*/_react["default"].createElement("div", {
-    style: {
-      width: '100%'
-    }
-  }, /*#__PURE__*/_react["default"].createElement(_materialTable["default"], {
+  return /*#__PURE__*/_react["default"].createElement(_styles.Container, null, /*#__PURE__*/_react["default"].createElement(_materialTable["default"], {
     components: _objectSpread(_objectSpread({
       EditRow: function EditRow(props) {
-        return /*#__PURE__*/_react["default"].createElement(CustomRemove, props);
+        return /*#__PURE__*/_react["default"].createElement(_styles.CustomRemove, props);
       },
       Row: function Row(props) {
-        return /*#__PURE__*/_react["default"].createElement(CustomRows, props);
+        return /*#__PURE__*/_react["default"].createElement(_styles.CustomRows, props);
       },
       Toolbar: function Toolbar(props) {
         var _props$actions = (0, _slicedToArray2["default"])(props.actions, 1),
@@ -153,7 +134,7 @@ var EditableTable = exports.EditableTable = function EditableTable(props) {
         var isDisabled = !!disabled;
         var renderToolbarButton = function renderToolbarButton() {
           var ActionIcon = localProps.action.icon;
-          return /*#__PURE__*/_react["default"].createElement(_button.Button, {
+          return /*#__PURE__*/_react["default"].createElement(_button["default"], {
             fullWidth: true,
             disabled: props.disableAddHeader,
             variant: "dashed",
@@ -172,28 +153,11 @@ var EditableTable = exports.EditableTable = function EditableTable(props) {
             action: localProps.action
           });
         };
-
-        // const renderDefault = () => (
-        //     <MTableAction
-        //         disabled
-        //         action={() => {}}
-        //         size={0}
-        //         data={[]}
-        //     />
-        // )
-
-        // const hasData = !!localProps.action && size && data
         var isToolbar = localProps.action && 'position' in localProps.action && localProps.action.position === 'toolbar';
         if (isToolbar) {
           return renderToolbarButton();
         }
         return renderActionButton();
-
-        // return cond([
-        //     [isToolbar, renderToolbarButton],
-        //     [hasData, renderActionButton],
-        //     [T, renderDefault]
-        // ])(localProps)
       },
       EditField: function EditField(localProps) {
         if (localProps.columnDef.type === 'datetime') {
@@ -219,7 +183,7 @@ var EditableTable = exports.EditableTable = function EditableTable(props) {
           name: localProps.columnDef.field + '-input'
         }, localProps));
       }
-    }, pagination), toolbar),
+    }, handlePagination(props.paginationInfo, props.noRowsExpand, props.title)), toolbar),
     localization: (0, _localization.getLocalization)(props.title),
     icons: {
       Add: /*#__PURE__*/(0, _react.forwardRef)(function () {

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

@@ -0,0 +1,35 @@
+/// <reference types="react" />
+export declare const DARK = "rgba(189,189,189,0)";
+export declare const GREY = "rgba(189,189,189,1)";
+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 AddRowButton: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>;
+export declare const AddRowText: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").FastOmit<{
+    align?: import("@material-ui/core").PropTypes.Alignment | undefined;
+    children?: import("react").ReactNode;
+    color?: "inherit" | "initial" | "primary" | "secondary" | "textPrimary" | "textSecondary" | "error" | undefined;
+    display?: "initial" | "block" | "inline" | undefined;
+    gutterBottom?: boolean | undefined;
+    noWrap?: boolean | undefined;
+    paragraph?: boolean | undefined;
+    variant?: "inherit" | (import("@material-ui/core").TypographyVariant | "srOnly") | undefined;
+    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" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "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 }: {
+    align?: import("@material-ui/core").PropTypes.Alignment | undefined;
+    children?: import("react").ReactNode;
+    color?: "inherit" | "initial" | "primary" | "secondary" | "textPrimary" | "textSecondary" | "error" | undefined;
+    display?: "initial" | "block" | "inline" | undefined;
+    gutterBottom?: boolean | undefined;
+    noWrap?: boolean | undefined;
+    paragraph?: boolean | undefined;
+    variant?: "inherit" | (import("@material-ui/core").TypographyVariant | "srOnly") | undefined;
+    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" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "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 FullWidthButton: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").FastOmit<import("@/core/inputs/button").ButtonProps, never>> & Omit<({ children, margin, padding, style, variant, ...otherProps }: import("@/core/inputs/button").ButtonProps) => import("react").JSX.Element, keyof import("react").Component<any, {}, any>>;
+export declare const CustomRemove: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").FastOmit<any, never>> & Omit<(props: any) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>, keyof import("react").Component<any, {}, any>>;
+export declare const CustomRows: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").FastOmit<any, never>> & Omit<(props: any) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>, keyof import("react").Component<any, {}, any>>;
+export declare const RightPagination: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>;
+export declare const Wrapper: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>;

package/core/data-display/editable-table/styles.js

@@ -0,0 +1,27 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Wrapper = exports.RightPagination = exports.GREY = exports.FullWidthButton = exports.DARK = exports.CustomRows = exports.CustomRemove = exports.Container = exports.AddRowText = exports.AddRowButton = void 0;
+var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
+var _materialTable = require("material-table");
+var _styledComponents = _interopRequireDefault(require("styled-components"));
+var _typography = _interopRequireDefault(require("../typography"));
+var _button = _interopRequireDefault(require("../../inputs/button"));
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7;
+var DARK = exports.DARK = 'rgba(189,189,189,0)';
+var GREY = exports.GREY = 'rgba(189,189,189,1)';
+var Container = exports.Container = _styledComponents["default"].div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n    width: 100%;\n"])));
+var AddRowButton = exports.AddRowButton = _styledComponents["default"].div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["\n    display: flex;\n    align-items: center;\n"])));
+var AddRowText = exports.AddRowText = (0, _styledComponents["default"])(_typography["default"])(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2["default"])(["\n    margin-left: 4px;\n    font-weight: 500 !important;\n"])));
+var FullWidthButton = exports.FullWidthButton = (0, _styledComponents["default"])(_button["default"])(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2["default"])(["\n    width: calc(100% - 24px);\n    margin: 12px !important;\n"])));
+var CustomRemove = exports.CustomRemove = (0, _styledComponents["default"])(_materialTable.MTableEditRow)({
+  '& h6': {
+    fontSize: '0.85em'
+  }
+});
+var CustomRows = exports.CustomRows = (0, _styledComponents["default"])(_materialTable.MTableBodyRow)(_templateObject5 || (_templateObject5 = (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"])), DARK, GREY, DARK, GREY, DARK, GREY);
+var RightPagination = exports.RightPagination = _styledComponents["default"].div(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2["default"])(["\n    & > div {\n        display: block;\n        float: right;\n    }\n"])));
+var Wrapper = exports.Wrapper = _styledComponents["default"].div(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2["default"])(["\n    & > div {\n        justify-content: flex-end;\n    }\n"])));

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

@@ -6,5 +6,5 @@ export interface FabProps extends DefaultProps, MuiFabProps {
     onClick?: (event?: MouseEvent<HTMLElement>) => void;
     children: ReactElement<Record<string, unknown>>;
 }
-export declare const Fab: ({ children, margin, padding, style, ...otherProps }: FabProps) => React.JSX.Element;
+declare const Fab: ({ children, margin, padding, style, ...otherProps }: FabProps) => React.JSX.Element;
 export default Fab;

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

@@ -4,7 +4,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports["default"] = exports.Fab = void 0;
+exports["default"] = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
@@ -13,7 +13,7 @@ var _Fab = _interopRequireDefault(require("@material-ui/core/Fab"));
 var _excluded = ["children", "margin", "padding", "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; }
 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 Fab = exports.Fab = function Fab(_ref) {
+var Fab = function Fab(_ref) {
   var children = _ref.children,
     margin = _ref.margin,
     padding = _ref.padding,

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

@@ -11,5 +11,5 @@ export interface ListProps extends DefaultProps {
      */
     color?: 'primary' | 'secondary' | 'default' | 'inherit';
 }
-export declare const List: ({ title, padding, margin, style, children, className, color, ...otherProps }: ListProps) => React.JSX.Element;
+declare const List: ({ title, padding, margin, style, children, className, color, ...otherProps }: ListProps) => React.JSX.Element;
 export default List;

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

@@ -4,7 +4,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports["default"] = exports.List = void 0;
+exports["default"] = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
@@ -35,7 +35,7 @@ var useStyles = (0, _styles.makeStyles)(function (theme) {
     }
   });
 });
-var List = exports.List = function List(_ref) {
+var List = function List(_ref) {
   var title = _ref.title,
     padding = _ref.padding,
     margin = _ref.margin,

package/core/data-display/list-item/index.d.ts

@@ -1,5 +1,5 @@
-import type { MouseEvent } from 'react';
 import React from 'react';
+import type { MouseEvent } from 'react';
 import type { DefaultProps } from '../../types';
 import type { Omit } from 'ramda';
 export interface ListItemProps extends Omit<DefaultProps, 'name'> {

package/core/data-display/menu-item/index.js

@@ -6,19 +6,15 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports["default"] = void 0;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
 var _react = _interopRequireDefault(require("react"));
-var _material = require("@mui/material");
-var _styledComponents = _interopRequireDefault(require("styled-components"));
-var _templateObject;
+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; }
-var MenuItems = (0, _styledComponents["default"])(_material.MenuItem)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n    && {\n        outline: none;\n        cursor: pointer;\n        font-family: Roboto, Helvetica, Arial, sans-serif;\n\n        &:hover {\n            background-color: #e0e0e0;\n        }\n    }\n"])));
 var MenuItem = function MenuItem(props) {
   var padding = props.padding,
     margin = props.margin,
     style = props.style;
-  return /*#__PURE__*/_react["default"].createElement(MenuItems, {
+  return /*#__PURE__*/_react["default"].createElement(_styles.MenuItems, {
     id: props.id,
     title: props.title,
     style: _objectSpread({

package/core/data-display/menu-item/styles.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+export declare const MenuItems: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").FastOmit<import("@mui/material").MenuItemOwnProps & Omit<import("@mui/material").ButtonBaseOwnProps, "classes"> & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, "ref"> & {
+    ref?: ((instance: HTMLLIElement | null) => void) | import("react").RefObject<HTMLLIElement> | null | undefined;
+}, "className" | "style" | "classes" | "autoFocus" | "tabIndex" | "children" | "disabled" | "action" | "selected" | "dense" | "disableTouchRipple" | "centerRipple" | "disableRipple" | "focusRipple" | "focusVisibleClassName" | "onFocusVisible" | "TouchRippleProps" | "disableGutters" | "divider" | "sx" | "LinkComponent" | "touchRippleRef">, never>> & Omit<import("@mui/material").ExtendButtonBase<import("@mui/material").MenuItemTypeMap<{}, "li">>, keyof import("react").Component<any, {}, any>>;

package/core/data-display/menu-item/styles.js

@@ -0,0 +1,12 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.MenuItems = void 0;
+var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
+var _material = require("@mui/material");
+var _styledComponents = _interopRequireDefault(require("styled-components"));
+var _templateObject;
+var MenuItems = exports.MenuItems = (0, _styledComponents["default"])(_material.MenuItem)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n    && {\n        outline: none;\n        cursor: pointer;\n        font-family: Roboto, Helvetica, Arial, sans-serif;\n\n        &:hover {\n            background-color: #e0e0e0;\n        }\n    }\n"])));

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

@@ -3,5 +3,5 @@ import type { DefaultProps } from '../../types';
 export interface NodeProps extends DefaultProps {
     name: string;
 }
-export declare const Node: (props: NodeProps) => React.JSX.Element;
+declare const Node: (props: NodeProps) => React.JSX.Element;
 export default Node;

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

@@ -5,29 +5,14 @@ var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports["default"] = exports.Node = void 0;
+exports["default"] = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
 var _react = _interopRequireWildcard(require("react"));
-var _styledComponents = _interopRequireDefault(require("styled-components"));
-var _icons = require("../../../icons");
-var _theme = require("../../../theme");
-var _templateObject, _templateObject2;
+var _styles = require("./styles");
 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; }
-var grays = _theme.theme.colors.grays;
-var styles = {
-  icon: {
-    fontSize: '24px',
-    marginRight: '12px'
-  }
-};
-var Ul = _styledComponents["default"].ul(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n    width: 350px;\n"])));
-var Li = _styledComponents["default"].li(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["\n    font-size: 16px;\n    margin: 12px;\n    background: #ffffff00;\n    padding: 12px;\n    padding-left: ", ";\n    list-style: none;\n    border-radius: 6px;\n    border: 1px solid ", ";\n    transition: all 500ms ease;\n    cursor: pointer;\n    align-items: center;\n    display: flex;\n    &:hover {\n        background: ", ";\n        border: 1px solid #009688;\n    }\n"])), function (props) {
-  return props.inset ? '12px' : '48px';
-}, grays.g5, grays.g7);
-var Node = exports.Node = function Node(props) {
+var Node = function Node(props) {
   var _useState = (0, _react.useState)(false),
     _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
     open = _useState2[0],
@@ -42,17 +27,13 @@ var Node = exports.Node = function Node(props) {
     setOpen(!open);
   };
   var renderDropdownIcon = function renderDropdownIcon() {
-    return open ? /*#__PURE__*/_react["default"].createElement(_icons.KeyboardArrowUp, {
-      style: styles.icon
-    }) : /*#__PURE__*/_react["default"].createElement(_icons.KeyboardArrowDown, {
-      style: styles.icon
-    });
+    return open ? /*#__PURE__*/_react["default"].createElement(_styles.IconUp, null) : /*#__PURE__*/_react["default"].createElement(_styles.IconDown, null);
   };
-  return /*#__PURE__*/_react["default"].createElement(Ul, (0, _extends2["default"])({}, props, {
+  return /*#__PURE__*/_react["default"].createElement(_styles.List, (0, _extends2["default"])({}, props, {
     key: id || name,
     style: style,
     className: className
-  }), /*#__PURE__*/_react["default"].createElement(Li, {
+  }), /*#__PURE__*/_react["default"].createElement(_styles.ListItem, {
     inset: Boolean(children),
     onClick: handleToggleOpen
   }, children && renderDropdownIcon(), name), open && children);

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

@@ -0,0 +1,17 @@
+/// <reference types="react" />
+interface IListItem {
+    inset: boolean;
+}
+export declare const List: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLUListElement>, HTMLUListElement>, never>>;
+export declare const ListItem: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, IListItem>>;
+export declare const IconUp: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").FastOmit<import("@mui/material").SvgIconOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").SVGProps<SVGSVGElement>, "ref"> & {
+    ref?: ((instance: SVGSVGElement | null) => void) | import("react").RefObject<SVGSVGElement> | null | undefined;
+}, "className" | "style" | "classes" | "color" | "children" | "fontSize" | "shapeRendering" | "viewBox" | "htmlColor" | "inheritViewBox" | "sx" | "titleAccess">, never>> & Omit<import("@mui/material/OverridableComponent").OverridableComponent<import("@mui/material").SvgIconTypeMap<{}, "svg">> & {
+    muiName: string;
+}, keyof import("react").Component<any, {}, any>>;
+export declare const IconDown: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").FastOmit<import("@mui/material").SvgIconOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").SVGProps<SVGSVGElement>, "ref"> & {
+    ref?: ((instance: SVGSVGElement | null) => void) | import("react").RefObject<SVGSVGElement> | null | undefined;
+}, "className" | "style" | "classes" | "color" | "children" | "fontSize" | "shapeRendering" | "viewBox" | "htmlColor" | "inheritViewBox" | "sx" | "titleAccess">, never>> & Omit<import("@mui/material/OverridableComponent").OverridableComponent<import("@mui/material").SvgIconTypeMap<{}, "svg">> & {
+    muiName: string;
+}, keyof import("react").Component<any, {}, any>>;
+export {};

package/core/data-display/node/styles.js

@@ -0,0 +1,19 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ListItem = exports.List = exports.IconUp = exports.IconDown = void 0;
+var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
+var _styledComponents = _interopRequireDefault(require("styled-components"));
+var _icons = require("../../../icons");
+var _theme = require("../../../theme");
+var _templateObject, _templateObject2, _templateObject3, _templateObject4;
+var grays = _theme.theme.colors.grays;
+var List = exports.List = _styledComponents["default"].ul(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n    width: 350px;\n"])));
+var ListItem = exports.ListItem = _styledComponents["default"].li(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["\n    font-size: 16px;\n    margin: 12px;\n    background: #ffffff00;\n    padding: 12px;\n    padding-left: ", ";\n    list-style: none;\n    border-radius: 6px;\n    border: 1px solid ", ";\n    transition: all 500ms ease;\n    cursor: pointer;\n    align-items: center;\n    display: flex;\n    &:hover {\n        background: ", ";\n        border: 1px solid #009688;\n    }\n"])), function (props) {
+  return props.inset ? '12px' : '48px';
+}, grays.g5, grays.g7);
+var IconUp = exports.IconUp = (0, _styledComponents["default"])(_icons.KeyboardArrowUp)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2["default"])(["\n    && {\n        font-size: 24px;\n        margin-right: 12px;\n    }\n"])));
+var IconDown = exports.IconDown = (0, _styledComponents["default"])(_icons.KeyboardArrowDown)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2["default"])(["\n    && {\n        font-size: 24px;\n        margin-right: 12px;\n    }\n"])));

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

@@ -4,5 +4,5 @@ import type { TableProps as MuiTableProps } from '@material-ui/core/Table';
 export interface TableProps extends DefaultProps, Omit<MuiTableProps, 'padding'> {
     spacing?: MuiTableProps['padding'];
 }
-export declare const Table: ({ style, margin, padding, spacing, children, ...otherProps }: MuiTableProps & TableProps) => React.JSX.Element;
+declare const Table: ({ style, margin, padding, spacing, children, ...otherProps }: MuiTableProps & TableProps) => React.JSX.Element;
 export default Table;

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

@@ -4,7 +4,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports["default"] = exports.Table = void 0;
+exports["default"] = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
@@ -15,7 +15,7 @@ var _excluded = ["style", "margin", "padding", "spacing", "children"];
 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 grays = _theme.theme.colors.grays;
-var Table = exports.Table = function Table(_ref) {
+var Table = function Table(_ref) {
   var style = _ref.style,
     margin = _ref.margin,
     padding = _ref.padding,

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

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 export interface INode {
     id: string | number;
     name: string;
@@ -7,5 +6,5 @@ export interface INode {
 export interface TreeProps {
     nodes?: INode[];
 }
-export declare const Tree: ({ nodes, ...otherProps }: TreeProps) => JSX.Element;
+declare const Tree: ({ nodes, ...otherProps }: TreeProps) => JSX.Element;
 export default Tree;

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

@@ -4,14 +4,14 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports["default"] = exports.Tree = void 0;
+exports["default"] = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _react = _interopRequireDefault(require("react"));
 var _omit = _interopRequireDefault(require("ramda/es/omit"));
-var _node = require("../node");
+var _node = _interopRequireDefault(require("../node"));
 var _excluded = ["nodes"];
-var Tree = exports.Tree = function Tree(_ref) {
+var Tree = function Tree(_ref) {
   var _ref$nodes = _ref.nodes,
     nodes = _ref$nodes === void 0 ? [] : _ref$nodes,
     otherProps = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
@@ -20,7 +20,7 @@ var Tree = exports.Tree = function Tree(_ref) {
     var id = node.id,
       name = node.name,
       nodes = node.nodes;
-    return /*#__PURE__*/_react["default"].createElement(_node.Node, {
+    return /*#__PURE__*/_react["default"].createElement(_node["default"], {
       id: index,
       name: name,
       key: id || index,
@@ -31,7 +31,7 @@ var Tree = exports.Tree = function Tree(_ref) {
       return renderNode((0, _omit["default"])(['array'], node), index.toString());
     }));
   };
-  return /*#__PURE__*/_react["default"].createElement(_node.Node, (0, _extends2["default"])({}, otherProps, {
+  return /*#__PURE__*/_react["default"].createElement(_node["default"], (0, _extends2["default"])({}, otherProps, {
     name: "root"
   }), nodes.map(function (node, index) {
     return renderNode(node, index.toString(), true);

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

@@ -1,5 +1,5 @@
 import React from 'react';
 import type { DefaultProps } from '../../types';
 import type { TypographyProps } from '@material-ui/core/Typography';
-export declare const Typography: ({ children, margin, padding, style, variant, ...otherProps }: TypographyProps & DefaultProps) => React.JSX.Element;
+declare const Typography: ({ children, margin, padding, style, variant, ...otherProps }: TypographyProps & DefaultProps) => React.JSX.Element;
 export default Typography;