flipper-ui 0.26.23 → 0.27.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (71) hide show
  1. package/core/AutoComplete.d.ts +1 -1
  2. package/core/ChipField.d.ts +1 -1
  3. package/core/DataTable/DataTable.d.ts +2 -2
  4. package/core/DataTable/DataTableAction.d.ts +1 -1
  5. package/core/DataTable/DataTableQueryPaginated.d.ts +2 -2
  6. package/core/DataTable/Rows.d.ts +2 -2
  7. package/core/DataTable/Rows.js +1 -1
  8. package/core/DataTable/types.d.ts +16 -16
  9. package/core/DataTable/useRowsState.d.ts +1 -1
  10. package/core/DateTime.d.ts +1 -1
  11. package/core/EditableTable.d.ts +1 -1
  12. package/core/Experimental/Button/Button.d.ts +9 -0
  13. package/core/Experimental/Button/Button.js +28 -0
  14. package/core/Experimental/Button/button.spec.d.ts +1 -0
  15. package/core/Experimental/Button/button.spec.js +32 -0
  16. package/core/Experimental/Button/button.stories.d.ts +6 -0
  17. package/core/Experimental/Button/button.stories.js +21 -0
  18. package/core/Experimental/Button/index.d.ts +1 -0
  19. package/core/Experimental/Button/index.js +13 -0
  20. package/core/Experimental/Card/Card.d.ts +29 -0
  21. package/core/Experimental/Card/Card.js +67 -0
  22. package/core/Experimental/Card/card.stories.d.ts +6 -0
  23. package/core/Experimental/Card/card.stories.js +22 -0
  24. package/core/Experimental/Card/index.d.ts +1 -0
  25. package/core/Experimental/Card/index.js +13 -0
  26. package/core/Experimental/Dialog/ConfirmDialog.d.ts +14 -0
  27. package/core/Experimental/Dialog/ConfirmDialog.js +35 -0
  28. package/core/Experimental/Dialog/Dialog.d.ts +21 -0
  29. package/core/Experimental/Dialog/Dialog.js +75 -0
  30. package/core/Experimental/Dialog/Dialog.stories.d.ts +12 -0
  31. package/core/Experimental/Dialog/Dialog.stories.js +84 -0
  32. package/core/Experimental/Dialog/RemoveDialog.d.ts +14 -0
  33. package/core/Experimental/Dialog/RemoveDialog.js +38 -0
  34. package/core/Experimental/Dialog/__test__/confirm-dialog.spec.d.ts +1 -0
  35. package/core/Experimental/Dialog/__test__/confirm-dialog.spec.js +132 -0
  36. package/core/Experimental/Dialog/__test__/dialog.spec.d.ts +1 -0
  37. package/core/Experimental/Dialog/__test__/dialog.spec.js +63 -0
  38. package/core/Experimental/Dialog/__test__/remove-dialog.spec.d.ts +1 -0
  39. package/core/Experimental/Dialog/__test__/remove-dialog.spec.js +131 -0
  40. package/core/Experimental/Dialog/index.d.ts +3 -0
  41. package/core/Experimental/Dialog/index.js +27 -0
  42. package/core/Experimental/Fab/Fab.d.ts +14 -0
  43. package/core/Experimental/Fab/Fab.js +48 -0
  44. package/core/Experimental/Fab/Fab.stories.d.ts +9 -0
  45. package/core/Experimental/Fab/Fab.stories.js +29 -0
  46. package/core/Experimental/Fab/FabWrapper.d.ts +10 -0
  47. package/core/Experimental/Fab/FabWrapper.js +32 -0
  48. package/core/Experimental/Fab/fab.spec.d.ts +1 -0
  49. package/core/Experimental/Fab/fab.spec.js +51 -0
  50. package/core/Experimental/Fab/index.d.ts +2 -0
  51. package/core/Experimental/Fab/index.js +20 -0
  52. package/core/Experimental/Sidebar/Sidebar.stories.d.ts +7 -0
  53. package/core/Experimental/Sidebar/Sidebar.stories.js +51 -0
  54. package/core/Experimental/Sidebar/SidebarV2.d.ts +19 -0
  55. package/core/Experimental/Sidebar/SidebarV2.js +143 -0
  56. package/core/Experimental/Sidebar/index.d.ts +1 -0
  57. package/core/Experimental/Sidebar/index.js +13 -0
  58. package/core/Experimental/Sidebar/sidebar.spec.d.ts +1 -0
  59. package/core/Experimental/Sidebar/sidebar.spec.js +129 -0
  60. package/core/Experimental/index.d.ts +5 -0
  61. package/core/Experimental/index.js +60 -0
  62. package/core/ListItem.js +1 -0
  63. package/core/Sidebar.js +1 -0
  64. package/core/Slider.d.ts +1 -1
  65. package/core/Stepper.d.ts +1 -1
  66. package/core/TextField.d.ts +1 -1
  67. package/core/types.d.ts +1 -1
  68. package/index.d.ts +1 -0
  69. package/index.js +7 -1
  70. package/package.json +8 -10
  71. package/stories/Sidebar.stories.js +5 -0
@@ -35,6 +35,6 @@ interface ISelected {
35
35
  type?: string;
36
36
  subheader?: boolean;
37
37
  }
38
- declare type TSelected = ISelected | string;
38
+ type TSelected = ISelected | string;
39
39
  declare const AutoComplete: (props: AutoCompleteProps) => JSX.Element;
40
40
  export default AutoComplete;
@@ -17,7 +17,7 @@ interface ChipFieldProps<T extends TChipValues> {
17
17
  onAdd: (values: string) => void;
18
18
  onDelete: (value: string, index?: number) => void;
19
19
  }
20
- export declare type TChipValues = {
20
+ export type TChipValues = {
21
21
  value: string | number;
22
22
  };
23
23
  declare const ChipField: <T extends TChipValues>(props: ChipFieldProps<T>) => JSX.Element;
@@ -1,6 +1,6 @@
1
1
  import React, { MutableRefObject, CSSProperties } from 'react';
2
2
  import { ColumnSpec, Data, DataTableController, Errors, PaginationOptions, RowViewComponent, StackView } from './types';
3
- export declare type DataTableProps<D extends Data, V extends StackView = Record<string, unknown>> = {
3
+ export type DataTableProps<D extends Data, V extends StackView = Record<string, unknown>> = {
4
4
  /**
5
5
  * The data to be shown in the table
6
6
  */
@@ -61,5 +61,5 @@ export declare type DataTableProps<D extends Data, V extends StackView = Record<
61
61
  rowViews?: Record<keyof V, RowViewComponent<D>>;
62
62
  onRowClick?: (event: React.MouseEvent<HTMLTableRowElement>, rowData: D) => void;
63
63
  };
64
- export declare const DataTable: <D extends Data, V extends Record<string, unknown>>(props: DataTableProps<D, V>) => JSX.Element;
64
+ export declare const DataTable: <D extends Data, V extends import("./types").RecordUnknown>(props: DataTableProps<D, V>) => JSX.Element;
65
65
  export default DataTable;
@@ -1,5 +1,5 @@
1
1
  import { ReactNode } from 'react';
2
- export declare type DataTableActionProps = {
2
+ export type DataTableActionProps = {
3
3
  label: string;
4
4
  children: ReactNode;
5
5
  color?: 'primary' | 'secondary' | 'inherit' | 'default';
@@ -1,6 +1,6 @@
1
1
  import React, { MutableRefObject, CSSProperties } from 'react';
2
2
  import { ColumnSpec, Data, DataTableController, Errors, PaginationOptions, RowViewComponent, StackView } from './types';
3
- export declare type DataTableProps<D extends Data, V extends StackView = Record<string, unknown>> = {
3
+ export type DataTableProps<D extends Data, V extends StackView = Record<string, unknown>> = {
4
4
  /**
5
5
  * The data to be shown in the table
6
6
  */
@@ -81,5 +81,5 @@ export declare type DataTableProps<D extends Data, V extends StackView = Record<
81
81
  rowViews?: Record<keyof V, RowViewComponent<D>>;
82
82
  onRowClick?: (event: React.MouseEvent<HTMLTableRowElement>, rowData: D) => void;
83
83
  };
84
- export declare const DataTableQueryPaginated: <D extends Data, V extends Record<string, unknown>>(props: DataTableProps<D, V>) => JSX.Element;
84
+ export declare const DataTableQueryPaginated: <D extends Data, V extends import("./types").RecordUnknown>(props: DataTableProps<D, V>) => JSX.Element;
85
85
  export default DataTableQueryPaginated;
@@ -1,5 +1,5 @@
1
1
  import { ColumnSpec, Data, Errors, PartialData, RowMode } from './types';
2
- declare type StatefulRowProps<D extends Data> = {
2
+ type StatefulRowProps<D extends Data> = {
3
3
  data: D;
4
4
  mode: RowMode;
5
5
  errors?: Errors<D>;
@@ -8,7 +8,7 @@ declare type StatefulRowProps<D extends Data> = {
8
8
  onUpdate?(partial: Partial<Data>): void;
9
9
  };
10
10
  export declare const StatefulRow: <D extends Data>({ data, mode, errors, columns, onUpdate, isHidden }: StatefulRowProps<D>) => JSX.Element;
11
- declare type NewRowProps<D extends Data> = {
11
+ type NewRowProps<D extends Data> = {
12
12
  data: PartialData<D>;
13
13
  errors?: Errors<D>;
14
14
  columns: ColumnSpec<D>[];
@@ -140,7 +140,7 @@ var StatefulRow = function StatefulRow(_ref) {
140
140
  setEditableState = _useState2[1];
141
141
  var partialUpdate = (0, _react.useCallback)(function (field, value) {
142
142
  setEditableState(function (values) {
143
- return _objectSpread(_objectSpread({}, values), {}, (0, _defineProperty2["default"])({}, "".concat(field), value));
143
+ return _objectSpread(_objectSpread({}, values), {}, (0, _defineProperty2["default"])({}, "".concat(String(field)), value));
144
144
  });
145
145
  var patch = {};
146
146
  patch[field] = value;
@@ -1,16 +1,16 @@
1
1
  import type { CSSProperties, FunctionComponent } from 'react';
2
- export declare type RecordUnknown = Record<string, unknown>;
3
- export declare type StackView = RecordUnknown;
4
- export declare type Identifier = string | number;
2
+ export type RecordUnknown = Record<string, unknown>;
3
+ export type StackView = RecordUnknown;
4
+ export type Identifier = string | number;
5
5
  export interface Data extends RecordUnknown {
6
6
  id: Identifier;
7
7
  }
8
- export declare type PartialData<D extends RecordUnknown> = Partial<D> & {
8
+ export type PartialData<D extends RecordUnknown> = Partial<D> & {
9
9
  id: Identifier;
10
10
  };
11
- export declare type ColumnType = 'datetime' | 'text' | 'number' | 'numeric-float' | 'numeric-int';
12
- export declare type Align = 'right' | 'left' | 'center' | 'justify' | 'inherit';
13
- declare type ColumnSpecBase<F = {}> = {
11
+ export type ColumnType = 'datetime' | 'text' | 'number' | 'numeric-float' | 'numeric-int';
12
+ export type Align = 'right' | 'left' | 'center' | 'justify' | 'inherit';
13
+ type ColumnSpecBase<F = {}> = {
14
14
  title: string;
15
15
  type: string;
16
16
  cellStyle?: CSSProperties;
@@ -18,7 +18,7 @@ declare type ColumnSpecBase<F = {}> = {
18
18
  align?: Align;
19
19
  renderCell?: FunctionComponent<F>;
20
20
  };
21
- export declare type RenderCellProps<D extends Data> = {
21
+ export type RenderCellProps<D extends Data> = {
22
22
  data: D;
23
23
  rowMode: RowMode;
24
24
  value: unknown;
@@ -31,7 +31,7 @@ interface ColumnSpecDefault<D extends Data> extends ColumnSpecBase<RenderCellPro
31
31
  editable?: boolean;
32
32
  getValue?(value: unknown): string;
33
33
  }
34
- export declare type ActionsCellProps<D extends Data> = {
34
+ export type ActionsCellProps<D extends Data> = {
35
35
  data: PartialData<D>;
36
36
  rowMode: RowMode;
37
37
  isNew?: boolean;
@@ -40,8 +40,8 @@ interface ColumnSpecActions<D extends Data> extends ColumnSpecBase<ActionsCellPr
40
40
  type: 'actions';
41
41
  renderCell: FunctionComponent<ActionsCellProps<D>>;
42
42
  }
43
- export declare type ColumnSpec<D extends Data> = ColumnSpecDefault<D> | ColumnSpecActions<D>;
44
- export declare type PaginationOptions = {
43
+ export type ColumnSpec<D extends Data> = ColumnSpecDefault<D> | ColumnSpecActions<D>;
44
+ export type PaginationOptions = {
45
45
  rowsPerPage: number;
46
46
  labelRowsPerPage: string;
47
47
  labelDisplayedRows: (param: {
@@ -55,7 +55,7 @@ export declare type PaginationOptions = {
55
55
  disabled: boolean;
56
56
  clickable: boolean;
57
57
  };
58
- export declare type RowAction<D> = {
58
+ export type RowAction<D> = {
59
59
  type: 'add' | 'delete' | 'update';
60
60
  data: D;
61
61
  };
@@ -64,17 +64,17 @@ export declare enum RowMode {
64
64
  View = 1,
65
65
  Edit = 2
66
66
  }
67
- export declare type RowState<D extends Data, S extends StackView> = {
67
+ export type RowState<D extends Data, S extends StackView> = {
68
68
  mode: RowMode;
69
69
  stackView: (keyof S)[];
70
70
  currentState?: D;
71
71
  editableState: Partial<D>;
72
72
  };
73
- export declare type RowViewComponent<D> = FunctionComponent<{
73
+ export type RowViewComponent<D> = FunctionComponent<{
74
74
  popRowView?: () => void;
75
75
  data: D;
76
76
  }>;
77
- export declare type DataTableController<D extends Data, V extends StackView> = {
77
+ export type DataTableController<D extends Data, V extends StackView> = {
78
78
  /**
79
79
  * Actives the edit mode for a row
80
80
  */
@@ -105,5 +105,5 @@ export declare type DataTableController<D extends Data, V extends StackView> = {
105
105
  pushRowView(id: Identifier, view: keyof V): void;
106
106
  popRowView(id: Identifier): void;
107
107
  };
108
- export declare type Errors<D> = Partial<Record<Identifier, Set<keyof D>>>;
108
+ export type Errors<D> = Partial<Record<Identifier, Set<keyof D>>>;
109
109
  export {};
@@ -1,5 +1,5 @@
1
1
  import { Data, Identifier, RowState } from './types';
2
- export declare const useRowsState: <D extends Data, V extends Record<string, unknown>>(rows: D[], isHidden?: boolean, newRow?: Partial<D> | undefined) => {
2
+ export declare const useRowsState: <D extends Data, V extends import("./types").RecordUnknown>(rows: D[], isHidden?: boolean, newRow?: Partial<D> | undefined) => {
3
3
  getRowState: (id: Identifier) => RowState<D, V> | undefined;
4
4
  setEditableRowState: (id: Identifier) => (patch: Partial<D>) => void;
5
5
  setRowState: (id: Identifier, partial: Partial<RowState<D, V>>) => void;
@@ -14,6 +14,6 @@ interface IProps {
14
14
  onAuxClickCapture?(event: React.MouseEvent<HTMLDivElement, MouseEvent>): void;
15
15
  onChange(date: MaterialUiPickersDate | null, value?: string): void;
16
16
  }
17
- export declare type DateTimeProps = Omit<KeyboardDatePickerProps, 'margin' | 'onChange'> & Omit<KeyboardDateTimePickerProps, 'margin' | 'onChange'> & Omit<KeyboardTimePickerProps, 'margin' | 'onChange'> & IProps & DefaultProps;
17
+ export type DateTimeProps = Omit<KeyboardDatePickerProps, 'margin' | 'onChange'> & Omit<KeyboardDateTimePickerProps, 'margin' | 'onChange'> & Omit<KeyboardTimePickerProps, 'margin' | 'onChange'> & IProps & DefaultProps;
18
18
  declare const DateTime: ({ padding, margin, style, format, variant, inputVariant, ampm, invalidDateMessage, minDateMessage, maxDateMessage, locale, type, ...otherProps }: DateTimeProps) => JSX.Element;
19
19
  export default DateTime;
@@ -22,7 +22,7 @@ interface EditableTableProps<T extends object> {
22
22
  onRowUpdateCancelled?: (newData: object) => Promise<void>;
23
23
  onClickAdd?(): void;
24
24
  }
25
- export declare type TSuggestion = {
25
+ export type TSuggestion = {
26
26
  label: string;
27
27
  value: string;
28
28
  };
@@ -0,0 +1,9 @@
1
+ export type Props = {
2
+ label?: string;
3
+ name: string;
4
+ margin?: string | number;
5
+ padding?: string | number;
6
+ onClick?(): void;
7
+ };
8
+ declare const AddButton: (props: Props) => JSX.Element;
9
+ export default AddButton;
@@ -0,0 +1,28 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+ Object.defineProperty(exports, "__esModule", {
5
+ value: true
6
+ });
7
+ exports["default"] = void 0;
8
+ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
9
+ var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
10
+ var _Button = _interopRequireDefault(require("../../Button"));
11
+ var _icons = require("../../../icons");
12
+ var _react = _interopRequireDefault(require("react"));
13
+ var _styledComponents = _interopRequireDefault(require("styled-components"));
14
+ var _templateObject;
15
+ 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"])));
16
+ var AddButton = function AddButton(props) {
17
+ return /*#__PURE__*/_react["default"].createElement(ButtonStyled, (0, _extends2["default"])({}, props, {
18
+ variant: "dashed",
19
+ color: "primary",
20
+ id: 'add-' + props.name,
21
+ name: 'add-' + props.name,
22
+ padding: props.padding,
23
+ margin: props.margin || '12px 0 24px',
24
+ onClick: props.onClick
25
+ }), /*#__PURE__*/_react["default"].createElement(_icons.NoteAdd, null), props.label);
26
+ };
27
+ var _default = AddButton;
28
+ exports["default"] = _default;
@@ -0,0 +1 @@
1
+ export {};
@@ -0,0 +1,32 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+ var _typeof = require("@babel/runtime/helpers/typeof");
5
+ var React = _interopRequireWildcard(require("react"));
6
+ var _react2 = require("@testing-library/react");
7
+ var _Button = _interopRequireDefault(require("./Button"));
8
+ 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); }
9
+ 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; }
10
+ describe('Button', function () {
11
+ var NAME = 'btnName';
12
+ var LABEL = 'Click Me';
13
+ it('should render', function () {
14
+ (0, _react2.render)( /*#__PURE__*/React.createElement(_Button["default"], {
15
+ name: NAME,
16
+ label: LABEL
17
+ }));
18
+ var button = _react2.screen.getByText(LABEL);
19
+ expect(button).toBeDefined();
20
+ });
21
+ it('should call onClick', function () {
22
+ var onClick = jest.fn();
23
+ (0, _react2.render)( /*#__PURE__*/React.createElement(_Button["default"], {
24
+ name: NAME,
25
+ label: LABEL,
26
+ onClick: onClick
27
+ }));
28
+ var button = _react2.screen.getByText(LABEL);
29
+ button.click();
30
+ expect(onClick).toHaveBeenCalled();
31
+ });
32
+ });
@@ -0,0 +1,6 @@
1
+ export declare const button: () => JSX.Element;
2
+ declare const _default: {
3
+ title: string;
4
+ component: (props: import("./Button").Props) => JSX.Element;
5
+ };
6
+ export default _default;
@@ -0,0 +1,21 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+ Object.defineProperty(exports, "__esModule", {
5
+ value: true
6
+ });
7
+ exports["default"] = exports.button = void 0;
8
+ var _react = _interopRequireDefault(require("react"));
9
+ var _Button = _interopRequireDefault(require("./Button"));
10
+ var button = function button() {
11
+ return /*#__PURE__*/_react["default"].createElement(_Button["default"], {
12
+ name: "AddFoo",
13
+ label: "Add Foo"
14
+ });
15
+ };
16
+ exports.button = button;
17
+ var _default = {
18
+ title: 'v2/Button',
19
+ component: _Button["default"]
20
+ };
21
+ exports["default"] = _default;
@@ -0,0 +1 @@
1
+ export { default as Button } from './Button';
@@ -0,0 +1,13 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+ Object.defineProperty(exports, "__esModule", {
5
+ value: true
6
+ });
7
+ Object.defineProperty(exports, "Button", {
8
+ enumerable: true,
9
+ get: function get() {
10
+ return _Button["default"];
11
+ }
12
+ });
13
+ var _Button = _interopRequireDefault(require("./Button"));
@@ -0,0 +1,29 @@
1
+ import React from 'react';
2
+ export interface IProps {
3
+ children: React.ReactNode;
4
+ label?: string;
5
+ nested?: boolean;
6
+ title?: string;
7
+ name: string;
8
+ id?: string;
9
+ editing?: boolean;
10
+ action?: JSX.Element | null;
11
+ onClickAdd?(): void;
12
+ onToggleEdit?(): void;
13
+ }
14
+ export declare const Content: import("styled-components").StyledComponent<"div", any, {}, never>;
15
+ export declare const Title: import("styled-components").StyledComponent<({ children, margin, padding, style, variant, ...otherProps }: {
16
+ align?: import("@material-ui/core").PropTypes.Alignment | undefined;
17
+ children?: React.ReactNode;
18
+ color?: "inherit" | "initial" | "primary" | "secondary" | "textPrimary" | "textSecondary" | "error" | undefined;
19
+ display?: "initial" | "block" | "inline" | undefined;
20
+ gutterBottom?: boolean | undefined;
21
+ noWrap?: boolean | undefined;
22
+ paragraph?: boolean | undefined;
23
+ variant?: "inherit" | (import("@material-ui/core").TypographyVariant | "srOnly") | undefined;
24
+ variantMapping?: Partial<Record<import("@material-ui/core").TypographyVariant | "srOnly", string>> | undefined;
25
+ } & 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>> & {
26
+ ref?: ((instance: HTMLSpanElement | null) => void) | React.RefObject<HTMLSpanElement> | null | undefined;
27
+ }, "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>;
28
+ declare const Card: (props: IProps) => JSX.Element;
29
+ export default Card;
@@ -0,0 +1,67 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+ Object.defineProperty(exports, "__esModule", {
5
+ value: true
6
+ });
7
+ exports["default"] = exports.Title = exports.Content = void 0;
8
+ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
9
+ var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
10
+ var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
11
+ var _icons = require("../../../icons");
12
+ var _react = _interopRequireDefault(require("react"));
13
+ var _Typography = _interopRequireDefault(require("../../Typography"));
14
+ var _styledComponents = _interopRequireDefault(require("styled-components"));
15
+ var _IconButton = _interopRequireDefault(require("../../IconButton"));
16
+ var _Paper = _interopRequireDefault(require("../../Paper"));
17
+ var _Line = _interopRequireDefault(require("../../Line"));
18
+ var _Button = _interopRequireDefault(require("../../Button"));
19
+ var _excluded = ["id", "name", "nested", "title", "action", "onToggleEdit", "editing", "label", "children", "onClickAdd"];
20
+ var _templateObject, _templateObject2, _templateObject3, _templateObject4;
21
+ 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"])));
22
+ exports.Content = Content;
23
+ var Header = _styledComponents["default"].div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["\n display: flex;\n"])));
24
+ var Title = (0, _styledComponents["default"])(_Typography["default"])(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2["default"])(["\n flex: 1;\n"])));
25
+ exports.Title = Title;
26
+ var EditButton = (0, _styledComponents["default"])(_IconButton["default"])(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2["default"])(["\n && {\n width: 36px;\n height: 36px;\n }\n"])));
27
+ var NESTED_ELEVATION = 0;
28
+ var paperStyle = {
29
+ flex: 1,
30
+ display: 'flex',
31
+ flexDirection: 'column'
32
+ };
33
+ var Card = function Card(props) {
34
+ var id = props.id,
35
+ name = props.name,
36
+ nested = props.nested,
37
+ title = props.title,
38
+ action = props.action,
39
+ onToggleEdit = props.onToggleEdit,
40
+ editing = props.editing,
41
+ label = props.label,
42
+ children = props.children,
43
+ onClickAdd = props.onClickAdd,
44
+ otherProps = (0, _objectWithoutProperties2["default"])(props, _excluded);
45
+ return /*#__PURE__*/_react["default"].createElement(_Paper["default"], (0, _extends2["default"])({}, otherProps, {
46
+ name: name,
47
+ id: id,
48
+ style: paperStyle,
49
+ className: "showable",
50
+ elevation: nested ? NESTED_ELEVATION : undefined,
51
+ padding: nested ? '0' : '24px'
52
+ }), title && /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(Header, null, title && /*#__PURE__*/_react["default"].createElement(Title, {
53
+ name: name + '-title',
54
+ variant: "h6",
55
+ color: "primary"
56
+ }, title), action, onToggleEdit && /*#__PURE__*/_react["default"].createElement(EditButton, {
57
+ className: editing ? '' : 'showable-target',
58
+ name: "".concat(editing ? 'cancel' : 'edit', "-").concat(name),
59
+ margin: "-10px",
60
+ padding: "0px",
61
+ onClick: onToggleEdit
62
+ }, 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"], {
63
+ onClick: onClickAdd
64
+ }), /*#__PURE__*/_react["default"].createElement("div", null, children));
65
+ };
66
+ var _default = Card;
67
+ exports["default"] = _default;
@@ -0,0 +1,6 @@
1
+ export declare const card: () => JSX.Element;
2
+ declare const _default: {
3
+ title: string;
4
+ component: (props: import("./Card").IProps) => JSX.Element;
5
+ };
6
+ export default _default;
@@ -0,0 +1,22 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+ Object.defineProperty(exports, "__esModule", {
5
+ value: true
6
+ });
7
+ exports["default"] = exports.card = void 0;
8
+ var _react = _interopRequireDefault(require("react"));
9
+ var _Card = _interopRequireDefault(require("./Card"));
10
+ var _Typography = _interopRequireDefault(require("../../Typography"));
11
+ var card = function card() {
12
+ return /*#__PURE__*/_react["default"].createElement(_Card["default"], {
13
+ name: "Card",
14
+ title: "Foo Bar"
15
+ }, /*#__PURE__*/_react["default"].createElement(_Typography["default"], null, "Dummy content"));
16
+ };
17
+ exports.card = card;
18
+ var _default = {
19
+ title: 'experimental/Card',
20
+ component: _Card["default"]
21
+ };
22
+ exports["default"] = _default;
@@ -0,0 +1 @@
1
+ export { default as Card } from './Card';
@@ -0,0 +1,13 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+ Object.defineProperty(exports, "__esModule", {
5
+ value: true
6
+ });
7
+ Object.defineProperty(exports, "Card", {
8
+ enumerable: true,
9
+ get: function get() {
10
+ return _Card["default"];
11
+ }
12
+ });
13
+ var _Card = _interopRequireDefault(require("./Card"));
@@ -0,0 +1,14 @@
1
+ export interface IProps {
2
+ open: boolean;
3
+ title: string;
4
+ text: string;
5
+ disableBackdropClick?: boolean;
6
+ labels?: {
7
+ cancel?: string;
8
+ confirm?: string;
9
+ };
10
+ onCancel(): void;
11
+ onConfirm(): void;
12
+ }
13
+ declare const ConfirmDialog: (props: IProps) => JSX.Element;
14
+ export default ConfirmDialog;
@@ -0,0 +1,35 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+ Object.defineProperty(exports, "__esModule", {
5
+ value: true
6
+ });
7
+ exports["default"] = void 0;
8
+ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
9
+ var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
10
+ var _react = _interopRequireDefault(require("react"));
11
+ var _Dialog = _interopRequireDefault(require("./Dialog"));
12
+ var _excluded = ["open", "title", "text", "labels", "onCancel", "onConfirm", "disableBackdropClick"];
13
+ var ConfirmDialog = function ConfirmDialog(props) {
14
+ var open = props.open,
15
+ title = props.title,
16
+ text = props.text,
17
+ labels = props.labels,
18
+ onCancel = props.onCancel,
19
+ onConfirm = props.onConfirm,
20
+ disableBackdropClick = props.disableBackdropClick,
21
+ otherProps = (0, _objectWithoutProperties2["default"])(props, _excluded);
22
+ return /*#__PURE__*/_react["default"].createElement(_Dialog["default"], (0, _extends2["default"])({}, otherProps, {
23
+ open: open,
24
+ title: title,
25
+ text: text,
26
+ primaryButtonAction: onConfirm,
27
+ primaryButtonText: labels && labels.confirm || 'Sim',
28
+ secondaryButtonText: labels && labels.cancel || 'Voltar',
29
+ primaryButtonColor: "primary",
30
+ secondaryButtonAction: onCancel,
31
+ onClose: disableBackdropClick ? undefined : onCancel
32
+ }));
33
+ };
34
+ var _default = ConfirmDialog;
35
+ exports["default"] = _default;
@@ -0,0 +1,21 @@
1
+ import { MouseEvent, ReactNode } from 'react';
2
+ export interface IProps {
3
+ open: boolean;
4
+ title: string;
5
+ titleAction?: string | ReactNode;
6
+ text?: string;
7
+ primaryButtonColor?: 'default' | 'primary' | 'inherit' | 'secondary';
8
+ primaryButtonName?: string;
9
+ primaryButtonText: string;
10
+ secondaryButtonText?: string;
11
+ secondaryButtonName?: string;
12
+ snippet?: JSX.Element | ReactNode;
13
+ content?: JSX.Element | ReactNode;
14
+ PaperProps?: Record<string, unknown>;
15
+ omitActionButtons?: boolean;
16
+ primaryButtonAction(event: MouseEvent<HTMLButtonElement>): void;
17
+ secondaryButtonAction?(event: MouseEvent<HTMLButtonElement>): void;
18
+ onClose?(): void;
19
+ }
20
+ declare const DialogV2: (props: IProps) => JSX.Element;
21
+ export default DialogV2;
@@ -0,0 +1,75 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+ Object.defineProperty(exports, "__esModule", {
5
+ value: true
6
+ });
7
+ exports["default"] = void 0;
8
+ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
9
+ var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
10
+ var _Dialog = _interopRequireDefault(require("../../Dialog"));
11
+ var _react = _interopRequireDefault(require("react"));
12
+ var _nginformaticaStyleguide = require("nginformatica-styleguide");
13
+ var _Button = _interopRequireDefault(require("../../Button"));
14
+ var _ThemeProvider = _interopRequireDefault(require("../../ThemeProvider"));
15
+ var _excluded = ["open", "title", "titleAction", "text", "primaryButtonColor", "primaryButtonName", "primaryButtonText", "secondaryButtonText", "secondaryButtonName", "snippet", "content", "PaperProps", "omitActionButtons", "primaryButtonAction", "secondaryButtonAction", "onClose"];
16
+ var ACTION_REMOVE = _nginformaticaStyleguide.theme.colors.action.cancel;
17
+ var PRIMARY_DARK = _nginformaticaStyleguide.theme.colors.primary.main;
18
+ var theme = {
19
+ palette: {
20
+ primary: {
21
+ main: PRIMARY_DARK
22
+ },
23
+ secondary: {
24
+ main: ACTION_REMOVE
25
+ },
26
+ typography: {
27
+ useNextVariants: true
28
+ }
29
+ }
30
+ };
31
+ var DialogV2 = function DialogV2(props) {
32
+ // extract all itens from props
33
+ var open = props.open,
34
+ title = props.title,
35
+ titleAction = props.titleAction,
36
+ text = props.text,
37
+ primaryButtonColor = props.primaryButtonColor,
38
+ primaryButtonName = props.primaryButtonName,
39
+ primaryButtonText = props.primaryButtonText,
40
+ secondaryButtonText = props.secondaryButtonText,
41
+ secondaryButtonName = props.secondaryButtonName,
42
+ snippet = props.snippet,
43
+ content = props.content,
44
+ PaperProps = props.PaperProps,
45
+ omitActionButtons = props.omitActionButtons,
46
+ primaryButtonAction = props.primaryButtonAction,
47
+ secondaryButtonAction = props.secondaryButtonAction,
48
+ onClose = props.onClose,
49
+ otherProps = (0, _objectWithoutProperties2["default"])(props, _excluded);
50
+ var haveSecondaryButton = secondaryButtonText && secondaryButtonAction;
51
+ return /*#__PURE__*/_react["default"].createElement(_ThemeProvider["default"], {
52
+ options: theme
53
+ }, /*#__PURE__*/_react["default"].createElement(_Dialog["default"], (0, _extends2["default"])({}, otherProps, {
54
+ open: open,
55
+ titleAction: titleAction,
56
+ title: title,
57
+ text: text,
58
+ content: content,
59
+ snippet: snippet,
60
+ PaperProps: PaperProps,
61
+ actions: !omitActionButtons && /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, haveSecondaryButton && /*#__PURE__*/_react["default"].createElement(_Button["default"], {
62
+ name: secondaryButtonName || 'secondary-button',
63
+ onClick: secondaryButtonAction
64
+ }, secondaryButtonText), /*#__PURE__*/_react["default"].createElement(_Button["default"], {
65
+ name: primaryButtonName || 'primary-button',
66
+ color: primaryButtonColor,
67
+ variant: "contained",
68
+ margin: "6px 12px",
69
+ onClick: primaryButtonAction
70
+ }, primaryButtonText)),
71
+ onClose: onClose
72
+ })));
73
+ };
74
+ var _default = DialogV2;
75
+ exports["default"] = _default;