@citygross/components 0.8.85 → 0.8.87

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.
@@ -9,4 +9,12 @@ export declare type TModal = styles.TModalContainer & {
9
9
  querySelector?: string;
10
10
  footer?: JSX.Element;
11
11
  };
12
- export declare const Modal: ({ onBackdropClick, children, title, subTitle, hideCancel, isConfirm, maxWidth, background, querySelector, footer }: TModal) => React.ReactPortal | null;
12
+ export declare const Modal: React.ForwardRefExoticComponent<styles.TModalContainer & {
13
+ onBackdropClick: () => void;
14
+ children?: React.ReactNode;
15
+ title?: string | undefined;
16
+ subTitle?: string | undefined;
17
+ hideCancel?: boolean | undefined;
18
+ querySelector?: string | undefined;
19
+ footer?: JSX.Element | undefined;
20
+ } & React.RefAttributes<HTMLDivElement>>;
@@ -53,8 +53,7 @@ require('../LayoutBox/LayoutBox.styles.js');
53
53
  require('../ListItem/ListItem.js');
54
54
  require('../ListItemWithRadio/ListItemWithRadio.styles.js');
55
55
  require('../Links/Link.js');
56
- require('react-dom');
57
- require('../Modal/Modal.styles.js');
56
+ require('../Modal/Modal.js');
58
57
  require('../RadioBox/RadioBoxItem.styles.js');
59
58
  require('../RadioBox/RadioBoxList.styles.js');
60
59
  require('../RadioGroup/RadioGroup.styles.js');
@@ -1 +1 @@
1
- {"version":3,"file":"AddressBlock.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"AddressBlock.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -23,7 +23,7 @@ var Dropdown = function (_a) {
23
23
  };
24
24
  return (React__default["default"].createElement(Dropdown_styles.DropdownContainer, null,
25
25
  React__default["default"].createElement(Dropdown_styles.DropdownHeader, { onClick: onClick }, dropdownHeader),
26
- React__default["default"].createElement(Dropdown_styles.DropdownChildContainer, { isOpen: isOpen, variants: variants, animate: isOpen ? 'open' : 'closed', initial: 'closed' }, children)));
26
+ React__default["default"].createElement(Dropdown_styles.DropdownChildContainer, { isOpen: isOpen, variants: variants, animate: isOpen ? 'open' : 'closed', initial: "closed" }, children)));
27
27
  };
28
28
 
29
29
  exports.Dropdown = Dropdown;
@@ -18,8 +18,8 @@ var MenuListItem = function (_a) {
18
18
  return (React__default["default"].createElement(MenuListItem_styles.MenuListItemWrapper, null,
19
19
  React__default["default"].createElement(Dropdown.Dropdown, { onClick: onClick, isOpen: isOpen, dropdownHeader: React__default["default"].createElement(MenuListItem_styles.HeaderWrapper, { paddingLeft: paddingLeft, backgroundColor: backgroundColor, isOpen: isOpen, hoverBackground: hoverBackground, iconWidth: iconWidth },
20
20
  React__default["default"].createElement(MenuListItem_styles.BodyText, { isOpen: isOpen }, dropdownHeader),
21
- isOpen ? (React__default["default"].createElement(icons.Icons.Minus, { width: iconWidth !== null && iconWidth !== void 0 ? iconWidth : (_b = designTokens.theme.constants) === null || _b === void 0 ? void 0 : _b.menuListItemIconSize, height: iconWidth !== null && iconWidth !== void 0 ? iconWidth : (_c = designTokens.theme.constants) === null || _c === void 0 ? void 0 : _c.menuListItemIconSize })) : (React__default["default"].createElement(icons.Icons.Plus, { width: (_d = designTokens.theme.constants) === null || _d === void 0 ? void 0 : _d.menuListItemIconSize, height: (_e = designTokens.theme.constants) === null || _e === void 0 ? void 0 : _e.menuListItemIconSize }))) },
22
- React__default["default"].createElement(MenuListItem_styles.NestedWrapper, { nested: true, paddingLeft: paddingLeft }, children))));
21
+ isOpen ? (React__default["default"].createElement(icons.Icons.Minus, { width: iconWidth !== null && iconWidth !== void 0 ? iconWidth : (_b = designTokens.theme.constants) === null || _b === void 0 ? void 0 : _b.menuListItemIconSize, height: iconWidth !== null && iconWidth !== void 0 ? iconWidth : (_c = designTokens.theme.constants) === null || _c === void 0 ? void 0 : _c.menuListItemIconSize })) : (React__default["default"].createElement(icons.Icons.Plus, { width: (_d = designTokens.theme.constants) === null || _d === void 0 ? void 0 : _d.menuListItemIconSize, height: (_e = designTokens.theme.constants) === null || _e === void 0 ? void 0 : _e.menuListItemIconSize }))) }),
22
+ isOpen && (React__default["default"].createElement(MenuListItem_styles.NestedWrapper, { nested: true, paddingLeft: paddingLeft }, children))));
23
23
  };
24
24
 
25
25
  exports.MenuListItem = MenuListItem;
@@ -14,12 +14,12 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
14
14
 
15
15
  var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
16
16
 
17
- var Modal = function (_a) {
17
+ var Modal = React.forwardRef(function (_a, ref) {
18
18
  var _b;
19
19
  var onBackdropClick = _a.onBackdropClick, children = _a.children, title = _a.title, subTitle = _a.subTitle, _c = _a.hideCancel, hideCancel = _c === void 0 ? true : _c, isConfirm = _a.isConfirm, maxWidth = _a.maxWidth, _d = _a.background, background = _d === void 0 ? (_b = designTokens.theme.palette) === null || _b === void 0 ? void 0 : _b.white : _d, _e = _a.querySelector, querySelector = _e === void 0 ? '#root' : _e, footer = _a.footer;
20
20
  var domSafe = typeof document !== 'undefined';
21
21
  return domSafe
22
- ? reactDom.createPortal(React__default["default"].createElement(Modal_styles.ModalOverlay, { onClick: onBackdropClick },
22
+ ? reactDom.createPortal(React__default["default"].createElement(Modal_styles.ModalOverlay, { onClick: onBackdropClick, ref: ref },
23
23
  React__default["default"].createElement(Modal_styles.ModalContainer, { isConfirm: isConfirm || false, maxWidth: maxWidth, onClick: function (e) { return e.stopPropagation(); }, background: background },
24
24
  title && (React__default["default"].createElement(React__default["default"].Fragment, null,
25
25
  React__default["default"].createElement(Modal_styles.ModalHeaderContainer, null,
@@ -34,7 +34,8 @@ var Modal = function (_a) {
34
34
  React__default["default"].createElement(Spacer.Spacer, null),
35
35
  React__default["default"].createElement(Modal_styles.FooterWrapper, null, footer))))), document.querySelector(querySelector) || document.body)
36
36
  : null;
37
- };
37
+ });
38
+ Modal.displayName = 'Modal';
38
39
 
39
40
  exports.Modal = Modal;
40
41
  //# sourceMappingURL=Modal.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Modal.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"Modal.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -53,8 +53,7 @@ require('../LayoutBox/LayoutBox.styles.js');
53
53
  require('../ListItem/ListItem.js');
54
54
  require('../ListItemWithRadio/ListItemWithRadio.styles.js');
55
55
  require('../Links/Link.js');
56
- require('react-dom');
57
- require('../Modal/Modal.styles.js');
56
+ require('../Modal/Modal.js');
58
57
  require('../RadioBox/RadioBoxItem.styles.js');
59
58
  require('../RadioBox/RadioBoxList.styles.js');
60
59
  require('../RadioGroup/RadioGroup.styles.js');
@@ -1 +1 @@
1
- {"version":3,"file":"WarningLabel.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"WarningLabel.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -49,8 +49,7 @@ import '../LayoutBox/LayoutBox.styles.js';
49
49
  import '../ListItem/ListItem.js';
50
50
  import '../ListItemWithRadio/ListItemWithRadio.styles.js';
51
51
  import '../Links/Link.js';
52
- import 'react-dom';
53
- import '../Modal/Modal.styles.js';
52
+ import '../Modal/Modal.js';
54
53
  import '../RadioBox/RadioBoxItem.styles.js';
55
54
  import '../RadioBox/RadioBoxList.styles.js';
56
55
  import '../RadioGroup/RadioGroup.styles.js';
@@ -1 +1 @@
1
- {"version":3,"file":"AddressBlock.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"AddressBlock.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -15,7 +15,7 @@ var Dropdown = function (_a) {
15
15
  };
16
16
  return (React.createElement(DropdownContainer, null,
17
17
  React.createElement(DropdownHeader, { onClick: onClick }, dropdownHeader),
18
- React.createElement(DropdownChildContainer, { isOpen: isOpen, variants: variants, animate: isOpen ? 'open' : 'closed', initial: 'closed' }, children)));
18
+ React.createElement(DropdownChildContainer, { isOpen: isOpen, variants: variants, animate: isOpen ? 'open' : 'closed', initial: "closed" }, children)));
19
19
  };
20
20
 
21
21
  export { Dropdown };
@@ -10,8 +10,8 @@ var MenuListItem = function (_a) {
10
10
  return (React.createElement(MenuListItemWrapper, null,
11
11
  React.createElement(Dropdown, { onClick: onClick, isOpen: isOpen, dropdownHeader: React.createElement(HeaderWrapper, { paddingLeft: paddingLeft, backgroundColor: backgroundColor, isOpen: isOpen, hoverBackground: hoverBackground, iconWidth: iconWidth },
12
12
  React.createElement(BodyText, { isOpen: isOpen }, dropdownHeader),
13
- isOpen ? (React.createElement(Icons.Minus, { width: iconWidth !== null && iconWidth !== void 0 ? iconWidth : (_b = theme.constants) === null || _b === void 0 ? void 0 : _b.menuListItemIconSize, height: iconWidth !== null && iconWidth !== void 0 ? iconWidth : (_c = theme.constants) === null || _c === void 0 ? void 0 : _c.menuListItemIconSize })) : (React.createElement(Icons.Plus, { width: (_d = theme.constants) === null || _d === void 0 ? void 0 : _d.menuListItemIconSize, height: (_e = theme.constants) === null || _e === void 0 ? void 0 : _e.menuListItemIconSize }))) },
14
- React.createElement(NestedWrapper, { nested: true, paddingLeft: paddingLeft }, children))));
13
+ isOpen ? (React.createElement(Icons.Minus, { width: iconWidth !== null && iconWidth !== void 0 ? iconWidth : (_b = theme.constants) === null || _b === void 0 ? void 0 : _b.menuListItemIconSize, height: iconWidth !== null && iconWidth !== void 0 ? iconWidth : (_c = theme.constants) === null || _c === void 0 ? void 0 : _c.menuListItemIconSize })) : (React.createElement(Icons.Plus, { width: (_d = theme.constants) === null || _d === void 0 ? void 0 : _d.menuListItemIconSize, height: (_e = theme.constants) === null || _e === void 0 ? void 0 : _e.menuListItemIconSize }))) }),
14
+ isOpen && (React.createElement(NestedWrapper, { nested: true, paddingLeft: paddingLeft }, children))));
15
15
  };
16
16
 
17
17
  export { MenuListItem };
@@ -1,4 +1,4 @@
1
- import React from 'react';
1
+ import React, { forwardRef } from 'react';
2
2
  import { createPortal } from 'react-dom';
3
3
  import { H2, BodyText } from '@citygross/typography';
4
4
  import { ModalOverlay, ModalContainer, ModalHeaderContainer, ModalHeader, CloseButtonWrapper, ChildrenWrapper, FooterWrapper } from './Modal.styles.js';
@@ -6,12 +6,12 @@ import { Icons } from '@citygross/icons';
6
6
  import { theme } from '@citygross/design-tokens';
7
7
  import { Spacer } from '../Spacer/Spacer.js';
8
8
 
9
- var Modal = function (_a) {
9
+ var Modal = forwardRef(function (_a, ref) {
10
10
  var _b;
11
11
  var onBackdropClick = _a.onBackdropClick, children = _a.children, title = _a.title, subTitle = _a.subTitle, _c = _a.hideCancel, hideCancel = _c === void 0 ? true : _c, isConfirm = _a.isConfirm, maxWidth = _a.maxWidth, _d = _a.background, background = _d === void 0 ? (_b = theme.palette) === null || _b === void 0 ? void 0 : _b.white : _d, _e = _a.querySelector, querySelector = _e === void 0 ? '#root' : _e, footer = _a.footer;
12
12
  var domSafe = typeof document !== 'undefined';
13
13
  return domSafe
14
- ? createPortal(React.createElement(ModalOverlay, { onClick: onBackdropClick },
14
+ ? createPortal(React.createElement(ModalOverlay, { onClick: onBackdropClick, ref: ref },
15
15
  React.createElement(ModalContainer, { isConfirm: isConfirm || false, maxWidth: maxWidth, onClick: function (e) { return e.stopPropagation(); }, background: background },
16
16
  title && (React.createElement(React.Fragment, null,
17
17
  React.createElement(ModalHeaderContainer, null,
@@ -26,7 +26,8 @@ var Modal = function (_a) {
26
26
  React.createElement(Spacer, null),
27
27
  React.createElement(FooterWrapper, null, footer))))), document.querySelector(querySelector) || document.body)
28
28
  : null;
29
- };
29
+ });
30
+ Modal.displayName = 'Modal';
30
31
 
31
32
  export { Modal };
32
33
  //# sourceMappingURL=Modal.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Modal.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"Modal.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -49,8 +49,7 @@ import '../LayoutBox/LayoutBox.styles.js';
49
49
  import '../ListItem/ListItem.js';
50
50
  import '../ListItemWithRadio/ListItemWithRadio.styles.js';
51
51
  import '../Links/Link.js';
52
- import 'react-dom';
53
- import '../Modal/Modal.styles.js';
52
+ import '../Modal/Modal.js';
54
53
  import '../RadioBox/RadioBoxItem.styles.js';
55
54
  import '../RadioBox/RadioBoxList.styles.js';
56
55
  import '../RadioGroup/RadioGroup.styles.js';
@@ -1 +1 @@
1
- {"version":3,"file":"WarningLabel.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"WarningLabel.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@citygross/components",
3
- "version": "0.8.85",
3
+ "version": "0.8.87",
4
4
  "license": "ISC",
5
5
  "sideEffects": false,
6
6
  "main": "./build/cjs/components/src/index.js",
@@ -76,5 +76,5 @@
76
76
  "react-slick": "^0.30.1",
77
77
  "slick-carousel": "^1.8.1"
78
78
  },
79
- "gitHead": "b441791d05c8786e9bb61e511764ee1b7d7a6047"
79
+ "gitHead": "455c924ff9eaf0fdab735053affaaf0e66ae9a9b"
80
80
  }