@papillonarts/components 0.7.0 → 0.9.0

package/build/primer/Icon/index.js

@@ -1,25 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-Object.defineProperty(exports, "Icon", {
-  enumerable: true,
-  get: function get() {
-    return _Icon.Icon;
-  }
-});
-Object.defineProperty(exports, "iconName", {
-  enumerable: true,
-  get: function get() {
-    return _Icon2.iconName;
-  }
-});
-Object.defineProperty(exports, "iconSize", {
-  enumerable: true,
-  get: function get() {
-    return _Icon2.iconSize;
-  }
-});
-var _Icon = require("./Icon");
-var _Icon2 = require("./Icon.prop");

package/build/primer/Label/Label.js

@@ -1,31 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.Label = Label;
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _classnames = _interopRequireDefault(require("classnames"));
-var _colors = _interopRequireDefault(require("@papillonbits/css/build/primer/utilities/colors.scss"));
-var _Label = require("./Label.prop");
-var _labels = _interopRequireDefault(require("./labels.scss"));
-var _issueLabels = _interopRequireDefault(require("./issue-labels.scss"));
-var _jsxRuntime = require("react/jsx-runtime");
-function Label(_ref) {
-  var _ref$className = _ref.className,
-    className = _ref$className === void 0 ? _Label.defaultProps.className : _ref$className,
-    text = _ref.text,
-    _ref$variant = _ref.variant,
-    variant = _ref$variant === void 0 ? _Label.defaultProps.variant : _ref$variant,
-    _ref$backgroundColor = _ref.backgroundColor,
-    backgroundColor = _ref$backgroundColor === void 0 ? _Label.defaultProps.backgroundColor : _ref$backgroundColor,
-    _ref$textColor = _ref.textColor,
-    textColor = _ref$textColor === void 0 ? _Label.defaultProps.textColor : _ref$textColor;
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-    title: "Label: ".concat(text),
-    className: (0, _classnames["default"])(className, (0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])({}, _labels["default"].Label, variant === _Label.labelVariant.regular), _issueLabels["default"].IssueLabel, variant === _Label.labelVariant.issue), _colors["default"]['bg-blue'], backgroundColor === _Label.labelBackgroundColor.blue), _colors["default"]['text-white'], textColor === _Label.labelTextColor.white)),
-    children: text
-  });
-}
-Label.propTypes = _Label.propTypes;

package/build/primer/Label/Label.prop.js

@@ -1,34 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.propTypes = exports.labelVariant = exports.labelTextColor = exports.labelBackgroundColor = exports.defaultProps = void 0;
-var _propTypes = require("prop-types");
-var labelVariant = exports.labelVariant = {
-  regular: 'regular',
-  state: 'state',
-  counter: 'counter',
-  issue: 'issue'
-};
-var labelBackgroundColor = exports.labelBackgroundColor = {
-  blue: 'blue',
-  red: 'red',
-  green: 'green'
-};
-var labelTextColor = exports.labelTextColor = {
-  white: 'white'
-};
-var propTypes = exports.propTypes = {
-  className: _propTypes.string,
-  text: _propTypes.string.isRequired,
-  variant: (0, _propTypes.oneOf)(Object.keys(labelVariant)),
-  backgroundColor: (0, _propTypes.oneOf)(Object.keys(labelBackgroundColor)),
-  textColor: (0, _propTypes.oneOf)(Object.keys(labelTextColor))
-};
-var defaultProps = exports.defaultProps = {
-  className: null,
-  variant: labelVariant.issue,
-  backgroundColor: labelBackgroundColor.blue,
-  textColor: labelTextColor.white
-};

package/build/primer/Label/index.js

@@ -1,12 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-Object.defineProperty(exports, "Label", {
-  enumerable: true,
-  get: function get() {
-    return _Label.Label;
-  }
-});
-var _Label = require("./Label");

package/build/primer/Loader/Loader.js

@@ -1,65 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.Loader = Loader;
-var _classnames = _interopRequireDefault(require("classnames"));
-var _colors = _interopRequireDefault(require("@papillonbits/css/build/primer/utilities/colors.scss"));
-var _margin = _interopRequireDefault(require("@papillonbits/css/build/primer/utilities/margin.scss"));
-var _Loader = require("./Loader.prop");
-var _Loader2 = _interopRequireDefault(require("./Loader.scss"));
-var _branchName = _interopRequireDefault(require("../BranchName/branch-name.scss"));
-var _Button = _interopRequireDefault(require("../Button/Button.scss"));
-var _labels = _interopRequireDefault(require("../Label/labels.scss"));
-var _jsxRuntime = require("react/jsx-runtime");
-function Loader(_ref) {
-  var _ref$className = _ref.className,
-    className = _ref$className === void 0 ? _Loader.defaultProps.className : _ref$className,
-    variant = _ref.variant,
-    text = _ref.text;
-  switch (variant) {
-    case _Loader.loaderVariant.heading:
-      return /*#__PURE__*/(0, _jsxRuntime.jsxs)("h2", {
-        className: className,
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-          children: text
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-          className: _Loader2["default"].AnimatedEllipsis
-        })]
-      });
-    case _Loader.loaderVariant.text:
-      return /*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
-        className: (0, _classnames["default"])(_branchName["default"]['branch-name'], _margin["default"]['mt-2']),
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-          children: text
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-          className: _Loader2["default"].AnimatedEllipsis
-        })]
-      });
-    case _Loader.loaderVariant.label:
-      return /*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
-        className: (0, _classnames["default"])(_labels["default"].Label, _colors["default"]['bg-blue'], _margin["default"]['mt-3']),
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-          children: text
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-          className: _Loader2["default"].AnimatedEllipsis
-        })]
-      });
-    case _Loader.loaderVariant.button:
-      return /*#__PURE__*/(0, _jsxRuntime.jsxs)("button", {
-        type: "button",
-        className: (0, _classnames["default"])(_Button["default"].btn, _margin["default"]['mt-3']),
-        "aria-disabled": "true",
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-          children: text
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-          className: _Loader2["default"].AnimatedEllipsis
-        })]
-      });
-    default:
-      return null;
-  }
-}
-Loader.propTypes = _Loader.propTypes;

package/build/primer/Loader/Loader.prop.js

@@ -1,21 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.propTypes = exports.loaderVariant = exports.defaultProps = void 0;
-var _propTypes = require("prop-types");
-var loaderVariant = exports.loaderVariant = {
-  heading: 'heading',
-  text: 'text',
-  label: 'label',
-  button: 'button'
-};
-var propTypes = exports.propTypes = {
-  className: _propTypes.string,
-  variant: (0, _propTypes.oneOf)(Object.keys(loaderVariant)).isRequired,
-  text: _propTypes.string.isRequired
-};
-var defaultProps = exports.defaultProps = {
-  className: null
-};

package/build/primer/Loader/index.js

@@ -1,19 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-Object.defineProperty(exports, "Loader", {
-  enumerable: true,
-  get: function get() {
-    return _Loader.Loader;
-  }
-});
-Object.defineProperty(exports, "loaderVariant", {
-  enumerable: true,
-  get: function get() {
-    return _Loader2.loaderVariant;
-  }
-});
-var _Loader = require("./Loader");
-var _Loader2 = require("./Loader.prop");

package/build/primer/Navigation/Menu/Menu.js

@@ -1,70 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.Menu = Menu;
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-var _classnames = _interopRequireDefault(require("classnames"));
-var _uuid = require("uuid");
-var _array = require("@papillonbits/library/array");
-var _hooks = require("@papillonbits/library/hooks");
-var _Menu = require("./Menu.prop");
-var _Menu2 = _interopRequireDefault(require("./Menu.scss"));
-var _Icon = require("../../Icon");
-var _jsxRuntime = require("react/jsx-runtime");
-function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-function Menu(_ref) {
-  var _ref$className = _ref.className,
-    className = _ref$className === void 0 ? _Menu.defaultProps.className : _ref$className,
-    _ref$heading = _ref.heading,
-    heading = _ref$heading === void 0 ? _Menu.defaultProps.heading : _ref$heading,
-    ariaAttr = _ref.ariaAttr,
-    items = _ref.items,
-    _onClick = _ref.onClick;
-  var _useState = (0, _hooks.useState)((0, _array.getIndexItems)(items)),
-    _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
-    indexItems = _useState2[0],
-    setIndexItems = _useState2[1];
-  var label = ariaAttr.label,
-    labelledBy = ariaAttr.labelledBy,
-    current = ariaAttr.current;
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("nav", {
-    className: (0, _classnames["default"])(className, _Menu2["default"].menu),
-    "aria-label": label,
-    "aria-labelledby": labelledBy,
-    children: [heading && /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-      className: _Menu2["default"]['menu-heading'],
-      children: heading
-    }), indexItems.map(function (indexItem) {
-      var href = indexItem.href,
-        icon = indexItem.icon,
-        text = indexItem.text,
-        html = indexItem.html,
-        isSelected = indexItem.isSelected;
-      var itemOtherProps = isSelected ? _objectSpread({}, {
-        'aria-current': current
-      }) : null;
-      return /*#__PURE__*/(0, _jsxRuntime.jsxs)("a", _objectSpread(_objectSpread({
-        onClick: function onClick(e) {
-          e.preventDefault();
-          var newIndexItems = (0, _array.getIndexItemsWithSelected)(indexItems, indexItem);
-          setIndexItems(newIndexItems);
-          _onClick(newIndexItems);
-        },
-        className: _Menu2["default"]['menu-item'],
-        href: href
-      }, itemOtherProps), {}, {
-        children: [icon && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icon.Icon, {
-          className: _Menu2["default"].octicon,
-          icon: icon,
-          size: _Icon.iconSize.small
-        }), html || null, text]
-      }), (0, _uuid.v1)());
-    })]
-  });
-}
-Menu.propTypes = _Menu.propTypes;

package/build/primer/Navigation/Menu/Menu.prop.js

@@ -1,28 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.propTypes = exports.defaultProps = void 0;
-var _propTypes = require("prop-types");
-var propTypes = exports.propTypes = {
-  className: _propTypes.string,
-  heading: _propTypes.string,
-  ariaAttr: (0, _propTypes.shape)({
-    label: _propTypes.string,
-    labelledBy: _propTypes.string,
-    current: _propTypes.string
-  }).isRequired,
-  items: (0, _propTypes.arrayOf)((0, _propTypes.shape)({
-    href: _propTypes.string,
-    icon: _propTypes.string,
-    text: _propTypes.string,
-    html: _propTypes.node,
-    isSelected: _propTypes.bool
-  })).isRequired,
-  onClick: _propTypes.func.isRequired
-};
-var defaultProps = exports.defaultProps = {
-  className: null,
-  heading: null
-};

package/build/primer/Navigation/Menu/index.js

@@ -1,12 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-Object.defineProperty(exports, "Menu", {
-  enumerable: true,
-  get: function get() {
-    return _Menu.Menu;
-  }
-});
-var _Menu = require("./Menu");

package/build/primer/Navigation/TabNav/TabNav.js

@@ -1,125 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.TabNav = TabNav;
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _react = require("react");
-var _classnames = _interopRequireDefault(require("classnames"));
-var _uuid = require("uuid");
-var _array = require("@papillonbits/library/array");
-var _TabNav = require("./TabNav.prop");
-var _TabNav2 = _interopRequireDefault(require("./TabNav.scss"));
-var _jsxRuntime = require("react/jsx-runtime");
-function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-function TabNav(_ref) {
-  var _ref$className = _ref.className,
-    className = _ref$className === void 0 ? _TabNav.defaultProps.className : _ref$className,
-    ariaAttr = _ref.ariaAttr,
-    items = _ref.items,
-    _ref$actions = _ref.actions,
-    actions = _ref$actions === void 0 ? _TabNav.defaultProps.actions : _ref$actions,
-    _onClick = _ref.onClick,
-    _ref$children = _ref.children,
-    children = _ref$children === void 0 ? _TabNav.defaultProps.children : _ref$children,
-    _ref$state = _ref.state,
-    state = _ref$state === void 0 ? _TabNav.defaultProps.state : _ref$state;
-  if (!items) {
-    return null;
-  }
-  var label = ariaAttr.label,
-    current = ariaAttr.current;
-  var indexItems = (0, _array.getIndexItems)(items);
-  function renderActions() {
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_react.Fragment, {
-      children: actions
-    }); // eslint-disable-line react/jsx-no-useless-fragment
-  }
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-    className: (0, _classnames["default"])(className, _TabNav2["default"].tabnav, (0, _defineProperty2["default"])({}, _TabNav2["default"]['tabnav-inactive'], state === _TabNav.tabNavState.inactive)),
-    children: [actions && renderActions(), /*#__PURE__*/(0, _jsxRuntime.jsx)("nav", {
-      className: _TabNav2["default"]['tabnav-tabs'],
-      "aria-label": label,
-      children: indexItems.map(function (indexItem) {
-        var href = indexItem.href,
-          text = indexItem.text,
-          link = indexItem.link,
-          isSelected = indexItem.isSelected,
-          enabled = indexItem.enabled,
-          visible = indexItem.visible;
-        var itemOtherProps = isSelected ? _objectSpread({}, {
-          'aria-current': current
-        }) : null;
-        if (href && text) {
-          return /*#__PURE__*/(0, _jsxRuntime.jsx)("a", _objectSpread(_objectSpread({
-            onClick: function onClick() {
-              if (!enabled) {
-                return;
-              }
-              var newIndexItems = (0, _array.getIndexItemsWithSelected)(indexItems, indexItem);
-              _onClick({
-                ariaAttr: ariaAttr,
-                items: newIndexItems.map(function (newIndexItem) {
-                  return function (_ref2) {
-                    var href = _ref2.href,
-                      text = _ref2.text,
-                      isSelected = _ref2.isSelected;
-                    return {
-                      href: href,
-                      text: text,
-                      isSelected: isSelected,
-                      enabled: enabled,
-                      visible: visible
-                    };
-                  }(newIndexItem);
-                } // eslint-disable-line
-                )
-              });
-            },
-            className: _TabNav2["default"]['tabnav-tab'],
-            href: href
-          }, itemOtherProps), {}, {
-            children: text
-          }), (0, _uuid.v1)());
-        }
-        if (link) {
-          var Link = link.component;
-          return /*#__PURE__*/(0, _jsxRuntime.jsx)(Link, _objectSpread(_objectSpread(_objectSpread({
-            onClick: function onClick() {
-              if (!enabled) {
-                return;
-              }
-              var newIndexItems = (0, _array.getIndexItemsWithSelected)(indexItems, indexItem);
-              _onClick({
-                ariaAttr: ariaAttr,
-                items: newIndexItems.map(function (newIndexItem) {
-                  return function (_ref3) {
-                    var link = _ref3.link,
-                      isSelected = _ref3.isSelected,
-                      enabled = _ref3.enabled,
-                      visible = _ref3.visible;
-                    return {
-                      link: link,
-                      isSelected: isSelected,
-                      enabled: enabled,
-                      visible: visible
-                    };
-                  }(newIndexItem);
-                } // eslint-disable-line
-                )
-              });
-            },
-            className: (0, _classnames["default"])(className, _TabNav2["default"]['tabnav-tab'], (0, _defineProperty2["default"])((0, _defineProperty2["default"])({}, _TabNav2["default"]['tabnav-tab-inactive'], enabled === false), _TabNav2["default"]['tabnav-tab-hidden'], visible === false))
-          }, itemOtherProps), link.props), {}, {
-            children: link.children
-          }), (0, _uuid.v1)());
-        }
-        return null;
-      })
-    }), children]
-  });
-}
-TabNav.propTypes = _TabNav.propTypes;

package/build/primer/Navigation/TabNav/TabNav.prop.js

@@ -1,36 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.tabNavState = exports.propTypes = exports.defaultProps = void 0;
-var _propTypes = require("prop-types");
-var tabNavState = exports.tabNavState = {
-  active: 'active',
-  inactive: 'inactive'
-};
-var propTypes = exports.propTypes = {
-  className: _propTypes.string,
-  ariaAttr: (0, _propTypes.shape)({
-    label: _propTypes.string,
-    current: _propTypes.string
-  }).isRequired,
-  items: (0, _propTypes.arrayOf)((0, _propTypes.shape)({
-    href: _propTypes.string,
-    text: _propTypes.string,
-    link: _propTypes.shape,
-    isSelected: _propTypes.bool,
-    enabled: _propTypes.bool,
-    visible: _propTypes.bool
-  })).isRequired,
-  actions: (0, _propTypes.arrayOf)(_propTypes.node),
-  onClick: _propTypes.func.isRequired,
-  children: _propTypes.node,
-  state: (0, _propTypes.oneOf)(Object.keys(tabNavState))
-};
-var defaultProps = exports.defaultProps = {
-  className: null,
-  actions: null,
-  children: null,
-  state: tabNavState.active
-};

package/build/primer/Navigation/TabNav/index.js

@@ -1,19 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-Object.defineProperty(exports, "TabNav", {
-  enumerable: true,
-  get: function get() {
-    return _TabNav.TabNav;
-  }
-});
-Object.defineProperty(exports, "tabNavState", {
-  enumerable: true,
-  get: function get() {
-    return _TabNav2.tabNavState;
-  }
-});
-var _TabNav = require("./TabNav");
-var _TabNav2 = require("./TabNav.prop");

package/build/primer/Navigation/UnderlineNav/UnderlineNav.js

@@ -1,121 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.UnderlineNav = UnderlineNav;
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-var _react = require("react");
-var _classnames = _interopRequireDefault(require("classnames"));
-var _uuid = require("uuid");
-var _array = require("@papillonbits/library/array");
-var _hooks = require("@papillonbits/library/hooks");
-var _UnderlineNav = require("./UnderlineNav.prop");
-var _UnderlineNav2 = _interopRequireDefault(require("./UnderlineNav.scss"));
-var _container = _interopRequireDefault(require("../../Layout/container.scss"));
-var _Icon = require("../../Icon");
-var _jsxRuntime = require("react/jsx-runtime");
-function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-function UnderlineNav(_ref) {
-  var _ref$className = _ref.className,
-    className = _ref$className === void 0 ? _UnderlineNav.defaultProps.className : _ref$className,
-    ariaAttr = _ref.ariaAttr,
-    items = _ref.items,
-    itemType = _ref.itemType,
-    _ref$actions = _ref.actions,
-    actions = _ref$actions === void 0 ? _UnderlineNav.defaultProps.actions : _ref$actions,
-    _ref$align = _ref.align,
-    align = _ref$align === void 0 ? _UnderlineNav.defaultProps.align : _ref$align,
-    _ref$fullContainer = _ref.fullContainer,
-    fullContainer = _ref$fullContainer === void 0 ? _UnderlineNav.defaultProps.fullContainer : _ref$fullContainer,
-    _onClick = _ref.onClick;
-  var _useState = (0, _hooks.useState)((0, _array.getIndexItems)(items)),
-    _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
-    indexItems = _useState2[0],
-    setIndexItems = _useState2[1];
-  var label = ariaAttr.label,
-    selected = ariaAttr.selected,
-    current = ariaAttr.current;
-  function renderActions() {
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-      className: _UnderlineNav2["default"]['UnderlineNav-actions'],
-      children: actions
-    });
-  }
-  function renderBody() {
-    return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_react.Fragment, {
-      children: [align === _UnderlineNav.underlineNavAlignmentType.right && actions && renderActions(), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-        className: _UnderlineNav2["default"]['UnderlineNav-body'],
-        role: "tablist",
-        children: indexItems.map(function (indexItem) {
-          var href = indexItem.href,
-            icon = indexItem.icon,
-            text = indexItem.text,
-            html = indexItem.html,
-            isSelected = indexItem.isSelected;
-          var anchorOtherProps = isSelected ? _objectSpread({}, {
-            'aria-selected': selected
-          }) : null;
-          var buttonOtherProps = isSelected ? _objectSpread({}, {
-            'aria-current': current
-          }) : null;
-          switch (itemType) {
-            case 'button':
-              return /*#__PURE__*/(0, _jsxRuntime.jsxs)("button", _objectSpread(_objectSpread({
-                onClick: function onClick(e) {
-                  e.preventDefault();
-                  var newIndexItems = (0, _array.getIndexItemsWithSelected)(indexItems, indexItem);
-                  setIndexItems(newIndexItems);
-                  _onClick(newIndexItems);
-                },
-                className: _UnderlineNav2["default"]['UnderlineNav-item'],
-                role: "tab",
-                type: "button",
-                href: href
-              }, anchorOtherProps), {}, {
-                children: [icon && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icon.Icon, {
-                  className: _UnderlineNav2["default"]['UnderlineNav-octicon'],
-                  icon: icon,
-                  size: _Icon.iconSize.small
-                }), html || null, text]
-              }), (0, _uuid.v1)());
-            case 'a':
-              return /*#__PURE__*/(0, _jsxRuntime.jsxs)("a", _objectSpread(_objectSpread({
-                onClick: function onClick(e) {
-                  e.preventDefault();
-                  var newIndexItems = (0, _array.getIndexItemsWithSelected)(indexItems, indexItem);
-                  setIndexItems(newIndexItems);
-                  _onClick(newIndexItems);
-                },
-                className: _UnderlineNav2["default"]['UnderlineNav-item'],
-                href: href
-              }, buttonOtherProps), {}, {
-                children: [icon && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icon.Icon, {
-                  className: _UnderlineNav2["default"]['UnderlineNav-octicon'],
-                  icon: icon,
-                  size: _Icon.iconSize.small
-                }), html || null, text]
-              }), (0, _uuid.v1)());
-            default:
-              return null;
-          }
-        })
-      }), align === _UnderlineNav.underlineNavAlignmentType.left && actions && renderActions()]
-    });
-  }
-  function renderBodyFullContainer() {
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-      className: (0, _classnames["default"])(_container["default"]['container-lg'], _UnderlineNav2["default"]['UnderlineNav-container']),
-      children: renderBody()
-    });
-  }
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("nav", {
-    className: (0, _classnames["default"])(className, _UnderlineNav2["default"].UnderlineNav, (0, _defineProperty2["default"])((0, _defineProperty2["default"])({}, _UnderlineNav2["default"]['UnderlineNav--right'], align === _UnderlineNav.underlineNavAlignmentType.right), _UnderlineNav2["default"]['UnderlineNav--full'], fullContainer === true)),
-    "aria-label": label,
-    children: [fullContainer === false && renderBody(), fullContainer === true && renderBodyFullContainer()]
-  });
-}
-UnderlineNav.propTypes = _UnderlineNav.propTypes;