@tenancy.nz/ui 1.2.14 → 1.3.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 (11) hide show
  1. package/dist/cjs/components/BankAccountInput.cjs +12 -6
  2. package/dist/cjs/components/Button.styled.cjs +17 -8
  3. package/dist/cjs/components/FileUpload.cjs +4 -1
  4. package/dist/cjs/components/FileUploadItem.cjs +5 -4
  5. package/dist/cjs/utils/helpers/file.cjs +1 -1
  6. package/dist/esm/components/BankAccountInput.js +13 -7
  7. package/dist/esm/components/Button.styled.js +17 -9
  8. package/dist/esm/components/FileUpload.js +4 -1
  9. package/dist/esm/components/FileUploadItem.js +5 -4
  10. package/dist/esm/utils/helpers/file.js +1 -1
  11. package/package.json +1 -1
package/dist/cjs/components/BankAccountInput.cjs CHANGED
@@ -38,26 +38,26 @@ function BankAccountInput(_ref) {
38
38
  _ref$showError = _ref.showError,
39
39
  showError = _ref$showError === void 0 ? false : _ref$showError,
40
40
  _ref$value = _ref.value,
41
- value = _ref$value === void 0 ? void 0 : _ref$value,
41
+ value = _ref$value === void 0 ? {} : _ref$value,
42
42
  _ref$variant = _ref.variant,
43
43
  variant = _ref$variant === void 0 ? "outlined" : _ref$variant;
44
44
  var bankRef = React.useRef(null);
45
45
  var branchRef = React.useRef(null);
46
46
  var accountRef = React.useRef(null);
47
47
  var suffixRef = React.useRef(null);
48
- var _useState = React.useState(value && value.bank || ""),
48
+ var _useState = React.useState(""),
49
49
  _useState2 = _rollupPluginBabelHelpers.slicedToArray(_useState, 2),
50
50
  bank = _useState2[0],
51
51
  setBank = _useState2[1];
52
- var _useState3 = React.useState(value && value.branch || ""),
52
+ var _useState3 = React.useState(""),
53
53
  _useState4 = _rollupPluginBabelHelpers.slicedToArray(_useState3, 2),
54
54
  branch = _useState4[0],
55
55
  setBranch = _useState4[1];
56
- var _useState5 = React.useState(value && value.account || ""),
56
+ var _useState5 = React.useState(""),
57
57
  _useState6 = _rollupPluginBabelHelpers.slicedToArray(_useState5, 2),
58
58
  account = _useState6[0],
59
59
  setAccount = _useState6[1];
60
- var _useState7 = React.useState(value && value.suffix || ""),
60
+ var _useState7 = React.useState(""),
61
61
  _useState8 = _rollupPluginBabelHelpers.slicedToArray(_useState7, 2),
62
62
  suffix = _useState8[0],
63
63
  setSuffix = _useState8[1];
@@ -65,7 +65,12 @@ function BankAccountInput(_ref) {
65
65
  _useState0 = _rollupPluginBabelHelpers.slicedToArray(_useState9, 2),
66
66
  focused = _useState0[0],
67
67
  setFocused = _useState0[1];
68
- var valueStr = "".concat(bank).concat(branch).concat(account).concat(suffix);
68
+ React.useEffect(function () {
69
+ setBank(value && value.bank || "");
70
+ setBranch(value && value.branch || "");
71
+ setAccount(value && value.account || "");
72
+ setSuffix(value && value.suffix || "");
73
+ }, [value]);
69
74
  var handleFocus = function handleFocus() {
70
75
  setFocused(true);
71
76
  };
@@ -173,6 +178,7 @@ function BankAccountInput(_ref) {
173
178
  setSuffix(values.suffix);
174
179
  }
175
180
  };
181
+ var valueStr = "".concat(bank).concat(branch).concat(account).concat(suffix);
176
182
  return /* @__PURE__ */React.createElement(BankAccountInput_styled.StyledWrapper, {
177
183
  fullWidth: fullWidth
178
184
  }, /* @__PURE__ */React.createElement(FormControl.default, {
package/dist/cjs/components/Button.styled.cjs CHANGED
@@ -8,7 +8,7 @@ var react = require('@emotion/react');
8
8
  var styles = require('@mui/material/styles');
9
9
  var object = require('../utils/helpers/object.cjs');
10
10
 
11
- var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject0, _templateObject1, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14;
11
+ var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject0, _templateObject1, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15;
12
12
  var edgesStyles = function edgesStyles(_ref) {
13
13
  var edges = _ref.edges,
14
14
  theme = _ref.theme;
@@ -32,14 +32,19 @@ var outlinedStyles = function outlinedStyles(_ref4) {
32
32
  theme = _ref4.theme;
33
33
  return react.css(_templateObject12 || (_templateObject12 = _rollupPluginBabelHelpers.taggedTemplateLiteral(["\n color: ", ";\n background-color: transparent;\n border: 1px solid currentColor;\n\n .MuiButton-loadingWrapper {\n color: ", ";\n }\n\n &:hover,\n &:active {\n background-color: ", ";\n }\n\n ", "\n"])), object.getObjectProp(theme, "vars.palette.".concat(color, ".main")), object.getObjectProp(theme, "vars.palette.".concat(color, ".main")), object.getObjectProp(theme, "vars.palette.background.muted"), focusStyles);
34
34
  };
35
- var StyledButton = styles.styled(Button)(_templateObject13 || (_templateObject13 = _rollupPluginBabelHelpers.taggedTemplateLiteral(["\n ", "\n"])), function (_ref5) {
35
+ var textStyles = function textStyles(_ref5) {
36
36
  var color = _ref5.color,
37
- disabled = _ref5.disabled,
38
- edges = _ref5.edges,
39
- size = _ref5.size,
40
- theme = _ref5.theme,
41
- variant = _ref5.variant;
42
- return react.css(_templateObject14 || (_templateObject14 = _rollupPluginBabelHelpers.taggedTemplateLiteral(["\n && {\n padding: 0px 24px;\n text-transform: initial;\n font-weight: 700;\n\n ", "\n ", "\n ", "\n ", "\n ", "\n }\n "])), edgesStyles({
37
+ theme = _ref5.theme;
38
+ return react.css(_templateObject13 || (_templateObject13 = _rollupPluginBabelHelpers.taggedTemplateLiteral(["\n && {\n color: ", ";\n background-color: transparent;\n border: none;\n\n .MuiButton-loadingWrapper {\n color: ", ";\n }\n\n &:hover,\n &:active {\n background-color: ", ";\n }\n\n ", "\n }\n"])), object.getObjectProp(theme, "vars.palette.".concat(color, ".main")), object.getObjectProp(theme, "vars.palette.".concat(color, ".main")), object.getObjectProp(theme, "vars.palette.background.muted"), focusStyles);
39
+ };
40
+ var StyledButton = styles.styled(Button)(_templateObject14 || (_templateObject14 = _rollupPluginBabelHelpers.taggedTemplateLiteral(["\n ", "\n"])), function (_ref6) {
41
+ var color = _ref6.color,
42
+ disabled = _ref6.disabled,
43
+ edges = _ref6.edges,
44
+ size = _ref6.size,
45
+ theme = _ref6.theme,
46
+ variant = _ref6.variant;
47
+ return react.css(_templateObject15 || (_templateObject15 = _rollupPluginBabelHelpers.taggedTemplateLiteral(["\n && {\n padding: 0px 24px;\n text-transform: initial;\n font-weight: 700;\n\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n }\n "])), edgesStyles({
43
48
  edges: edges,
44
49
  theme: theme
45
50
  }), sizeStyles({
@@ -51,6 +56,9 @@ var StyledButton = styles.styled(Button)(_templateObject13 || (_templateObject13
51
56
  }), variant === "outlined" && !disabled && outlinedStyles({
52
57
  color: color,
53
58
  theme: theme
59
+ }), variant === "text" && !disabled && textStyles({
60
+ color: color,
61
+ theme: theme
54
62
  }));
55
63
  });
56
64
 
@@ -61,3 +69,4 @@ exports.edgesStyles = edgesStyles;
61
69
  exports.focusStyles = focusStyles;
62
70
  exports.outlinedStyles = outlinedStyles;
63
71
  exports.sizeStyles = sizeStyles;
72
+ exports.textStyles = textStyles;
package/dist/cjs/components/FileUpload.cjs CHANGED
@@ -172,7 +172,10 @@ function FileUpload(_ref) {
172
172
  disableGutter: true
173
173
  }) : null,
174
174
  useFlexGap: true,
175
- spacing: "24px"
175
+ spacing: "24px",
176
+ sx: {
177
+ mt: "16px"
178
+ }
176
179
  }, files.map(function (file$1, index) {
177
180
  if (typeof renderItem === "function") {
178
181
  return renderItem(file$1, index);
package/dist/cjs/components/FileUploadItem.cjs CHANGED
@@ -22,10 +22,11 @@ function FileUploadItem(_ref) {
22
22
  file$1 = _ref.file,
23
23
  _ref$message = _ref.message,
24
24
  message = _ref$message === void 0 ? void 0 : _ref$message,
25
- onDelete = _ref.onDelete,
25
+ _ref$onDelete = _ref.onDelete,
26
+ onDelete = _ref$onDelete === void 0 ? void 0 : _ref$onDelete,
26
27
  _ref$sx = _ref.sx,
27
28
  sx = _ref$sx === void 0 ? {} : _ref$sx;
28
- var displayName = file.getFileName(file$1).replace("./", "");
29
+ var name = file.getFileName(file$1);
29
30
  var styles = _rollupPluginBabelHelpers.objectSpread2({
30
31
  py: "6px"
31
32
  }, sx);
@@ -66,7 +67,7 @@ function FileUploadItem(_ref) {
66
67
  fontSize: "16px"
67
68
  },
68
69
  color: "primary"
69
- }, displayName), message && /* @__PURE__ */React.createElement(Text.default, {
70
+ }, name), message && /* @__PURE__ */React.createElement(Text.default, {
70
71
  sx: {
71
72
  fontSize: "14px",
72
73
  mt: "4px"
@@ -81,7 +82,7 @@ function FileUploadItem(_ref) {
81
82
  color: "error"
82
83
  }) : /* @__PURE__ */React.createElement(CheckCircleOutlineRoundedIcon, {
83
84
  color: "tertiary"
84
- }), /* @__PURE__ */React.createElement(IconButton.default, {
85
+ }), onDelete && /* @__PURE__ */React.createElement(IconButton.default, {
85
86
  onClick: onDelete,
86
87
  color: "primary"
87
88
  }, /* @__PURE__ */React.createElement(DeleteTwoToneIcon, null))));
package/dist/cjs/utils/helpers/file.cjs CHANGED
@@ -11,7 +11,7 @@ var getFileNameFromURL = function getFileNameFromURL(file) {
11
11
  };
12
12
  var getFileName = function getFileName(file) {
13
13
  if (file.filename) {
14
- return file.filename;
14
+ return file.filename.replace("./", "");
15
15
  }
16
16
  if (file.url) {
17
17
  return getFileNameFromURL(file);
package/dist/esm/components/BankAccountInput.js CHANGED
@@ -1,5 +1,5 @@
1
1
  import { slicedToArray as _slicedToArray } from '../_virtual/_rollupPluginBabelHelpers.js';
2
- import React, { useRef, useState } from 'react';
2
+ import React, { useRef, useState, useEffect } from 'react';
3
3
  import PropTypes from 'prop-types';
4
4
  import CancelIcon from '@mui/icons-material/Cancel';
5
5
  import FormControl from './FormControl.js';
@@ -34,26 +34,26 @@ function BankAccountInput(_ref) {
34
34
  _ref$showError = _ref.showError,
35
35
  showError = _ref$showError === void 0 ? false : _ref$showError,
36
36
  _ref$value = _ref.value,
37
- value = _ref$value === void 0 ? void 0 : _ref$value,
37
+ value = _ref$value === void 0 ? {} : _ref$value,
38
38
  _ref$variant = _ref.variant,
39
39
  variant = _ref$variant === void 0 ? "outlined" : _ref$variant;
40
40
  var bankRef = useRef(null);
41
41
  var branchRef = useRef(null);
42
42
  var accountRef = useRef(null);
43
43
  var suffixRef = useRef(null);
44
- var _useState = useState(value && value.bank || ""),
44
+ var _useState = useState(""),
45
45
  _useState2 = _slicedToArray(_useState, 2),
46
46
  bank = _useState2[0],
47
47
  setBank = _useState2[1];
48
- var _useState3 = useState(value && value.branch || ""),
48
+ var _useState3 = useState(""),
49
49
  _useState4 = _slicedToArray(_useState3, 2),
50
50
  branch = _useState4[0],
51
51
  setBranch = _useState4[1];
52
- var _useState5 = useState(value && value.account || ""),
52
+ var _useState5 = useState(""),
53
53
  _useState6 = _slicedToArray(_useState5, 2),
54
54
  account = _useState6[0],
55
55
  setAccount = _useState6[1];
56
- var _useState7 = useState(value && value.suffix || ""),
56
+ var _useState7 = useState(""),
57
57
  _useState8 = _slicedToArray(_useState7, 2),
58
58
  suffix = _useState8[0],
59
59
  setSuffix = _useState8[1];
@@ -61,7 +61,12 @@ function BankAccountInput(_ref) {
61
61
  _useState0 = _slicedToArray(_useState9, 2),
62
62
  focused = _useState0[0],
63
63
  setFocused = _useState0[1];
64
- var valueStr = "".concat(bank).concat(branch).concat(account).concat(suffix);
64
+ useEffect(function () {
65
+ setBank(value && value.bank || "");
66
+ setBranch(value && value.branch || "");
67
+ setAccount(value && value.account || "");
68
+ setSuffix(value && value.suffix || "");
69
+ }, [value]);
65
70
  var handleFocus = function handleFocus() {
66
71
  setFocused(true);
67
72
  };
@@ -169,6 +174,7 @@ function BankAccountInput(_ref) {
169
174
  setSuffix(values.suffix);
170
175
  }
171
176
  };
177
+ var valueStr = "".concat(bank).concat(branch).concat(account).concat(suffix);
172
178
  return /* @__PURE__ */React.createElement(StyledWrapper, {
173
179
  fullWidth: fullWidth
174
180
  }, /* @__PURE__ */React.createElement(FormControl, {
package/dist/esm/components/Button.styled.js CHANGED
@@ -4,7 +4,7 @@ import { css } from '@emotion/react';
4
4
  import { styled } from '@mui/material/styles';
5
5
  import { getObjectProp } from '../utils/helpers/object.js';
6
6
 
7
- var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject0, _templateObject1, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14;
7
+ var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject0, _templateObject1, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15;
8
8
  var edgesStyles = function edgesStyles(_ref) {
9
9
  var edges = _ref.edges,
10
10
  theme = _ref.theme;
@@ -28,14 +28,19 @@ var outlinedStyles = function outlinedStyles(_ref4) {
28
28
  theme = _ref4.theme;
29
29
  return css(_templateObject12 || (_templateObject12 = _taggedTemplateLiteral(["\n color: ", ";\n background-color: transparent;\n border: 1px solid currentColor;\n\n .MuiButton-loadingWrapper {\n color: ", ";\n }\n\n &:hover,\n &:active {\n background-color: ", ";\n }\n\n ", "\n"])), getObjectProp(theme, "vars.palette.".concat(color, ".main")), getObjectProp(theme, "vars.palette.".concat(color, ".main")), getObjectProp(theme, "vars.palette.background.muted"), focusStyles);
30
30
  };
31
- var StyledButton = styled(Button)(_templateObject13 || (_templateObject13 = _taggedTemplateLiteral(["\n ", "\n"])), function (_ref5) {
31
+ var textStyles = function textStyles(_ref5) {
32
32
  var color = _ref5.color,
33
- disabled = _ref5.disabled,
34
- edges = _ref5.edges,
35
- size = _ref5.size,
36
- theme = _ref5.theme,
37
- variant = _ref5.variant;
38
- return css(_templateObject14 || (_templateObject14 = _taggedTemplateLiteral(["\n && {\n padding: 0px 24px;\n text-transform: initial;\n font-weight: 700;\n\n ", "\n ", "\n ", "\n ", "\n ", "\n }\n "])), edgesStyles({
33
+ theme = _ref5.theme;
34
+ return css(_templateObject13 || (_templateObject13 = _taggedTemplateLiteral(["\n && {\n color: ", ";\n background-color: transparent;\n border: none;\n\n .MuiButton-loadingWrapper {\n color: ", ";\n }\n\n &:hover,\n &:active {\n background-color: ", ";\n }\n\n ", "\n }\n"])), getObjectProp(theme, "vars.palette.".concat(color, ".main")), getObjectProp(theme, "vars.palette.".concat(color, ".main")), getObjectProp(theme, "vars.palette.background.muted"), focusStyles);
35
+ };
36
+ var StyledButton = styled(Button)(_templateObject14 || (_templateObject14 = _taggedTemplateLiteral(["\n ", "\n"])), function (_ref6) {
37
+ var color = _ref6.color,
38
+ disabled = _ref6.disabled,
39
+ edges = _ref6.edges,
40
+ size = _ref6.size,
41
+ theme = _ref6.theme,
42
+ variant = _ref6.variant;
43
+ return css(_templateObject15 || (_templateObject15 = _taggedTemplateLiteral(["\n && {\n padding: 0px 24px;\n text-transform: initial;\n font-weight: 700;\n\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n }\n "])), edgesStyles({
39
44
  edges: edges,
40
45
  theme: theme
41
46
  }), sizeStyles({
@@ -47,7 +52,10 @@ var StyledButton = styled(Button)(_templateObject13 || (_templateObject13 = _tag
47
52
  }), variant === "outlined" && !disabled && outlinedStyles({
48
53
  color: color,
49
54
  theme: theme
55
+ }), variant === "text" && !disabled && textStyles({
56
+ color: color,
57
+ theme: theme
50
58
  }));
51
59
  });
52
60
 
53
- export { containedStyles, StyledButton as default, disabledStyles, edgesStyles, focusStyles, outlinedStyles, sizeStyles };
61
+ export { containedStyles, StyledButton as default, disabledStyles, edgesStyles, focusStyles, outlinedStyles, sizeStyles, textStyles };
package/dist/esm/components/FileUpload.js CHANGED
@@ -168,7 +168,10 @@ function FileUpload(_ref) {
168
168
  disableGutter: true
169
169
  }) : null,
170
170
  useFlexGap: true,
171
- spacing: "24px"
171
+ spacing: "24px",
172
+ sx: {
173
+ mt: "16px"
174
+ }
172
175
  }, files.map(function (file, index) {
173
176
  if (typeof renderItem === "function") {
174
177
  return renderItem(file, index);
package/dist/esm/components/FileUploadItem.js CHANGED
@@ -18,10 +18,11 @@ function FileUploadItem(_ref) {
18
18
  file = _ref.file,
19
19
  _ref$message = _ref.message,
20
20
  message = _ref$message === void 0 ? void 0 : _ref$message,
21
- onDelete = _ref.onDelete,
21
+ _ref$onDelete = _ref.onDelete,
22
+ onDelete = _ref$onDelete === void 0 ? void 0 : _ref$onDelete,
22
23
  _ref$sx = _ref.sx,
23
24
  sx = _ref$sx === void 0 ? {} : _ref$sx;
24
- var displayName = getFileName(file).replace("./", "");
25
+ var name = getFileName(file);
25
26
  var styles = _objectSpread2({
26
27
  py: "6px"
27
28
  }, sx);
@@ -62,7 +63,7 @@ function FileUploadItem(_ref) {
62
63
  fontSize: "16px"
63
64
  },
64
65
  color: "primary"
65
- }, displayName), message && /* @__PURE__ */React.createElement(Text, {
66
+ }, name), message && /* @__PURE__ */React.createElement(Text, {
66
67
  sx: {
67
68
  fontSize: "14px",
68
69
  mt: "4px"
@@ -77,7 +78,7 @@ function FileUploadItem(_ref) {
77
78
  color: "error"
78
79
  }) : /* @__PURE__ */React.createElement(CheckCircleOutlineRoundedIcon, {
79
80
  color: "tertiary"
80
- }), /* @__PURE__ */React.createElement(IconButton, {
81
+ }), onDelete && /* @__PURE__ */React.createElement(IconButton, {
81
82
  onClick: onDelete,
82
83
  color: "primary"
83
84
  }, /* @__PURE__ */React.createElement(DeleteTwoToneIcon, null))));
package/dist/esm/utils/helpers/file.js CHANGED
@@ -9,7 +9,7 @@ var getFileNameFromURL = function getFileNameFromURL(file) {
9
9
  };
10
10
  var getFileName = function getFileName(file) {
11
11
  if (file.filename) {
12
- return file.filename;
12
+ return file.filename.replace("./", "");
13
13
  }
14
14
  if (file.url) {
15
15
  return getFileNameFromURL(file);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@tenancy.nz/ui",
3
- "version": "1.2.14",
3
+ "version": "1.3.1",
4
4
  "description": "Library of React UI components for tenancy.co.nz apps.",
5
5
  "author": "Tenancy.co.nz <monty@tenancy.co.nz>",
6
6
  "keywords": [