"use strict"; Object.defineProperty(exports, "__esModule", { value: true }); exports["default"] = void 0; var React = _interopRequireWildcard(require("react")); var _reactDom = require("react-dom"); var _Event = _interopRequireDefault(require("css-animation/lib/Event")); var _raf = _interopRequireDefault(require("./raf")); var _configProvider = require("../config-provider"); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function _getRequireWildcardCache() { return cache; }; return cache; } function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; } function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); } function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; } function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); } function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); } function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; } function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); } function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; } function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); } var styleForPesudo; // Where el is the DOM element you'd like to test for visibility function isHidden(element) { if (process.env.NODE_ENV === 'test') { return false; } return !element || element.offsetParent === null; } function isNotGrey(color) { // eslint-disable-next-line no-useless-escape var match = (color || '').match(/rgba?\((\d*), (\d*), (\d*)(, [\.\d]*)?\)/); if (match && match[1] && match[2] && match[3]) { return !(match[1] === match[2] && match[2] === match[3]); } return true; } var Wave = /*#__PURE__*/function (_React$Component) { _inherits(Wave, _React$Component); var _super = _createSuper(Wave); function Wave() { var _this; _classCallCheck(this, Wave); _this = _super.apply(this, arguments); _this.animationStart = false; _this.destroy = false; _this.onClick = function (node, waveColor) { if (!node || isHidden(node) || node.className.indexOf('-leave') >= 0) { return; } var insertExtraNode = _this.props.insertExtraNode; _this.extraNode = document.createElement('div'); var _assertThisInitialize = _assertThisInitialized(_this), extraNode = _assertThisInitialize.extraNode; extraNode.className = 'ant-click-animating-node'; var attributeName = _this.getAttributeName(); node.setAttribute(attributeName, 'true'); // Not white or transparnt or grey styleForPesudo = styleForPesudo || document.createElement('style'); if (waveColor && waveColor !== '#ffffff' && waveColor !== 'rgb(255, 255, 255)' && isNotGrey(waveColor) && !/rgba\(\d*, \d*, \d*, 0\)/.test(waveColor) && // any transparent rgba color waveColor !== 'transparent') { // Add nonce if CSP exist if (_this.csp && _this.csp.nonce) { styleForPesudo.nonce = _this.csp.nonce; } extraNode.style.borderColor = waveColor; styleForPesudo.innerHTML = "\n [ant-click-animating-without-extra-node='true']::after, .ant-click-animating-node {\n --antd-wave-shadow-color: ".concat(waveColor, ";\n }"); if (!document.body.contains(styleForPesudo)) { document.body.appendChild(styleForPesudo); } } if (insertExtraNode) { node.appendChild(extraNode); } _Event["default"].addStartEventListener(node, _this.onTransitionStart); _Event["default"].addEndEventListener(node, _this.onTransitionEnd); }; _this.onTransitionStart = function (e) { if (_this.destroy) return; var node = (0, _reactDom.findDOMNode)(_assertThisInitialized(_this)); if (!e || e.target !== node) { return; } if (!_this.animationStart) { _this.resetEffect(node); } }; _this.onTransitionEnd = function (e) { if (!e || e.animationName !== 'fadeEffect') { return; } _this.resetEffect(e.target); }; _this.bindAnimationEvent = function (node) { if (!node || !node.getAttribute || node.getAttribute('disabled') || node.className.indexOf('disabled') >= 0) { return; } var onClick = function onClick(e) { // Fix radio button click twice if (e.target.tagName === 'INPUT' || isHidden(e.target)) { return; } _this.resetEffect(node); // Get wave color from target var waveColor = getComputedStyle(node).getPropertyValue('border-top-color') || // Firefox Compatible getComputedStyle(node).getPropertyValue('border-color') || getComputedStyle(node).getPropertyValue('background-color'); _this.clickWaveTimeoutId = window.setTimeout(function () { return _this.onClick(node, waveColor); }, 0); _raf["default"].cancel(_this.animationStartId); _this.animationStart = true; // Render to trigger transition event cost 3 frames. Let's delay 10 frames to reset this. _this.animationStartId = (0, _raf["default"])(function () { _this.animationStart = false; }, 10); }; node.addEventListener('click', onClick, true); return { cancel: function cancel() { node.removeEventListener('click', onClick, true); } }; }; _this.renderWave = function (_ref) { var csp = _ref.csp; var children = _this.props.children; _this.csp = csp; return children; }; return _this; } _createClass(Wave, [{ key: "componentDidMount", value: function componentDidMount() { var node = (0, _reactDom.findDOMNode)(this); if (!node || node.nodeType !== 1) { return; } this.instance = this.bindAnimationEvent(node); } }, { key: "componentWillUnmount", value: function componentWillUnmount() { if (this.instance) { this.instance.cancel(); } if (this.clickWaveTimeoutId) { clearTimeout(this.clickWaveTimeoutId); } this.destroy = true; } }, { key: "getAttributeName", value: function getAttributeName() { var insertExtraNode = this.props.insertExtraNode; return insertExtraNode ? 'ant-click-animating' : 'ant-click-animating-without-extra-node'; } }, { key: "resetEffect", value: function resetEffect(node) { if (!node || node === this.extraNode || !(node instanceof Element)) { return; } var insertExtraNode = this.props.insertExtraNode; var attributeName = this.getAttributeName(); node.setAttribute(attributeName, 'false'); // edge has bug on `removeAttribute` #14466 if (styleForPesudo) { styleForPesudo.innerHTML = ''; } if (insertExtraNode && this.extraNode && node.contains(this.extraNode)) { node.removeChild(this.extraNode); } _Event["default"].removeStartEventListener(node, this.onTransitionStart); _Event["default"].removeEndEventListener(node, this.onTransitionEnd); } }, { key: "render", value: function render() { return /*#__PURE__*/React.createElement(_configProvider.ConfigConsumer, null, this.renderWave); } }]); return Wave; }(React.Component); exports["default"] = Wave;