UNPKG

@pantheon-systems/design-toolkit-react

Version:
1,242 lines (1,210 loc) 350 kB
'use strict'; Object.defineProperty(exports, '__esModule', { value: true }); var _defineProperty = require('@babel/runtime/helpers/defineProperty'); var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties'); var PropTypes = require('prop-types'); var proSolidSvgIcons = require('@fortawesome/pro-solid-svg-icons'); var React = require('react'); var reactFontawesome = require('@fortawesome/react-fontawesome'); var jsxRuntime = require('react/jsx-runtime'); var reactRouterDom = require('react-router-dom'); var proRegularSvgIcons = require('@fortawesome/pro-regular-svg-icons'); var _slicedToArray = require('@babel/runtime/helpers/slicedToArray'); var downshift = require('downshift'); var informed = require('informed'); var proLightSvgIcons = require('@fortawesome/pro-light-svg-icons'); var reactToastify = require('react-toastify'); var _toConsumableArray = require('@babel/runtime/helpers/toConsumableArray'); var _objectDestructuringEmpty = require('@babel/runtime/helpers/objectDestructuringEmpty'); var _extends = require('@babel/runtime/helpers/extends'); var menuButton = require('@reach/menu-button'); require('@reach/menu-button/styles.css'); var _asyncToGenerator = require('@babel/runtime/helpers/asyncToGenerator'); var _regeneratorRuntime = require('@babel/runtime/regenerator'); var Prism = require('prismjs/components/prism-core'); require('prismjs/components/prism-bash'); require('prismjs/components/prism-markup'); require('prismjs/components/prism-css'); require('prismjs/components/prism-clike'); require('prismjs/components/prism-javascript'); require('prismjs/themes/prism-okaidia.css'); require('prismjs/plugins/line-numbers/prism-line-numbers'); require('prismjs/plugins/line-numbers/prism-line-numbers.css'); var reactCsv = require('react-csv'); var reactSpring = require('react-spring'); var ResizeObserver = require('resize-observer-polyfill'); var _typeof = require('@babel/runtime/helpers/typeof'); var flatMap = require('flatmap'); var hashSum = require('hash-sum'); var TextareaAutosize = require('react-textarea-autosize'); var Markdown = require('markdown-to-jsx'); var uuid = require('uuid'); var reactDom = require('@floating-ui/react-dom'); var dialog = require('@reach/dialog'); require('@reach/dialog/styles.css'); var Tippy = require('@tippyjs/react'); var Portal = require('@reach/portal'); var _classCallCheck = require('@babel/runtime/helpers/classCallCheck'); var _createClass = require('@babel/runtime/helpers/createClass'); var autoId = require('@reach/auto-id'); var reactTable = require('react-table'); var tabs = require('@reach/tabs'); function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; } var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty); var _objectWithoutProperties__default = /*#__PURE__*/_interopDefaultLegacy(_objectWithoutProperties); var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes); var React__default = /*#__PURE__*/_interopDefaultLegacy(React); var _slicedToArray__default = /*#__PURE__*/_interopDefaultLegacy(_slicedToArray); var _toConsumableArray__default = /*#__PURE__*/_interopDefaultLegacy(_toConsumableArray); var _objectDestructuringEmpty__default = /*#__PURE__*/_interopDefaultLegacy(_objectDestructuringEmpty); var _extends__default = /*#__PURE__*/_interopDefaultLegacy(_extends); var _asyncToGenerator__default = /*#__PURE__*/_interopDefaultLegacy(_asyncToGenerator); var _regeneratorRuntime__default = /*#__PURE__*/_interopDefaultLegacy(_regeneratorRuntime); var Prism__default = /*#__PURE__*/_interopDefaultLegacy(Prism); var ResizeObserver__default = /*#__PURE__*/_interopDefaultLegacy(ResizeObserver); var _typeof__default = /*#__PURE__*/_interopDefaultLegacy(_typeof); var flatMap__default = /*#__PURE__*/_interopDefaultLegacy(flatMap); var hashSum__default = /*#__PURE__*/_interopDefaultLegacy(hashSum); var TextareaAutosize__default = /*#__PURE__*/_interopDefaultLegacy(TextareaAutosize); var Markdown__default = /*#__PURE__*/_interopDefaultLegacy(Markdown); var Tippy__default = /*#__PURE__*/_interopDefaultLegacy(Tippy); var Portal__default = /*#__PURE__*/_interopDefaultLegacy(Portal); var _classCallCheck__default = /*#__PURE__*/_interopDefaultLegacy(_classCallCheck); var _createClass__default = /*#__PURE__*/_interopDefaultLegacy(_createClass); const BITBUCKET = { hex: "#004DC0", rgb: "0,77,192" }; const BLACK = { hex: "#000000", rgb: "34,34,34" }; const BLUE_1 = { hex: "#EAF7FF", rgb: "234,247,255" }; const BLUE_2 = { hex: "#6AB9E8", rgb: "106,185,232" }; const BLUE_3 = { hex: "#1173AC", rgb: "17,115,172" }; const BLUE_4 = { hex: "#074F7A", rgb: "7,79,122" }; const BLUE_5 = { hex: "#03324D", rgb: "3,50,77" }; const CYAN_1 = { hex: "#DFF4FA", rgb: "223,244,250" }; const CYAN_2 = { hex: "#66D4F8", rgb: "102,212,248" }; const CYAN_3 = { hex: "#02A9E0", rgb: "2,169,224" }; const CYAN_4 = { hex: "#00759B", rgb: "0,117,155" }; const CYAN_5 = { hex: "#05465B", rgb: "5,70,91" }; const GATSBY = { hex: "#663399", rgb: "102,51,153" }; const GITLAB = { hex: "#380D75", rga: "56,13,117" }; const GRAY_1 = { hex: "#F6F9F9", rgb: "246,249,249" }; const GRAY_2 = { hex: "#DDE5E7", rgb: "221,229,231" }; const GRAY_3 = { hex: "#8097A8", rgb: "128, 151, 168" }; const GRAY_4 = { hex: "#627684", rgb: "98,118,132" }; const GRAY_5 = { hex: "#4F5D6B", rgb: "79,93,107" }; const GRAY_6 = { hex: "#283139", rgb: "40,49,57" }; const GRAY_7 = { hex: "#181C20", rgb: "24,28,32" }; const GREEN_1 = { hex: "#E4FFF4", rgb: "228,255,244" }; const GREEN_2 = { hex: "#5ECD9F", rgb: "94,205,159" }; const GREEN_3 = { hex: "#00864E", rgb: "0,134,78" }; const GREEN_4 = { hex: "#025E38", rgb: "2,94,56" }; const GREEN_5 = { hex: "#013721", rgb: "1,55,33" }; const ORANGE_1 = { hex: "#FFF0DC", rgb: "255,240,220" }; const ORANGE_2 = { hex: "#FCBE6F", rgb: "252,190,111" }; const ORANGE_3 = { hex: "#F78A00", rgb: "247,138,0" }; const ORANGE_4 = { hex: "#B16300", rgb: "177,99,0" }; const ORANGE_5 = { hex: "#5A3201", rgb: "90,50,1" }; const PURPLE_1 = { hex: "#FFEDFB", rgb: "255,237,251" }; const PURPLE_2 = { hex: "#CD94C0", rgb: "205,148,192" }; const PURPLE_3 = { hex: "#825077", rgb: "130,80,119" }; const PURPLE_4 = { hex: "#5E3355", rgb: "94,51,85" }; const PURPLE_5 = { hex: "#3F1D38", rgb: "63,29,56" }; const PURPLE_6 = { hex: "#3017A1", rgb: "48,23,161" }; const PURPLE_7 = { hex: "#24107B", rgb: "36,16,123" }; const RED_1 = { hex: "#FFE1E3", rgb: "255,225,227" }; const RED_2 = { hex: "#FD8189", rgb: "253,129,137" }; const RED_3 = { hex: "#DD2631", rgb: "221,38,49" }; const RED_4 = { hex: "#9E171F", rgb: "158,23,31" }; const RED_5 = { hex: "#5E0B10", rgb: "94,11,16" }; const TEAL_1 = { hex: "#F3FFFD", rgb: "243,255,253" }; const TEAL_2 = { hex: "#BCFFF5", rgb: "188,255,245" }; const TEAL_3 = { hex: "#17D7BB", rgb: "23,215,187" }; const TEAL_4 = { hex: "#019A82", rgb: "1,154,130" }; const TEAL_5 = { hex: "#015044", rgb: "1,80,68" }; const WHITE = { hex: "#FFFFFF", rgb: "255,255,255" }; const YELLOW_1 = { hex: "#FCF8E0", rgb: "252,248,224" }; const YELLOW_2 = { hex: "#FFEC7D", rgb: "255,236,125" }; const YELLOW_3 = { hex: "#EFD01B", rgb: "239,208,27" }; const YELLOW_4 = { hex: "#CAB01B", rgb: "202,176,27" }; const YELLOW_5 = { hex: "#6E6010", rgb: "110,96,16" }; var colors$1 = { BITBUCKET: BITBUCKET, BLACK: BLACK, BLUE_1: BLUE_1, BLUE_2: BLUE_2, BLUE_3: BLUE_3, BLUE_4: BLUE_4, BLUE_5: BLUE_5, CYAN_1: CYAN_1, CYAN_2: CYAN_2, CYAN_3: CYAN_3, CYAN_4: CYAN_4, CYAN_5: CYAN_5, GATSBY: GATSBY, GITLAB: GITLAB, GRAY_1: GRAY_1, GRAY_2: GRAY_2, GRAY_3: GRAY_3, GRAY_4: GRAY_4, GRAY_5: GRAY_5, GRAY_6: GRAY_6, GRAY_7: GRAY_7, GREEN_1: GREEN_1, GREEN_2: GREEN_2, GREEN_3: GREEN_3, GREEN_4: GREEN_4, GREEN_5: GREEN_5, ORANGE_1: ORANGE_1, ORANGE_2: ORANGE_2, ORANGE_3: ORANGE_3, ORANGE_4: ORANGE_4, ORANGE_5: ORANGE_5, PURPLE_1: PURPLE_1, PURPLE_2: PURPLE_2, PURPLE_3: PURPLE_3, PURPLE_4: PURPLE_4, PURPLE_5: PURPLE_5, PURPLE_6: PURPLE_6, PURPLE_7: PURPLE_7, RED_1: RED_1, RED_2: RED_2, RED_3: RED_3, RED_4: RED_4, RED_5: RED_5, TEAL_1: TEAL_1, TEAL_2: TEAL_2, TEAL_3: TEAL_3, TEAL_4: TEAL_4, TEAL_5: TEAL_5, WHITE: WHITE, YELLOW_1: YELLOW_1, YELLOW_2: YELLOW_2, YELLOW_3: YELLOW_3, YELLOW_4: YELLOW_4, YELLOW_5: YELLOW_5 }; var colors$2 = /*#__PURE__*/Object.freeze({ __proto__: null, BITBUCKET: BITBUCKET, BLACK: BLACK, BLUE_1: BLUE_1, BLUE_2: BLUE_2, BLUE_3: BLUE_3, BLUE_4: BLUE_4, BLUE_5: BLUE_5, CYAN_1: CYAN_1, CYAN_2: CYAN_2, CYAN_3: CYAN_3, CYAN_4: CYAN_4, CYAN_5: CYAN_5, GATSBY: GATSBY, GITLAB: GITLAB, GRAY_1: GRAY_1, GRAY_2: GRAY_2, GRAY_3: GRAY_3, GRAY_4: GRAY_4, GRAY_5: GRAY_5, GRAY_6: GRAY_6, GRAY_7: GRAY_7, GREEN_1: GREEN_1, GREEN_2: GREEN_2, GREEN_3: GREEN_3, GREEN_4: GREEN_4, GREEN_5: GREEN_5, ORANGE_1: ORANGE_1, ORANGE_2: ORANGE_2, ORANGE_3: ORANGE_3, ORANGE_4: ORANGE_4, ORANGE_5: ORANGE_5, PURPLE_1: PURPLE_1, PURPLE_2: PURPLE_2, PURPLE_3: PURPLE_3, PURPLE_4: PURPLE_4, PURPLE_5: PURPLE_5, PURPLE_6: PURPLE_6, PURPLE_7: PURPLE_7, RED_1: RED_1, RED_2: RED_2, RED_3: RED_3, RED_4: RED_4, RED_5: RED_5, TEAL_1: TEAL_1, TEAL_2: TEAL_2, TEAL_3: TEAL_3, TEAL_4: TEAL_4, TEAL_5: TEAL_5, WHITE: WHITE, YELLOW_1: YELLOW_1, YELLOW_2: YELLOW_2, YELLOW_3: YELLOW_3, YELLOW_4: YELLOW_4, YELLOW_5: YELLOW_5, 'default': colors$1 }); var Z_INDEX_NAVIGATION = 100; var Z_INDEX_DROPDOWN = 200; var Z_INDEX_NOTIFICATIONS = 300; var Z_INDEX_OVERLAY = 400; var Z_INDEX_MODAL = 500; var zIndex = /*#__PURE__*/Object.freeze({ __proto__: null, Z_INDEX_NAVIGATION: Z_INDEX_NAVIGATION, Z_INDEX_DROPDOWN: Z_INDEX_DROPDOWN, Z_INDEX_NOTIFICATIONS: Z_INDEX_NOTIFICATIONS, Z_INDEX_OVERLAY: Z_INDEX_OVERLAY, Z_INDEX_MODAL: Z_INDEX_MODAL }); var getDisplayName = function getDisplayName(component) { return component.displayName || component.name || 'Unknown'; }; var DTIcon = function DTIcon(props, propName, componentName) { var prop = props[propName]; var error = null; React.Children.forEach(prop, function (child) { if (getDisplayName(child.type) !== 'Icon') { error = new Error("`".concat(componentName, "` only accepts children of type `Icon`.")); } }); return error; }; DTIcon.isRequired = function (props, propName, componentName) { return props[propName] == null ? new Error("".concat(propName, " is required in `").concat(componentName, "`")) : DTIcon(props, propName, componentName); }; var FAIcon = PropTypes__default["default"].shape({ icon: PropTypes__default["default"].arrayOf(PropTypes__default["default"].oneOfType([PropTypes__default["default"].arrayOf(PropTypes__default["default"].any), PropTypes__default["default"].number, PropTypes__default["default"].string])).isRequired, iconName: PropTypes__default["default"].string.isRequired, prefix: PropTypes__default["default"].string.isRequired }); var HeadingLevel = PropTypes__default["default"].oneOf([1, 2, 3, 4, 5, 6]); var _excluded$13 = ["alt", "icon"]; function ownKeys$1n(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; } function _objectSpread$1n(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$1n(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$1n(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; } var Icon = function Icon(_ref) { var alt = _ref.alt, icon = _ref.icon, rest = _objectWithoutProperties__default["default"](_ref, _excluded$13); return /*#__PURE__*/jsxRuntime.jsxs(React.Fragment, { children: [alt ? /*#__PURE__*/jsxRuntime.jsx("span", { className: "sr-only", children: alt }) : null, /*#__PURE__*/jsxRuntime.jsx(reactFontawesome.FontAwesomeIcon, _objectSpread$1n({ icon: icon }, rest))] }); }; Icon.defaultProps = { alt: '' }; Icon.propTypes = { alt: PropTypes__default["default"].string, icon: FAIcon.isRequired }; var Icon$1 = Icon; var _excluded$12 = ["type"]; function ownKeys$1m(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; } function _objectSpread$1m(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$1m(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$1m(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; } var typesCSS$2 = { danger: 'bg-red-2', info: 'bg-blue-2', "new": 'bg-yellow-3', disabled: 'bg-gray-3', success: 'bg-green-2', warning: 'bg-orange-2' }; var StatusIndicator = function StatusIndicator(_ref) { var type = _ref.type, rest = _objectWithoutProperties__default["default"](_ref, _excluded$12); return /*#__PURE__*/jsxRuntime.jsx("span", _objectSpread$1m({ "aria-hidden": "true", className: "status-indicator inline-block rounded-full ".concat(typesCSS$2[type]), focusable: "false", role: "img" }, rest)); }; StatusIndicator.propTypes = { type: PropTypes__default["default"].oneOf(['danger', 'info', 'new', 'disabled', 'success', 'warning']).isRequired }; var StatusIndicator$1 = StatusIndicator; var _excluded$11 = ["icon", "imgAltText", "imgSrc", "size"]; function ownKeys$1l(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; } function _objectSpread$1l(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$1l(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$1l(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; } var avatarContainer = 'bg-gray-2 rounded-full text-gray-5 inline-flex justify-center items-center overflow-hidden text-center'; var fontSize = { small: 'text-sm', "default": 'text-base', large: 'text-xl', xlarge: 'text-2xl' }; var heightWidth = { small: 'h-4 w-4', "default": 'h-6 w-6', large: 'h-8 w-8', xlarge: 'h-10 w-10' }; var Avatar = function Avatar(_ref) { var icon = _ref.icon, imgAltText = _ref.imgAltText, imgSrc = _ref.imgSrc, size = _ref.size, rest = _objectWithoutProperties__default["default"](_ref, _excluded$11); var avatar = /*#__PURE__*/jsxRuntime.jsx(Icon$1, _objectSpread$1l({ alt: imgAltText, icon: icon, transform: "shrink-2" }, rest)); if (imgSrc) { avatar = /*#__PURE__*/jsxRuntime.jsx("img", _objectSpread$1l({ alt: imgAltText, className: "align-middle ".concat(heightWidth[size]), src: imgSrc }, rest)); } return /*#__PURE__*/jsxRuntime.jsx("div", { className: "".concat(avatarContainer, " ").concat(heightWidth[size], " ").concat(fontSize[size]), children: avatar }); }; Avatar.defaultProps = { icon: proSolidSvgIcons.faUser, imgAltText: '', imgSrc: undefined, size: 'default' }; Avatar.propTypes = { icon: FAIcon, imgAltText: PropTypes__default["default"].string, imgSrc: PropTypes__default["default"].string, size: PropTypes__default["default"].oneOf(['small', 'default', 'large', 'xlarge']) }; // Team variant // TODO: no need for a unique React component, should be deprecated in favor of <Avatar /> var AvatarTeam = function AvatarTeam(_ref2) { var props = _extends__default["default"]({}, (_objectDestructuringEmpty__default["default"](_ref2), _ref2)); return /*#__PURE__*/jsxRuntime.jsx(Avatar, _objectSpread$1l({}, props)); }; AvatarTeam.defaultProps = { icon: proSolidSvgIcons.faUsers }; var Avatar$1 = Avatar; var _excluded$10 = ["children", "className", "disabled", "isLoading", "isSubmit", "onClick", "size"]; function ownKeys$1k(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; } function _objectSpread$1k(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$1k(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$1k(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; } var sizes$2 = { "default": '', small: 'button-small' }; // TODO: Change "children" to an actual prop. A button should not allow any child within it. var ButtonBase$1 = function ButtonBase(_ref) { var children = _ref.children, className = _ref.className, disabled = _ref.disabled, isLoading = _ref.isLoading, isSubmit = _ref.isSubmit, onClick = _ref.onClick, size = _ref.size, rest = _objectWithoutProperties__default["default"](_ref, _excluded$10); return /*#__PURE__*/jsxRuntime.jsxs("button", _objectSpread$1k(_objectSpread$1k({ className: "".concat(className, " ").concat(sizes$2[size] || ''), disabled: disabled || isLoading, onClick: onClick, type: isSubmit ? 'submit' : 'button' }, rest), {}, { children: [isLoading && /*#__PURE__*/jsxRuntime.jsxs(React.Fragment, { children: [/*#__PURE__*/jsxRuntime.jsx(Icon$1, { icon: proSolidSvgIcons.faSpinnerThird, spin: true }), ' '] }), children] })); }; ButtonBase$1.defaultProps = { className: '', disabled: false, isLoading: false, isSubmit: false, size: 'default' }; ButtonBase$1.propTypes = { children: PropTypes__default["default"].node.isRequired, className: PropTypes__default["default"].string, disabled: PropTypes__default["default"].bool, isLoading: PropTypes__default["default"].bool, isSubmit: PropTypes__default["default"].bool, onClick: PropTypes__default["default"].func.isRequired, size: PropTypes__default["default"].oneOf(['default', 'small']) }; var ButtonBase$2 = ButtonBase$1; var _excluded$$ = ["children", "type"]; function ownKeys$1j(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; } function _objectSpread$1j(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$1j(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$1j(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; } var typeStyles$6 = { danger: 'button-danger', primary: 'button-primary', 'primary-alternate': 'button-primary-alternate', secondary: 'button-secondary', subtle: 'button-subtle', tertiary: 'button-tertiary', warning: 'button-warning' }; var Button$2 = function Button(_ref) { var children = _ref.children, type = _ref.type, rest = _objectWithoutProperties__default["default"](_ref, _excluded$$); return /*#__PURE__*/jsxRuntime.jsx(ButtonBase$2, _objectSpread$1j(_objectSpread$1j({ className: typeStyles$6[type] || '' }, rest), {}, { children: children })); }; Button$2.defaultProps = { disabled: false, isLoading: false, isSubmit: false, type: 'secondary' }; Button$2.propTypes = { children: PropTypes__default["default"].node.isRequired, disabled: PropTypes__default["default"].bool, isLoading: PropTypes__default["default"].bool, isSubmit: PropTypes__default["default"].bool, type: PropTypes__default["default"].oneOf(['danger', 'primary', 'primary-alternate', 'secondary', 'subtle', 'tertiary', 'warning']) }; var Button$3 = Button$2; var ButtonGroup = function ButtonGroup(_ref) { var children = _ref.children, className = _ref.className; return /*#__PURE__*/jsxRuntime.jsx("div", { className: "button-group ".concat(className || ''), children: children }); }; ButtonGroup.defaultProps = { className: '' }; ButtonGroup.propTypes = { children: PropTypes__default["default"].node.isRequired, className: PropTypes__default["default"].string }; var ButtonGroup$1 = ButtonGroup; var useClipboard = function useClipboard(text, options) { var _useState = React.useState(false), _useState2 = _slicedToArray__default["default"](_useState, 2), isCopied = _useState2[0], setIsCopied = _useState2[1]; var duration = options && options.duration; React.useEffect(function () { var id; if (isCopied && duration) { id = setTimeout(function () { setIsCopied(false); }, duration); } return function () { if (id) { clearTimeout(id); } }; }, [isCopied, duration]); var doCopy = /*#__PURE__*/function () { var _ref = _asyncToGenerator__default["default"]( /*#__PURE__*/_regeneratorRuntime__default["default"].mark(function _callee() { return _regeneratorRuntime__default["default"].wrap(function _callee$(_context) { while (1) { switch (_context.prev = _context.next) { case 0: if (!navigator.clipboard) { _context.next = 9; break; } _context.prev = 1; _context.next = 4; return navigator.clipboard.writeText(text); case 4: setIsCopied(true); _context.next = 9; break; case 7: _context.prev = 7; _context.t0 = _context["catch"](1); case 9: case "end": return _context.stop(); } } }, _callee, null, [[1, 7]]); })); return function doCopy() { return _ref.apply(this, arguments); }; }(); return [isCopied, doCopy]; }; var useClipboard$1 = useClipboard; var _excluded$_ = ["children", "clipboardOptions", "clipboardText", "type"]; function ownKeys$1i(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; } function _objectSpread$1i(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$1i(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$1i(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; } var typeStyles$5 = { primary: 'button-primary', secondary: 'button-secondary', subtle: 'button-subtle', tertiary: 'button-tertiary' }; var ClipboardButton = function ClipboardButton(_ref) { var children = _ref.children, clipboardOptions = _ref.clipboardOptions, clipboardText = _ref.clipboardText, type = _ref.type, rest = _objectWithoutProperties__default["default"](_ref, _excluded$_); var _useClipboard = useClipboard$1(clipboardText, clipboardOptions), _useClipboard2 = _slicedToArray__default["default"](_useClipboard, 2), isCopied = _useClipboard2[0], setIsCopied = _useClipboard2[1]; var getChildContent = function getChildContent() { var props = { isCopied: isCopied }; if (typeof children === 'function') { return children(props); } return children; }; return /*#__PURE__*/jsxRuntime.jsx("button", _objectSpread$1i(_objectSpread$1i({ className: typeStyles$5[type] || '', onClick: setIsCopied, type: "button" }, rest), {}, { children: getChildContent() })); }; ClipboardButton.defaultProps = { clipboardOptions: {}, clipboardText: '', type: 'primary' }; ClipboardButton.propTypes = { children: PropTypes__default["default"].oneOfType([PropTypes__default["default"].node, PropTypes__default["default"].func]).isRequired, clipboardOptions: PropTypes__default["default"].shape({ duration: PropTypes__default["default"].number }), clipboardText: PropTypes__default["default"].string, type: PropTypes__default["default"].oneOf(['primary', 'secondary', 'subtle', 'tertiary']) }; var ClipboardButton$1 = ClipboardButton; var closeButtonStyles = { danger: 'text-red-4 hover:text-red-4', "default": 'text-gray-4 close-button-hover-default', info: 'text-blue-4 hover:text-blue-4', pantheor: 'text-purple-4 hover:text-purple-4', success: 'text-green-4 hover:text-green-4', warning: 'text-orange-4 hover:text-orange-4' }; var CloseButton = function CloseButton(_ref) { var callback = _ref.callback, className = _ref.className, type = _ref.type; return /*#__PURE__*/jsxRuntime.jsx(ButtonBase$2, { "aria-label": "Close", className: "close-button ".concat(className || '', " ").concat(closeButtonStyles[type] || closeButtonStyles["default"]), onClick: callback, children: /*#__PURE__*/jsxRuntime.jsx(Icon$1, { icon: proSolidSvgIcons.faTimes }) }); }; CloseButton.defaultProps = { className: '', type: 'default' }; CloseButton.propTypes = { callback: PropTypes__default["default"].func.isRequired, className: PropTypes__default["default"].string, type: PropTypes__default["default"].string }; var CloseButton$1 = CloseButton; var _excluded$Z = ["children", "disabled", "isLoading", "size", "type"]; function ownKeys$1h(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; } function _objectSpread$1h(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$1h(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$1h(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; } var sizeStyles = { small: 'button-small', "default": '' }; var typeStyles$4 = { primary: 'button-primary', secondary: 'button-secondary', subtle: 'button-subtle', tertiary: 'button-tertiary' }; var DropdownButton = function DropdownButton(_ref) { var children = _ref.children, disabled = _ref.disabled, isLoading = _ref.isLoading, size = _ref.size, type = _ref.type, rest = _objectWithoutProperties__default["default"](_ref, _excluded$Z); var icon = isLoading ? proSolidSvgIcons.faSpinnerThird : proSolidSvgIcons.faChevronDown; return /*#__PURE__*/jsxRuntime.jsxs(menuButton.MenuButton, _objectSpread$1h(_objectSpread$1h({ className: "".concat(typeStyles$4[type] || '', " ").concat(sizeStyles[size] || ''), disabled: disabled || isLoading }, rest), {}, { children: [children, " ", /*#__PURE__*/jsxRuntime.jsx(Icon$1, { "aria-hidden": true, icon: icon, spin: isLoading })] })); }; DropdownButton.defaultProps = { disabled: false, isLoading: false, size: 'default' }; DropdownButton.propTypes = { children: PropTypes__default["default"].node.isRequired, /** * Whether the button is in a disabled state or not */ disabled: PropTypes__default["default"].bool, /** * Whether the button is in a loading state or not */ isLoading: PropTypes__default["default"].bool, /** * Size of the button */ size: PropTypes__default["default"].oneOf(['default', 'small']), /** * Variant of the button */ type: PropTypes__default["default"].oneOf(['primary', 'secondary', 'subtle', 'tertiary']).isRequired }; var DropdownButton$1 = DropdownButton; var _excluded$Y = ["ariaLabel", "children", "disabled", "imgSrc", "imgAltText", "isPersonal"]; function ownKeys$1g(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; } function _objectSpread$1g(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$1g(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$1g(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; } var GlobalPrimaryContextButton = function GlobalPrimaryContextButton(_ref) { var ariaLabel = _ref.ariaLabel, children = _ref.children, disabled = _ref.disabled, imgSrc = _ref.imgSrc, imgAltText = _ref.imgAltText, isPersonal = _ref.isPersonal, rest = _objectWithoutProperties__default["default"](_ref, _excluded$Y); return /*#__PURE__*/jsxRuntime.jsxs(menuButton.MenuButton, _objectSpread$1g(_objectSpread$1g({ "aria-label": ariaLabel, className: "button-subtle", disabled: disabled }, rest), {}, { children: [/*#__PURE__*/jsxRuntime.jsxs("div", { className: "relative mb-1 h-10", children: [isPersonal ? /*#__PURE__*/jsxRuntime.jsx(Avatar$1, { imgAltText: imgAltText, imgSrc: imgSrc, size: "xlarge" }) : /*#__PURE__*/jsxRuntime.jsx(AvatarTeam, { imgAltText: imgAltText, imgSrc: imgSrc, size: "xlarge" }), /*#__PURE__*/jsxRuntime.jsx(Icon$1, { "aria-hidden": true, className: "absolute right-2 top-1/2 transform -translate-y-1/2", icon: proSolidSvgIcons.faChevronDown })] }), children] })); }; GlobalPrimaryContextButton.defaultProps = { disabled: false, imgAltText: '', imgSrc: '', isPersonal: false }; GlobalPrimaryContextButton.propTypes = { /** * ARIA label for button */ ariaLabel: PropTypes__default["default"].string.isRequired, children: PropTypes__default["default"].node.isRequired, /** * The disabled state of the button */ disabled: PropTypes__default["default"].bool, /** * Alternative text for the icon/avatar */ imgAltText: PropTypes__default["default"].string, /** * Image or icon to use other than the default team icon */ imgSrc: PropTypes__default["default"].string, /** * Set whether to use a personal avatar image or icon */ isPersonal: PropTypes__default["default"].bool }; var GlobalPrimaryContextButton$1 = GlobalPrimaryContextButton; // eslint-disable-next-line import/prefer-default-export var ACTIVE_STATE_CLASS_NAME = 'active'; var _excluded$X = ["children", "disabled", "icon", "path"]; function ownKeys$1f(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; } function _objectSpread$1f(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$1f(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$1f(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; } var GlobalPrimaryDropdownButton = function GlobalPrimaryDropdownButton(_ref) { var children = _ref.children, disabled = _ref.disabled, icon = _ref.icon, path = _ref.path, rest = _objectWithoutProperties__default["default"](_ref, _excluded$X); var activeMatch = reactRouterDom.useMatch(path); var className = activeMatch ? "button-subtle ".concat(ACTIVE_STATE_CLASS_NAME) : 'button-subtle'; return /*#__PURE__*/jsxRuntime.jsxs(menuButton.MenuButton, _objectSpread$1f(_objectSpread$1f({ className: className, disabled: disabled }, rest), {}, { children: [/*#__PURE__*/jsxRuntime.jsxs("div", { className: "relative mb-1", children: [/*#__PURE__*/jsxRuntime.jsx(Icon$1, { icon: icon, size: "lg" }), /*#__PURE__*/jsxRuntime.jsx(Icon$1, { "aria-hidden": true, className: "absolute right-1/2 top-1/2 transform translate-x-6 -translate-y-1/2", icon: proSolidSvgIcons.faChevronDown })] }), /*#__PURE__*/jsxRuntime.jsx("div", { className: "mt-1", children: children })] })); }; GlobalPrimaryDropdownButton.defaultProps = { disabled: false }; GlobalPrimaryDropdownButton.propTypes = { children: PropTypes__default["default"].node.isRequired, /** * The disabled state of the button */ disabled: PropTypes__default["default"].bool, /** * Icon to use for the button */ icon: FAIcon.isRequired, /** * Path scope (i.e.: 'support/*') */ path: PropTypes__default["default"].string.isRequired }; var GlobalPrimaryDropdownButton$1 = GlobalPrimaryDropdownButton; var _excluded$W = ["ariaLabel", "disabled", "icon", "isLoading", "size"]; function ownKeys$1e(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; } function _objectSpread$1e(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$1e(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$1e(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; } var IconDropdownButton = function IconDropdownButton(_ref) { var ariaLabel = _ref.ariaLabel, disabled = _ref.disabled, icon = _ref.icon, isLoading = _ref.isLoading, size = _ref.size, rest = _objectWithoutProperties__default["default"](_ref, _excluded$W); var menuIcon = isLoading ? proSolidSvgIcons.faSpinnerThird : icon; return /*#__PURE__*/jsxRuntime.jsx(menuButton.MenuButton, _objectSpread$1e(_objectSpread$1e({ "aria-label": ariaLabel, className: "icon-dropdown-button", disabled: disabled || isLoading }, rest), {}, { children: /*#__PURE__*/jsxRuntime.jsx(Icon$1, { "aria-hidden": true, icon: menuIcon, size: size, spin: isLoading }) })); }; IconDropdownButton.defaultProps = { disabled: false, isLoading: false, size: '2x' }; IconDropdownButton.propTypes = { /** * ARIA label that describes the purpose of this button */ ariaLabel: PropTypes__default["default"].string.isRequired, /** * Whether the button is in a disabled state or not */ disabled: PropTypes__default["default"].bool, /** * Which icon will the button be */ icon: FAIcon.isRequired, /** * Whether the button is in a loading state or not */ isLoading: PropTypes__default["default"].bool, /** * Size of the icon */ size: PropTypes__default["default"].oneOf(['xs', 'sm', 'lg', '2x', '3x', '4x', '5x', '6x', '7x', '8x', '9x', '10x']) }; var IconDropdownButton$1 = IconDropdownButton; var _excluded$V = ["children", "disabled", "href", "type"]; function ownKeys$1d(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; } function _objectSpread$1d(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$1d(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$1d(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; } var typeStyles$3 = { primary: 'link-primary', secondary: 'link-secondary', subtle: 'link-subtle', tertiary: 'link-tertiary', github: 'link-github', gitlab: 'link-gitlab', bitbucket: 'link-bitbucket' }; var LinkButton = function LinkButton(_ref) { var children = _ref.children, disabled = _ref.disabled, href = _ref.href, type = _ref.type, rest = _objectWithoutProperties__default["default"](_ref, _excluded$V); var style = typeStyles$3[type] || ''; return disabled ? /*#__PURE__*/jsxRuntime.jsx(ButtonBase$2, _objectSpread$1d(_objectSpread$1d({ className: style, disabled: true, onClick: function onClick() {} }, rest), {}, { children: children })) : /*#__PURE__*/jsxRuntime.jsx("a", _objectSpread$1d(_objectSpread$1d({ className: style, href: href }, rest), {}, { children: children })); }; LinkButton.propTypes = { children: PropTypes__default["default"].node.isRequired, disabled: PropTypes__default["default"].bool, href: PropTypes__default["default"].string.isRequired, type: PropTypes__default["default"].oneOf(Object.keys(typeStyles$3)).isRequired }; LinkButton.defaultProps = { disabled: false }; var LinkButton$1 = LinkButton; var _excluded$U = ["ariaLabel", "isLoading"]; function ownKeys$1c(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; } function _objectSpread$1c(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$1c(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$1c(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; } var MeatballDropdownButton = function MeatballDropdownButton(_ref) { var ariaLabel = _ref.ariaLabel, isLoading = _ref.isLoading, rest = _objectWithoutProperties__default["default"](_ref, _excluded$U); return /*#__PURE__*/jsxRuntime.jsx(IconDropdownButton$1, _objectSpread$1c({ ariaLabel: ariaLabel, className: "w-10 h-10 px-4 py-0 border-solid border-gray-3", icon: proSolidSvgIcons.faEllipsisV, isLoading: isLoading, size: "sm" }, rest)); }; MeatballDropdownButton.defaultProps = { isLoading: false }; MeatballDropdownButton.propTypes = { /** * ARIA label that describes the purpose of this button */ ariaLabel: PropTypes__default["default"].string.isRequired, /** * Whether the button is in a loading state or not */ isLoading: PropTypes__default["default"].bool }; var MeatballDropdownButton$1 = MeatballDropdownButton; var _excluded$T = ["children", "disabled", "to", "type"]; function ownKeys$1b(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; } function _objectSpread$1b(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$1b(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$1b(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; } var typeStyles$2 = { primary: 'link-primary', secondary: 'link-secondary', subtle: 'link-subtle', tertiary: 'link-tertiary' }; var RouterLinkButton = function RouterLinkButton(_ref) { var children = _ref.children, disabled = _ref.disabled, to = _ref.to, type = _ref.type, rest = _objectWithoutProperties__default["default"](_ref, _excluded$T); var style = typeStyles$2[type] || ''; return disabled ? /*#__PURE__*/jsxRuntime.jsx(ButtonBase$2, _objectSpread$1b(_objectSpread$1b({ className: style, disabled: true, onClick: function onClick() {} }, rest), {}, { children: children })) : /*#__PURE__*/jsxRuntime.jsx(reactRouterDom.Link, _objectSpread$1b(_objectSpread$1b({ className: style, to: to }, rest), {}, { children: children })); }; RouterLinkButton.propTypes = { children: PropTypes__default["default"].node.isRequired, disabled: PropTypes__default["default"].bool, to: PropTypes__default["default"].string.isRequired, type: PropTypes__default["default"].oneOf(['primary', 'secondary', 'subtle', 'tertiary']).isRequired }; RouterLinkButton.defaultProps = { disabled: false }; var RouterLinkButton$1 = RouterLinkButton; var _excluded$S = ["children", "size"]; function ownKeys$1a(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; } function _objectSpread$1a(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$1a(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$1a(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; } var DropdownMenu = function DropdownMenu(_ref) { var children = _ref.children, size = _ref.size, rest = _objectWithoutProperties__default["default"](_ref, _excluded$S); var sizeStyles; if (size === 'large') { sizeStyles = { maxWidth: 588, width: "".concat(100 / 2, "vw") }; } else if (size === 'small') { sizeStyles = { maxWidth: 294, width: "".concat(100 / 4, "vw") }; } else { sizeStyles = { maxWidth: 392, width: "".concat(100 / 3, "vw") }; } return /*#__PURE__*/jsxRuntime.jsx(menuButton.MenuList, _objectSpread$1a(_objectSpread$1a({}, rest), {}, { className: "bg-white border border-solid border-gray-3 rounded shadow-dropdown mt-1 overflow-hidden dd-styles", style: sizeStyles, children: children })); }; DropdownMenu.defaultProps = { size: 'default' }; DropdownMenu.propTypes = { children: PropTypes__default["default"].node.isRequired, /** * Set the width and maximum width of the menu overlay (list of items) */ size: PropTypes__default["default"].oneOf(['default', 'large', 'small']) }; var DropdownMenu$1 = DropdownMenu; function ownKeys$19(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; } function _objectSpread$19(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$19(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$19(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; } var ToggleButton$2 = function ToggleButton(_ref) { var disabled = _ref.disabled, getToggleButtonProps = _ref.getToggleButtonProps, setTouched = _ref.setTouched, toggleButtonLabelText = _ref.toggleButtonLabelText; return /*#__PURE__*/jsxRuntime.jsx("button", _objectSpread$19(_objectSpread$19({}, getToggleButtonProps({ onClick: function onClick() { return setTouched(true); } })), {}, { "aria-label": toggleButtonLabelText, className: "absolute top-0 right-0 p-2 border-0", disabled: disabled, type: "button", children: /*#__PURE__*/jsxRuntime.jsx(Icon$1, { icon: proLightSvgIcons.faChevronDown }) })); }; ToggleButton$2.defaultProps = { disabled: false }; ToggleButton$2.propTypes = { disabled: PropTypes__default["default"].bool, getToggleButtonProps: PropTypes__default["default"].func.isRequired, setTouched: PropTypes__default["default"].func.isRequired, toggleButtonLabelText: PropTypes__default["default"].string.isRequired }; var ToggleButton$3 = ToggleButton$2; var _excluded$R = ["disabled", "field", "getToggleButtonProps", "hideDownButton", "initialValue", "inputRef", "noBorder", "onBlur", "toggleButtonLabelText", "userInput", "validate", "validateOnBlur", "validateOnChange", "validateOnMount"]; function ownKeys$18(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; } function _objectSpread$18(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$18(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$18(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; } var Input = function Input(props) { var disabled = props.disabled; props.field; var getToggleButtonProps = props.getToggleButtonProps, hideDownButton = props.hideDownButton; props.initialValue; var inputRef = props.inputRef, noBorder = props.noBorder, onBlur = props.onBlur, toggleButtonLabelText = props.toggleButtonLabelText, userInput = props.userInput; props.validate; var validateOnBlur = props.validateOnBlur, validateOnChange = props.validateOnChange, validateOnMount = props.validateOnMount, rest = _objectWithoutProperties__default["default"](props, _excluded$R); /** * if you need a custom onBlur or