@digigov/react-core 2.0.0-rc.23 → 2.0.0-rc.25

package/src/Paragraph/index.test.tsx

@@ -8,56 +8,73 @@ it('renders the Paragraph with no props', () => {
 });
 
 it('renders the Paragraph with size=lead', () => {
-  expect(render(<Paragraph size={'lg'}>hello</Paragraph>).baseElement).toMatchSnapshot();
+  expect(
+    render(<Paragraph size={'lg'}>hello</Paragraph>).baseElement
+  ).toMatchSnapshot();
 });
 
 it('renders the Paragraph with size=normal', () => {
-  expect(render(<Paragraph size={'md'}>hello</Paragraph>).baseElement).toMatchSnapshot();
+  expect(
+    render(<Paragraph size={'md'}>hello</Paragraph>).baseElement
+  ).toMatchSnapshot();
 });
 
 it('renders the Paragraph with size=small', () => {
-  expect(render(<Paragraph size={'sm'}>hello</Paragraph>).baseElement).toMatchSnapshot();
+  expect(
+    render(<Paragraph size={'sm'}>hello</Paragraph>).baseElement
+  ).toMatchSnapshot();
 });
 
 it('renders the Paragraph with fontSize=14', () => {
-  expect(render(<Paragraph fontSize={14}>hello</Paragraph>).baseElement).toMatchSnapshot();
+  expect(
+    render(<Paragraph fontSize={14}>hello</Paragraph>).baseElement
+  ).toMatchSnapshot();
 });
 
 it('renders the Paragraph with fontSize=16', () => {
-  expect(render(<Paragraph fontSize={16}>hello</Paragraph>).baseElement).toMatchSnapshot();
+  expect(
+    render(<Paragraph fontSize={16}>hello</Paragraph>).baseElement
+  ).toMatchSnapshot();
 });
 
 it('renders the Paragraph with fontSize=19', () => {
-  expect(render(<Paragraph fontSize={19}>hello</Paragraph>).baseElement).toMatchSnapshot();
+  expect(
+    render(<Paragraph fontSize={19}>hello</Paragraph>).baseElement
+  ).toMatchSnapshot();
 });
 
 it('renders the Paragraph with fontSize=24', () => {
-  expect(render(<Paragraph fontSize={24}>hello</Paragraph>).baseElement).toMatchSnapshot();
+  expect(
+    render(<Paragraph fontSize={24}>hello</Paragraph>).baseElement
+  ).toMatchSnapshot();
 });
 
 it('renders the Paragraph with fontSize=30', () => {
-  expect(render(<Paragraph fontSize={30}>hello</Paragraph>).baseElement).toMatchSnapshot();
+  expect(
+    render(<Paragraph fontSize={30}>hello</Paragraph>).baseElement
+  ).toMatchSnapshot();
 });
 
 it('renders the Paragraph with fontSize=36', () => {
-  expect(render(<Paragraph fontSize={36}>hello</Paragraph>).baseElement).toMatchSnapshot();
+  expect(
+    render(<Paragraph fontSize={36}>hello</Paragraph>).baseElement
+  ).toMatchSnapshot();
 });
 
 it('renders the Paragraph with fontSize=48', () => {
-  expect(render(<Paragraph fontSize={48}>hello</Paragraph>).baseElement).toMatchSnapshot();
+  expect(
+    render(<Paragraph fontSize={48}>hello</Paragraph>).baseElement
+  ).toMatchSnapshot();
 });
 
 it('renders the Paragraph with fontSize=72', () => {
-  expect(render(<Paragraph fontSize={72}>hello</Paragraph>).baseElement).toMatchSnapshot();
-});
-it('renders the Paragraph with fontWeight=regular', () => {
   expect(
-    render(<Paragraph fontWeight={'regular'}>hello</Paragraph>).baseElement
+    render(<Paragraph fontSize={72}>hello</Paragraph>).baseElement
   ).toMatchSnapshot();
 });
-it('renders the Paragraph with fontWeight=bold', () => {
+it('renders the Paragraph with fontWeight=regular', () => {
   expect(
-    render(<Paragraph fontWeight={'bold'}>hello</Paragraph>).baseElement
+    render(<Paragraph fontWeight={'regular'}>hello</Paragraph>).baseElement
   ).toMatchSnapshot();
 });
 it('renders the Paragraph with fontWeight=bold', () => {
@@ -65,7 +82,6 @@ it('renders the Paragraph with fontWeight=bold', () => {
     render(<Paragraph fontWeight={'bold'}>hello</Paragraph>).baseElement
   ).toMatchSnapshot();
 });
-
 it('renders the Paragraph with size=lead and fontSize=14', () => {
   expect(
     render(

package/src/PhaseBanner/index.test.tsx

@@ -4,9 +4,13 @@ import { render } from '@testing-library/react';
 import PhaseBanner from '@digigov/react-core/PhaseBanner';
 
 it('renders the PhaseBanner with no props', () => {
-  expect(render(<PhaseBanner>hello</PhaseBanner>).baseElement).toMatchSnapshot();
+  expect(
+    render(<PhaseBanner>hello</PhaseBanner>).baseElement
+  ).toMatchSnapshot();
 });
 
 it('renders the PhaseBanner with underline prop', () => {
-  expect(render(<PhaseBanner underline>hello</PhaseBanner>).baseElement).toMatchSnapshot();
+  expect(
+    render(<PhaseBanner underline>hello</PhaseBanner>).baseElement
+  ).toMatchSnapshot();
 });

package/src/PhaseBanner/index.tsx

@@ -31,7 +31,8 @@ export const PhaseBanner = React.forwardRef<HTMLDivElement, PhaseBannerProps>(
         })}
         {...props}
       >
-        <Base as="p"
+        <Base
+          as="p"
           className={clsx({
             'ds-phase-banner__content': true,
           })}

package/src/PhaseBannerHeaderContainer/inde.test.tsx

@@ -5,6 +5,7 @@ import PhaseBannerHeaderContainer from '@digigov/react-core/PhaseBannerHeaderCon
 
 it('renders the PhaseBannerHeaderContainer with no props', () => {
   expect(
-    render(<PhaseBannerHeaderContainer>hello</PhaseBannerHeaderContainer>).baseElement
+    render(<PhaseBannerHeaderContainer>hello</PhaseBannerHeaderContainer>)
+      .baseElement
   ).toMatchSnapshot();
 });

package/src/PhaseBannerHeaderContainer/index.tsx

@@ -2,7 +2,7 @@ import React from 'react';
 import clsx from 'clsx';
 import Base, { BaseProps } from '@digigov/react-core/Base';
 
-export interface PhaseBannerHeaderContainerProps extends BaseProps<'div'> { }
+export interface PhaseBannerHeaderContainerProps extends BaseProps<'div'> {}
 
 export const PhaseBannerHeaderContainer = React.forwardRef<
   HTMLDivElement,

package/src/PhaseBannerTag/index.test.tsx

@@ -4,5 +4,7 @@ import { render } from '@testing-library/react';
 import PhaseBannerTag from '@digigov/react-core/PhaseBannerTag';
 
 it('renders the PhaseBannerTag with no props', () => {
-  expect(render(<PhaseBannerTag>hello</PhaseBannerTag>).baseElement).toMatchSnapshot();
+  expect(
+    render(<PhaseBannerTag>hello</PhaseBannerTag>).baseElement
+  ).toMatchSnapshot();
 });

package/src/PhaseBannerTag/index.tsx

@@ -2,7 +2,7 @@ import React from 'react';
 import clsx from 'clsx';
 import Base, { BaseProps } from '@digigov/react-core/Base';
 
-export interface PhaseBannerTagProps extends BaseProps<'span'> { }
+export interface PhaseBannerTagProps extends BaseProps<'span'> {}
 /**
  * PhaseBannerTag is used inside the PhaseBanner component and it requires a text of the phase of the service (ex. Alpha, Beta).
  */

package/src/PhaseBannerText/index.test.tsx

@@ -4,5 +4,7 @@ import { render } from '@testing-library/react';
 import PhaseBannerText from '@digigov/react-core/PhaseBannerText';
 
 it('renders the PhaseBannerText with no props', () => {
-  expect(render(<PhaseBannerText>hello</PhaseBannerText>).baseElement).toMatchSnapshot();
+  expect(
+    render(<PhaseBannerText>hello</PhaseBannerText>).baseElement
+  ).toMatchSnapshot();
 });

package/src/PhaseBannerText/index.tsx

@@ -2,7 +2,7 @@ import React from 'react';
 import clsx from 'clsx';
 import Base, { BaseProps } from '@digigov/react-core/Base';
 
-export interface PhaseBannerTextProps extends BaseProps<'span'> { }
+export interface PhaseBannerTextProps extends BaseProps<'span'> {}
 /**
  * PhaseBannerText is used inside the PhaseBanner component.
  * It requires a text with more details about the phase of the service (ex. "This is a new service").

package/src/RadioConditional/index.test.tsx

@@ -4,5 +4,7 @@ import { render } from '@testing-library/react';
 import RadioConditional from '@digigov/react-core/RadioConditional';
 
 it('renders the Blockquote with no props', () => {
-  expect(render(<RadioConditional>hello</RadioConditional>).baseElement).toMatchSnapshot();
+  expect(
+    render(<RadioConditional>hello</RadioConditional>).baseElement
+  ).toMatchSnapshot();
 });

package/src/RadioConditional/index.tsx

@@ -4,7 +4,7 @@ import Base, { BaseProps } from '@digigov/react-core/Base';
 import FieldContainer from '@digigov/react-core/FieldContainer';
 import LabelContainer from '@digigov/react-core/LabelContainer';
 
-export interface RadioConditionalProps extends BaseProps<'div'> { }
+export interface RadioConditionalProps extends BaseProps<'div'> {}
 /**
  * RadioConditional asks the user a related question when they select a particular radios,
  * so they only see the question when it’s relevant to them.

package/src/RadioContainer/index.test.tsx

@@ -4,13 +4,18 @@ import { render } from '@testing-library/react';
 import RadioContainer from '@digigov/react-core/RadioContainer';
 
 it('renders the RadioContainer with no props', () => {
-  expect(render(<RadioContainer>hello</RadioContainer>).baseElement).toMatchSnapshot();
+  expect(
+    render(<RadioContainer>hello</RadioContainer>).baseElement
+  ).toMatchSnapshot();
 });
 it('renders the RadioContainer with layout=horizontal', () => {
   expect(
-    render(<RadioContainer layout="horizontal">hello</RadioContainer>).baseElement
+    render(<RadioContainer layout="horizontal">hello</RadioContainer>)
+      .baseElement
   ).toMatchSnapshot();
 });
 it('renders the RadioContainer with dense prop', () => {
-  expect(render(<RadioContainer dense>hello</RadioContainer>).baseElement).toMatchSnapshot();
+  expect(
+    render(<RadioContainer dense>hello</RadioContainer>).baseElement
+  ).toMatchSnapshot();
 });

package/src/RadioItem/index.test.tsx

@@ -8,7 +8,9 @@ it('renders the RadioItem with no props', () => {
 });
 
 it('renders the RadioItem with name  props', () => {
-  expect(render(<RadioItem name={'name'}>hello</RadioItem>).baseElement).toMatchSnapshot();
+  expect(
+    render(<RadioItem name={'name'}>hello</RadioItem>).baseElement
+  ).toMatchSnapshot();
 });
 
 it('renders the RadioItem  value props', () => {
@@ -34,7 +36,9 @@ it('renders the RadioItem with name and value props', () => {
 });
 
 it('renders the RadioItem with disabled prop', () => {
-  expect(render(<RadioItem disabled>hello</RadioItem>).baseElement).toMatchSnapshot();
+  expect(
+    render(<RadioItem disabled>hello</RadioItem>).baseElement
+  ).toMatchSnapshot();
 });
 
 it('renders the RadioItem with name disabled and value props', () => {

package/src/RadioItem/index.tsx

@@ -32,7 +32,8 @@ export const RadioItem = React.forwardRef<HTMLInputElement, RadioItemProps>(
     return (
       <>
         {dividerText && <ChoiceDividerText>{dividerText}</ChoiceDividerText>}
-        <Base as='div'
+        <Base
+          as="div"
           className={clsx(className, {
             'ds-radios__item': true,
           })}

package/src/ResultsActionBar/index.tsx

@@ -2,7 +2,7 @@ import React from 'react';
 import clsx from 'clsx';
 import Base, { BaseProps } from '@digigov/react-core/Base';
 
-export interface ResultsActionBarProps extends BaseProps<'div'> { }
+export interface ResultsActionBarProps extends BaseProps<'div'> {}
 /**
  * Use ResultsActionBar component to wrap inside page actions.
  */

package/src/ResultsActionBar/indext.test.tsx

@@ -4,5 +4,7 @@ import { render } from '@testing-library/react';
 import ResultsActionBar from '@digigov/react-core/ResultsActionBar';
 
 it('renders the ResultsActionBar with no props', () => {
-  expect(render(<ResultsActionBar>hello</ResultsActionBar>).baseElement).toMatchSnapshot();
+  expect(
+    render(<ResultsActionBar>hello</ResultsActionBar>).baseElement
+  ).toMatchSnapshot();
 });

package/src/ResultsHeading/index.test.tsx

@@ -4,5 +4,7 @@ import { render } from '@testing-library/react';
 import ResultsHeading from '@digigov/react-core/ResultsHeading';
 
 it('renders the ResultsHeading with no props', () => {
-  expect(render(<ResultsHeading>hello</ResultsHeading>).baseElement).toMatchSnapshot();
+  expect(
+    render(<ResultsHeading>hello</ResultsHeading>).baseElement
+  ).toMatchSnapshot();
 });

package/src/ResultsHeading/index.tsx

@@ -2,7 +2,7 @@ import React from 'react';
 import clsx from 'clsx';
 import Base, { BaseProps } from '@digigov/react-core/Base';
 
-export interface ResultsHeadingProps extends BaseProps<'div'> { }
+export interface ResultsHeadingProps extends BaseProps<'div'> {}
 /**
  * Use ResultsHeading component to wrap title for results.
  *

package/src/SearchButton/index.tsx

@@ -3,7 +3,7 @@ import clsx from 'clsx';
 import Button, { ButtonProps } from '@digigov/react-core/Button';
 import { SearchIcon } from '@digigov/react-icons';
 
-export interface SearchButtonProps extends ButtonProps { }
+export interface SearchButtonProps extends ButtonProps {}
 /**
  * Use the SearchButton component to help users carry out a search action.
  * SearchButton component must be used inside SearchContainer component.

package/src/SearchContainer/index.test.tsx

@@ -4,5 +4,7 @@ import { render } from '@testing-library/react';
 import SearchContainer from '@digigov/react-core/SearchContainer';
 
 it('renders the SearchContainer with no prop', () => {
-  expect(render(<SearchContainer>hello</SearchContainer>).baseElement).toMatchSnapshot();
+  expect(
+    render(<SearchContainer>hello</SearchContainer>).baseElement
+  ).toMatchSnapshot();
 });

package/src/SearchContainer/index.tsx

@@ -2,7 +2,7 @@ import React from 'react';
 import clsx from 'clsx';
 import Base, { BaseProps } from '@digigov/react-core/Base';
 
-export interface SearchContainerProps extends BaseProps<'div'> { }
+export interface SearchContainerProps extends BaseProps<'div'> {}
 /**
  * Use this component to wrap SearchButton component.
  */

package/src/SectionBreak/index.test.tsx

@@ -12,7 +12,9 @@ it('renders the SectionBreak with visible=true', () => {
 });
 
 it('renders the SectionBreak with visible=false', () => {
-  expect(render(<SectionBreak visible={false} />).baseElement).toMatchSnapshot();
+  expect(
+    render(<SectionBreak visible={false} />).baseElement
+  ).toMatchSnapshot();
 });
 
 it('renders the SectionBreak with size=xl', () => {

package/src/SelectContainer/index.test.tsx

@@ -4,12 +4,15 @@ import { render } from '@testing-library/react';
 import SelectContainer from '@digigov/react-core/SelectContainer';
 
 it('renders the SelectContainer with no props', () => {
-  expect(render(<SelectContainer>hello</SelectContainer>).baseElement).toMatchSnapshot();
+  expect(
+    render(<SelectContainer>hello</SelectContainer>).baseElement
+  ).toMatchSnapshot();
 });
 
 it('renders the SelectContainer with name props', () => {
   expect(
-    render(<SelectContainer name={'some-name'}>hello</SelectContainer>).baseElement
+    render(<SelectContainer name={'some-name'}>hello</SelectContainer>)
+      .baseElement
   ).toMatchSnapshot();
 });
 it('renders the SelectContainer with dense prop', () => {

package/src/SelectOption/index.test.tsx

@@ -4,7 +4,9 @@ import { render } from '@testing-library/react';
 import SelectOption from '@digigov/react-core/SelectOption';
 
 it('renders the SelectOption with no props', () => {
-  expect(render(<SelectOption>hello</SelectOption>).baseElement).toMatchSnapshot();
+  expect(
+    render(<SelectOption>hello</SelectOption>).baseElement
+  ).toMatchSnapshot();
 });
 
 it('renders the SelectOption with value props', () => {

package/src/SelectOption/index.tsx

@@ -2,7 +2,7 @@ import React from 'react';
 import clsx from 'clsx';
 import Base, { BaseProps } from '@digigov/react-core/Base';
 
-export interface SelectOptionProps extends BaseProps<'option'> { }
+export interface SelectOptionProps extends BaseProps<'option'> {}
 /**
  * SelectOption component is used for display options value.
  * SelectOption component must be included inside Select component as children component

package/src/SingleCharacterInput/__snapshots__/index.test.tsx.snap

@@ -15,21 +15,6 @@ exports[`renders the SingleCharacterInput with name and error props 1`] = `
 </body>
 `;
 
-exports[`renders the SingleCharacterInput with name and error props 2`] = `
-<body>
-  <div>
-    <input
-      class="ds-single-character-input__item ds-input ds-input--error"
-      inputmode="numeric"
-      maxlength="1"
-      name="single-character-input"
-      pattern="[0-9]*"
-      type="text"
-    />
-  </div>
-</body>
-`;
-
 exports[`renders the SingleCharacterInput with name prop 1`] = `
 <body>
   <div>

package/src/SingleCharacterInput/index.test.tsx

@@ -14,19 +14,15 @@ it('renders the SingleCharacterInput with name prop', () => {
 
 it('renders the SingleCharacterInput with name and error props', () => {
   expect(
-    render(<SingleCharacterInput name={'single-character-input'} error />).baseElement
+    render(<SingleCharacterInput name={'single-character-input'} error />)
+      .baseElement
   ).toMatchSnapshot();
 });
 it('renders the SingleCharacterInput with pattern prop', () => {
-  expect(render(<SingleCharacterInput pattern="\d{1}" />).baseElement).toMatchSnapshot();
-});
-
-it('renders the SingleCharacterInput with name and error props', () => {
   expect(
-    render(<SingleCharacterInput name={'single-character-input'} error />).baseElement
+    render(<SingleCharacterInput pattern="\d{1}" />).baseElement
   ).toMatchSnapshot();
 });
-
 it('renders the SingleCharacterInput with name, pattern, maxLength and error props', () => {
   expect(
     render(

package/src/SingleCharacterInputs/index.tsx

@@ -2,7 +2,7 @@ import React from 'react';
 import clsx from 'clsx';
 import Base, { BaseProps } from '@digigov/react-core/Base';
 
-export interface SingleCharacterInputsProps extends BaseProps<'div'> { }
+export interface SingleCharacterInputsProps extends BaseProps<'div'> {}
 /**
  * Details for the SingleCharacterInputs.
  * It is used as a parent component to wrap SingleCharacterInput component.

package/src/Skeleton/index.test.tsx

@@ -7,29 +7,56 @@ it('renders the Skeleton with no props', () => {
   expect(render(<Skeleton>hello</Skeleton>).baseElement).toMatchSnapshot();
 });
 it('renders the Skeleton with variant="circular"', () => {
-  expect(render(<Skeleton variant='circular'>hello</Skeleton>).baseElement).toMatchSnapshot();
+  expect(
+    render(<Skeleton variant="circular">hello</Skeleton>).baseElement
+  ).toMatchSnapshot();
 });
 it('renders the Skeleton with variant="rectangular"', () => {
-  expect(render(<Skeleton variant='rectangular'>hello</Skeleton>).baseElement).toMatchSnapshot();
+  expect(
+    render(<Skeleton variant="rectangular">hello</Skeleton>).baseElement
+  ).toMatchSnapshot();
 });
 it('renders the Skeleton with variant="button"', () => {
-  expect(render(<Skeleton variant='button'>hello</Skeleton>).baseElement).toMatchSnapshot();
+  expect(
+    render(<Skeleton variant="button">hello</Skeleton>).baseElement
+  ).toMatchSnapshot();
 });
 it('renders the Skeleton with width="100"', () => {
-  expect(render(<Skeleton width='100'>hello</Skeleton>).baseElement).toMatchSnapshot();
+  expect(
+    render(<Skeleton width="100">hello</Skeleton>).baseElement
+  ).toMatchSnapshot();
 });
 it('renders the Skeleton with height="100"', () => {
-  expect(render(<Skeleton height='100'>hello</Skeleton>).baseElement).toMatchSnapshot();
+  expect(
+    render(<Skeleton height="100">hello</Skeleton>).baseElement
+  ).toMatchSnapshot();
 });
 it('renders the Skeleton with fontSize="sm"', () => {
-  expect(render(<Skeleton fontSize='sm'>hello</Skeleton>).baseElement).toMatchSnapshot();
+  expect(
+    render(<Skeleton fontSize="sm">hello</Skeleton>).baseElement
+  ).toMatchSnapshot();
 });
 it('renders the Skeleton with fontSize="lg"', () => {
-  expect(render(<Skeleton fontSize='lg'>hello</Skeleton>).baseElement).toMatchSnapshot();
+  expect(
+    render(<Skeleton fontSize="lg">hello</Skeleton>).baseElement
+  ).toMatchSnapshot();
 });
 it('renders the Skeleton with animation=false', () => {
-  expect(render(<Skeleton animation={false}>hello</Skeleton>).baseElement).toMatchSnapshot();
+  expect(
+    render(<Skeleton animation={false}>hello</Skeleton>).baseElement
+  ).toMatchSnapshot();
 });
 it('renders the Skeleton with variant="rectangular", width="100" height="100" animation=false', () => {
-  expect(render(<Skeleton variant='rectangular' width={100} height={100} animation={false}>hello</Skeleton>).baseElement).toMatchSnapshot();
+  expect(
+    render(
+      <Skeleton
+        variant="rectangular"
+        width={100}
+        height={100}
+        animation={false}
+      >
+        hello
+      </Skeleton>
+    ).baseElement
+  ).toMatchSnapshot();
 });

package/src/Skeleton/index.tsx

@@ -84,7 +84,7 @@ export const Skeleton = React.forwardRef<HTMLSpanElement, SkeletonProps>(
             typeof children === 'string'
               ? Math.ceil(children.length * 0.5) + 'em'
               : width,
-          maxWidth: !!width ? '100%' : undefined,
+          maxWidth: width ? '100%' : undefined,
           height: height,
           ...style,
         }}

package/src/SkipLink/index.tsx

@@ -2,7 +2,7 @@ import React from 'react';
 import clsx from 'clsx';
 import Base, { BaseProps } from '@digigov/react-core/Base';
 
-export interface LinkProps extends BaseProps<'a'> { }
+export interface LinkProps extends BaseProps<'a'> {}
 /**
  * Use the skip link component to help keyboard-only users skip to the main content on a page.
  */