Skip to content

Commit

Permalink
Resolve an issue that React does not recognize the disableOverlay p…
Browse files Browse the repository at this point in the history 
…rop on a DOM element.
  • Loading branch information
@cheton
cheton committed Mar 15, 2018
1 parent fbcf8a4 commit 528c97f
Show file tree
Hide file tree
Showing 7 changed files with 109 additions and 56 deletions.
2 changes: 1 addition & 1 deletion dist/react-modal.css
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

2 changes: 1 addition & 1 deletion dist/react-modal.min.css
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

131 changes: 90 additions & 41 deletions docs/bundle.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -68,30 +68,49 @@
/***/ "../node_modules/@trendmicro/react-buttons/dist/react-buttons.css":
/***/ (function(module, exports, __webpack_require__) {

// style-loader: Adds some css to the DOM by adding a <style> tag

// load the styles
var content = __webpack_require__("../node_modules/css-loader/index.js!../node_modules/@trendmicro/react-buttons/dist/react-buttons.css");

if(typeof content === 'string') content = [[module.i, content, '']];
// Prepare cssTransformation

var transform;
var insertInto;



var options = {"hmr":true}

options.transform = transform
// add the styles to the DOM
options.insertInto = undefined;

var update = __webpack_require__("../node_modules/style-loader/lib/addStyles.js")(content, options);

if(content.locals) module.exports = content.locals;
// Hot Module Replacement

if(false) {
// When the styles change, update the <style> tags
if(!content.locals) {
module.hot.accept("!!../../../css-loader/index.js!./react-buttons.css", function() {
var newContent = require("!!../../../css-loader/index.js!./react-buttons.css");
if(typeof newContent === 'string') newContent = [[module.id, newContent, '']];
update(newContent);
});
}
// When the module is disposed, remove the <style> tags
module.hot.accept("!!../../../css-loader/index.js!./react-buttons.css", function() {
var newContent = require("!!../../../css-loader/index.js!./react-buttons.css");

if(typeof newContent === 'string') newContent = [[module.id, newContent, '']];

var locals = (function(a, b) {
var key, idx = 0;

for(key in a) {
if(!b || a[key] !== b[key]) return false;
idx++;
}

for(key in b) idx--;

return idx === 0;
}(content.locals, newContent.locals));

if(!locals) throw new Error('Aborting CSS HMR due to changed css-modules locals.');

update(newContent);
});

module.hot.dispose(function() { update(); });
}

Expand Down Expand Up @@ -19742,14 +19761,26 @@ var isOldIE = memoize(function () {
return window && document && document.all && !window.atob;
});

var getTarget = function (target) {
return document.querySelector(target);
};

var getElement = (function (fn) {
var memo = {};

return function(selector) {
if (typeof memo[selector] === "undefined") {
var styleTarget = fn.call(this, selector);
return function(target) {
// If passing function in options, then use it for resolve "head" element.
// Useful for Shadow Root style i.e
// {
// insertInto: function () { return document.querySelector("#foo").shadowRoot }
// }
if (typeof target === 'function') {
return target();
}
if (typeof memo[target] === "undefined") {
var styleTarget = getTarget.call(this, target);
// Special case to return head of iframe instead of iframe itself
if (styleTarget instanceof window.HTMLIFrameElement) {
if (window.HTMLIFrameElement && styleTarget instanceof window.HTMLIFrameElement) {
try {
// This will throw an exception if access to iframe is blocked
// due to cross-origin restrictions
Expand All @@ -19758,13 +19789,11 @@ var getElement = (function (fn) {
styleTarget = null;
}
}
memo[selector] = styleTarget;
memo[target] = styleTarget;
}
return memo[selector]
return memo[target]
};
})(function (target) {
return document.querySelector(target)
});
})();

var singleton = null;
var singletonCounter = 0;
Expand All @@ -19786,7 +19815,7 @@ module.exports = function(list, options) {
if (!options.singleton && typeof options.singleton !== "boolean") options.singleton = isOldIE();

// By default, add <style> tags to the <head> element
if (!options.insertInto) options.insertInto = "head";
if (!options.insertInto) options.insertInto = "head";

// By default, add <style> tags to the bottom of the target
if (!options.insertAt) options.insertAt = "bottom";
Expand Down Expand Up @@ -20154,7 +20183,7 @@ module.exports = function (css) {
.replace(/^'(.*)'$/, function(o, $1){ return $1; });

// already a full url? no change
if (/^(#|data:|http:\/\/|https:\/\/|file:\/\/\/)/i.test(unquotedOrigUrl)) {
if (/^(#|data:|http:\/\/|https:\/\/|file:\/\/\/|\s*$)/i.test(unquotedOrigUrl)) {
return fullMatch;
}

Expand Down Expand Up @@ -20721,8 +20750,9 @@ var ModalOverlay = (_temp2 = _class = function (_PureComponent) {
var _this2 = this;

var _props = this.props,
disableOverlay = _props.disableOverlay,
className = _props.className,
props = _objectWithoutProperties(_props, ['className']);
props = _objectWithoutProperties(_props, ['disableOverlay', 'className']);

return _react2.default.createElement(
_reactPortal2.default,
Expand Down Expand Up @@ -20841,30 +20871,49 @@ module.exports = _Modal2.default;
/***/ "../src/index.styl":
/***/ (function(module, exports, __webpack_require__) {

// style-loader: Adds some css to the DOM by adding a <style> tag

// load the styles
var content = __webpack_require__("../node_modules/css-loader/index.js?camelCase&modules&importLoaders=1&localIdentName=[local]---[hash:base64:5]!../node_modules/stylus-loader/index.js!../node_modules/stylint-loader/index.js!../src/index.styl");

if(typeof content === 'string') content = [[module.i, content, '']];
// Prepare cssTransformation

var transform;
var insertInto;



var options = {"hmr":true}

options.transform = transform
// add the styles to the DOM
options.insertInto = undefined;

var update = __webpack_require__("../node_modules/style-loader/lib/addStyles.js")(content, options);

if(content.locals) module.exports = content.locals;
// Hot Module Replacement

if(false) {
// When the styles change, update the <style> tags
if(!content.locals) {
module.hot.accept("!!../node_modules/css-loader/index.js?camelCase&modules&importLoaders=1&localIdentName=[local]---[hash:base64:5]!../node_modules/stylus-loader/index.js!../node_modules/stylint-loader/index.js!./index.styl", function() {
var newContent = require("!!../node_modules/css-loader/index.js?camelCase&modules&importLoaders=1&localIdentName=[local]---[hash:base64:5]!../node_modules/stylus-loader/index.js!../node_modules/stylint-loader/index.js!./index.styl");
if(typeof newContent === 'string') newContent = [[module.id, newContent, '']];
update(newContent);
});
}
// When the module is disposed, remove the <style> tags
module.hot.accept("!!../node_modules/css-loader/index.js?camelCase&modules&importLoaders=1&localIdentName=[local]---[hash:base64:5]!../node_modules/stylus-loader/index.js!../node_modules/stylint-loader/index.js!./index.styl", function() {
var newContent = require("!!../node_modules/css-loader/index.js?camelCase&modules&importLoaders=1&localIdentName=[local]---[hash:base64:5]!../node_modules/stylus-loader/index.js!../node_modules/stylint-loader/index.js!./index.styl");

if(typeof newContent === 'string') newContent = [[module.id, newContent, '']];

var locals = (function(a, b) {
var key, idx = 0;

for(key in a) {
if(!b || a[key] !== b[key]) return false;
idx++;
}

for(key in b) idx--;

return idx === 0;
}(content.locals, newContent.locals));

if(!locals) throw new Error('Aborting CSS HMR due to changed css-modules locals.');

update(newContent);
});

module.hot.dispose(function() { update(); });
}

Expand Down Expand Up @@ -21536,4 +21585,4 @@ exports.default = function (Component) {
/***/ })

/******/ });
//# sourceMappingURL=bundle.js.map?50e5bec724f4afd6cfc1
//# sourceMappingURL=bundle.js.map?6a3b71b90cc56bdeeff3
2 changes: 1 addition & 1 deletion docs/bundle.js.map
View file

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion docs/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -42,5 +42,5 @@
</nav>
<div id="container"></div>
<script src="https://cdn.polyfill.io/v2/polyfill.min.js"></script>
<script type="text/javascript" src="bundle.js?50e5bec724f4afd6cfc1"></script></body>
<script type="text/javascript" src="bundle.js?6a3b71b90cc56bdeeff3"></script></body>
</html>
20 changes: 10 additions & 10 deletions package.json
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "@trendmicro/react-modal",
"version": "2.0.3",
"version": "2.0.4",
"description": "React Modal component",
"main": "lib/index.js",
"files": [
Expand Down Expand Up @@ -55,8 +55,8 @@
"@trendmicro/react-buttons": "~1.3.0",
"babel-cli": "~6.26.0",
"babel-core": "~6.26.0",
"babel-eslint": "~8.2.1",
"babel-loader": "~7.1.2",
"babel-eslint": "~8.2.2",
"babel-loader": "~7.1.4",
"babel-plugin-transform-decorators-legacy": "~1.3.4",
"babel-preset-env": "^1.6.1",
"babel-preset-react": "~6.24.1",
Expand All @@ -68,26 +68,26 @@
"css-loader": "~0.28.9",
"enzyme": "~3.3.0",
"enzyme-adapter-react-16": "~1.1.1",
"eslint": "~4.16.0",
"eslint": "~4.18.2",
"eslint-config-trendmicro": "~1.3.0",
"eslint-loader": "~1.9.0",
"eslint-plugin-import": "~2.8.0",
"eslint-loader": "~2.0.0",
"eslint-plugin-import": "~2.9.0",
"eslint-plugin-jsx-a11y": "~6.0.3",
"eslint-plugin-react": "~7.5.1",
"eslint-plugin-react": "~7.7.0",
"extract-text-webpack-plugin": "~3.0.2",
"file-loader": "~1.1.6",
"find-imports": "~0.5.2",
"html-webpack-plugin": "~2.30.1",
"html-webpack-plugin": "~3.0.6",
"http-server": "~0.11.1",
"jsdom": "~11.6.0",
"nib": "~1.1.2",
"react": "^0.14.0 || >=15.0.0",
"react-dom": "^0.14.0 || >=15.0.0",
"style-loader": "~0.19.1",
"style-loader": "~0.20.3",
"stylint": "~1.5.9",
"stylint-loader": "~1.0.0",
"stylus-loader": "~3.0.1",
"tap": "~11.0.1",
"tap": "~11.1.2",
"trendmicro-ui": "~0.5.1",
"url-loader": "~0.6.2",
"webpack": "~3.10.0",
Expand Down
6 changes: 5 additions & 1 deletion src/ModalOverlay.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -37,7 +37,11 @@ class ModalOverlay extends PureComponent {
};

render() {
const { className, ...props } = this.props;
const {
disableOverlay, // eslint-disable-line
className,
...props
} = this.props;

return (
<Portal
Expand Down

0 comments on commit 528c97f

Please sign in to comment.