@papillonbits/components 1.13.0 → 1.14.0

package/build/primer/Icon/Icon.prop.js

@@ -1,11 +1,5 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.propTypes = exports.iconSizeKeysDefault = exports.iconSizeKeys = exports.iconSize = exports.iconNameKeysDefault = exports.iconNameKeys = exports.iconName = exports.iconAlignKeysDefault = exports.iconAlignKeys = exports.iconAlign = exports.defaultProps = void 0;
-var _propTypes = require("prop-types");
-var iconName = exports.iconName = {
+import { string, number, oneOfType, oneOf } from 'prop-types';
+export const iconName = {
   Accessibility16: 'Accessibility16',
   Accessibility24: 'Accessibility24',
   AccessibilityInset16: 'AccessibilityInset16',
@@ -650,35 +644,35 @@ var iconName = exports.iconName = {
   ZoomOut16: 'ZoomOut16',
   ZoomOut24: 'ZoomOut24'
 };
-var iconSize = exports.iconSize = {
+export const iconSize = {
   small: 16,
   medium: 32,
   large: 64
 };
-var iconAlign = exports.iconAlign = {
+export const iconAlign = {
   middle: 'middle',
   'text-bottom': 'text-bottom',
   'text-top': 'text-top',
   top: 'top',
   unset: 'unset'
 };
-var iconNameKeys = exports.iconNameKeys = Object.keys(iconName);
-var iconNameKeysDefault = exports.iconNameKeysDefault = iconNameKeys[0];
-var iconSizeKeys = exports.iconSizeKeys = Object.keys(iconSize);
-var iconSizeKeysDefault = exports.iconSizeKeysDefault = iconSizeKeys[0];
-var iconAlignKeys = exports.iconAlignKeys = Object.keys(iconAlign);
-var iconAlignKeysDefault = exports.iconAlignKeysDefault = iconAlignKeys[0];
-var propTypes = exports.propTypes = {
-  className: _propTypes.string,
-  ariaLabel: _propTypes.string,
-  icon: (0, _propTypes.oneOf)(iconNameKeys).isRequired,
-  height: _propTypes.number,
-  width: _propTypes.number,
-  size: (0, _propTypes.oneOfType)([_propTypes.number, (0, _propTypes.oneOf)(iconSizeKeys)]),
-  fill: _propTypes.string,
-  verticalAlign: (0, _propTypes.oneOf)(iconAlignKeys)
+export const iconNameKeys = Object.keys(iconName);
+export const iconNameKeysDefault = iconNameKeys[0];
+export const iconSizeKeys = Object.keys(iconSize);
+export const iconSizeKeysDefault = iconSizeKeys[0];
+export const iconAlignKeys = Object.keys(iconAlign);
+export const iconAlignKeysDefault = iconAlignKeys[0];
+export const propTypes = {
+  className: string,
+  ariaLabel: string,
+  icon: oneOf(iconNameKeys).isRequired,
+  height: number,
+  width: number,
+  size: oneOfType([number, oneOf(iconSizeKeys)]),
+  fill: string,
+  verticalAlign: oneOf(iconAlignKeys)
 };
-var defaultProps = exports.defaultProps = {
+export const defaultProps = {
   className: 'octicon',
   ariaLabel: null,
   height: null,

package/build/primer/Icon/index.js

@@ -1,25 +1,2 @@
-"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");
+export { Icon } from './Icon';
+export { iconName, iconSize } from './Icon.prop';

package/build/primer/Label/Label.js

@@ -1,31 +1,25 @@
-"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)),
+import cx from 'classnames';
+import colorStyles from '@papillonbits/css/build/primer/utilities/colors.scss';
+import { propTypes, defaultProps, labelVariant, labelBackgroundColor, labelTextColor } from './Label.prop';
+import labelsStyles from './labels.scss';
+import issueLabelsStyles from './issue-labels.scss';
+import { jsx as _jsx } from "react/jsx-runtime";
+export function Label({
+  className = defaultProps.className,
+  text,
+  variant = defaultProps.variant,
+  backgroundColor = defaultProps.backgroundColor,
+  textColor = defaultProps.textColor
+}) {
+  return /*#__PURE__*/_jsx("span", {
+    title: `Label: ${text}`,
+    className: cx(className, {
+      [labelsStyles.Label]: variant === labelVariant.regular,
+      [issueLabelsStyles.IssueLabel]: variant === labelVariant.issue,
+      [colorStyles['bg-blue']]: backgroundColor === labelBackgroundColor.blue,
+      [colorStyles['text-white']]: textColor === labelTextColor.white
+    }),
     children: text
   });
 }
-Label.propTypes = _Label.propTypes;
+Label.propTypes = propTypes;

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

@@ -1,32 +1,26 @@
-"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 = {
+import { string, oneOf } from 'prop-types';
+export const labelVariant = {
   regular: 'regular',
   state: 'state',
   counter: 'counter',
   issue: 'issue'
 };
-var labelBackgroundColor = exports.labelBackgroundColor = {
+export const labelBackgroundColor = {
   blue: 'blue',
   red: 'red',
   green: 'green'
 };
-var labelTextColor = exports.labelTextColor = {
+export const 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))
+export const propTypes = {
+  className: string,
+  text: string.isRequired,
+  variant: oneOf(Object.keys(labelVariant)),
+  backgroundColor: oneOf(Object.keys(labelBackgroundColor)),
+  textColor: oneOf(Object.keys(labelTextColor))
 };
-var defaultProps = exports.defaultProps = {
+export const defaultProps = {
   className: null,
   variant: labelVariant.issue,
   backgroundColor: labelBackgroundColor.blue,

package/build/primer/Label/index.js

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

package/build/primer/Loader/Loader.js

@@ -1,65 +1,58 @@
-"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;
+import cx from 'classnames';
+import colorStyles from '@papillonbits/css/build/primer/utilities/colors.scss';
+import marginStyles from '@papillonbits/css/build/primer/utilities/margin.scss';
+import { propTypes, defaultProps, loaderVariant } from './Loader.prop';
+import styles from './Loader.scss';
+import branchNameStyles from '../BranchName/branch-name.scss';
+import buttonStyles from '../Button/Button.scss';
+import labelStyles from '../Label/labels.scss';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export function Loader({
+  className = defaultProps.className,
+  variant,
+  text
+}) {
   switch (variant) {
-    case _Loader.loaderVariant.heading:
-      return /*#__PURE__*/(0, _jsxRuntime.jsxs)("h2", {
+    case loaderVariant.heading:
+      return /*#__PURE__*/_jsxs("h2", {
         className: className,
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+        children: [/*#__PURE__*/_jsx("span", {
           children: text
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-          className: _Loader2["default"].AnimatedEllipsis
+        }), /*#__PURE__*/_jsx("span", {
+          className: styles.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", {
+    case loaderVariant.text:
+      return /*#__PURE__*/_jsxs("span", {
+        className: cx(branchNameStyles['branch-name'], marginStyles['mt-2']),
+        children: [/*#__PURE__*/_jsx("span", {
           children: text
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-          className: _Loader2["default"].AnimatedEllipsis
+        }), /*#__PURE__*/_jsx("span", {
+          className: styles.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", {
+    case loaderVariant.label:
+      return /*#__PURE__*/_jsxs("span", {
+        className: cx(labelStyles.Label, colorStyles['bg-blue'], marginStyles['mt-3']),
+        children: [/*#__PURE__*/_jsx("span", {
           children: text
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-          className: _Loader2["default"].AnimatedEllipsis
+        }), /*#__PURE__*/_jsx("span", {
+          className: styles.AnimatedEllipsis
         })]
       });
-    case _Loader.loaderVariant.button:
-      return /*#__PURE__*/(0, _jsxRuntime.jsxs)("button", {
+    case loaderVariant.button:
+      return /*#__PURE__*/_jsxs("button", {
         type: "button",
-        className: (0, _classnames["default"])(_Button["default"].btn, _margin["default"]['mt-3']),
+        className: cx(buttonStyles.btn, marginStyles['mt-3']),
         "aria-disabled": "true",
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+        children: [/*#__PURE__*/_jsx("span", {
           children: text
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-          className: _Loader2["default"].AnimatedEllipsis
+        }), /*#__PURE__*/_jsx("span", {
+          className: styles.AnimatedEllipsis
         })]
       });
     default:
       return null;
   }
 }
-Loader.propTypes = _Loader.propTypes;
+Loader.propTypes = propTypes;

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

@@ -1,21 +1,15 @@
-"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 = {
+import { string, oneOf } from 'prop-types';
+export const 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
+export const propTypes = {
+  className: string,
+  variant: oneOf(Object.keys(loaderVariant)).isRequired,
+  text: string.isRequired
 };
-var defaultProps = exports.defaultProps = {
+export const defaultProps = {
   className: null
 };

package/build/primer/Loader/index.js

@@ -1,19 +1,2 @@
-"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");
+export { Loader } from './Loader';
+export { loaderVariant } from './Loader.prop';

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

@@ -1,70 +1,63 @@
-"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),
+import "core-js/modules/es.iterator.constructor.js";
+import "core-js/modules/es.iterator.map.js";
+import cx from 'classnames';
+import { v1 as uuidv1 } from 'uuid';
+import { getIndexItems, getIndexItemsWithSelected } from '@papillonbits/library/array';
+import { useState } from '@papillonbits/library/hooks';
+import { propTypes, defaultProps } from './Menu.prop';
+import styles from './Menu.scss';
+import { Icon, iconSize } from '../../Icon';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export function Menu({
+  className = defaultProps.className,
+  heading = defaultProps.heading,
+  ariaAttr,
+  items,
+  onClick
+}) {
+  const [indexItems, setIndexItems] = useState(getIndexItems(items));
+  const {
+    label,
+    labelledBy,
+    current
+  } = ariaAttr;
+  return /*#__PURE__*/_jsxs("nav", {
+    className: cx(className, styles.menu),
     "aria-label": label,
     "aria-labelledby": labelledBy,
-    children: [heading && /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-      className: _Menu2["default"]['menu-heading'],
+    children: [heading && /*#__PURE__*/_jsx("span", {
+      className: styles['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) {
+    }), indexItems.map(indexItem => {
+      const {
+        href,
+        icon,
+        text,
+        html,
+        isSelected
+      } = indexItem;
+      const itemOtherProps = isSelected ? {
+        ...{
+          'aria-current': current
+        }
+      } : null;
+      return /*#__PURE__*/_jsxs("a", {
+        onClick: e => {
           e.preventDefault();
-          var newIndexItems = (0, _array.getIndexItemsWithSelected)(indexItems, indexItem);
+          const newIndexItems = getIndexItemsWithSelected(indexItems, indexItem);
           setIndexItems(newIndexItems);
-          _onClick(newIndexItems);
+          onClick(newIndexItems);
         },
-        className: _Menu2["default"]['menu-item'],
-        href: href
-      }, itemOtherProps), {}, {
-        children: [icon && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icon.Icon, {
-          className: _Menu2["default"].octicon,
+        className: styles['menu-item'],
+        href: href,
+        ...itemOtherProps,
+        children: [icon && /*#__PURE__*/_jsx(Icon, {
+          className: styles.octicon,
           icon: icon,
-          size: _Icon.iconSize.small
+          size: iconSize.small
         }), html || null, text]
-      }), (0, _uuid.v1)());
+      }, uuidv1());
     })]
   });
 }
-Menu.propTypes = _Menu.propTypes;
+Menu.propTypes = propTypes;

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

@@ -1,28 +1,22 @@
-"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
+import { string, arrayOf, shape, node, bool, func } from 'prop-types';
+export const propTypes = {
+  className: string,
+  heading: string,
+  ariaAttr: shape({
+    label: string,
+    labelledBy: string,
+    current: string
   }).isRequired,
-  items: (0, _propTypes.arrayOf)((0, _propTypes.shape)({
-    href: _propTypes.string,
-    icon: _propTypes.string,
-    text: _propTypes.string,
-    html: _propTypes.node,
-    isSelected: _propTypes.bool
+  items: arrayOf(shape({
+    href: string,
+    icon: string,
+    text: string,
+    html: node,
+    isSelected: bool
   })).isRequired,
-  onClick: _propTypes.func.isRequired
+  onClick: func.isRequired
 };
-var defaultProps = exports.defaultProps = {
+export const defaultProps = {
   className: null,
   heading: null
 };

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

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