8650726642

Committed 11 Apr 2024 05:20PM CUT coverage: 97.432% (-1.1%) from 98.563%

Build # 8650726642

Build Type

push

github

Committed by

web-flow

Commit Message

Merge pull request #368 from IQSS/feature/338-form-validation-library

Feature/338 form validation library

Run Details

691 of 723 branches covered (95.57%)

Branch coverage included in aggregate %.

134 of 134 new or added lines in 22 files covered. (100.0%)

1 existing line in 1 file now uncovered.

1851 of 1886 relevant lines covered (98.14%)

3428.69 hits per line

Source File
Press 'n' to go to next uncovered line, 'b' for previous

96.67

/packages/design-system/src/lib/components/form/form-group/FormGroup.tsx

import React, { PropsWithChildren } from 'react'
import { Form as FormBS } from 'react-bootstrap'
import { FormInput } from './form-element/FormInput'
import { FormLabel } from './form-element/FormLabel'
import { FormText } from './form-element/FormText'
import { FormSelect } from './form-element/FormSelect'
import { FormTextArea } from './form-element/FormTextArea'
import { Col, ColProps } from '../../grid/Col'
import { Row } from '../../grid/Row'
import { FormCheckbox } from './form-element/FormCheckbox'
import { FormFeedback } from './form-element/FormFeedback'

interface FormGroupProps extends ColProps {
  as?: typeof Col | typeof Row
  required?: boolean
  controlId: string
  fieldIndex?: string
}

function FormGroup({
  as = Row,
  required,
  controlId,
  fieldIndex,
  children,
  ...props
}: PropsWithChildren<FormGroupProps>) {
  const childrenWithRequiredProp = cloneThroughFragments(children, required, as)

  return (
    <FormBS.Group
      controlId={fieldIndex ? `${controlId}-${fieldIndex}` : controlId}
      className="mb-3"
      as={as}
      {...props}>
      {childrenWithRequiredProp}
    </FormBS.Group>
  )
}
function cloneThroughFragments(
  children: React.ReactNode,
  required?: boolean,
  as?: typeof Col | typeof Row
): React.ReactNode {
  return React.Children.map(children, (child) => {
    if (React.isValidElement(child)) {
      if (child.type === React.Fragment) {
        const hasChildren = (props: unknown): props is { children: React.ReactNode } =>
          typeof props === 'object' && Object.hasOwnProperty.call(props, 'children')

        if (hasChildren(child.props)) {
          return cloneThroughFragments(child.props.children, required, as)
        }
      }
      return React.cloneElement(child as React.ReactElement, {
        required: required,
        withinMultipleFieldsGroup: as === Col
      })
    }
    return child
  })
}

FormGroup.Label = FormLabel
FormGroup.Input = FormInput
FormGroup.Select = FormSelect
FormGroup.TextArea = FormTextArea
FormGroup.Text = FormText
FormGroup.Checkbox = FormCheckbox
FormGroup.Feedback = FormFeedback

export { FormGroup }

1	import React, { PropsWithChildren } from 'react'	840✔
2	import { Form as FormBS } from 'react-bootstrap'
3	import { FormInput } from './form-element/FormInput'
4	import { FormLabel } from './form-element/FormLabel'
5	import { FormText } from './form-element/FormText'
6	import { FormSelect } from './form-element/FormSelect'
7	import { FormTextArea } from './form-element/FormTextArea'
8	import { Col, ColProps } from '../../grid/Col'
9	import { Row } from '../../grid/Row'
10	import { FormCheckbox } from './form-element/FormCheckbox'
11	import { FormFeedback } from './form-element/FormFeedback'
12
13	interface FormGroupProps extends ColProps {
14	as?: typeof Col \| typeof Row
15	required?: boolean
16	controlId: string
17	fieldIndex?: string
18	}
19
20	function FormGroup({
21	as = Row,	184✔
22	required,
23	controlId,
24	fieldIndex,
25	children,
26	...props
27	}: PropsWithChildren<FormGroupProps>) {
28	const childrenWithRequiredProp = cloneThroughFragments(children, required, as)	184✔
29
30	return (	184✔
31	<FormBS.Group
32	controlId={fieldIndex ? `${controlId}-${fieldIndex}` : controlId}	184✔
33	className="mb-3"
34	as={as}
35	{...props}>
36	{childrenWithRequiredProp}
37	</FormBS.Group>
38	)
39	}	120✔
40	function cloneThroughFragments(
41	children: React.ReactNode,
42	required?: boolean,
43	as?: typeof Col \| typeof Row
44	): React.ReactNode {
45	return React.Children.map(children, (child) => {	188✔
46	if (React.isValidElement(child)) {	390✔
47	if (child.type === React.Fragment) {	390✔
48	const hasChildren = (props: unknown): props is { children: React.ReactNode } =>	4✔
49	typeof props === 'object' && Object.hasOwnProperty.call(props, 'children')	4✔
50
51	if (hasChildren(child.props)) {	4✔
52	return cloneThroughFragments(child.props.children, required, as)	4✔
53	}
54	}
55	return React.cloneElement(child as React.ReactElement, {	386✔
56	required: required,
57	withinMultipleFieldsGroup: as === Col
58	})
59	}
UNCOV 60	return child	×
61	})
62	}
63
64	FormGroup.Label = FormLabel	120✔
65	FormGroup.Input = FormInput	120✔
66	FormGroup.Select = FormSelect	120✔
67	FormGroup.TextArea = FormTextArea	120✔
68	FormGroup.Text = FormText	120✔
69	FormGroup.Checkbox = FormCheckbox	120✔
70	FormGroup.Feedback = FormFeedback	120✔
71
72	export { FormGroup }	120✔

IQSS / dataverse-frontend / 8650726642

Source File Press 'n' to go to next uncovered line, 'b' for previous

Source File
Press 'n' to go to next uncovered line, 'b' for previous