@digigov/react-core 0.24.0 → 0.25.1

package/src/HellenicRepublicLogo/index.tsx

@@ -7,11 +7,6 @@ import logoElInverted from '@digigov/react-core/HellenicRepublicLogo/logo-invert
 import logoEnInverted from '@digigov/react-core/HellenicRepublicLogo/logo-inverted-en';
 
 export interface HellenicRepublicLogoProps extends BaseProps<'img'> {
-  /**
-   * src is optional.
-   * By default, the src is the official logo of the Hellenic Republic uploaded to the government.gov.gr site.
-   */
-  src?: string;
   /**
    * lang is optional.
    * Use this to define the language version of the logo. Default is el.
@@ -30,30 +25,30 @@ export const HellenicRepublicLogo = React.forwardRef<
   const logoInverted = lang === 'en' ? logoEnInverted : logoElInverted;
   return (
     <>
-    <Base
-      as="img"
-      src={logo}
-      ref={ref}
-      className={clsx(className, {
-        'govgr-footer__government-logo': true,
-      })}
-      {...props}
-      alt="Hellenic Republic Logo"
-    >
-      {children}
-    </Base>
-    <Base
-      as="img"
-      src={logoInverted}
-      ref={ref}
-      className={clsx(className, {
-        'govgr-footer__government-logo-inverted': true,
-      })}
-      {...props}
-      alt="Hellenic Republic Logo"
-    >
-      {children}
-    </Base>
+      <Base
+        as="img"
+        src={logo}
+        ref={ref}
+        className={clsx(className, {
+          'govgr-footer__government-logo': true,
+        })}
+        {...props}
+        alt="Hellenic Republic Logo"
+      >
+        {children}
+      </Base>
+      <Base
+        as="img"
+        src={logoInverted}
+        ref={ref}
+        className={clsx(className, {
+          'govgr-footer__government-logo-inverted': true,
+        })}
+        {...props}
+        alt="Hellenic Republic Logo"
+      >
+        {children}
+      </Base>
     </>
   );
 });

package/src/Hidden/index.tsx

@@ -3,7 +3,6 @@ import Base, { BaseProps } from '@digigov/react-core/Base';
 import clsx from 'clsx';
 
 export interface HiddenProps extends BaseProps<'div'> {
-  ref?: React.Ref<HTMLDivElement>;
   lgUp?: boolean;
   mdUp?: boolean;
   smUp?: boolean;

package/src/MoreVertIcon/index.tsx

@@ -1,14 +1,7 @@
 import React from 'react';
 import SvgIcon, { SvgIconProps } from '@digigov/react-core/SvgIcon';
 import clsx from 'clsx';
-export interface MoreVertIconProps extends SvgIconProps {
-  /**
-   * ref is optional.
-   * ref prop declares the reference of the svg icon component.
-   * It can be used to to access the DOM element and the React element.
-   */
-  ref?: React.Ref<SVGSVGElement>;
-}
+export interface MoreVertIconProps extends SvgIconProps {}
 /**
  * Use MoreVertIcon component when you need to show more options.
  */

package/src/NavListItemLink/index.tsx

@@ -10,11 +10,6 @@ export interface NavListItemLinkProps extends BaseProps<'a'> {
    *
    */
   active?: boolean;
-  /**
-   * href prop is used to navigate to current url page.
-   * href is optional.
-   */
-  href?: string;
 }
 /**
  * NavListItemLink is an <a> element. It should be inside the NavListItem component.

package/src/NotificationBannerLink/index.tsx

@@ -2,12 +2,7 @@ import React from 'react';
 import Base, { BaseProps } from '@digigov/react-core/Base';
 import clsx from 'clsx';
 
-export interface NotificationBannerLinkProps extends BaseProps<'a'> {
-  /**
-   * href is optional.
-   */
-  href?: string;
-}
+export interface NotificationBannerLinkProps extends BaseProps<'a'> {}
 /**
  * Details for the NotificationBannerLink.
  * NotificationBannerLink allow users to click their way from page to page.
@@ -17,7 +12,7 @@ export const NotificationBannerLink = React.forwardRef<
   HTMLAnchorElement,
   NotificationBannerLinkProps
 >(function NotificationBannerLink(
-  { href = '#', className, children, ...props },
+  { className, href = '#', children, ...props },
   ref
 ) {
   return (

package/src/PhaseBannerHeaderContainer/index.tsx

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

package/src/RadioConditional/index.tsx

@@ -1,5 +1,7 @@
 import React from 'react';
 import Base, { BaseProps } from '@digigov/react-core/Base';
+import LabelContainer from '@digigov/react-core/LabelContainer';
+import FieldContainer from '@digigov/react-core/FieldContainer';
 import clsx from 'clsx';
 
 export interface RadioConditionalProps extends BaseProps<'div'> {}
@@ -21,19 +23,9 @@ export const RadioConditional = React.forwardRef<
       })}
       {...props}
     >
-      <div
-        className={clsx({
-          'govgr-field': true,
-        })}
-      >
-        <label
-          className={clsx({
-            'govgr-label': true,
-          })}
-        >
-          {children}
-        </label>
-      </div>
+      <FieldContainer>
+        <LabelContainer>{children}</LabelContainer>
+      </FieldContainer>
     </Base>
   );
 });

package/src/RadioItem/index.tsx

@@ -1,23 +1,9 @@
 import React from 'react';
 import Base, { BaseProps } from '@digigov/react-core/Base';
+import LabelContainer from '@digigov/react-core/LabelContainer';
 import clsx from 'clsx';
 
-export interface RadioItemProps extends BaseProps<'input'> {
-  /**
-   *Name property is optional and it contains a single value which describes the name of the <input> element.
-   */
-  name?: string;
-
-  /**
-   * Value property is optional and it specifies the value of an <input> element.
-   */
-  value?: string;
-  /**
-   * disabled prop disables the radio input.
-   * disabled property is optional and it is false by default.
-   */
-  disabled?: boolean;
-}
+export interface RadioItemProps extends BaseProps<'input'> {}
 /**
  * RadioItem component is used for display radio buttons.
  * RadioItem component must be included inside Radio component, as a children component.
@@ -33,9 +19,9 @@ export const RadioItem = React.forwardRef<HTMLInputElement, RadioItemProps>(
           'govgr-radios__item': true,
         })}
       >
-        <label
+        <LabelContainer
           className={clsx({
-            'govgr-label govgr-radios__label': true,
+            'govgr-radios__label': true,
             'govgr-radios__label--disabled': disabled === true,
           })}
         >
@@ -52,7 +38,7 @@ export const RadioItem = React.forwardRef<HTMLInputElement, RadioItemProps>(
             disabled={disabled}
             {...props}
           />
-        </label>
+        </LabelContainer>
       </div>
     );
   }

package/src/SelectContainer/index.tsx

@@ -2,12 +2,7 @@ import React from 'react';
 import Base, { BaseProps } from '@digigov/react-core/Base';
 import clsx from 'clsx';
 
-export interface SelectContainerProps extends BaseProps<'select'> {
-  /**
-   * name is optional but strongly recommended.
-   */
-  name?: string;
-}
+export interface SelectContainerProps extends BaseProps<'select'> {}
 /**
  * The SelectContainer component allows users to choose an option from a long list.
  * It is used as a parent component to wrap SelectOption component.

package/src/SelectOption/index.tsx

@@ -2,17 +2,7 @@ import React from 'react';
 import Base, { BaseProps } from '@digigov/react-core/Base';
 import clsx from 'clsx';
 
-export interface SelectOptionProps extends BaseProps<'option'> {
-  /**
-   * value is optional.
-   */
-  value?: string;
-
-  /**
-   * selected is optional.
-   */
-  selected?: boolean;
-}
+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/SingleCharacterInputItem/index.tsx

@@ -3,11 +3,6 @@ import Base, { BaseProps } from '@digigov/react-core/Base';
 import clsx from 'clsx';
 
 export interface SingleCharacterInputItemProps extends BaseProps<'input'> {
-  /**
-   * Name property is optional
-   * Name prop contains a single value which describes the name of the <input> element.
-   */
-  name?: string;
   /**
    * error is optional. The default value is false.
    * Use this prop when there is an error at the input.

package/src/SkipLink/index.tsx

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

package/src/Table/index.tsx

@@ -28,6 +28,12 @@ export interface TableProps extends BaseProps<'table'> {
    * Default value is false.
    */
   verticalBorders?: boolean;
+  /**
+   * stacked is optional.
+   * The stacked prop gives responsiveness to the table. If used, make sure to add "data-label" to TableDataCell components.
+   * Default value is never.
+   */
+  stacked?: 'always' | 's' | 'm' | 'never';
 }
 /**
  * Table component is used to wrap the sub components of a table
@@ -39,6 +45,7 @@ export const Table = React.forwardRef<HTMLTableElement, TableProps>(
       zebra = false,
       dense = false,
       verticalBorders = false,
+      stacked= 'never',
       className,
       children,
       ...props
@@ -51,6 +58,9 @@ export const Table = React.forwardRef<HTMLTableElement, TableProps>(
         ref={ref}
         className={clsx(className, {
           'govgr-table': true,
+          'govgr-table--stacked-always': stacked === 'always',
+          'govgr-table--stacked-s': stacked === 's',
+          'govgr-table--stacked-m': stacked == 'm',
           'govgr-table--dark': variant === 'dark',
           'govgr-table--light': variant === 'light',
           'govgr-table--zebra': zebra === true,

package/src/TabsListItem/index.tsx

@@ -9,11 +9,6 @@ export interface TabsListItemProps extends BaseProps<'a'> {
    * This declares that this tab is selected.
    */
   selected?: boolean;
-
-  /**
-   * href is optional.
-   */
-  href?: string;
 }
 /**
  * TabsListItem should be inside the TabsList.

package/src/TextArea/index.tsx

@@ -3,16 +3,6 @@ import Base, { BaseProps } from '@digigov/react-core/Base';
 import clsx from 'clsx';
 
 export interface TextAreaProps extends BaseProps<'textarea'> {
-  /**
-   * name is optional but strongly recommended.
-   */
-  name?: string;
-
-  /**
-   * row is optional. The default value is 6.
-   */
-  rows?: 4 | 5 | 6 | 7 | 8;
-
   /**
    * error is optional. The default value is false.
    * Use this prop when there is an error at the input.

package/src/TextInput/index.tsx

@@ -3,11 +3,6 @@ import Base, { BaseProps } from '@digigov/react-core/Base';
 import clsx from 'clsx';
 
 export interface TextInputProps extends BaseProps<'input'> {
-  /**
-   * name is optional but strongly recommended.
-   */
-  name?: string;
-
   /**
    * characterWidth is optional.
    */

package/src/UncheckIcon/index.tsx

@@ -1,14 +1,7 @@
 import React from 'react';
 import SvgIcon, { SvgIconProps } from '@digigov/react-core/SvgIcon';
 import clsx from 'clsx';
-export interface UncheckIconProps extends SvgIconProps {
-  /**
-   * ref is optional.
-   * ref prop declares the reference of the svg icon component.
-   * It can be used to to access the DOM element and the React element.
-   */
-  ref?: React.Ref<SVGSVGElement>;
-}
+export interface UncheckIconProps extends SvgIconProps {}
 /**
  * Use UnUncheckIcon component when you need a uncheck/decline icon.
  */