@zohodesk/components/lib/RippleEffect/RippleEffect.js

Dot UI is a customizable React component library built to deliver a clean, accessible, and developer-friendly UI experience. It offers a growing set of reusable components designed to align with modern design systems and streamline application development

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports["default"] = RippleEffect;

var _react = _interopRequireDefault(require("react"));

var _defaultProps = require("./props/defaultProps");

var _propTypes = require("./props/propTypes");

var _CssProvider = _interopRequireDefault(require("../Provider/CssProvider"));

var _RippleEffectModule = _interopRequireDefault(require("./RippleEffect.module.css"));

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }

function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }

function RippleEffect(props) {
  var children = props.children,
      isActive = props.isActive,
      isDisabled = props.isDisabled,
      palette = props.palette,
      hoverType = props.hoverType,
      isNeedEffect = props.isNeedEffect,
      needBorder = props.needBorder,
      isCopyTextEnabled = props.isCopyTextEnabled,
      cssClassPropOfChild = props.cssClassPropOfChild;
  var className = isNeedEffect ? "".concat(_RippleEffectModule["default"].effect, " ").concat(_RippleEffectModule["default"][palette], " ").concat(needBorder ? _RippleEffectModule["default"].border : '', " ").concat(_RippleEffectModule["default"]["".concat(hoverType, "Hover")] ? _RippleEffectModule["default"]["".concat(hoverType, "Hover")] : '', " ").concat(isActive && !isDisabled ? _RippleEffectModule["default"].active : '', " ").concat(isDisabled ? '' : _RippleEffectModule["default"].hoverEffect, " ").concat(isCopyTextEnabled ? _RippleEffectModule["default"].notAllowed : isDisabled ? (0, _CssProvider["default"])('isDisabled') : '') : '';

  var child = _react["default"].Children.only(children);

  return /*#__PURE__*/_react["default"].cloneElement(child, _defineProperty({}, cssClassPropOfChild, "".concat(child.props[cssClassPropOfChild] || '', " ").concat(className)));
}

RippleEffect.defaultProps = _defaultProps.defaultProps;
RippleEffect.propTypes = _propTypes.propTypes; // if (__DOCS__) {
//   RippleEffect.docs = {
//     componentGroup: 'RippleEffect',
//     folderName: 'Style Guide'
//   };
// }