flipper-ui 0.39.3 → 0.39.5

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 (13) hide show
  1. package/core/data-display/table-interactive/TableInteractive.d.ts +3 -2
  2. package/core/data-display/table-interactive/TableInteractive.js +2 -2
  3. package/core/data-display/table-interactive/styles.d.ts +1 -1
  4. package/core/data-display/table-interactive/styles.js +1 -3
  5. package/core/data-display/table-interactive/utils.d.ts +4 -0
  6. package/core/data-display/table-interactive/utils.js +10 -3
  7. package/core/feedback/progress/index.d.ts +1 -1
  8. package/core/feedback/progress/index.js +3 -1
  9. package/core/inputs/date-time/index.js +4 -4
  10. package/core/surfaces/step-card/styles.js +3 -3
  11. package/icons/specific/IconAddLink.js +4 -4
  12. package/icons/specific/IconRemoveLink.js +4 -4
  13. package/package.json +1 -1
package/core/data-display/table-interactive/TableInteractive.d.ts CHANGED
@@ -27,8 +27,9 @@ export interface ITableInteractive extends Omit<TableProps, 'children'> {
27
27
  isCollapsible?: boolean;
28
28
  visibleColumns?: string[];
29
29
  columnsTemporary?: string[];
30
+ rowsPerPageOptions?: number[];
31
+ headerActions?: JSX.Element | undefined;
30
32
  valuesInvoices?: Record<string, unknown>[];
31
- headerActions?: React.JSX.Element | undefined;
32
33
  onCancel?: () => void;
33
34
  onConfirm?: () => void;
34
35
  handleOpen?: () => void;
@@ -36,7 +37,7 @@ export interface ITableInteractive extends Omit<TableProps, 'children'> {
36
37
  setPage?: Dispatch<SetStateAction<number>>;
37
38
  setRowsPerPage?: Dispatch<SetStateAction<number>>;
38
39
  children?: (item: Record<string, unknown>) => ReactNode;
40
+ rowsContent: () => JSX.Element | JSX.Element[] | undefined;
39
41
  setColumnsTemporary?: (value: SetStateAction<string[]>) => void;
40
- rowsContent: () => React.JSX.Element | React.JSX.Element[] | undefined;
41
42
  }
42
43
  export declare const TableInteractive: (props: ITableInteractive) => React.JSX.Element;
package/core/data-display/table-interactive/TableInteractive.js CHANGED
@@ -27,7 +27,7 @@ var Direction = exports.Direction = /*#__PURE__*/function (Direction) {
27
27
  return Direction;
28
28
  }({});
29
29
  var TableInteractive = exports.TableInteractive = function TableInteractive(props) {
30
- var _props$rowsPerPage, _props$page, _props$rowsPerPage2;
30
+ var _props$rowsPerPage, _props$page, _props$rowsPerPage2, _props$rowsPerPageOpt;
31
31
  var handlePageCount = function handlePageCount() {
32
32
  if (props.valuesInvoices) {
33
33
  return Number(props.valuesInvoices.length);
@@ -74,7 +74,7 @@ var TableInteractive = exports.TableInteractive = function TableInteractive(prop
74
74
  page: page,
75
75
  count: count,
76
76
  rowsPerPage: (_props$rowsPerPage2 = props.rowsPerPage) !== null && _props$rowsPerPage2 !== void 0 ? _props$rowsPerPage2 : 10,
77
- rowsPerPageOptions: [10, 25, 50, 100],
77
+ rowsPerPageOptions: (_props$rowsPerPageOpt = props.rowsPerPageOptions) !== null && _props$rowsPerPageOpt !== void 0 ? _props$rowsPerPageOpt : [10, 25, 50, 100],
78
78
  ActionsComponent: _TablePaginationActions.TablePaginationActions,
79
79
  onPageChange: function onPageChange(_, page) {
80
80
  var _props$setPage;
package/core/data-display/table-interactive/styles.d.ts CHANGED
@@ -14,5 +14,5 @@ export declare const TableCellInteractive: import("@emotion/styled").StyledCompo
14
14
  theme?: import("@emotion/react").Theme;
15
15
  } & {
16
16
  width?: string;
17
- fixed?: boolean;
17
+ fixed?: string;
18
18
  }, {}, {}>;
package/core/data-display/table-interactive/styles.js CHANGED
@@ -15,7 +15,5 @@ var ContentWrapper = exports.ContentWrapper = _styled["default"].div(_templateOb
15
15
  var TableHeaderContent = exports.TableHeaderContent = _styled["default"].div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["\n display: flex;\n justify-content: flex-end;\n gap: 8px;\n margin: 0 0 8px 0;\n\n & > div {\n display: flex;\n justify-content: flex-end;\n gap: 8px;\n }\n"])));
16
16
  var ActionsWrapper = exports.ActionsWrapper = _styled["default"].div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2["default"])(["\n display: flex;\n align-items: center;\n justify-content: space-between;\n width: 100%;\n"])));
17
17
  var TableCellInteractive = exports.TableCellInteractive = (0, _styled["default"])(_tableCell["default"])(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2["default"])(["\n && {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n min-width: 60px;\n max-width: ", ";\n\n @media (max-width: 1440px) {\n padding: 16px 8px;\n }\n }\n"])), function (props) {
18
- return props.fixed ? function (props) {
19
- return props.width;
20
- } : 'none';
18
+ return props.fixed ? props.width : 'none';
21
19
  });
package/core/data-display/table-interactive/utils.d.ts CHANGED
@@ -1,6 +1,10 @@
1
1
  import React from 'react';
2
2
  import type { ITableInteractive } from './TableInteractive';
3
3
  export declare const STORAGE_KEY = "visible-columns";
4
+ export declare const getDefaultColumns: (columns: {
5
+ name: string;
6
+ show: boolean;
7
+ }[]) => string[];
4
8
  export declare const getInitialColumns: (columns: {
5
9
  name: string;
6
10
  label: string;
package/core/data-display/table-interactive/utils.js CHANGED
@@ -4,10 +4,17 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
4
4
  Object.defineProperty(exports, "__esModule", {
5
5
  value: true
6
6
  });
7
- exports.setVisibleColumns = exports.getVisibleColumns = exports.getOrderedVisibleColumns = exports.getInitialColumns = exports.generateHeader = exports.STORAGE_KEY = void 0;
7
+ exports.setVisibleColumns = exports.getVisibleColumns = exports.getOrderedVisibleColumns = exports.getInitialColumns = exports.getDefaultColumns = exports.generateHeader = exports.STORAGE_KEY = void 0;
8
8
  var _react = _interopRequireDefault(require("react"));
9
9
  var _styles = require("./styles");
10
10
  var STORAGE_KEY = exports.STORAGE_KEY = 'visible-columns';
11
+ var getDefaultColumns = exports.getDefaultColumns = function getDefaultColumns(columns) {
12
+ return columns.filter(function (col) {
13
+ return col.show;
14
+ }).map(function (col) {
15
+ return col.name;
16
+ });
17
+ };
11
18
  var getInitialColumns = exports.getInitialColumns = function getInitialColumns(columns, key) {
12
19
  var stored = localStorage.getItem(STORAGE_KEY);
13
20
  if (stored) {
@@ -32,11 +39,11 @@ var setVisibleColumns = exports.setVisibleColumns = function setVisibleColumns(c
32
39
  var generateHeader = exports.generateHeader = function generateHeader(header, visibleColumns, sortable, fixed) {
33
40
  if (!(visibleColumns !== null && visibleColumns !== void 0 && visibleColumns.includes(header.name))) return null;
34
41
  return /*#__PURE__*/_react["default"].createElement(_styles.TableCellInteractive, {
35
- fixed: fixed,
36
42
  name: header.name,
37
43
  sortable: sortable,
38
44
  width: header.width,
39
- key: header.name + '-header'
45
+ key: header.name + '-header',
46
+ fixed: fixed ? 'fixed' : undefined
40
47
  }, header.label);
41
48
  };
42
49
  var getVisibleColumns = exports.getVisibleColumns = function getVisibleColumns(headers, visibleColumns) {
package/core/feedback/progress/index.d.ts CHANGED
@@ -22,5 +22,5 @@ export interface IColors {
22
22
  barPrimaryColor?: string;
23
23
  barSecondaryColor?: string;
24
24
  }
25
- declare const Progress: ({ linear, style, margin, padding, primaryColor, barPrimaryColor, barSecondaryColor, ...otherProps }: ProgressProps & ICircular & ILinear) => React.JSX.Element;
25
+ declare const Progress: ({ linear, style, margin, padding, valueBuffer, primaryColor, barPrimaryColor, barSecondaryColor, ...otherProps }: ProgressProps & ICircular & ILinear) => React.JSX.Element;
26
26
  export default Progress;
package/core/feedback/progress/index.js CHANGED
@@ -11,7 +11,7 @@ var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/h
11
11
  var _react = _interopRequireDefault(require("react"));
12
12
  var _CircularProgress = _interopRequireDefault(require("@mui/material/CircularProgress"));
13
13
  var _LinearProgress = _interopRequireDefault(require("@mui/material/LinearProgress"));
14
- var _excluded = ["linear", "style", "margin", "padding", "primaryColor", "barPrimaryColor", "barSecondaryColor"];
14
+ var _excluded = ["linear", "style", "margin", "padding", "valueBuffer", "primaryColor", "barPrimaryColor", "barSecondaryColor"];
15
15
  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; }
16
16
  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; }
17
17
  var Progress = function Progress(_ref) {
@@ -20,6 +20,7 @@ var Progress = function Progress(_ref) {
20
20
  style = _ref$style === void 0 ? {} : _ref$style,
21
21
  margin = _ref.margin,
22
22
  padding = _ref.padding,
23
+ valueBuffer = _ref.valueBuffer,
23
24
  primaryColor = _ref.primaryColor,
24
25
  barPrimaryColor = _ref.barPrimaryColor,
25
26
  barSecondaryColor = _ref.barSecondaryColor,
@@ -29,6 +30,7 @@ var Progress = function Progress(_ref) {
29
30
  margin: margin,
30
31
  padding: padding
31
32
  }, style),
33
+ valueBuffer: valueBuffer,
32
34
  sx: {
33
35
  backgroundColor: primaryColor,
34
36
  '.MuiLinearProgress-barColorPrimary': {
package/core/inputs/date-time/index.js CHANGED
@@ -131,10 +131,10 @@ var CustomStaticDateTimePicker = function CustomStaticDateTimePicker(props) {
131
131
  minHeight: '160px',
132
132
  transition: 'min-height 200ms ease-in-out'
133
133
  },
134
- '& .MuiPickersSlideTransition-root:has(.MuiDayCalendar-monthContainer > :nth-child(5))': {
134
+ '& .MuiPickersSlideTransition-root:has(.MuiDayCalendar-monthContainer > :nth-of-type(5))': {
135
135
  minHeight: '200px'
136
136
  },
137
- '& .MuiPickersSlideTransition-root:has(.MuiDayCalendar-monthContainer > :nth-child(6))': {
137
+ '& .MuiPickersSlideTransition-root:has(.MuiDayCalendar-monthContainer > :nth-of-type(6))': {
138
138
  minHeight: '240px'
139
139
  }
140
140
  }
@@ -225,10 +225,10 @@ var DateTime = function DateTime(_ref) {
225
225
  minHeight: '160px',
226
226
  transition: 'min-height 200ms ease-in-out'
227
227
  },
228
- '& .MuiPickersSlideTransition-root:has(.MuiDayCalendar-monthContainer > :nth-child(5))': {
228
+ '& .MuiPickersSlideTransition-root:has(.MuiDayCalendar-monthContainer > :nth-of-type(5))': {
229
229
  minHeight: '200px'
230
230
  },
231
- '& .MuiPickersSlideTransition-root:has(.MuiDayCalendar-monthContainer > :nth-child(6))': {
231
+ '& .MuiPickersSlideTransition-root:has(.MuiDayCalendar-monthContainer > :nth-of-type(6))': {
232
232
  minHeight: '240px'
233
233
  }
234
234
  }
package/core/surfaces/step-card/styles.js CHANGED
@@ -25,11 +25,11 @@ var StepCardColumn = exports.StepCardColumn = _styled["default"].div(_templateOb
25
25
  return props.justifyContent;
26
26
  }, function (props) {
27
27
  if (props.justifyContent === 'start') {
28
- return "\n svg:first-child {\n margin-right: 40px;\n }\n ";
28
+ return "\n svg:first-of-type {\n margin-right: 40px;\n }\n ";
29
29
  }
30
30
  return '';
31
31
  });
32
- var ListItemContainer = exports.ListItemContainer = _styled["default"].li(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2["default"])(["\n display: flex;\n flex-direction: row;\n align-items: center;\n height: 30px;\n margin: 16px 0;\n\n svg:first-child {\n margin-right: 16px;\n }\n"])));
33
- var TitleContainer = exports.TitleContainer = _styled["default"].div(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2["default"])(["\n h6:first-child {\n padding-inline: 20px;\n }\n\n span {\n margin-left: 20px;\n }\n"])));
32
+ var ListItemContainer = exports.ListItemContainer = _styled["default"].li(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2["default"])(["\n display: flex;\n flex-direction: row;\n align-items: center;\n height: 30px;\n margin: 16px 0;\n\n svg:first-of-type {\n margin-right: 16px;\n }\n"])));
33
+ var TitleContainer = exports.TitleContainer = _styled["default"].div(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2["default"])(["\n h6:first-of-type {\n padding-inline: 20px;\n }\n\n span {\n margin-left: 20px;\n }\n"])));
34
34
  var NormalProgressContainer = exports.NormalProgressContainer = _styled["default"].div(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2["default"])(["\n width: 100%;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n"])));
35
35
  var NormalProgressContent = exports.NormalProgressContent = _styled["default"].div(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2["default"])(["\n width: 100%;\n display: flex;\n align-items: center;\n justify-content: space-between;\n margin-bottom: 8px;\n"])));
package/icons/specific/IconAddLink.js CHANGED
@@ -20,13 +20,13 @@ var IconAddLink = exports.IconAddLink = function IconAddLink(_ref) {
20
20
  viewBox: viewBox || '0 0 24 24',
21
21
  xmlns: "http://www.w3.org/2000/svg"
22
22
  }, /*#__PURE__*/_react["default"].createElement("path", {
23
- "fill-rule": "evenodd",
24
- "clip-rule": "evenodd",
23
+ fillRule: "evenodd",
24
+ clipRule: "evenodd",
25
25
  d: "M9.06776 11.5811L4.87885 15.77C3.95346 16.6954 3.95346 18.1958 4.87885 19.1212C5.80423 20.0465 7.30459 20.0465 8.22998 19.1212L12.4189 14.9322C13.3443 14.0069 13.3443 12.5065 12.4189 11.5811C11.4935 10.6557 9.99315 10.6557 9.06776 11.5811ZM4.04106 14.9322C2.65298 16.3203 2.65298 18.5709 4.04106 19.9589C5.42915 21.347 7.67968 21.347 9.06776 19.9589L13.2567 15.77C14.6448 14.3819 14.6448 12.1314 13.2567 10.7433C11.8686 9.35524 9.61806 9.35524 8.22998 10.7433L4.04106 14.9322Z",
26
26
  fill: color || primary.main
27
27
  }), /*#__PURE__*/_react["default"].createElement("path", {
28
- "fill-rule": "evenodd",
29
- "clip-rule": "evenodd",
28
+ fillRule: "evenodd",
29
+ clipRule: "evenodd",
30
30
  d: "M15.77 4.87885L11.5811 9.06776C10.6557 9.99315 10.6557 11.4935 11.5811 12.4189C12.5065 13.3443 14.0069 13.3443 14.9322 12.4189L19.1212 8.22998C20.0465 7.30459 20.0465 5.80423 19.1212 4.87885C18.1958 3.95346 16.6954 3.95346 15.77 4.87885ZM10.7433 8.22998C9.35524 9.61806 9.35524 11.8686 10.7433 13.2567C12.1314 14.6448 14.3819 14.6448 15.77 13.2567L19.9589 9.06776C21.347 7.67968 21.347 5.42915 19.9589 4.04106C18.5709 2.65298 16.3203 2.65298 14.9322 4.04106L10.7433 8.22998Z",
31
31
  fill: color || primary.main
32
32
  }), /*#__PURE__*/_react["default"].createElement("path", {
package/icons/specific/IconRemoveLink.js CHANGED
@@ -20,13 +20,13 @@ var IconRemoveLink = exports.IconRemoveLink = function IconRemoveLink(_ref) {
20
20
  viewBox: viewBox || '0 0 24 24',
21
21
  xmlns: "http://www.w3.org/2000/svg"
22
22
  }, /*#__PURE__*/_react["default"].createElement("path", {
23
- "fill-rule": "evenodd",
24
- "clip-rule": "evenodd",
23
+ fillRule: "evenodd",
24
+ clipRule: "evenodd",
25
25
  d: "M9.06776 11.5811L4.87885 15.77C3.95346 16.6954 3.95346 18.1958 4.87885 19.1212C5.80423 20.0465 7.30459 20.0465 8.22998 19.1212L12.4189 14.9322C13.3443 14.0069 13.3443 12.5065 12.4189 11.5811C11.4935 10.6557 9.99315 10.6557 9.06776 11.5811ZM4.04106 14.9322C2.65298 16.3203 2.65298 18.5709 4.04106 19.9589C5.42915 21.347 7.67968 21.347 9.06776 19.9589L13.2567 15.77C14.6448 14.3819 14.6448 12.1314 13.2567 10.7433C11.8686 9.35524 9.61806 9.35524 8.22998 10.7433L4.04106 14.9322Z",
26
26
  fill: color || primary.main
27
27
  }), /*#__PURE__*/_react["default"].createElement("path", {
28
- "fill-rule": "evenodd",
29
- "clip-rule": "evenodd",
28
+ fillRule: "evenodd",
29
+ clipRule: "evenodd",
30
30
  d: "M15.77 4.87885L11.5811 9.06776C10.6557 9.99315 10.6557 11.4935 11.5811 12.4189C12.5065 13.3443 14.0069 13.3443 14.9322 12.4189L19.1212 8.22998C20.0465 7.30459 20.0465 5.80423 19.1212 4.87885C18.1958 3.95346 16.6954 3.95346 15.77 4.87885ZM10.7433 8.22998C9.35524 9.61806 9.35524 11.8686 10.7433 13.2567C12.1314 14.6448 14.3819 14.6448 15.77 13.2567L19.9589 9.06776C21.347 7.67968 21.347 5.42915 19.9589 4.04106C18.5709 2.65298 16.3203 2.65298 14.9322 4.04106L10.7433 8.22998Z",
31
31
  fill: color || primary.main
32
32
  }), /*#__PURE__*/_react["default"].createElement("path", {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "flipper-ui",
3
- "version": "0.39.3",
3
+ "version": "0.39.5",
4
4
  "description": "React UI based on the @mui/material toolkit for the web",
5
5
  "main": "dist/index.js",
6
6
  "author": "NG",