@clickview/lite 0.48.0-rc.2 → 0.48.0-rc.3

package/dist/scripts/{6274-7d4c6ba241-lite.chunk.js.map → 6274-473fcd2e63-lite.chunk.js.map}

@@ -1 +1 @@
-{"version":3,"file":"scripts/6274-7d4c6ba241-lite.chunk.js","mappings":"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","sources":["file:///app/packages/libs/shared/src/components/forms/form-checkbox/FormCheckbox.tsx","file:///app/packages/libs/shared/src/components/forms/form-field/CharacterCounter.tsx","file:///app/packages/libs/shared/src/components/forms/form-field/form-field.scss","file:///app/packages/libs/shared/src/components/forms/form-field/FormField.tsx","file:///app/packages/libs/shared/src/components/forms/form-wrapper/FormWrapper.tsx","file:///app/packages/libs/shared/src/utils/FormHelper.ts","file:///app/packages/libs/shared/src/utils/GroupHelper.ts","file:///app/packages/projects/lite/src/apps/classrooms/components/colour-picker/colour-picker.scss","file:///app/packages/projects/lite/src/apps/classrooms/components/colour-picker/ColourPicker.tsx","file:///app/packages/projects/lite/src/apps/classrooms/components/classroom-group-details-form/classroom-group-details-form.scss","file:///app/packages/projects/lite/src/apps/classrooms/components/classroom-group-details-form/ClassroomGroupDetailsForm.tsx","file:///app/packages/projects/lite/src/apps/classrooms/validation/ClassroomGroupValidationSchema.ts","file:///app/packages/projects/lite/src/apps/classrooms/components/edit-classroom-group-details/EditClassroomGroupDetails.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Form } from 'react-bootstrap';\nimport { FieldAttributes } from 'formik';\n\nimport { AppLink } from 'libs/shared/components/app-link/AppLink';\n\nimport { FieldWrapper, FormFieldProps } from '../form-field/FormField';\n\n/**\n * Use this checkbox within Formik contexts\n */\nexport function FormCheckbox(props: FieldAttributes<FormFieldProps>): JSX.Element {\n  const { label, checkboxLabelClassName, checkboxLabelFontWeight, className, ...fieldProps } = props;\n\n  return (\n    <Form.Group className='form-group'>\n      <div className={`form-check ${className || ''}`}>\n        <FieldWrapper className='form-check-input' {...fieldProps} />\n        <Form.Label\n          className={`form-check-label cursor-pointer ${checkboxLabelFontWeight === 'normal' ? 'fw-normal' : ''} \n          ${checkboxLabelClassName}`}\n          htmlFor={fieldProps.id}\n        >\n          {label}\n        </Form.Label>\n        {props.checkboxAppLink && props.checkboxAppLinkText && (\n          <>\n            <span>&nbsp;</span>\n            <AppLink appLink={props.checkboxAppLink} className='info-link'>\n              {props.checkboxAppLinkText}\n            </AppLink>\n          </>\n        )}\n      </div>\n    </Form.Group>\n  );\n}\n\n","import * as React from 'react';\nimport { useFormikContext } from 'formik';\n\nimport { HashObject } from 'libs/common/react/interfaces';\n\ninterface CharacterCounterProps<Values extends HashObject> {\n  fieldName: keyof Values;\n  limit: number;\n}\n\nexport function CharacterCounter<Values extends HashObject>(props: CharacterCounterProps<Values>): JSX.Element {\n  const { values } = useFormikContext<Values>();\n\n  const field = values[props.fieldName];\n\n  if (typeof field !== 'string')\n    return <></>;\n\n  return (\n    <div className='float-end text-secondary fw-normal'>\n      {field.length}/{props.limit} characters\n    </div>\n  );\n}","// extracted by mini-css-extract-plugin\nexport default {\"revealPassword\":\"jCfI0\",\"passwordInput\":\"RBJnf\",\"passwordContainer\":\"d78lK\",\"passwordContainerDisabled\":\"asbVo\",\"infoTooltip\":\"wzyOG\",\"spinner\":\"CycFx\"};","import * as React from 'react';\nimport { Form, Spinner } from 'react-bootstrap';\nimport { Placement } from 'react-bootstrap/esm/types';\nimport { ErrorMessage, Field, FieldAttributes, FieldProps, useFormikContext } from 'formik';\n\nimport { Core } from 'libs/common/backbone/index';\nimport { FunctionHelper } from 'libs/common/backbone/utils/FunctionHelper';\nimport { HashObject } from 'libs/common/react/interfaces';\nimport { ObjectHelper } from 'libs/common/react/utils/ObjectHelper';\n\nimport { FormCheckbox } from 'libs/shared/components/forms/form-checkbox/FormCheckbox';\nimport { SvgContainer } from 'libs/shared/components/svg-container/SvgContainer';\nimport { Text } from 'libs/shared/components/text/Text';\nimport { FormHelper } from 'libs/shared/utils/FormHelper';\nimport { cvSvgLibrary } from 'libs/shared/utils/SvgHelper';\n\nimport { CharacterCounter } from './CharacterCounter';\n\nimport styles from './form-field.scss';\n\nconst namespace = 'shared.formField';\n\nexport type FormSize = 'lg' | 'sm';\n\n// If checkboxLabelFontWeight is not specified, it will be bold by default\nexport type CheckboxLabelFontWeight = 'normal' | 'bold'\n\nexport interface FormFieldProps {\n  /**\n   * The name prop MUST be the same as the attribute\n   * name of the value that the field is bound to.\n   */\n  name: string;\n  label?: string;\n  children?: any;\n  showCharacterCounter?: boolean;\n  showRequiredStar?: boolean;\n  checkboxAppLink?: Core.AppLink;\n  checkboxAppLinkText?: string;\n  checkboxLabelClassName?: string;\n  checkboxLabelFontWeight?: CheckboxLabelFontWeight\n  infoTooltip?: string;\n  infoTooltipPlacement?: Placement;\n  infoText?: string;\n  formSize?: FormSize;\n  showOptionalLabel?: boolean;\n  showLoadingSpinner?: boolean;\n}\n\nFieldWrapper.defaultProps = {\n  autoComplete: 'off'\n};\n\nexport function FieldWrapper(\n  props: FieldAttributes<FormFieldProps> & { className: string }\n): React.ReactElement {\n  const { children, showLoadingSpinner, ...fieldProps } = props;\n\n  const [ type, setType ] = React.useState(props.type);\n\n  function onClickTogglePassword(): void {\n    if (type === 'password')\n      setType('text');\n    else\n      setType('password');\n  }\n\n  const resolvedChildren = FunctionHelper.isFunction(children)\n    ? (f: FieldProps) => children(f)\n    : React.Children.count(children) ? children : null;\n\n  if (fieldProps.type !== 'password') {\n    if (showLoadingSpinner) {\n      return (\n        <div className='position-relative'>\n          <Field {...(ObjectHelper.omit(fieldProps, ['formSize']))}>\n            {resolvedChildren}\n          </Field>\n\n          <div className={styles.spinner}>\n            <Spinner animation='border' size='sm' />\n          </div>\n        </div>\n      );\n    }\n\n    return (\n      <Field {...(ObjectHelper.omit(fieldProps, ['formSize']))}>\n        {resolvedChildren}\n      </Field>\n    );\n  }\n\n  let containerClassName = `position-relative ${styles.passwordContainer}`;\n\n  if (fieldProps.className)\n    containerClassName += ` ${fieldProps.className}`;\n\n  if (fieldProps.disabled)\n    containerClassName += ` ${styles.passwordContainerDisabled}`;\n\n  /**\n   * We need to wrap out input with a relatively positioned element in order to absolutely\n   * position our visibility icon to reveal the password - Sha\n   */\n  return (\n    <div className={containerClassName}>\n      <Field\n        {...(ObjectHelper.omit(fieldProps, [ 'formSize', 'type', 'className' ]))}\n        type={type}\n        className={`${styles.passwordInput} border-0 w-100 h-100 outline-none rounded`}\n      >\n        {resolvedChildren}\n      </Field>\n      {fieldProps.type === 'password' &&\n        <SvgContainer\n          svgName={type === 'password' ? cvSvgLibrary.VisibleOn : cvSvgLibrary.VisibleOff}\n          className={`svg-container cursor-pointer ${styles.revealPassword}`}\n          onClick={onClickTogglePassword}\n        />\n      }\n    </div>\n  );\n}\n\nFormField.defaultProps = {\n  autoComplete: 'off',\n  infoTooltipPlacement: 'top'\n};\n\nexport function FormField<Values extends HashObject>(props: FieldAttributes<FormFieldProps>): React.ReactElement {\n  const {\n    label,\n    className,\n    showCharacterCounter,\n    showRequiredStar,\n    infoTooltip,\n    infoTooltipPlacement,\n    infoText,\n    formSize,\n    showOptionalLabel,\n    ...fieldProps\n  } = props;\n\n  const { errors, touched } = useFormikContext<Values>();\n\n  // This function overwrites the default `onChange` function whenever `props.disabled` is set.\n  // This prevents users from \"undisabling\" form fields via inspect element, then editing the field.\n  const disabledOnChange = () => {};\n\n  if (fieldProps.type === 'checkbox') {\n    const _props = ObjectHelper.omit(props, [ 'formSize', 'infoTooltipPlacement' ]);\n\n    if (props.disabled)\n      _props.onChange = disabledOnChange;\n\n    return <FormCheckbox {..._props} />;\n  }\n\n  const fieldWrapperProps = {\n    ...fieldProps,\n    className: FormHelper.getCustomFormControlClassName(\n      errors,\n      touched,\n      fieldProps.name,\n      formSize,\n      className,\n      typeof props.as === 'string' ? props.as : null\n    )\n  };\n\n  if (props.disabled)\n    fieldWrapperProps.onChange = disabledOnChange;\n\n  return (\n    <Form.Group className='form-group'>\n      {!!label && (\n        <Form.Label htmlFor={fieldProps.id} className='d-flex align-items-center'>\n          {label}\n          {showRequiredStar && <span className='text-danger'>*</span>}\n          {infoTooltip && (\n            <SvgContainer\n              className={`svg-container text-secondary ${styles.infoTooltip}`}\n              svgName={cvSvgLibrary.Info}\n              title={infoTooltip}\n              tooltipPlacement={infoTooltipPlacement}\n              tooltipSpanHack\n            />\n          )}\n          {showOptionalLabel && <span className='text-secondary'>&nbsp;<Text namespace={namespace} phrase='optional' /></span>}\n          \n          {!!showCharacterCounter && !!(fieldProps as React.HTMLProps<HTMLInputElement>).maxLength &&\n            <div className='ms-auto'>\n              <CharacterCounter\n                fieldName={(fieldProps.name as keyof Values)}\n                limit={(fieldProps as React.HTMLProps<HTMLInputElement>).maxLength}\n              />\n            </div>\n          }\n        </Form.Label>\n      )}\n\n      <FieldWrapper {...fieldWrapperProps} />\n\n      {!!infoText &&\n        <Form.Text className='text-secondary'>\n          {infoText}\n        </Form.Text>\n      }\n\n      <ErrorMessage name={fieldProps.name}>\n        {(errorMessage: string) => <Form.Control.Feedback type='invalid'>{errorMessage}</Form.Control.Feedback>}\n      </ErrorMessage>\n    </Form.Group>\n  );\n}","import * as React from 'react';\nimport { Formik, FormikConfig, FormikContextType, FormikErrors, FormikHelpers, FormikProps, FormikValues, useFormikContext } from 'formik';\n\nimport { FunctionHelper } from 'libs/common/backbone/utils/FunctionHelper';\nimport { HashObject } from 'libs/common/react/interfaces';\nimport { ObjectHelper } from 'libs/common/react/utils/ObjectHelper';\n\n/**\n * Note: This currently doesn't support arrays, but the need for arrays as initial\n * form data has not yet come up\n */\nfunction omitNullInitialValues<Values extends FormikValues>(initialValues: Values): Values {\n  if (!initialValues)\n    return {} as Values;\n\n  const values = ObjectHelper.deepClone(initialValues);\n\n  function omitChildValues(child: Values): void {\n    Object.keys(values).forEach((key: keyof Values) => {\n      if (!values.hasOwnProperty(key))\n        return;\n  \n      if (ObjectHelper.isObject(child[key]))\n        omitChildValues(child[key]);\n      else if (values[key] === null)\n        delete values[key];\n    });\n  }\n\n  omitChildValues(values);\n  return values;\n}\n\n// Omit attributes from FormikConfig that are defined in FormWrapperProps.\ntype ModifiedFormikConfig<Values extends FormikValues> = Omit<FormikConfig<Values>, 'initialValues' | 'onSubmit'>;\n\ninterface InitialStatus {\n  allowInitialSubmit: boolean;\n}\n\nexport type FormSubmissionOptions<FormValues = FormikValues> = {\n  reset?: boolean;\n  errors?: FormikErrors<FormValues>;\n};\n\ninterface FormWrapperProps<FormValues extends FormikValues, ApiValues extends FormikValues> {\n  initialValues: Partial<FormValues | ApiValues>;\n  onSubmit: (data: FormValues, onDone: (options?: FormSubmissionOptions<FormValues>) => void) => void;\n  castInitialValues?: boolean; // cast to validationSchema\n  castValuesOnSubmit?: boolean; // cast to validationSchema\n  allowInitialSubmit?: boolean; // if true, useCanSubmitForm will allow submit without any user changes.\n}\n\nFormWrapper.defaultProps = {\n  castInitialValues: true,\n  castValuesOnSubmit: true\n};\n\nexport function FormWrapper<\n  FormValues extends FormikValues = FormikValues,\n  ApiValues extends FormikValues = FormValues,\n  ExtraProps = HashObject\n>(props: ModifiedFormikConfig<FormValues> & ExtraProps & FormWrapperProps<FormValues, ApiValues>): JSX.Element {\n  const { castInitialValues, castValuesOnSubmit, initialValues, onSubmit, ...formikProps } = props;\n\n  /**\n   * If castInitialValues is true, cast initialValues to the validationSchema.\n   * This will ensure that any data fetched from the api conforms to the expected form data shape.\n   */\n  const formattedInitialValues: FormValues = castInitialValues && props.validationSchema\n    ? props.validationSchema.cast(omitNullInitialValues(initialValues))\n    : initialValues;\n\n  const onSubmitHandler = (\n    values: FormValues,\n    { setSubmitting, resetForm, setFieldError }: FormikHelpers<FormValues>\n  ) => {\n    /**\n     * validationSchema.cast will coerce the values to the types defined in validationSchema.\n     * This is useful for trimming inputs:\n     * e.g. if a value field has type Yup.string().trim(), it will be automatically trimmed.\n     */\n    const formattedData = castValuesOnSubmit && props.validationSchema\n      ? props.validationSchema.cast(values)\n      : values;\n\n    onSubmit(formattedData, (options: FormSubmissionOptions<FormValues> = {}) => {\n      options.reset && resetForm();\n\n      if (options.errors) {\n        for (const [ key, value ] of Object.entries(options.errors)) {\n          setFieldError(key, value);\n        }\n      }\n\n      setSubmitting(false);\n    });\n  };\n\n  const initialStatus: InitialStatus = {\n    allowInitialSubmit: props.allowInitialSubmit\n  };\n\n  return (\n    <Formik<FormValues, ExtraProps>\n      enableReinitialize\n      {...(formikProps as ModifiedFormikConfig<FormValues> & ExtraProps)}\n      initialValues={formattedInitialValues}\n      onSubmit={onSubmitHandler}\n      initialStatus={initialStatus}\n    >\n      {FunctionHelper.isFunction(props.children)\n        ? (f: FormikProps<FormValues>) => (props.children as (f: FormikProps<FormValues>) => React.ReactNode)(f)\n        : React.Children.count(props.children) ? props.children : null\n      }\n    </Formik>\n  );\n}\n\nexport function useFormikContextWrapper<T>(): FormikContextType<T> {\n  return useFormikContext<T>();\n}","import { FormikErrors, FormikTouched, getIn } from 'formik';\n\nimport { FormSize } from 'libs/shared/components/forms/form-field/FormField';\n\nfunction getTypeSize(type: string, size: FormSize) {\n  let className = '';\n\n  switch (type) {\n    case 'select':\n      className = 'form-select';\n      break;\n    default:\n      className = 'form-control';\n  }\n\n  if (size === 'sm')\n    className += ` ${className}-sm`;\n\n  if (size === 'lg')\n    className += ` ${className}-lg`;\n\n  return className;\n}\n\nexport const FormHelper = {\n  getCustomFormControlClassName<T>(\n    errors: FormikErrors<T>,\n    touched: FormikTouched<T>,\n    attribute: string,\n    size?: FormSize,\n    additionalClassName?: string,\n    type?: string\n  ): string {\n    let className = '';\n\n    className = getTypeSize(type, size);\n\n    // Using getIn as it supports dot notation\n    if (getIn(touched, attribute) && getIn(errors, attribute))\n      className += ' is-invalid';\n\n    if (additionalClassName)\n      className += ` ${additionalClassName}`;\n\n    return className;\n  }\n};","import { ButtonProps } from 'react-bootstrap';\n\nimport { ClassroomGroupColour } from 'libs/shared/interfaces';\n\nexport function mapColourToBsVariant(groupColour: ClassroomGroupColour): ButtonProps['variant'] {\n  switch (groupColour) {\n    case ClassroomGroupColour.Pink:\n      return 'pink';\n    case ClassroomGroupColour.Orange:\n      return 'orange';\n    case ClassroomGroupColour.Green:\n      return 'green';\n    case ClassroomGroupColour.Blue:\n      return 'blue';\n    case ClassroomGroupColour.Purple:\n      return 'purple';\n    case ClassroomGroupColour.Indigo:\n      return 'indigo';\n    default:\n      return 'pink';\n  }\n}\n","// extracted by mini-css-extract-plugin\nexport default {\"dropdownToggle\":\"ajlHC\",\"colourButton\":\"ixMmY\",\"colourList\":\"qSQt0\",\"colourOption\":\"Uln9P\",\"selected\":\"XEvln\"};","import React from 'react';\nimport { Dropdown } from 'react-bootstrap';\n\nimport { HashObject } from 'libs/common/react/interfaces/HashObject';\n\nimport { DivButton } from 'libs/shared/components/div-button/DivButton';\nimport { SvgContainer } from 'libs/shared/components/svg-container/SvgContainer';\nimport { ClassroomGroupColour } from 'libs/shared/interfaces';\nimport { mapColourToBsVariant } from 'libs/shared/utils/GroupHelper';\nimport { cvSvgLibrary } from 'libs/shared/utils/SvgHelper';\n\nimport styles from './colour-picker.scss';\n\ninterface ColourPickerProps {\n  id: string;\n  onSelect?: (colour: string) => void;\n  selection?: ClassroomGroupColour;\n  disabled?: boolean;\n}\n\nColourPicker.defaultProps = {\n  selection: ClassroomGroupColour.Pink,\n  onSelect: () => {}\n};\n\nexport function ColourPicker(props: ColourPickerProps): JSX.Element {\n  function getToggleButtonClass(): string {\n    const baseClass = `${styles.dropdownToggle} p-0 d-flex align-items-center text-decoration-none h-100`;\n    const disabledClass = props.disabled ? 'cursor-default' : '';\n\n    return `${baseClass} ${disabledClass}`;\n  }\n\n  function getOptionClass(colour: ClassroomGroupColour, selection: ClassroomGroupColour): string {\n    const baseClass = `${styles.colourOption} position-relative`;\n    const disabledClass = props.disabled ? 'cursor-default' : '';\n    const colorClass = mapColourToBsVariant(colour);\n    const selectedClass = colour === selection ? `${styles.selected} border border-dark` : '';\n\n    return `${baseClass} ${disabledClass} bg-${colorClass} ${selectedClass}`;\n  }\n\n  const dropdownProps: HashObject = { className: 'h-100 dropdown' };\n  if (props.disabled)\n    dropdownProps.show = false;\n\n  return (\n    <Dropdown {...dropdownProps}>\n      <Dropdown.Toggle id={props.id} variant='link' className={getToggleButtonClass()}>\n        <div className={`d-flex align-items-center border border-secondary rounded bg-white h-100 ${styles.colourButton}`}>\n          <div className={`px-0 py-1 rounded bg-${mapColourToBsVariant(props.selection)}`}>\n            &nbsp;\n          </div>\n          {!props.disabled &&\n            <SvgContainer svgName={cvSvgLibrary.Caret} />\n          }\n        </div>\n      </Dropdown.Toggle>\n\n      <Dropdown.Menu>\n        <ul className={`${styles.colourList} list-unstyled d-flex flex-wrap px-2 m-0`}>\n          {Object.keys(ClassroomGroupColour).map(colourKey => {\n            const colour = (ClassroomGroupColour as any)[colourKey];\n\n            return (\n              <li key={`${props.id}:${colour}`} className='m-1'>\n                <DivButton\n                  onClick={() => props.onSelect(colour)}\n                  className={getOptionClass(colour, props.selection)}\n                >\n                  &nbsp;\n                </DivButton>\n              </li>\n            );\n          })}\n        </ul>\n      </Dropdown.Menu>\n    </Dropdown>\n  );\n}","// extracted by mini-css-extract-plugin\nexport default {\"groupNameInput\":\"CsVDW\",\"colourPickerContainer\":\"DdjHF\"};","import React from 'react';\nimport { Form } from 'formik';\n\nimport { LanguageService } from 'libs/common/backbone/services/LanguageService';\n\nimport { FormField } from 'libs/shared/components/forms/form-field/FormField';\nimport { useFormikContextWrapper } from 'libs/shared/components/forms/form-wrapper/FormWrapper';\nimport { PopupButtons } from 'libs/shared/components/popup/PopupButtons';\nimport { Text } from 'libs/shared/components/text/Text';\n\nimport { ColourPicker } from 'apps/classrooms/components/colour-picker/ColourPicker';\nimport { EditClassroomGroupRequest } from 'apps/classrooms/interfaces/EditClassroomGroupRequest';\n\nimport styles from './classroom-group-details-form.scss';\n\nconst namespace = 'classrooms.classroomGroupDetailsForm';\nconst getPhrase = LanguageService.encloseNamespace(namespace);\n\ninterface ClassroomGroupDetailsFormProps {\n  isNew: boolean;\n  onClickCancel: () => void;\n}\n\nexport function ClassroomGroupDetailsForm(props: ClassroomGroupDetailsFormProps): JSX.Element {\n  const formikProps = useFormikContextWrapper<EditClassroomGroupRequest>();\n\n  return (\n    <Form>\n      <div className='d-flex'>\n        <div className='form-group me-2'>\n          <label htmlFor={`${props.isNew ? 'create' : 'edit'}-classroom-group`}><Text namespace={namespace} phrase='colourLabel' /></label>\n          <div className={styles.colourPickerContainer}>\n            <ColourPicker\n              onSelect={c => formikProps.setFieldValue('colour', c)}\n              selection={formikProps.values.colour}\n              id={`${props.isNew ? 'create' : 'edit'}-classroom-group`}\n            />\n          </div>\n        </div>\n        <div className='form-group w-75'>\n          <label htmlFor='name'><Text namespace={namespace} phrase='nameLabel' /></label>\n          <FormField\n            type='text'\n            name='name'\n            id='name'\n            className={`${styles.groupNameInput}`}\n            placeholder={getPhrase('groupNamePlaceholder')}\n            autoFocus\n            value={formikProps.values.name}\n          />\n        </div>\n      </div>\n\n      <PopupButtons>\n        <PopupButtons.Cancel onClick={props.onClickCancel} />\n        <PopupButtons.Submit variant='dark' isNew={props.isNew} />\n      </PopupButtons>\n    </Form>\n  );\n}","import { object, string } from 'yup';\n\nimport { LanguageService } from 'libs/common/backbone/services/LanguageService';\n\nimport { ClassroomGroupColour } from 'libs/shared/interfaces';\n\nconst getPhrase = LanguageService.encloseNamespace('classrooms.classroomValidation');\n\nexport const ClassroomGroupValidationSchema = object().shape({\n  name: string()\n    .max(255, () => getPhrase('nameExceeds'))\n    .required(() => getPhrase('nameRequired'))\n    .default(''),\n  description: string()\n    .default(''),\n  colour: string()\n    .required(() => getPhrase('colourRequired'))\n    .default(ClassroomGroupColour.Pink)\n});","import React from 'react';\n\nimport { FormWrapper } from 'libs/shared/components/forms/form-wrapper/FormWrapper';\nimport { ClassroomGroup } from 'libs/shared/interfaces';\n\nimport { ClassroomGroupDetailsForm } from 'apps/classrooms/components/classroom-group-details-form/ClassroomGroupDetailsForm';\nimport { EditClassroomGroupRequest } from 'apps/classrooms/interfaces/EditClassroomGroupRequest';\nimport { ClassroomGroupValidationSchema } from 'apps/classrooms/validation/ClassroomGroupValidationSchema';\n\ninterface EditClassroomGroupDetailsProps {\n  group?: ClassroomGroup;\n  saveGroup: (group: EditClassroomGroupRequest) => void;\n  onClickCancel: () => void;\n}\n\nexport function EditClassroomGroupDetails(props: EditClassroomGroupDetailsProps): React.ReactElement {\n  const { group, saveGroup, onClickCancel } = props;\n\n  const initialValues: EditClassroomGroupRequest = {\n    id: group?.id,\n    name: group?.name,\n    description: group?.description,\n    colour: group?.metadata?.colour\n  };\n\n  return (\n    <FormWrapper<EditClassroomGroupRequest>\n      initialValues={initialValues}\n      validationSchema={ClassroomGroupValidationSchema}\n      onSubmit={saveGroup}\n    >\n      <ClassroomGroupDetailsForm isNew={!group} onClickCancel={onClickCancel} />\n    </FormWrapper>\n  );\n}"],"names":["FormCheckbox","props","label","checkboxLabelClassName","checkboxLabelFontWeight","className","fieldProps","Form","FieldWrapper","htmlFor","id","checkboxAppLink","checkboxAppLinkText","AppLink","appLink","CharacterCounter","field","values","fieldName","length","limit","namespace","children","showLoadingSpinner","type","setType","resolvedChildren","FunctionHelper","f","ObjectHelper","Spinner","animation","size","containerClassName","disabled","SvgContainer","svgName","onClick","FormField","showCharacterCounter","showRequiredStar","infoTooltip","infoTooltipPlacement","infoText","formSize","showOptionalLabel","errors","touched","disabledOnChange","_props","onChange","fieldWrapperProps","FormHelper","name","as","title","tooltipPlacement","tooltipSpanHack","Text","phrase","maxLength","errorMessage","defaultProps","autoComplete","FormWrapper","castInitialValues","castValuesOnSubmit","initialValues","onSubmit","formikProps","formattedInitialValues","validationSchema","cast","omitChildValues","child","Object","keys","forEach","key","hasOwnProperty","omitNullInitialValues","initialStatus","allowInitialSubmit","enableReinitialize","setSubmitting","resetForm","setFieldError","formattedData","options","reset","entries","value","useFormikContextWrapper","getCustomFormControlClassName","attribute","additionalClassName","getTypeSize","mapColourToBsVariant","groupColour","ColourPicker","getOptionClass","colour","selection","baseClass","disabledClass","colorClass","selectedClass","dropdownProps","show","Dropdown","variant","map","colourKey","DivButton","onSelect","getPhrase","LanguageService","ClassroomGroupDetailsForm","isNew","c","setFieldValue","placeholder","autoFocus","PopupButtons","onClickCancel","ClassroomGroupValidationSchema","shape","max","required","description","EditClassroomGroupDetails","group","saveGroup","metadata"],"sourceRoot":""}
+{"version":3,"file":"scripts/6274-473fcd2e63-lite.chunk.js","mappings":"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","sources":["file:///app/packages/libs/shared/src/components/forms/form-checkbox/FormCheckbox.tsx","file:///app/packages/libs/shared/src/components/forms/form-field/CharacterCounter.tsx","file:///app/packages/libs/shared/src/components/forms/form-field/form-field.scss","file:///app/packages/libs/shared/src/components/forms/form-field/FormField.tsx","file:///app/packages/libs/shared/src/components/forms/form-wrapper/FormWrapper.tsx","file:///app/packages/libs/shared/src/utils/FormHelper.ts","file:///app/packages/libs/shared/src/utils/GroupHelper.ts","file:///app/packages/projects/lite/src/apps/classrooms/components/colour-picker/colour-picker.scss","file:///app/packages/projects/lite/src/apps/classrooms/components/colour-picker/ColourPicker.tsx","file:///app/packages/projects/lite/src/apps/classrooms/components/classroom-group-details-form/classroom-group-details-form.scss","file:///app/packages/projects/lite/src/apps/classrooms/components/classroom-group-details-form/ClassroomGroupDetailsForm.tsx","file:///app/packages/projects/lite/src/apps/classrooms/validation/ClassroomGroupValidationSchema.ts","file:///app/packages/projects/lite/src/apps/classrooms/components/edit-classroom-group-details/EditClassroomGroupDetails.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Form } from 'react-bootstrap';\nimport { FieldAttributes } from 'formik';\n\nimport { AppLink } from 'libs/shared/components/app-link/AppLink';\n\nimport { FieldWrapper, FormFieldProps } from '../form-field/FormField';\n\n/**\n * Use this checkbox within Formik contexts\n */\nexport function FormCheckbox(props: FieldAttributes<FormFieldProps>): JSX.Element {\n  const { label, checkboxLabelClassName, checkboxLabelFontWeight, className, ...fieldProps } = props;\n\n  return (\n    <Form.Group className='form-group'>\n      <div className={`form-check ${className || ''}`}>\n        <FieldWrapper className='form-check-input' {...fieldProps} />\n        <Form.Label\n          className={`form-check-label cursor-pointer ${checkboxLabelFontWeight === 'normal' ? 'fw-normal' : ''} \n          ${checkboxLabelClassName}`}\n          htmlFor={fieldProps.id}\n        >\n          {label}\n        </Form.Label>\n        {props.checkboxAppLink && props.checkboxAppLinkText && (\n          <>\n            <span>&nbsp;</span>\n            <AppLink appLink={props.checkboxAppLink} className='info-link'>\n              {props.checkboxAppLinkText}\n            </AppLink>\n          </>\n        )}\n      </div>\n    </Form.Group>\n  );\n}\n\n","import * as React from 'react';\nimport { useFormikContext } from 'formik';\n\nimport { HashObject } from 'libs/common/react/interfaces';\n\ninterface CharacterCounterProps<Values extends HashObject> {\n  fieldName: keyof Values;\n  limit: number;\n}\n\nexport function CharacterCounter<Values extends HashObject>(props: CharacterCounterProps<Values>): JSX.Element {\n  const { values } = useFormikContext<Values>();\n\n  const field = values[props.fieldName];\n\n  if (typeof field !== 'string')\n    return <></>;\n\n  return (\n    <div className='float-end text-secondary fw-normal'>\n      {field.length}/{props.limit} characters\n    </div>\n  );\n}","// extracted by mini-css-extract-plugin\nexport default {\"revealPassword\":\"jCfI0\",\"passwordInput\":\"RBJnf\",\"passwordContainer\":\"d78lK\",\"passwordContainerDisabled\":\"asbVo\",\"infoTooltip\":\"wzyOG\",\"spinner\":\"CycFx\"};","import * as React from 'react';\nimport { Form, Spinner } from 'react-bootstrap';\nimport { Placement } from 'react-bootstrap/esm/types';\nimport { ErrorMessage, Field, FieldAttributes, FieldProps, useFormikContext } from 'formik';\n\nimport { Core } from 'libs/common/backbone/index';\nimport { FunctionHelper } from 'libs/common/backbone/utils/FunctionHelper';\nimport { HashObject } from 'libs/common/react/interfaces';\nimport { ObjectHelper } from 'libs/common/react/utils/ObjectHelper';\n\nimport { FormCheckbox } from 'libs/shared/components/forms/form-checkbox/FormCheckbox';\nimport { SvgContainer } from 'libs/shared/components/svg-container/SvgContainer';\nimport { Text } from 'libs/shared/components/text/Text';\nimport { FormHelper } from 'libs/shared/utils/FormHelper';\nimport { cvSvgLibrary } from 'libs/shared/utils/SvgHelper';\n\nimport { CharacterCounter } from './CharacterCounter';\n\nimport styles from './form-field.scss';\n\nconst namespace = 'shared.formField';\n\nexport type FormSize = 'lg' | 'sm';\n\n// If checkboxLabelFontWeight is not specified, it will be bold by default\nexport type CheckboxLabelFontWeight = 'normal' | 'bold'\n\nexport interface FormFieldProps {\n  /**\n   * The name prop MUST be the same as the attribute\n   * name of the value that the field is bound to.\n   */\n  name: string;\n  label?: string;\n  children?: any;\n  showCharacterCounter?: boolean;\n  showRequiredStar?: boolean;\n  checkboxAppLink?: Core.AppLink;\n  checkboxAppLinkText?: string;\n  checkboxLabelClassName?: string;\n  checkboxLabelFontWeight?: CheckboxLabelFontWeight\n  infoTooltip?: string;\n  infoTooltipPlacement?: Placement;\n  infoText?: string;\n  formSize?: FormSize;\n  showOptionalLabel?: boolean;\n  showLoadingSpinner?: boolean;\n}\n\nFieldWrapper.defaultProps = {\n  autoComplete: 'off'\n};\n\nexport function FieldWrapper(\n  props: FieldAttributes<FormFieldProps> & { className: string }\n): React.ReactElement {\n  const { children, showLoadingSpinner, ...fieldProps } = props;\n\n  const [ type, setType ] = React.useState(props.type);\n\n  function onClickTogglePassword(): void {\n    if (type === 'password')\n      setType('text');\n    else\n      setType('password');\n  }\n\n  const resolvedChildren = FunctionHelper.isFunction(children)\n    ? (f: FieldProps) => children(f)\n    : React.Children.count(children) ? children : null;\n\n  if (fieldProps.type !== 'password') {\n    if (showLoadingSpinner) {\n      return (\n        <div className='position-relative'>\n          <Field {...(ObjectHelper.omit(fieldProps, ['formSize']))}>\n            {resolvedChildren}\n          </Field>\n\n          <div className={styles.spinner}>\n            <Spinner animation='border' size='sm' />\n          </div>\n        </div>\n      );\n    }\n\n    return (\n      <Field {...(ObjectHelper.omit(fieldProps, ['formSize']))}>\n        {resolvedChildren}\n      </Field>\n    );\n  }\n\n  let containerClassName = `position-relative ${styles.passwordContainer}`;\n\n  if (fieldProps.className)\n    containerClassName += ` ${fieldProps.className}`;\n\n  if (fieldProps.disabled)\n    containerClassName += ` ${styles.passwordContainerDisabled}`;\n\n  /**\n   * We need to wrap out input with a relatively positioned element in order to absolutely\n   * position our visibility icon to reveal the password - Sha\n   */\n  return (\n    <div className={containerClassName}>\n      <Field\n        {...(ObjectHelper.omit(fieldProps, [ 'formSize', 'type', 'className' ]))}\n        type={type}\n        className={`${styles.passwordInput} border-0 w-100 h-100 outline-none rounded`}\n      >\n        {resolvedChildren}\n      </Field>\n      {fieldProps.type === 'password' &&\n        <SvgContainer\n          svgName={type === 'password' ? cvSvgLibrary.VisibleOn : cvSvgLibrary.VisibleOff}\n          className={`svg-container cursor-pointer ${styles.revealPassword}`}\n          onClick={onClickTogglePassword}\n        />\n      }\n    </div>\n  );\n}\n\nFormField.defaultProps = {\n  autoComplete: 'off',\n  infoTooltipPlacement: 'top'\n};\n\nexport function FormField<Values extends HashObject>(props: FieldAttributes<FormFieldProps>): React.ReactElement {\n  const {\n    label,\n    className,\n    showCharacterCounter,\n    showRequiredStar,\n    infoTooltip,\n    infoTooltipPlacement,\n    infoText,\n    formSize,\n    showOptionalLabel,\n    ...fieldProps\n  } = props;\n\n  const { errors, touched } = useFormikContext<Values>();\n\n  // This function overwrites the default `onChange` function whenever `props.disabled` is set.\n  // This prevents users from \"undisabling\" form fields via inspect element, then editing the field.\n  const disabledOnChange = () => {};\n\n  if (fieldProps.type === 'checkbox') {\n    const _props = ObjectHelper.omit(props, [ 'formSize', 'infoTooltipPlacement' ]);\n\n    if (props.disabled)\n      _props.onChange = disabledOnChange;\n\n    return <FormCheckbox {..._props} />;\n  }\n\n  const fieldWrapperProps = {\n    ...fieldProps,\n    className: FormHelper.getCustomFormControlClassName(\n      errors,\n      touched,\n      fieldProps.name,\n      formSize,\n      className,\n      typeof props.as === 'string' ? props.as : null\n    )\n  };\n\n  if (props.disabled)\n    fieldWrapperProps.onChange = disabledOnChange;\n\n  return (\n    <Form.Group className='form-group'>\n      {!!label && (\n        <Form.Label htmlFor={fieldProps.id} className='d-flex align-items-center'>\n          {label}\n          {showRequiredStar && <span className='text-danger'>*</span>}\n          {infoTooltip && (\n            <SvgContainer\n              className={`svg-container text-secondary ${styles.infoTooltip}`}\n              svgName={cvSvgLibrary.Info}\n              title={infoTooltip}\n              tooltipPlacement={infoTooltipPlacement}\n              tooltipSpanHack\n            />\n          )}\n          {showOptionalLabel && <span className='text-secondary'>&nbsp;<Text namespace={namespace} phrase='optional' /></span>}\n          \n          {!!showCharacterCounter && !!(fieldProps as React.HTMLProps<HTMLInputElement>).maxLength &&\n            <div className='ms-auto'>\n              <CharacterCounter\n                fieldName={(fieldProps.name as keyof Values)}\n                limit={(fieldProps as React.HTMLProps<HTMLInputElement>).maxLength}\n              />\n            </div>\n          }\n        </Form.Label>\n      )}\n\n      <FieldWrapper {...fieldWrapperProps} />\n\n      {!!infoText &&\n        <Form.Text className='text-secondary'>\n          {infoText}\n        </Form.Text>\n      }\n\n      <ErrorMessage name={fieldProps.name}>\n        {(errorMessage: string) => <Form.Control.Feedback type='invalid'>{errorMessage}</Form.Control.Feedback>}\n      </ErrorMessage>\n    </Form.Group>\n  );\n}","import * as React from 'react';\nimport { Formik, FormikConfig, FormikContextType, FormikErrors, FormikHelpers, FormikProps, FormikValues, useFormikContext } from 'formik';\n\nimport { FunctionHelper } from 'libs/common/backbone/utils/FunctionHelper';\nimport { HashObject } from 'libs/common/react/interfaces';\nimport { ObjectHelper } from 'libs/common/react/utils/ObjectHelper';\n\n/**\n * Note: This currently doesn't support arrays, but the need for arrays as initial\n * form data has not yet come up\n */\nfunction omitNullInitialValues<Values extends FormikValues>(initialValues: Values): Values {\n  if (!initialValues)\n    return {} as Values;\n\n  const values = ObjectHelper.deepClone(initialValues);\n\n  function omitChildValues(child: Values): void {\n    Object.keys(values).forEach((key: keyof Values) => {\n      if (!values.hasOwnProperty(key))\n        return;\n  \n      if (ObjectHelper.isObject(child[key]))\n        omitChildValues(child[key]);\n      else if (values[key] === null)\n        delete values[key];\n    });\n  }\n\n  omitChildValues(values);\n  return values;\n}\n\n// Omit attributes from FormikConfig that are defined in FormWrapperProps.\ntype ModifiedFormikConfig<Values extends FormikValues> = Omit<FormikConfig<Values>, 'initialValues' | 'onSubmit'>;\n\ninterface InitialStatus {\n  allowInitialSubmit: boolean;\n}\n\nexport type FormSubmissionOptions<FormValues = FormikValues> = {\n  reset?: boolean;\n  errors?: FormikErrors<FormValues>;\n};\n\ninterface FormWrapperProps<FormValues extends FormikValues, ApiValues extends FormikValues> {\n  initialValues: Partial<FormValues | ApiValues>;\n  onSubmit: (data: FormValues, onDone: (options?: FormSubmissionOptions<FormValues>) => void) => void;\n  castInitialValues?: boolean; // cast to validationSchema\n  castValuesOnSubmit?: boolean; // cast to validationSchema\n  allowInitialSubmit?: boolean; // if true, useCanSubmitForm will allow submit without any user changes.\n}\n\nFormWrapper.defaultProps = {\n  castInitialValues: true,\n  castValuesOnSubmit: true\n};\n\nexport function FormWrapper<\n  FormValues extends FormikValues = FormikValues,\n  ApiValues extends FormikValues = FormValues,\n  ExtraProps = HashObject\n>(props: ModifiedFormikConfig<FormValues> & ExtraProps & FormWrapperProps<FormValues, ApiValues>): JSX.Element {\n  const { castInitialValues, castValuesOnSubmit, initialValues, onSubmit, ...formikProps } = props;\n\n  /**\n   * If castInitialValues is true, cast initialValues to the validationSchema.\n   * This will ensure that any data fetched from the api conforms to the expected form data shape.\n   */\n  const formattedInitialValues: FormValues = castInitialValues && props.validationSchema\n    ? props.validationSchema.cast(omitNullInitialValues(initialValues))\n    : initialValues;\n\n  const onSubmitHandler = (\n    values: FormValues,\n    { setSubmitting, resetForm, setFieldError }: FormikHelpers<FormValues>\n  ) => {\n    /**\n     * validationSchema.cast will coerce the values to the types defined in validationSchema.\n     * This is useful for trimming inputs:\n     * e.g. if a value field has type Yup.string().trim(), it will be automatically trimmed.\n     */\n    const formattedData = castValuesOnSubmit && props.validationSchema\n      ? props.validationSchema.cast(values)\n      : values;\n\n    onSubmit(formattedData, (options: FormSubmissionOptions<FormValues> = {}) => {\n      options.reset && resetForm();\n\n      if (options.errors) {\n        for (const [ key, value ] of Object.entries(options.errors)) {\n          setFieldError(key, value);\n        }\n      }\n\n      setSubmitting(false);\n    });\n  };\n\n  const initialStatus: InitialStatus = {\n    allowInitialSubmit: props.allowInitialSubmit\n  };\n\n  return (\n    <Formik<FormValues, ExtraProps>\n      enableReinitialize\n      {...(formikProps as ModifiedFormikConfig<FormValues> & ExtraProps)}\n      initialValues={formattedInitialValues}\n      onSubmit={onSubmitHandler}\n      initialStatus={initialStatus}\n    >\n      {FunctionHelper.isFunction(props.children)\n        ? (f: FormikProps<FormValues>) => (props.children as (f: FormikProps<FormValues>) => React.ReactNode)(f)\n        : React.Children.count(props.children) ? props.children : null\n      }\n    </Formik>\n  );\n}\n\nexport function useFormikContextWrapper<T>(): FormikContextType<T> {\n  return useFormikContext<T>();\n}","import { FormikErrors, FormikTouched, getIn } from 'formik';\n\nimport { FormSize } from 'libs/shared/components/forms/form-field/FormField';\n\nfunction getTypeSize(type: string, size: FormSize) {\n  let className = '';\n\n  switch (type) {\n    case 'select':\n      className = 'form-select';\n      break;\n    default:\n      className = 'form-control';\n  }\n\n  if (size === 'sm')\n    className += ` ${className}-sm`;\n\n  if (size === 'lg')\n    className += ` ${className}-lg`;\n\n  return className;\n}\n\nexport const FormHelper = {\n  getCustomFormControlClassName<T>(\n    errors: FormikErrors<T>,\n    touched: FormikTouched<T>,\n    attribute: string,\n    size?: FormSize,\n    additionalClassName?: string,\n    type?: string\n  ): string {\n    let className = '';\n\n    className = getTypeSize(type, size);\n\n    // Using getIn as it supports dot notation\n    if (getIn(touched, attribute) && getIn(errors, attribute))\n      className += ' is-invalid';\n\n    if (additionalClassName)\n      className += ` ${additionalClassName}`;\n\n    return className;\n  }\n};","import { ButtonProps } from 'react-bootstrap';\n\nimport { ClassroomGroupColour } from 'libs/shared/interfaces';\n\nexport function mapColourToBsVariant(groupColour: ClassroomGroupColour): ButtonProps['variant'] {\n  switch (groupColour) {\n    case ClassroomGroupColour.Pink:\n      return 'pink';\n    case ClassroomGroupColour.Orange:\n      return 'orange';\n    case ClassroomGroupColour.Green:\n      return 'green';\n    case ClassroomGroupColour.Blue:\n      return 'blue';\n    case ClassroomGroupColour.Purple:\n      return 'purple';\n    case ClassroomGroupColour.Indigo:\n      return 'indigo';\n    default:\n      return 'pink';\n  }\n}\n","// extracted by mini-css-extract-plugin\nexport default {\"dropdownToggle\":\"ajlHC\",\"colourButton\":\"ixMmY\",\"colourList\":\"qSQt0\",\"colourOption\":\"Uln9P\",\"selected\":\"XEvln\"};","import React from 'react';\nimport { Dropdown } from 'react-bootstrap';\n\nimport { HashObject } from 'libs/common/react/interfaces/HashObject';\n\nimport { DivButton } from 'libs/shared/components/div-button/DivButton';\nimport { SvgContainer } from 'libs/shared/components/svg-container/SvgContainer';\nimport { ClassroomGroupColour } from 'libs/shared/interfaces';\nimport { mapColourToBsVariant } from 'libs/shared/utils/GroupHelper';\nimport { cvSvgLibrary } from 'libs/shared/utils/SvgHelper';\n\nimport styles from './colour-picker.scss';\n\ninterface ColourPickerProps {\n  id: string;\n  onSelect?: (colour: string) => void;\n  selection?: ClassroomGroupColour;\n  disabled?: boolean;\n}\n\nColourPicker.defaultProps = {\n  selection: ClassroomGroupColour.Pink,\n  onSelect: () => {}\n};\n\nexport function ColourPicker(props: ColourPickerProps): JSX.Element {\n  function getToggleButtonClass(): string {\n    const baseClass = `${styles.dropdownToggle} p-0 d-flex align-items-center text-decoration-none h-100`;\n    const disabledClass = props.disabled ? 'cursor-default' : '';\n\n    return `${baseClass} ${disabledClass}`;\n  }\n\n  function getOptionClass(colour: ClassroomGroupColour, selection: ClassroomGroupColour): string {\n    const baseClass = `${styles.colourOption} position-relative`;\n    const disabledClass = props.disabled ? 'cursor-default' : '';\n    const colorClass = mapColourToBsVariant(colour);\n    const selectedClass = colour === selection ? `${styles.selected} border border-dark` : '';\n\n    return `${baseClass} ${disabledClass} bg-${colorClass} ${selectedClass}`;\n  }\n\n  const dropdownProps: HashObject = { className: 'h-100 dropdown' };\n  if (props.disabled)\n    dropdownProps.show = false;\n\n  return (\n    <Dropdown {...dropdownProps}>\n      <Dropdown.Toggle id={props.id} variant='link' className={getToggleButtonClass()}>\n        <div className={`d-flex align-items-center border border-secondary rounded bg-white h-100 ${styles.colourButton}`}>\n          <div className={`px-0 py-1 rounded bg-${mapColourToBsVariant(props.selection)}`}>\n            &nbsp;\n          </div>\n          {!props.disabled &&\n            <SvgContainer svgName={cvSvgLibrary.Caret} />\n          }\n        </div>\n      </Dropdown.Toggle>\n\n      <Dropdown.Menu>\n        <ul className={`${styles.colourList} list-unstyled d-flex flex-wrap px-2 m-0`}>\n          {Object.keys(ClassroomGroupColour).map(colourKey => {\n            const colour = (ClassroomGroupColour as any)[colourKey];\n\n            return (\n              <li key={`${props.id}:${colour}`} className='m-1'>\n                <DivButton\n                  onClick={() => props.onSelect(colour)}\n                  className={getOptionClass(colour, props.selection)}\n                >\n                  &nbsp;\n                </DivButton>\n              </li>\n            );\n          })}\n        </ul>\n      </Dropdown.Menu>\n    </Dropdown>\n  );\n}","// extracted by mini-css-extract-plugin\nexport default {\"groupNameInput\":\"CsVDW\",\"colourPickerContainer\":\"DdjHF\"};","import React from 'react';\nimport { Form } from 'formik';\n\nimport { LanguageService } from 'libs/common/backbone/services/LanguageService';\n\nimport { FormField } from 'libs/shared/components/forms/form-field/FormField';\nimport { useFormikContextWrapper } from 'libs/shared/components/forms/form-wrapper/FormWrapper';\nimport { PopupButtons } from 'libs/shared/components/popup/PopupButtons';\nimport { Text } from 'libs/shared/components/text/Text';\n\nimport { ColourPicker } from 'apps/classrooms/components/colour-picker/ColourPicker';\nimport { EditClassroomGroupRequest } from 'apps/classrooms/interfaces/EditClassroomGroupRequest';\n\nimport styles from './classroom-group-details-form.scss';\n\nconst namespace = 'classrooms.classroomGroupDetailsForm';\nconst getPhrase = LanguageService.encloseNamespace(namespace);\n\ninterface ClassroomGroupDetailsFormProps {\n  isNew: boolean;\n  onClickCancel: () => void;\n}\n\nexport function ClassroomGroupDetailsForm(props: ClassroomGroupDetailsFormProps): JSX.Element {\n  const formikProps = useFormikContextWrapper<EditClassroomGroupRequest>();\n\n  return (\n    <Form>\n      <div className='d-flex'>\n        <div className='form-group me-2'>\n          <label htmlFor={`${props.isNew ? 'create' : 'edit'}-classroom-group`}><Text namespace={namespace} phrase='colourLabel' /></label>\n          <div className={styles.colourPickerContainer}>\n            <ColourPicker\n              onSelect={c => formikProps.setFieldValue('colour', c)}\n              selection={formikProps.values.colour}\n              id={`${props.isNew ? 'create' : 'edit'}-classroom-group`}\n            />\n          </div>\n        </div>\n        <div className='form-group w-75'>\n          <label htmlFor='name'><Text namespace={namespace} phrase='nameLabel' /></label>\n          <FormField\n            type='text'\n            name='name'\n            id='name'\n            className={`${styles.groupNameInput}`}\n            placeholder={getPhrase('groupNamePlaceholder')}\n            autoFocus\n            value={formikProps.values.name}\n          />\n        </div>\n      </div>\n\n      <PopupButtons>\n        <PopupButtons.Cancel onClick={props.onClickCancel} />\n        <PopupButtons.Submit variant='dark' isNew={props.isNew} />\n      </PopupButtons>\n    </Form>\n  );\n}","import { object, string } from 'yup';\n\nimport { LanguageService } from 'libs/common/backbone/services/LanguageService';\n\nimport { ClassroomGroupColour } from 'libs/shared/interfaces';\n\nconst getPhrase = LanguageService.encloseNamespace('classrooms.classroomValidation');\n\nexport const ClassroomGroupValidationSchema = object().shape({\n  name: string()\n    .max(255, () => getPhrase('nameExceeds'))\n    .required(() => getPhrase('nameRequired'))\n    .default(''),\n  description: string()\n    .default(''),\n  colour: string()\n    .required(() => getPhrase('colourRequired'))\n    .default(ClassroomGroupColour.Pink)\n});","import React from 'react';\n\nimport { FormWrapper } from 'libs/shared/components/forms/form-wrapper/FormWrapper';\nimport { ClassroomGroup } from 'libs/shared/interfaces';\n\nimport { ClassroomGroupDetailsForm } from 'apps/classrooms/components/classroom-group-details-form/ClassroomGroupDetailsForm';\nimport { EditClassroomGroupRequest } from 'apps/classrooms/interfaces/EditClassroomGroupRequest';\nimport { ClassroomGroupValidationSchema } from 'apps/classrooms/validation/ClassroomGroupValidationSchema';\n\ninterface EditClassroomGroupDetailsProps {\n  group?: ClassroomGroup;\n  saveGroup: (group: EditClassroomGroupRequest) => void;\n  onClickCancel: () => void;\n}\n\nexport function EditClassroomGroupDetails(props: EditClassroomGroupDetailsProps): React.ReactElement {\n  const { group, saveGroup, onClickCancel } = props;\n\n  const initialValues: EditClassroomGroupRequest = {\n    id: group?.id,\n    name: group?.name,\n    description: group?.description,\n    colour: group?.metadata?.colour\n  };\n\n  return (\n    <FormWrapper<EditClassroomGroupRequest>\n      initialValues={initialValues}\n      validationSchema={ClassroomGroupValidationSchema}\n      onSubmit={saveGroup}\n    >\n      <ClassroomGroupDetailsForm isNew={!group} onClickCancel={onClickCancel} />\n    </FormWrapper>\n  );\n}"],"names":["FormCheckbox","props","label","checkboxLabelClassName","checkboxLabelFontWeight","className","fieldProps","Form","FieldWrapper","htmlFor","id","checkboxAppLink","checkboxAppLinkText","AppLink","appLink","CharacterCounter","field","values","fieldName","length","limit","namespace","children","showLoadingSpinner","type","setType","resolvedChildren","FunctionHelper","f","ObjectHelper","Spinner","animation","size","containerClassName","disabled","SvgContainer","svgName","onClick","FormField","showCharacterCounter","showRequiredStar","infoTooltip","infoTooltipPlacement","infoText","formSize","showOptionalLabel","errors","touched","disabledOnChange","_props","onChange","fieldWrapperProps","FormHelper","name","as","title","tooltipPlacement","tooltipSpanHack","Text","phrase","maxLength","errorMessage","defaultProps","autoComplete","FormWrapper","castInitialValues","castValuesOnSubmit","initialValues","onSubmit","formikProps","formattedInitialValues","validationSchema","cast","omitChildValues","child","Object","keys","forEach","key","hasOwnProperty","omitNullInitialValues","initialStatus","allowInitialSubmit","enableReinitialize","setSubmitting","resetForm","setFieldError","formattedData","options","reset","entries","value","useFormikContextWrapper","getCustomFormControlClassName","attribute","additionalClassName","getTypeSize","mapColourToBsVariant","groupColour","ColourPicker","getOptionClass","colour","selection","baseClass","disabledClass","colorClass","selectedClass","dropdownProps","show","Dropdown","variant","map","colourKey","DivButton","onSelect","getPhrase","LanguageService","ClassroomGroupDetailsForm","isNew","c","setFieldValue","placeholder","autoFocus","PopupButtons","onClickCancel","ClassroomGroupValidationSchema","shape","max","required","description","EditClassroomGroupDetails","group","saveGroup","metadata"],"sourceRoot":""}

package/dist/scripts/{7172-2d87ce76a3-lite.chunk.js → 7172-960e49b199-lite.chunk.js}

@@ -1,2 +1,2 @@
-"use strict";(self.webpackChunk_clickview_lite=self.webpackChunk_clickview_lite||[]).push([[7172],{2381:(e,t,n)=>{n.d(t,{q:()=>o});var a=n(5173),r=n(23481),l="playlists.validation",o=a.Ry().shape({name:a.Z_().max(250,(function(){return r.T.getPhrase(l,"nameExceeds")})).required((function(){return r.T.getPhrase(l,"nameRequired")})),description:a.Z_().max(16e3,(function(){return r.T.getPhrase(l,"descriptionExceeds")})).nullable()})},38365:(e,t,n)=>{n.d(t,{n:()=>O,W:()=>E});var a=n(32735),r=n(80247),l=n(80130),o=n(92802),i=n(91967),c=n(1048),s=n(36848),u=function(e,t){var n={};for(var a in e)Object.prototype.hasOwnProperty.call(e,a)&&t.indexOf(a)<0&&(n[a]=e[a]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var r=0;for(a=Object.getOwnPropertySymbols(e);r<a.length;r++)t.indexOf(a[r])<0&&Object.prototype.propertyIsEnumerable.call(e,a[r])&&(n[a[r]]=e[a[r]])}return n};function m(e){var t=e.label,n=e.checkboxLabelClassName,r=e.checkboxLabelFontWeight,o=e.className,i=u(e,["label","checkboxLabelClassName","checkboxLabelFontWeight","className"]);return a.createElement(l.Z.Group,{className:"form-group"},a.createElement("div",{className:"form-check ".concat(o||"")},a.createElement(O,Object.assign({className:"form-check-input"},i)),a.createElement(l.Z.Label,{className:"form-check-label cursor-pointer ".concat("normal"===r?"fw-normal":""," \n          ").concat(n),htmlFor:i.id},t),e.checkboxAppLink&&e.checkboxAppLinkText&&a.createElement(a.Fragment,null,a.createElement("span",null," "),a.createElement(s.F,{appLink:e.checkboxAppLink,className:"info-link"},e.checkboxAppLinkText))))}var p=n(83914),f=n(83345),d=n(73814),b=n(35223);function y(e){var t=(0,o.u6)().values[e.fieldName];return"string"!=typeof t?a.createElement(a.Fragment,null):a.createElement("div",{className:"float-end text-secondary fw-normal"},t.length,"/",e.limit," characters")}const h={revealPassword:"jCfI0",passwordInput:"RBJnf",passwordContainer:"d78lK",passwordContainerDisabled:"asbVo",infoTooltip:"wzyOG",spinner:"CycFx"};function v(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,a=new Array(t);n<t;n++)a[n]=e[n];return a}var g=function(e,t){var n={};for(var a in e)Object.prototype.hasOwnProperty.call(e,a)&&t.indexOf(a)<0&&(n[a]=e[a]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var r=0;for(a=Object.getOwnPropertySymbols(e);r<a.length;r++)t.indexOf(a[r])<0&&Object.prototype.propertyIsEnumerable.call(e,a[r])&&(n[a[r]]=e[a[r]])}return n},w="shared.formField";function O(e){var t,n,l=e.children,s=e.showLoadingSpinner,u=g(e,["children","showLoadingSpinner"]),m=(t=a.useState(e.type),n=2,function(e){if(Array.isArray(e))return e}(t)||function(e,t){var n=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=n){var a,r,l,o,i=[],c=!0,s=!1;try{if(l=(n=n.call(e)).next,0===t){if(Object(n)!==n)return;c=!1}else for(;!(c=(a=l.call(n)).done)&&(i.push(a.value),i.length!==t);c=!0);}catch(e){s=!0,r=e}finally{try{if(!c&&null!=n.return&&(o=n.return(),Object(o)!==o))return}finally{if(s)throw r}}return i}}(t,n)||function(e,t){if(e){if("string"==typeof e)return v(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?v(e,t):void 0}}(t,n)||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.")}()),f=m[0],d=m[1],y=i.q.isFunction(l)?function(e){return l(e)}:a.Children.count(l)?l:null;if("password"!==u.type)return s?a.createElement("div",{className:"position-relative"},a.createElement(o.gN,Object.assign({},c.t.omit(u,["formSize"])),y),a.createElement("div",{className:h.spinner},a.createElement(r.Z,{animation:"border",size:"sm"}))):a.createElement(o.gN,Object.assign({},c.t.omit(u,["formSize"])),y);var w="position-relative ".concat(h.passwordContainer);return u.className&&(w+=" ".concat(u.className)),u.disabled&&(w+=" ".concat(h.passwordContainerDisabled)),a.createElement("div",{className:w},a.createElement(o.gN,Object.assign({},c.t.omit(u,["formSize","type","className"]),{type:f,className:"".concat(h.passwordInput," border-0 w-100 h-100 outline-none rounded")}),y),"password"===u.type&&a.createElement(p.x,{svgName:"password"===f?b.vn.VisibleOn:b.vn.VisibleOff,className:"svg-container cursor-pointer ".concat(h.revealPassword),onClick:function(){d("password"===f?"text":"password")}}))}function E(e){var t=e.label,n=e.className,r=e.showCharacterCounter,i=e.showRequiredStar,s=e.infoTooltip,u=e.infoTooltipPlacement,v=e.infoText,E=e.formSize,x=e.showOptionalLabel,C=g(e,["label","className","showCharacterCounter","showRequiredStar","infoTooltip","infoTooltipPlacement","infoText","formSize","showOptionalLabel"]),S=(0,o.u6)(),N=S.errors,k=S.touched,P=function(){};if("checkbox"===C.type){var j=c.t.omit(e,["formSize","infoTooltipPlacement"]);return e.disabled&&(j.onChange=P),a.createElement(m,Object.assign({},j))}var T=Object.assign(Object.assign({},C),{className:d.w.getCustomFormControlClassName(N,k,C.name,E,n,"string"==typeof e.as?e.as:null)});return e.disabled&&(T.onChange=P),a.createElement(l.Z.Group,{className:"form-group"},!!t&&a.createElement(l.Z.Label,{htmlFor:C.id,className:"d-flex align-items-center"},t,i&&a.createElement("span",{className:"text-danger"},"*"),s&&a.createElement(p.x,{className:"svg-container text-secondary ".concat(h.infoTooltip),svgName:b.vn.Info,title:s,tooltipPlacement:u,tooltipSpanHack:!0}),x&&a.createElement("span",{className:"text-secondary"}," ",a.createElement(f.x,{namespace:w,phrase:"optional"})),!!r&&!!C.maxLength&&a.createElement("div",{className:"ms-auto"},a.createElement(y,{fieldName:C.name,limit:C.maxLength}))),a.createElement(O,Object.assign({},T)),!!v&&a.createElement(l.Z.Text,{className:"text-secondary"},v),a.createElement(o.Bc,{name:C.name},(function(e){return a.createElement(l.Z.Control.Feedback,{type:"invalid"},e)})))}O.defaultProps={autoComplete:"off"},E.defaultProps={autoComplete:"off",infoTooltipPlacement:"top"}},82644:(e,t,n)=>{n.d(t,{b:()=>u,n:()=>s});var a=n(32735),r=n(92802),l=n(91967),o=n(1048);function i(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,a=new Array(t);n<t;n++)a[n]=e[n];return a}var c=function(e,t){var n={};for(var a in e)Object.prototype.hasOwnProperty.call(e,a)&&t.indexOf(a)<0&&(n[a]=e[a]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var r=0;for(a=Object.getOwnPropertySymbols(e);r<a.length;r++)t.indexOf(a[r])<0&&Object.prototype.propertyIsEnumerable.call(e,a[r])&&(n[a[r]]=e[a[r]])}return n};function s(e){var t=e.castInitialValues,n=e.castValuesOnSubmit,s=e.initialValues,u=e.onSubmit,m=c(e,["castInitialValues","castValuesOnSubmit","initialValues","onSubmit"]),p=t&&e.validationSchema?e.validationSchema.cast(function(e){if(!e)return{};var t=o.t.deepClone(e);return function e(n){Object.keys(t).forEach((function(a){t.hasOwnProperty(a)&&(o.t.isObject(n[a])?e(n[a]):null===t[a]&&delete t[a])}))}(t),t}(s)):s,f={allowInitialSubmit:e.allowInitialSubmit};return a.createElement(r.J9,Object.assign({enableReinitialize:!0},m,{initialValues:p,onSubmit:function(t,a){var r=a.setSubmitting,l=a.resetForm,o=a.setFieldError,c=n&&e.validationSchema?e.validationSchema.cast(t):t;u(c,(function(){var e,t,n=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};if(n.reset&&l(),n.errors)for(var a=0,c=Object.entries(n.errors);a<c.length;a++){var s=(e=c[a],t=2,function(e){if(Array.isArray(e))return e}(e)||function(e,t){var n=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=n){var a,r,l,o,i=[],c=!0,s=!1;try{if(l=(n=n.call(e)).next,0===t){if(Object(n)!==n)return;c=!1}else for(;!(c=(a=l.call(n)).done)&&(i.push(a.value),i.length!==t);c=!0);}catch(e){s=!0,r=e}finally{try{if(!c&&null!=n.return&&(o=n.return(),Object(o)!==o))return}finally{if(s)throw r}}return i}}(e,t)||function(e,t){if(e){if("string"==typeof e)return i(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?i(e,t):void 0}}(e,t)||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.")}()),u=s[0],m=s[1];o(u,m)}r(!1)}))},initialStatus:f}),l.q.isFunction(e.children)?function(t){return e.children(t)}:a.Children.count(e.children)?e.children:null)}function u(){return(0,r.u6)()}s.defaultProps={castInitialValues:!0,castValuesOnSubmit:!0}},73814:(e,t,n)=>{n.d(t,{w:()=>r});var a=n(92802),r={getCustomFormControlClassName:function(e,t,n,r,l,o){var i="";return i=function(e,t){var n="";return n="select"===e?"form-select":"form-control","sm"===t&&(n+=" ".concat(n,"-sm")),"lg"===t&&(n+=" ".concat(n,"-lg")),n}(o,r),(0,a.u9)(t,n)&&(0,a.u9)(e,n)&&(i+=" is-invalid"),l&&(i+=" ".concat(l)),i}}},86644:(e,t,n)=>{n.d(t,{e:()=>p});var a=n(32735),r=n(92802),l=n(23481),o=n(2381),i=n(38365),c=n(82644),s=n(13876),u=l.T.encloseNamespace("playlists.playlistDetails");function m(e){var t=(0,c.b)();return a.createElement(r.l0,null,a.createElement(i.W,{label:u("nameLabel"),type:"text",name:"name",id:"name",placeholder:u("namePlaceholder"),autoFocus:!0,value:t.values.name,showRequiredStar:!0}),a.createElement(i.W,{label:u("descriptionLabel"),component:"textarea",name:"description",id:"description",placeholder:u("descriptionPlaceholder"),value:t.values.description}),a.createElement(s.u,null,a.createElement(s.u.Cancel,{onClick:e.onClickCancel}),a.createElement(s.u.Submit,{variant:"dark",isNew:e.isNew,text:e.submitText})))}function p(e){var t=e.playlist,n=void 0===t?{}:t,r=n.name,l=void 0===r?"":r,i=n.description,s=void 0===i?"":i,u=n.id,p=void 0===u?null:u,f=e.savePlaylist,d=e.onClickCancel,b=e.cancelButtonClass;return a.createElement(c.n,{initialValues:{name:l,description:s},validationSchema:o.q,onSubmit:f},a.createElement(m,{isNew:!p,onClickCancel:d,cancelButtonClass:b,submitText:e.submitText}))}},17172:(e,t,n)=>{n.r(t),n.d(t,{EditPlaylistView:()=>b});var a=n(32735),r=n(70680),l=n(23481),o=n(20354),i=n(49985),c=n(65858),s=n(9111),u=n(5112),m=n(69883),p=n(79612),f=n(86644),d=l.T.encloseNamespace("playlists.editPlaylist");function b(e){var t=(0,r.I0)(),n=(0,m.Z)(),l=o.a.useBasicFetch(u.C.getPlaylist(e.playlistId)),b=l.data&&d("title",{name:l.data.name});return(0,p.M)({title:b}),a.createElement(s.G,{title:d("heading"),closePopup:e.closePopup,showLoadingSpinner:!l.data},!!l.data&&a.createElement(f.e,{playlist:l.data,savePlaylist:function(a){o.a.fetch(t,u.C.updatePlaylist(e.playlistId,a,(function(t){n.success(d("success",{name:t.name,escapeText:!0})),i.k.logUserAction({id:t.id},i.k.mergeOptions(e.analyticsOptions,{actionType:c.Vw.Edit,entity:c.py.Playlist,workflowPhase:c.eu.Complete})),e.closePopup()}),(function(){n.error(d("error",{name:l.data.name,escapeText:!0})),e.closePopup()})))},onClickCancel:e.closePopup,cancelButtonClass:"outline-dark"}))}}}]);
-//# sourceMappingURL=7172-2d87ce76a3-lite.chunk.js.map
+"use strict";(self.webpackChunk_clickview_lite=self.webpackChunk_clickview_lite||[]).push([[7172],{2381:(e,t,n)=>{n.d(t,{q:()=>o});var a=n(5173),r=n(23481),l="playlists.validation",o=a.Ry().shape({name:a.Z_().max(250,(function(){return r.T.getPhrase(l,"nameExceeds")})).required((function(){return r.T.getPhrase(l,"nameRequired")})),description:a.Z_().max(16e3,(function(){return r.T.getPhrase(l,"descriptionExceeds")})).nullable()})},38365:(e,t,n)=>{n.d(t,{n:()=>O,W:()=>E});var a=n(32735),r=n(80247),l=n(80130),o=n(92802),i=n(91967),c=n(1048),s=n(36848),u=function(e,t){var n={};for(var a in e)Object.prototype.hasOwnProperty.call(e,a)&&t.indexOf(a)<0&&(n[a]=e[a]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var r=0;for(a=Object.getOwnPropertySymbols(e);r<a.length;r++)t.indexOf(a[r])<0&&Object.prototype.propertyIsEnumerable.call(e,a[r])&&(n[a[r]]=e[a[r]])}return n};function m(e){var t=e.label,n=e.checkboxLabelClassName,r=e.checkboxLabelFontWeight,o=e.className,i=u(e,["label","checkboxLabelClassName","checkboxLabelFontWeight","className"]);return a.createElement(l.Z.Group,{className:"form-group"},a.createElement("div",{className:"form-check ".concat(o||"")},a.createElement(O,Object.assign({className:"form-check-input"},i)),a.createElement(l.Z.Label,{className:"form-check-label cursor-pointer ".concat("normal"===r?"fw-normal":""," \n          ").concat(n),htmlFor:i.id},t),e.checkboxAppLink&&e.checkboxAppLinkText&&a.createElement(a.Fragment,null,a.createElement("span",null," "),a.createElement(s.F,{appLink:e.checkboxAppLink,className:"info-link"},e.checkboxAppLinkText))))}var p=n(83914),f=n(83345),d=n(73814),b=n(35223);function y(e){var t=(0,o.u6)().values[e.fieldName];return"string"!=typeof t?a.createElement(a.Fragment,null):a.createElement("div",{className:"float-end text-secondary fw-normal"},t.length,"/",e.limit," characters")}const h={revealPassword:"jCfI0",passwordInput:"RBJnf",passwordContainer:"d78lK",passwordContainerDisabled:"asbVo",infoTooltip:"wzyOG",spinner:"CycFx"};function v(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,a=new Array(t);n<t;n++)a[n]=e[n];return a}var g=function(e,t){var n={};for(var a in e)Object.prototype.hasOwnProperty.call(e,a)&&t.indexOf(a)<0&&(n[a]=e[a]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var r=0;for(a=Object.getOwnPropertySymbols(e);r<a.length;r++)t.indexOf(a[r])<0&&Object.prototype.propertyIsEnumerable.call(e,a[r])&&(n[a[r]]=e[a[r]])}return n},w="shared.formField";function O(e){var t,n,l=e.children,s=e.showLoadingSpinner,u=g(e,["children","showLoadingSpinner"]),m=(t=a.useState(e.type),n=2,function(e){if(Array.isArray(e))return e}(t)||function(e,t){var n=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=n){var a,r,l,o,i=[],c=!0,s=!1;try{if(l=(n=n.call(e)).next,0===t){if(Object(n)!==n)return;c=!1}else for(;!(c=(a=l.call(n)).done)&&(i.push(a.value),i.length!==t);c=!0);}catch(e){s=!0,r=e}finally{try{if(!c&&null!=n.return&&(o=n.return(),Object(o)!==o))return}finally{if(s)throw r}}return i}}(t,n)||function(e,t){if(e){if("string"==typeof e)return v(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?v(e,t):void 0}}(t,n)||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.")}()),f=m[0],d=m[1],y=i.q.isFunction(l)?function(e){return l(e)}:a.Children.count(l)?l:null;if("password"!==u.type)return s?a.createElement("div",{className:"position-relative"},a.createElement(o.gN,Object.assign({},c.t.omit(u,["formSize"])),y),a.createElement("div",{className:h.spinner},a.createElement(r.Z,{animation:"border",size:"sm"}))):a.createElement(o.gN,Object.assign({},c.t.omit(u,["formSize"])),y);var w="position-relative ".concat(h.passwordContainer);return u.className&&(w+=" ".concat(u.className)),u.disabled&&(w+=" ".concat(h.passwordContainerDisabled)),a.createElement("div",{className:w},a.createElement(o.gN,Object.assign({},c.t.omit(u,["formSize","type","className"]),{type:f,className:"".concat(h.passwordInput," border-0 w-100 h-100 outline-none rounded")}),y),"password"===u.type&&a.createElement(p.x,{svgName:"password"===f?b.vn.VisibleOn:b.vn.VisibleOff,className:"svg-container cursor-pointer ".concat(h.revealPassword),onClick:function(){d("password"===f?"text":"password")}}))}function E(e){var t=e.label,n=e.className,r=e.showCharacterCounter,i=e.showRequiredStar,s=e.infoTooltip,u=e.infoTooltipPlacement,v=e.infoText,E=e.formSize,x=e.showOptionalLabel,C=g(e,["label","className","showCharacterCounter","showRequiredStar","infoTooltip","infoTooltipPlacement","infoText","formSize","showOptionalLabel"]),S=(0,o.u6)(),N=S.errors,k=S.touched,P=function(){};if("checkbox"===C.type){var j=c.t.omit(e,["formSize","infoTooltipPlacement"]);return e.disabled&&(j.onChange=P),a.createElement(m,Object.assign({},j))}var T=Object.assign(Object.assign({},C),{className:d.w.getCustomFormControlClassName(N,k,C.name,E,n,"string"==typeof e.as?e.as:null)});return e.disabled&&(T.onChange=P),a.createElement(l.Z.Group,{className:"form-group"},!!t&&a.createElement(l.Z.Label,{htmlFor:C.id,className:"d-flex align-items-center"},t,i&&a.createElement("span",{className:"text-danger"},"*"),s&&a.createElement(p.x,{className:"svg-container text-secondary ".concat(h.infoTooltip),svgName:b.vn.Info,title:s,tooltipPlacement:u,tooltipSpanHack:!0}),x&&a.createElement("span",{className:"text-secondary"}," ",a.createElement(f.x,{namespace:w,phrase:"optional"})),!!r&&!!C.maxLength&&a.createElement("div",{className:"ms-auto"},a.createElement(y,{fieldName:C.name,limit:C.maxLength}))),a.createElement(O,Object.assign({},T)),!!v&&a.createElement(l.Z.Text,{className:"text-secondary"},v),a.createElement(o.Bc,{name:C.name},(function(e){return a.createElement(l.Z.Control.Feedback,{type:"invalid"},e)})))}O.defaultProps={autoComplete:"off"},E.defaultProps={autoComplete:"off",infoTooltipPlacement:"top"}},82644:(e,t,n)=>{n.d(t,{b:()=>u,n:()=>s});var a=n(32735),r=n(92802),l=n(91967),o=n(1048);function i(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,a=new Array(t);n<t;n++)a[n]=e[n];return a}var c=function(e,t){var n={};for(var a in e)Object.prototype.hasOwnProperty.call(e,a)&&t.indexOf(a)<0&&(n[a]=e[a]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var r=0;for(a=Object.getOwnPropertySymbols(e);r<a.length;r++)t.indexOf(a[r])<0&&Object.prototype.propertyIsEnumerable.call(e,a[r])&&(n[a[r]]=e[a[r]])}return n};function s(e){var t=e.castInitialValues,n=e.castValuesOnSubmit,s=e.initialValues,u=e.onSubmit,m=c(e,["castInitialValues","castValuesOnSubmit","initialValues","onSubmit"]),p=t&&e.validationSchema?e.validationSchema.cast(function(e){if(!e)return{};var t=o.t.deepClone(e);return function e(n){Object.keys(t).forEach((function(a){t.hasOwnProperty(a)&&(o.t.isObject(n[a])?e(n[a]):null===t[a]&&delete t[a])}))}(t),t}(s)):s,f={allowInitialSubmit:e.allowInitialSubmit};return a.createElement(r.J9,Object.assign({enableReinitialize:!0},m,{initialValues:p,onSubmit:function(t,a){var r=a.setSubmitting,l=a.resetForm,o=a.setFieldError,c=n&&e.validationSchema?e.validationSchema.cast(t):t;u(c,(function(){var e,t,n=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};if(n.reset&&l(),n.errors)for(var a=0,c=Object.entries(n.errors);a<c.length;a++){var s=(e=c[a],t=2,function(e){if(Array.isArray(e))return e}(e)||function(e,t){var n=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=n){var a,r,l,o,i=[],c=!0,s=!1;try{if(l=(n=n.call(e)).next,0===t){if(Object(n)!==n)return;c=!1}else for(;!(c=(a=l.call(n)).done)&&(i.push(a.value),i.length!==t);c=!0);}catch(e){s=!0,r=e}finally{try{if(!c&&null!=n.return&&(o=n.return(),Object(o)!==o))return}finally{if(s)throw r}}return i}}(e,t)||function(e,t){if(e){if("string"==typeof e)return i(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?i(e,t):void 0}}(e,t)||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.")}()),u=s[0],m=s[1];o(u,m)}r(!1)}))},initialStatus:f}),l.q.isFunction(e.children)?function(t){return e.children(t)}:a.Children.count(e.children)?e.children:null)}function u(){return(0,r.u6)()}s.defaultProps={castInitialValues:!0,castValuesOnSubmit:!0}},73814:(e,t,n)=>{n.d(t,{w:()=>r});var a=n(92802),r={getCustomFormControlClassName:function(e,t,n,r,l,o){var i="";return i=function(e,t){var n="";return n="select"===e?"form-select":"form-control","sm"===t&&(n+=" ".concat(n,"-sm")),"lg"===t&&(n+=" ".concat(n,"-lg")),n}(o,r),(0,a.u9)(t,n)&&(0,a.u9)(e,n)&&(i+=" is-invalid"),l&&(i+=" ".concat(l)),i}}},86644:(e,t,n)=>{n.d(t,{e:()=>p});var a=n(32735),r=n(92802),l=n(23481),o=n(2381),i=n(38365),c=n(82644),s=n(13876),u=l.T.encloseNamespace("playlists.playlistDetails");function m(e){var t=(0,c.b)();return a.createElement(r.l0,null,a.createElement(i.W,{label:u("nameLabel"),type:"text",name:"name",id:"name",placeholder:u("namePlaceholder"),autoFocus:!0,value:t.values.name,showRequiredStar:!0}),a.createElement(i.W,{label:u("descriptionLabel"),component:"textarea",name:"description",id:"description",placeholder:u("descriptionPlaceholder"),value:t.values.description}),a.createElement(s.u,null,a.createElement(s.u.Cancel,{onClick:e.onClickCancel}),a.createElement(s.u.Submit,{variant:"dark",isNew:e.isNew,text:e.submitText})))}function p(e){var t=e.playlist,n=void 0===t?{}:t,r=n.name,l=void 0===r?"":r,i=n.description,s=void 0===i?"":i,u=n.id,p=void 0===u?null:u,f=e.savePlaylist,d=e.onClickCancel,b=e.cancelButtonClass;return a.createElement(c.n,{initialValues:{name:l,description:s},validationSchema:o.q,onSubmit:f},a.createElement(m,{isNew:!p,onClickCancel:d,cancelButtonClass:b,submitText:e.submitText}))}},17172:(e,t,n)=>{n.r(t),n.d(t,{EditPlaylistView:()=>d});var a=n(32735),r=n(70680),l=n(23481),o=n(20354),i=n(49985),c=n(65858),s=n(9111),u=n(5112),m=n(69883),p=n(86644),f=l.T.encloseNamespace("playlists.editPlaylist");function d(e){var t=(0,r.I0)(),n=(0,m.Z)(),l=o.a.useBasicFetch(u.C.getPlaylist(e.playlistId));return a.createElement(s.G,{title:f("heading"),closePopup:e.closePopup,showLoadingSpinner:!l.data},!!l.data&&a.createElement(p.e,{playlist:l.data,savePlaylist:function(a){o.a.fetch(t,u.C.updatePlaylist(e.playlistId,a,(function(t){n.success(f("success",{name:t.name,escapeText:!0})),i.k.logUserAction({id:t.id},i.k.mergeOptions(e.analyticsOptions,{actionType:c.Vw.Edit,entity:c.py.Playlist,workflowPhase:c.eu.Complete})),e.closePopup()}),(function(){n.error(f("error",{name:l.data.name,escapeText:!0})),e.closePopup()})))},onClickCancel:e.closePopup,cancelButtonClass:"outline-dark"}))}}}]);
+//# sourceMappingURL=7172-960e49b199-lite.chunk.js.map

package/dist/scripts/7172-960e49b199-lite.chunk.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"scripts/7172-960e49b199-lite.chunk.js","mappings":"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","sources":["file:///app/packages/libs/shared/src/apps/playlists/validation/PlaylistValidationSchema.ts","file:///app/packages/libs/shared/src/components/forms/form-checkbox/FormCheckbox.tsx","file:///app/packages/libs/shared/src/components/forms/form-field/CharacterCounter.tsx","file:///app/packages/libs/shared/src/components/forms/form-field/form-field.scss","file:///app/packages/libs/shared/src/components/forms/form-field/FormField.tsx","file:///app/packages/libs/shared/src/components/forms/form-wrapper/FormWrapper.tsx","file:///app/packages/libs/shared/src/utils/FormHelper.ts","file:///app/packages/projects/lite/src/apps/playlists/components/playlist-details/PlaylistDetails.tsx","file:///app/packages/projects/lite/src/apps/playlists/views/edit-playlist/EditPlaylistView.tsx"],"sourcesContent":["import * as Yup from 'yup';\n\nimport { LanguageService } from 'libs/common/backbone/services/LanguageService';\n\nconst namespace = 'playlists.validation';\n\nexport const PlaylistValidationSchema = Yup.object().shape({\n  name: Yup.string()\n    .max(250, () => LanguageService.getPhrase(namespace, 'nameExceeds'))\n    .required(() => LanguageService.getPhrase(namespace, 'nameRequired')),\n  description: Yup.string()\n    .max(16000, () => LanguageService.getPhrase(namespace, 'descriptionExceeds'))\n    .nullable()\n});","import * as React from 'react';\nimport { Form } from 'react-bootstrap';\nimport { FieldAttributes } from 'formik';\n\nimport { AppLink } from 'libs/shared/components/app-link/AppLink';\n\nimport { FieldWrapper, FormFieldProps } from '../form-field/FormField';\n\n/**\n * Use this checkbox within Formik contexts\n */\nexport function FormCheckbox(props: FieldAttributes<FormFieldProps>): JSX.Element {\n  const { label, checkboxLabelClassName, checkboxLabelFontWeight, className, ...fieldProps } = props;\n\n  return (\n    <Form.Group className='form-group'>\n      <div className={`form-check ${className || ''}`}>\n        <FieldWrapper className='form-check-input' {...fieldProps} />\n        <Form.Label\n          className={`form-check-label cursor-pointer ${checkboxLabelFontWeight === 'normal' ? 'fw-normal' : ''} \n          ${checkboxLabelClassName}`}\n          htmlFor={fieldProps.id}\n        >\n          {label}\n        </Form.Label>\n        {props.checkboxAppLink && props.checkboxAppLinkText && (\n          <>\n            <span>&nbsp;</span>\n            <AppLink appLink={props.checkboxAppLink} className='info-link'>\n              {props.checkboxAppLinkText}\n            </AppLink>\n          </>\n        )}\n      </div>\n    </Form.Group>\n  );\n}\n\n","import * as React from 'react';\nimport { useFormikContext } from 'formik';\n\nimport { HashObject } from 'libs/common/react/interfaces';\n\ninterface CharacterCounterProps<Values extends HashObject> {\n  fieldName: keyof Values;\n  limit: number;\n}\n\nexport function CharacterCounter<Values extends HashObject>(props: CharacterCounterProps<Values>): JSX.Element {\n  const { values } = useFormikContext<Values>();\n\n  const field = values[props.fieldName];\n\n  if (typeof field !== 'string')\n    return <></>;\n\n  return (\n    <div className='float-end text-secondary fw-normal'>\n      {field.length}/{props.limit} characters\n    </div>\n  );\n}","// extracted by mini-css-extract-plugin\nexport default {\"revealPassword\":\"jCfI0\",\"passwordInput\":\"RBJnf\",\"passwordContainer\":\"d78lK\",\"passwordContainerDisabled\":\"asbVo\",\"infoTooltip\":\"wzyOG\",\"spinner\":\"CycFx\"};","import * as React from 'react';\nimport { Form, Spinner } from 'react-bootstrap';\nimport { Placement } from 'react-bootstrap/esm/types';\nimport { ErrorMessage, Field, FieldAttributes, FieldProps, useFormikContext } from 'formik';\n\nimport { Core } from 'libs/common/backbone/index';\nimport { FunctionHelper } from 'libs/common/backbone/utils/FunctionHelper';\nimport { HashObject } from 'libs/common/react/interfaces';\nimport { ObjectHelper } from 'libs/common/react/utils/ObjectHelper';\n\nimport { FormCheckbox } from 'libs/shared/components/forms/form-checkbox/FormCheckbox';\nimport { SvgContainer } from 'libs/shared/components/svg-container/SvgContainer';\nimport { Text } from 'libs/shared/components/text/Text';\nimport { FormHelper } from 'libs/shared/utils/FormHelper';\nimport { cvSvgLibrary } from 'libs/shared/utils/SvgHelper';\n\nimport { CharacterCounter } from './CharacterCounter';\n\nimport styles from './form-field.scss';\n\nconst namespace = 'shared.formField';\n\nexport type FormSize = 'lg' | 'sm';\n\n// If checkboxLabelFontWeight is not specified, it will be bold by default\nexport type CheckboxLabelFontWeight = 'normal' | 'bold'\n\nexport interface FormFieldProps {\n  /**\n   * The name prop MUST be the same as the attribute\n   * name of the value that the field is bound to.\n   */\n  name: string;\n  label?: string;\n  children?: any;\n  showCharacterCounter?: boolean;\n  showRequiredStar?: boolean;\n  checkboxAppLink?: Core.AppLink;\n  checkboxAppLinkText?: string;\n  checkboxLabelClassName?: string;\n  checkboxLabelFontWeight?: CheckboxLabelFontWeight\n  infoTooltip?: string;\n  infoTooltipPlacement?: Placement;\n  infoText?: string;\n  formSize?: FormSize;\n  showOptionalLabel?: boolean;\n  showLoadingSpinner?: boolean;\n}\n\nFieldWrapper.defaultProps = {\n  autoComplete: 'off'\n};\n\nexport function FieldWrapper(\n  props: FieldAttributes<FormFieldProps> & { className: string }\n): React.ReactElement {\n  const { children, showLoadingSpinner, ...fieldProps } = props;\n\n  const [ type, setType ] = React.useState(props.type);\n\n  function onClickTogglePassword(): void {\n    if (type === 'password')\n      setType('text');\n    else\n      setType('password');\n  }\n\n  const resolvedChildren = FunctionHelper.isFunction(children)\n    ? (f: FieldProps) => children(f)\n    : React.Children.count(children) ? children : null;\n\n  if (fieldProps.type !== 'password') {\n    if (showLoadingSpinner) {\n      return (\n        <div className='position-relative'>\n          <Field {...(ObjectHelper.omit(fieldProps, ['formSize']))}>\n            {resolvedChildren}\n          </Field>\n\n          <div className={styles.spinner}>\n            <Spinner animation='border' size='sm' />\n          </div>\n        </div>\n      );\n    }\n\n    return (\n      <Field {...(ObjectHelper.omit(fieldProps, ['formSize']))}>\n        {resolvedChildren}\n      </Field>\n    );\n  }\n\n  let containerClassName = `position-relative ${styles.passwordContainer}`;\n\n  if (fieldProps.className)\n    containerClassName += ` ${fieldProps.className}`;\n\n  if (fieldProps.disabled)\n    containerClassName += ` ${styles.passwordContainerDisabled}`;\n\n  /**\n   * We need to wrap out input with a relatively positioned element in order to absolutely\n   * position our visibility icon to reveal the password - Sha\n   */\n  return (\n    <div className={containerClassName}>\n      <Field\n        {...(ObjectHelper.omit(fieldProps, [ 'formSize', 'type', 'className' ]))}\n        type={type}\n        className={`${styles.passwordInput} border-0 w-100 h-100 outline-none rounded`}\n      >\n        {resolvedChildren}\n      </Field>\n      {fieldProps.type === 'password' &&\n        <SvgContainer\n          svgName={type === 'password' ? cvSvgLibrary.VisibleOn : cvSvgLibrary.VisibleOff}\n          className={`svg-container cursor-pointer ${styles.revealPassword}`}\n          onClick={onClickTogglePassword}\n        />\n      }\n    </div>\n  );\n}\n\nFormField.defaultProps = {\n  autoComplete: 'off',\n  infoTooltipPlacement: 'top'\n};\n\nexport function FormField<Values extends HashObject>(props: FieldAttributes<FormFieldProps>): React.ReactElement {\n  const {\n    label,\n    className,\n    showCharacterCounter,\n    showRequiredStar,\n    infoTooltip,\n    infoTooltipPlacement,\n    infoText,\n    formSize,\n    showOptionalLabel,\n    ...fieldProps\n  } = props;\n\n  const { errors, touched } = useFormikContext<Values>();\n\n  // This function overwrites the default `onChange` function whenever `props.disabled` is set.\n  // This prevents users from \"undisabling\" form fields via inspect element, then editing the field.\n  const disabledOnChange = () => {};\n\n  if (fieldProps.type === 'checkbox') {\n    const _props = ObjectHelper.omit(props, [ 'formSize', 'infoTooltipPlacement' ]);\n\n    if (props.disabled)\n      _props.onChange = disabledOnChange;\n\n    return <FormCheckbox {..._props} />;\n  }\n\n  const fieldWrapperProps = {\n    ...fieldProps,\n    className: FormHelper.getCustomFormControlClassName(\n      errors,\n      touched,\n      fieldProps.name,\n      formSize,\n      className,\n      typeof props.as === 'string' ? props.as : null\n    )\n  };\n\n  if (props.disabled)\n    fieldWrapperProps.onChange = disabledOnChange;\n\n  return (\n    <Form.Group className='form-group'>\n      {!!label && (\n        <Form.Label htmlFor={fieldProps.id} className='d-flex align-items-center'>\n          {label}\n          {showRequiredStar && <span className='text-danger'>*</span>}\n          {infoTooltip && (\n            <SvgContainer\n              className={`svg-container text-secondary ${styles.infoTooltip}`}\n              svgName={cvSvgLibrary.Info}\n              title={infoTooltip}\n              tooltipPlacement={infoTooltipPlacement}\n              tooltipSpanHack\n            />\n          )}\n          {showOptionalLabel && <span className='text-secondary'>&nbsp;<Text namespace={namespace} phrase='optional' /></span>}\n          \n          {!!showCharacterCounter && !!(fieldProps as React.HTMLProps<HTMLInputElement>).maxLength &&\n            <div className='ms-auto'>\n              <CharacterCounter\n                fieldName={(fieldProps.name as keyof Values)}\n                limit={(fieldProps as React.HTMLProps<HTMLInputElement>).maxLength}\n              />\n            </div>\n          }\n        </Form.Label>\n      )}\n\n      <FieldWrapper {...fieldWrapperProps} />\n\n      {!!infoText &&\n        <Form.Text className='text-secondary'>\n          {infoText}\n        </Form.Text>\n      }\n\n      <ErrorMessage name={fieldProps.name}>\n        {(errorMessage: string) => <Form.Control.Feedback type='invalid'>{errorMessage}</Form.Control.Feedback>}\n      </ErrorMessage>\n    </Form.Group>\n  );\n}","import * as React from 'react';\nimport { Formik, FormikConfig, FormikContextType, FormikErrors, FormikHelpers, FormikProps, FormikValues, useFormikContext } from 'formik';\n\nimport { FunctionHelper } from 'libs/common/backbone/utils/FunctionHelper';\nimport { HashObject } from 'libs/common/react/interfaces';\nimport { ObjectHelper } from 'libs/common/react/utils/ObjectHelper';\n\n/**\n * Note: This currently doesn't support arrays, but the need for arrays as initial\n * form data has not yet come up\n */\nfunction omitNullInitialValues<Values extends FormikValues>(initialValues: Values): Values {\n  if (!initialValues)\n    return {} as Values;\n\n  const values = ObjectHelper.deepClone(initialValues);\n\n  function omitChildValues(child: Values): void {\n    Object.keys(values).forEach((key: keyof Values) => {\n      if (!values.hasOwnProperty(key))\n        return;\n  \n      if (ObjectHelper.isObject(child[key]))\n        omitChildValues(child[key]);\n      else if (values[key] === null)\n        delete values[key];\n    });\n  }\n\n  omitChildValues(values);\n  return values;\n}\n\n// Omit attributes from FormikConfig that are defined in FormWrapperProps.\ntype ModifiedFormikConfig<Values extends FormikValues> = Omit<FormikConfig<Values>, 'initialValues' | 'onSubmit'>;\n\ninterface InitialStatus {\n  allowInitialSubmit: boolean;\n}\n\nexport type FormSubmissionOptions<FormValues = FormikValues> = {\n  reset?: boolean;\n  errors?: FormikErrors<FormValues>;\n};\n\ninterface FormWrapperProps<FormValues extends FormikValues, ApiValues extends FormikValues> {\n  initialValues: Partial<FormValues | ApiValues>;\n  onSubmit: (data: FormValues, onDone: (options?: FormSubmissionOptions<FormValues>) => void) => void;\n  castInitialValues?: boolean; // cast to validationSchema\n  castValuesOnSubmit?: boolean; // cast to validationSchema\n  allowInitialSubmit?: boolean; // if true, useCanSubmitForm will allow submit without any user changes.\n}\n\nFormWrapper.defaultProps = {\n  castInitialValues: true,\n  castValuesOnSubmit: true\n};\n\nexport function FormWrapper<\n  FormValues extends FormikValues = FormikValues,\n  ApiValues extends FormikValues = FormValues,\n  ExtraProps = HashObject\n>(props: ModifiedFormikConfig<FormValues> & ExtraProps & FormWrapperProps<FormValues, ApiValues>): JSX.Element {\n  const { castInitialValues, castValuesOnSubmit, initialValues, onSubmit, ...formikProps } = props;\n\n  /**\n   * If castInitialValues is true, cast initialValues to the validationSchema.\n   * This will ensure that any data fetched from the api conforms to the expected form data shape.\n   */\n  const formattedInitialValues: FormValues = castInitialValues && props.validationSchema\n    ? props.validationSchema.cast(omitNullInitialValues(initialValues))\n    : initialValues;\n\n  const onSubmitHandler = (\n    values: FormValues,\n    { setSubmitting, resetForm, setFieldError }: FormikHelpers<FormValues>\n  ) => {\n    /**\n     * validationSchema.cast will coerce the values to the types defined in validationSchema.\n     * This is useful for trimming inputs:\n     * e.g. if a value field has type Yup.string().trim(), it will be automatically trimmed.\n     */\n    const formattedData = castValuesOnSubmit && props.validationSchema\n      ? props.validationSchema.cast(values)\n      : values;\n\n    onSubmit(formattedData, (options: FormSubmissionOptions<FormValues> = {}) => {\n      options.reset && resetForm();\n\n      if (options.errors) {\n        for (const [ key, value ] of Object.entries(options.errors)) {\n          setFieldError(key, value);\n        }\n      }\n\n      setSubmitting(false);\n    });\n  };\n\n  const initialStatus: InitialStatus = {\n    allowInitialSubmit: props.allowInitialSubmit\n  };\n\n  return (\n    <Formik<FormValues, ExtraProps>\n      enableReinitialize\n      {...(formikProps as ModifiedFormikConfig<FormValues> & ExtraProps)}\n      initialValues={formattedInitialValues}\n      onSubmit={onSubmitHandler}\n      initialStatus={initialStatus}\n    >\n      {FunctionHelper.isFunction(props.children)\n        ? (f: FormikProps<FormValues>) => (props.children as (f: FormikProps<FormValues>) => React.ReactNode)(f)\n        : React.Children.count(props.children) ? props.children : null\n      }\n    </Formik>\n  );\n}\n\nexport function useFormikContextWrapper<T>(): FormikContextType<T> {\n  return useFormikContext<T>();\n}","import { FormikErrors, FormikTouched, getIn } from 'formik';\n\nimport { FormSize } from 'libs/shared/components/forms/form-field/FormField';\n\nfunction getTypeSize(type: string, size: FormSize) {\n  let className = '';\n\n  switch (type) {\n    case 'select':\n      className = 'form-select';\n      break;\n    default:\n      className = 'form-control';\n  }\n\n  if (size === 'sm')\n    className += ` ${className}-sm`;\n\n  if (size === 'lg')\n    className += ` ${className}-lg`;\n\n  return className;\n}\n\nexport const FormHelper = {\n  getCustomFormControlClassName<T>(\n    errors: FormikErrors<T>,\n    touched: FormikTouched<T>,\n    attribute: string,\n    size?: FormSize,\n    additionalClassName?: string,\n    type?: string\n  ): string {\n    let className = '';\n\n    className = getTypeSize(type, size);\n\n    // Using getIn as it supports dot notation\n    if (getIn(touched, attribute) && getIn(errors, attribute))\n      className += ' is-invalid';\n\n    if (additionalClassName)\n      className += ` ${additionalClassName}`;\n\n    return className;\n  }\n};","import * as React from 'react';\nimport { Form } from 'formik';\n\nimport { LanguageService } from 'libs/common/backbone/services/LanguageService';\n\nimport { CreateOrUpdatePlaylistRequest } from 'libs/shared/apps/playlists/interfaces';\nimport { PlaylistValidationSchema } from 'libs/shared/apps/playlists/validation/PlaylistValidationSchema';\nimport { FormField } from 'libs/shared/components/forms/form-field/FormField';\nimport { FormWrapper, useFormikContextWrapper } from 'libs/shared/components/forms/form-wrapper/FormWrapper';\nimport { PopupButtons } from 'libs/shared/components/popup/PopupButtons';\nimport { Playlist } from 'libs/shared/interfaces';\n\nconst namespace = 'playlists.playlistDetails';\nconst getPhrase = LanguageService.encloseNamespace(namespace);\n\ninterface PlaylistDetailsFormComponentProps {\n  isNew?: boolean;\n  onClickCancel: () => void;\n  cancelButtonClass: 'outline-dark' | 'link';\n  submitText?: string;\n}\n\nfunction PlaylistDetailsFormComponent(props: PlaylistDetailsFormComponentProps): React.ReactElement {\n  const formikProps = useFormikContextWrapper<CreateOrUpdatePlaylistRequest>();\n\n  return (\n    <Form>\n      <FormField\n        label={getPhrase('nameLabel')}\n        type='text'\n        name='name'\n        id ='name'\n        placeholder={getPhrase('namePlaceholder')}\n        autoFocus\n        value={formikProps.values.name}\n        showRequiredStar\n      />\n      <FormField\n        label={getPhrase('descriptionLabel')}\n        component='textarea'\n        name='description'\n        id ='description'\n        placeholder={getPhrase('descriptionPlaceholder')}\n        value={formikProps.values.description}\n      />\n\n      <PopupButtons>\n        <PopupButtons.Cancel onClick={props.onClickCancel} />\n        <PopupButtons.Submit variant='dark' isNew={props.isNew} text={props.submitText} />\n      </PopupButtons>\n    </Form>\n  );\n}\n\ninterface PlaylistDetailsComponentProps {\n  playlist?: Playlist;\n  savePlaylist: (data: CreateOrUpdatePlaylistRequest) => void;\n  onClickCancel: () => void;\n  cancelButtonClass: 'outline-dark' | 'link';\n  submitText?: string;\n}\n\nexport function PlaylistDetails(props: PlaylistDetailsComponentProps): React.ReactElement {\n  const { playlist: { name = '', description = '', id = null } = {}, savePlaylist, onClickCancel, cancelButtonClass } = props;\n\n  return (\n    <FormWrapper<CreateOrUpdatePlaylistRequest>\n      initialValues={{ name, description }}\n      validationSchema={PlaylistValidationSchema}\n      onSubmit={savePlaylist}\n    >\n      <PlaylistDetailsFormComponent\n        isNew={!id}\n        onClickCancel={onClickCancel}\n        cancelButtonClass={cancelButtonClass}\n        submitText={props.submitText}\n      />\n    </FormWrapper>\n  );\n}\n","import * as React from 'react';\nimport { useDispatch } from 'react-redux';\n\nimport { LanguageService } from 'libs/common/backbone/services/LanguageService';\nimport { Flight } from 'libs/common/flight';\n\nimport { AnalyticsHelper } from 'libs/analytics/AnalyticsHelper';\nimport { EntityType, UserAction, WorkflowPhase } from 'libs/analytics/interfaces';\n\nimport { CreateOrUpdatePlaylistRequest } from 'libs/shared/apps/playlists/interfaces';\nimport { Popup } from 'libs/shared/components/popup/Popup';\nimport { PlaylistRequests } from 'libs/shared/flight-requests/PlaylistRequests';\nimport { useAlerts } from 'libs/shared/hooks/UseAlerts';\nimport { Playlist, PropsWithAnalyticsOptions, PropsWithPopupViewProps } from 'libs/shared/interfaces';\n\nimport { PlaylistDetails } from 'apps/playlists/components/playlist-details/PlaylistDetails';\n\nconst getPhrase = LanguageService.encloseNamespace('playlists.editPlaylist');\n\ninterface EditPlaylistViewProps {\n  playlistId: string;\n}\n\ntype PropTypes = PropsWithAnalyticsOptions<PropsWithPopupViewProps<EditPlaylistViewProps>>;\n\nexport function EditPlaylistView(props: PropTypes): React.ReactElement {\n  const dispatch = useDispatch();\n  const alerts = useAlerts();\n\n  const playlist = Flight.useBasicFetch<Playlist>(PlaylistRequests.getPlaylist(props.playlistId));\n\n  const savePlaylist = (data: CreateOrUpdatePlaylistRequest): void => {\n    const onSuccess = (updatedPlaylist: Playlist) => {\n      alerts.success(getPhrase('success', { name: updatedPlaylist.name, escapeText: true }));\n\n      AnalyticsHelper.logUserAction({ id: updatedPlaylist.id }, AnalyticsHelper.mergeOptions(props.analyticsOptions, {\n        actionType: UserAction.Edit,\n        entity: EntityType.Playlist,\n        workflowPhase: WorkflowPhase.Complete\n      }));\n\n      props.closePopup();\n    };\n\n    const onError = () => {\n      alerts.error(getPhrase('error', { name: playlist.data.name, escapeText: true }));\n\n      props.closePopup();\n    };\n\n    Flight.fetch(\n      dispatch,\n      PlaylistRequests.updatePlaylist(props.playlistId, data, onSuccess, onError)\n    );\n  };\n\n  return (\n    <Popup title={getPhrase('heading')} closePopup={props.closePopup} showLoadingSpinner={!playlist.data}>\n      {!!playlist.data &&\n        <PlaylistDetails\n          playlist={playlist.data}\n          savePlaylist={savePlaylist}\n          onClickCancel={props.closePopup}\n          cancelButtonClass='outline-dark'\n        />\n      }\n    </Popup>\n  );\n}\n"],"names":["namespace","PlaylistValidationSchema","shape","name","max","required","description","nullable","FormCheckbox","props","label","checkboxLabelClassName","checkboxLabelFontWeight","className","fieldProps","Form","FieldWrapper","htmlFor","id","checkboxAppLink","checkboxAppLinkText","AppLink","appLink","CharacterCounter","field","values","fieldName","length","limit","children","showLoadingSpinner","type","setType","resolvedChildren","FunctionHelper","f","ObjectHelper","Spinner","animation","size","containerClassName","disabled","SvgContainer","svgName","onClick","FormField","showCharacterCounter","showRequiredStar","infoTooltip","infoTooltipPlacement","infoText","formSize","showOptionalLabel","errors","touched","disabledOnChange","_props","onChange","fieldWrapperProps","FormHelper","as","title","tooltipPlacement","tooltipSpanHack","Text","phrase","maxLength","errorMessage","defaultProps","autoComplete","FormWrapper","castInitialValues","castValuesOnSubmit","initialValues","onSubmit","formikProps","formattedInitialValues","validationSchema","cast","omitChildValues","child","Object","keys","forEach","key","hasOwnProperty","omitNullInitialValues","initialStatus","allowInitialSubmit","enableReinitialize","setSubmitting","resetForm","setFieldError","formattedData","options","reset","entries","value","useFormikContextWrapper","getCustomFormControlClassName","attribute","additionalClassName","getTypeSize","getPhrase","PlaylistDetailsFormComponent","placeholder","autoFocus","component","onClickCancel","variant","isNew","text","submitText","PlaylistDetails","playlist","savePlaylist","cancelButtonClass","EditPlaylistView","dispatch","alerts","playlistId","closePopup","data","updatedPlaylist","success","escapeText","analyticsOptions","actionType","entity","workflowPhase","error"],"sourceRoot":""}

package/dist/scripts/7180-79ada17b34-lite.chunk.js

@@ -0,0 +1,2 @@
+"use strict";(self.webpackChunk_clickview_lite=self.webpackChunk_clickview_lite||[]).push([[7180],{74696:(e,t,a)=>{a.d(t,{S:()=>s});var n=a(32735),r=a(68050),i=a(69111),l=a(9977),c=a(79967);const o={partialOptions:"Gufgq",partialName:"SicQQ",partialDescription:"dPGMq",partialThumbnail:"vZrnb",partialDragHandle:"iq73R"};function s(e){return n.createElement("div",{className:"mx-2"},Array(e.numVideos).fill(null).map((function(t,a){return n.createElement("div",{className:"d-flex",key:a},e.allowBulkActions&&n.createElement("div",{className:"form-check pe-3 pe-sm-2 mx-0 mx-md-2"}),n.createElement(u,Object.assign({},e)))})))}function u(e){var t=(0,c.k)(),a="sm"===l.O.getSize(t,"md"),s=e.withReordering&&!t.xs;return n.createElement(r.Z,{className:"".concat(a?"":"py-2"," flex-grow-1")},n.createElement(i.Z,Object.assign({},l.O.getThumbnailColumns(),{className:"flex-column align-items-flex-start ".concat(a?"pb-2 pe-1":"mb-1 pe-3 pe-md-2")}),n.createElement(r.Z,null,!!s&&n.createElement("div",{className:"d-flex align-items-center justify-content-center col-2"},n.createElement("div",{className:"partial-loading-background ".concat(o.partialDragHandle)})),n.createElement(i.Z,{xs:l.O.getThumbnailColSize(s)},n.createElement("div",{className:"partial-loading-background ".concat(a?"rounded":"rounded-3"," ").concat(o.partialThumbnail)})))),n.createElement(i.Z,Object.assign({},l.O.getDetailsColumns(),{className:a?"pb-2":"px-2"}),n.createElement("div",{className:"partial-loading-background mb-1 ".concat(o.partialName)}),n.createElement("div",{className:"partial-loading-background ".concat(o.partialDescription)})))}s.defaultProps={numVideos:15}},64254:(e,t,a)=>{a.r(t),a.d(t,{CuratedDashboardWidgetView:()=>O});var n=a(32735),r=a(23481),i=a(20354),l=a(65858),c=a(13231),o=a(51365),s=a(183),u=a(1666),d=a(80889),m=a(31949),p=a(22902),f=a(79612),v=a(76753),g=a(10671),h=a(27638),b=a(44110),y=a(97816),E=a(10741),A=a(33192),k=a(22490),N=a(82431),w=a(74696);const x={partialHeading:"RSm4L"};function S(){return n.createElement("div",{className:"px-3"},n.createElement("div",{className:"partial-loading-background mb-2 ".concat(x.partialHeading)}),n.createElement(w.S,null))}var j=r.T.encloseNamespace("dashboard.dashboardWidget");function O(e){var t,a,r=e.widgetId,w=(0,h.u)(l.LZ.VideoThumbnail),x=w.setFavourite,O=w.canFavourite,P=(0,g._)({location:g.i.VideoItem}),C=i.a.useBasicFetch(r&&d._.dashboardWidgetContent(r)),I=i.a.useBasicFetch(m.N.currentUser()),F=i.a.useBasicFetch(I.data.isAuthenticated&&u.h.yearGroups(I.data.customerId)),L=null===(t=C.data)||void 0===t?void 0:t.content;(0,y.V)(L),(0,f.M)(v.CG.getDefaultMetadata({title:null===(a=C.data)||void 0===a?void 0:a.name,phraseContext:{phraseHandler:j,titlePhrase:"pageTitle",descriptionPhrase:"pageDescription"},canonicalLink:A.f.getCanonicalLink({stripPresentationSlug:!0}),allowIndexing:A.f.allowIndexing()}));var T=(0,b.i)(),B=(0,p.T)().hasPermissions;return C.data&&(null==L?void 0:L.length)?n.createElement(o.M.Provider,{value:P},n.createElement("div",{className:"px-3"},n.createElement("h1",{className:"h2 mb-2"},C.data.name),n.createElement(c.E4,{videos:L,yearGroups:F.data,getVideoAppLink:function(t,a){return k.W.getAppLink(t,Object.assign(Object.assign({},a),{context:s.Q.Widget,contextId:e.widgetId}))},hasPermissions:B,getSubTextAppLink:function(e){return N.j.getSeriesAppLink(e.series)},setFavourite:x,canFavourite:O,presentationAudiences:T.data,getPreviewQuestionsAppLink:function(e){return E.j.getPreviewQuestionsAppLink(e)}}))):n.createElement(S,null)}},44110:(e,t,a)=>{a.d(t,{i:()=>l});var n=a(20354),r=a(89454),i=a(86698),l=function(){var e=(0,i.y)({redirectOnError:!0}),t=e.activePresentation,a=e.getFallbackPresentation,l=t||a();return n.a.useBasicFetch(!!l&&r.O.presentationAudiences(l.id))}},97816:(e,t,a)=>{a.d(t,{V:()=>u});var n=a(32735),r=a(20354),i=a(21750),l=a(31949),c=a(1575);function o(e,t){if(e){if("string"==typeof e)return s(e,t);var a=Object.prototype.toString.call(e).slice(8,-1);return"Object"===a&&e.constructor&&(a=e.constructor.name),"Map"===a||"Set"===a?Array.from(e):"Arguments"===a||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(a)?s(e,t):void 0}}function s(e,t){(null==t||t>e.length)&&(t=e.length);for(var a=0,n=new Array(t);a<t;a++)n[a]=e[a];return n}function u(e){var t,a,u,d=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},m=r.a.useBasicFetch(l.N.currentUser()),p=n.useRef(new Set),f=e&&(Array.isArray(e)?e.filter(Boolean).map((function(e){return e.id})):e.data.filter(Boolean).map((function(e){return e.id}))),v=(a=n.useState([]),u=2,function(e){if(Array.isArray(e))return e}(a)||function(e,t){var a=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=a){var n,r,i,l,c=[],o=!0,s=!1;try{if(i=(a=a.call(e)).next,0===t){if(Object(a)!==a)return;o=!1}else for(;!(o=(n=i.call(a)).done)&&(c.push(n.value),c.length!==t);o=!0);}catch(e){s=!0,r=e}finally{try{if(!o&&null!=a.return&&(l=a.return(),Object(l)!==l))return}finally{if(s)throw r}}return c}}(a,u)||o(a,u)||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.")}()),g=v[0],h=v[1];n.useEffect((function(){var e;if((null==f?void 0:f.length)&&(null===(e=m.data)||void 0===e?void 0:e.isAuthenticated)){var t=[];f.forEach((function(e){p.current.has(e)||(t.push(e),p.current.add(e))})),t.length&&h((function(e){return[].concat(function(e){return function(e){if(Array.isArray(e))return s(e)}(e)||function(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}(e)||o(e)||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.")}()}(e),[i.x.hasCurriculumLinks(t,null,d.flightNamespace),c.R.videoMixinAssocs(t,d.flightNamespace)])}))}}),[null==f?void 0:f.length,null===(t=m.data)||void 0===t?void 0:t.isAuthenticated]),r.a.useBasicFetchAll(g)}},68050:(e,t,a)=>{a.d(t,{Z:()=>s});var n=a(95685),r=a.n(n),i=a(32735),l=a(46304),c=a(74512);const o=i.forwardRef((({bsPrefix:e,className:t,as:a="div",...n},i)=>{const o=(0,l.vE)(e,"row"),s=(0,l.pi)(),u=(0,l.zG)(),d=`${o}-cols`,m=[];return s.forEach((e=>{const t=n[e];let a;delete n[e],null!=t&&"object"==typeof t?({cols:a}=t):a=t;const r=e!==u?`-${e}`:"";null!=a&&m.push(`${d}${r}-${a}`)})),(0,c.jsx)(a,{ref:i,...n,className:r()(t,o,...m)})}));o.displayName="Row";const s=o}}]);
+//# sourceMappingURL=7180-79ada17b34-lite.chunk.js.map

package/dist/scripts/7180-79ada17b34-lite.chunk.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"scripts/7180-79ada17b34-lite.chunk.js","mappings":"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","sources":["file:///app/packages/libs/shared/src/components/video-list/partial-loading/partial-video-list.scss","file:///app/packages/libs/shared/src/components/video-list/partial-loading/PartialVideoList.tsx","file:///app/packages/projects/lite/src/apps/dashboard/views/dashboard-widget/partial-loading/partial-dashboard-widget-view.scss","file:///app/packages/projects/lite/src/apps/dashboard/views/dashboard-widget/partial-loading/PartialDashboardWidgetView.tsx","file:///app/packages/projects/lite/src/apps/dashboard/views/dashboard-widget/CuratedDashboardWidgetView.tsx","file:///app/packages/projects/lite/src/shared/hooks/usePresentationAudiences.ts","file:///app/packages/projects/lite/src/shared/hooks/useVideoMixin.ts","file:///app/node_modules/react-bootstrap/esm/Row.js"],"sourcesContent":["// extracted by mini-css-extract-plugin\nexport default {\"partialOptions\":\"Gufgq\",\"partialName\":\"SicQQ\",\"partialDescription\":\"dPGMq\",\"partialThumbnail\":\"vZrnb\",\"partialDragHandle\":\"iq73R\"};","import React from 'react';\nimport { Col, Row } from 'react-bootstrap';\n\nimport { VideoListHelper } from 'libs/shared/components/video-list/VideoListHelper';\nimport { useBreakpoints } from 'libs/shared/hooks/useBreakpoints';\n\nimport styles from './partial-video-list.scss';\n\ninterface PartialVideoListProps {\n  withReordering?: boolean;\n  numVideos?: number;\n  allowBulkActions?: boolean;\n}\n\nPartialVideoList.defaultProps = {\n  numVideos: 15\n};\n\nexport function PartialVideoList(props: PartialVideoListProps): JSX.Element {\n  return (\n    <div className='mx-2'>\n      {Array(props.numVideos).fill(null).map((_, i) => (\n        <div className='d-flex' key={i}>\n          {props.allowBulkActions && <div className='form-check pe-3 pe-sm-2 mx-0 mx-md-2' />}\n          <PartialVideoItem {...props} />\n        </div>\n      ))}\n    </div>\n  );\n}\n\nexport function PartialVideoItem(props: PartialVideoListProps): JSX.Element {\n  const breakpoints = useBreakpoints();\n\n  const size = VideoListHelper.getSize(breakpoints, 'md');\n  const isSmall = size === 'sm';\n\n  const withDragHandle = props.withReordering && !breakpoints.xs;\n\n  return (\n    <Row className={`${isSmall ? '' : 'py-2'} flex-grow-1`}>\n      <Col {...VideoListHelper.getThumbnailColumns()} className={`flex-column align-items-flex-start ${isSmall ? `pb-2 pe-1` : 'mb-1 pe-3 pe-md-2'}`}>\n        <Row>\n          {!!withDragHandle && (\n            <div className='d-flex align-items-center justify-content-center col-2'>\n              <div className={`partial-loading-background ${styles.partialDragHandle}`} />\n            </div>\n          )}\n          <Col xs={VideoListHelper.getThumbnailColSize(withDragHandle)}>\n            <div className={`partial-loading-background ${isSmall ? 'rounded' : 'rounded-3'} ${styles.partialThumbnail}`} />\n          </Col>\n        </Row>\n      </Col>\n      <Col {...VideoListHelper.getDetailsColumns()} className={isSmall ? 'pb-2' : 'px-2'}>\n        <div className={`partial-loading-background mb-1 ${styles.partialName}`} />\n        <div className={`partial-loading-background ${styles.partialDescription}`} />\n      </Col>\n    </Row>\n  );\n}\n\n","// extracted by mini-css-extract-plugin\nexport default {\"partialHeading\":\"RSm4L\"};","import React from 'react';\n\nimport { PartialVideoList } from 'libs/shared/components/video-list/partial-loading/PartialVideoList';\n\nimport styles from './partial-dashboard-widget-view.scss';\n\nexport function PartialDashboardWidgetView(): JSX.Element {\n  return (\n    <div className='px-3'>\n      <div className={`partial-loading-background mb-2 ${styles.partialHeading}`} />\n      <PartialVideoList />\n    </div>\n  );\n}","import React from 'react';\n\nimport { LanguageService } from 'libs/common/backbone/services/LanguageService';\nimport { Flight } from 'libs/common/flight';\n\nimport { LocationContext } from 'libs/analytics/interfaces';\n\nimport { VideoList } from 'libs/shared/components/video-list/VideoList';\nimport { VideoActionsContext } from 'libs/shared/context/VideoActionsContext';\nimport { RelatedVideosContext } from 'libs/shared/enums/RelatedVideosContext';\nimport { CustomerRequests } from 'libs/shared/flight-requests/CustomerRequests';\nimport { DashboardRequests } from 'libs/shared/flight-requests/DashboardRequests';\nimport { UserRequests } from 'libs/shared/flight-requests/UserRequests';\nimport { usePermissions } from 'libs/shared/hooks/usePermissions';\nimport { useSetPageMetadata } from 'libs/shared/hooks/useSetPageMetadata';\nimport { CuratedWidget, CuratedWidgetData, CurrentUser, Video, YearGroup } from 'libs/shared/interfaces';\nimport { PageMetadataHelper } from 'libs/shared/utils/PageMetadataHelper';\n\nimport { useVideoActions, VideoActionsLocation } from 'shared/hooks/use-video-actions/useVideoActions';\nimport { useLiteFavourites } from 'shared/hooks/useLiteFavourites';\nimport { usePresentationAudiences } from 'shared/hooks/usePresentationAudiences';\nimport { useVideoMixin } from 'shared/hooks/useVideoMixin';\nimport { InteractiveHelpers } from 'shared/utils/InteractiveHelper';\nimport { SeoHelper } from 'shared/utils/SeoHelper';\nimport { VideoAppLinkHelper } from 'shared/utils/VideoAppLinkHelper';\n\nimport { SeriesAppLinkHelper } from 'apps/series/SeriesAppLinkHelper';\n\nimport { PartialDashboardWidgetView } from './partial-loading/PartialDashboardWidgetView';\n\nconst namespace = 'dashboard.dashboardWidget';\nconst getPhrase = LanguageService.encloseNamespace(namespace);\n\ninterface CuratedDashboardWidgetViewQueryParams {\n  widgetId?: string;\n}\n\nexport function CuratedDashboardWidgetView(props: CuratedDashboardWidgetViewQueryParams): JSX.Element {\n  const { widgetId } = props;\n\n  const { setFavourite, canFavourite } = useLiteFavourites(LocationContext.VideoThumbnail);\n  \n  const videoActions = useVideoActions({ location: VideoActionsLocation.VideoItem });\n\n  const widget = Flight.useBasicFetch<CuratedWidget<CuratedWidgetData, Video[]>>(\n    widgetId && DashboardRequests.dashboardWidgetContent(widgetId)\n  );\n\n  const currentUser = Flight.useBasicFetch<CurrentUser>(UserRequests.currentUser());\n  const yearGroups = Flight.useBasicFetch<YearGroup[]>(\n    currentUser.data.isAuthenticated && CustomerRequests.yearGroups(currentUser.data.customerId)\n  );\n\n  const videos = widget.data?.content;\n  useVideoMixin(videos);\n\n  useSetPageMetadata(PageMetadataHelper.getDefaultMetadata({\n    title: widget.data?.name,\n    phraseContext: {\n      phraseHandler: getPhrase,\n      titlePhrase: 'pageTitle',\n      descriptionPhrase: 'pageDescription'\n    },\n    canonicalLink: SeoHelper.getCanonicalLink({ stripPresentationSlug: true }),\n    allowIndexing: SeoHelper.allowIndexing()\n  }));\n\n  const audiences = usePresentationAudiences();\n  const { hasPermissions } = usePermissions();\n\n  if (!widget.data || !videos?.length)\n    return <PartialDashboardWidgetView />;\n\n  return (\n    <VideoActionsContext.Provider value={videoActions}>\n      <div className='px-3'>\n        <h1 className='h2 mb-2'>{widget.data.name}</h1>\n        <VideoList\n          videos={videos}\n          yearGroups={yearGroups.data}\n          getVideoAppLink={(video, opts) => VideoAppLinkHelper.getAppLink(video, {\n            ...opts,\n            context: RelatedVideosContext.Widget,\n            contextId: props.widgetId\n          })}\n          hasPermissions={hasPermissions}\n          getSubTextAppLink={video => SeriesAppLinkHelper.getSeriesAppLink(video.series)}\n          setFavourite={setFavourite}\n          canFavourite={canFavourite}\n          presentationAudiences={audiences.data}\n          getPreviewQuestionsAppLink={interactive => InteractiveHelpers.getPreviewQuestionsAppLink(interactive)}\n        />\n      </div>\n    </VideoActionsContext.Provider>\n  );\n}","import { Flight } from 'libs/common/react/index';\n\nimport { AudienceRequests } from 'libs/shared/flight-requests/AudienceRequests';\nimport { PresentationAudience } from 'libs/shared/interfaces';\n\nimport { usePresentation } from 'shared/hooks/usePresentation';\n\nexport const usePresentationAudiences = () => {\n  const { activePresentation, getFallbackPresentation } = usePresentation({ redirectOnError: true });\n\n  const presentation = activePresentation || getFallbackPresentation();\n\n  const audiences = Flight.useBasicFetch<PresentationAudience[]>(\n    !!presentation &&\n    AudienceRequests.presentationAudiences(presentation.id)\n  );\n\n  return audiences;\n};","import React from 'react';\n\nimport { Flight } from 'libs/common/flight';\n\nimport { ClassificationRequests } from 'libs/shared/flight-requests/ClassificationRequests';\nimport { UserRequests } from 'libs/shared/flight-requests/UserRequests';\nimport { VideoRequests } from 'libs/shared/flight-requests/VideoRequests';\nimport { CurrentUser, Video, VideoCollection } from 'libs/shared/interfaces';\n\ninterface VideoMixinOptions {\n  /**\n   * If the videos that are having new data mixed into are sitting on an explicit Flight namespace,\n   * providing that namespace here is required\n   */\n  flightNamespace?: string;\n}\n\nexport function useVideoMixin(videos: VideoCollection | Video[], options: VideoMixinOptions = {}): void {\n  const currentUser = Flight.useBasicFetch<CurrentUser>(UserRequests.currentUser());\n\n  const hydratedVideos = React.useRef<Set<string>>(new Set<string>());\n\n  const videoIds = videos && (Array.isArray(videos)\n    ? videos.filter(Boolean).map(v => v.id)\n    : videos.data.filter(Boolean).map(v => v.id));\n\n  const [ request, setRequest ] = React.useState<Flight.Request[]>([]);\n\n  React.useEffect(() => {\n    if (!videoIds?.length || !currentUser.data?.isAuthenticated)\n      return;\n\n    const unhydratedVideos: string[] = [];\n\n    videoIds.forEach(id => {\n      if (!hydratedVideos.current.has(id)) {\n        unhydratedVideos.push(id);\n        hydratedVideos.current.add(id);\n      }\n    });\n    \n    if (!unhydratedVideos.length)\n      return;\n\n    setRequest(r => [\n      ...r,\n      ClassificationRequests.hasCurriculumLinks(unhydratedVideos, null, options.flightNamespace),\n      VideoRequests.videoMixinAssocs(unhydratedVideos, options.flightNamespace)\n    ]);\n  }, [ videoIds?.length, currentUser.data?.isAuthenticated ]);\n\n  Flight.useBasicFetchAll(request);\n}","\"use client\";\n\nimport classNames from 'classnames';\nimport * as React from 'react';\nimport { useBootstrapPrefix, useBootstrapBreakpoints, useBootstrapMinBreakpoint } from './ThemeProvider';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst Row = /*#__PURE__*/React.forwardRef(({\n  bsPrefix,\n  className,\n  // Need to define the default \"as\" during prop destructuring to be compatible with styled-components github.com/react-bootstrap/react-bootstrap/issues/3595\n  as: Component = 'div',\n  ...props\n}, ref) => {\n  const decoratedBsPrefix = useBootstrapPrefix(bsPrefix, 'row');\n  const breakpoints = useBootstrapBreakpoints();\n  const minBreakpoint = useBootstrapMinBreakpoint();\n  const sizePrefix = `${decoratedBsPrefix}-cols`;\n  const classes = [];\n  breakpoints.forEach(brkPoint => {\n    const propValue = props[brkPoint];\n    delete props[brkPoint];\n    let cols;\n    if (propValue != null && typeof propValue === 'object') {\n      ({\n        cols\n      } = propValue);\n    } else {\n      cols = propValue;\n    }\n    const infix = brkPoint !== minBreakpoint ? `-${brkPoint}` : '';\n    if (cols != null) classes.push(`${sizePrefix}${infix}-${cols}`);\n  });\n  return /*#__PURE__*/_jsx(Component, {\n    ref: ref,\n    ...props,\n    className: classNames(className, decoratedBsPrefix, ...classes)\n  });\n});\nRow.displayName = 'Row';\nexport default Row;"],"names":["PartialVideoList","props","className","Array","numVideos","fill","map","_","i","key","allowBulkActions","PartialVideoItem","breakpoints","useBreakpoints","isSmall","VideoListHelper","withDragHandle","withReordering","xs","Row","Col","defaultProps","PartialDashboardWidgetView","getPhrase","LanguageService","CuratedDashboardWidgetView","widgetId","useLiteFavourites","u","setFavourite","canFavourite","videoActions","useVideoActions","location","widget","DashboardRequests","currentUser","UserRequests","yearGroups","data","isAuthenticated","CustomerRequests","customerId","videos","content","useVideoMixin","useSetPageMetadata","PageMetadataHelper","title","name","phraseContext","phraseHandler","titlePhrase","descriptionPhrase","canonicalLink","SeoHelper","stripPresentationSlug","allowIndexing","audiences","usePresentationAudiences","hasPermissions","usePermissions","length","VideoActionsContext","value","VideoList","getVideoAppLink","video","opts","VideoAppLinkHelper","context","RelatedVideosContext","contextId","getSubTextAppLink","SeriesAppLinkHelper","series","presentationAudiences","getPreviewQuestionsAppLink","interactive","InteractiveHelper","redirectOnError","activePresentation","getFallbackPresentation","presentation","id","options","hydratedVideos","Set","videoIds","isArray","filter","Boolean","v","request","setRequest","unhydratedVideos","forEach","current","has","push","add","r","flightNamespace","bsPrefix","as","Component","ref","decoratedBsPrefix","minBreakpoint","sizePrefix","classes","brkPoint","propValue","cols","infix","displayName"],"sourceRoot":""}