@clickview/lite 0.0.18-dev.1 → 0.0.18-rc.0

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

@@ -0,0 +1 @@
+{"version":3,"sources":["file://C:/ClickView Projects/@clickview/packages/libs/shared/src/components/edit-video-details/EditVideoDetails.tsx","file://C:/ClickView Projects/@clickview/packages/libs/shared/src/components/forms/form-buttons/FormButtons.tsx","file://C:/ClickView Projects/@clickview/packages/libs/shared/src/components/forms/form-checkbox/FormCheckbox.tsx","file://C:/ClickView Projects/@clickview/packages/libs/shared/src/components/forms/form-field/CharacterCounter.tsx","file://C:/ClickView Projects/@clickview/packages/libs/shared/src/components/forms/form-field/FormField.tsx","file://C:/ClickView Projects/@clickview/packages/libs/shared/src/components/forms/form-wrapper/FormWrapper.tsx","file://C:/ClickView Projects/@clickview/packages/libs/shared/src/hooks/UseCanSubmitForm.ts","file://C:/ClickView Projects/@clickview/packages/libs/shared/src/utils/FormHelper.ts"],"names":[],"mappings":"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","file":"scripts/9.chunk.js","sourcesContent":["import * as React from 'react';\r\nimport * as Yup from 'yup';\r\nimport { useFormikContext, Form } from 'formik';\r\n\r\nimport { LanguageService } from 'libs/common/backbone/services/LanguageService';\r\nimport { FormField } from 'libs/shared/components/forms/form-field/FormField';\r\nimport { FormWrapper } from 'libs/shared/components/forms/form-wrapper/FormWrapper';\r\nimport { FormButtons } from 'libs/shared/components/forms/form-buttons/FormButtons';\r\nimport { Text } from 'libs/shared/components/text/Text';\r\nimport { Video, UpdateVideoRequest } from 'libs/shared/interfaces';\r\n\r\ninterface VideoDetailsFormProps {\r\n  onClickCancel: () => void;\r\n}\r\n\r\nconst namespace = 'shared.editVideoDetails';\r\n\r\nexport const VideoValidationSchema = Yup.object().shape({\r\n  name: Yup.string()\r\n    .max(255, () => LanguageService.getPhrase(namespace, 'nameExceeds'))\r\n    .required(() => LanguageService.getPhrase(namespace, 'nameRequired')),\r\n  description: Yup.string()\r\n    .max(65535, () => LanguageService.getPhrase(namespace, 'descriptionExceeds'))\r\n});\r\n\r\nfunction VideoDetailsForm(props: VideoDetailsFormProps): JSX.Element {\r\n  const formikProps = useFormikContext<UpdateVideoRequest>();\r\n\r\n  return (\r\n    <Form>\r\n      <FormField\r\n        label={LanguageService.getPhrase(namespace, 'nameLabel')}\r\n        type='text'\r\n        name='name'\r\n        id='name'\r\n        placeholder={LanguageService.getPhrase(namespace, 'namePlaceholder')}\r\n        autoFocus\r\n        value={formikProps.values.name}\r\n      />\r\n      <FormField\r\n        label={LanguageService.getPhrase(namespace, 'descriptionLabel')}\r\n        as='textarea'\r\n        name='description'\r\n        id='description'\r\n        placeholder={LanguageService.getPhrase(namespace, 'descriptionPlaceholder')}\r\n        autoFocus\r\n        value={formikProps.values.description}\r\n      />\r\n      <div className='btn-container d-flex justify-content-end'>\r\n        <button type='button' className={`btn btn-link mr-2`} onClick={props.onClickCancel}>\r\n          <Text namespace={namespace} phrase='cancel' />\r\n        </button>\r\n        <FormButtons isNew={false} />\r\n      </div>\r\n    </Form>\r\n  );\r\n}\r\n\r\ninterface EditVideoDetailsComponentProps {\r\n  video?: Video;\r\n  saveVideo: (data: UpdateVideoRequest) => void;\r\n  onClickCancel: () => void;\r\n}\r\n\r\nexport function EditVideoDetails(props: EditVideoDetailsComponentProps): JSX.Element {\r\n  const { video: { name, description }, saveVideo, onClickCancel } = props;\r\n  return (\r\n    <FormWrapper<UpdateVideoRequest>\r\n      initialValues={{ name, description }}\r\n      validationSchema={VideoValidationSchema}\r\n      onSubmit={saveVideo}\r\n    >\r\n      <VideoDetailsForm onClickCancel={onClickCancel} />\r\n    </FormWrapper>\r\n  );\r\n}","import * as React from 'react';\r\nimport { useFormikContext } from 'formik';\r\n\r\nimport { useCanSubmitForm } from 'libs/shared/hooks/UseCanSubmitForm';\r\nimport { SpinnerButton } from 'libs/shared/components/spinner-button/SpinnerButton';\r\nimport { Text } from 'libs/shared/components/text/Text';\r\n\r\nconst namespace = 'shared.formButtons';\r\n\r\nconst ENTER_KEY_CODE = 13;\r\n\r\ninterface FormButtonsProps {\r\n  isNew: boolean;\r\n  hasNext?: boolean;\r\n}\r\n\r\nexport function FormButtons<Values extends object>(props: FormButtonsProps): JSX.Element {\r\n  const formikProps = useFormikContext<Values>();\r\n\r\n  const canSubmit = useCanSubmitForm(formikProps);\r\n\r\n  /**\r\n   * This hook listens to \"Enter\" keypress events, and submits the form if there\r\n   * are no errors. This prevents any edge cases where submitting doesn't work on\r\n   * Enter normally, such as when a custom component is in focus.\r\n   */\r\n  React.useEffect(() => {\r\n    function onKeyPress(e: KeyboardEvent): void {\r\n      if (e.keyCode !== ENTER_KEY_CODE || !canSubmit)\r\n        return;\r\n\r\n      formikProps.validateForm().then(errors => {\r\n        if (!Object.keys(errors).length)\r\n          formikProps.submitForm();\r\n      });\r\n    }\r\n\r\n    window.addEventListener('keypress', onKeyPress);\r\n    return () => window.removeEventListener('keypress', onKeyPress);\r\n  }, [canSubmit]);\r\n\r\n  let phraseKey = 'save';\r\n  if (props.isNew)\r\n    phraseKey = 'create';\r\n  if (props.hasNext)\r\n    phraseKey = 'next';\r\n\r\n  return (\r\n    <SpinnerButton showSpinner={formikProps.isSubmitting} type='submit' disabled={!canSubmit}>\r\n      <Text namespace={namespace} phrase={phraseKey} />\r\n    </SpinnerButton>\r\n  );\r\n}","import * as React from 'react';\r\n\r\nimport { FieldAttributes } from 'formik';\r\nimport { Form } from 'react-bootstrap';\r\nimport { FieldWrapper, FormFieldProps } from '../form-field/FormField';\r\n\r\n/**\r\n * Use this checkbox within Formik contexts\r\n */\r\nexport function FormCheckbox<Values extends object>(props: FieldAttributes<FormFieldProps<Values>>): JSX.Element {\r\n  const { label, ...fieldProps } = props;\r\n\r\n  return (\r\n    <Form.Group>\r\n      <div className='custom-control custom-checkbox'>\r\n        <FieldWrapper<Values> className='custom-control-input' {...fieldProps} />\r\n        <Form.Label className='custom-control-label' htmlFor={fieldProps.id}>{label}</Form.Label>\r\n      </div>\r\n    </Form.Group>\r\n  );\r\n}\r\n\r\n","import * as React from 'react';\r\nimport { useFormikContext } from 'formik';\r\n\r\ninterface CharacterCounterProps<Values extends object> {\r\n  fieldName: keyof Values;\r\n  limit: number;\r\n}\r\n\r\nexport function CharacterCounter<Values extends object>(props: CharacterCounterProps<Values>): JSX.Element {\r\n  const { values } = useFormikContext<Values>();\r\n\r\n  const field = values[props.fieldName];\r\n\r\n  if (typeof field !== 'string')\r\n    return <></>;\r\n\r\n  return (\r\n    <div className='float-right text-muted'>\r\n      {field.length}/{props.limit}\r\n    </div>\r\n  );\r\n}","import * as React from 'react';\r\nimport { Field, FieldAttributes, useFormikContext, ErrorMessage, FieldProps } from 'formik';\r\nimport { Form } from 'react-bootstrap';\r\n\r\nimport { FunctionHelper } from 'libs/common/backbone/utils/FunctionHelper';\r\n\r\nimport { FormHelper } from 'libs/shared/utils/FormHelper';\r\n\r\nimport { CharacterCounter } from './CharacterCounter';\r\nimport { FormCheckbox } from '../form-checkbox/FormCheckbox';\r\n\r\nexport interface FormFieldProps<Values extends object> {\r\n  /**\r\n   * The name prop MUST be the same as the attribute\r\n   * name of the value that the field is bound to.\r\n   */\r\n  name: string;\r\n  label?: string;\r\n  children?: ((props: FieldProps) => React.ReactNode) | React.ReactNode;\r\n  showCharacterCounter?: boolean;\r\n}\r\n\r\nexport function FieldWrapper<Values extends object>(\r\n  props: FieldAttributes<FormFieldProps<Values>> & { className: string }\r\n): React.ReactElement {\r\n  const { children, ...fieldProps } = props;\r\n\r\n  return (\r\n    <Field {...fieldProps}>\r\n      {FunctionHelper.isFunction(children)\r\n        ? (f: FieldProps) => children(f)\r\n        : React.Children.count(children) ? children : null\r\n      }\r\n    </Field>\r\n  );\r\n}\r\n\r\nexport function FormField<Values extends object>(props: FieldAttributes<FormFieldProps<Values>>): React.ReactElement {\r\n  const { label, className, showCharacterCounter, ...fieldProps } = props;\r\n\r\n  const { errors, touched } = useFormikContext<Values>();\r\n\r\n  if (fieldProps.type === 'checkbox')\r\n    return <FormCheckbox<Values> {...props} />;\r\n\r\n  return (\r\n    <Form.Group>\r\n      {!!label && <Form.Label htmlFor={fieldProps.id}>{label}</Form.Label>}\r\n      <FieldWrapper<Values>\r\n        className={FormHelper.getCustomFormControlClassName(errors, touched, fieldProps.name, className)}\r\n        {...fieldProps}\r\n      />\r\n      {!!showCharacterCounter && !!(fieldProps as React.HTMLProps<HTMLInputElement>).maxLength &&\r\n        <CharacterCounter\r\n          fieldName={(fieldProps.name as keyof Values)}\r\n          limit={(fieldProps as React.HTMLProps<HTMLInputElement>).maxLength}\r\n        />\r\n      }\r\n      <ErrorMessage name={fieldProps.name}>\r\n        {(errorMessage: string) => <Form.Control.Feedback type='invalid'>{errorMessage}</Form.Control.Feedback>}\r\n      </ErrorMessage>\r\n    </Form.Group>\r\n  );\r\n}","import * as React from 'react';\r\nimport { Formik, FormikValues, FormikConfig, FormikProps, FormikHelpers, useFormikContext, FormikContextType } from 'formik';\r\nimport { FunctionHelper } from 'libs/common/backbone/utils/FunctionHelper';\r\nimport { ObjectHelper } from 'libs/common/react/utils/ObjectHelper';\r\n\r\nfunction omitNullInitialValues<Values extends FormikValues>(initialValues: Values): Values {\r\n  const values = ObjectHelper.deepClone(initialValues);\r\n\r\n  Object.keys(values).forEach((key: keyof Values) => {\r\n    if (!values.hasOwnProperty(key))\r\n      return;\r\n\r\n    if (ObjectHelper.isObject(values[key]))\r\n      values[key] = omitNullInitialValues(values[key]);\r\n    else if (values[key] === null)\r\n      delete values[key];\r\n  });\r\n\r\n  return values;\r\n}\r\n\r\n// Omit attributes from FormikConfig that are defined in FormWrapperProps.\r\ntype ModifiedFormikConfig<Values extends FormikValues> = Omit<FormikConfig<Values>, 'initialValues' | 'onSubmit'>;\r\n\r\ninterface InitialStatus {\r\n  allowInitialSubmit: boolean;\r\n}\r\n\r\ninterface FormWrapperProps<FormValues extends FormikValues, ApiValues extends FormikValues> {\r\n  initialValues: FormValues | ApiValues;\r\n  onSubmit: (data: FormValues, onDone: () => void) => void;\r\n  castInitialValues?: boolean; // cast to validationSchema\r\n  castValuesOnSubmit?: boolean; // cast to validationSchema\r\n  allowInitialSubmit?: boolean; // if true, useCanSubmitForm will allow submit without any user changes.\r\n  resetOnSubmit?: boolean;\r\n}\r\n\r\nFormWrapper.defaultProps = {\r\n  castInitialValues: true,\r\n  castValuesOnSubmit: true\r\n};\r\n\r\nexport function FormWrapper<\r\n  FormValues extends FormikValues = FormikValues,\r\n  ApiValues extends FormikValues = FormikValues,\r\n  ExtraProps = {}\r\n>(props: ModifiedFormikConfig<FormValues> & ExtraProps & FormWrapperProps<FormValues, ApiValues>): JSX.Element {\r\n  const { castInitialValues, castValuesOnSubmit, initialValues, onSubmit, resetOnSubmit, ...formikProps } = props;\r\n\r\n  /**\r\n   * If castInitialValues is true, cast initialValues to the validationSchema.\r\n   * This will ensure that any data fetched from the api conforms to the expected form data shape.\r\n   */\r\n  const formattedInitialValues: FormValues = castInitialValues && props.validationSchema\r\n    ? props.validationSchema.cast(omitNullInitialValues(initialValues))\r\n    : initialValues;\r\n\r\n  const onSubmitHandler = (\r\n    values: FormValues,\r\n    { setSubmitting, resetForm }: FormikHelpers<FormValues>\r\n  ) => {\r\n    /**\r\n     * validationSchema.cast will coerce the values to the types defined in validationSchema.\r\n     * This is useful for trimming inputs:\r\n     * e.g. if a value field has type Yup.string().trim(), it will be automatically trimmed.\r\n     */\r\n    const formattedData = castValuesOnSubmit && props.validationSchema\r\n      ? props.validationSchema.cast(values)\r\n      : values;\r\n\r\n    onSubmit(formattedData, () => {\r\n      resetOnSubmit && resetForm();\r\n      setSubmitting(false);\r\n    });\r\n  };\r\n\r\n  const initialStatus: InitialStatus = {\r\n    allowInitialSubmit: props.allowInitialSubmit\r\n  };\r\n\r\n  return (\r\n    <Formik<FormValues, ExtraProps>\r\n      enableReinitialize\r\n      {...(formikProps as ModifiedFormikConfig<FormValues> & ExtraProps)}\r\n      initialValues={formattedInitialValues}\r\n      onSubmit={onSubmitHandler}\r\n      initialStatus={initialStatus}\r\n    >\r\n      {FunctionHelper.isFunction(props.children)\r\n        ? (f: FormikProps<FormValues>) => (props.children as (f: FormikProps<FormValues>) => React.ReactNode)(f)\r\n        : React.Children.count(props.children) ? props.children : null\r\n      }\r\n    </Formik>\r\n  );\r\n}\r\n\r\nexport function useFormikContextWrapper<T>(): FormikContextType<T> {\r\n  return useFormikContext<T>();\r\n}","import * as React from 'react';\r\nimport { FormikValues, FormikProps } from 'formik';\r\n\r\n/**\r\n * useCanSubmitForm determines if a form can be submitted.\r\n * \r\n * It will return true if a form is valid and has been changed from it's initial state.\r\n * \r\n * A common use case for this is determining whether or not to enable\r\n * a submit button in a form.\r\n */\r\nexport function useCanSubmitForm<Values extends FormikValues>(formikProps: FormikProps<Values>): boolean {\r\n  const [ canSubmit, setCanSubmit ] = React.useState(false);\r\n\r\n  React.useEffect(() => {\r\n    if (!formikProps.isValid) {\r\n      setCanSubmit(false);\r\n      return;\r\n    }\r\n\r\n    // If the form values have changed of if allowInitialSubmit is true, set canSubmit to true.\r\n    if (formikProps.dirty || formikProps.initialStatus?.allowInitialSubmit)\r\n      setCanSubmit(true);\r\n    else\r\n      setCanSubmit(false);\r\n\r\n  }, [ formikProps.isValid, formikProps.initialStatus?.allowInitialSubmit, formikProps.dirty, formikProps.values ]);\r\n\r\n  React.useEffect(() => {\r\n    if (formikProps.isSubmitting)\r\n      setCanSubmit(false);\r\n  }, [formikProps.isSubmitting]);\r\n\r\n  return canSubmit;\r\n}\r\n","import { FormikErrors, FormikTouched, getIn } from 'formik';\r\n\r\nexport const FormHelper = {\r\n  getCustomFormControlClassName<T>(\r\n    errors: FormikErrors<T>,\r\n    touched: FormikTouched<T>,\r\n    attribute: string,\r\n    additionalClassName?: string\r\n  ): string {\r\n    let className = 'form-control';\r\n\r\n    // Using getIn as it supports dot notation\r\n    if (getIn(touched, attribute) && getIn(errors, attribute))\r\n      className += ' is-invalid';\r\n\r\n    if (additionalClassName)\r\n      className += ` ${additionalClassName}`;\r\n\r\n    return className;\r\n  }\r\n};"],"sourceRoot":""}