flipper-ui 0.27.1 → 0.28.0

package/Experimental/Actions/index.d.ts

@@ -0,0 +1,29 @@
+import { ButtonProps } from '@material-ui/core';
+export interface IProps {
+    padding?: number | string;
+    margin?: number | string;
+    align?: 'flex-end' | 'flex-start' | 'center';
+    disabled?: boolean;
+    names?: {
+        cancel: string;
+        confirm: string;
+    };
+    labels?: {
+        cancel: string;
+        confirm: string;
+    };
+    readonly?: boolean;
+    prefix?: string;
+    buttons?: Array<'confirm' | 'cancel'>;
+    actionButtonColor?: ButtonProps['color'];
+    onCancel?(): void | boolean;
+    onConfirm(): void;
+}
+interface IWrapper {
+    padding?: IProps['padding'];
+    margin?: IProps['margin'];
+    align: IProps['align'];
+}
+export declare const Wrapper: import("styled-components").StyledComponent<"div", any, IWrapper, never>;
+declare const Actions: (props: IProps) => JSX.Element;
+export default Actions;

package/Experimental/Actions/index.js

@@ -0,0 +1,41 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = exports.Wrapper = void 0;
+var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
+var _index = require("@/index");
+var _react = _interopRequireDefault(require("react"));
+var _styledComponents = _interopRequireDefault(require("styled-components"));
+var _templateObject;
+var Wrapper = _styledComponents["default"].div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n    grid-area: actions;\n    display: flex;\n    flex: 1;\n    justify-content: flex-end;\n    padding: ", ";\n    margin: ", ";\n"])), function (props) {
+  return props.padding;
+}, function (props) {
+  return props.margin;
+});
+exports.Wrapper = Wrapper;
+var Actions = function Actions(props) {
+  var showButton = !props.readonly && (!props.buttons || props.buttons.includes('confirm'));
+  return /*#__PURE__*/_react["default"].createElement(Wrapper, {
+    align: props.align || 'flex-end',
+    padding: props.padding,
+    margin: props.margin
+  }, (!props.buttons || props.buttons.includes('cancel')) && /*#__PURE__*/_react["default"].createElement(_index.Button, {
+    margin: "0 16px",
+    disabled: props.disabled,
+    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(_index.Button, {
+    color: props.actionButtonColor || 'primary',
+    variant: "contained",
+    disabled: props.disabled,
+    name: props.names ? props.names.confirm : 'confirm-action',
+    "data-testid": "confirm-action",
+    onClick: props.onConfirm
+  }, props.labels ? props.labels.confirm : 'Confirmar'));
+};
+var _default = Actions;
+exports["default"] = _default;

package/Experimental/Avatar/index.d.ts

@@ -0,0 +1,13 @@
+import { CSSProperties, ReactNode } from 'react';
+export interface IProps {
+    /** The avatar name */
+    name?: string;
+    /** A custom icon node */
+    icon?: ReactNode;
+    /** An image source*/
+    src?: string;
+    /** Custom styles */
+    style?: CSSProperties;
+}
+declare const Avatar: (props: IProps) => JSX.Element;
+export default Avatar;

package/Experimental/Avatar/index.js

@@ -0,0 +1,22 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var _index = require("@/index");
+var _take = _interopRequireDefault(require("ramda/es/take"));
+var _react = _interopRequireDefault(require("react"));
+var FIRST_LETTER = 1;
+var Avatar = function Avatar(props) {
+  var getChild = function getChild() {
+    if (props.name) {
+      return (0, _take["default"])(FIRST_LETTER, props.name.toUpperCase());
+    }
+    return props.icon;
+  };
+  return /*#__PURE__*/_react["default"].createElement(_index.Avatar, props, getChild());
+};
+var _default = Avatar;
+exports["default"] = _default;

package/Experimental/Breadcrumbs/index.d.ts

@@ -0,0 +1,19 @@
+import { ReactNode } from 'react';
+type Props = {
+    /**
+     * A mapping between the pathname and the friendly name
+     * eg: { "*": "Home", "foo": "Bar" }
+     */
+    pathMapping: Record<string, string>;
+    /** The Home ID (eg: '*'), must be a key of `pathMapping` */
+    homeId: string;
+    /** The pathname to render breadcrumbs (default: window.location.pathname)*/
+    pathname?: string;
+    linkWrapper?: (link: string, label: ReactNode) => ReactNode;
+};
+/**
+ * Render breadcrumbs for the provided pathname or the current
+ * `window.location.pathname`.
+ */
+declare const Breadcrumbs: ({ pathname, homeId, pathMapping, linkWrapper }: Props) => JSX.Element;
+export default Breadcrumbs;

package/Experimental/Breadcrumbs/index.js

@@ -0,0 +1,67 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
+var _react = _interopRequireDefault(require("react"));
+var _addIndex = _interopRequireDefault(require("ramda/es/addIndex"));
+var _map = _interopRequireDefault(require("ramda/es/map"));
+var _icons = require("@/icons");
+var _nginformaticaStyleguide = require("nginformatica-styleguide");
+var _styledComponents = _interopRequireDefault(require("styled-components"));
+var _index = require("@/index");
+var imap = (0, _addIndex["default"])(_map["default"]);
+var LinkStyled = _styledComponents["default"].a({
+  textDecoration: 'none',
+  color: _nginformaticaStyleguide.theme.colors.primary.main,
+  ':hover': {
+    textDecoration: 'underline'
+  }
+});
+var INDEX_CORRECTION = 1;
+var START = 1;
+var defaultLinkWrapper = function defaultLinkWrapper(link, label) {
+  return /*#__PURE__*/_react["default"].createElement(LinkStyled, {
+    key: link,
+    href: link
+  }, label);
+};
+
+/**
+ * Render breadcrumbs for the provided pathname or the current
+ * `window.location.pathname`.
+ */
+var Breadcrumbs = function Breadcrumbs(_ref) {
+  var pathname = _ref.pathname,
+    homeId = _ref.homeId,
+    pathMapping = _ref.pathMapping,
+    _ref$linkWrapper = _ref.linkWrapper,
+    linkWrapper = _ref$linkWrapper === void 0 ? defaultLinkWrapper : _ref$linkWrapper;
+  var path = pathname || window.location.pathname;
+  var validChunks = path.split('/').filter(function (term) {
+    return term in pathMapping;
+  });
+  var allChunks = [homeId].concat((0, _toConsumableArray2["default"])(validChunks));
+  var lastChunkIndex = allChunks.length - INDEX_CORRECTION;
+  var links = imap(function (term, chunkIndex) {
+    var validChunkWord = pathMapping[term];
+    var link = '/' + allChunks.slice(START, chunkIndex + INDEX_CORRECTION).join('/');
+    var text = /*#__PURE__*/_react["default"].createElement(_index.Typography, {
+      key: link,
+      color: "inherit",
+      style: {
+        display: 'flex'
+      }
+    }, validChunkWord);
+    var isLastChunk = chunkIndex === lastChunkIndex;
+    return validChunkWord && (isLastChunk ? text : linkWrapper(link, text));
+  }, allChunks);
+  return /*#__PURE__*/_react["default"].createElement(_index.Breadcrumb, {
+    separator: /*#__PURE__*/_react["default"].createElement(_icons.ChevronRight, null)
+  }, links);
+};
+var _default = Breadcrumbs;
+exports["default"] = _default;

package/{core/Experimental/Button/Button.js → Experimental/Button/index.js}

@@ -7,12 +7,12 @@ Object.defineProperty(exports, "__esModule", {
 exports["default"] = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
-var _Button = _interopRequireDefault(require("../../Button"));
-var _icons = require("../../../icons");
+var _index = require("@/index");
+var _icons = require("@/icons");
 var _react = _interopRequireDefault(require("react"));
 var _styledComponents = _interopRequireDefault(require("styled-components"));
 var _templateObject;
-var ButtonStyled = (0, _styledComponents["default"])(_Button["default"])(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n    display: flex;\n    flex: 1;\n    align-items: center;\n    justify-content: center;\n"])));
+var ButtonStyled = (0, _styledComponents["default"])(_index.Button)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n    display: flex;\n    flex: 1;\n    align-items: center;\n    justify-content: center;\n"])));
 var AddButton = function AddButton(props) {
   return /*#__PURE__*/_react["default"].createElement(ButtonStyled, (0, _extends2["default"])({}, props, {
     variant: "dashed",

package/{core/Experimental/Card/Card.d.ts → Experimental/Card/index.d.ts}

@@ -1,4 +1,6 @@
 import React from 'react';
+import { ButtonProps } from '@/core/Button';
+import { IconButtonProps } from '@/core/IconButton';
 export interface IProps {
     children: React.ReactNode;
     label?: string;
@@ -8,6 +10,8 @@ export interface IProps {
     id?: string;
     editing?: boolean;
     action?: JSX.Element | null;
+    onAddProps?: Partial<ButtonProps>;
+    onEditProps?: Partial<IconButtonProps>;
     onClickAdd?(): void;
     onToggleEdit?(): void;
 }
@@ -24,6 +28,6 @@ export declare const Title: import("styled-components").StyledComponent<({ child
     variantMapping?: Partial<Record<import("@material-ui/core").TypographyVariant | "srOnly", string>> | undefined;
 } & import("@material-ui/core/OverridableComponent").CommonProps<import("@material-ui/core").TypographyTypeMap<{}, "span">> & Pick<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "key" | keyof React.HTMLAttributes<HTMLSpanElement>> & {
     ref?: ((instance: HTMLSpanElement | null) => void) | React.RefObject<HTMLSpanElement> | null | undefined;
-}, "children" | "id" | "ref" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "lang" | "nonce" | "placeholder" | "slot" | "spellCheck" | "tabIndex" | "title" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "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-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" | "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" | "key"> & import("../../types").DefaultProps) => JSX.Element, any, {}, never>;
+}, "children" | "id" | "ref" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "lang" | "nonce" | "placeholder" | "slot" | "spellCheck" | "tabIndex" | "title" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "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-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" | "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" | "key"> & import("../../core/types").DefaultProps) => JSX.Element, any, {}, never>;
 declare const Card: (props: IProps) => JSX.Element;
 export default Card;

package/{core/Experimental/Card/Card.js → Experimental/Card/index.js}

@@ -8,22 +8,18 @@ exports["default"] = exports.Title = exports.Content = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
-var _icons = require("../../../icons");
+var _icons = require("@/icons");
 var _react = _interopRequireDefault(require("react"));
-var _Typography = _interopRequireDefault(require("../../Typography"));
+var _index = require("@/index");
 var _styledComponents = _interopRequireDefault(require("styled-components"));
-var _IconButton = _interopRequireDefault(require("../../IconButton"));
-var _Paper = _interopRequireDefault(require("../../Paper"));
-var _Line = _interopRequireDefault(require("../../Line"));
-var _Button = _interopRequireDefault(require("../../Button"));
-var _excluded = ["id", "name", "nested", "title", "action", "onToggleEdit", "editing", "label", "children", "onClickAdd"];
+var _excluded = ["id", "name", "nested", "title", "action", "onToggleEdit", "editing", "label", "children", "onClickAdd", "onAddProps", "onEditProps"];
 var _templateObject, _templateObject2, _templateObject3, _templateObject4;
 var Content = _styledComponents["default"].div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n    flex: 1;\n    justify-content: center;\n    display: flex;\n    flex-direction: column;\n    padding: 12px;\n"])));
 exports.Content = Content;
 var Header = _styledComponents["default"].div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["\n    display: flex;\n"])));
-var Title = (0, _styledComponents["default"])(_Typography["default"])(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2["default"])(["\n    flex: 1;\n"])));
+var Title = (0, _styledComponents["default"])(_index.Typography)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2["default"])(["\n    flex: 1;\n"])));
 exports.Title = Title;
-var EditButton = (0, _styledComponents["default"])(_IconButton["default"])(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2["default"])(["\n    && {\n        width: 36px;\n        height: 36px;\n    }\n"])));
+var EditButton = (0, _styledComponents["default"])(_index.IconButton)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2["default"])(["\n    && {\n        width: 36px;\n        height: 36px;\n    }\n"])));
 var NESTED_ELEVATION = 0;
 var paperStyle = {
   flex: 1,
@@ -41,8 +37,10 @@ var Card = function Card(props) {
     label = props.label,
     children = props.children,
     onClickAdd = props.onClickAdd,
+    onAddProps = props.onAddProps,
+    onEditProps = props.onEditProps,
     otherProps = (0, _objectWithoutProperties2["default"])(props, _excluded);
-  return /*#__PURE__*/_react["default"].createElement(_Paper["default"], (0, _extends2["default"])({}, otherProps, {
+  return /*#__PURE__*/_react["default"].createElement(_index.Paper, (0, _extends2["default"])({}, otherProps, {
     name: name,
     id: id,
     style: paperStyle,
@@ -53,15 +51,15 @@ var Card = function Card(props) {
     name: name + '-title',
     variant: "h6",
     color: "primary"
-  }, title), action, onToggleEdit && /*#__PURE__*/_react["default"].createElement(EditButton, {
+  }, title), action, onToggleEdit && /*#__PURE__*/_react["default"].createElement(EditButton, (0, _extends2["default"])({}, onEditProps, {
     className: editing ? '' : 'showable-target',
     name: "".concat(editing ? 'cancel' : 'edit', "-").concat(name),
     margin: "-10px",
     padding: "0px",
     onClick: onToggleEdit
-  }, editing ? /*#__PURE__*/_react["default"].createElement(_icons.Close, null) : /*#__PURE__*/_react["default"].createElement(_icons.Edit, null))), /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_Line["default"], null))), onClickAdd && /*#__PURE__*/_react["default"].createElement(_Button["default"], {
+  }), editing ? /*#__PURE__*/_react["default"].createElement(_icons.Close, null) : /*#__PURE__*/_react["default"].createElement(_icons.Edit, null))), /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_index.Line, null))), onClickAdd && /*#__PURE__*/_react["default"].createElement(_index.Button, (0, _extends2["default"])({}, onAddProps, {
     onClick: onClickAdd
-  }), /*#__PURE__*/_react["default"].createElement("div", null, children));
+  })), /*#__PURE__*/_react["default"].createElement("div", null, children));
 };
 var _default = Card;
 exports["default"] = _default;

package/{core/Experimental → Experimental}/Dialog/Dialog.js

@@ -7,11 +7,9 @@ Object.defineProperty(exports, "__esModule", {
 exports["default"] = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-var _Dialog = _interopRequireDefault(require("../../Dialog"));
+var _index = require("@/index");
 var _react = _interopRequireDefault(require("react"));
 var _nginformaticaStyleguide = require("nginformatica-styleguide");
-var _Button = _interopRequireDefault(require("../../Button"));
-var _ThemeProvider = _interopRequireDefault(require("../../ThemeProvider"));
 var _excluded = ["open", "title", "titleAction", "text", "primaryButtonColor", "primaryButtonName", "primaryButtonText", "secondaryButtonText", "secondaryButtonName", "snippet", "content", "PaperProps", "omitActionButtons", "primaryButtonAction", "secondaryButtonAction", "onClose"];
 var ACTION_REMOVE = _nginformaticaStyleguide.theme.colors.action.cancel;
 var PRIMARY_DARK = _nginformaticaStyleguide.theme.colors.primary.main;
@@ -48,9 +46,9 @@ var DialogV2 = function DialogV2(props) {
     onClose = props.onClose,
     otherProps = (0, _objectWithoutProperties2["default"])(props, _excluded);
   var haveSecondaryButton = secondaryButtonText && secondaryButtonAction;
-  return /*#__PURE__*/_react["default"].createElement(_ThemeProvider["default"], {
+  return /*#__PURE__*/_react["default"].createElement(_index.ThemeProvider, {
     options: theme
-  }, /*#__PURE__*/_react["default"].createElement(_Dialog["default"], (0, _extends2["default"])({}, otherProps, {
+  }, /*#__PURE__*/_react["default"].createElement(_index.Dialog, (0, _extends2["default"])({}, otherProps, {
     open: open,
     titleAction: titleAction,
     title: title,
@@ -58,10 +56,10 @@ var DialogV2 = function DialogV2(props) {
     content: content,
     snippet: snippet,
     PaperProps: PaperProps,
-    actions: !omitActionButtons && /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, haveSecondaryButton && /*#__PURE__*/_react["default"].createElement(_Button["default"], {
+    actions: !omitActionButtons && /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, haveSecondaryButton && /*#__PURE__*/_react["default"].createElement(_index.Button, {
       name: secondaryButtonName || 'secondary-button',
       onClick: secondaryButtonAction
-    }, secondaryButtonText), /*#__PURE__*/_react["default"].createElement(_Button["default"], {
+    }, secondaryButtonText), /*#__PURE__*/_react["default"].createElement(_index.Button, {
       name: primaryButtonName || 'primary-button',
       color: primaryButtonColor,
       variant: "contained",

package/{core/Experimental → Experimental}/Fab/Fab.d.ts

@@ -1,6 +1,6 @@
 import type { MouseEvent, CSSProperties } from 'react';
 export interface IProps {
-    mini?: boolean;
+    large?: boolean;
     className?: string;
     name?: string;
     tooltip?: string;

package/{core/Experimental → Experimental}/Fab/Fab.js

@@ -10,25 +10,23 @@ 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 = _interopRequireWildcard(require("react"));
-var _Fab = _interopRequireDefault(require("../../Fab"));
-var _Tooltip = _interopRequireDefault(require("../../Tooltip"));
-var _excluded = ["mini", "children", "padding", "name", "margin", "style"];
+var _index = require("@/index");
+var _excluded = ["large", "children", "padding", "name", "margin", "style"];
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 var FabV2 = function FabV2(props) {
   var renderButton = function renderButton() {
-    var _props$mini = props.mini,
-      mini = _props$mini === void 0 ? true : _props$mini,
+    var large = props.large,
       children = props.children,
       padding = props.padding,
       name = props.name,
       margin = props.margin,
       style = props.style,
       otherProps = (0, _objectWithoutProperties2["default"])(props, _excluded);
-    return /*#__PURE__*/React.createElement(_Fab["default"], (0, _extends2["default"])({
-      size: mini ? 'small' : 'medium',
+    return /*#__PURE__*/React.createElement(_index.Fab, (0, _extends2["default"])({
+      size: large ? 'medium' : 'small',
       name: name || 'action-button',
       "data-testid": "fab-button"
     }, otherProps, {
@@ -39,7 +37,7 @@ var FabV2 = function FabV2(props) {
       onClick: props.onClick
     }), children);
   };
-  return props.tooltip ? /*#__PURE__*/React.createElement(_Tooltip["default"], {
+  return props.tooltip ? /*#__PURE__*/React.createElement(_index.Tooltip, {
     withWrapper: true,
     title: props.tooltip
   }, renderButton()) : renderButton();

package/Experimental/Loading/index.d.ts

@@ -0,0 +1,7 @@
+export interface IProps {
+    padding?: number | string;
+    margin?: number | string;
+    size?: number;
+}
+declare const Loading: (props: IProps) => JSX.Element;
+export default Loading;

package/Experimental/Loading/index.js

@@ -0,0 +1,41 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
+var _index = require("@/index");
+var _react = _interopRequireWildcard(require("react"));
+var _styledComponents = _interopRequireDefault(require("styled-components"));
+var _templateObject;
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+var LoadingContainer = _styledComponents["default"].div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n    display: flex;\n    flex: 1;\n    align-items: center;\n    justify-content: center;\n"])));
+var Loading = function Loading(props) {
+  var _props$margin = props.margin,
+    margin = _props$margin === void 0 ? 48 : _props$margin,
+    _props$padding = props.padding,
+    padding = _props$padding === void 0 ? 24 : _props$padding,
+    _props$size = props.size,
+    size = _props$size === void 0 ? 72 : _props$size;
+  var renderLoading = (0, _react.useMemo)(function () {
+    return /*#__PURE__*/_react["default"].createElement(_index.Progress, {
+      color: "primary",
+      size: size
+    });
+  }, [size]);
+  return (0, _react.useMemo)(function () {
+    return /*#__PURE__*/_react["default"].createElement(LoadingContainer, {
+      "data-testid": "loading-component",
+      style: {
+        margin: margin,
+        padding: padding
+      }
+    }, renderLoading);
+  }, [margin, padding]);
+};
+var _default = Loading;
+exports["default"] = _default;

package/Experimental/NothingFound/index.d.ts

@@ -0,0 +1,9 @@
+export interface IProps {
+    searchText?: string;
+    customText?: string;
+    buttonLabel?: string;
+    readonly?: boolean;
+    show: boolean;
+}
+declare const NothingFound: (props: IProps) => JSX.Element | null;
+export default NothingFound;

package/Experimental/NothingFound/index.js

@@ -0,0 +1,29 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var _index = require("@/index");
+var _react = _interopRequireDefault(require("react"));
+var NothingFound = function NothingFound(props) {
+  var label = props.buttonLabel || 'Adicionar';
+  var message = props.readonly ? 'Não há nada aqui.' : 'Não há nada aqui. Clique em "' + label + '" para cadastrar um item.';
+  var _props$customText = props.customText,
+    customText = _props$customText === void 0 ? message : _props$customText,
+    _props$searchText = props.searchText,
+    searchText = _props$searchText === void 0 ? '' : _props$searchText,
+    show = props.show;
+  return show ? /*#__PURE__*/_react["default"].createElement(_index.Typography, {
+    align: "center",
+    variant: "h5",
+    color: "textSecondary",
+    padding: "48px 0",
+    style: {
+      flex: 1
+    }
+  }, searchText !== '' ? 'Sua pesquisa "' + searchText + '" não retornou nenhum resultado.' : customText) : null;
+};
+var _default = NothingFound;
+exports["default"] = _default;

package/Experimental/Panel/index.d.ts

@@ -0,0 +1,22 @@
+import React, { CSSProperties, ChangeEvent, ReactNode } from 'react';
+export interface IProps {
+    expanded?: boolean;
+    defaultExpanded?: boolean;
+    hideSummary?: boolean;
+    elevation?: number;
+    summary?: ReactNode;
+    title?: string | ReactNode;
+    area?: string;
+    details?: JSX.Element;
+    actions?: JSX.Element;
+    nested?: boolean;
+    id?: string;
+    style?: CSSProperties;
+    className?: string;
+    hideExpansionIcon?: boolean;
+    detailsStyle?: CSSProperties;
+    onChange?(event?: ChangeEvent<Record<string, unknown>>, expanded?: boolean): void;
+    onClick?(event: React.MouseEvent<HTMLDivElement>): void;
+}
+declare const Panel: (props: IProps) => JSX.Element;
+export default Panel;

package/Experimental/Panel/index.js

@@ -0,0 +1,77 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+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"));
+var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
+var _defaultTo = _interopRequireDefault(require("ramda/es/defaultTo"));
+var _react = _interopRequireDefault(require("react"));
+var _styledComponents = _interopRequireDefault(require("styled-components"));
+var _icons = require("@/icons");
+var _index = require("@/index");
+var _excluded = ["hideExpansionIcon", "expanded", "defaultExpanded", "id", "nested", "elevation", "hideSummary", "title", "summary", "details", "actions", "area", "style", "className", "detailsStyle", "onChange", "onClick"];
+var _templateObject, _templateObject2, _templateObject3;
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+var Paper = (0, _styledComponents["default"])(_index.ExpansionPanel)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n    && {\n        border-radius: 4px;\n        ::before {\n            height: 0px;\n            background-color: transparent;\n        }\n    }\n"])));
+var Summary = _styledComponents["default"].div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["\n    display: flex;\n    flex: 1;\n    align-items: center;\n"])));
+var Title = (0, _styledComponents["default"])(_index.Typography)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2["default"])(["\n    && {\n        flex: 1;\n    }\n"])));
+var NESTED_ELEVATION = 0;
+var DEFAULT_ELEVATION = 2;
+var Panel = function Panel(props) {
+  var hideExpansionIcon = props.hideExpansionIcon,
+    expanded = props.expanded,
+    defaultExpanded = props.defaultExpanded,
+    id = props.id,
+    nested = props.nested,
+    elevation = props.elevation,
+    hideSummary = props.hideSummary,
+    title = props.title,
+    summary = props.summary,
+    details = props.details,
+    actions = props.actions,
+    area = props.area,
+    style = props.style,
+    className = props.className,
+    detailsStyle = props.detailsStyle,
+    onChange = props.onChange,
+    onClick = props.onClick,
+    otherProps = (0, _objectWithoutProperties2["default"])(props, _excluded);
+  var omitCursor = hideExpansionIcon ? {
+    summaryStyle: {
+      cursor: 'auto'
+    }
+  } : undefined;
+  return /*#__PURE__*/_react["default"].createElement(Paper, (0, _extends2["default"])({}, otherProps, {
+    expanded: expanded,
+    id: id,
+    "data-testid": "panel-component",
+    defaultExpanded: (0, _defaultTo["default"])(true, defaultExpanded),
+    elevation: nested ? NESTED_ELEVATION : (0, _defaultTo["default"])(DEFAULT_ELEVATION, elevation),
+    summary: !hideSummary && /*#__PURE__*/_react["default"].createElement(Summary, null, title && /*#__PURE__*/_react["default"].createElement(Title, {
+      noWrap: true,
+      variant: "subtitle1"
+    }, title), summary),
+    details: details,
+    expandIcon: !hideExpansionIcon && /*#__PURE__*/_react["default"].createElement(_icons.ExpandMore, {
+      "data-testid": "expand-icon"
+    }),
+    actions: actions,
+    margin: "0px",
+    style: _objectSpread({
+      gridArea: area,
+      border: nested ? '1px solid lightgrey' : undefined
+    }, style),
+    className: className,
+    detailsStyle: detailsStyle,
+    onChange: onChange,
+    onClick: onClick
+  }, omitCursor));
+};
+var _default = Panel;
+exports["default"] = _default;