@hig/side-nav - npm Package Compare versions

Comparing version 0.1.0-alpha.b668624b to 0.1.0-alpha.bac6c2ff

1727

build/index.es.js

		import React, { Component } from 'react';
		import PropTypes from 'prop-types';
		import cx from 'classnames';
		import Icon, { names, sizes } from '@hig/icon';
		import { ThemeContext } from '@hig/themes';
		import IconButton, { types } from '@hig/icon-button';
		import SkeletonItem from '@hig/skeleton-item';
		import { ThemeContext } from '@hig/themes';

		function createCommonjsModule(fn, module) {
		return module = { exports: {} }, fn(module, module.exports), module.exports;
		}
		var _createClass = 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); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();

		var classnames = createCommonjsModule(function (module) {
		var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; };
		function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }

		/*!
		Copyright (c) 2016 Jed Watson.
		Licensed under the MIT License (MIT), see
		http://jedwatson.github.io/classnames
		*/
		/* global define */
		function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" \|\| typeof call === "function") ? call : self; }

		(function () {
		function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }

		var hasOwn = {}.hasOwnProperty;
		/** @todo Consider replacing with an IconButton */

		function classNames() {
		var classes = [];
		var CollapseButton = function (_Component) {
		_inherits(CollapseButton, _Component);

		for (var i = 0; i < arguments.length; i++) {
		var arg = arguments[i];
		if (!arg) continue;
		function CollapseButton() {
		_classCallCheck(this, CollapseButton);

		var argType = typeof arg === 'undefined' ? 'undefined' : _typeof(arg);
		return _possibleConstructorReturn(this, (CollapseButton.__proto__ \|\| Object.getPrototypeOf(CollapseButton)).apply(this, arguments));
		}

		if (argType === 'string' \|\| argType === 'number') {
		classes.push(arg);
		} else if (Array.isArray(arg)) {
		classes.push(classNames.apply(null, arg));
		} else if (argType === 'object') {
		for (var key in arg) {
		if (hasOwn.call(arg, key) && arg[key]) {
		classes.push(key);
		}
		}
		}
		}
		_createClass(CollapseButton, [{
		key: "render",
		value: function render() {
		var _props = this.props,
		minimized = _props.minimized,
		onClick = _props.onClick;

		return classes.join(' ');
		}
		var classes = function classes(themeClass) {
		return cx(themeClass, "hig__side-nav__module__collapse-button", {
		"hig__side-nav__module__collapse-button--collapsed": minimized
		});
		};

		if ('object' !== 'undefined' && module.exports) {
		module.exports = classNames;
		} else if (typeof undefined === 'function' && _typeof(undefined.amd) === 'object' && undefined.amd) {
		// register as 'classnames', consistent with npm package name
		undefined('classnames', [], function () {
		return classNames;
		});
		} else {
		window.classNames = classNames;
		}
		})();
		});
		return React.createElement(
		ThemeContext.Consumer,
		null,
		function (_ref) {
		var themeClass = _ref.themeClass;
		return (
		/** @todo replace with a semantic HTML tag */
		React.createElement(
		"div",
		{
		className: classes(themeClass),
		onClick: onClick,
		role: "button",
		tabIndex: 0
		},
		React.createElement(Icon, { name: names.CARET, size: sizes.PX_24 })
		)
		);
		}
		);
		}
		}]);

		return CollapseButton;
		}(Component);

		CollapseButton.propTypes = {
		/** Presents the icon in a minimized state: caret pointing right */
		minimized: PropTypes.bool,
		/** Called when element is clicked */
		onClick: PropTypes.func
		};
		CollapseButton.defaultProps = {
		onClick: function onClick() {},
		minimized: false
		};
		CollapseButton.__docgenInfo = {
		"description": "@todo Consider replacing with an IconButton",
		"displayName": "CollapseButton",
		"props": {
		"minimized": {
		"type": {
		"name": "bool"
		},
		"required": false,
		"description": "Presents the icon in a minimized state: caret pointing right",
		"defaultValue": {
		"value": "false",
		"computed": false
		}
		},
		"onClick": {
		"type": {
		"name": "func"
		},
		"required": false,
		"description": "Called when element is clicked",
		"defaultValue": {
		"value": "() => {}",
		"computed": false
		}
		}
		}
		};

		var _createClass$1 = 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); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();

		function _classCallCheck$1(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }

		function _possibleConstructorReturn$1(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" \|\| typeof call === "function") ? call : self; }

		function _inherits$1(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }

		var Group = function (_Component) {
		_inherits$1(Group, _Component);

		function Group() {
		_classCallCheck$1(this, Group);

		return _possibleConstructorReturn$1(this, (Group.__proto__ \|\| Object.getPrototypeOf(Group)).apply(this, arguments));
		}

		_createClass$1(Group, [{
		key: "render",
		value: function render() {
		var _this2 = this;

		var classes = function classes(themeClass) {
		return cx(themeClass, "hig__side-nav__group");
		};

		return React.createElement(
		ThemeContext.Consumer,
		null,
		function (_ref) {
		var themeClass = _ref.themeClass;
		return React.createElement(
		"section",
		{ className: classes(themeClass) },
		_this2.props.children
		);
		}
		);
		}
		}]);

		return Group;
		}(Component);

		Group.propTypes = {
		/** One or more SideNav Modules */
		children: PropTypes.node
		};
		Group.__docgenInfo = {
		"description": "",
		"displayName": "Group",
		"props": {
		"children": {
		"type": {
		"name": "node"
		},
		"required": false,
		"description": "One or more SideNav Modules"
		}
		}
		};

		var _createClass$2 = 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); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();

		function _classCallCheck$2(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }

		function _possibleConstructorReturn$2(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" \|\| typeof call === "function") ? call : self; }

		function _inherits$2(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }

		var ExternalLinkIcon = function (_Component) {
		_inherits$2(ExternalLinkIcon, _Component);

		function ExternalLinkIcon() {
		_classCallCheck$2(this, ExternalLinkIcon);

		return _possibleConstructorReturn$2(this, (ExternalLinkIcon.__proto__ \|\| Object.getPrototypeOf(ExternalLinkIcon)).apply(this, arguments));
		}

		_createClass$2(ExternalLinkIcon, [{
		key: "render",
		value: function render() {
		return React.createElement(Icon, { name: names.EXTERNAL_LINK, size: this.props.size });
		}
		}]);

		return ExternalLinkIcon;
		}(Component);

		ExternalLinkIcon.propTypes = {
		/** Size of the icon */
		size: PropTypes.oneOf(Object.values(sizes))
		};
		ExternalLinkIcon.defaultProps = {
		size: sizes.PX_24
		};
		ExternalLinkIcon.__docgenInfo = {
		"description": "",
		"displayName": "ExternalLinkIcon",
		"props": {
		"size": {
		"type": {
		"name": "enum",
		"computed": true,
		"value": "Object.values(iconSizes)"
		},
		"required": false,
		"description": "Size of the icon",
		"defaultValue": {
		"value": "iconSizes.PX_24",
		"computed": true
		}
		}
		}
		};

		var _createClass$3 = 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); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();

		function _classCallCheck$3(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }

		function _possibleConstructorReturn$3(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" \|\| typeof call === "function") ? call : self; }

		function _inherits$3(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }

		/** @todo Consider extending TextLink */

		var Link = function (_Component) {
		_inherits$3(Link, _Component);

		function Link() {
		var _ref;

		var _temp, _this, _ret;

		_classCallCheck$3(this, Link);

		for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
		args[_key] = arguments[_key];
		}

		return _ret = (_temp = (_this = _possibleConstructorReturn$3(this, (_ref = Link.__proto__ \|\| Object.getPrototypeOf(Link)).call.apply(_ref, [this].concat(args))), _this), _this._renderExternalLinkIcon = function () {
		return _this.props.target === "_blank" && React.createElement(ExternalLinkIcon, { size: sizes.PX_16 });
		}, _temp), _possibleConstructorReturn$3(_this, _ret);
		}

		_createClass$3(Link, [{
		key: "render",
		value: function render() {
		var _this2 = this;

		var _props = this.props,
		title = _props.title,
		link = _props.link,
		onClick = _props.onClick,
		onMouseOver = _props.onMouseOver,
		target = _props.target;

		var classes = function classes(themeClass) {
		return cx(themeClass, "hig__side-nav__link");
		};

		var Wrapper = link ? "a" : "div";

		return React.createElement(
		ThemeContext.Consumer,
		null,
		function (_ref2) {
		var themeClass = _ref2.themeClass;
		return React.createElement(
		Wrapper,
		{
		className: classes(themeClass),
		href: link,
		target: target,
		onClick: onClick,
		onMouseOver: onMouseOver
		},
		title,
		_this2._renderExternalLinkIcon()
		);
		}
		);
		}
		}]);

		return Link;
		}(Component);

		Link.propTypes = {
		/** URL to navigate to when clicking this link */
		link: PropTypes.string,
		/** Called when link is clicked */
		onClick: PropTypes.func,
		/** Called when hovering over the link */
		onMouseOver: PropTypes.func,
		/** Corresponds to the anchor tag's target */
		target: PropTypes.oneOf(["_self", "_blank", "_parent", "_top"]),
		/** Link text */
		title: PropTypes.string
		};
		Link.defaultProps = {
		onClick: function onClick() {},
		onMouseOver: function onMouseOver() {}
		};
		Link.__docgenInfo = {
		"description": "@todo Consider extending TextLink",
		"displayName": "Link",
		"props": {
		"link": {
		"type": {
		"name": "string"
		},
		"required": false,
		"description": "URL to navigate to when clicking this link"
		},
		"onClick": {
		"type": {
		"name": "func"
		},
		"required": false,
		"description": "Called when link is clicked",
		"defaultValue": {
		"value": "() => {}",
		"computed": false
		}
		},
		"onMouseOver": {
		"type": {
		"name": "func"
		},
		"required": false,
		"description": "Called when hovering over the link",
		"defaultValue": {
		"value": "() => {}",
		"computed": false
		}
		},
		"target": {
		"type": {
		"name": "enum",
		"value": [{
		"value": "\"_self\"",
		"computed": false
		}, {
		"value": "\"_blank\"",
		"computed": false
		}, {
		"value": "\"_parent\"",
		"computed": false
		}, {
		"value": "\"_top\"",
		"computed": false
		}]
		},
		"required": false,
		"description": "Corresponds to the anchor tag's target"
		},
		"title": {
		"type": {
		"name": "string"
		},
		"required": false,
		"description": "Link text"
		}
		}
		};

		var _createClass$4 = 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); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();

		function _classCallCheck$4(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }

		function _possibleConstructorReturn$4(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" \|\| typeof call === "function") ? call : self; }

		function _inherits$4(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }

		var Module = function (_Component) {
		_inherits$4(Module, _Component);

		function Module() {
		var _ref;

		var _temp, _this, _ret;

		_classCallCheck$4(this, Module);

		for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
		args[_key] = arguments[_key];
		}

		return _ret = (_temp = (_this = _possibleConstructorReturn$4(this, (_ref = Module.__proto__ \|\| Object.getPrototypeOf(Module)).call.apply(_ref, [this].concat(args))), _this), _this._renderExternalLinkIcon = function () {
		return _this.props.target === "_blank" && React.createElement(ExternalLinkIcon, null);
		}, _temp), _possibleConstructorReturn$4(_this, _ret);
		}

		_createClass$4(Module, [{
		key: "render",
		value: function render() {
		var _this2 = this;

		var _props = this.props,
		children = _props.children,
		icon = _props.icon,
		link = _props.link,
		title = _props.title,
		target = _props.target,
		active = _props.active,
		activeChildren = _props.activeChildren,
		onClickTitle = _props.onClickTitle,
		onMouseOver = _props.onMouseOver;

		var classes = function classes(themeClass) {
		return cx(themeClass, "hig__side-nav__module");
		};

		var linkClasses = function linkClasses(themeClass) {
		return cx(themeClass, "hig__side-nav__module__link", {
		"hig__side-nav__module__link--active": active,
		"hig__side-nav__module__link--active-children": activeChildren
		});
		};

		var submodulesClasses = cx("hig__side-nav__module__submodules", {
		"hig__side-nav__module__submodules--no-icon": !icon
		});

		var Wrapper = link ? "a" : "div";

		return React.createElement(
		ThemeContext.Consumer,
		null,
		function (_ref2) {
		var themeClass = _ref2.themeClass;
		return React.createElement(
		"div",
		{ className: classes(themeClass), onMouseOver: onMouseOver },
		React.createElement(
		"div",
		{ className: "hig__side-nav__module__row" },
		React.createElement(
		Wrapper,
		{
		className: linkClasses(themeClass),
		href: link,
		onClick: onClickTitle,
		target: target
		},
		React.createElement(
		"div",
		{ className: "hig__side-nav__module__link__icon" },
		icon
		),
		React.createElement(
		"div",
		{ className: "hig__side-nav__module__link__title" },
		title
		),
		React.createElement(
		"div",
		{ className: "hig__side-nav__module__link__external-link-icon" },
		_this2._renderExternalLinkIcon()
		)
		),
		_this2.props.children && React.createElement(CollapseButton, {
		minimized: _this2.props.minimized,
		onClick: _this2.props.onClickCollapseButton
		})
		),
		!_this2.props.minimized && React.createElement(
		"div",
		{ className: submodulesClasses },
		children
		)
		);
		}
		);
		}
		}]);

		return Module;
		}(Component);

		Module.propTypes = {
		/** Indicates this module is currently active */
		active: PropTypes.bool,
		/** Indicates a nested submodule is currently active */
		activeChildren: PropTypes.bool,
		/** Zero or more SideNav submodules */
		children: PropTypes.node,
		/** An instance of @hig/icon */
		icon: PropTypes.node,
		/** URL to navigate to when clicking this module */
		link: PropTypes.string,
		/** Indicates whether to display nested submodules */
		minimized: PropTypes.bool,
		/** Called when clicking on the collapse button */
		onClickCollapseButton: PropTypes.func,
		/** Called when clicking on the title */
		onClickTitle: PropTypes.func,
		/** Called when hovering over the title */
		onMouseOver: PropTypes.func,
		/** A label for rendering this Module */
		title: PropTypes.string.isRequired,
		/** Anchor target. Applicable only if link is provided */
		target: PropTypes.oneOf(["_self", "_blank", "_parent", "_top"])
		};
		Module.defaultProps = {
		minimized: false,
		onClickCollapseButton: function onClickCollapseButton() {},
		onClickTitle: function onClickTitle() {},
		onMouseOver: function onMouseOver() {},
		target: "_self"
		};
		Module.__docgenInfo = {
		"description": "",
		"displayName": "Module",
		"props": {
		"active": {
		"type": {
		"name": "bool"
		},
		"required": false,
		"description": "Indicates this module is currently active"
		},
		"activeChildren": {
		"type": {
		"name": "bool"
		},
		"required": false,
		"description": "Indicates a nested submodule is currently active"
		},
		"children": {
		"type": {
		"name": "node"
		},
		"required": false,
		"description": "Zero or more SideNav submodules"
		},
		"icon": {
		"type": {
		"name": "node"
		},
		"required": false,
		"description": "An instance of @hig/icon"
		},
		"link": {
		"type": {
		"name": "string"
		},
		"required": false,
		"description": "URL to navigate to when clicking this module"
		},
		"minimized": {
		"type": {
		"name": "bool"
		},
		"required": false,
		"description": "Indicates whether to display nested submodules",
		"defaultValue": {
		"value": "false",
		"computed": false
		}
		},
		"onClickCollapseButton": {
		"type": {
		"name": "func"
		},
		"required": false,
		"description": "Called when clicking on the collapse button",
		"defaultValue": {
		"value": "() => {}",
		"computed": false
		}
		},
		"onClickTitle": {
		"type": {
		"name": "func"
		},
		"required": false,
		"description": "Called when clicking on the title",
		"defaultValue": {
		"value": "() => {}",
		"computed": false
		}
		},
		"onMouseOver": {
		"type": {
		"name": "func"
		},
		"required": false,
		"description": "Called when hovering over the title",
		"defaultValue": {
		"value": "() => {}",
		"computed": false
		}
		},
		"title": {
		"type": {
		"name": "string"
		},
		"required": true,
		"description": "A label for rendering this Module"
		},
		"target": {
		"type": {
		"name": "enum",
		"value": [{
		"value": "\"_self\"",
		"computed": false
		}, {
		"value": "\"_blank\"",
		"computed": false
		}, {
		"value": "\"_parent\"",
		"computed": false
		}, {
		"value": "\"_top\"",
		"computed": false
		}]
		},
		"required": false,
		"description": "Anchor target. Applicable only if link is provided",
		"defaultValue": {
		"value": "\"_self\"",
		"computed": false
		}
		}
		}
		};

		var _extends = Object.assign \|\| function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };

		var _createClass = 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); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
		var _createClass$5 = 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); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();

		function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
		function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }

		function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" \|\| typeof call === "function") ? call : self; }
		function _classCallCheck$5(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }

		function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
		function _possibleConstructorReturn$5(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" \|\| typeof call === "function") ? call : self; }

		var skeletonItemStyles = [{
		function _inherits$5(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }

		var Module$1 = function (_Component) {
		_inherits$5(Module$$1, _Component);

		function Module$$1(props) {
		_classCallCheck$5(this, Module$$1);

		var _this = _possibleConstructorReturn$5(this, (Module$$1.__proto__ \|\| Object.getPrototypeOf(Module$$1)).call(this, props));

		_this.handleModuleMinimizeToggle = function (e) {
		return _this.setState({ minimized: !_this.state.minimized }, function () {
		return _this.props.onClickCollapseButton && _this.props.onClickCollapseButton(e);
		});
		};

		_this.renderPresenter = function (presenterBag) {
		var presenterProps = _extends({}, _this.props, presenterBag);

		var children = presenterProps.children,
		otherProps = _objectWithoutProperties(presenterProps, ["children"]);

		return React.createElement(
		Module,
		otherProps,
		children
		);
		};

		_this.state = {
		minimized: props.minimized
		};
		return _this;
		}

		_createClass$5(Module$$1, [{
		key: "createPresenterBag",


		/**
		* @returns {PresenterBag}
		*/
		value: function createPresenterBag() {
		var minimized = this.state.minimized;


		return {
		minimized: minimized,
		onClickCollapseButton: this.handleModuleMinimizeToggle,
		onClickTitle: this.handleModuleMinimizeToggle
		};
		}

		/**
		* @param {PresenterBag}
		*/

		}, {
		key: "render",
		value: function render() {
		var presenterBag = this.createPresenterBag();
		var renderPresenter = this.renderPresenter;


		return renderPresenter(presenterBag);
		}
		}]);

		return Module$$1;
		}(Component);

		Module$1.propTypes = {
		/** Indicates this module is currently active */
		active: PropTypes.bool,
		/** Indicates a nested submodule is currently active */
		activeChildren: PropTypes.bool,
		/** Zero or more SideNav submodules */
		children: PropTypes.node,
		/** An instance of @hig/icon */
		icon: PropTypes.node,
		/** URL to navigate to when clicking this module */
		link: PropTypes.string,
		/** Indicates whether to display nested submodules */
		minimized: PropTypes.bool,
		/** Called when clicking on the collapse button */
		onClickCollapseButton: PropTypes.func,
		/** Called when clicking on the title */
		onClickTitle: PropTypes.func,
		/** Called when hovering over the title */
		onMouseOver: PropTypes.func,
		/** A label for rendering this Module */
		title: PropTypes.string.isRequired,
		/** Anchor target. Applicable only if link is provided */
		target: PropTypes.oneOf(["_self", "_blank", "_parent", "_top"])
		};
		Module$1.defaultProps = {
		minimized: false
		};
		Module$1.__docgenInfo = {
		"description": "",
		"displayName": "Module",
		"props": {
		"active": {
		"type": {
		"name": "bool"
		},
		"required": false,
		"description": "Indicates this module is currently active"
		},
		"activeChildren": {
		"type": {
		"name": "bool"
		},
		"required": false,
		"description": "Indicates a nested submodule is currently active"
		},
		"children": {
		"type": {
		"name": "node"
		},
		"required": false,
		"description": "Zero or more SideNav submodules"
		},
		"icon": {
		"type": {
		"name": "node"
		},
		"required": false,
		"description": "An instance of @hig/icon"
		},
		"link": {
		"type": {
		"name": "string"
		},
		"required": false,
		"description": "URL to navigate to when clicking this module"
		},
		"minimized": {
		"type": {
		"name": "bool"
		},
		"required": false,
		"description": "Indicates whether to display nested submodules",
		"defaultValue": {
		"value": "false",
		"computed": false
		}
		},
		"onClickCollapseButton": {
		"type": {
		"name": "func"
		},
		"required": false,
		"description": "Called when clicking on the collapse button"
		},
		"onClickTitle": {
		"type": {
		"name": "func"
		},
		"required": false,
		"description": "Called when clicking on the title"
		},
		"onMouseOver": {
		"type": {
		"name": "func"
		},
		"required": false,
		"description": "Called when hovering over the title"
		},
		"title": {
		"type": {
		"name": "string"
		},
		"required": true,
		"description": "A label for rendering this Module"
		},
		"target": {
		"type": {
		"name": "enum",
		"value": [{
		"value": "\"_self\"",
		"computed": false
		}, {
		"value": "\"_blank\"",
		"computed": false
		}, {
		"value": "\"_parent\"",
		"computed": false
		}, {
		"value": "\"_top\"",
		"computed": false
		}]
		},
		"required": false,
		"description": "Anchor target. Applicable only if link is provided"
		}
		}
		};

		var _createClass$6 = 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); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();

		function _classCallCheck$6(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }

		function _possibleConstructorReturn$6(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" \|\| typeof call === "function") ? call : self; }

		function _inherits$6(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }

		var ModuleCompact = function (_Component) {
		_inherits$6(ModuleCompact, _Component);

		function ModuleCompact() {
		_classCallCheck$6(this, ModuleCompact);

		return _possibleConstructorReturn$6(this, (ModuleCompact.__proto__ \|\| Object.getPrototypeOf(ModuleCompact)).apply(this, arguments));
		}

		_createClass$6(ModuleCompact, [{
		key: "render",
		value: function render() {
		var _props = this.props,
		active = _props.active,
		activeChildren = _props.activeChildren,
		icon = _props.icon,
		onClickTitle = _props.onClickTitle,
		onMouseOver = _props.onMouseOver;

		var classes = function classes(themeClass) {
		return cx(themeClass, "hig__side-nav__module");
		};

		var linkClasses = function linkClasses(themeClass) {
		return cx(themeClass, "hig__side-nav__module__link", {
		"hig__side-nav__module__link--active": active,
		"hig__side-nav__module__link--active-children": activeChildren
		});
		};

		return React.createElement(
		ThemeContext.Consumer,
		null,
		function (_ref) {
		var themeClass = _ref.themeClass;
		return React.createElement(
		"div",
		{ className: classes(themeClass), onMouseOver: onMouseOver },
		React.createElement(
		"div",
		{ className: "hig__side-nav__module__row" },
		React.createElement(
		"div",
		{
		className: linkClasses(themeClass),
		onClick: onClickTitle,
		role: "button",
		tabIndex: 0
		},
		React.createElement(
		"div",
		{ className: "hig__side-nav__module__link__icon" },
		icon
		)
		)
		)
		);
		}
		);
		}
		}]);

		return ModuleCompact;
		}(Component);

		ModuleCompact.propTypes = {
		/** Indicates this module is currently active */
		active: PropTypes.bool,
		/** Indicates a nested submodule is currently active */
		activeChildren: PropTypes.bool,
		/** An instance of @hig/icon */
		icon: PropTypes.node.isRequired,
		/** Called when clicking on the title */
		onClickTitle: PropTypes.func,
		/** Called when hovering over the icon */
		onMouseOver: PropTypes.func
		};
		ModuleCompact.defaultProps = {
		onClickTitle: function onClickTitle() {},
		onMouseOver: function onMouseOver() {}
		};
		ModuleCompact.__docgenInfo = {
		"description": "",
		"displayName": "ModuleCompact",
		"props": {
		"active": {
		"type": {
		"name": "bool"
		},
		"required": false,
		"description": "Indicates this module is currently active"
		},
		"activeChildren": {
		"type": {
		"name": "bool"
		},
		"required": false,
		"description": "Indicates a nested submodule is currently active"
		},
		"icon": {
		"type": {
		"name": "node"
		},
		"required": true,
		"description": "An instance of @hig/icon"
		},
		"onClickTitle": {
		"type": {
		"name": "func"
		},
		"required": false,
		"description": "Called when clicking on the title",
		"defaultValue": {
		"value": "() => {}",
		"computed": false
		}
		},
		"onMouseOver": {
		"type": {
		"name": "func"
		},
		"required": false,
		"description": "Called when hovering over the icon",
		"defaultValue": {
		"value": "() => {}",
		"computed": false
		}
		}
		}
		};

		var _createClass$7 = 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); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();

		function _classCallCheck$7(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }

		function _possibleConstructorReturn$7(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" \|\| typeof call === "function") ? call : self; }

		function _inherits$7(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }

		var Submodule = function (_Component) {
		_inherits$7(Submodule, _Component);

		function Submodule() {
		var _ref;

		var _temp, _this, _ret;

		_classCallCheck$7(this, Submodule);

		for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
		args[_key] = arguments[_key];
		}

		return _ret = (_temp = (_this = _possibleConstructorReturn$7(this, (_ref = Submodule.__proto__ \|\| Object.getPrototypeOf(Submodule)).call.apply(_ref, [this].concat(args))), _this), _this._renderExternalLinkIcon = function () {
		return _this.props.target === "_blank" && React.createElement(ExternalLinkIcon, { size: sizes.PX_16 });
		}, _temp), _possibleConstructorReturn$7(_this, _ret);
		}

		_createClass$7(Submodule, [{
		key: "render",
		value: function render() {
		var _this2 = this;

		var _props = this.props,
		active = _props.active,
		title = _props.title,
		link = _props.link,
		onClick = _props.onClick,
		onMouseOver = _props.onMouseOver,
		target = _props.target;


		var classes = function classes(themeClass) {
		return cx(themeClass, "hig__side-nav__submodule", {
		"hig__side-nav__submodule--active": active
		});
		};

		var Wrapper = link ? "a" : "div";

		return React.createElement(
		ThemeContext.Consumer,
		null,
		function (_ref2) {
		var themeClass = _ref2.themeClass;
		return React.createElement(
		Wrapper,
		{
		className: classes(themeClass),
		href: link,
		target: target,
		onClick: onClick,
		onMouseOver: onMouseOver
		},
		title,
		_this2._renderExternalLinkIcon()
		);
		}
		);
		}
		}]);

		return Submodule;
		}(Component);

		Submodule.propTypes = {
		/** Indicates this submodule is currently active */
		active: PropTypes.bool,
		/** URL to navigate to when clicking this submodule */
		link: PropTypes.string,
		/** Called when clicking on the submodule */
		onClick: PropTypes.func,
		/** Called when hovering over the submodule */
		onMouseOver: PropTypes.func,
		/** Anchor target. Applicable only if link is provided */
		target: PropTypes.oneOf(["_self", "_blank", "_parent", "_top"]),
		/** Text to render */
		title: PropTypes.string
		};
		Submodule.__docgenInfo = {
		"description": "",
		"displayName": "Submodule",
		"props": {
		"active": {
		"type": {
		"name": "bool"
		},
		"required": false,
		"description": "Indicates this submodule is currently active"
		},
		"link": {
		"type": {
		"name": "string"
		},
		"required": false,
		"description": "URL to navigate to when clicking this submodule"
		},
		"onClick": {
		"type": {
		"name": "func"
		},
		"required": false,
		"description": "Called when clicking on the submodule"
		},
		"onMouseOver": {
		"type": {
		"name": "func"
		},
		"required": false,
		"description": "Called when hovering over the submodule"
		},
		"target": {
		"type": {
		"name": "enum",
		"value": [{
		"value": "\"_self\"",
		"computed": false
		}, {
		"value": "\"_blank\"",
		"computed": false
		}, {
		"value": "\"_parent\"",
		"computed": false
		}, {
		"value": "\"_top\"",
		"computed": false
		}]
		},
		"required": false,
		"description": "Anchor target. Applicable only if link is provided"
		},
		"title": {
		"type": {
		"name": "string"
		},
		"required": false,
		"description": "Text to render"
		}
		}
		};

		var _createClass$8 = 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); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();

		function _classCallCheck$8(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }

		function _possibleConstructorReturn$8(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" \|\| typeof call === "function") ? call : self; }

		function _inherits$8(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }

		var SideNav = function (_Component) {
		_inherits$8(SideNav, _Component);

		function SideNav() {
		var _ref;

		var _temp, _this, _ret;

		_classCallCheck$8(this, SideNav);

		for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
		args[_key] = arguments[_key];
		}

		return _ret = (_temp = (_this = _possibleConstructorReturn$8(this, (_ref = SideNav.__proto__ \|\| Object.getPrototypeOf(SideNav)).call.apply(_ref, [this].concat(args))), _this), _this._renderHeaders = function () {
		var _this$props = _this.props,
		headerLabel = _this$props.headerLabel,
		headerLink = _this$props.headerLink,
		superHeaderLabel = _this$props.superHeaderLabel,
		superHeaderLink = _this$props.superHeaderLink;


		if (!(superHeaderLabel \|\| headerLabel)) {
		return null;
		}

		var SuperHeaderWrapper = superHeaderLink ? "a" : "div";
		var HeaderWrapper = headerLink ? "a" : "div";

		return React.createElement(
		"div",
		{ className: "hig__side-nav__headers" },
		superHeaderLabel && React.createElement(
		"h3",
		{ className: "hig__side-nav__super-header" },
		React.createElement(
		SuperHeaderWrapper,
		{
		className: "hig__side-nav__super-header-link",
		href: superHeaderLink
		},
		superHeaderLabel
		)
		),
		headerLabel && React.createElement(
		"h4",
		{ className: "hig__side-nav__header" },
		React.createElement(
		HeaderWrapper,
		{
		className: "hig__side-nav__header-link",
		href: headerLink
		},
		headerLabel
		)
		)
		);
		}, _temp), _possibleConstructorReturn$8(_this, _ret);
		}

		_createClass$8(SideNav, [{
		key: "render",
		value: function render() {
		var _this2 = this;

		var _props = this.props,
		children = _props.children,
		copyright = _props.copyright,
		groups = _props.groups,
		links = _props.links,
		onMinimize = _props.onMinimize,
		showMinimizeButton = _props.showMinimizeButton;


		var classes = function classes(themeClass) {
		return cx(themeClass, "hig__side-nav");
		};

		return React.createElement(
		ThemeContext.Consumer,
		null,
		function (_ref2) {
		var themeClass = _ref2.themeClass;
		return React.createElement(
		"nav",
		{ className: classes(themeClass) },
		React.createElement(
		"div",
		{ className: "hig__side-nav__overflow" },
		_this2._renderHeaders(),
		groups && React.createElement(
		"div",
		{ className: "hig__side-nav__groups" },
		groups
		),
		children && React.createElement(
		"div",
		{ className: "hig__side-nav__slot" },
		children
		),
		links && React.createElement(
		"div",
		{ className: "hig__side-nav__links" },
		links
		),
		copyright && React.createElement(
		"div",
		{ className: "hig__side-nav__copyright" },
		copyright
		)
		),
		showMinimizeButton && React.createElement(
		"div",
		{ className: "hig__side-nav__minimize" },
		React.createElement(IconButton, {
		type: types.TRANSPARENT,
		name: names.BACK,
		title: "Minimize",
		"aria-label": "Minimize",
		onClick: onMinimize
		})
		)
		);
		}
		);
		}
		}]);

		return SideNav;
		}(Component);

		SideNav.propTypes = {
		/** Additional content to include below navigation items */
		children: PropTypes.node,
		/** Copyright text to include */
		copyright: PropTypes.string,
		/** 0 or more SideNav Groups */
		groups: PropTypes.node,
		/** Subtitle at the top of the SideNav */
		headerLabel: PropTypes.string,
		/** An href for the SideNav Subtitle */
		headerLink: PropTypes.string,
		/** 0 or more SideNav Links */
		links: PropTypes.node,
		/** Called when minimize button is clicked */
		onMinimize: PropTypes.func,
		/** Renders a button to minimize the SideNav */
		showMinimizeButton: PropTypes.bool,
		/** Title at the top of the SideNav */
		superHeaderLabel: PropTypes.string,
		/** An href for the SideNav Title */
		superHeaderLink: PropTypes.string
		};
		SideNav.defaultProps = {
		onMinimize: function onMinimize() {},
		showMinimizeButton: false
		};
		SideNav.__docgenInfo = {
		"description": "",
		"displayName": "SideNav",
		"props": {
		"children": {
		"type": {
		"name": "node"
		},
		"required": false,
		"description": "Additional content to include below navigation items"
		},
		"copyright": {
		"type": {
		"name": "string"
		},
		"required": false,
		"description": "Copyright text to include"
		},
		"groups": {
		"type": {
		"name": "node"
		},
		"required": false,
		"description": "0 or more SideNav Groups"
		},
		"headerLabel": {
		"type": {
		"name": "string"
		},
		"required": false,
		"description": "Subtitle at the top of the SideNav"
		},
		"headerLink": {
		"type": {
		"name": "string"
		},
		"required": false,
		"description": "An href for the SideNav Subtitle"
		},
		"links": {
		"type": {
		"name": "node"
		},
		"required": false,
		"description": "0 or more SideNav Links"
		},
		"onMinimize": {
		"type": {
		"name": "func"
		},
		"required": false,
		"description": "Called when minimize button is clicked",
		"defaultValue": {
		"value": "() => {}",
		"computed": false
		}
		},
		"showMinimizeButton": {
		"type": {
		"name": "bool"
		},
		"required": false,
		"description": "Renders a button to minimize the SideNav",
		"defaultValue": {
		"value": "false",
		"computed": false
		}
		},
		"superHeaderLabel": {
		"type": {
		"name": "string"
		},
		"required": false,
		"description": "Title at the top of the SideNav"
		},
		"superHeaderLink": {
		"type": {
		"name": "string"
		},
		"required": false,
		"description": "An href for the SideNav Title"
		}
		}
		};

		var _extends$1 = Object.assign \|\| function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };

		var _createClass$9 = 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); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();

		function _classCallCheck$9(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }

		function _possibleConstructorReturn$9(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" \|\| typeof call === "function") ? call : self; }

		function _inherits$9(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }

		var skeletonItemStyles = Object.freeze([{
		maxWidth: "180px",
		@@ -97,14 +1419,14 @@ marginBottom: "48px"
		maxWidth: "124px"
		}];
		}]);

		var SideNavSkeleton = function (_Component) {
		_inherits(SideNavSkeleton, _Component);
		_inherits$9(SideNavSkeleton, _Component);

		function SideNavSkeleton() {
		_classCallCheck(this, SideNavSkeleton);
		_classCallCheck$9(this, SideNavSkeleton);

		return _possibleConstructorReturn(this, (SideNavSkeleton.__proto__ \|\| Object.getPrototypeOf(SideNavSkeleton)).apply(this, arguments));
		return _possibleConstructorReturn$9(this, (SideNavSkeleton.__proto__ \|\| Object.getPrototypeOf(SideNavSkeleton)).apply(this, arguments));
		}

		_createClass(SideNavSkeleton, [{
		_createClass$9(SideNavSkeleton, [{
		key: "render",
		@@ -119,5 +1441,8 @@ value: function render() {
		"div",
		{ className: classnames("hig__side-nav-skeleton", themeClass) },
		{ className: cx("hig__side-nav-skeleton", themeClass) },
		skeletonItemStyles.map(function (style, index) {
		return React.createElement(SkeletonItem, _extends({ key: index }, style));
		return (
		// eslint-disable-next-line react/no-array-index-key
		React.createElement(SkeletonItem, _extends$1({ key: index }, style))
		);
		})
		@@ -137,2 +1462,286 @@ );

		export { SideNavSkeleton };
		var _createClass$10 = 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); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();

		function _classCallCheck$10(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }

		function _possibleConstructorReturn$10(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" \|\| typeof call === "function") ? call : self; }

		function _inherits$10(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }

		var Docked = function (_Component) {
		_inherits$10(Docked, _Component);

		function Docked() {
		_classCallCheck$10(this, Docked);

		return _possibleConstructorReturn$10(this, (Docked.__proto__ \|\| Object.getPrototypeOf(Docked)).apply(this, arguments));
		}

		_createClass$10(Docked, [{
		key: "render",
		value: function render() {
		var _props = this.props,
		children = _props.children,
		onMouseLeave = _props.onMouseLeave,
		onMouseEnter = _props.onMouseEnter;


		var classes = function classes(themeClass) {
		return cx(themeClass, "hig__side-nav-container--docked");
		};

		return React.createElement(
		ThemeContext.Consumer,
		null,
		function (_ref) {
		var themeClass = _ref.themeClass;
		return React.createElement(
		"div",
		{
		className: classes(themeClass),
		onMouseEnter: onMouseEnter,
		onMouseLeave: onMouseLeave
		},
		children
		);
		}
		);
		}
		}]);

		return Docked;
		}(Component);

		Docked.propTypes = {
		/** A SideNav element */
		children: PropTypes.node,
		/** Called when beginning to hover over the container */
		onMouseEnter: PropTypes.func,
		/** Called when no longer hovering over the container */
		onMouseLeave: PropTypes.func
		};
		Docked.defaultProps = {
		onMouseLeave: function onMouseLeave() {},
		onMouseEnter: function onMouseEnter() {}
		};
		Docked.__docgenInfo = {
		"description": "",
		"displayName": "Docked",
		"props": {
		"children": {
		"type": {
		"name": "node"
		},
		"required": false,
		"description": "A SideNav element"
		},
		"onMouseEnter": {
		"type": {
		"name": "func"
		},
		"required": false,
		"description": "Called when beginning to hover over the container",
		"defaultValue": {
		"value": "() => {}",
		"computed": false
		}
		},
		"onMouseLeave": {
		"type": {
		"name": "func"
		},
		"required": false,
		"description": "Called when no longer hovering over the container",
		"defaultValue": {
		"value": "() => {}",
		"computed": false
		}
		}
		}
		};

		var _createClass$11 = 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); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();

		function _classCallCheck$11(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }

		function _possibleConstructorReturn$11(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" \|\| typeof call === "function") ? call : self; }

		function _inherits$11(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }

		var BelowTopNav = function (_Component) {
		_inherits$11(BelowTopNav, _Component);

		function BelowTopNav() {
		_classCallCheck$11(this, BelowTopNav);

		return _possibleConstructorReturn$11(this, (BelowTopNav.__proto__ \|\| Object.getPrototypeOf(BelowTopNav)).apply(this, arguments));
		}

		_createClass$11(BelowTopNav, [{
		key: "render",
		value: function render() {
		var _props = this.props,
		children = _props.children,
		onMouseLeave = _props.onMouseLeave,
		onMouseEnter = _props.onMouseEnter;


		var classes = function classes(themeClass) {
		return cx(themeClass, "hig__side-nav-container--below-top-nav");
		};

		return React.createElement(
		ThemeContext.Consumer,
		null,
		function (_ref) {
		var themeClass = _ref.themeClass;
		return React.createElement(
		"div",
		{
		className: classes(themeClass),
		onMouseEnter: onMouseEnter,
		onMouseLeave: onMouseLeave
		},
		children
		);
		}
		);
		}
		}]);

		return BelowTopNav;
		}(Component);

		BelowTopNav.propTypes = {
		/** A SideNav element */
		children: PropTypes.node,
		/** Called when beginning to hover over the container */
		onMouseEnter: PropTypes.func,
		/** Called when no longer hovering over the container */
		onMouseLeave: PropTypes.func
		};
		BelowTopNav.__docgenInfo = {
		"description": "",
		"displayName": "BelowTopNav",
		"props": {
		"children": {
		"type": {
		"name": "node"
		},
		"required": false,
		"description": "A SideNav element"
		},
		"onMouseEnter": {
		"type": {
		"name": "func"
		},
		"required": false,
		"description": "Called when beginning to hover over the container"
		},
		"onMouseLeave": {
		"type": {
		"name": "func"
		},
		"required": false,
		"description": "Called when no longer hovering over the container"
		}
		}
		};

		var _createClass$12 = 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); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();

		function _classCallCheck$12(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }

		function _possibleConstructorReturn$12(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" \|\| typeof call === "function") ? call : self; }

		function _inherits$12(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }

		var BelowTopNavCompact = function (_Component) {
		_inherits$12(BelowTopNavCompact, _Component);

		function BelowTopNavCompact() {
		_classCallCheck$12(this, BelowTopNavCompact);

		return _possibleConstructorReturn$12(this, (BelowTopNavCompact.__proto__ \|\| Object.getPrototypeOf(BelowTopNavCompact)).apply(this, arguments));
		}

		_createClass$12(BelowTopNavCompact, [{
		key: "render",
		value: function render() {
		var _props = this.props,
		children = _props.children,
		onMouseLeave = _props.onMouseLeave,
		onMouseEnter = _props.onMouseEnter;


		var classes = function classes(themeClass) {
		return cx(themeClass, "hig__side-nav-container--below-top-nav-compact");
		};

		return React.createElement(
		ThemeContext.Consumer,
		null,
		function (_ref) {
		var themeClass = _ref.themeClass;
		return React.createElement(
		"div",
		{
		className: classes(themeClass),
		onMouseEnter: onMouseEnter,
		onMouseLeave: onMouseLeave
		},
		children
		);
		}
		);
		}
		}]);

		return BelowTopNavCompact;
		}(Component);

		BelowTopNavCompact.propTypes = {
		/** A SideNav element */
		children: PropTypes.node,
		/** Called when beginning to hover over the container */
		onMouseEnter: PropTypes.func,
		/** Called when no longer hovering over the container */
		onMouseLeave: PropTypes.func
		};
		BelowTopNavCompact.__docgenInfo = {
		"description": "",
		"displayName": "BelowTopNavCompact",
		"props": {
		"children": {
		"type": {
		"name": "node"
		},
		"required": false,
		"description": "A SideNav element"
		},
		"onMouseEnter": {
		"type": {
		"name": "func"
		},
		"required": false,
		"description": "Called when beginning to hover over the container"
		},
		"onMouseLeave": {
		"type": {
		"name": "func"
		},
		"required": false,
		"description": "Called when no longer hovering over the container"
		}
		}
		};

		SideNav.CollapseButton = CollapseButton;
		SideNav.Group = Group;
		SideNav.Link = Link;
		SideNav.Module = Module$1;
		SideNav.ModuleCompact = ModuleCompact;
		SideNav.Submodule = Submodule;

		export default SideNav;
		export { SideNavSkeleton, Docked, BelowTopNav, BelowTopNavCompact };

1730

build/index.js

		@@ -9,72 +9,1396 @@ 'use strict';
		var React__default = _interopDefault(React);
		var PropTypes = _interopDefault(require('prop-types'));
		var cx = _interopDefault(require('classnames'));
		var Icon = require('@hig/icon');
		var Icon__default = _interopDefault(Icon);
		var themes = require('@hig/themes');
		var IconButton = require('@hig/icon-button');
		var IconButton__default = _interopDefault(IconButton);
		var SkeletonItem = _interopDefault(require('@hig/skeleton-item'));
		var themes = require('@hig/themes');

		function createCommonjsModule(fn, module) {
		return module = { exports: {} }, fn(module, module.exports), module.exports;
		}
		var _createClass = 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); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();

		var classnames = createCommonjsModule(function (module) {
		var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; };
		function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }

		/*!
		Copyright (c) 2016 Jed Watson.
		Licensed under the MIT License (MIT), see
		http://jedwatson.github.io/classnames
		*/
		/* global define */
		function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" \|\| typeof call === "function") ? call : self; }

		(function () {
		function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }

		var hasOwn = {}.hasOwnProperty;
		/** @todo Consider replacing with an IconButton */

		function classNames() {
		var classes = [];
		var CollapseButton = function (_Component) {
		_inherits(CollapseButton, _Component);

		for (var i = 0; i < arguments.length; i++) {
		var arg = arguments[i];
		if (!arg) continue;
		function CollapseButton() {
		_classCallCheck(this, CollapseButton);

		var argType = typeof arg === 'undefined' ? 'undefined' : _typeof(arg);
		return _possibleConstructorReturn(this, (CollapseButton.__proto__ \|\| Object.getPrototypeOf(CollapseButton)).apply(this, arguments));
		}

		if (argType === 'string' \|\| argType === 'number') {
		classes.push(arg);
		} else if (Array.isArray(arg)) {
		classes.push(classNames.apply(null, arg));
		} else if (argType === 'object') {
		for (var key in arg) {
		if (hasOwn.call(arg, key) && arg[key]) {
		classes.push(key);
		}
		}
		}
		}
		_createClass(CollapseButton, [{
		key: "render",
		value: function render() {
		var _props = this.props,
		minimized = _props.minimized,
		onClick = _props.onClick;

		return classes.join(' ');
		}
		var classes = function classes(themeClass) {
		return cx(themeClass, "hig__side-nav__module__collapse-button", {
		"hig__side-nav__module__collapse-button--collapsed": minimized
		});
		};

		if ('object' !== 'undefined' && module.exports) {
		module.exports = classNames;
		} else if (typeof undefined === 'function' && _typeof(undefined.amd) === 'object' && undefined.amd) {
		// register as 'classnames', consistent with npm package name
		undefined('classnames', [], function () {
		return classNames;
		});
		} else {
		window.classNames = classNames;
		}
		})();
		});
		return React__default.createElement(
		themes.ThemeContext.Consumer,
		null,
		function (_ref) {
		var themeClass = _ref.themeClass;
		return (
		/** @todo replace with a semantic HTML tag */
		React__default.createElement(
		"div",
		{
		className: classes(themeClass),
		onClick: onClick,
		role: "button",
		tabIndex: 0
		},
		React__default.createElement(Icon__default, { name: Icon.names.CARET, size: Icon.sizes.PX_24 })
		)
		);
		}
		);
		}
		}]);

		return CollapseButton;
		}(React.Component);

		CollapseButton.propTypes = {
		/** Presents the icon in a minimized state: caret pointing right */
		minimized: PropTypes.bool,
		/** Called when element is clicked */
		onClick: PropTypes.func
		};
		CollapseButton.defaultProps = {
		onClick: function onClick() {},
		minimized: false
		};
		CollapseButton.__docgenInfo = {
		"description": "@todo Consider replacing with an IconButton",
		"displayName": "CollapseButton",
		"props": {
		"minimized": {
		"type": {
		"name": "bool"
		},
		"required": false,
		"description": "Presents the icon in a minimized state: caret pointing right",
		"defaultValue": {
		"value": "false",
		"computed": false
		}
		},
		"onClick": {
		"type": {
		"name": "func"
		},
		"required": false,
		"description": "Called when element is clicked",
		"defaultValue": {
		"value": "() => {}",
		"computed": false
		}
		}
		}
		};

		var _createClass$1 = 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); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();

		function _classCallCheck$1(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }

		function _possibleConstructorReturn$1(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" \|\| typeof call === "function") ? call : self; }

		function _inherits$1(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }

		var Group = function (_Component) {
		_inherits$1(Group, _Component);

		function Group() {
		_classCallCheck$1(this, Group);

		return _possibleConstructorReturn$1(this, (Group.__proto__ \|\| Object.getPrototypeOf(Group)).apply(this, arguments));
		}

		_createClass$1(Group, [{
		key: "render",
		value: function render() {
		var _this2 = this;

		var classes = function classes(themeClass) {
		return cx(themeClass, "hig__side-nav__group");
		};

		return React__default.createElement(
		themes.ThemeContext.Consumer,
		null,
		function (_ref) {
		var themeClass = _ref.themeClass;
		return React__default.createElement(
		"section",
		{ className: classes(themeClass) },
		_this2.props.children
		);
		}
		);
		}
		}]);

		return Group;
		}(React.Component);

		Group.propTypes = {
		/** One or more SideNav Modules */
		children: PropTypes.node
		};
		Group.__docgenInfo = {
		"description": "",
		"displayName": "Group",
		"props": {
		"children": {
		"type": {
		"name": "node"
		},
		"required": false,
		"description": "One or more SideNav Modules"
		}
		}
		};

		var _createClass$2 = 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); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();

		function _classCallCheck$2(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }

		function _possibleConstructorReturn$2(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" \|\| typeof call === "function") ? call : self; }

		function _inherits$2(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }

		var ExternalLinkIcon = function (_Component) {
		_inherits$2(ExternalLinkIcon, _Component);

		function ExternalLinkIcon() {
		_classCallCheck$2(this, ExternalLinkIcon);

		return _possibleConstructorReturn$2(this, (ExternalLinkIcon.__proto__ \|\| Object.getPrototypeOf(ExternalLinkIcon)).apply(this, arguments));
		}

		_createClass$2(ExternalLinkIcon, [{
		key: "render",
		value: function render() {
		return React__default.createElement(Icon__default, { name: Icon.names.EXTERNAL_LINK, size: this.props.size });
		}
		}]);

		return ExternalLinkIcon;
		}(React.Component);

		ExternalLinkIcon.propTypes = {
		/** Size of the icon */
		size: PropTypes.oneOf(Object.values(Icon.sizes))
		};
		ExternalLinkIcon.defaultProps = {
		size: Icon.sizes.PX_24
		};
		ExternalLinkIcon.__docgenInfo = {
		"description": "",
		"displayName": "ExternalLinkIcon",
		"props": {
		"size": {
		"type": {
		"name": "enum",
		"computed": true,
		"value": "Object.values(iconSizes)"
		},
		"required": false,
		"description": "Size of the icon",
		"defaultValue": {
		"value": "iconSizes.PX_24",
		"computed": true
		}
		}
		}
		};

		var _createClass$3 = 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); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();

		function _classCallCheck$3(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }

		function _possibleConstructorReturn$3(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" \|\| typeof call === "function") ? call : self; }

		function _inherits$3(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }

		/** @todo Consider extending TextLink */

		var Link = function (_Component) {
		_inherits$3(Link, _Component);

		function Link() {
		var _ref;

		var _temp, _this, _ret;

		_classCallCheck$3(this, Link);

		for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
		args[_key] = arguments[_key];
		}

		return _ret = (_temp = (_this = _possibleConstructorReturn$3(this, (_ref = Link.__proto__ \|\| Object.getPrototypeOf(Link)).call.apply(_ref, [this].concat(args))), _this), _this._renderExternalLinkIcon = function () {
		return _this.props.target === "_blank" && React__default.createElement(ExternalLinkIcon, { size: Icon.sizes.PX_16 });
		}, _temp), _possibleConstructorReturn$3(_this, _ret);
		}

		_createClass$3(Link, [{
		key: "render",
		value: function render() {
		var _this2 = this;

		var _props = this.props,
		title = _props.title,
		link = _props.link,
		onClick = _props.onClick,
		onMouseOver = _props.onMouseOver,
		target = _props.target;

		var classes = function classes(themeClass) {
		return cx(themeClass, "hig__side-nav__link");
		};

		var Wrapper = link ? "a" : "div";

		return React__default.createElement(
		themes.ThemeContext.Consumer,
		null,
		function (_ref2) {
		var themeClass = _ref2.themeClass;
		return React__default.createElement(
		Wrapper,
		{
		className: classes(themeClass),
		href: link,
		target: target,
		onClick: onClick,
		onMouseOver: onMouseOver
		},
		title,
		_this2._renderExternalLinkIcon()
		);
		}
		);
		}
		}]);

		return Link;
		}(React.Component);

		Link.propTypes = {
		/** URL to navigate to when clicking this link */
		link: PropTypes.string,
		/** Called when link is clicked */
		onClick: PropTypes.func,
		/** Called when hovering over the link */
		onMouseOver: PropTypes.func,
		/** Corresponds to the anchor tag's target */
		target: PropTypes.oneOf(["_self", "_blank", "_parent", "_top"]),
		/** Link text */
		title: PropTypes.string
		};
		Link.defaultProps = {
		onClick: function onClick() {},
		onMouseOver: function onMouseOver() {}
		};
		Link.__docgenInfo = {
		"description": "@todo Consider extending TextLink",
		"displayName": "Link",
		"props": {
		"link": {
		"type": {
		"name": "string"
		},
		"required": false,
		"description": "URL to navigate to when clicking this link"
		},
		"onClick": {
		"type": {
		"name": "func"
		},
		"required": false,
		"description": "Called when link is clicked",
		"defaultValue": {
		"value": "() => {}",
		"computed": false
		}
		},
		"onMouseOver": {
		"type": {
		"name": "func"
		},
		"required": false,
		"description": "Called when hovering over the link",
		"defaultValue": {
		"value": "() => {}",
		"computed": false
		}
		},
		"target": {
		"type": {
		"name": "enum",
		"value": [{
		"value": "\"_self\"",
		"computed": false
		}, {
		"value": "\"_blank\"",
		"computed": false
		}, {
		"value": "\"_parent\"",
		"computed": false
		}, {
		"value": "\"_top\"",
		"computed": false
		}]
		},
		"required": false,
		"description": "Corresponds to the anchor tag's target"
		},
		"title": {
		"type": {
		"name": "string"
		},
		"required": false,
		"description": "Link text"
		}
		}
		};

		var _createClass$4 = 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); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();

		function _classCallCheck$4(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }

		function _possibleConstructorReturn$4(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" \|\| typeof call === "function") ? call : self; }

		function _inherits$4(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }

		var Module = function (_Component) {
		_inherits$4(Module, _Component);

		function Module() {
		var _ref;

		var _temp, _this, _ret;

		_classCallCheck$4(this, Module);

		for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
		args[_key] = arguments[_key];
		}

		return _ret = (_temp = (_this = _possibleConstructorReturn$4(this, (_ref = Module.__proto__ \|\| Object.getPrototypeOf(Module)).call.apply(_ref, [this].concat(args))), _this), _this._renderExternalLinkIcon = function () {
		return _this.props.target === "_blank" && React__default.createElement(ExternalLinkIcon, null);
		}, _temp), _possibleConstructorReturn$4(_this, _ret);
		}

		_createClass$4(Module, [{
		key: "render",
		value: function render() {
		var _this2 = this;

		var _props = this.props,
		children = _props.children,
		icon = _props.icon,
		link = _props.link,
		title = _props.title,
		target = _props.target,
		active = _props.active,
		activeChildren = _props.activeChildren,
		onClickTitle = _props.onClickTitle,
		onMouseOver = _props.onMouseOver;

		var classes = function classes(themeClass) {
		return cx(themeClass, "hig__side-nav__module");
		};

		var linkClasses = function linkClasses(themeClass) {
		return cx(themeClass, "hig__side-nav__module__link", {
		"hig__side-nav__module__link--active": active,
		"hig__side-nav__module__link--active-children": activeChildren
		});
		};

		var submodulesClasses = cx("hig__side-nav__module__submodules", {
		"hig__side-nav__module__submodules--no-icon": !icon
		});

		var Wrapper = link ? "a" : "div";

		return React__default.createElement(
		themes.ThemeContext.Consumer,
		null,
		function (_ref2) {
		var themeClass = _ref2.themeClass;
		return React__default.createElement(
		"div",
		{ className: classes(themeClass), onMouseOver: onMouseOver },
		React__default.createElement(
		"div",
		{ className: "hig__side-nav__module__row" },
		React__default.createElement(
		Wrapper,
		{
		className: linkClasses(themeClass),
		href: link,
		onClick: onClickTitle,
		target: target
		},
		React__default.createElement(
		"div",
		{ className: "hig__side-nav__module__link__icon" },
		icon
		),
		React__default.createElement(
		"div",
		{ className: "hig__side-nav__module__link__title" },
		title
		),
		React__default.createElement(
		"div",
		{ className: "hig__side-nav__module__link__external-link-icon" },
		_this2._renderExternalLinkIcon()
		)
		),
		_this2.props.children && React__default.createElement(CollapseButton, {
		minimized: _this2.props.minimized,
		onClick: _this2.props.onClickCollapseButton
		})
		),
		!_this2.props.minimized && React__default.createElement(
		"div",
		{ className: submodulesClasses },
		children
		)
		);
		}
		);
		}
		}]);

		return Module;
		}(React.Component);

		Module.propTypes = {
		/** Indicates this module is currently active */
		active: PropTypes.bool,
		/** Indicates a nested submodule is currently active */
		activeChildren: PropTypes.bool,
		/** Zero or more SideNav submodules */
		children: PropTypes.node,
		/** An instance of @hig/icon */
		icon: PropTypes.node,
		/** URL to navigate to when clicking this module */
		link: PropTypes.string,
		/** Indicates whether to display nested submodules */
		minimized: PropTypes.bool,
		/** Called when clicking on the collapse button */
		onClickCollapseButton: PropTypes.func,
		/** Called when clicking on the title */
		onClickTitle: PropTypes.func,
		/** Called when hovering over the title */
		onMouseOver: PropTypes.func,
		/** A label for rendering this Module */
		title: PropTypes.string.isRequired,
		/** Anchor target. Applicable only if link is provided */
		target: PropTypes.oneOf(["_self", "_blank", "_parent", "_top"])
		};
		Module.defaultProps = {
		minimized: false,
		onClickCollapseButton: function onClickCollapseButton() {},
		onClickTitle: function onClickTitle() {},
		onMouseOver: function onMouseOver() {},
		target: "_self"
		};
		Module.__docgenInfo = {
		"description": "",
		"displayName": "Module",
		"props": {
		"active": {
		"type": {
		"name": "bool"
		},
		"required": false,
		"description": "Indicates this module is currently active"
		},
		"activeChildren": {
		"type": {
		"name": "bool"
		},
		"required": false,
		"description": "Indicates a nested submodule is currently active"
		},
		"children": {
		"type": {
		"name": "node"
		},
		"required": false,
		"description": "Zero or more SideNav submodules"
		},
		"icon": {
		"type": {
		"name": "node"
		},
		"required": false,
		"description": "An instance of @hig/icon"
		},
		"link": {
		"type": {
		"name": "string"
		},
		"required": false,
		"description": "URL to navigate to when clicking this module"
		},
		"minimized": {
		"type": {
		"name": "bool"
		},
		"required": false,
		"description": "Indicates whether to display nested submodules",
		"defaultValue": {
		"value": "false",
		"computed": false
		}
		},
		"onClickCollapseButton": {
		"type": {
		"name": "func"
		},
		"required": false,
		"description": "Called when clicking on the collapse button",
		"defaultValue": {
		"value": "() => {}",
		"computed": false
		}
		},
		"onClickTitle": {
		"type": {
		"name": "func"
		},
		"required": false,
		"description": "Called when clicking on the title",
		"defaultValue": {
		"value": "() => {}",
		"computed": false
		}
		},
		"onMouseOver": {
		"type": {
		"name": "func"
		},
		"required": false,
		"description": "Called when hovering over the title",
		"defaultValue": {
		"value": "() => {}",
		"computed": false
		}
		},
		"title": {
		"type": {
		"name": "string"
		},
		"required": true,
		"description": "A label for rendering this Module"
		},
		"target": {
		"type": {
		"name": "enum",
		"value": [{
		"value": "\"_self\"",
		"computed": false
		}, {
		"value": "\"_blank\"",
		"computed": false
		}, {
		"value": "\"_parent\"",
		"computed": false
		}, {
		"value": "\"_top\"",
		"computed": false
		}]
		},
		"required": false,
		"description": "Anchor target. Applicable only if link is provided",
		"defaultValue": {
		"value": "\"_self\"",
		"computed": false
		}
		}
		}
		};

		var _extends = Object.assign \|\| function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };

		var _createClass = 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); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
		var _createClass$5 = 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); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();

		function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
		function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }

		function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" \|\| typeof call === "function") ? call : self; }
		function _classCallCheck$5(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }

		function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
		function _possibleConstructorReturn$5(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" \|\| typeof call === "function") ? call : self; }

		var skeletonItemStyles = [{
		function _inherits$5(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }

		var Module$1 = function (_Component) {
		_inherits$5(Module$$1, _Component);

		function Module$$1(props) {
		_classCallCheck$5(this, Module$$1);

		var _this = _possibleConstructorReturn$5(this, (Module$$1.__proto__ \|\| Object.getPrototypeOf(Module$$1)).call(this, props));

		_this.handleModuleMinimizeToggle = function (e) {
		return _this.setState({ minimized: !_this.state.minimized }, function () {
		return _this.props.onClickCollapseButton && _this.props.onClickCollapseButton(e);
		});
		};

		_this.renderPresenter = function (presenterBag) {
		var presenterProps = _extends({}, _this.props, presenterBag);

		var children = presenterProps.children,
		otherProps = _objectWithoutProperties(presenterProps, ["children"]);

		return React__default.createElement(
		Module,
		otherProps,
		children
		);
		};

		_this.state = {
		minimized: props.minimized
		};
		return _this;
		}

		_createClass$5(Module$$1, [{
		key: "createPresenterBag",


		/**
		* @returns {PresenterBag}
		*/
		value: function createPresenterBag() {
		var minimized = this.state.minimized;


		return {
		minimized: minimized,
		onClickCollapseButton: this.handleModuleMinimizeToggle,
		onClickTitle: this.handleModuleMinimizeToggle
		};
		}

		/**
		* @param {PresenterBag}
		*/

		}, {
		key: "render",
		value: function render() {
		var presenterBag = this.createPresenterBag();
		var renderPresenter = this.renderPresenter;


		return renderPresenter(presenterBag);
		}
		}]);

		return Module$$1;
		}(React.Component);

		Module$1.propTypes = {
		/** Indicates this module is currently active */
		active: PropTypes.bool,
		/** Indicates a nested submodule is currently active */
		activeChildren: PropTypes.bool,
		/** Zero or more SideNav submodules */
		children: PropTypes.node,
		/** An instance of @hig/icon */
		icon: PropTypes.node,
		/** URL to navigate to when clicking this module */
		link: PropTypes.string,
		/** Indicates whether to display nested submodules */
		minimized: PropTypes.bool,
		/** Called when clicking on the collapse button */
		onClickCollapseButton: PropTypes.func,
		/** Called when clicking on the title */
		onClickTitle: PropTypes.func,
		/** Called when hovering over the title */
		onMouseOver: PropTypes.func,
		/** A label for rendering this Module */
		title: PropTypes.string.isRequired,
		/** Anchor target. Applicable only if link is provided */
		target: PropTypes.oneOf(["_self", "_blank", "_parent", "_top"])
		};
		Module$1.defaultProps = {
		minimized: false
		};
		Module$1.__docgenInfo = {
		"description": "",
		"displayName": "Module",
		"props": {
		"active": {
		"type": {
		"name": "bool"
		},
		"required": false,
		"description": "Indicates this module is currently active"
		},
		"activeChildren": {
		"type": {
		"name": "bool"
		},
		"required": false,
		"description": "Indicates a nested submodule is currently active"
		},
		"children": {
		"type": {
		"name": "node"
		},
		"required": false,
		"description": "Zero or more SideNav submodules"
		},
		"icon": {
		"type": {
		"name": "node"
		},
		"required": false,
		"description": "An instance of @hig/icon"
		},
		"link": {
		"type": {
		"name": "string"
		},
		"required": false,
		"description": "URL to navigate to when clicking this module"
		},
		"minimized": {
		"type": {
		"name": "bool"
		},
		"required": false,
		"description": "Indicates whether to display nested submodules",
		"defaultValue": {
		"value": "false",
		"computed": false
		}
		},
		"onClickCollapseButton": {
		"type": {
		"name": "func"
		},
		"required": false,
		"description": "Called when clicking on the collapse button"
		},
		"onClickTitle": {
		"type": {
		"name": "func"
		},
		"required": false,
		"description": "Called when clicking on the title"
		},
		"onMouseOver": {
		"type": {
		"name": "func"
		},
		"required": false,
		"description": "Called when hovering over the title"
		},
		"title": {
		"type": {
		"name": "string"
		},
		"required": true,
		"description": "A label for rendering this Module"
		},
		"target": {
		"type": {
		"name": "enum",
		"value": [{
		"value": "\"_self\"",
		"computed": false
		}, {
		"value": "\"_blank\"",
		"computed": false
		}, {
		"value": "\"_parent\"",
		"computed": false
		}, {
		"value": "\"_top\"",
		"computed": false
		}]
		},
		"required": false,
		"description": "Anchor target. Applicable only if link is provided"
		}
		}
		};

		var _createClass$6 = 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); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();

		function _classCallCheck$6(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }

		function _possibleConstructorReturn$6(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" \|\| typeof call === "function") ? call : self; }

		function _inherits$6(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }

		var ModuleCompact = function (_Component) {
		_inherits$6(ModuleCompact, _Component);

		function ModuleCompact() {
		_classCallCheck$6(this, ModuleCompact);

		return _possibleConstructorReturn$6(this, (ModuleCompact.__proto__ \|\| Object.getPrototypeOf(ModuleCompact)).apply(this, arguments));
		}

		_createClass$6(ModuleCompact, [{
		key: "render",
		value: function render() {
		var _props = this.props,
		active = _props.active,
		activeChildren = _props.activeChildren,
		icon = _props.icon,
		onClickTitle = _props.onClickTitle,
		onMouseOver = _props.onMouseOver;

		var classes = function classes(themeClass) {
		return cx(themeClass, "hig__side-nav__module");
		};

		var linkClasses = function linkClasses(themeClass) {
		return cx(themeClass, "hig__side-nav__module__link", {
		"hig__side-nav__module__link--active": active,
		"hig__side-nav__module__link--active-children": activeChildren
		});
		};

		return React__default.createElement(
		themes.ThemeContext.Consumer,
		null,
		function (_ref) {
		var themeClass = _ref.themeClass;
		return React__default.createElement(
		"div",
		{ className: classes(themeClass), onMouseOver: onMouseOver },
		React__default.createElement(
		"div",
		{ className: "hig__side-nav__module__row" },
		React__default.createElement(
		"div",
		{
		className: linkClasses(themeClass),
		onClick: onClickTitle,
		role: "button",
		tabIndex: 0
		},
		React__default.createElement(
		"div",
		{ className: "hig__side-nav__module__link__icon" },
		icon
		)
		)
		)
		);
		}
		);
		}
		}]);

		return ModuleCompact;
		}(React.Component);

		ModuleCompact.propTypes = {
		/** Indicates this module is currently active */
		active: PropTypes.bool,
		/** Indicates a nested submodule is currently active */
		activeChildren: PropTypes.bool,
		/** An instance of @hig/icon */
		icon: PropTypes.node.isRequired,
		/** Called when clicking on the title */
		onClickTitle: PropTypes.func,
		/** Called when hovering over the icon */
		onMouseOver: PropTypes.func
		};
		ModuleCompact.defaultProps = {
		onClickTitle: function onClickTitle() {},
		onMouseOver: function onMouseOver() {}
		};
		ModuleCompact.__docgenInfo = {
		"description": "",
		"displayName": "ModuleCompact",
		"props": {
		"active": {
		"type": {
		"name": "bool"
		},
		"required": false,
		"description": "Indicates this module is currently active"
		},
		"activeChildren": {
		"type": {
		"name": "bool"
		},
		"required": false,
		"description": "Indicates a nested submodule is currently active"
		},
		"icon": {
		"type": {
		"name": "node"
		},
		"required": true,
		"description": "An instance of @hig/icon"
		},
		"onClickTitle": {
		"type": {
		"name": "func"
		},
		"required": false,
		"description": "Called when clicking on the title",
		"defaultValue": {
		"value": "() => {}",
		"computed": false
		}
		},
		"onMouseOver": {
		"type": {
		"name": "func"
		},
		"required": false,
		"description": "Called when hovering over the icon",
		"defaultValue": {
		"value": "() => {}",
		"computed": false
		}
		}
		}
		};

		var _createClass$7 = 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); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();

		function _classCallCheck$7(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }

		function _possibleConstructorReturn$7(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" \|\| typeof call === "function") ? call : self; }

		function _inherits$7(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }

		var Submodule = function (_Component) {
		_inherits$7(Submodule, _Component);

		function Submodule() {
		var _ref;

		var _temp, _this, _ret;

		_classCallCheck$7(this, Submodule);

		for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
		args[_key] = arguments[_key];
		}

		return _ret = (_temp = (_this = _possibleConstructorReturn$7(this, (_ref = Submodule.__proto__ \|\| Object.getPrototypeOf(Submodule)).call.apply(_ref, [this].concat(args))), _this), _this._renderExternalLinkIcon = function () {
		return _this.props.target === "_blank" && React__default.createElement(ExternalLinkIcon, { size: Icon.sizes.PX_16 });
		}, _temp), _possibleConstructorReturn$7(_this, _ret);
		}

		_createClass$7(Submodule, [{
		key: "render",
		value: function render() {
		var _this2 = this;

		var _props = this.props,
		active = _props.active,
		title = _props.title,
		link = _props.link,
		onClick = _props.onClick,
		onMouseOver = _props.onMouseOver,
		target = _props.target;


		var classes = function classes(themeClass) {
		return cx(themeClass, "hig__side-nav__submodule", {
		"hig__side-nav__submodule--active": active
		});
		};

		var Wrapper = link ? "a" : "div";

		return React__default.createElement(
		themes.ThemeContext.Consumer,
		null,
		function (_ref2) {
		var themeClass = _ref2.themeClass;
		return React__default.createElement(
		Wrapper,
		{
		className: classes(themeClass),
		href: link,
		target: target,
		onClick: onClick,
		onMouseOver: onMouseOver
		},
		title,
		_this2._renderExternalLinkIcon()
		);
		}
		);
		}
		}]);

		return Submodule;
		}(React.Component);

		Submodule.propTypes = {
		/** Indicates this submodule is currently active */
		active: PropTypes.bool,
		/** URL to navigate to when clicking this submodule */
		link: PropTypes.string,
		/** Called when clicking on the submodule */
		onClick: PropTypes.func,
		/** Called when hovering over the submodule */
		onMouseOver: PropTypes.func,
		/** Anchor target. Applicable only if link is provided */
		target: PropTypes.oneOf(["_self", "_blank", "_parent", "_top"]),
		/** Text to render */
		title: PropTypes.string
		};
		Submodule.__docgenInfo = {
		"description": "",
		"displayName": "Submodule",
		"props": {
		"active": {
		"type": {
		"name": "bool"
		},
		"required": false,
		"description": "Indicates this submodule is currently active"
		},
		"link": {
		"type": {
		"name": "string"
		},
		"required": false,
		"description": "URL to navigate to when clicking this submodule"
		},
		"onClick": {
		"type": {
		"name": "func"
		},
		"required": false,
		"description": "Called when clicking on the submodule"
		},
		"onMouseOver": {
		"type": {
		"name": "func"
		},
		"required": false,
		"description": "Called when hovering over the submodule"
		},
		"target": {
		"type": {
		"name": "enum",
		"value": [{
		"value": "\"_self\"",
		"computed": false
		}, {
		"value": "\"_blank\"",
		"computed": false
		}, {
		"value": "\"_parent\"",
		"computed": false
		}, {
		"value": "\"_top\"",
		"computed": false
		}]
		},
		"required": false,
		"description": "Anchor target. Applicable only if link is provided"
		},
		"title": {
		"type": {
		"name": "string"
		},
		"required": false,
		"description": "Text to render"
		}
		}
		};

		var _createClass$8 = 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); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();

		function _classCallCheck$8(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }

		function _possibleConstructorReturn$8(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" \|\| typeof call === "function") ? call : self; }

		function _inherits$8(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }

		var SideNav = function (_Component) {
		_inherits$8(SideNav, _Component);

		function SideNav() {
		var _ref;

		var _temp, _this, _ret;

		_classCallCheck$8(this, SideNav);

		for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
		args[_key] = arguments[_key];
		}

		return _ret = (_temp = (_this = _possibleConstructorReturn$8(this, (_ref = SideNav.__proto__ \|\| Object.getPrototypeOf(SideNav)).call.apply(_ref, [this].concat(args))), _this), _this._renderHeaders = function () {
		var _this$props = _this.props,
		headerLabel = _this$props.headerLabel,
		headerLink = _this$props.headerLink,
		superHeaderLabel = _this$props.superHeaderLabel,
		superHeaderLink = _this$props.superHeaderLink;


		if (!(superHeaderLabel \|\| headerLabel)) {
		return null;
		}

		var SuperHeaderWrapper = superHeaderLink ? "a" : "div";
		var HeaderWrapper = headerLink ? "a" : "div";

		return React__default.createElement(
		"div",
		{ className: "hig__side-nav__headers" },
		superHeaderLabel && React__default.createElement(
		"h3",
		{ className: "hig__side-nav__super-header" },
		React__default.createElement(
		SuperHeaderWrapper,
		{
		className: "hig__side-nav__super-header-link",
		href: superHeaderLink
		},
		superHeaderLabel
		)
		),
		headerLabel && React__default.createElement(
		"h4",
		{ className: "hig__side-nav__header" },
		React__default.createElement(
		HeaderWrapper,
		{
		className: "hig__side-nav__header-link",
		href: headerLink
		},
		headerLabel
		)
		)
		);
		}, _temp), _possibleConstructorReturn$8(_this, _ret);
		}

		_createClass$8(SideNav, [{
		key: "render",
		value: function render() {
		var _this2 = this;

		var _props = this.props,
		children = _props.children,
		copyright = _props.copyright,
		groups = _props.groups,
		links = _props.links,
		onMinimize = _props.onMinimize,
		showMinimizeButton = _props.showMinimizeButton;


		var classes = function classes(themeClass) {
		return cx(themeClass, "hig__side-nav");
		};

		return React__default.createElement(
		themes.ThemeContext.Consumer,
		null,
		function (_ref2) {
		var themeClass = _ref2.themeClass;
		return React__default.createElement(
		"nav",
		{ className: classes(themeClass) },
		React__default.createElement(
		"div",
		{ className: "hig__side-nav__overflow" },
		_this2._renderHeaders(),
		groups && React__default.createElement(
		"div",
		{ className: "hig__side-nav__groups" },
		groups
		),
		children && React__default.createElement(
		"div",
		{ className: "hig__side-nav__slot" },
		children
		),
		links && React__default.createElement(
		"div",
		{ className: "hig__side-nav__links" },
		links
		),
		copyright && React__default.createElement(
		"div",
		{ className: "hig__side-nav__copyright" },
		copyright
		)
		),
		showMinimizeButton && React__default.createElement(
		"div",
		{ className: "hig__side-nav__minimize" },
		React__default.createElement(IconButton__default, {
		type: IconButton.types.TRANSPARENT,
		name: Icon.names.BACK,
		title: "Minimize",
		"aria-label": "Minimize",
		onClick: onMinimize
		})
		)
		);
		}
		);
		}
		}]);

		return SideNav;
		}(React.Component);

		SideNav.propTypes = {
		/** Additional content to include below navigation items */
		children: PropTypes.node,
		/** Copyright text to include */
		copyright: PropTypes.string,
		/** 0 or more SideNav Groups */
		groups: PropTypes.node,
		/** Subtitle at the top of the SideNav */
		headerLabel: PropTypes.string,
		/** An href for the SideNav Subtitle */
		headerLink: PropTypes.string,
		/** 0 or more SideNav Links */
		links: PropTypes.node,
		/** Called when minimize button is clicked */
		onMinimize: PropTypes.func,
		/** Renders a button to minimize the SideNav */
		showMinimizeButton: PropTypes.bool,
		/** Title at the top of the SideNav */
		superHeaderLabel: PropTypes.string,
		/** An href for the SideNav Title */
		superHeaderLink: PropTypes.string
		};
		SideNav.defaultProps = {
		onMinimize: function onMinimize() {},
		showMinimizeButton: false
		};
		SideNav.__docgenInfo = {
		"description": "",
		"displayName": "SideNav",
		"props": {
		"children": {
		"type": {
		"name": "node"
		},
		"required": false,
		"description": "Additional content to include below navigation items"
		},
		"copyright": {
		"type": {
		"name": "string"
		},
		"required": false,
		"description": "Copyright text to include"
		},
		"groups": {
		"type": {
		"name": "node"
		},
		"required": false,
		"description": "0 or more SideNav Groups"
		},
		"headerLabel": {
		"type": {
		"name": "string"
		},
		"required": false,
		"description": "Subtitle at the top of the SideNav"
		},
		"headerLink": {
		"type": {
		"name": "string"
		},
		"required": false,
		"description": "An href for the SideNav Subtitle"
		},
		"links": {
		"type": {
		"name": "node"
		},
		"required": false,
		"description": "0 or more SideNav Links"
		},
		"onMinimize": {
		"type": {
		"name": "func"
		},
		"required": false,
		"description": "Called when minimize button is clicked",
		"defaultValue": {
		"value": "() => {}",
		"computed": false
		}
		},
		"showMinimizeButton": {
		"type": {
		"name": "bool"
		},
		"required": false,
		"description": "Renders a button to minimize the SideNav",
		"defaultValue": {
		"value": "false",
		"computed": false
		}
		},
		"superHeaderLabel": {
		"type": {
		"name": "string"
		},
		"required": false,
		"description": "Title at the top of the SideNav"
		},
		"superHeaderLink": {
		"type": {
		"name": "string"
		},
		"required": false,
		"description": "An href for the SideNav Title"
		}
		}
		};

		var _extends$1 = Object.assign \|\| function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };

		var _createClass$9 = 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); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();

		function _classCallCheck$9(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }

		function _possibleConstructorReturn$9(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" \|\| typeof call === "function") ? call : self; }

		function _inherits$9(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }

		var skeletonItemStyles = Object.freeze([{
		maxWidth: "180px",
		@@ -105,14 +1429,14 @@ marginBottom: "48px"
		maxWidth: "124px"
		}];
		}]);

		var SideNavSkeleton = function (_Component) {
		_inherits(SideNavSkeleton, _Component);
		_inherits$9(SideNavSkeleton, _Component);

		function SideNavSkeleton() {
		_classCallCheck(this, SideNavSkeleton);
		_classCallCheck$9(this, SideNavSkeleton);

		return _possibleConstructorReturn(this, (SideNavSkeleton.__proto__ \|\| Object.getPrototypeOf(SideNavSkeleton)).apply(this, arguments));
		return _possibleConstructorReturn$9(this, (SideNavSkeleton.__proto__ \|\| Object.getPrototypeOf(SideNavSkeleton)).apply(this, arguments));
		}

		_createClass(SideNavSkeleton, [{
		_createClass$9(SideNavSkeleton, [{
		key: "render",
		@@ -127,5 +1451,8 @@ value: function render() {
		"div",
		{ className: classnames("hig__side-nav-skeleton", themeClass) },
		{ className: cx("hig__side-nav-skeleton", themeClass) },
		skeletonItemStyles.map(function (style, index) {
		return React__default.createElement(SkeletonItem, _extends({ key: index }, style));
		return (
		// eslint-disable-next-line react/no-array-index-key
		React__default.createElement(SkeletonItem, _extends$1({ key: index }, style))
		);
		})
		@@ -145,2 +1472,289 @@ );

		var _createClass$10 = 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); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();

		function _classCallCheck$10(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }

		function _possibleConstructorReturn$10(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" \|\| typeof call === "function") ? call : self; }

		function _inherits$10(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }

		var Docked = function (_Component) {
		_inherits$10(Docked, _Component);

		function Docked() {
		_classCallCheck$10(this, Docked);

		return _possibleConstructorReturn$10(this, (Docked.__proto__ \|\| Object.getPrototypeOf(Docked)).apply(this, arguments));
		}

		_createClass$10(Docked, [{
		key: "render",
		value: function render() {
		var _props = this.props,
		children = _props.children,
		onMouseLeave = _props.onMouseLeave,
		onMouseEnter = _props.onMouseEnter;


		var classes = function classes(themeClass) {
		return cx(themeClass, "hig__side-nav-container--docked");
		};

		return React__default.createElement(
		themes.ThemeContext.Consumer,
		null,
		function (_ref) {
		var themeClass = _ref.themeClass;
		return React__default.createElement(
		"div",
		{
		className: classes(themeClass),
		onMouseEnter: onMouseEnter,
		onMouseLeave: onMouseLeave
		},
		children
		);
		}
		);
		}
		}]);

		return Docked;
		}(React.Component);

		Docked.propTypes = {
		/** A SideNav element */
		children: PropTypes.node,
		/** Called when beginning to hover over the container */
		onMouseEnter: PropTypes.func,
		/** Called when no longer hovering over the container */
		onMouseLeave: PropTypes.func
		};
		Docked.defaultProps = {
		onMouseLeave: function onMouseLeave() {},
		onMouseEnter: function onMouseEnter() {}
		};
		Docked.__docgenInfo = {
		"description": "",
		"displayName": "Docked",
		"props": {
		"children": {
		"type": {
		"name": "node"
		},
		"required": false,
		"description": "A SideNav element"
		},
		"onMouseEnter": {
		"type": {
		"name": "func"
		},
		"required": false,
		"description": "Called when beginning to hover over the container",
		"defaultValue": {
		"value": "() => {}",
		"computed": false
		}
		},
		"onMouseLeave": {
		"type": {
		"name": "func"
		},
		"required": false,
		"description": "Called when no longer hovering over the container",
		"defaultValue": {
		"value": "() => {}",
		"computed": false
		}
		}
		}
		};

		var _createClass$11 = 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); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();

		function _classCallCheck$11(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }

		function _possibleConstructorReturn$11(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" \|\| typeof call === "function") ? call : self; }

		function _inherits$11(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }

		var BelowTopNav = function (_Component) {
		_inherits$11(BelowTopNav, _Component);

		function BelowTopNav() {
		_classCallCheck$11(this, BelowTopNav);

		return _possibleConstructorReturn$11(this, (BelowTopNav.__proto__ \|\| Object.getPrototypeOf(BelowTopNav)).apply(this, arguments));
		}

		_createClass$11(BelowTopNav, [{
		key: "render",
		value: function render() {
		var _props = this.props,
		children = _props.children,
		onMouseLeave = _props.onMouseLeave,
		onMouseEnter = _props.onMouseEnter;


		var classes = function classes(themeClass) {
		return cx(themeClass, "hig__side-nav-container--below-top-nav");
		};

		return React__default.createElement(
		themes.ThemeContext.Consumer,
		null,
		function (_ref) {
		var themeClass = _ref.themeClass;
		return React__default.createElement(
		"div",
		{
		className: classes(themeClass),
		onMouseEnter: onMouseEnter,
		onMouseLeave: onMouseLeave
		},
		children
		);
		}
		);
		}
		}]);

		return BelowTopNav;
		}(React.Component);

		BelowTopNav.propTypes = {
		/** A SideNav element */
		children: PropTypes.node,
		/** Called when beginning to hover over the container */
		onMouseEnter: PropTypes.func,
		/** Called when no longer hovering over the container */
		onMouseLeave: PropTypes.func
		};
		BelowTopNav.__docgenInfo = {
		"description": "",
		"displayName": "BelowTopNav",
		"props": {
		"children": {
		"type": {
		"name": "node"
		},
		"required": false,
		"description": "A SideNav element"
		},
		"onMouseEnter": {
		"type": {
		"name": "func"
		},
		"required": false,
		"description": "Called when beginning to hover over the container"
		},
		"onMouseLeave": {
		"type": {
		"name": "func"
		},
		"required": false,
		"description": "Called when no longer hovering over the container"
		}
		}
		};

		var _createClass$12 = 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); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();

		function _classCallCheck$12(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }

		function _possibleConstructorReturn$12(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" \|\| typeof call === "function") ? call : self; }

		function _inherits$12(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }

		var BelowTopNavCompact = function (_Component) {
		_inherits$12(BelowTopNavCompact, _Component);

		function BelowTopNavCompact() {
		_classCallCheck$12(this, BelowTopNavCompact);

		return _possibleConstructorReturn$12(this, (BelowTopNavCompact.__proto__ \|\| Object.getPrototypeOf(BelowTopNavCompact)).apply(this, arguments));
		}

		_createClass$12(BelowTopNavCompact, [{
		key: "render",
		value: function render() {
		var _props = this.props,
		children = _props.children,
		onMouseLeave = _props.onMouseLeave,
		onMouseEnter = _props.onMouseEnter;


		var classes = function classes(themeClass) {
		return cx(themeClass, "hig__side-nav-container--below-top-nav-compact");
		};

		return React__default.createElement(
		themes.ThemeContext.Consumer,
		null,
		function (_ref) {
		var themeClass = _ref.themeClass;
		return React__default.createElement(
		"div",
		{
		className: classes(themeClass),
		onMouseEnter: onMouseEnter,
		onMouseLeave: onMouseLeave
		},
		children
		);
		}
		);
		}
		}]);

		return BelowTopNavCompact;
		}(React.Component);

		BelowTopNavCompact.propTypes = {
		/** A SideNav element */
		children: PropTypes.node,
		/** Called when beginning to hover over the container */
		onMouseEnter: PropTypes.func,
		/** Called when no longer hovering over the container */
		onMouseLeave: PropTypes.func
		};
		BelowTopNavCompact.__docgenInfo = {
		"description": "",
		"displayName": "BelowTopNavCompact",
		"props": {
		"children": {
		"type": {
		"name": "node"
		},
		"required": false,
		"description": "A SideNav element"
		},
		"onMouseEnter": {
		"type": {
		"name": "func"
		},
		"required": false,
		"description": "Called when beginning to hover over the container"
		},
		"onMouseLeave": {
		"type": {
		"name": "func"
		},
		"required": false,
		"description": "Called when no longer hovering over the container"
		}
		}
		};

		SideNav.CollapseButton = CollapseButton;
		SideNav.Group = Group;
		SideNav.Link = Link;
		SideNav.Module = Module$1;
		SideNav.ModuleCompact = ModuleCompact;
		SideNav.Submodule = Submodule;

		exports.default = SideNav;
		exports.SideNavSkeleton = SideNavSkeleton;
		exports.Docked = Docked;
		exports.BelowTopNav = BelowTopNav;
		exports.BelowTopNavCompact = BelowTopNavCompact;

package.json

		{
		"name": "@hig/side-nav",
		"version": "0.1.0-alpha.b668624b",
		"version": "0.1.0-alpha.bac6c2ff",
		"description": "HIG SideNav components",
		@@ -18,11 +18,12 @@ "author": "Autodesk Inc.",
		"dependencies": {
		"@hig/icon": "0.1.0-alpha.b668624b",
		"@hig/icon-button": "0.1.0-alpha.b668624b",
		"@hig/skeleton-item": "0.1.0-alpha.b668624b",
		"@hig/themes": "0.1.0-alpha.b668624b"
		"@hig/icon": "0.1.0-alpha.bac6c2ff",
		"@hig/icon-button": "0.1.0-alpha.bac6c2ff",
		"@hig/skeleton-item": "0.1.0-alpha.bac6c2ff",
		"@hig/themes": "0.1.0-alpha.bac6c2ff",
		"classnames": "^2.2.5"
		},
		"devDependencies": {
		"@hig/babel-preset": "0.2.0-alpha.b668624b",
		"@hig/scripts": "0.2.0-alpha.b668624b",
		"@hig/styles": "0.1.0-alpha.b668624b"
		"@hig/babel-preset": "0.2.0-alpha.bac6c2ff",
		"@hig/scripts": "0.2.0-alpha.bac6c2ff",
		"@hig/styles": "0.1.0-alpha.bac6c2ff"
		},
		@@ -34,4 +35,8 @@ "peerDependencies": {
		"scripts": {
		"build": "hig-scripts-build"
		"build": "hig-scripts-build",
		"lint": "eslint src --ext .js,.jsx"
		},
		"eslintConfig": {
		"extends": "@hig"
		}
		}

build/index.css

Sorry, the diff of this file is not supported yet

build/index.es.css

Sorry, the diff of this file is not supported yet

@hig/side-nav - npm Package Compare versions

New alerts

Fixed alerts

Improved metrics

Worsened metrics

Dependency changes