@ausbom/modal 0.1.9 → 0.1.12

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.
package/lib/Modal.js CHANGED
@@ -1 +1,2 @@
1
- "use strict";var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports["default"]=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _icon=require("@ausbom/icon");var _CutCross=_interopRequireDefault(require("@ausbom/icon/lib/icons/system/CutCross16"));var _react=_interopRequireDefault(require("react"));var _classnames=_interopRequireDefault(require("classnames"));var _reactModal=_interopRequireDefault(require("react-modal"));var Modal=/*#__PURE__*/function(_React$Component){(0,_inherits2["default"])(Modal,_React$Component);function Modal(props){var _this;(0,_classCallCheck2["default"])(this,Modal);_this=(0,_possibleConstructorReturn2["default"])(this,(0,_getPrototypeOf2["default"])(Modal).call(this,props));(0,_defineProperty2["default"])((0,_assertThisInitialized2["default"])(_this),"startOfModalRef",void 0);(0,_defineProperty2["default"])((0,_assertThisInitialized2["default"])(_this),"modalRef",void 0);_this.state={scrollbarWidth:0};_this.updateScrollBarWidth=_this.updateScrollBarWidth.bind((0,_assertThisInitialized2["default"])(_this));return _this}(0,_createClass2["default"])(Modal,[{key:"updateScrollBarWidth",value:function updateScrollBarWidth(){this.setState({scrollbarWidth:window.innerWidth-document.body.clientWidth})}},{key:"componentDidMount",value:function componentDidMount(){this.updateScrollBarWidth();window.addEventListener("resize",this.updateScrollBarWidth)}},{key:"componentWillUnmount",value:function componentWillUnmount(){window.removeEventListener("resize",this.updateScrollBarWidth)}},{key:"render",value:function render(){var _this2=this;var _this$props=this.props,isOpen=_this$props.isOpen,a11yId=_this$props.a11yId,className=_this$props.className,children=_this$props.children,onRequestClose=_this$props.onRequestClose,title=_this$props.title,closeButtonLabel=_this$props.closeButtonLabel,hideCloseButton=_this$props.hideCloseButton,zIndex=_this$props.zIndex,restProps=(0,_objectWithoutProperties2["default"])(_this$props,["isOpen","a11yId","className","children","onRequestClose","title","closeButtonLabel","hideCloseButton","zIndex"]);var titleId="".concat(a11yId,"_modal");return _react["default"].createElement(_reactModal["default"],(0,_extends2["default"])({ref:function ref(n){_this2.modalRef=n},testId:"bom-modal",isOpen:isOpen,aria:{labelledby:titleId},onAfterOpen:function onAfterOpen(){setTimeout(function(){var modalRef=_this2.modalRef;if(modalRef){var modalParent=modalRef.props.parentSelector();modalParent.style.marginRight="".concat(_this2.state.scrollbarWidth,"px");modalParent.style.marginLeft="calc(-100% + 100vw)";modalParent.style.overflow="hidden"}if(_this2.startOfModalRef&&_this2.startOfModalRef.focus){_this2.startOfModalRef.focus()}},0)},onAfterClose:function onAfterClose(){setTimeout(function(){var modalRef=_this2.modalRef;if(modalRef){var modalParent=modalRef.props.parentSelector();modalParent.style.marginRight="auto";modalParent.style.marginLeft="auto";modalParent.style.overflow="auto"}},0)},closeTimeoutMS:200,portalClassName:"bom-modal-portal",overlayClassName:{base:"bom-modal-overlay",afterOpen:"bom-modal-overlay--after-open",beforeClose:"bom-modal-overlay--before-close"},className:{base:(0,_classnames["default"])(className,"bom-modal"),afterOpen:"bom-modal--after-open",beforeClose:"bom-modal--before-close"},bodyOpenClassName:"bom-modal-body--open",htmlOpenClassName:"bom-modal-html--open",onRequestClose:onRequestClose,style:{overlay:{zIndex:zIndex}}},restProps),_react["default"].createElement("div",{className:"bom-modal-header"},_react["default"].createElement("span",{className:"bom-modal-header__start-vh",tabIndex:-1,ref:function ref(n){_this2.startOfModalRef=n}},"Start of modal window"),!hideCloseButton&&_react["default"].createElement("button",{className:"bom-modal-close","data-testid":"bom-modal-close",type:"button",onClick:function onClick(){onRequestClose()}},_react["default"].createElement(_icon.SystemIcon,{icon:_CutCross["default"],size:16,"aria-hidden":true}),_react["default"].createElement("span",{className:"bom-modal-close__label"},closeButtonLabel)),_react["default"].createElement("h2",{id:titleId,className:"bom-modal-title"},title)),_react["default"].createElement("div",{className:"bom-modal-body"},children))}}]);return Modal}(_react["default"].Component);(0,_defineProperty2["default"])(Modal,"defaultProps",{isOpen:false,onRequestClose:function onRequestClose(){return undefined},closeButtonLabel:"Close modal window",hideCloseButton:false});var _default=Modal;exports["default"]=_default;
1
+ "use strict";var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports["default"]=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _icon=require("@ausbom/icon");var _CutCross=_interopRequireDefault(require("@ausbom/icon/lib/icons/system/CutCross16"));var _react=_interopRequireDefault(require("react"));var _classnames=_interopRequireDefault(require("classnames"));var _reactModal=_interopRequireDefault(require("react-modal"));function _createSuper(Derived){var hasNativeReflectConstruct=_isNativeReflectConstruct();return function _createSuperInternal(){var Super=(0,_getPrototypeOf2["default"])(Derived),result;if(hasNativeReflectConstruct){var NewTarget=(0,_getPrototypeOf2["default"])(this).constructor;result=Reflect.construct(Super,arguments,NewTarget)}else{result=Super.apply(this,arguments)}return(0,_possibleConstructorReturn2["default"])(this,result)}}function _isNativeReflectConstruct(){if(typeof Reflect==="undefined"||!Reflect.construct)return false;if(Reflect.construct.sham)return false;if(typeof Proxy==="function")return true;try{Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){}));return true}catch(e){return false}}var Modal=/*#__PURE__*/function(_React$Component){(0,_inherits2["default"])(Modal,_React$Component);var _super=_createSuper(Modal);function Modal(props){var _this;(0,_classCallCheck2["default"])(this,Modal);_this=_super.call(this,props);(0,_defineProperty2["default"])((0,_assertThisInitialized2["default"])(_this),"startOfModalRef",void 0);(0,_defineProperty2["default"])((0,_assertThisInitialized2["default"])(_this),"modalRef",void 0);_this.state={scrollbarWidth:0};_this.updateScrollBarWidth=_this.updateScrollBarWidth.bind((0,_assertThisInitialized2["default"])(_this));return _this}(0,_createClass2["default"])(Modal,[{key:"updateScrollBarWidth",value:function updateScrollBarWidth(){this.setState({scrollbarWidth:window.innerWidth-document.body.clientWidth})}},{key:"componentDidMount",value:function componentDidMount(){this.updateScrollBarWidth();window.addEventListener("resize",this.updateScrollBarWidth)}},{key:"componentWillUnmount",value:function componentWillUnmount(){window.removeEventListener("resize",this.updateScrollBarWidth)}// eslint-disable-next-line class-methods-use-this
2
+ },{key:"renderTitle",value:function renderTitle(title,titleId){if(typeof title==="string"){return/*#__PURE__*/_react["default"].createElement("h2",{id:titleId,className:"bom-modal-title"},title)}return title}},{key:"render",value:function render(){var _this2=this;var _this$props=this.props,isOpen=_this$props.isOpen,a11yId=_this$props.a11yId,className=_this$props.className,children=_this$props.children,onRequestClose=_this$props.onRequestClose,title=_this$props.title,closeButtonLabel=_this$props.closeButtonLabel,hideCloseButton=_this$props.hideCloseButton,zIndex=_this$props.zIndex,restProps=(0,_objectWithoutProperties2["default"])(_this$props,["isOpen","a11yId","className","children","onRequestClose","title","closeButtonLabel","hideCloseButton","zIndex"]);var titleId="".concat(a11yId,"_modal");return/*#__PURE__*/_react["default"].createElement(_reactModal["default"],(0,_extends2["default"])({ref:function ref(n){_this2.modalRef=n},testId:"bom-modal",isOpen:isOpen,aria:{labelledby:titleId},onAfterOpen:function onAfterOpen(){setTimeout(function(){var modalRef=_this2.modalRef;if(modalRef){var modalParent=modalRef.props.parentSelector();modalParent.style.marginRight="".concat(_this2.state.scrollbarWidth,"px");modalParent.style.marginLeft="calc(-100% + 100vw)";modalParent.style.overflow="hidden"}if(_this2.startOfModalRef&&_this2.startOfModalRef.focus){_this2.startOfModalRef.focus()}},0)},onAfterClose:function onAfterClose(){setTimeout(function(){var modalRef=_this2.modalRef;if(modalRef){var modalParent=modalRef.props.parentSelector();modalParent.style.marginRight="auto";modalParent.style.marginLeft="auto";modalParent.style.overflow="auto"}},0)},closeTimeoutMS:200,portalClassName:"bom-modal-portal",overlayClassName:{base:"bom-modal-overlay",afterOpen:"bom-modal-overlay--after-open",beforeClose:"bom-modal-overlay--before-close"},className:{base:(0,_classnames["default"])(className,"bom-modal"),afterOpen:"bom-modal--after-open",beforeClose:"bom-modal--before-close"},bodyOpenClassName:"bom-modal-body--open",htmlOpenClassName:"bom-modal-html--open",onRequestClose:onRequestClose,style:{overlay:{zIndex:zIndex}}},restProps),/*#__PURE__*/_react["default"].createElement("div",{className:"bom-modal-header"},/*#__PURE__*/_react["default"].createElement("span",{className:"bom-modal-header__start-vh",tabIndex:-1,ref:function ref(n){_this2.startOfModalRef=n}},"Start of modal window"),this.renderTitle(title,titleId)),/*#__PURE__*/_react["default"].createElement("div",{className:"bom-modal-body"},children),!hideCloseButton&&/*#__PURE__*/_react["default"].createElement("button",{className:"bom-modal-close","data-testid":"bom-modal-close",type:"button",onClick:function onClick(){onRequestClose()}},/*#__PURE__*/_react["default"].createElement(_icon.SystemIcon,{icon:_CutCross["default"],size:16,"aria-hidden":true}),/*#__PURE__*/_react["default"].createElement("span",{className:"bom-modal-close__label"},closeButtonLabel)))}}]);return Modal}(_react["default"].Component);(0,_defineProperty2["default"])(Modal,"defaultProps",{isOpen:false,onRequestClose:function onRequestClose(){return undefined},closeButtonLabel:"Close modal window",hideCloseButton:false});var _default=Modal;exports["default"]=_default;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ausbom/modal",
3
- "version": "0.1.9",
3
+ "version": "0.1.12",
4
4
  "description": "",
5
5
  "keywords": [],
6
6
  "author": "",
@@ -37,9 +37,9 @@
37
37
  "react": ">= 16.3.x"
38
38
  },
39
39
  "dependencies": {
40
- "@ausbom/icon": "^0.6.0",
41
- "@ausbom/styles": "^0.6.0",
40
+ "@ausbom/icon": "^0.16.0",
41
+ "@ausbom/styles": "^0.9.2",
42
42
  "react-modal": "3.11.2"
43
43
  },
44
- "gitHead": "0a859077eb4087796ffc2628d2a22143e8951473"
44
+ "gitHead": "2fd9ca72166e3172e7957a3c3ac942e05fb1dde2"
45
45
  }
package/CHANGELOG.md DELETED
@@ -1,123 +0,0 @@
1
- # Change Log
2
-
3
- All notable changes to this project will be documented in this file.
4
- See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
-
6
- <a name="0.1.9"></a>
7
- ## [0.1.9](https://github.com/AusBOM/bom-design-system/compare/@ausbom/modal@0.1.8...@ausbom/modal@0.1.9) (2020-06-15)
8
-
9
- **Note:** Version bump only for package @ausbom/modal
10
-
11
-
12
-
13
-
14
-
15
- <a name="0.1.8"></a>
16
- ## [0.1.8](https://github.com/AusBOM/bom-design-system/compare/@ausbom/modal@0.1.7...@ausbom/modal@0.1.8) (2020-06-15)
17
-
18
- **Note:** Version bump only for package @ausbom/modal
19
-
20
-
21
-
22
-
23
-
24
- <a name="0.1.7"></a>
25
- ## [0.1.7](https://github.com/AusBOM/bom-design-system/compare/@ausbom/modal@0.1.6...@ausbom/modal@0.1.7) (2020-06-15)
26
-
27
-
28
- ### Bug Fixes
29
-
30
- * **modal:** content jumping when activating modal ([b90e102](https://github.com/AusBOM/bom-design-system/commit/b90e102))
31
- * added logic to calculate margin offset to prevent content jumping ([240c1e0](https://github.com/AusBOM/bom-design-system/commit/240c1e0))
32
-
33
-
34
-
35
-
36
-
37
- <a name="0.1.6"></a>
38
- ## [0.1.6](https://github.com/AusBOM/bom-design-system/compare/@ausbom/modal@0.1.5...@ausbom/modal@0.1.6) (2020-05-01)
39
-
40
-
41
- ### Bug Fixes
42
-
43
- * added ie11 specific style for modal scroll ([#306](https://github.com/AusBOM/bom-design-system/issues/306)) ([49dbb59](https://github.com/AusBOM/bom-design-system/commit/49dbb59))
44
-
45
-
46
-
47
-
48
-
49
- <a name="0.1.5"></a>
50
- ## [0.1.5](https://github.com/AusBOM/bom-design-system/compare/@ausbom/modal@0.1.4...@ausbom/modal@0.1.5) (2020-04-21)
51
-
52
-
53
- ### Bug Fixes
54
-
55
- * modal double scrollbar issue ([#302](https://github.com/AusBOM/bom-design-system/issues/302)) ([f0bf73a](https://github.com/AusBOM/bom-design-system/commit/f0bf73a))
56
-
57
-
58
-
59
-
60
-
61
- <a name="0.1.4"></a>
62
- ## [0.1.4](https://github.com/AusBOM/bom-design-system/compare/@ausbom/modal@0.1.3...@ausbom/modal@0.1.4) (2020-04-16)
63
-
64
-
65
- ### Bug Fixes
66
-
67
- * lowered the default zIndex of a modal ([#301](https://github.com/AusBOM/bom-design-system/issues/301)) ([befadaa](https://github.com/AusBOM/bom-design-system/commit/befadaa))
68
-
69
-
70
-
71
-
72
-
73
- <a name="0.1.3"></a>
74
- ## [0.1.3](https://github.com/AusBOM/bom-design-system/compare/@ausbom/modal@0.1.2...@ausbom/modal@0.1.3) (2020-04-15)
75
-
76
-
77
- ### Bug Fixes
78
-
79
- * renamed modifier classnames for before and after close for IE11 ([0d5f73d](https://github.com/AusBOM/bom-design-system/commit/0d5f73d))
80
-
81
-
82
-
83
-
84
-
85
- <a name="0.1.2"></a>
86
- ## [0.1.2](https://github.com/AusBOM/bom-design-system/compare/@ausbom/modal@0.1.1...@ausbom/modal@0.1.2) (2020-03-20)
87
-
88
-
89
- ### Bug Fixes
90
-
91
- * centers modal correctly in ie11 ([810f59d](https://github.com/AusBOM/bom-design-system/commit/810f59d))
92
- * fixes firefox flexbox bug for modals ([e460bba](https://github.com/AusBOM/bom-design-system/commit/e460bba))
93
- * fixes tests after modal update ([2b83dde](https://github.com/AusBOM/bom-design-system/commit/2b83dde))
94
- * workaround for ios voiceover not focusing aria-modal ([1629abf](https://github.com/AusBOM/bom-design-system/commit/1629abf))
95
-
96
-
97
-
98
-
99
-
100
- <a name="0.1.1"></a>
101
- ## [0.1.1](https://github.com/AusBOM/bom-design-system/compare/@ausbom/modal@0.1.0...@ausbom/modal@0.1.1) (2020-02-06)
102
-
103
-
104
- ### Bug Fixes
105
-
106
- * a11y[#5](https://github.com/AusBOM/bom-design-system/issues/5) add focusable false toicons,add ariahidden to decorative svg ([4321224](https://github.com/AusBOM/bom-design-system/commit/4321224))
107
-
108
-
109
-
110
-
111
-
112
- <a name="0.1.0"></a>
113
- # 0.1.0 (2020-02-03)
114
-
115
-
116
- ### Bug Fixes
117
-
118
- * removes api doc link from modal and template ([60a78e3](https://github.com/AusBOM/bom-design-system/commit/60a78e3))
119
-
120
-
121
- ### Features
122
-
123
- * adds modal component ([62a3e95](https://github.com/AusBOM/bom-design-system/commit/62a3e95))