@digigov/react-core 1.0.0-002c630d → 1.0.0-6b93ebf2

package/src/DateInputItem/index.tsx

@@ -4,14 +4,19 @@ import Base, { BaseProps } from '@digigov/react-core/Base';
 
 export interface DateInputItemProps extends BaseProps<'input'> {
   /**
-   * Width property is optional.
-   * Use this property for year field to grow width.
-   */
+  * Width property is optional.
+  * Use this property for year field to grow width.
+  * @value 2
+  * @value 4
+  * @default 2
+  */
   width?: 2 | 4;
   /**
-   * error is optional. The default value is false.
-   * Use this prop when there is an error at the input.
-   */
+  * error is optional. The default value is false.
+  * Use this prop when there is an error at the input.
+  * @value true
+  * @value false
+  */
   error?: boolean;
 }
 /**

package/src/Details/index.tsx

@@ -7,7 +7,7 @@ export interface DetailsProps extends BaseProps<'details'> {}
  * Details is used to make a page easier to scan when it contains information that only some users will need.
  * Details component wraps DetailsSummary and DetailsContent as children components
  */
-export const Details = React.forwardRef<HTMLElement, DetailsProps>(
+export const Details = React.forwardRef<HTMLDetailsElement, DetailsProps>(
   function Details({ className, children, ...props }, ref) {
     return (
       <Base

package/src/DetailsSummary/index.tsx

@@ -4,8 +4,10 @@ import Base, { BaseProps } from '@digigov/react-core/Base';
 
 export interface DetailsSummaryProps extends BaseProps<'summary'> {
   /*
-   ** size is optional. Default value is 'md'.
-   */
+  ** size is optional. Default value is 'md'.
+  * @value 'md'
+  * @value 'lg'
+  */
   size?: 'md' | 'lg';
 }
 /**

package/src/Drawer/index.tsx

@@ -4,22 +4,32 @@ import Base, { BaseProps } from '@digigov/react-core/Base';
 
 export interface DrawerProps extends BaseProps<'div'> {
   /**
-   * open is optional.
-   * This declares if the drawer is open at small screens.
-   */
+  * open is optional.
+  * This declares if the drawer is open at small screens.
+  * @value true
+  * @value false
+  */
   open?: boolean;
 
   /**
-   * direction is optional.
-   * Add the direction of the drawer, when this is open at mobile view.
-   * The default value is 'left'.
-   */
+  * direction is optional.
+  * Add the direction of the drawer, when this is open at mobile view.
+  * The default value is 'left'.
+  * @value 'right'
+  * @value 'left'
+  * @default 'left'
+  */
   direction?: 'right' | 'left';
 
   /**
-   * upRelative is optional. This declares if the drawer is open at large screens in a relative position.
-   * The default value is never.
-   * */
+  * upRelative is optional. This declares if the drawer is open at large screens in a relative position.
+  * The default value is never.
+  * * @value 'sm'
+  * @value 'md'
+  * @value 'lg'
+  * @value 'never'
+  * @default 'never'
+  */
   upRelative?: 'sm' | 'md' | 'lg' | 'never';
 }
 /**

package/src/DrawerHeading/index.tsx

@@ -1,30 +1,17 @@
 import React from 'react';
 import clsx from 'clsx';
 import Base, { BaseProps } from '@digigov/react-core/Base';
-import LinkBase from '@digigov/react-core/LinkBase';
 import { CloseIcon } from '@digigov/react-icons';
+import Button from '@digigov/react-core/Button';
 
 export interface DrawerHeadingProps extends BaseProps<'div'> {
-  /**
-   * includeClose is optional.
-   * This declares if the close icon should be included.
-   * The default value is true.
-   */
-  includeClose?: boolean;
 
   /**
-   * closeLabel is optional.
-   * This declares the label of the close icon.
-   * The default value is Κλείσιμο.
-   */
+  * closeLabel is optional.
+  * This declares the label of the close icon.
+  * @default 'Κλείσιμο'
+  */
   closeLabel?: string;
-
-  /**
-   * closeIcon is optional.
-   * This declares the close icon.
-   * The default value is CloseIcon.
-   * */
-  closeIcon?: React.ReactNode;
 }
 /**
  * Use DrawerHeading component inside Drawing
@@ -38,9 +25,7 @@ export const DrawerHeading = React.forwardRef<
   {
     className,
     children,
-    includeClose = true,
     closeLabel = 'Κλείσιμο',
-    closeIcon = <CloseIcon />,
     ...props
   },
   ref
@@ -60,12 +45,10 @@ export const DrawerHeading = React.forwardRef<
           'govgr-drawer__close-container': true,
         })}
       >
-        {includeClose && (
-          <LinkBase className="govgr-drawer__close-icon">
-            {closeLabel}
-            {closeIcon}
-          </LinkBase>
-        )}
+        <Button className="govgr-drawer__close-icon" variant='link'>
+          {closeLabel}
+          <CloseIcon />
+        </Button>
       </div>
     </Base>
   );

package/src/DropdownBase/index.tsx

@@ -3,26 +3,32 @@ import clsx from 'clsx';
 import Base, { BaseProps } from '@digigov/react-core/Base';
 export interface DropdownBaseProps extends BaseProps<'details'> {
   /**
-   * align is optional. The default value is right.
-   * align prop adds DropdownBaseContent right or left.
-   */
+  * align is optional. The default value is right.
+  * align prop adds DropdownBaseContent right or left.
+  * @value 'right'
+  * @value 'left'
+  * @default 'left'
+  */
   align?: 'right' | 'left';
   /**
-   * placement is optional. The default value is bottom.
-   * placement prop adds DropdownBaseContent top or bottom.
-   */
+  * placement is optional. The default value is bottom.
+  * placement prop adds DropdownBaseContent top or bottom.
+  * @value 'top'
+  * @value 'bottom'
+  */
   placement?: 'top' | 'bottom';
   /**
-   * disabled is optional. The default value is false.
-   * disabled prop diables any action for DropdownBase component.
-   */
+  * disabled is optional. The default value is false.
+  * disabled prop diables any action for DropdownBase component.
+  * @value true
+  * @value false
+  */
   disabled?: boolean;
 }
 /**
  * DropdownBase is the main component for a dropdownBase.
  * Inside this component must be DropdownBaseButton and DropdownBaseContent components.
  */
-// eslint-disable-next-line react/display-name
 export const DropdownBase = React.forwardRef<
   HTMLDetailsElement,
   DropdownBaseProps

package/src/DropdownButton/index.tsx

@@ -4,28 +4,40 @@ import Base, { BaseProps } from '@digigov/react-core/Base';
 import { ArrowIcon } from '@digigov/react-icons';
 export interface DropdownButtonProps extends BaseProps<'summary'> {
   /**
-   * color is optional.
-   * 'primary' color gives DropdownButton the primary green color.
-   * 'secondary' color gives DropdownButton the secondary gray color.
-   * 'warning' color gives DropdownButton the warning red color.
-   * The default value is 'primary'.
-   */
+  * color is optional.
+  * 'primary' color gives DropdownButton the primary green color.
+  * 'secondary' color gives DropdownButton the secondary gray color.
+  * 'warning' color gives DropdownButton the warning red color.
+  * The default value is 'primary'.
+  * @value 'primary'
+  * @value 'secondary'
+  * @value 'warning'
+  * @default 'primary'
+  */
   color?: 'primary' | 'secondary' | 'warning';
   /**
-   * variant is optional.
-   * variant prop changes DropdownButton to button or link.
-   */
+  * variant is optional.
+  * variant prop changes DropdownButton to button or link.
+  * @value 'link'
+  * @value 'button'
+  * @default 'button'
+  */
   variant?: 'link' | 'button';
   /**
-   * arrow is optional.
-   * arrow prop adds checkIcon component inside DropdownButton.
-   * arrow prop is false by default
-   */
+  * arrow is optional.
+  * arrow prop adds checkIcon component inside DropdownButton.
+  * arrow prop is false by default
+  * @value true
+  * @value false
+  * @default false
+  */
   arrow?: boolean;
   /**
-   * underline is optional.
-   * Use this prop when you want to use Dropdown button as <th> header in sorted table.
-   */
+  * underline is optional.
+  * Use this prop when you want to use Dropdown button as <th> header in sorted table.
+  * @value true
+  * @value false
+  */
   underline?: boolean;
 }
 /**

package/src/ErrorSummary/index.tsx

@@ -1,24 +1,25 @@
 import React from 'react';
-import clsx from 'clsx';
-import Base, { BaseProps } from '@digigov/react-core/Base';
+import { BaseProps } from '@digigov/react-core/Base';
+import NotificationBannerContainer from '@digigov/react-core/NotificationBannerContainer';
+import NotificationBannerContent from '@digigov/react-core/NotificationBannerContent';
 
-export interface ErrorSummaryProps extends BaseProps<'div'> {}
+export interface ErrorSummaryProps extends BaseProps<'div'> { }
 /**
- * Use this component at the top of a page to summarise any errors a user has made.
+ * Use this component at the top of a page to summarize any errors a user has made.
  */
 export const ErrorSummary = React.forwardRef<HTMLDivElement, ErrorSummaryProps>(
   function ErrorSummary({ className, children, ...props }, ref) {
     return (
-      <Base
-        as="div"
+      <NotificationBannerContainer
+        variant={'error'}
+        className={className}
         ref={ref}
-        className={clsx(className, {
-          'govgr-error-summary': true,
-        })}
         {...props}
       >
-        {children}
-      </Base>
+        <NotificationBannerContent>
+          {children}
+        </NotificationBannerContent>
+      </NotificationBannerContainer>
     );
   }
 );

package/src/FieldContainer/index.tsx

@@ -4,8 +4,10 @@ import Grid, { GridProps } from '@digigov/react-core/Grid';
 
 export interface FieldContainerProps extends GridProps {
   /**
-   * error is optional.
-   */
+  * error is optional.
+  * @value true
+  * @value false
+  */
   error?: boolean;
 }
 /**

package/src/FieldsetLegend/index.tsx

@@ -4,15 +4,23 @@ import Base, { BaseProps } from '@digigov/react-core/Base';
 
 export interface FieldsetLegendProps extends BaseProps<'legend'> {
   /**
-   * size is optional. The default value is 'lg'
-   */
+  * size is optional. The default value is 'lg'
+  * @value 'xl'
+  * @value 'lg'
+  * @value 'md'
+  * @value 'sm'
+  * @default 'lg'
+  */
   size?: 'xl' | 'lg' | 'md' | 'sm';
 
   /**
-   * heading is optional.
-   * Add this prop if this Fieldset component is the only one in this page.
-   * The default value is false.
-   */
+  * heading is optional.
+  * Add this prop if this Fieldset component is the only one in this page.
+  * The default value is false.
+  * @value true
+  * @value false
+  * @default false
+  */
   heading?: boolean;
 }
 /**
@@ -26,23 +34,21 @@ export const FieldsetLegend = React.forwardRef<
   ref
 ) {
   return (
-    <>
-      <Base
-        as="legend"
-        ref={ref}
-        className={clsx(className, {
-          'govgr-fieldset__legend': true,
-          'govgr-heading-xl': size === 'xl',
-          'govgr-heading-lg': size === 'lg',
-          'govgr-heading-md': size === 'md',
-          'govgr-heading-sm': size === 'sm',
-        })}
-        {...(heading && { role: 'heading', 'aria-level': 1 })}
-        {...props}
-      >
-        {children}
-      </Base>
-    </>
+    <Base
+      as="legend"
+      ref={ref}
+      className={clsx(className, {
+        'govgr-fieldset__legend': true,
+        'govgr-heading-xl': size === 'xl',
+        'govgr-heading-lg': size === 'lg',
+        'govgr-heading-md': size === 'md',
+        'govgr-heading-sm': size === 'sm',
+      })}
+      {...(heading && { role: 'heading', 'aria-level': 1 })}
+      {...props}
+    >
+      {children}
+    </Base>
   );
 });
 

package/src/FileUpload/index.tsx

@@ -4,8 +4,11 @@ import Base, { BaseProps } from '@digigov/react-core/Base';
 
 export interface FileUploadProps extends BaseProps<'input'> {
   /**
-   * hasFiles is optional.
-   */
+  * hasFiles is optional.
+  * @value true
+  * @value false
+  * @default false
+  */
   hasFiles?: boolean;
 }
 /**

package/src/FileUploadContainer/index.tsx

@@ -4,8 +4,11 @@ import Base, { BaseProps } from '@digigov/react-core/Base';
 
 export interface FileUploadContainerProps extends BaseProps<'div'> {
   /**
-   * hasFiles is optional.
-   */
+  * hasFiles is optional.
+  * @value true
+  * @value false
+  * @default false
+  */
   hasUploadedFile?: boolean;
 }
 /**

package/src/FilterCloseButton/index.tsx

@@ -5,10 +5,11 @@ import { CloseIcon } from '@digigov/react-icons/CloseIcon';
 
 export interface FilterCloseButtonProps extends ButtonProps {
   /**
-   * closeIcon is optional.
-   * This declares the close icon.
-   * The default value is CloseIcon.
-   * */
+  * closeIcon is optional.
+  * This declares the close icon.
+  * The default value is CloseIcon.
+  * 
+  */
   closeIcon?: React.ReactNode;
 }
 /**

package/src/FilterOptionsSection/index.tsx

@@ -3,7 +3,11 @@ import clsx from 'clsx';
 import Base, { BaseProps } from '@digigov/react-core/Base';
 
 export interface FilterOptionsSectionProps extends BaseProps<'div'> {
-  horizontal?: boolean;
+  /**
+  * @value true
+  * @value false
+  */
+  horizontal?: boolean
 }
 /**
  * FilterOptionsSection is a wrapper component for the filter elements.

package/src/FilterSection/index.tsx

@@ -4,21 +4,33 @@ import Base, { BaseProps } from '@digigov/react-core/Base';
 
 export interface FilterSectionProps extends BaseProps<'div'> {
   /**
-   * Use open prop to open the filters when at mobile.
-   * The default value is false.
-   */
+  * Use open prop to open the filters when at mobile.
+  * The default value is false.
+  * @value true
+  * @value false
+  * @default false
+  */
   open?: boolean;
 
   /**
-   * Use border prop to add a gray border at the filters section.
-   * The default value is true.
-   */
+  * Use border prop to add a gray border at the filters section.
+  * The default value is true.
+  * @value true
+  * @value false
+  * @default true
+  */
   border?: boolean;
 
   /**
-   * Use visible prop to make the filter section have position relative in the page.
-   * The default value is md.
-   */
+  * Use visible prop to make the filter section have position relative in the page.
+  * The default value is md.
+  * @value 'always'
+  * @value 'sm'
+  * @value 'md'
+  * @value 'lg'
+  * @value 'never'
+  * @default 'md'
+  */
   positionRelative?: 'always' | 'sm' | 'md' | 'lg' | 'never';
 }
 

package/src/FilterSelectedSection/index.tsx

@@ -3,7 +3,11 @@ import clsx from 'clsx';
 import Base, { BaseProps } from '@digigov/react-core/Base';
 
 export interface FilterSelectedSectionProps extends BaseProps<'div'> {
-  indicator?: boolean;
+  /**
+  * @value true
+  * @value false
+  */
+  indicator?: boolean
 }
 /**
  * FilterSelectedSection is a wrapper for the area of the selected filters

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

@@ -4,10 +4,10 @@ exports[`renders the FooterContainer with no props 1`] = `
 <ForwardRef(FooterContainer)>
   <ForwardRef(Base)
     as="div"
-    className="govgr-width-container"
+    className="govgr-container"
   >
     <div
-      className="govgr-width-container"
+      className="govgr-container"
     >
       hello
     </div>

package/src/FooterContainer/index.tsx

@@ -4,11 +4,13 @@ import Base, { BaseProps } from '@digigov/react-core/Base';
 
 export interface FooterContainerProps extends BaseProps<'div'> {
   /**
-   * fullWidth is optional.
-   * fullWidth property is used to give full width to FooterContainer compoment.
-   * fullWidth property places the footer elements at the edges of the container.
-   * default value is false.
-   */
+  * fullWidth is optional.
+  * fullWidth property is used to give full width to FooterContainer component.
+  * fullWidth property places the footer elements at the edges of the container.
+  * @value true
+  * @value false
+  * @default false
+  */
   fullWidth?: boolean;
 }
 /**
@@ -26,8 +28,8 @@ export const FooterContainer = React.forwardRef<
       as="div"
       ref={ref}
       className={clsx(className, {
-        'govgr-width-container': fullWidth === false,
-        'govgr-full-width-container': fullWidth,
+        'govgr-container': true,
+        'govgr-container--full-width': fullWidth,
       })}
       {...props}
     >

package/src/FooterHeading/index.tsx

@@ -4,10 +4,13 @@ import Base, { BaseProps } from '@digigov/react-core/Base';
 
 export interface FooterHeadingProps extends BaseProps<'h2'> {
   /**
-   * size is optional.
-   * The values are: 'md' for medium, 'sm' for small.
-   * The default value is 'sm'.
-   */
+  * size is optional.
+  * The values are: 'md' for medium, 'sm' for small.
+  * The default value is 'sm'.
+  * @value 'md'
+  * @value 'sm'
+  * @default 'sm'
+  */
   size?: 'md' | 'sm';
 }
 /**

package/src/FooterList/index.tsx

@@ -4,9 +4,11 @@ import Base, { BaseProps } from '@digigov/react-core/Base';
 
 export interface FooterListProps extends BaseProps<'ul'> {
   /**
-   * columns is optional.
-   * The values for this are 1 and 2. The default value is 1.
-   */
+  * columns is optional.
+  * The values for this are 1 and 2. The default value is 1.
+  * @value 1
+  * @value 2
+  */
   columns?: 1 | 2;
 }
 /**

package/src/FooterMetaItem/index.tsx

@@ -4,9 +4,11 @@ import Base, { BaseProps } from '@digigov/react-core/Base';
 
 export interface FooterMetaItemProps extends BaseProps<'div'> {
   /**
-   * grow is optional.
-   * Use this prop If wanted this component to have it's maxinum grow.
-   */
+  * grow is optional.
+  * Use this prop If wanted this component to have it's maxinum grow.
+  * @value true
+  * @value false
+  */
   grow?: boolean;
 }
 /**

package/src/Form/index.tsx

@@ -3,7 +3,12 @@ import clsx from 'clsx';
 import Base, { BaseProps } from '@digigov/react-core/Base';
 
 export interface FormProps extends BaseProps<'form'> {
-  grid?: boolean;
+  /**
+  * @value true
+  * @value false
+  * @default false
+  */
+  grid?: boolean
 }
 /**
  * Use this inside the Content component for additional content