@carbon/ibm-security
Version:
Carbon for Cloud & Cognitive IBM Security UI components
165 lines (163 loc) • 8.65 kB
JavaScript
;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
var _typeof = require("@babel/runtime/helpers/typeof");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.namespace = exports.default = void 0;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
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 _iconsReact = require("@carbon/icons-react");
var _setupGetInstanceId = _interopRequireDefault(require("carbon-components-react/lib/tools/setupGetInstanceId"));
var _classnames3 = _interopRequireDefault(require("classnames"));
var _propTypes = require("prop-types");
var _react = _interopRequireWildcard(require("react"));
var _Icon = _interopRequireDefault(require("../../Icon"));
var _NavItemLink = _interopRequireDefault(require("../NavItemLink"));
var _namespace = require("../../../globals/namespace");
var _excluded = ["className", "element", "tabIndex", "children", "disabled", "label", "onClick", "href", "activeHref", "current", "handleItemSelect", "link", "id"];
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 _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 Navigation item class.
* @copyright IBM Security 2019 - 2021
*/
var getInstanceId = (0, _setupGetInstanceId.default)();
var namespace = exports.namespace = (0, _namespace.getComponentNamespace)('nav__list__item');
/**
* Navigation item component.
*/
var NavItem = exports.default = /*#__PURE__*/function (_Component) {
function NavItem() {
var _this;
(0, _classCallCheck2.default)(this, NavItem);
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
_this = _callSuper(this, NavItem, [].concat(args));
(0, _defineProperty2.default)(_this, "state", {
current: _this.props.current
});
(0, _defineProperty2.default)(_this, "instanceId", "".concat(namespace, "__").concat(getInstanceId()));
return _this;
}
(0, _inherits2.default)(NavItem, _Component);
return (0, _createClass2.default)(NavItem, [{
key: "render",
value: function render() {
var _this$props = this.props,
className = _this$props.className,
element = _this$props.element,
tabIndex = _this$props.tabIndex,
children = _this$props.children,
disabled = _this$props.disabled,
label = _this$props.label,
_onClick = _this$props.onClick,
href = _this$props.href,
activeHref = _this$props.activeHref,
_ = _this$props.current,
handleItemSelect = _this$props.handleItemSelect,
link = _this$props.link,
id = _this$props.id,
other = (0, _objectWithoutProperties2.default)(_this$props, _excluded);
var isAbsoluteLink = new RegExp('^([a-z]+://|//)', 'i');
var externalLink = isAbsoluteLink.test(href) && href.indexOf(window.location.host) === -1;
var navItemId = id || this.instanceId;
var classNames = (0, _classnames3.default)(namespace, className, (0, _defineProperty2.default)((0, _defineProperty2.default)({}, "".concat(namespace, "--active"), this.state.current !== null && this.state.current === navItemId || activeHref !== undefined && activeHref === href && !externalLink), "".concat(namespace, "--disabled"), disabled));
var externalLinkProps = externalLink && {
rel: 'noopener noreferrer',
target: '_blank'
};
var handleDisabled = function handleDisabled(action) {
var defaultValue = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null;
return !disabled ? action : defaultValue;
};
var linkClassName = "".concat(namespace, "__link");
var navItemTabIndex = handleDisabled(tabIndex, -1);
return /*#__PURE__*/_react.default.createElement("li", {
className: classNames,
label: label,
onClick: function onClick(event) {
return handleDisabled(_onClick(event, href));
},
onKeyPress: function onKeyPress(event) {
return handleDisabled(_onClick(event, href));
},
role: "menuitem"
}, link ? /*#__PURE__*/_react.default.createElement(_NavItemLink.default, (0, _extends2.default)({
id: navItemId,
className: (0, _classnames3.default)(linkClassName, (0, _defineProperty2.default)({}, "".concat(namespace, "__link--external"), externalLink)),
element: element,
href: href,
tabIndex: navItemTabIndex
}, other, externalLinkProps), children, externalLink && /*#__PURE__*/_react.default.createElement(_Icon.default, {
className: "".concat(namespace, "__link--external__icon"),
renderIcon: _iconsReact.Launch16
})) : /*#__PURE__*/_react.default.createElement("div", {
id: navItemId,
className: linkClassName,
onClick: handleDisabled(handleItemSelect),
onKeyPress: handleDisabled(handleItemSelect),
role: "menuitem",
tabIndex: navItemTabIndex
}, children));
}
}], [{
key: "getDerivedStateFromProps",
value: function getDerivedStateFromProps(props, state) {
return props.current === state.current ? null : {
current: props.current
};
}
}]);
}(_react.Component);
(0, _defineProperty2.default)(NavItem, "propTypes", {
/** @type {string} Hypertext reference for active page. */
activeHref: _propTypes.string,
/** @type {Node} Children. */
children: _propTypes.node,
/** @type {string} Extra classes to add. */
className: _propTypes.string,
/** @type {string} Currently selected item. */
current: _propTypes.string,
/** @type {bool} Whether the item is disabled. */
disabled: _propTypes.bool,
/** @type {elementType} The base element to use to build the link. Defaults to `a`, can also accept alternative tag names or custom components like `Link` from `react-router`. */
element: _propTypes.elementType,
/** @type {Function} Click handler of an item. */
handleItemSelect: _propTypes.func,
/** @type {string} The href of the nav item. */
href: _propTypes.string,
/** @type {string} Identifier. */
id: _propTypes.string,
/** @type {string} Label of an item. */
label: _propTypes.string,
/** @type {bool} Whether the item is a link. */
link: _propTypes.bool,
/** @type {Function} Click handler of an item. */
onClick: _propTypes.func,
/** @type {number} `tabindex` of an item. */
tabIndex: _propTypes.number
});
(0, _defineProperty2.default)(NavItem, "defaultProps", {
activeHref: '#',
children: null,
className: '',
current: null,
disabled: false,
element: 'a',
handleItemSelect: null,
href: undefined,
id: null,
label: '',
link: true,
onClick: function onClick() {},
tabIndex: 0
});