UNPKG

react-cm-ui

Version:
162 lines (140 loc) 6.11 kB
"use strict"; Object.defineProperty(exports, "__esModule", { value: true }); exports["default"] = void 0; var _classnames = _interopRequireDefault(require("classnames")); var _momentTimezone = _interopRequireDefault(require("moment-timezone")); var _propTypes = _interopRequireDefault(require("prop-types")); var _react = _interopRequireDefault(require("react")); var _personPanelConstants = require("../personPanel/personPanelConstants"); var _constants = require("../../global/constants"); var _constants2 = require("./constants"); var _grid = _interopRequireDefault(require("../../layout/grid")); var _icon = _interopRequireDefault(require("../icon")); var _makeStyles = _interopRequireDefault(require("../../styles/makeStyles")); var _milestonePopoverContent = _interopRequireDefault(require("./milestonePopoverContent")); var _popover = _interopRequireDefault(require("../popover")); 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; } var propTypes = { acceptedChristDate: _constants2.ACCEPTED_CHRIST_DATE_PROP_TYPE, classes: _propTypes["default"].shape({ icon: _propTypes["default"].string, root: _propTypes["default"].string }).isRequired, disablePopover: _constants2.DISABLE_POPOVER_PROP_TYPE, hasAcceptedChrist: _constants2.HAS_ACCEPTED_CHRIST_PROP_TYPE, iconSize: _constants2.ICON_SIZE_PROP_TYPE, inverse: _constants2.INVERSE_PROP_TYPE, isFemale: _propTypes["default"].bool, isMale: _propTypes["default"].bool, recordType: _personPanelConstants.RECORD_TYPE_PROP_TYPE, removeAcceptedChristColumn: _constants2.REMOVE_ACCEPTED_CHRIST_COLUMN_PROP_TYPE }; var defaultProps = { acceptedChristDate: null, disablePopover: _constants2.DISABLE_POPOVER_DEFAULT_PROP, hasAcceptedChrist: null, iconSize: _constants2.ICON_SIZE_DEFAULT_PROP, inverse: _constants2.INVERSE_DEFAULT_PROP, isFemale: _propTypes["default"].bool, isMale: _propTypes["default"].bool, recordType: _personPanelConstants.RECORD_TYPE_DEFAULT_PROP, removeAcceptedChristColumn: _constants2.REMOVE_ACCEPTED_CHRIST_COLUMN_DEFAULT_PROP }; var useStyles = (0, _makeStyles["default"])(function (theme) { return { root: { '& $hasAcceptedChrist': { '&$isAdult': { '&$genderFemale .icon-use-path': { fill: "".concat((0, _personPanelConstants.RECORD_TYPE_COLOR)({ gender: 'f', recordType: 'adult', theme: theme })) }, '&$genderMale .icon-use-path': { fill: "".concat((0, _personPanelConstants.RECORD_TYPE_COLOR)({ gender: 'm', recordType: 'adult', theme: theme })) }, '&$genderUndefined .icon-use-path': { fill: "".concat((0, _personPanelConstants.RECORD_TYPE_COLOR)({ recordType: 'adult', theme: theme })) } }, '&$isChild .icon-use-path': { fill: "".concat((0, _personPanelConstants.RECORD_TYPE_COLOR)({ recordType: 'child', theme: theme }), " !important") }, '&$isStudent .icon-use-path': { fill: "".concat((0, _personPanelConstants.RECORD_TYPE_COLOR)({ recordType: 'student', theme: theme }), " !important") } } }, genderFemale: {}, genderMale: {}, genderUndefined: {}, hasAcceptedChrist: { '&.icon': { opacity: 1 } }, icon: {}, isAdult: {}, isChild: {}, isStudent: {} }; }); function GridColumnAcceptedChrist(props) { var _ClassNames; var acceptedChristDate = props.acceptedChristDate, disablePopover = props.disablePopover, hasAcceptedChrist = props.hasAcceptedChrist, iconSize = props.iconSize, inverse = props.inverse, isFemale = props.isFemale, isMale = props.isMale, recordType = props.recordType, removeAcceptedChristColumn = props.removeAcceptedChristColumn; var classes = useStyles(props); if (removeAcceptedChristColumn) { return null; } var acceptedChristIcon = /*#__PURE__*/_react["default"].createElement(_icon["default"], { className: (0, _classnames["default"])(classes.icon, (_ClassNames = {}, _defineProperty(_ClassNames, classes.genderFemale, isFemale), _defineProperty(_ClassNames, classes.genderMale, isMale), _defineProperty(_ClassNames, classes.genderUndefined, !isFemale && !isMale), _defineProperty(_ClassNames, classes.hasAcceptedChrist, hasAcceptedChrist), _defineProperty(_ClassNames, classes.isAdult, !recordType || recordType === 'adult'), _defineProperty(_ClassNames, classes.isChild, recordType === 'child'), _defineProperty(_ClassNames, classes.isStudent, recordType === 'student'), _ClassNames)), compact: true, inverse: inverse, size: iconSize, title: hasAcceptedChrist ? false : 'Has not accepted Christ', type: "heart" }); var popoverNode = !disablePopover && hasAcceptedChrist && acceptedChristDate ? /*#__PURE__*/_react["default"].createElement(_popover["default"], { content: /*#__PURE__*/_react["default"].createElement(_milestonePopoverContent["default"], { title: "Accepted Christ", milestonesDates: [{ label: 'On', date: (0, _momentTimezone["default"])(acceptedChristDate).format() }] }), mouseEvent: "onMouseEnter" }, acceptedChristIcon) : null; return /*#__PURE__*/_react["default"].createElement(_grid["default"].Column, { className: (0, _classnames["default"])("".concat(_constants.BEM_PERSON_CORE_MILESTONES, "--accepted_christ_column"), classes.root) }, popoverNode || acceptedChristIcon); } GridColumnAcceptedChrist.propTypes = propTypes; GridColumnAcceptedChrist.defaultProps = defaultProps; var _default = GridColumnAcceptedChrist; exports["default"] = _default;