UNPKG

@carbon/ibm-security

Version:

Carbon for Cloud & Cognitive IBM Security UI components

271 lines (270 loc) 13.7 kB
"use strict"; var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault"); var _typeof = require("@babel/runtime/helpers/typeof"); Object.defineProperty(exports, "__esModule", { value: true }); exports.default = void 0; var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")); 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 _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits")); var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty")); var _deprecate = _interopRequireDefault(require("carbon-components-react/lib/prop-types/deprecate")); var _propTypes = _interopRequireDefault(require("prop-types")); var _react = _interopRequireWildcard(require("react")); var defaultLabels = _interopRequireWildcard(require("../../globals/nls")); var _capabilities = require("../../globals/utils/capabilities"); var _Decorator = _interopRequireDefault(require("./Decorator")); var _PanelV = _interopRequireDefault(require("../PanelV2")); var _Portal = _interopRequireWildcard(require("../Portal")); function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); } function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; } function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; } function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; } function _callSuper(t, o, e) { return o = (0, _getPrototypeOf2.default)(o), (0, _possibleConstructorReturn2.default)(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], (0, _getPrototypeOf2.default)(t).constructor) : o.apply(t, e)); } function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); } /** * @file Data decorator * @copyright IBM Security 2019 - 2021 */ var defaultProps = _Decorator.default.defaultProps, propTypes = _Decorator.default.propTypes; var DataDecorator = /*#__PURE__*/function (_Component) { function DataDecorator() { var _this; (0, _classCallCheck2.default)(this, DataDecorator); for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) { args[_key] = arguments[_key]; } _this = _callSuper(this, DataDecorator, [].concat(args)); (0, _defineProperty2.default)(_this, "state", { isOpen: false }); (0, _defineProperty2.default)(_this, "toggleOpen", function () { return _this.state.isOpen ? _this.close() : _this.open(); }); (0, _defineProperty2.default)(_this, "open", function () { _this.setState({ isOpen: true }); _this.props.onOpen(); }); (0, _defineProperty2.default)(_this, "close", function () { _this.setState({ isOpen: false }); _this.props.onClose(); }); return _this; } (0, _inherits2.default)(DataDecorator, _Component); return (0, _createClass2.default)(DataDecorator, [{ key: "render", value: function render() { var _this2 = this; var _this$props = this.props, children = _this$props.children, className = _this$props.className, closeButton = _this$props.closeButton, focusTrap = _this$props.focusTrap, focusTrapOptions = _this$props.focusTrapOptions, inline = _this$props.inline, labels = _this$props.labels, noIcon = _this$props.noIcon, primaryButton = _this$props.primaryButton, renderFooter = _this$props.renderFooter, rootNode = _this$props.rootNode, score = _this$props.score, secondaryButton = _this$props.secondaryButton, stopPropagation = _this$props.stopPropagation, stopPropagationEvents = _this$props.stopPropagationEvents, subtitle = _this$props.subtitle, type = _this$props.type, value = _this$props.value, title = _this$props.title, scoreThresholds = _this$props.scoreThresholds, scoreDescription = _this$props.scoreDescription, propOnContextMenu = _this$props.onContextMenu, midLineTruncation = _this$props.midLineTruncation; var onContextMenu = propOnContextMenu ? function (event) { event.preventDefault(); propOnContextMenu(event); } : undefined; var decoratorProps = { className: className, inline: inline, noIcon: noIcon, score: score, type: type, value: value, title: title, scoreThresholds: scoreThresholds, scoreDescription: scoreDescription, onContextMenu: onContextMenu, midLineTruncation: midLineTruncation }; var componentLabels = _objectSpread(_objectSpread(_objectSpread({}, defaultLabels.labels), labels), defaultLabels.filterFalsey({ DATA_DECORATOR_PRIMARY_BUTTON: primaryButton && primaryButton.label || '', DATA_DECORATOR_SECONDARY_BUTTON: secondaryButton && secondaryButton.label || '', DATA_DECORATOR_CLOSE_BUTTON: closeButton && closeButton.label || '' })); return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_Decorator.default, (0, _extends2.default)({}, decoratorProps, { active: this.state.isOpen, onClick: function onClick(event) { event.stopPropagation(); _this2.toggleOpen(); } })), /*#__PURE__*/_react.default.createElement(_PanelV.default, { closeButton: { onClick: function onClick(event) { _this2.close(event, type, value); if (closeButton && closeButton.onClick) { closeButton.onClick(event, type, value); } } }, focusTrap: focusTrap, focusTrapOptions: focusTrapOptions, isOpen: this.state.isOpen, labels: _objectSpread(_objectSpread({}, componentLabels), defaultLabels.filterFalsey({ PANEL_CONTAINER_PRIMARY_BUTTON: componentLabels.DATA_DECORATOR_PRIMARY_BUTTON, PANEL_CONTAINER_SECONDARY_BUTTON: componentLabels.DATA_DECORATOR_SECONDARY_BUTTON, PANEL_CONTAINER_CLOSE_BUTTON: componentLabels.DATA_DECORATOR_CLOSE_BUTTON })), onClose: this.close, primaryButton: primaryButton && _objectSpread(_objectSpread({}, primaryButton), {}, { onClick: function onClick(event) { if (primaryButton.closePanel === undefined || primaryButton.closePanel) { _this2.close(event, type, value); } if (primaryButton.onClick) { primaryButton.onClick(event, type, value); } } }), renderFooter: renderFooter, rootNode: rootNode, secondaryButton: secondaryButton && _objectSpread(_objectSpread({}, secondaryButton), {}, { onClick: function onClick(event) { if (secondaryButton.closePanel === undefined || secondaryButton.closePanel) { _this2.close(event, type, value); } if (secondaryButton.onClick) { secondaryButton.onClick(event, type, value); } } }), stopPropagation: stopPropagation, stopPropagationEvents: stopPropagationEvents, subtitle: subtitle, title: value }, children)); } }]); }(_react.Component); var buttonType = _propTypes.default.shape({ closePanel: _propTypes.default.bool, onClick: _propTypes.default.func, label: _propTypes.default.string, isDisabled: _propTypes.default.bool, icon: _propTypes.default.object, iconDescription: _propTypes.default.string }); DataDecorator.propTypes = { /** @type {ReactNode} The children of the DataDecorator. */ children: _propTypes.default.node, /** @type {string} class name for rendered content. */ className: _propTypes.default.string, /** @type {Record<string, any>} An object list of close button props. */ closeButton: buttonType, /** @type {boolean} Focus trap. */ focusTrap: _propTypes.default.bool, focusTrapOptions: _Portal.default.propTypes.focusTrapOptions, /** @type {boolean} Determines if this is inline or not. */ inline: propTypes.inline, /** @type {object} Labels for DataDecorator and children */ labels: defaultLabels.propType, /** @type {object} Mid-line truncation options applied to value of decorator if applicable. */ midLineTruncation: _propTypes.default.shape({ enabled: _propTypes.default.bool, maxLength: _propTypes.default.number, front: _propTypes.default.number, back: _propTypes.default.number }), /** @type {boolean} Whether the rendered Decorator includes an icon */ noIcon: _propTypes.default.bool, /** @type {Function} The function to call when the DataDecorator Panel closes. */ onClose: _propTypes.default.func, /** @type {Function} The function to call when the DataDecorator is secondary-clicked */ onContextMenu: _propTypes.default.func, /** @type {Function} The function to call when the DataDecorator Panel opens. */ onOpen: _propTypes.default.func, /** @type {Record<string, any>} An object list of primary button props. */ primaryButton: (0, _deprecate.default)(buttonType, "\nThe prop `primaryButton` for DataDecorator has been deprecated in favor of `renderFooter`."), /** @type {Function} Panel footer render prop. */ renderFooter: _propTypes.default.func, /** @type {ReactNode|any} The root node for rendering the panel */ rootNode: (0, _capabilities.isNode)() ? _propTypes.default.instanceOf(Node) : _propTypes.default.any, /** @type {number} The score of the data. */ score: _propTypes.default.number, /** @type {func} Descriptive text for screen readers that details the severity of a score. */ scoreDescription: _propTypes.default.func, /** @type {number} The external URL. */ scoreThresholds: function scoreThresholds(props, propName) { if (!Array.isArray(props.scoreThresholds) || props.scoreThresholds.length !== 4 || !props.scoreThresholds.every(function (number) { return typeof number === 'number'; })) { return new Error("".concat(propName, " is required to be an array of four numbers.")); } return null; }, /** @type {Record<string, any>} An object list of secondary button props. */ secondaryButton: (0, _deprecate.default)(buttonType, "\nThe prop `secondaryButton` for DataDecorator has been deprecated in favor of `renderFooter`."), /** @type {boolean} Stop event propagation for events that can bubble. */ stopPropagation: _propTypes.default.bool, /** @type {Array} Array of event types to stop propagation. */ stopPropagationEvents: _propTypes.default.arrayOf(_propTypes.default.oneOf(_Portal.PORTAL_EVENTS)), /** @type {ReactNode} Child elements for the panel's subtitle. */ subtitle: _propTypes.default.node, /** @type {string} decorator's title. */ title: _propTypes.default.string, /** @type {string} The type of data. */ type: _propTypes.default.string.isRequired, /** @type {string} The value of the data. */ value: _propTypes.default.string.isRequired }; DataDecorator.defaultProps = { children: undefined, className: undefined, closeButton: undefined, focusTrap: true, focusTrapOptions: _Portal.default.defaultProps.focusTrapOptions, inline: defaultProps.inline, labels: {}, noIcon: false, onContextMenu: undefined, onClose: function onClose() {}, onOpen: function onOpen() {}, primaryButton: undefined, renderFooter: null, rootNode: undefined, score: undefined, scoreThresholds: [0, 4, 7, 10], secondaryButton: undefined, subtitle: undefined, title: undefined, stopPropagation: false, stopPropagationEvents: undefined, scoreDescription: function scoreDescription(score, scoreThresholds) { return "Score ".concat(score, " out of ").concat(scoreThresholds.slice(-1)[0]); }, midLineTruncation: { enabled: false, maxLength: 20, front: 12, back: 4 } }; var _default = exports.default = DataDecorator;