@tenancy.nz/tenant-ui 1.8.7 → 1.9.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/icon-label.cjs +2 -2
  2. package/dist/cjs/components/property-attributes.cjs +6 -1
  3. package/dist/cjs/components/property-card.cjs +15 -15
  4. package/dist/cjs/components/property-card.styled.cjs +1 -1
  5. package/dist/cjs/components/rent-icon-label.cjs +2 -1
  6. package/dist/esm/components/icon-label.js +2 -2
  7. package/dist/esm/components/property-attributes.js +6 -1
  8. package/dist/esm/components/property-card.js +15 -15
  9. package/dist/esm/components/property-card.styled.js +1 -1
  10. package/dist/esm/components/rent-icon-label.js +2 -1
  11. package/package.json +5 -5
package/dist/cjs/components/icon-label.cjs CHANGED
@@ -21,12 +21,12 @@ function IconLabel(_ref) {
21
21
  return /* @__PURE__ */React.createElement(Stack, _rollupPluginBabelHelpers.objectSpread2({
22
22
  flexDirection: "row",
23
23
  alignItems: "center",
24
- gap: 1,
24
+ gap: 2,
25
25
  fontSize: size
26
26
  }, sx), icon, /* @__PURE__ */React.createElement(ui.Text, {
27
27
  as: "span",
28
28
  variant: "inherit",
29
- weight: "600"
29
+ weight: "700"
30
30
  }, text));
31
31
  }
32
32
 
package/dist/cjs/components/property-attributes.cjs CHANGED
@@ -9,6 +9,7 @@ var ui = require('@tenancy.nz/ui');
9
9
  var BedIcon = require('@tenancy.nz/icons/Bed');
10
10
  var BathIcon = require('@tenancy.nz/icons/Bath');
11
11
  var CarParkedIcon = require('@tenancy.nz/icons/CarParked');
12
+ var HomeIcon = require('@tenancy.nz/icons/Home');
12
13
  var iconLabel = require('./icon-label.cjs');
13
14
 
14
15
  function PropertyAttributes(_ref) {
@@ -66,7 +67,11 @@ function PropertyAttributes(_ref) {
66
67
  item: true
67
68
  }, /* @__PURE__ */React.createElement(iconLabel.default, _rollupPluginBabelHelpers.objectSpread2({
68
69
  color: "tertiary",
69
- icon: "home",
70
+ icon: /* @__PURE__ */React.createElement(ui.Box, {
71
+ sx: iconBoxStyles
72
+ }, /* @__PURE__ */React.createElement(HomeIcon, {
73
+ size: "inherit"
74
+ })),
70
75
  text: type
71
76
  }, labelProps))), !!noOfBedrooms && /* @__PURE__ */React.createElement(ui.Grid, {
72
77
  item: true
package/dist/cjs/components/property-card.cjs CHANGED
@@ -39,6 +39,13 @@ function PropertyCard(_ref) {
39
39
  photoSrc = _ref$photoSrc === void 0 ? "" : _ref$photoSrc,
40
40
  _ref$rent = _ref.rent,
41
41
  rent = _ref$rent === void 0 ? "" : _ref$rent;
42
+ var footerSlot = footer && /* @__PURE__ */React.createElement(Stack, {
43
+ mt: "auto",
44
+ sx: {
45
+ borderTop: "1px solid",
46
+ borderTopColor: "grey.300"
47
+ }
48
+ }, footer);
42
49
  return /* @__PURE__ */React.createElement(Stack, {
43
50
  onClick: onClick,
44
51
  sx: _rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({
@@ -68,7 +75,10 @@ function PropertyCard(_ref) {
68
75
  })
69
76
  }, /* @__PURE__ */React.createElement(Stack, {
70
77
  sx: {
71
- maxWidth: orientation === "horizontal" ? "360px" : "100%"
78
+ width: "100%",
79
+ maxWidth: {
80
+ md: orientation === "horizontal" ? "308px" : "100%"
81
+ }
72
82
  }
73
83
  }, header, /* @__PURE__ */React.createElement(propertyCard_styled.StyledPropertyItemImgWrapper, {
74
84
  orientation: orientation
@@ -76,7 +86,7 @@ function PropertyCard(_ref) {
76
86
  src: photoSrc,
77
87
  title: addressPart1,
78
88
  as: "img"
79
- }))), /* @__PURE__ */React.createElement(Stack, {
89
+ })), orientation === "horizontal" && footerSlot), /* @__PURE__ */React.createElement(Stack, {
80
90
  p: orientation === "vertical" ? 4 : {
81
91
  xs: 4,
82
92
  md: 8
@@ -107,23 +117,13 @@ function PropertyCard(_ref) {
107
117
  }, /* @__PURE__ */React.createElement(propertyAttributes.default, {
108
118
  noOfBedrooms: bedrooms,
109
119
  noOfBathrooms: bathrooms,
110
- noOfCarparks: parkingSpaces,
111
- iconSize: "20px"
120
+ noOfCarparks: parkingSpaces
112
121
  }), rent && /* @__PURE__ */React.createElement(rentIconLabel.default, {
113
122
  text: rent,
114
123
  sx: {
115
- ml: orientation === "vertical" ? "auto" : {
116
- xs: 2,
117
- md: 4
118
- }
124
+ ml: "auto"
119
125
  }
120
- }))), footer && /* @__PURE__ */React.createElement(Stack, {
121
- sx: {
122
- borderTop: "1px solid",
123
- borderTopColor: "grey.300"
124
- },
125
- p: 4
126
- }, footer)));
126
+ }))), orientation === "vertical" && footerSlot));
127
127
  }
128
128
 
129
129
  exports.default = PropertyCard;
package/dist/cjs/components/property-card.styled.cjs CHANGED
@@ -10,7 +10,7 @@ var verticalStyles = function verticalStyles() {
10
10
  };
11
11
  var horizontalStyles = function horizontalStyles(_ref) {
12
12
  var theme = _ref.theme;
13
- return react.css(_templateObject2 || (_templateObject2 = _rollupPluginBabelHelpers.taggedTemplateLiteral(["\n ", " {\n ", "\n }\n\n ", " {\n height: 220px;\n width: 100%;\n max-width: 360px;\n }\n"])), theme.breakpoints.down("md"), verticalStyles(), theme.breakpoints.up("md"));
13
+ return react.css(_templateObject2 || (_templateObject2 = _rollupPluginBabelHelpers.taggedTemplateLiteral(["\n ", " {\n ", "\n }\n\n ", " {\n flex: 1;\n min-height: 220px;\n width: 100%;\n max-width: 308px;\n }\n"])), theme.breakpoints.down("md"), verticalStyles(), theme.breakpoints.up("md"));
14
14
  };
15
15
  var StyledPropertyItemImgWrapper = styled.figure(_templateObject3 || (_templateObject3 = _rollupPluginBabelHelpers.taggedTemplateLiteral(["\n ", "\n"])), function (_ref2) {
16
16
  var orientation = _ref2.orientation,
package/dist/cjs/components/rent-icon-label.cjs CHANGED
@@ -5,6 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
5
5
  var _rollupPluginBabelHelpers = require('../_virtual/_rollupPluginBabelHelpers.cjs');
6
6
  var React = require('react');
7
7
  var DollarCircleIcon = require('@tenancy.nz/icons/DollarCircle');
8
+ var ui = require('@tenancy.nz/ui');
8
9
  var iconLabel = require('./icon-label.cjs');
9
10
 
10
11
  var _excluded = ["text"];
@@ -13,7 +14,7 @@ function RentIconLabel(_ref) {
13
14
  rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
14
15
  return /* @__PURE__ */React.createElement(iconLabel.default, _rollupPluginBabelHelpers.objectSpread2({
15
16
  icon: /* @__PURE__ */React.createElement(DollarCircleIcon, {
16
- color: "#0CC1A3"
17
+ color: ui.token("palette.semantic.icons.accentColor")
17
18
  }),
18
19
  text: text
19
20
  }, rest));
package/dist/esm/components/icon-label.js CHANGED
@@ -17,12 +17,12 @@ function IconLabel(_ref) {
17
17
  return /* @__PURE__ */React.createElement(Stack, _objectSpread2({
18
18
  flexDirection: "row",
19
19
  alignItems: "center",
20
- gap: 1,
20
+ gap: 2,
21
21
  fontSize: size
22
22
  }, sx), icon, /* @__PURE__ */React.createElement(Text, {
23
23
  as: "span",
24
24
  variant: "inherit",
25
- weight: "600"
25
+ weight: "700"
26
26
  }, text));
27
27
  }
28
28
 
package/dist/esm/components/property-attributes.js CHANGED
@@ -5,6 +5,7 @@ import { Heading, Text, Grid, Box } from '@tenancy.nz/ui';
5
5
  import BedIcon from '@tenancy.nz/icons/Bed';
6
6
  import BathIcon from '@tenancy.nz/icons/Bath';
7
7
  import CarParkedIcon from '@tenancy.nz/icons/CarParked';
8
+ import HomeIcon from '@tenancy.nz/icons/Home';
8
9
  import IconLabel from './icon-label.js';
9
10
 
10
11
  function PropertyAttributes(_ref) {
@@ -62,7 +63,11 @@ function PropertyAttributes(_ref) {
62
63
  item: true
63
64
  }, /* @__PURE__ */React.createElement(IconLabel, _objectSpread2({
64
65
  color: "tertiary",
65
- icon: "home",
66
+ icon: /* @__PURE__ */React.createElement(Box, {
67
+ sx: iconBoxStyles
68
+ }, /* @__PURE__ */React.createElement(HomeIcon, {
69
+ size: "inherit"
70
+ })),
66
71
  text: type
67
72
  }, labelProps))), !!noOfBedrooms && /* @__PURE__ */React.createElement(Grid, {
68
73
  item: true
package/dist/esm/components/property-card.js CHANGED
@@ -35,6 +35,13 @@ function PropertyCard(_ref) {
35
35
  photoSrc = _ref$photoSrc === void 0 ? "" : _ref$photoSrc,
36
36
  _ref$rent = _ref.rent,
37
37
  rent = _ref$rent === void 0 ? "" : _ref$rent;
38
+ var footerSlot = footer && /* @__PURE__ */React.createElement(Stack, {
39
+ mt: "auto",
40
+ sx: {
41
+ borderTop: "1px solid",
42
+ borderTopColor: "grey.300"
43
+ }
44
+ }, footer);
38
45
  return /* @__PURE__ */React.createElement(Stack, {
39
46
  onClick: onClick,
40
47
  sx: _objectSpread2(_objectSpread2({
@@ -64,7 +71,10 @@ function PropertyCard(_ref) {
64
71
  })
65
72
  }, /* @__PURE__ */React.createElement(Stack, {
66
73
  sx: {
67
- maxWidth: orientation === "horizontal" ? "360px" : "100%"
74
+ width: "100%",
75
+ maxWidth: {
76
+ md: orientation === "horizontal" ? "308px" : "100%"
77
+ }
68
78
  }
69
79
  }, header, /* @__PURE__ */React.createElement(StyledPropertyItemImgWrapper, {
70
80
  orientation: orientation
@@ -72,7 +82,7 @@ function PropertyCard(_ref) {
72
82
  src: photoSrc,
73
83
  title: addressPart1,
74
84
  as: "img"
75
- }))), /* @__PURE__ */React.createElement(Stack, {
85
+ })), orientation === "horizontal" && footerSlot), /* @__PURE__ */React.createElement(Stack, {
76
86
  p: orientation === "vertical" ? 4 : {
77
87
  xs: 4,
78
88
  md: 8
@@ -103,23 +113,13 @@ function PropertyCard(_ref) {
103
113
  }, /* @__PURE__ */React.createElement(PropertyAttributes, {
104
114
  noOfBedrooms: bedrooms,
105
115
  noOfBathrooms: bathrooms,
106
- noOfCarparks: parkingSpaces,
107
- iconSize: "20px"
116
+ noOfCarparks: parkingSpaces
108
117
  }), rent && /* @__PURE__ */React.createElement(RentIconLabel, {
109
118
  text: rent,
110
119
  sx: {
111
- ml: orientation === "vertical" ? "auto" : {
112
- xs: 2,
113
- md: 4
114
- }
120
+ ml: "auto"
115
121
  }
116
- }))), footer && /* @__PURE__ */React.createElement(Stack, {
117
- sx: {
118
- borderTop: "1px solid",
119
- borderTopColor: "grey.300"
120
- },
121
- p: 4
122
- }, footer)));
122
+ }))), orientation === "vertical" && footerSlot));
123
123
  }
124
124
 
125
125
  export { PropertyCard as default };
package/dist/esm/components/property-card.styled.js CHANGED
@@ -8,7 +8,7 @@ var verticalStyles = function verticalStyles() {
8
8
  };
9
9
  var horizontalStyles = function horizontalStyles(_ref) {
10
10
  var theme = _ref.theme;
11
- return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n ", " {\n ", "\n }\n\n ", " {\n height: 220px;\n width: 100%;\n max-width: 360px;\n }\n"])), theme.breakpoints.down("md"), verticalStyles(), theme.breakpoints.up("md"));
11
+ return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n ", " {\n ", "\n }\n\n ", " {\n flex: 1;\n min-height: 220px;\n width: 100%;\n max-width: 308px;\n }\n"])), theme.breakpoints.down("md"), verticalStyles(), theme.breakpoints.up("md"));
12
12
  };
13
13
  var StyledPropertyItemImgWrapper = styled.figure(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n ", "\n"])), function (_ref2) {
14
14
  var orientation = _ref2.orientation,
package/dist/esm/components/rent-icon-label.js CHANGED
@@ -1,6 +1,7 @@
1
1
  import { objectWithoutProperties as _objectWithoutProperties, objectSpread2 as _objectSpread2 } from '../_virtual/_rollupPluginBabelHelpers.js';
2
2
  import React from 'react';
3
3
  import DollarCircleIcon from '@tenancy.nz/icons/DollarCircle';
4
+ import { token } from '@tenancy.nz/ui';
4
5
  import IconLabel from './icon-label.js';
5
6
 
6
7
  var _excluded = ["text"];
@@ -9,7 +10,7 @@ function RentIconLabel(_ref) {
9
10
  rest = _objectWithoutProperties(_ref, _excluded);
10
11
  return /* @__PURE__ */React.createElement(IconLabel, _objectSpread2({
11
12
  icon: /* @__PURE__ */React.createElement(DollarCircleIcon, {
12
- color: "#0CC1A3"
13
+ color: token("palette.semantic.icons.accentColor")
13
14
  }),
14
15
  text: text
15
16
  }, rest));
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@tenancy.nz/tenant-ui",
3
3
  "description": "React UI tenant components.",
4
- "version": "1.8.7",
4
+ "version": "1.9.1",
5
5
  "author": "TPS <https://www.tenancy.co.nz>",
6
6
  "type": "module",
7
7
  "main": "dist/cjs/index.cjs",
@@ -13,18 +13,18 @@
13
13
  "peerDependencies": {
14
14
  "@emotion/react": "^11.14.0",
15
15
  "@emotion/styled": "^11.14.1",
16
- "@mui/icons-material": "^7.2.0",
17
16
  "@mui/material": "^7.3.1",
18
17
  "react": "^16.0.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
19
18
  "react-dom": "^16.0.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
20
- "@tenancy.nz/ui": "1.8.7"
19
+ "@tenancy.nz/icons": "1.9.1",
20
+ "@tenancy.nz/ui": "1.9.1"
21
21
  },
22
22
  "devDependencies": {
23
23
  "@emotion/react": "^11.14.0",
24
24
  "@emotion/styled": "^11.14.1",
25
- "@mui/icons-material": "^7.2.0",
26
25
  "@mui/material": "^7.3.1",
27
- "@tenancy.nz/ui": "1.8.7"
26
+ "@tenancy.nz/icons": "1.9.1",
27
+ "@tenancy.nz/ui": "1.9.1"
28
28
  },
29
29
  "dependencies": {
30
30
  "react-uid": "^2.4.0"