studiokit-scaffolding-js 7.0.11-alpha.7 → 7.0.12-next.1.3

package/lib/components/ActionList.d.ts

@@ -1,4 +1,4 @@
-import { FunctionComponent } from 'react';
+import React, { FunctionComponent } from 'react';
 import { Model } from '../types';
 export interface ActionListProps {
     actions?: ListAction[];
@@ -11,7 +11,7 @@ export interface ListAction {
     predicate: boolean;
     action: () => void;
     name: string;
-    icon: JSX.Element;
+    icon: React.JSX.Element;
     className: string;
     id: string;
     isDefault?: boolean;

package/lib/components/ActionList.js

@@ -1,58 +1,19 @@
 "use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-var __spreadArrays = (this && this.__spreadArrays) || function () {
-    for (var s = 0, i = 0, il = arguments.length; i < il; i++) s += arguments[i].length;
-    for (var r = Array(s), k = 0, i = 0; i < il; i++)
-        for (var a = arguments[i], j = 0, jl = a.length; j < jl; j++, k++)
-            r[k] = a[j];
-    return r;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.ActionList = void 0;
-var core_1 = require("@material-ui/core");
-var MoreVert_1 = __importDefault(require("@material-ui/icons/MoreVert"));
-var react_1 = __importStar(require("react"));
-var ActionList = function (_a) {
-    var _b = _a.actions, actions = _b === void 0 ? [] : _b, _c = _a.model, model = _c === void 0 ? null : _c, className = _a.className, alwaysShowKebab = _a.alwaysShowKebab;
-    var anchorRef = react_1.default.useRef(null);
-    var _d = react_1.useState(undefined), infoMenuAnchorElement = _d[0], setInfoMenuAnchorElement = _d[1];
-    var onActionItemClick = function (action) { return function () {
+const tslib_1 = require("tslib");
+const jsx_runtime_1 = require("react/jsx-runtime");
+const core_1 = require("@material-ui/core");
+const MoreVert_1 = tslib_1.__importDefault(require("@material-ui/icons/MoreVert"));
+const react_1 = tslib_1.__importStar(require("react"));
+const ActionList = ({ actions = [], model = null, className, alwaysShowKebab }) => {
+    const anchorRef = react_1.default.useRef(null);
+    const [infoMenuAnchorElement, setInfoMenuAnchorElement] = (0, react_1.useState)(undefined);
+    const onActionItemClick = (action) => () => {
         setInfoMenuAnchorElement(undefined);
         action === null || action === void 0 ? void 0 : action();
-    }; };
-    var handleListKeyDown = function (event) {
+    };
+    const handleListKeyDown = (event) => {
         var _a;
         if (event.key === 'Tab' || event.key === 'Escape' || event.key === 'Esc') {
             event.preventDefault();
@@ -60,35 +21,21 @@ var ActionList = function (_a) {
             (_a = anchorRef.current) === null || _a === void 0 ? void 0 : _a.focus();
         }
     };
-    var allowedActions = actions.filter(function (a) { return a.predicate; });
-    var actionCount = allowedActions.length;
-    var defaultAction = actionCount === 1 && !alwaysShowKebab ? allowedActions[0] : allowedActions.find(function (a) { return !!a.isDefault; });
+    let allowedActions = actions.filter((a) => a.predicate);
+    const actionCount = allowedActions.length;
+    const defaultAction = actionCount === 1 && !alwaysShowKebab ? allowedActions[0] : allowedActions.find(a => !!a.isDefault);
     if (defaultAction) {
-        allowedActions = allowedActions.filter(function (a) { return a !== defaultAction; });
+        allowedActions = allowedActions.filter(a => a !== defaultAction);
     }
-    return (react_1.default.createElement("div", { className: !!defaultAction && !!model && (actionCount > 1 || alwaysShowKebab) ? 'inline-flex' : 'di' },
-        !!defaultAction && (react_1.default.createElement(core_1.Button, { color: "primary", onClick: defaultAction.action, id: defaultAction.id, className: defaultAction.className || '', disabled: defaultAction.disabled },
-            defaultAction.icon,
-            defaultAction.name)),
-        !!model && (actionCount > 1 || alwaysShowKebab) && (react_1.default.createElement(react_1.default.Fragment, null,
-            react_1.default.createElement(core_1.Button, { ref: anchorRef, onClick: function (event) { return setInfoMenuAnchorElement(event.currentTarget); }, "aria-label": "Actions", "aria-haspopup": "true", "aria-controls": infoMenuAnchorElement ? "info-menu-" + model.id : undefined, className: "action-list-text-button" + (defaultAction ? ' with-default-action' : ''), color: "primary" },
-                "Actions",
-                react_1.default.createElement(MoreVert_1.default, { color: "primary" })),
-            react_1.default.createElement(core_1.IconButton, { ref: anchorRef, onClick: function (event) { return setInfoMenuAnchorElement(event.currentTarget); }, "aria-label": "Actions", "aria-haspopup": "true", "aria-controls": infoMenuAnchorElement ? "info-menu-" + model.id : undefined, className: "action-list-icon-button" + (defaultAction ? ' with-default-action' : '') },
-                react_1.default.createElement(MoreVert_1.default, { color: "primary" })),
-            react_1.default.createElement(core_1.Popper, { open: !!infoMenuAnchorElement, anchorEl: infoMenuAnchorElement, placement: "bottom-end", className: "z-1" + (className ? " " + className : ''), transition: true }, function (_a) {
-                var TransitionProps = _a.TransitionProps, placement = _a.placement;
-                return (react_1.default.createElement(core_1.Grow, __assign({}, TransitionProps, { style: { transformOrigin: placement === 'bottom-end' ? 'top right' : 'bottom right' } }),
-                    react_1.default.createElement(core_1.Paper, null,
-                        react_1.default.createElement(core_1.ClickAwayListener, { onClickAway: onActionItemClick() },
-                            react_1.default.createElement(core_1.MenuList, { id: "info-menu-" + model.id, autoFocusItem: !!infoMenuAnchorElement, onKeyDown: handleListKeyDown, className: "action-list shadow-large" }, allowedActions.map(function (a, index) {
-                                return a.predicate
-                                    ? __spreadArrays((index > 0 ? [react_1.default.createElement(core_1.Divider, null)] : []), [
-                                        react_1.default.createElement(core_1.MenuItem, { key: a.id, className: "action-list-menu mv1 pv2 " + a.className, onClick: onActionItemClick(a.action), color: "primary", disabled: a.disabled },
-                                            a.icon,
-                                            a.name)
-                                    ]) : undefined;
-                            }))))));
-            })))));
+    return ((0, jsx_runtime_1.jsxs)("div", { className: !!defaultAction && !!model && (actionCount > 1 || alwaysShowKebab) ? 'inline-flex' : 'di', children: [!!defaultAction && ((0, jsx_runtime_1.jsxs)(core_1.Button, { color: "primary", onClick: defaultAction.action, id: defaultAction.id, className: defaultAction.className || '', disabled: defaultAction.disabled, children: [defaultAction.icon, defaultAction.name] })), !!model && (actionCount > 1 || alwaysShowKebab) && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(core_1.Button, { ref: anchorRef, onClick: event => {
+                            setInfoMenuAnchorElement(event.currentTarget);
+                        }, "aria-label": "Actions", "aria-haspopup": "true", "aria-controls": infoMenuAnchorElement ? `info-menu-${model.id}` : undefined, className: `action-list-text-button${defaultAction ? ' with-default-action' : ''}`, color: "primary", children: ["Actions", (0, jsx_runtime_1.jsx)(MoreVert_1.default, { color: "primary" })] }), (0, jsx_runtime_1.jsx)(core_1.IconButton, { ref: anchorRef, onClick: event => {
+                            setInfoMenuAnchorElement(event.currentTarget);
+                        }, "aria-label": "Actions", "aria-haspopup": "true", "aria-controls": infoMenuAnchorElement ? `info-menu-${model.id}` : undefined, className: `action-list-icon-button${defaultAction ? ' with-default-action' : ''}`, children: (0, jsx_runtime_1.jsx)(MoreVert_1.default, { color: "primary" }) }), (0, jsx_runtime_1.jsx)(core_1.Popper, { open: !!infoMenuAnchorElement, anchorEl: infoMenuAnchorElement, placement: "bottom-end", className: `z-1${className ? ` ${className}` : ''}`, transition: true, children: ({ TransitionProps, placement }) => ((0, jsx_runtime_1.jsx)(core_1.Grow, Object.assign({}, TransitionProps, { style: { transformOrigin: placement === 'bottom-end' ? 'top right' : 'bottom right' }, children: (0, jsx_runtime_1.jsx)(core_1.Paper, { children: (0, jsx_runtime_1.jsx)(core_1.ClickAwayListener, { onClickAway: onActionItemClick(), children: (0, jsx_runtime_1.jsx)(core_1.MenuList, { id: `info-menu-${model.id}`, autoFocusItem: !!infoMenuAnchorElement, onKeyDown: handleListKeyDown, className: "action-list shadow-large", children: allowedActions.map((a, index) => a.predicate
+                                            ? [
+                                                ...(index > 0 ? [(0, jsx_runtime_1.jsx)(core_1.Divider, {})] : []),
+                                                (0, jsx_runtime_1.jsxs)(core_1.MenuItem, { className: `action-list-menu mv1 pv2 ${a.className}`, onClick: onActionItemClick(a.action), color: "primary", disabled: a.disabled, children: [a.icon, a.name] }, a.id)
+                                            ]
+                                            : undefined) }) }) }) }))) })] }))] }));
 };
 exports.ActionList = ActionList;

package/lib/components/AlertDialog.d.ts

@@ -1,9 +1,9 @@
-import { FunctionComponent, MouseEventHandler } from 'react';
+import React, { FunctionComponent, MouseEventHandler } from 'react';
 export interface AlertDialogProps {
     id?: string;
     isOpen: boolean;
-    title: string | JSX.Element;
-    description?: string | JSX.Element | void;
+    title: string | React.JSX.Element;
+    description?: string | React.JSX.Element;
     onProceed?: MouseEventHandler<HTMLElement>;
     proceedText?: string;
     /** onCancel is needed for closing using the X button, clicking the backdrop, or clicking the cancel button*/

package/lib/components/AlertDialog.js

@@ -1,22 +1,13 @@
 "use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.AlertDialog = void 0;
-var Button_1 = __importDefault(require("@material-ui/core/Button"));
-var react_1 = __importDefault(require("react"));
-var react_bootstrap_1 = require("react-bootstrap");
-var ConnectedModal_1 = __importDefault(require("./ConnectedModal"));
-var AlertDialog = function (props) {
-    var isOpen = props.isOpen, title = props.title, description = props.description, onProceed = props.onProceed, proceedText = props.proceedText, onCancel = props.onCancel, cancelText = props.cancelText, hideCancel = props.hideCancel, onDestroy = props.onDestroy, destroyText = props.destroyText, manualBackground = props.manualBackground;
-    return (react_1.default.createElement(ConnectedModal_1.default, { show: isOpen, onHide: onCancel, className: "z-9999" + (manualBackground ? ' bg-black-50' : '') },
-        react_1.default.createElement(react_bootstrap_1.Modal.Header, { closeButton: true },
-            react_1.default.createElement(react_bootstrap_1.Modal.Title, null, title)),
-        !!description && react_1.default.createElement(react_bootstrap_1.Modal.Body, null, description),
-        react_1.default.createElement(react_bootstrap_1.Modal.Footer, null,
-            !!onProceed && (react_1.default.createElement(Button_1.default, { id: "alert-dialog-proceed-btn", "aria-label": proceedText || 'Confirm', className: "btn-primary ttc fr mb1", color: "primary", onClick: onProceed }, proceedText || 'Confirm')),
-            !hideCancel && (react_1.default.createElement(Button_1.default, { id: "alert-dialog-cancel-btn", color: "primary", "aria-label": cancelText || 'Cancel', className: "btn-text ttc" + (onDestroy ? ' fr' : ' fl') + " " + (onProceed ? ' mr1' : ''), onClick: onCancel }, cancelText || 'Cancel')),
-            !!onDestroy && (react_1.default.createElement(Button_1.default, { id: "alert-dialog-destroy-btn", "aria-label": destroyText || 'Destroy', color: "secondary", className: "btn-text color-red ttc fl", onClick: onDestroy }, destroyText || 'Destroy')))));
+const tslib_1 = require("tslib");
+const jsx_runtime_1 = require("react/jsx-runtime");
+const Button_1 = tslib_1.__importDefault(require("@material-ui/core/Button"));
+const react_bootstrap_1 = require("react-bootstrap");
+const ConnectedModal_1 = tslib_1.__importDefault(require("./ConnectedModal"));
+const AlertDialog = (props) => {
+    const { isOpen, title, description, onProceed, proceedText, onCancel, cancelText, hideCancel, onDestroy, destroyText, manualBackground } = props;
+    return ((0, jsx_runtime_1.jsxs)(ConnectedModal_1.default, { show: isOpen, onHide: onCancel, className: `z-9999${manualBackground ? ' bg-black-50' : ''}`, children: [(0, jsx_runtime_1.jsx)(react_bootstrap_1.Modal.Header, { closeButton: true, children: (0, jsx_runtime_1.jsx)(react_bootstrap_1.Modal.Title, { children: title }) }), !!description && (0, jsx_runtime_1.jsx)(react_bootstrap_1.Modal.Body, { children: description }), (0, jsx_runtime_1.jsxs)(react_bootstrap_1.Modal.Footer, { children: [!!onProceed && ((0, jsx_runtime_1.jsx)(Button_1.default, { id: "alert-dialog-proceed-btn", "aria-label": proceedText || 'Confirm', className: "btn-primary ttc fr mb1", color: "primary", onClick: onProceed, children: proceedText || 'Confirm' })), !hideCancel && ((0, jsx_runtime_1.jsx)(Button_1.default, { id: "alert-dialog-cancel-btn", color: "primary", "aria-label": cancelText || 'Cancel', className: `btn-text ttc${onDestroy ? ' fr' : ' fl'} ${onProceed ? ' mr1' : ''}`, onClick: onCancel, children: cancelText || 'Cancel' })), !!onDestroy && ((0, jsx_runtime_1.jsx)(Button_1.default, { id: "alert-dialog-destroy-btn", "aria-label": destroyText || 'Destroy', color: "secondary", className: "btn-text color-red ttc fl", onClick: onDestroy, children: destroyText || 'Destroy' }))] })] }));
 };
 exports.AlertDialog = AlertDialog;

package/lib/components/AlertWithIcon.js

@@ -1,58 +1,32 @@
 "use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.AlertWithIcon = void 0;
-var CheckCircle_1 = __importDefault(require("@material-ui/icons/CheckCircle"));
-var Error_1 = __importDefault(require("@material-ui/icons/Error"));
-var Info_1 = __importDefault(require("@material-ui/icons/Info"));
-var Warning_1 = __importDefault(require("@material-ui/icons/Warning"));
-var react_1 = __importDefault(require("react"));
-var react_bootstrap_1 = require("react-bootstrap");
+const tslib_1 = require("tslib");
+const jsx_runtime_1 = require("react/jsx-runtime");
+const CheckCircle_1 = tslib_1.__importDefault(require("@material-ui/icons/CheckCircle"));
+const Error_1 = tslib_1.__importDefault(require("@material-ui/icons/Error"));
+const Info_1 = tslib_1.__importDefault(require("@material-ui/icons/Info"));
+const Warning_1 = tslib_1.__importDefault(require("@material-ui/icons/Warning"));
+const react_bootstrap_1 = require("react-bootstrap");
 function getIconForVariant(variant, iconClassName) {
-    var combinedIconClassName = "self-start mr2 " + (iconClassName ? " " + iconClassName : '');
+    const combinedIconClassName = `self-start mr2 ${iconClassName ? ` ${iconClassName}` : ''}`;
     switch (variant) {
         case 'success':
-            return react_1.default.createElement(CheckCircle_1.default, { className: combinedIconClassName });
+            return (0, jsx_runtime_1.jsx)(CheckCircle_1.default, { className: combinedIconClassName });
         case 'info':
-            return react_1.default.createElement(Info_1.default, { className: combinedIconClassName });
+            return (0, jsx_runtime_1.jsx)(Info_1.default, { className: combinedIconClassName });
         case 'warning':
-            return react_1.default.createElement(Warning_1.default, { className: combinedIconClassName });
+            return (0, jsx_runtime_1.jsx)(Warning_1.default, { className: combinedIconClassName });
         case 'danger':
-            return react_1.default.createElement(Error_1.default, { className: combinedIconClassName });
+            return (0, jsx_runtime_1.jsx)(Error_1.default, { className: combinedIconClassName });
         default:
             return null;
     }
 }
-var AlertWithIcon = function (props) {
-    var iconClassName = props.iconClassName, className = props.className, children = props.children, variant = props.variant, otherProps = __rest(props, ["iconClassName", "className", "children", "variant"]);
-    var combinedClassName = "alert-with-icon" + (className ? " " + className : '');
-    var Icon = getIconForVariant(variant, iconClassName);
-    return (react_1.default.createElement(react_bootstrap_1.Alert, __assign({ className: combinedClassName, variant: variant }, otherProps),
-        Icon,
-        props.children));
+const AlertWithIcon = props => {
+    const { iconClassName, className, children, variant } = props, otherProps = tslib_1.__rest(props, ["iconClassName", "className", "children", "variant"]);
+    const combinedClassName = `alert-with-icon${className ? ` ${className}` : ''}`;
+    const Icon = getIconForVariant(variant, iconClassName);
+    return ((0, jsx_runtime_1.jsxs)(react_bootstrap_1.Alert, Object.assign({ className: combinedClassName, variant: variant }, otherProps, { children: [Icon, props.children] })));
 };
 exports.AlertWithIcon = AlertWithIcon;

package/lib/components/ConnectedModal.d.ts

@@ -1,7 +1,6 @@
-import React from 'react';
 import { ModalProps } from 'react-bootstrap';
-declare const _default: React.ComponentClass<ModalProps, any>;
 /**
  * Wrapped version of "react-bootstrap"'s `Modal` component. Uses `ConnectedModalComponent` to coordinate modal state in redux.
  */
+declare const _default: import("react").ComponentClass<ModalProps, any>;
 export default _default;

package/lib/components/ConnectedModal.js

@@ -1,40 +1,16 @@
 "use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
-var react_1 = __importDefault(require("react"));
-var react_bootstrap_1 = require("react-bootstrap");
-var ConnectedModalComponent_1 = __importDefault(require("./HOC/ConnectedModalComponent"));
-var ConnectedModal = function (_a) {
-    var 
+const tslib_1 = require("tslib");
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_bootstrap_1 = require("react-bootstrap");
+const ConnectedModalComponent_1 = tslib_1.__importDefault(require("./HOC/ConnectedModalComponent"));
+const ConnectedModal = (_a) => {
+    var { 
     // exclude props that shouldn't be passed to the Modal
-    guid = _a.guid, modals = _a.modals, isTopOpenFullscreenModal = _a.isTopOpenFullscreenModal, dispatch = _a.dispatch, modalProps = __rest(_a, ["guid", "modals", "isTopOpenFullscreenModal", "dispatch"]);
-    return react_1.default.createElement(react_bootstrap_1.Modal, __assign({}, modalProps));
+    guid, modals, isTopOpenFullscreenModal, dispatch } = _a, modalProps = tslib_1.__rest(_a, ["guid", "modals", "isTopOpenFullscreenModal", "dispatch"]);
+    return (0, jsx_runtime_1.jsx)(react_bootstrap_1.Modal, Object.assign({}, modalProps));
 };
 /**
  * Wrapped version of "react-bootstrap"'s `Modal` component. Uses `ConnectedModalComponent` to coordinate modal state in redux.
  */
-exports.default = ConnectedModalComponent_1.default(ConnectedModal);
+exports.default = (0, ConnectedModalComponent_1.default)(ConnectedModal);

package/lib/components/Dropdowns/GroupsDropdown.d.ts

@@ -1,4 +1,4 @@
-import React, { Component } from 'react';
+import { Component } from 'react';
 import { ExternalTerm, Group, ModelCollection } from '../../types';
 interface Props {
     title: string;
@@ -10,8 +10,8 @@ interface Props {
 declare class GroupsDropdown extends Component<Props> {
     loadGroups: () => void;
     didToggle: (isOpen: boolean) => void;
-    renderGroupMenu: (groups: Group[]) => React.JSX.Element[] | null;
-    render(): React.JSX.Element | null;
+    renderGroupMenu: (groups: Group[]) => import("react/jsx-runtime").JSX.Element[];
+    render(): import("react/jsx-runtime").JSX.Element | null;
 }
-declare const _default: import("react-redux").ConnectedComponent<typeof GroupsDropdown, Pick<React.ClassAttributes<GroupsDropdown> & Props, "ref" | "title" | "id" | "key" | "anyRoleButLearner">>;
+declare const _default: import("react-redux").ConnectedComponent<typeof GroupsDropdown, import("react-redux").Omit<import("react").ClassAttributes<GroupsDropdown> & Props, "externalTerms" | "groups">>;
 export default _default;

package/lib/components/Dropdowns/GroupsDropdown.js

@@ -1,86 +1,48 @@
 "use strict";
-var __extends = (this && this.__extends) || (function () {
-    var extendStatics = function (d, b) {
-        extendStatics = Object.setPrototypeOf ||
-            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
-        return extendStatics(d, b);
-    };
-    return function (d, b) {
-        extendStatics(d, b);
-        function __() { this.constructor = d; }
-        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-    };
-})();
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
 Object.defineProperty(exports, "__esModule", { value: true });
-var react_1 = __importStar(require("react"));
-var react_bootstrap_1 = require("react-bootstrap");
-var react_redux_1 = require("react-redux");
-var react_router_bootstrap_1 = require("react-router-bootstrap");
-var actionCreator_1 = require("../../redux/actionCreator");
-var date_1 = require("../../utils/date");
-var groupDates_1 = require("../../utils/groupDates");
-var groupRoles_1 = require("../../utils/groupRoles");
-var sort_1 = require("../../utils/sort");
-var ManagedNavDropdown_1 = require("./ManagedNavDropdown");
-var GroupsDropdown = /** @class */ (function (_super) {
-    __extends(GroupsDropdown, _super);
-    function GroupsDropdown() {
-        var _this = _super !== null && _super.apply(this, arguments) || this;
-        _this.loadGroups = function () {
-            actionCreator_1.dispatchModelFetchRequest({ modelName: 'groups' });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const react_bootstrap_1 = require("react-bootstrap");
+const react_redux_1 = require("react-redux");
+const react_router_bootstrap_1 = require("react-router-bootstrap");
+const actionCreator_1 = require("../../redux/actionCreator");
+const date_1 = require("../../utils/date");
+const groupDates_1 = require("../../utils/groupDates");
+const groupRoles_1 = require("../../utils/groupRoles");
+const sort_1 = require("../../utils/sort");
+const ManagedNavDropdown_1 = require("./ManagedNavDropdown");
+class GroupsDropdown extends react_1.Component {
+    constructor() {
+        super(...arguments);
+        this.loadGroups = () => {
+            (0, actionCreator_1.dispatchModelFetchRequest)({ modelName: 'groups' });
         };
-        _this.didToggle = function (isOpen) {
+        this.didToggle = (isOpen) => {
             if (isOpen) {
-                _this.loadGroups();
+                this.loadGroups();
             }
         };
-        _this.renderGroupMenu = function (groups) {
-            if (!groups) {
-                return null;
-            }
-            return groups.sort(sort_1.sortByNameNatural).map(function (group) {
-                var groupURL = "/courses/" + group.id;
-                return (react_1.default.createElement(react_router_bootstrap_1.LinkContainer, { key: group.id, to: "" + groupURL },
-                    react_1.default.createElement(react_bootstrap_1.Dropdown.Item, null, group.name)));
+        this.renderGroupMenu = (groups) => {
+            return groups.sort(sort_1.sortByNameNatural).map(group => {
+                const groupURL = `/courses/${group.id}`;
+                return ((0, jsx_runtime_1.jsx)(react_router_bootstrap_1.LinkContainer, { to: groupURL, children: (0, jsx_runtime_1.jsx)(react_bootstrap_1.Dropdown.Item, { children: group.name }) }, group.id));
             });
         };
-        return _this;
     }
-    GroupsDropdown.prototype.render = function () {
-        var _a = this.props, title = _a.title, id = _a.id, groups = _a.groups, externalTerms = _a.externalTerms, anyRoleButLearner = _a.anyRoleButLearner;
-        var groupsFilteredByRole = anyRoleButLearner ? groupRoles_1.groupsAsAnythingButLearner(groups) : groupRoles_1.groupsAsLearner(groups);
-        var currentGroups = groupDates_1.filterGroupsByEndDate(groupsFilteredByRole, externalTerms, date_1.isNowBeforeDate);
+    render() {
+        const { title, id, groups, externalTerms, anyRoleButLearner } = this.props;
+        const groupsFilteredByRole = anyRoleButLearner ? (0, groupRoles_1.groupsAsAnythingButLearner)(groups) : (0, groupRoles_1.groupsAsLearner)(groups);
+        const currentGroups = (0, groupDates_1.filterGroupsByEndDate)(groupsFilteredByRole, externalTerms, date_1.isNowBeforeDate);
         if (currentGroups.length === 0) {
             return null;
         }
-        return (react_1.default.createElement(ManagedNavDropdown_1.ManagedNavDropdown, { title: title, id: id, didToggle: this.didToggle }, this.renderGroupMenu(currentGroups)));
-    };
-    return GroupsDropdown;
-}(react_1.Component));
-var mapStateToProps = function (state) {
+        return ((0, jsx_runtime_1.jsx)(ManagedNavDropdown_1.ManagedNavDropdown, { title: title, id: id, didToggle: this.didToggle, children: this.renderGroupMenu(currentGroups) }));
+    }
+}
+const mapStateToProps = (state) => {
     return {
         groups: !!state.models && !!state.models.groups ? state.models.groups : {},
         externalTerms: state.models.externalTerms
     };
 };
-exports.default = react_redux_1.connect(mapStateToProps)(GroupsDropdown);
+exports.default = (0, react_redux_1.connect)(mapStateToProps)(GroupsDropdown);

package/lib/components/Dropdowns/ManagedNavDropdown.d.ts

@@ -1,4 +1,4 @@
-import React, { Component } from 'react';
+import { Component } from 'react';
 import { NavDropdownProps } from 'react-bootstrap';
 declare enum EVENT_SOURCE {
     MOUSE_ENTER = "mouseEnter",
@@ -27,6 +27,6 @@ export declare class ManagedNavDropdown extends Component<ManagedNavDropdownProp
     onMouseLeave: () => void;
     onToggle: (nextIsOpen: boolean, event: any, source: Record<string, unknown>) => void;
     didToggle: () => void;
-    render(): React.JSX.Element;
+    render(): import("react/jsx-runtime").JSX.Element;
 }
 export {};