@clickview/lite 0.0.24-rc.3 → 0.0.24-rc.4

package/dist/scripts/32.chunk.js

@@ -0,0 +1,468 @@
+(window["webpackJsonp_clickview_lite"] = window["webpackJsonp_clickview_lite"] || []).push([[32],{
+
+/***/ "../../libs/shared/src/components/div-button/DivButton.tsx":
+/*!*****************************************************************************************************!*\
+  !*** C:/ClickView Projects/@clickview/packages/libs/shared/src/components/div-button/DivButton.tsx ***!
+  \*****************************************************************************************************/
+/*! exports provided: DivButton */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "DivButton", function() { return DivButton; });
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
+
+/**
+ * This element lets us use `div` elements as buttons without losing the accessibility of
+ * a regular HTML button element
+ */
+
+function DivButton(props) {
+  return react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", {
+    role: 'button',
+    tabIndex: 0,
+    className: "".concat(props.className ? props.className : '', " cursor-pointer"),
+    onKeyDown: function onKeyDown(e) {
+      return e.key === 'Enter' && props.onClick(e);
+    },
+    onClick: props.onClick,
+    style: props.style ? props.style : {}
+  }, props.children);
+}
+
+/***/ }),
+
+/***/ "../../libs/shared/src/hooks/UseAlerts.ts":
+/*!************************************************************************************!*\
+  !*** C:/ClickView Projects/@clickview/packages/libs/shared/src/hooks/UseAlerts.ts ***!
+  \************************************************************************************/
+/*! exports provided: useAlerts */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "useAlerts", function() { return useAlerts; });
+/* harmony import */ var _common_src_react_hooks_UseService__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../../common/src/react/hooks/UseService */ "../../libs/common/src/react/hooks/UseService.ts");
+/* harmony import */ var _common_src_backbone_services_BaseAlertService__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../../common/src/backbone/services/BaseAlertService */ "../../libs/common/src/backbone/services/BaseAlertService.ts");
+/* harmony import */ var _common_src_backbone_constants_CommonServices__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../../common/src/backbone/constants/CommonServices */ "../../libs/common/src/backbone/constants/CommonServices.ts");
+
+
+
+var useAlerts = function useAlerts() {
+  var alertService = Object(_common_src_react_hooks_UseService__WEBPACK_IMPORTED_MODULE_0__["useService"])(_common_src_backbone_constants_CommonServices__WEBPACK_IMPORTED_MODULE_2__["CommonServices"].ALERT);
+  return {
+    success: function success(alertContent) {
+      alertService.success(alertContent)();
+    },
+    error: function error(alertContent) {
+      alertService.error(alertContent)();
+    },
+    warning: function warning(alertContent) {
+      alertService.createAlert({
+        type: _common_src_backbone_services_BaseAlertService__WEBPACK_IMPORTED_MODULE_1__["AlertType"].Warning,
+        heading: _common_src_backbone_services_BaseAlertService__WEBPACK_IMPORTED_MODULE_1__["DefaultAlertHeading"].Warning,
+        message: alertContent
+      });
+    }
+  };
+};
+
+/***/ }),
+
+/***/ "./src/apps/classrooms/components/classroom-group-details-form/ClassroomGroupDetailsForm.tsx":
+/*!***************************************************************************************************!*\
+  !*** ./src/apps/classrooms/components/classroom-group-details-form/ClassroomGroupDetailsForm.tsx ***!
+  \***************************************************************************************************/
+/*! exports provided: ClassroomGroupDetailsForm */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "ClassroomGroupDetailsForm", function() { return ClassroomGroupDetailsForm; });
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
+/* harmony import */ var formik__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! formik */ "../../../node_modules/formik/dist/formik.esm.js");
+/* harmony import */ var _libs_common_src_backbone_services_LanguageService__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../../../../../../libs/common/src/backbone/services/LanguageService */ "../../libs/common/src/backbone/services/LanguageService.tsx");
+/* harmony import */ var _libs_shared_src_components_forms_form_field_FormField__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../../../../../../libs/shared/src/components/forms/form-field/FormField */ "../../libs/shared/src/components/forms/form-field/FormField.tsx");
+/* harmony import */ var _libs_shared_src_components_forms_form_wrapper_FormWrapper__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../../../../../../libs/shared/src/components/forms/form-wrapper/FormWrapper */ "../../libs/shared/src/components/forms/form-wrapper/FormWrapper.tsx");
+/* harmony import */ var _libs_shared_src_components_forms_form_buttons_FormButtons__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../../../../../../libs/shared/src/components/forms/form-buttons/FormButtons */ "../../libs/shared/src/components/forms/form-buttons/FormButtons.tsx");
+/* harmony import */ var _libs_shared_src_components_text_Text__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../../../../../../libs/shared/src/components/text/Text */ "../../libs/shared/src/components/text/Text.tsx");
+/* harmony import */ var apps_classrooms_components_colour_picker_ColourPicker__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! apps/classrooms/components/colour-picker/ColourPicker */ "./src/apps/classrooms/components/colour-picker/ColourPicker.tsx");
+/* harmony import */ var _classroom_group_details_form_scss__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./classroom-group-details-form.scss */ "./src/apps/classrooms/components/classroom-group-details-form/classroom-group-details-form.scss");
+/* harmony import */ var _classroom_group_details_form_scss__WEBPACK_IMPORTED_MODULE_8___default = /*#__PURE__*/__webpack_require__.n(_classroom_group_details_form_scss__WEBPACK_IMPORTED_MODULE_8__);
+
+
+
+
+
+
+
+
+
+var namespace = 'classrooms.classroomGroupDetailsForm';
+var getPhrase = _libs_common_src_backbone_services_LanguageService__WEBPACK_IMPORTED_MODULE_2__["LanguageService"].encloseNamespace(namespace);
+function ClassroomGroupDetailsForm(props) {
+  var formikProps = Object(_libs_shared_src_components_forms_form_wrapper_FormWrapper__WEBPACK_IMPORTED_MODULE_4__["useFormikContextWrapper"])();
+  return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(react__WEBPACK_IMPORTED_MODULE_0___default.a.Fragment, null, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", null, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("h2", {
+    className: 'w-50 d-inline-block h6'
+  }, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_libs_shared_src_components_text_Text__WEBPACK_IMPORTED_MODULE_6__["Text"], {
+    namespace: namespace,
+    phrase: 'nameLabel'
+  })), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("h2", {
+    className: 'd-inline-block h6'
+  }, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_libs_shared_src_components_text_Text__WEBPACK_IMPORTED_MODULE_6__["Text"], {
+    namespace: namespace,
+    phrase: 'colourLabel'
+  }))), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(formik__WEBPACK_IMPORTED_MODULE_1__["Form"], null, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
+    className: 'pb-3 d-flex'
+  }, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
+    className: 'w-50'
+  }, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_libs_shared_src_components_forms_form_field_FormField__WEBPACK_IMPORTED_MODULE_3__["FormField"], {
+    type: 'text',
+    name: 'name',
+    id: 'name',
+    className: "".concat(_classroom_group_details_form_scss__WEBPACK_IMPORTED_MODULE_8___default.a.groupNameInput),
+    placeholder: getPhrase('groupNamePlaceholder'),
+    autoFocus: true,
+    value: formikProps.values.name
+  })), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
+    className: 'form-group'
+  }, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(apps_classrooms_components_colour_picker_ColourPicker__WEBPACK_IMPORTED_MODULE_7__["ColourPicker"], {
+    onSelect: function onSelect(c) {
+      return formikProps.setFieldValue('colour', c);
+    },
+    selection: formikProps.values.colour,
+    id: "".concat(props.isNew ? 'create' : 'edit', "-classroom-group")
+  }))), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
+    className: 'btn-container d-flex justify-content-end'
+  }, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("button", {
+    type: 'button',
+    className: 'btn btn-link mr-2',
+    onClick: props.onClickCancel
+  }, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_libs_shared_src_components_text_Text__WEBPACK_IMPORTED_MODULE_6__["Text"], {
+    namespace: namespace,
+    phrase: 'cancel'
+  })), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_libs_shared_src_components_forms_form_buttons_FormButtons__WEBPACK_IMPORTED_MODULE_5__["FormButtons"], {
+    isNew: props.isNew
+  }))));
+}
+
+/***/ }),
+
+/***/ "./src/apps/classrooms/components/classroom-group-details-form/classroom-group-details-form.scss":
+/*!*******************************************************************************************************!*\
+  !*** ./src/apps/classrooms/components/classroom-group-details-form/classroom-group-details-form.scss ***!
+  \*******************************************************************************************************/
+/*! no static exports found */
+/***/ (function(module, exports, __webpack_require__) {
+
+// extracted by mini-css-extract-plugin
+module.exports = {"groupNameInput":"cv--groupNameInput--3hGvq"};
+
+/***/ }),
+
+/***/ "./src/apps/classrooms/components/colour-picker/ColourPicker.tsx":
+/*!***********************************************************************!*\
+  !*** ./src/apps/classrooms/components/colour-picker/ColourPicker.tsx ***!
+  \***********************************************************************/
+/*! exports provided: ColourPicker */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "ColourPicker", function() { return ColourPicker; });
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
+/* harmony import */ var react_bootstrap__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-bootstrap */ "react-bootstrap");
+/* harmony import */ var react_bootstrap__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react_bootstrap__WEBPACK_IMPORTED_MODULE_1__);
+/* harmony import */ var _libs_shared_src_components_div_button_DivButton__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../../../../../../libs/shared/src/components/div-button/DivButton */ "../../libs/shared/src/components/div-button/DivButton.tsx");
+/* harmony import */ var _libs_shared_src_components_svg_container_SvgContainer__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../../../../../../libs/shared/src/components/svg-container/SvgContainer */ "../../libs/shared/src/components/svg-container/SvgContainer.tsx");
+/* harmony import */ var _libs_shared_src_utils_SvgHelper__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../../../../../../libs/shared/src/utils/SvgHelper */ "../../libs/shared/src/utils/SvgHelper.ts");
+/* harmony import */ var apps_classrooms_enums_GroupColour__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! apps/classrooms/enums/GroupColour */ "./src/apps/classrooms/enums/GroupColour.ts");
+/* harmony import */ var apps_classrooms_utils_GroupHelper__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! apps/classrooms/utils/GroupHelper */ "./src/apps/classrooms/utils/GroupHelper.ts");
+/* harmony import */ var _colour_picker_scss__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./colour-picker.scss */ "./src/apps/classrooms/components/colour-picker/colour-picker.scss");
+/* harmony import */ var _colour_picker_scss__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_colour_picker_scss__WEBPACK_IMPORTED_MODULE_7__);
+
+
+
+
+
+
+
+
+ColourPicker.defaultProps = {
+  selection: apps_classrooms_enums_GroupColour__WEBPACK_IMPORTED_MODULE_5__["GroupColour"].White,
+  onSelect: function onSelect() {}
+};
+function ColourPicker(props) {
+  function getToggleButtonClass() {
+    var baseClass = "".concat(_colour_picker_scss__WEBPACK_IMPORTED_MODULE_7___default.a.dropdownToggle, " outline-none p-0 d-flex align-items-center text-decoration-none");
+    var disabledClass = props.disabled ? 'cursor-default' : '';
+    return "".concat(baseClass, " ").concat(disabledClass);
+  }
+
+  function getOptionClass(colour) {
+    var baseClass = "".concat(_colour_picker_scss__WEBPACK_IMPORTED_MODULE_7___default.a.colourOption, " position-relative");
+    var borderClass = colour === apps_classrooms_enums_GroupColour__WEBPACK_IMPORTED_MODULE_5__["GroupColour"].White ? 'border border-dark' : '';
+    var disabledClass = props.disabled ? 'cursor-default' : '';
+    var colorClass = Object(apps_classrooms_utils_GroupHelper__WEBPACK_IMPORTED_MODULE_6__["mapColourToClassName"])(colour);
+    return "".concat(baseClass, " ").concat(borderClass, " ").concat(disabledClass, " ").concat(colorClass);
+  }
+
+  var dropdownProps = {};
+  if (props.disabled) dropdownProps.show = false;
+  return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(react_bootstrap__WEBPACK_IMPORTED_MODULE_1__["Dropdown"], Object.assign({}, dropdownProps), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(react_bootstrap__WEBPACK_IMPORTED_MODULE_1__["Dropdown"].Toggle, {
+    id: props.id,
+    variant: 'link',
+    className: getToggleButtonClass()
+  }, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
+    className: "border border-secondary rounded bg-white ".concat(_colour_picker_scss__WEBPACK_IMPORTED_MODULE_7___default.a.colourButton)
+  }, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
+    className: "px-0 py-1 rounded ".concat(Object(apps_classrooms_utils_GroupHelper__WEBPACK_IMPORTED_MODULE_6__["mapColourToClassName"])(props.selection))
+  }, "\xA0")), !props.disabled && react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_libs_shared_src_components_svg_container_SvgContainer__WEBPACK_IMPORTED_MODULE_3__["SvgContainer"], {
+    svgName: _libs_shared_src_utils_SvgHelper__WEBPACK_IMPORTED_MODULE_4__["cvSvgLibrary"].Caret
+  })), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(react_bootstrap__WEBPACK_IMPORTED_MODULE_1__["Dropdown"].Menu, null, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("ul", {
+    className: "".concat(_colour_picker_scss__WEBPACK_IMPORTED_MODULE_7___default.a.colourList, " list-unstyled d-flex flex-wrap px-2 m-0")
+  }, Object.keys(apps_classrooms_enums_GroupColour__WEBPACK_IMPORTED_MODULE_5__["GroupColour"]).map(function (colourKey) {
+    var colour = apps_classrooms_enums_GroupColour__WEBPACK_IMPORTED_MODULE_5__["GroupColour"][colourKey];
+    return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("li", {
+      key: "".concat(props.id, ":").concat(colour),
+      className: 'm-1'
+    }, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_libs_shared_src_components_div_button_DivButton__WEBPACK_IMPORTED_MODULE_2__["DivButton"], {
+      onClick: function onClick() {
+        return props.onSelect(colour);
+      },
+      className: getOptionClass(colour)
+    }, colour === apps_classrooms_enums_GroupColour__WEBPACK_IMPORTED_MODULE_5__["GroupColour"].White ? react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
+      className: _colour_picker_scss__WEBPACK_IMPORTED_MODULE_7___default.a.lineThrough
+    }) : react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(react__WEBPACK_IMPORTED_MODULE_0___default.a.Fragment, null, "\xA0")));
+  }))));
+}
+
+/***/ }),
+
+/***/ "./src/apps/classrooms/components/colour-picker/colour-picker.scss":
+/*!*************************************************************************!*\
+  !*** ./src/apps/classrooms/components/colour-picker/colour-picker.scss ***!
+  \*************************************************************************/
+/*! no static exports found */
+/***/ (function(module, exports, __webpack_require__) {
+
+// extracted by mini-css-extract-plugin
+module.exports = {"dropdownToggle":"cv--dropdownToggle--347DY","colourButton":"cv--colourButton--1rKvE","colourList":"cv--colourList--328-w","colourOption":"cv--colourOption--1Tw7u","lineThrough":"cv--lineThrough--18oZq"};
+
+/***/ }),
+
+/***/ "./src/apps/classrooms/components/edit-classroom-group-details/EditClassroomGroupDetails.tsx":
+/*!***************************************************************************************************!*\
+  !*** ./src/apps/classrooms/components/edit-classroom-group-details/EditClassroomGroupDetails.tsx ***!
+  \***************************************************************************************************/
+/*! exports provided: EditClassroomGroupDetails */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "EditClassroomGroupDetails", function() { return EditClassroomGroupDetails; });
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
+/* harmony import */ var _libs_shared_src_components_forms_form_wrapper_FormWrapper__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../../../../../../libs/shared/src/components/forms/form-wrapper/FormWrapper */ "../../libs/shared/src/components/forms/form-wrapper/FormWrapper.tsx");
+/* harmony import */ var apps_classrooms_validation_ClassroomGroupValidationSchema__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! apps/classrooms/validation/ClassroomGroupValidationSchema */ "./src/apps/classrooms/validation/ClassroomGroupValidationSchema.ts");
+/* harmony import */ var apps_classrooms_components_classroom_group_details_form_ClassroomGroupDetailsForm__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! apps/classrooms/components/classroom-group-details-form/ClassroomGroupDetailsForm */ "./src/apps/classrooms/components/classroom-group-details-form/ClassroomGroupDetailsForm.tsx");
+
+
+
+
+function EditClassroomGroupDetails(props) {
+  var _a, _b, _c;
+
+  var group = props.group,
+      saveGroup = props.saveGroup,
+      onClickCancel = props.onClickCancel;
+  var initialValues = {
+    id: (_a = group) === null || _a === void 0 ? void 0 : _a.id,
+    name: (_b = group) === null || _b === void 0 ? void 0 : _b.name,
+    colour: (_c = group) === null || _c === void 0 ? void 0 : _c.colour,
+    students: []
+  };
+  return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_libs_shared_src_components_forms_form_wrapper_FormWrapper__WEBPACK_IMPORTED_MODULE_1__["FormWrapper"], {
+    initialValues: initialValues,
+    validationSchema: apps_classrooms_validation_ClassroomGroupValidationSchema__WEBPACK_IMPORTED_MODULE_2__["ClassroomGroupValidationSchema"],
+    onSubmit: saveGroup
+  }, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(apps_classrooms_components_classroom_group_details_form_ClassroomGroupDetailsForm__WEBPACK_IMPORTED_MODULE_3__["ClassroomGroupDetailsForm"], {
+    isNew: !group,
+    onClickCancel: onClickCancel
+  }));
+}
+
+/***/ }),
+
+/***/ "./src/apps/classrooms/enums/GroupColour.ts":
+/*!**************************************************!*\
+  !*** ./src/apps/classrooms/enums/GroupColour.ts ***!
+  \**************************************************/
+/*! exports provided: GroupColour */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "GroupColour", function() { return GroupColour; });
+var GroupColour;
+
+(function (GroupColour) {
+  GroupColour["White"] = "white";
+  GroupColour["Pink"] = "pink";
+  GroupColour["YellowOrange"] = "yellow-orange";
+  GroupColour["Emerald"] = "emerald";
+  GroupColour["PuertoRico"] = "puerto-rico";
+  GroupColour["PictonBlue"] = "picton-blue";
+  GroupColour["EastSide"] = "east-side";
+  GroupColour["Portage"] = "portage";
+})(GroupColour || (GroupColour = {}));
+
+/***/ }),
+
+/***/ "./src/apps/classrooms/utils/GroupHelper.ts":
+/*!**************************************************!*\
+  !*** ./src/apps/classrooms/utils/GroupHelper.ts ***!
+  \**************************************************/
+/*! exports provided: mapColourToClassName */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "mapColourToClassName", function() { return mapColourToClassName; });
+function mapColourToClassName(groupName) {
+  return "bg-".concat(groupName);
+}
+
+/***/ }),
+
+/***/ "./src/apps/classrooms/validation/ClassroomGroupValidationSchema.ts":
+/*!**************************************************************************!*\
+  !*** ./src/apps/classrooms/validation/ClassroomGroupValidationSchema.ts ***!
+  \**************************************************************************/
+/*! exports provided: ClassroomGroupValidationSchema */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "ClassroomGroupValidationSchema", function() { return ClassroomGroupValidationSchema; });
+/* harmony import */ var yup__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! yup */ "../../../node_modules/yup/lib/index.js");
+/* harmony import */ var yup__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(yup__WEBPACK_IMPORTED_MODULE_0__);
+/* harmony import */ var _libs_common_src_backbone_services_LanguageService__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../../../../../libs/common/src/backbone/services/LanguageService */ "../../libs/common/src/backbone/services/LanguageService.tsx");
+/* harmony import */ var _enums_GroupColour__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../enums/GroupColour */ "./src/apps/classrooms/enums/GroupColour.ts");
+
+
+
+var getPhrase = _libs_common_src_backbone_services_LanguageService__WEBPACK_IMPORTED_MODULE_1__["LanguageService"].encloseNamespace('classrooms.classroomValidation');
+var ClassroomGroupValidationSchema = Object(yup__WEBPACK_IMPORTED_MODULE_0__["object"])().shape({
+  name: Object(yup__WEBPACK_IMPORTED_MODULE_0__["string"])().max(255, function () {
+    return getPhrase('nameExceeds');
+  }).required(function () {
+    return getPhrase('nameRequired');
+  })["default"](''),
+  colour: Object(yup__WEBPACK_IMPORTED_MODULE_0__["string"])().required(function () {
+    return getPhrase('colourRequired');
+  })["default"](_enums_GroupColour__WEBPACK_IMPORTED_MODULE_2__["GroupColour"].White)
+});
+
+/***/ }),
+
+/***/ "./src/apps/classrooms/views/create-classroom-group/CreateClassroomGroupView.tsx":
+/*!***************************************************************************************!*\
+  !*** ./src/apps/classrooms/views/create-classroom-group/CreateClassroomGroupView.tsx ***!
+  \***************************************************************************************/
+/*! exports provided: CreateClassroomGroupView */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "CreateClassroomGroupView", function() { return CreateClassroomGroupView; });
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
+/* harmony import */ var react_redux__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-redux */ "react-redux");
+/* harmony import */ var react_redux__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react_redux__WEBPACK_IMPORTED_MODULE_1__);
+/* harmony import */ var _libs_common_src_backbone_services_LanguageService__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../../../../../../libs/common/src/backbone/services/LanguageService */ "../../libs/common/src/backbone/services/LanguageService.tsx");
+/* harmony import */ var _libs_common_src_react__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../../../../../../libs/common/src/react */ "../../libs/common/src/react/index.ts");
+/* harmony import */ var _libs_shared_src_components_popup_Popup__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../../../../../../libs/shared/src/components/popup/Popup */ "../../libs/shared/src/components/popup/Popup.tsx");
+/* harmony import */ var _libs_shared_src_hooks_UseAlerts__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../../../../../../libs/shared/src/hooks/UseAlerts */ "../../libs/shared/src/hooks/UseAlerts.ts");
+/* harmony import */ var apps_classrooms_flight_requests_ClassroomRequests__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! apps/classrooms/flight-requests/ClassroomRequests */ "./src/apps/classrooms/flight-requests/ClassroomRequests.ts");
+/* harmony import */ var apps_classrooms_components_edit_classroom_group_details_EditClassroomGroupDetails__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! apps/classrooms/components/edit-classroom-group-details/EditClassroomGroupDetails */ "./src/apps/classrooms/components/edit-classroom-group-details/EditClassroomGroupDetails.tsx");
+/* harmony import */ var _libs_analytics_src_AnalyticsHelper__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../../../../../../../libs/analytics/src/AnalyticsHelper */ "../../libs/analytics/src/AnalyticsHelper.ts");
+/* harmony import */ var _libs_analytics_src_interfaces__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../../../../../../libs/analytics/src/interfaces */ "../../libs/analytics/src/interfaces/index.ts");
+
+
+
+
+
+
+
+
+
+
+var namespace = 'classrooms.createClassroomGroup';
+var getPhrase = _libs_common_src_backbone_services_LanguageService__WEBPACK_IMPORTED_MODULE_2__["LanguageService"].encloseNamespace(namespace);
+function CreateClassroomGroupView(props) {
+  var classroom = _libs_common_src_react__WEBPACK_IMPORTED_MODULE_3__["Flight"].useBasicFetch(apps_classrooms_flight_requests_ClassroomRequests__WEBPACK_IMPORTED_MODULE_6__["ClassroomRequests"].getClassroom(props.classroomId));
+  var alerts = Object(_libs_shared_src_hooks_UseAlerts__WEBPACK_IMPORTED_MODULE_5__["useAlerts"])();
+  var dispatch = Object(react_redux__WEBPACK_IMPORTED_MODULE_1__["useDispatch"])();
+
+  var successCallback = function successCallback(group) {
+    alerts.success(getPhrase('success', {
+      groupName: group.name,
+      classroomName: classroom.data.name
+    }));
+    props.closePopup();
+  };
+
+  var addStudentsToGroup = function addStudentsToGroup(group) {
+    _libs_common_src_react__WEBPACK_IMPORTED_MODULE_3__["Flight"].fetch(dispatch, apps_classrooms_flight_requests_ClassroomRequests__WEBPACK_IMPORTED_MODULE_6__["ClassroomRequests"].addStudentsToGroup(props.studentIds, group.id, function () {
+      _libs_analytics_src_AnalyticsHelper__WEBPACK_IMPORTED_MODULE_8__["AnalyticsHelper"].logUserAction({
+        id: group.id,
+        studentCount: props.studentIds.length
+      }, _libs_analytics_src_AnalyticsHelper__WEBPACK_IMPORTED_MODULE_8__["AnalyticsHelper"].mergeOptions(props.analyticsOptions, {
+        actionType: _libs_analytics_src_interfaces__WEBPACK_IMPORTED_MODULE_9__["UserAction"].Associate,
+        descriptor: _libs_analytics_src_interfaces__WEBPACK_IMPORTED_MODULE_9__["AssocDescriptor"].User
+      }));
+      successCallback(group);
+    }));
+  };
+
+  var saveGroupToClassroom = function saveGroupToClassroom(group) {
+    _libs_common_src_react__WEBPACK_IMPORTED_MODULE_3__["Flight"].fetch(dispatch, apps_classrooms_flight_requests_ClassroomRequests__WEBPACK_IMPORTED_MODULE_6__["ClassroomRequests"].addGroupToClassroom(group, props.classroomId, function (newGroup) {
+      var _a;
+
+      _libs_analytics_src_AnalyticsHelper__WEBPACK_IMPORTED_MODULE_8__["AnalyticsHelper"].logUserAction({
+        id: newGroup.id,
+        classroomId: props.classroomId
+      }, _libs_analytics_src_AnalyticsHelper__WEBPACK_IMPORTED_MODULE_8__["AnalyticsHelper"].mergeOptions(props.analyticsOptions, {
+        actionType: _libs_analytics_src_interfaces__WEBPACK_IMPORTED_MODULE_9__["UserAction"].Create
+      }));
+
+      if ((_a = props.studentIds) === null || _a === void 0 ? void 0 : _a.length) {
+        addStudentsToGroup(newGroup);
+        return;
+      }
+
+      successCallback(newGroup);
+    }, function () {
+      // TODO: Handle possible errors once we have a server side
+      alerts.error(getPhrase('error'));
+    }));
+  };
+
+  return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_libs_shared_src_components_popup_Popup__WEBPACK_IMPORTED_MODULE_4__["Popup"], {
+    title: getPhrase('title'),
+    closePopup: props.closePopup,
+    showLoadingSpinner: !classroom.data
+  }, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(apps_classrooms_components_edit_classroom_group_details_EditClassroomGroupDetails__WEBPACK_IMPORTED_MODULE_7__["EditClassroomGroupDetails"], {
+    saveGroup: saveGroupToClassroom,
+    onClickCancel: props.closePopup
+  }));
+}
+
+/***/ })
+
+}]);
+//# sourceMappingURL=32.chunk.js.map

package/dist/scripts/32.chunk.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["file://C:/ClickView Projects/@clickview/packages/libs/shared/src/components/div-button/DivButton.tsx","file://C:/ClickView Projects/@clickview/packages/libs/shared/src/hooks/UseAlerts.ts","file://C:/ClickView Projects/@clickview/packages/projects/lite/src/apps/classrooms/components/classroom-group-details-form/ClassroomGroupDetailsForm.tsx","webpack://@clickview/lite/./src/apps/classrooms/components/classroom-group-details-form/classroom-group-details-form.scss?365a","file://C:/ClickView Projects/@clickview/packages/projects/lite/src/apps/classrooms/components/colour-picker/ColourPicker.tsx","webpack://@clickview/lite/./src/apps/classrooms/components/colour-picker/colour-picker.scss?adf9","file://C:/ClickView Projects/@clickview/packages/projects/lite/src/apps/classrooms/components/edit-classroom-group-details/EditClassroomGroupDetails.tsx","file://C:/ClickView Projects/@clickview/packages/projects/lite/src/apps/classrooms/enums/GroupColour.ts","file://C:/ClickView Projects/@clickview/packages/projects/lite/src/apps/classrooms/utils/GroupHelper.ts","file://C:/ClickView Projects/@clickview/packages/projects/lite/src/apps/classrooms/validation/ClassroomGroupValidationSchema.ts","file://C:/ClickView Projects/@clickview/packages/projects/lite/src/apps/classrooms/views/create-classroom-group/CreateClassroomGroupView.tsx"],"names":[],"mappings":"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","file":"scripts/32.chunk.js","sourcesContent":["import * as React from 'react';\r\n\r\ninterface DivButtonProps extends React.ButtonHTMLAttributes<HTMLDivElement> {\r\n  onClick: (...args: any) => any;\r\n}\r\n\r\n/**\r\n * This element lets us use `div` elements as buttons without losing the accessibility of\r\n * a regular HTML button element\r\n */\r\nexport function DivButton(props: React.PropsWithChildren<DivButtonProps>): JSX.Element {\r\n  return (\r\n    <div\r\n      role='button'\r\n      tabIndex={0}\r\n      className={`${props.className ? props.className : ''} cursor-pointer`}\r\n      onKeyDown={(e: React.KeyboardEvent) => e.key === 'Enter' && props.onClick(e)}\r\n      onClick={props.onClick}\r\n      style={props.style ? props.style : {}}\r\n    >\r\n      {props.children}\r\n    </div>\r\n  );\r\n}","import { useService } from 'libs/common/react/hooks/UseService';\r\nimport { BaseAlertService, BaseAlert, BaseAlertOptions, AlertType, DefaultAlertHeading } from 'libs/common/backbone/services/BaseAlertService';\r\nimport { CommonServices } from 'libs/common/backbone/constants/CommonServices';\r\n\r\nexport const useAlerts = () => {\r\n  const alertService = useService<BaseAlertService>(CommonServices.ALERT);\r\n\r\n  return {\r\n    success(alertContent: string | BaseAlert | BaseAlertOptions): void {\r\n      alertService.success(alertContent)();\r\n    },\r\n    error(alertContent: string | BaseAlert | BaseAlertOptions): void {\r\n      alertService.error(alertContent)();\r\n    },\r\n    warning(alertContent: string): void {\r\n      alertService.createAlert({\r\n        type: AlertType.Warning,\r\n        heading: DefaultAlertHeading.Warning,\r\n        message: alertContent\r\n      });\r\n    }\r\n  };\r\n};","import React from 'react';\r\nimport { Form } from 'formik';\r\n\r\nimport { LanguageService } from 'libs/common/backbone/services/LanguageService';\r\nimport { FormField } from 'libs/shared/components/forms/form-field/FormField';\r\nimport { useFormikContextWrapper } from 'libs/shared/components/forms/form-wrapper/FormWrapper';\r\nimport { FormButtons } from 'libs/shared/components/forms/form-buttons/FormButtons';\r\nimport { Text } from 'libs/shared/components/text/Text';\r\n\r\nimport { MockClassroomGroup } from 'shared/interfaces/mocks';\r\n\r\nimport { ColourPicker } from 'apps/classrooms/components/colour-picker/ColourPicker';\r\n\r\nimport styles from './classroom-group-details-form.scss';\r\n\r\nconst namespace = 'classrooms.classroomGroupDetailsForm';\r\nconst getPhrase = LanguageService.encloseNamespace(namespace);\r\n\r\ninterface ClassroomGroupDetailsFormProps {\r\n  isNew: boolean;\r\n  onClickCancel: () => void;\r\n}\r\n\r\nexport function ClassroomGroupDetailsForm(props: ClassroomGroupDetailsFormProps): JSX.Element {\r\n  const formikProps = useFormikContextWrapper<MockClassroomGroup>();\r\n\r\n  return (\r\n    <>\r\n      <div>\r\n        <h2 className='w-50 d-inline-block h6'><Text namespace={namespace} phrase='nameLabel' /></h2>\r\n        <h2 className='d-inline-block h6'><Text namespace={namespace} phrase='colourLabel' /></h2>\r\n      </div>\r\n\r\n      <Form>\r\n        <div className='pb-3 d-flex'>\r\n          <div className='w-50'>\r\n            <FormField\r\n              type='text'\r\n              name='name'\r\n              id='name'\r\n              className={`${styles.groupNameInput}`}\r\n              placeholder={getPhrase('groupNamePlaceholder')}\r\n              autoFocus\r\n              value={formikProps.values.name}\r\n            />\r\n          </div>\r\n          <div className='form-group'>\r\n            <ColourPicker\r\n              onSelect={c => formikProps.setFieldValue('colour', c)}\r\n              selection={formikProps.values.colour}\r\n              id={`${props.isNew ? 'create' : 'edit'}-classroom-group`}\r\n            />\r\n          </div>\r\n        </div>\r\n\r\n        <div className='btn-container d-flex justify-content-end'>\r\n          <button type='button' className='btn btn-link mr-2' onClick={props.onClickCancel}>\r\n            <Text namespace={namespace} phrase='cancel' />\r\n          </button>\r\n          <FormButtons isNew={props.isNew} />\r\n        </div>\r\n      </Form>\r\n    </>\r\n  );\r\n}","// extracted by mini-css-extract-plugin\nmodule.exports = {\"groupNameInput\":\"cv--groupNameInput--3hGvq\"};","import React from 'react';\r\nimport { Dropdown } from 'react-bootstrap';\r\n\r\nimport { HashObject } from 'libs/common/react/interfaces/HashObject';\r\n\r\nimport { DivButton } from 'libs/shared/components/div-button/DivButton';\r\nimport { SvgContainer } from 'libs/shared/components/svg-container/SvgContainer';\r\nimport { cvSvgLibrary } from 'libs/shared/utils/SvgHelper';\r\n\r\nimport { GroupColour } from 'apps/classrooms/enums/GroupColour';\r\nimport { mapColourToClassName } from 'apps/classrooms/utils/GroupHelper';\r\n\r\nimport styles from './colour-picker.scss';\r\n\r\ninterface ColourPickerProps {\r\n  id: string;\r\n  onSelect?: (colour: string) => void;\r\n  selection?: GroupColour;\r\n  disabled?: boolean;\r\n}\r\n\r\nColourPicker.defaultProps = {\r\n  selection: GroupColour.White,\r\n  onSelect: () => {}\r\n};\r\n\r\nexport function ColourPicker(props: ColourPickerProps): JSX.Element {\r\n  function getToggleButtonClass(): string {\r\n    const baseClass = `${styles.dropdownToggle} outline-none p-0 d-flex align-items-center text-decoration-none`;\r\n    const disabledClass = props.disabled ? 'cursor-default' : '';\r\n\r\n    return `${baseClass} ${disabledClass}`;\r\n  }\r\n\r\n  function getOptionClass(colour: GroupColour): string {\r\n    const baseClass = `${styles.colourOption} position-relative`;\r\n    const borderClass = colour === GroupColour.White ? 'border border-dark' : '';\r\n    const disabledClass = props.disabled ? 'cursor-default' : '';\r\n    const colorClass = mapColourToClassName(colour);\r\n\r\n    return `${baseClass} ${borderClass} ${disabledClass} ${colorClass}`;\r\n  }\r\n\r\n  const dropdownProps: HashObject = {};\r\n  if (props.disabled)\r\n    dropdownProps.show = false;\r\n\r\n  return (\r\n    <Dropdown {...dropdownProps}>\r\n      <Dropdown.Toggle id={props.id} variant='link' className={getToggleButtonClass()}>\r\n        <div className={`border border-secondary rounded bg-white ${styles.colourButton}`}>\r\n          <div className={`px-0 py-1 rounded ${mapColourToClassName(props.selection)}`}>\r\n            &nbsp;\r\n          </div>\r\n        </div>\r\n\r\n        {!props.disabled &&\r\n          <SvgContainer svgName={cvSvgLibrary.Caret} />\r\n        }\r\n      </Dropdown.Toggle>\r\n\r\n      <Dropdown.Menu>\r\n        <ul className={`${styles.colourList} list-unstyled d-flex flex-wrap px-2 m-0`}>\r\n          {Object.keys(GroupColour).map(colourKey => {\r\n            const colour = (GroupColour as any)[colourKey];\r\n\r\n            return (\r\n              <li key={`${props.id}:${colour}`} className='m-1'>\r\n                <DivButton\r\n                  onClick={() => props.onSelect(colour)}\r\n                  className={getOptionClass(colour)}\r\n                >\r\n                  {colour === GroupColour.White\r\n                    ? <div className={styles.lineThrough} />\r\n                    : <>&nbsp;</>\r\n                  }\r\n                </DivButton>\r\n              </li>\r\n            );\r\n          })}\r\n        </ul>\r\n      </Dropdown.Menu>\r\n    </Dropdown>\r\n  );\r\n}","// extracted by mini-css-extract-plugin\nmodule.exports = {\"dropdownToggle\":\"cv--dropdownToggle--347DY\",\"colourButton\":\"cv--colourButton--1rKvE\",\"colourList\":\"cv--colourList--328-w\",\"colourOption\":\"cv--colourOption--1Tw7u\",\"lineThrough\":\"cv--lineThrough--18oZq\"};","import React from 'react';\r\n\r\nimport { FormWrapper } from 'libs/shared/components/forms/form-wrapper/FormWrapper';\r\n\r\nimport { MockClassroomGroup } from 'shared/interfaces/mocks';\r\nimport { ClassroomGroupValidationSchema } from 'apps/classrooms/validation/ClassroomGroupValidationSchema';\r\nimport { ClassroomGroupDetailsForm } from 'apps/classrooms/components/classroom-group-details-form/ClassroomGroupDetailsForm';\r\n\r\ninterface EditClassroomGroupDetailsProps {\r\n  group?: MockClassroomGroup;\r\n  saveGroup: (group: MockClassroomGroup) => void;\r\n  onClickCancel: () => void;\r\n}\r\n\r\nexport function EditClassroomGroupDetails(props: EditClassroomGroupDetailsProps): React.ReactElement {\r\n  const { group, saveGroup, onClickCancel } = props;\r\n\r\n  const initialValues: MockClassroomGroup = {\r\n    id: group?.id,\r\n    name: group?.name,\r\n    colour: group?.colour,\r\n    students: []\r\n  };\r\n\r\n  return (\r\n    <FormWrapper<MockClassroomGroup>\r\n      initialValues={initialValues}\r\n      validationSchema={ClassroomGroupValidationSchema}\r\n      onSubmit={saveGroup}\r\n    >\r\n      <ClassroomGroupDetailsForm isNew={!group} onClickCancel={onClickCancel} />\r\n    </FormWrapper>\r\n  );\r\n}","export enum GroupColour {\r\n  White = 'white',\r\n  Pink = 'pink',\r\n  YellowOrange = 'yellow-orange',\r\n  Emerald = 'emerald',\r\n  PuertoRico = 'puerto-rico',\r\n  PictonBlue = 'picton-blue',\r\n  EastSide = 'east-side',\r\n  Portage = 'portage'\r\n}","import { GroupColour } from 'apps/classrooms/enums/GroupColour';\r\n\r\nexport function mapColourToClassName(groupName: GroupColour): string {\r\n  return `bg-${groupName}`;\r\n}","import { object, string } from 'yup';\r\n\r\nimport { LanguageService } from 'libs/common/backbone/services/LanguageService';\r\nimport { GroupColour } from '../enums/GroupColour';\r\n\r\nconst getPhrase = LanguageService.encloseNamespace('classrooms.classroomValidation');\r\n\r\nexport const ClassroomGroupValidationSchema = object().shape({\r\n  name: string()\r\n    .max(255, () => getPhrase('nameExceeds'))\r\n    .required(() => getPhrase('nameRequired'))\r\n    .default(''),\r\n  colour: string()\r\n    .required(() => getPhrase('colourRequired'))\r\n    .default(GroupColour.White)\r\n});","import React from 'react';\r\nimport { useDispatch } from 'react-redux';\r\n\r\nimport { LanguageService } from 'libs/common/backbone/services/LanguageService';\r\nimport { Flight } from 'libs/common/flight';\r\nimport { Popup } from 'libs/shared/components/popup/Popup';\r\nimport { PopupViewProps, PropsWithAnalyticsOptions, PropsWithPopupViewProps } from 'libs/shared/interfaces';\r\nimport { useAlerts } from 'libs/shared/hooks/UseAlerts';\r\n\r\nimport { MockClassroomGroup } from 'shared/interfaces/mocks';\r\n\r\nimport { ClassroomRequests } from 'apps/classrooms/flight-requests/ClassroomRequests';\r\nimport { MockClassroom } from 'apps/user-manager/interfaces';\r\nimport { EditClassroomGroupDetails } from 'apps/classrooms/components/edit-classroom-group-details/EditClassroomGroupDetails';\r\nimport { AnalyticsHelper } from 'libs/analytics/AnalyticsHelper';\r\nimport { UserAction, AssocDescriptor } from 'libs/analytics/interfaces';\r\n\r\nconst namespace = 'classrooms.createClassroomGroup';\r\nconst getPhrase = LanguageService.encloseNamespace(namespace);\r\n\r\ntype CreateClassroomGroupViewProps = PropsWithAnalyticsOptions<PropsWithPopupViewProps<{\r\n  classroomId: string;\r\n  studentIds: string[];\r\n}>>;\r\n\r\nexport function CreateClassroomGroupView(props: CreateClassroomGroupViewProps): JSX.Element {\r\n  const classroom = Flight.useBasicFetch<MockClassroom>(ClassroomRequests.getClassroom(props.classroomId));\r\n\r\n  const alerts = useAlerts();\r\n  const dispatch = useDispatch();\r\n\r\n  const successCallback = (group: MockClassroomGroup) => {\r\n    alerts.success(getPhrase('success', {\r\n      groupName: group.name,\r\n      classroomName: classroom.data.name\r\n    }));\r\n\r\n    props.closePopup();\r\n  };\r\n\r\n  const addStudentsToGroup = (group: MockClassroomGroup) => {\r\n    Flight.fetch(dispatch, ClassroomRequests.addStudentsToGroup(props.studentIds, group.id, () => {\r\n      AnalyticsHelper.logUserAction({\r\n        id: group.id,\r\n        studentCount: props.studentIds.length\r\n      }, AnalyticsHelper.mergeOptions(props.analyticsOptions, {\r\n        actionType: UserAction.Associate,\r\n        descriptor: AssocDescriptor.User\r\n      }));\r\n\r\n      successCallback(group);\r\n    }));\r\n  };\r\n\r\n  const saveGroupToClassroom = (group: MockClassroomGroup) => {\r\n    Flight.fetch(dispatch, ClassroomRequests.addGroupToClassroom(\r\n      group,\r\n      props.classroomId,\r\n      (newGroup: MockClassroomGroup) => {\r\n        AnalyticsHelper.logUserAction({\r\n          id: newGroup.id,\r\n          classroomId: props.classroomId\r\n        }, AnalyticsHelper.mergeOptions(props.analyticsOptions, {\r\n          actionType: UserAction.Create\r\n        }));\r\n\r\n        if (props.studentIds?.length) {\r\n          addStudentsToGroup(newGroup);\r\n          return;\r\n        }\r\n\r\n        successCallback(newGroup);\r\n      }, () => {\r\n        // TODO: Handle possible errors once we have a server side\r\n        alerts.error(getPhrase('error'));\r\n      }\r\n    ));\r\n  };\r\n\r\n  return (\r\n    <Popup title={getPhrase('title')} closePopup={props.closePopup} showLoadingSpinner={!classroom.data}>\r\n      <EditClassroomGroupDetails\r\n        saveGroup={saveGroupToClassroom}\r\n        onClickCancel={props.closePopup}\r\n      />\r\n    </Popup>\r\n  );\r\n}"],"sourceRoot":""}

package/dist/scripts/33-93b8d74603.chunk.js

@@ -0,0 +1 @@
+(window.webpackJsonp_clickview_lite=window.webpackJsonp_clickview_lite||[]).push([[33],{1237:function(t,e,n){t.exports={suggestionContainer:"_2omIR"}},1297:function(t,e,n){"use strict";n.r(e);var r=n(0),o=n(60),a=n(36),i=n(7),c=n(14),u=n(109),s=n(233),l=n(76),f=n(921);function y(t,e){var n=t,o=e,a=Object(f.a)(t&&function(t){return n(t).key});Object(r.useEffect)((function(){a.shouldInitialFetch&&e&&o()}),[a.shouldInitialFetch,e]),Object(r.useEffect)((function(){a.nextCursor&&!a.isFetching&&e&&o(a.nextCursor)}),[a.nextCursor,a.isFetching,e])}var d=n(153),p=n(849),g=function(t){return"recent:playlists:added:to:".concat(t)},m={getRecentlyAddedTo:function(t,e){var n=e.cacheGet(g(t));return Array.isArray(n)||(n=[]),n},setRecentlyAddedTo:function(t,e,n){Array.isArray(e)&&n.cacheSet(g(t),e)},addRecentlyAddedTo:function(t,e,n){var r=n.id,o=n.limit,a=void 0===o?5:o,i=m.getRecentlyAddedTo(t,e),c=i.indexOf(r);return c>-1&&i.splice(c,1),i.unshift(r),i.length>a&&(i=i.slice(0,a)),m.setRecentlyAddedTo(t,i,e),i}},v=n(83),h=n(830),b=n(235),S=n(125),P=n(34),O=n(52),w=n(13),j=n(924),I=n(1237),E=n.n(I);function A(t,e){return function(t){if(Array.isArray(t))return t}(t)||function(t,e){if("undefined"==typeof Symbol||!(Symbol.iterator in Object(t)))return;var n=[],r=!0,o=!1,a=void 0;try{for(var i,c=t[Symbol.iterator]();!(r=(i=c.next()).done)&&(n.push(i.value),!e||n.length!==e);r=!0);}catch(t){o=!0,a=t}finally{try{r||null==c.return||c.return()}finally{if(o)throw a}}return n}(t,e)||function(t,e){if(!t)return;if("string"==typeof t)return C(t,e);var n=Object.prototype.toString.call(t).slice(8,-1);"Object"===n&&t.constructor&&(n=t.constructor.name);if("Map"===n||"Set"===n)return Array.from(t);if("Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))return C(t,e)}(t,e)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function C(t,e){(null==e||e>t.length)&&(e=t.length);for(var n=0,r=new Array(e);n<e;n++)r[n]=t[n];return r}var k="playlists.selectPlaylist";function T(t){var e=P.a.isFunction(t.isVideoInPlaylist)&&t.isVideoInPlaylist(t.playlist),n=e?"":"cursor-pointer",o=e?w.b.Check:w.b.Plus,a="d-inline-block svg-container";e&&(a+=" text-success");var i=e?"This video is already in this playlist":"";return r.createElement("span",{className:n},r.createElement(O.a,{svgName:o,size:O.b.Small,className:a,title:i}),r.createElement("span",{className:"ml-2"},t.playlist.name))}function R(t){var e=A(r.useState(""),2),n=e[0],o=e[1],a="";n&&(a+=" border-bottom pb-2");var c=S.a.sortBy(t.playlists,"name"),s=m.getRecentlyAddedTo(t.currentUserId,u.a);return s=s.slice(0,3).map((function(e){return t.playlists.find((function(t){return t.id===e}))})),r.createElement(r.Fragment,null,r.createElement(j.a,{onQueryChange:function(t){return o(t.trim())},onSuggestionSelected:t.onSelectPlaylist,updateQueryOnSelection:!1,recentSearches:s,recentSearchHeading:i.a.getPhrase(k,"recentPlaylistsHeading"),suggestionsHeading:i.a.getPhrase(k,"suggestionsHeading"),local:c,initialSuggestions:c,activationLength:1,placeholder:i.a.getPhrase(k,"placeholder"),theme:{container:a,suggestionsContainer:"mt-1 ".concat(E.a.suggestionContainer),suggestionsContainerOpen:"",suggestion:"cursor-pointer py-1"},searchIconPlacement:"left",alwaysRenderSuggestions:!0,suggestionLimit:!1,getSuggestionComponent:function(e){return r.createElement(T,{playlist:e,isVideoInPlaylist:t.isVideoInPlaylist})},autoFocusInput:!0}),P.a.isFunction(t.createPlaylist)&&!!n&&r.createElement("div",{className:"pt-2 text-break"},r.createElement("span",{className:"cursor-pointer",onClick:function(){return t.createPlaylist(n)}},r.createElement(O.a,{svgName:w.b.Plus,size:O.b.Small}),r.createElement(l.b,{namespace:k,phrase:"createPlaylist",options:{name:n}}))))}function x(t,e){return function(t){if(Array.isArray(t))return t}(t)||function(t,e){if("undefined"==typeof Symbol||!(Symbol.iterator in Object(t)))return;var n=[],r=!0,o=!1,a=void 0;try{for(var i,c=t[Symbol.iterator]();!(r=(i=c.next()).done)&&(n.push(i.value),!e||n.length!==e);r=!0);}catch(t){o=!0,a=t}finally{try{r||null==c.return||c.return()}finally{if(o)throw a}}return n}(t,e)||function(t,e){if(!t)return;if("string"==typeof t)return F(t,e);var n=Object.prototype.toString.call(t).slice(8,-1);"Object"===n&&t.constructor&&(n=t.constructor.name);if("Map"===n||"Set"===n)return Array.from(t);if("Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))return F(t,e)}(t,e)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function F(t,e){(null==e||e>t.length)&&(e=t.length);for(var n=0,r=new Array(e);n<e;n++)r[n]=t[n];return r}n.d(e,"AddToPlaylistView",(function(){return D}));var L=i.a.encloseNamespace("playlists.addToPlaylist"),_=function(t){return p.a.getUserPlaylists(new h.a(v.a.AtoZ,t))},N=function(t,e){return function(n){return p.a.getVideoPlaylists(t,e,n)}};function D(t){var e=Object(o.useDispatch)(),n=x(r.useState(!1),2),i=n[0],g=n[1],v=c.a.useBasicFetch(d.a.currentUser()),h=c.a.useBasicFetch(b.a.video(t.videoId)),S=Object(f.a)((function(t){return _(t).key})),P=Object(f.a)((function(e){return!!v.data&&N(t.videoId,v.data.id)(e).key})),O=!!P.items&&P.items.map((function(t){return t.id}));y(_,(function(t){c.a.getFetch(e,_(t))()})),y(!!v.data&&N(t.videoId,v.data.id),!!v.data&&function(n){c.a.getFetch(e,N(t.videoId,v.data.id)(n))()});var w=function(n){g(!0);c.a.fetch(e,p.a.addToPlaylist(n.id,[t.videoId],(function(){t.closePopup(),m.addRecentlyAddedTo(v.data.id,u.a,{id:n.id})}),t.closePopup))},j=!(!h.data||!S.items||S.nextCursor||!v.data||!P.items||P.nextCursor);return r.createElement(s.a,{title:L("heading"),closePopup:t.closePopup,showLoadingSpinner:!j},j&&r.createElement(r.Fragment,null,r.createElement("div",{className:"mb-2"},r.createElement(l.b,{namespace:"playlists.addToPlaylist",phrase:"selectPlaylist",options:{video:h.data.name}})),i?r.createElement("div",{className:"text-center"},r.createElement(a.Spinner,{as:"span",animation:"border",role:"status",size:"sm"})):r.createElement(R,{playlists:S.items,currentUserId:v.data.id,onSelectPlaylist:function(t){O.includes(t.id)||w(t)},isVideoInPlaylist:function(t){return O.includes(t.id)},createPlaylist:function(t){g(!0),c.a.fetch(e,p.a.createPlaylist(v.data.id,{name:t},(function(t){t&&t.id&&w(t)})))}})))}},830:function(t,e,n){"use strict";n.d(e,"a",(function(){return d}));var r=n(240),o=n(83),a=n(853);function i(t){return(i="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t})(t)}function c(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function u(t,e){for(var n=0;n<e.length;n++){var r=e[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(t,r.key,r)}}function s(t,e){return(s=Object.setPrototypeOf||function(t,e){return t.__proto__=e,t})(t,e)}function l(t){var e=function(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Date.prototype.toString.call(Reflect.construct(Date,[],(function(){}))),!0}catch(t){return!1}}();return function(){var n,r=y(t);if(e){var o=y(this).constructor;n=Reflect.construct(r,arguments,o)}else n=r.apply(this,arguments);return f(this,n)}}function f(t,e){return!e||"object"!==i(e)&&"function"!=typeof e?function(t){if(void 0===t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return t}(t):e}function y(t){return(y=Object.setPrototypeOf?Object.getPrototypeOf:function(t){return t.__proto__||Object.getPrototypeOf(t)})(t)}var d=function(t){!function(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function");t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,writable:!0,configurable:!0}}),e&&s(t,e)}(f,t);var e,n,r,i=l(f);function f(){var t,e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:o.a.Newest,n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"",r=arguments.length>2&&void 0!==arguments[2]?arguments[2]:a.a.OwnedByMe;return c(this,f),(t=i.call(this,{collectionPrefix:"user:playlists",cursor:n,sort:e})).type=r,t}return e=f,(n=[{key:"toString",value:function(){return[this.collectionPrefix,this.sort,this.cursor,this.type].filter(Boolean).join(":")}}])&&u(e.prototype,n),r&&u(e,r),f}(r.a)},849:function(t,e,n){"use strict";var r=n(21),o=n(45),a=n(852);n(830);function i(t){return(i="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t})(t)}function c(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function u(t,e){return(u=Object.setPrototypeOf||function(t,e){return t.__proto__=e,t})(t,e)}function s(t){var e=function(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Date.prototype.toString.call(Reflect.construct(Date,[],(function(){}))),!0}catch(t){return!1}}();return function(){var n,r=f(t);if(e){var o=f(this).constructor;n=Reflect.construct(r,arguments,o)}else n=r.apply(this,arguments);return l(this,n)}}function l(t,e){return!e||"object"!==i(e)&&"function"!=typeof e?function(t){if(void 0===t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return t}(t):e}function f(t){return(f=Object.setPrototypeOf?Object.getPrototypeOf:function(t){return t.__proto__||Object.getPrototypeOf(t)})(t)}var y,d=function(t){!function(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function");t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,writable:!0,configurable:!0}}),e&&u(t,e)}(n,t);var e=s(n);function n(t){var r=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"";return c(this,n),e.call(this,{collectionPrefix:"playlist:videos",id:t,cursor:r})}return n}(n(240).a);!function(t){t[t.Queued=1]="Queued",t[t.Processing=2]="Processing",t[t.Processed=3]="Processed",t[t.Errored=4]="Errored"}(y||(y={}));var p=function(t,e){return function(n){var r=Object.assign({},n);return r.hasOwnProperty(t)&&(r[t]=Object.assign(Object.assign({},r[t]),e)),r}},g=function(t){return function(e){var n=Object.assign({},e);return n.hasOwnProperty(t)&&delete n[t],n}},m=function(t,e){return function(n){var r=Object.assign({},n);return r.hasOwnProperty(t)?(r[t].videos||(r[t].videos={}),r[t].videos.count=r[t].videos.count?r[t].videos.count+e:e,r):n}};n.d(e,"a",(function(){return S}));var v=function(t){return t?"&cursor=".concat(t):""},h=function(t){return Number.isInteger(t)?"&maxRatingValue=".concat(t):""},b=function(t,e){return"".concat(t).concat(e?":".concat(e):"")},S={getPlaylist:function(t,e,n){return{url:"/api/domain/v2/objects/".concat(t,"?query=").concat(o.a.PLAYLIST),key:"playlist:".concat(t),success:e,error:n}},getSharedPlaylist:function(t,e,n,r){var a="/api/domain/v2/share/".concat(t);return{url:"".concat(a,"?query=").concat(o.a.PLAYLIST).concat(h(e)),key:"shared:playlist:".concat(t),success:n,error:r}},getUserPlaylists:function(t){var e=t.sort,n=t.type;return{url:"/api/domain/v2/me/playlists/".concat(n,"?sort=").concat(e,"&query={limit:100}")+"".concat(o.a.PLAYLIST_COLLECTION).concat(v(t.cursor)),key:t.toString()}},getPlaylistVideos:function(t,e,n){var r="orderBy:orderindex,limit:100";return Number.isInteger(e)&&(r+=",rating.value:0...".concat(e)),{url:"/api/domain/v2/objects/".concat(t,"/videos?query={").concat(r,"}")+"".concat(o.a.VIDEO_COLLECTION).concat(v(n)),key:b("playlist:".concat(t,":videos"),n)}},getSharedPlaylistVideos:function(t,e,n){return{url:"/api/domain/v2/share/".concat(t,"/videos?query={orderBy:orderindex,limit:100}")+"".concat(o.a.SHARED_PLAYLIST_VIDEO_COLLECTION)+"".concat(v(n)).concat(h(e)),key:b("shared:playlist:".concat(t,":videos"),n)}},getVideoPlaylists:function(t,e,n){return{url:"/api/domain/v2/objects/".concat(t,"/playlists?query={limit:100,owner.id:[").concat(e,"]}"),key:b("video:playlists:".concat(t),n)}},createPlaylist:function(t,e,n,o){return{key:"create:playlist",url:"/api/domain/v2/objects/".concat(t,"/playlists"),data:e,type:r.a.POST,success:n,error:o,invalidationKeys:"user:playlists"}},updatePlaylist:function(t,e,n,o){return{key:"update:playlist",url:"/api/domain/v2/objects/".concat(t),data:e,type:r.a.PUT,success:n,error:o,updateState:{keys:"playlist:".concat(t),updateData:p("playlist:".concat(t),e)}}},deletePlaylist:function(t,e,n){return{key:"delete:playlist",url:"/api/domain/v2/objects/".concat(t),type:r.a.DELETE,success:e,error:n,invalidationKeys:"user:playlists",updateState:{keys:"playlist:".concat(t),updateData:g("playlist:".concat(t))}}},addToPlaylist:function(t,e,n,o){var a=["user:playlists",new d(t).toString()];return e.forEach((function(t){a.push("video:playlists:".concat(t))})),{key:"add:to:playlist",url:"/api/domain/v2/objects/".concat(t,"/associate"),data:e,type:r.a.POST,success:n,error:o,invalidationKeys:a,updateState:{keys:"playlist:".concat(t),updateData:m("playlist:".concat(t),e.length)}}},reorderVideos:function(t,e,n,o){return{key:"reorder:playlist",url:"/api/domain/v2/objects/".concat(t,"/videos/reorder"),data:e,type:r.a.PUT,success:n,error:o,invalidationKeys:"user:playlists",updateState:{keys:"playlist:".concat(t,":videos"),updateData:function(n){return a.a.updateState("playlist:".concat(t,":videos"),e,n)}}}},removePlaylistVideo:function(t,e,n,o){return{key:"remove:playlist:video",url:"/api/domain/v2/objects/".concat(t,"/dissociate?memberId=").concat(e),type:r.a.DELETE,success:n,error:o,invalidationKeys:["user:playlists","playlist:".concat(t,":videos")]}},getIsFollowingPlaylist:function(t,e){return{url:"/api/domain/v2/objects/".concat(e,"/followedPlaylists?query={id:").concat(t,"}"),key:"playlist:".concat(t,":following:").concat(e),formatData:function(e){var n,r;return{objectId:t,isFollowing:!!(null===(r=null===(n=e)||void 0===n?void 0:n.data)||void 0===r?void 0:r.length)}},normalize:!1}},followPlaylist:function(t,e,n,o,a){return{url:"/api/domain/v2/objects/".concat(e),key:"follow:playlist:".concat(t),data:{followedPlaylists:t},type:r.a.PUT,invalidationKeys:["user:playlists","playlist:".concat(t,":following:").concat(e)],success:n,error:o,always:a}},unfollowPlaylist:function(t,e,n,o,a){return{url:"/api/domain/v2/objects/".concat(e,"/followedplaylists/").concat(t),key:"unfollow:playlist:".concat(t),type:r.a.DELETE,invalidationKeys:["user:playlists","playlist:".concat(t,":following:").concat(e)],success:n,error:o,always:a}},getPlaylistPrivacy:function(t){return{key:"playlist:privacy:".concat(t),url:"/api/domain/v1/playlists/".concat(t,"/privacy"),formatData:function(e){return{id:t,privacy:e}}}},updatePlaylistPrivacy:function(t,e,n,o,a){return{key:"update:playlist:privacy:".concat(t),url:"/api/domain/v1/playlists/".concat(t,"/privacy"),type:r.a.PUT,data:{privacy:e},formatData:function(){return{id:t,privacy:e}},success:n,error:o,always:a}},getMigrationTask:function(t,e){return{url:"/api/playlist-app/migration-task",key:"migration:task",formatData:function(t){return t||{status:y.Processed}},success:t,error:e}}}},852:function(t,e,n){"use strict";n.d(e,"a",(function(){return c}));var r=n(125),o=n(54);function a(t){return function(t){if(Array.isArray(t))return i(t)}(t)||function(t){if("undefined"!=typeof Symbol&&Symbol.iterator in Object(t))return Array.from(t)}(t)||function(t,e){if(!t)return;if("string"==typeof t)return i(t,e);var n=Object.prototype.toString.call(t).slice(8,-1);"Object"===n&&t.constructor&&(n=t.constructor.name);if("Map"===n||"Set"===n)return Array.from(t);if("Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))return i(t,e)}(t)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function i(t,e){(null==e||e>t.length)&&(e=t.length);for(var n=0,r=new Array(e);n<e;n++)r[n]=t[n];return r}var c={reorder:function(t,e,n){if(e===n)return{reorderedItems:t,reorderRequest:null};var o=r.a.moveItem(t,e,n),a=n<t.length-1?o[n+1].id:null;return{reorderedItems:o,reorderRequest:{sourceMemberId:o[n].id,destinationMemberId:a}}},updateState:function(t,e,n){for(var i=[],c=o.a.deepClone(n),u=[t],s=n[t],l=!!s&&!!s.data&&s.data.length;s&&Array.isArray(s.data);){i.push.apply(i,a(s.data));var f=s.pagination&&s.pagination.cursors&&s.pagination.cursors.next,y=!!f&&"".concat(t,":").concat(f);(s=f&&n[y])&&u.push(y)}if(!i.length)return n;var d=r.a.findIndex(i,(function(t){return t.id===e.sourceMemberId})),p=[].concat(i),g=p.splice(d,1),m=e.destinationMemberId?r.a.findIndex(p,(function(t){return t.id===e.destinationMemberId})):p.length;return p.splice(m,0,g[0]),u.forEach((function(t){var e=p.splice(0,l);c[t].data=e})),c}}},853:function(t,e,n){"use strict";var r;n.d(e,"a",(function(){return r})),function(t){t.OwnedByMe="owned_by_me",t.Followed="followed",t.All="all"}(r||(r={}))},881:function(t,e,n){t.exports={input:"_3MysI",suggestionsContainerOpen:"ahMdW",sectionContainer:"xstWL",suggestionHighlighted:"_3YTCa"}},921:function(t,e,n){"use strict";n.d(e,"a",(function(){return l}));var r=n(0),o=n(60),a=n(14),i=n(34);function c(t){return function(t){if(Array.isArray(t))return u(t)}(t)||function(t){if("undefined"!=typeof Symbol&&Symbol.iterator in Object(t))return Array.from(t)}(t)||function(t,e){if(!t)return;if("string"==typeof t)return u(t,e);var n=Object.prototype.toString.call(t).slice(8,-1);"Object"===n&&t.constructor&&(n=t.constructor.name);if("Map"===n||"Set"===n)return Array.from(t);if("Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))return u(t,e)}(t)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function u(t,e){(null==e||e>t.length)&&(e=t.length);for(var n=0,r=new Array(e);n<e;n++)r[n]=t[n];return r}var s=function(t){return t&&t.data&&t.data.pagination&&t.data.pagination.cursors&&t.data.pagination.cursors.next};function l(t){return Object(o.useSelector)(Object(r.useMemo)((function(){return function(e){for(var n=t,r=i.a.isFunction(t)&&a.a.getResponse(e,n()),o=r&&r.isFetching,u=r&&r.shouldFetch,l=r&&r.data&&r.data.data,f=s(r);f&&(o=(r=a.a.getResponse(e,n(f))).isFetching,!r.shouldFetch);){var y=r.data&&r.data.data;y&&l.push.apply(l,c(y)),f=s(r)}return{shouldInitialFetch:u,items:l,nextCursor:f,isFetching:o}}}),[t]))}},924:function(t,e,n){"use strict";var r=n(0),o=n(811),a=n(34),i=n(7),c=n(151),u=n(150),s=n(21),l=n(14),f=n(54);function y(t){return(y="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t})(t)}var d,p={isNumber:function(t){return p.isType(t,"number")},isString:function(t){return p.isType(t,"string")},isType:function(t,e){return y(t)===e}},g=n(881),m=n.n(g);function v(t){return function(t){if(Array.isArray(t))return h(t)}(t)||function(t){if("undefined"!=typeof Symbol&&Symbol.iterator in Object(t))return Array.from(t)}(t)||function(t,e){if(!t)return;if("string"==typeof t)return h(t,e);var n=Object.prototype.toString.call(t).slice(8,-1);"Object"===n&&t.constructor&&(n=t.constructor.name);if("Map"===n||"Set"===n)return Array.from(t);if("Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))return h(t,e)}(t)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function h(t,e){(null==e||e>t.length)&&(e=t.length);for(var n=0,r=new Array(e);n<e;n++)r[n]=t[n];return r}function b(t,e,n){return e in t?Object.defineProperty(t,e,{value:n,enumerable:!0,configurable:!0,writable:!0}):t[e]=n,t}function S(t,e){return f.a.isObject(t)&&t.hasOwnProperty(e)&&p.isString(t[e])}function P(t,e,n){return function(r){var o=r.value;if(o.length||n(),!(o.length<t.activationLength)){if(t.local){var i=a.a.isFunction(t.getLocalSuggestions)?t.getLocalSuggestions(o,t.local):(c=o,u=t.local,f=t.valueKey,(y=c.trim().toLowerCase()).length?u.filter((function(t){return!(!S(t,f)||!p.isString(t[f]))&&t[f].trim().toLowerCase().includes(y)})):[]);e((function(t){return Object.assign(Object.assign({},t),b({},d.Local,i))}))}var c,u,f,y;t.getRemoteUrl&&function(t,e,n){var r=a.a.isFunction(t)&&t(e);r&&l.a.ajaxRequest({resource:r,type:s.a.GET,success:n,error:function(){}})}(t.getRemoteUrl,o,(function(n){return e((function(e){return Object.assign(Object.assign({},e),b({},d.Remote,a.a.isFunction(t.formatRemoteSuggestions)?t.formatRemoteSuggestions(n):n))}))}))}}}function O(t,e,n,r,o,i){var c=function(e){return t[e]||[]},u=e?c(d.Recent):[],s=c(d.Local),l=c(d.Remote),f=[];u.length&&f.push({title:n,data:u});var y=[].concat(v(s),v(l));return Number.isInteger(i)&&f.length>i&&y.slice(0,i),a.a.isFunction(o)?f.push.apply(f,v(o(y))):f.push({title:r,data:y}),f}function w(t){return t.data}function j(t){if(t.title)return r.createElement("strong",null,t.title)}!function(t){t.Local="local",t.Recent="recent",t.Remote="remote"}(d||(d={}));var I={container:"position-relative",suggestionsContainerOpen:"bg-white py-1 border rounded ".concat(m.a.suggestionsContainerOpen),suggestionsList:"list-unstyled m-0",suggestion:"cursor-pointer py-1 px-2",suggestionHighlighted:m.a.suggestionHighlighted,sectionContainer:"border-bottom py-1 ".concat(m.a.sectionContainer)};function E(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};return Object.assign(I,t)}var A=n(52),C=n(13),k=function(t,e){var n={};for(var r in t)Object.prototype.hasOwnProperty.call(t,r)&&e.indexOf(r)<0&&(n[r]=t[r]);if(null!=t&&"function"==typeof Object.getOwnPropertySymbols){var o=0;for(r=Object.getOwnPropertySymbols(t);o<r.length;o++)e.indexOf(r[o])<0&&Object.prototype.propertyIsEnumerable.call(t,r[o])&&(n[r[o]]=t[r[o]])}return n},T=function(t){var e="d-inline-block svg-container";return a.a.isFunction(t)?e+" cursor-pointer":e};function R(t){var e=t.onClickSearchIcon,n=t.searchIconPlacement,o=t.className,a=k(t,["onClickSearchIcon","searchIconPlacement","className"]),i="form-control ".concat(m.a.input),c="input-group-text bg-white";"right"===n&&(i+=" border-right-0",c+=" pl-0"),"left"===n&&(i+=" border-left-0",c+=" pr-0"),o&&(i+=" ".concat(o));var u=function(){return r.createElement("div",{className:c},r.createElement(A.a,{svgName:C.b.Search,size:A.b.Small,onClick:e,className:T(e)}))};return r.createElement("div",{className:"input-group"},"left"===n&&r.createElement("div",{className:"input-group-prepend"},r.createElement(u,null)),r.createElement("input",Object.assign({className:i},a)),"right"===n&&r.createElement("div",{className:"input-group-append"},r.createElement(u,null)))}function x(t,e){return function(t){if(Array.isArray(t))return t}(t)||function(t,e){if("undefined"==typeof Symbol||!(Symbol.iterator in Object(t)))return;var n=[],r=!0,o=!1,a=void 0;try{for(var i,c=t[Symbol.iterator]();!(r=(i=c.next()).done)&&(n.push(i.value),!e||n.length!==e);r=!0);}catch(t){o=!0,a=t}finally{try{r||null==c.return||c.return()}finally{if(o)throw a}}return n}(t,e)||function(t,e){if(!t)return;if("string"==typeof t)return F(t,e);var n=Object.prototype.toString.call(t).slice(8,-1);"Object"===n&&t.constructor&&(n=t.constructor.name);if("Map"===n||"Set"===n)return Array.from(t);if("Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))return F(t,e)}(t,e)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function F(t,e){(null==e||e>t.length)&&(e=t.length);for(var n=0,r=new Array(e);n<e;n++)r[n]=t[n];return r}n.d(e,"a",(function(){return _}));var L=a.a.isFunction;function _(t){var e,n,a,s=(e=t.initialSuggestions,n=t.recentSearches,b(a={},d.Recent,n),b(a,d.Local,e),b(a,d.Remote,[]),a),l=x(r.useState(t.initialQuery||""),2),f=l[0],y=l[1],p=x(r.useState(s),2),g=p[0],m=p[1],v=Object(c.a)(u.a.XS),h=function(){m(s)},I=function(e){e.preventDefault(),L(t.onSubmit)&&t.onSubmit(f)};return r.createElement("form",{onSubmit:I},r.createElement(o,{suggestions:O(g,!f,t.recentSearchHeading||i.a.getPhrase("shared.searchBar","recentSearchHeading"),t.suggestionsHeading,t.getSections,t.suggestionLimit),onSuggestionsFetchRequested:P(t,m,h),onSuggestionsClearRequested:function(){t.alwaysRenderSuggestions||h()},onSuggestionSelected:function(e,n){var r=n.suggestion;t.clearQueryOnSelect&&y(""),t.onSuggestionSelected(r)},getSuggestionValue:function(e){return t.updateQueryOnSelection?function(t,e){return S(e,t)?e[t]:""}(t.valueKey,e):f},renderSuggestion:function(e){return L(t.getSuggestionComponent)?t.getSuggestionComponent(e):function(t,e){return S(e,t)?r.createElement(r.Fragment,null,e[t]):r.createElement(r.Fragment,null)}(t.valueKey,e)},alwaysRenderSuggestions:t.alwaysRenderSuggestions,focusInputOnSuggestionClick:!v,inputProps:{placeholder:t.placeholder||i.a.getPhrase("shared.searchBar","placeholder"),value:f,onChange:function(e,n){var r=n.newValue;y(r),L(t.onQueryChange)&&t.onQueryChange(r)},onKeyDown:function(e){8===e.keyCode&&t.onBackspace&&!f&&t.onBackspace()},autoFocus:!!t.autoFocusInput,onClickSearchIcon:!!t.submitOnClickSearchIcon&&I,searchIconPlacement:t.searchIconPlacement},renderInputComponent:R,theme:E(t.theme),multiSection:!0,renderSectionTitle:j,getSectionSuggestions:w}))}_.defaultProps={updateQueryOnSelection:!0,valueKey:"name",activationLength:3,suggestionLimit:5,recentSearches:[],initialSuggestions:[],searchIconPlacement:"right"}}}]);