@digigov/react-core 1.0.0-6b93ebf2 → 1.0.0-88820b1e

package/registry.js

@@ -45,7 +45,7 @@ var _digigov_react_core_AdminContainer = _interopRequireWildcard(require("@digig
 
 var _digigov_react_core_AdminHeader = _interopRequireWildcard(require("@digigov/react-core/AdminHeader"));
 
-var _digigov_react_core_AdminHeaderSection = _interopRequireWildcard(require("@digigov/react-core/AdminHeaderSection"));
+var _digigov_react_core_AdminHeaderContent = _interopRequireWildcard(require("@digigov/react-core/AdminHeaderContent"));
 
 var _digigov_react_core_AdminLayout = _interopRequireWildcard(require("@digigov/react-core/AdminLayout"));
 
@@ -117,18 +117,18 @@ var _digigov_react_core_CheckboxItem = _interopRequireWildcard(require("@digigov
 
 var _digigov_react_core_Chip = _interopRequireWildcard(require("@digigov/react-core/Chip"));
 
+var _digigov_react_core_ChipContainer = _interopRequireWildcard(require("@digigov/react-core/ChipContainer"));
+
 var _digigov_react_core_ChipHeading = _interopRequireWildcard(require("@digigov/react-core/ChipHeading"));
 
 var _digigov_react_core_ChipKeyValue = _interopRequireWildcard(require("@digigov/react-core/ChipKeyValue"));
 
-var _digigov_react_core_ChipSection = _interopRequireWildcard(require("@digigov/react-core/ChipSection"));
-
-var _digigov_react_core_ChipSectionWrapper = _interopRequireWildcard(require("@digigov/react-core/ChipSectionWrapper"));
-
 var _digigov_react_core_ChoiceDividerText = _interopRequireWildcard(require("@digigov/react-core/ChoiceDividerText"));
 
 var _digigov_react_core_CircularProgress = _interopRequireWildcard(require("@digigov/react-core/CircularProgress"));
 
+var _digigov_react_core_CloseButton = _interopRequireWildcard(require("@digigov/react-core/CloseButton"));
+
 var _digigov_react_core_Container = _interopRequireWildcard(require("@digigov/react-core/Container"));
 
 var _digigov_react_core_CopyrightContainer = _interopRequireWildcard(require("@digigov/react-core/CopyrightContainer"));
@@ -151,8 +151,6 @@ var _digigov_react_core_Drawer = _interopRequireWildcard(require("@digigov/react
 
 var _digigov_react_core_DrawerHeading = _interopRequireWildcard(require("@digigov/react-core/DrawerHeading"));
 
-var _digigov_react_core_DropdownArrowDown = _interopRequireWildcard(require("@digigov/react-core/DropdownArrowDown"));
-
 var _digigov_react_core_DropdownBase = _interopRequireWildcard(require("@digigov/react-core/DropdownBase"));
 
 var _digigov_react_core_DropdownButton = _interopRequireWildcard(require("@digigov/react-core/DropdownButton"));
@@ -175,16 +173,14 @@ var _digigov_react_core_FileUploadContainer = _interopRequireWildcard(require("@
 
 var _digigov_react_core_FillableText = _interopRequireWildcard(require("@digigov/react-core/FillableText"));
 
-var _digigov_react_core_FilterCloseButton = _interopRequireWildcard(require("@digigov/react-core/FilterCloseButton"));
+var _digigov_react_core_FilterContainer = _interopRequireWildcard(require("@digigov/react-core/FilterContainer"));
 
 var _digigov_react_core_FilterContent = _interopRequireWildcard(require("@digigov/react-core/FilterContent"));
 
-var _digigov_react_core_FilterHeading = _interopRequireWildcard(require("@digigov/react-core/FilterHeading"));
+var _digigov_react_core_FilterHeadingContainer = _interopRequireWildcard(require("@digigov/react-core/FilterHeadingContainer"));
 
 var _digigov_react_core_FilterOptionsSection = _interopRequireWildcard(require("@digigov/react-core/FilterOptionsSection"));
 
-var _digigov_react_core_FilterSection = _interopRequireWildcard(require("@digigov/react-core/FilterSection"));
-
 var _digigov_react_core_FilterSelectedHeading = _interopRequireWildcard(require("@digigov/react-core/FilterSelectedHeading"));
 
 var _digigov_react_core_FilterSelectedSection = _interopRequireWildcard(require("@digigov/react-core/FilterSelectedSection"));
@@ -201,9 +197,9 @@ var _digigov_react_core_FooterHeading = _interopRequireWildcard(require("@digigo
 
 var _digigov_react_core_FooterImage = _interopRequireWildcard(require("@digigov/react-core/FooterImage"));
 
-var _digigov_react_core_FooterInlineList = _interopRequireWildcard(require("@digigov/react-core/FooterInlineList"));
+var _digigov_react_core_FooterInfo = _interopRequireWildcard(require("@digigov/react-core/FooterInfo"));
 
-var _digigov_react_core_FooterInlineListItem = _interopRequireWildcard(require("@digigov/react-core/FooterInlineListItem"));
+var _digigov_react_core_FooterInfoSection = _interopRequireWildcard(require("@digigov/react-core/FooterInfoSection"));
 
 var _digigov_react_core_FooterLink = _interopRequireWildcard(require("@digigov/react-core/FooterLink"));
 
@@ -211,13 +207,9 @@ var _digigov_react_core_FooterList = _interopRequireWildcard(require("@digigov/r
 
 var _digigov_react_core_FooterListItem = _interopRequireWildcard(require("@digigov/react-core/FooterListItem"));
 
-var _digigov_react_core_FooterMeta = _interopRequireWildcard(require("@digigov/react-core/FooterMeta"));
-
-var _digigov_react_core_FooterMetaItem = _interopRequireWildcard(require("@digigov/react-core/FooterMetaItem"));
-
 var _digigov_react_core_FooterNavigation = _interopRequireWildcard(require("@digigov/react-core/FooterNavigation"));
 
-var _digigov_react_core_FooterSection = _interopRequireWildcard(require("@digigov/react-core/FooterSection"));
+var _digigov_react_core_FooterNavigationSection = _interopRequireWildcard(require("@digigov/react-core/FooterNavigationSection"));
 
 var _digigov_react_core_Form = _interopRequireWildcard(require("@digigov/react-core/Form"));
 
@@ -351,6 +343,10 @@ var _digigov_react_core_NotificationBannerHeading = _interopRequireWildcard(requ
 
 var _digigov_react_core_NotificationBannerLink = _interopRequireWildcard(require("@digigov/react-core/NotificationBannerLink"));
 
+var _digigov_react_core_PageTitleCaption = _interopRequireWildcard(require("@digigov/react-core/PageTitleCaption"));
+
+var _digigov_react_core_PageTitleContainer = _interopRequireWildcard(require("@digigov/react-core/PageTitleContainer"));
+
 var _digigov_react_core_PageTitleHeading = _interopRequireWildcard(require("@digigov/react-core/PageTitleHeading"));
 
 var _digigov_react_core_Pagination = _interopRequireWildcard(require("@digigov/react-core/Pagination"));
@@ -391,7 +387,7 @@ var _digigov_react_core_ResultsHeadingActions = _interopRequireWildcard(require(
 
 var _digigov_react_core_SearchButton = _interopRequireWildcard(require("@digigov/react-core/SearchButton"));
 
-var _digigov_react_core_SearchSection = _interopRequireWildcard(require("@digigov/react-core/SearchSection"));
+var _digigov_react_core_SearchContainer = _interopRequireWildcard(require("@digigov/react-core/SearchContainer"));
 
 var _digigov_react_core_Section = _interopRequireWildcard(require("@digigov/react-core/Section"));
 
@@ -401,12 +397,14 @@ var _digigov_react_core_SelectContainer = _interopRequireWildcard(require("@digi
 
 var _digigov_react_core_SelectOption = _interopRequireWildcard(require("@digigov/react-core/SelectOption"));
 
-var _digigov_react_core_SingleCharacterInputContainer = _interopRequireWildcard(require("@digigov/react-core/SingleCharacterInputContainer"));
+var _digigov_react_core_SingleCharacterInput = _interopRequireWildcard(require("@digigov/react-core/SingleCharacterInput"));
 
-var _digigov_react_core_SingleCharacterInputItem = _interopRequireWildcard(require("@digigov/react-core/SingleCharacterInputItem"));
+var _digigov_react_core_SingleCharacterInputs = _interopRequireWildcard(require("@digigov/react-core/SingleCharacterInputs"));
 
 var _digigov_react_core_SkipLink = _interopRequireWildcard(require("@digigov/react-core/SkipLink"));
 
+var _digigov_react_core_Stack = _interopRequireWildcard(require("@digigov/react-core/Stack"));
+
 var _digigov_react_core_StepNav = _interopRequireWildcard(require("@digigov/react-core/StepNav"));
 
 var _digigov_react_core_StepNavAccordion = _interopRequireWildcard(require("@digigov/react-core/StepNavAccordion"));
@@ -499,6 +497,8 @@ var _digigov_react_core_TimelineItem = _interopRequireWildcard(require("@digigov
 
 var _digigov_react_core_Top = _interopRequireWildcard(require("@digigov/react-core/Top"));
 
+var _digigov_react_core_Typography = _interopRequireWildcard(require("@digigov/react-core/Typography"));
+
 var _digigov_react_core_Unpurge = _interopRequireWildcard(require("@digigov/react-core/Unpurge"));
 
 var _digigov_react_core_VisuallyHidden = _interopRequireWildcard(require("@digigov/react-core/VisuallyHidden"));
@@ -544,7 +544,7 @@ var _default = {
   '@digigov/react-core/AdminAside': lazyImport(_digigov_react_core_AdminAside),
   '@digigov/react-core/AdminContainer': lazyImport(_digigov_react_core_AdminContainer),
   '@digigov/react-core/AdminHeader': lazyImport(_digigov_react_core_AdminHeader),
-  '@digigov/react-core/AdminHeaderSection': lazyImport(_digigov_react_core_AdminHeaderSection),
+  '@digigov/react-core/AdminHeaderContent': lazyImport(_digigov_react_core_AdminHeaderContent),
   '@digigov/react-core/AdminLayout': lazyImport(_digigov_react_core_AdminLayout),
   '@digigov/react-core/AdminMain': lazyImport(_digigov_react_core_AdminMain),
   '@digigov/react-core/AdminTopSection': lazyImport(_digigov_react_core_AdminTopSection),
@@ -580,12 +580,12 @@ var _default = {
   '@digigov/react-core/CheckboxConditional': lazyImport(_digigov_react_core_CheckboxConditional),
   '@digigov/react-core/CheckboxItem': lazyImport(_digigov_react_core_CheckboxItem),
   '@digigov/react-core/Chip': lazyImport(_digigov_react_core_Chip),
+  '@digigov/react-core/ChipContainer': lazyImport(_digigov_react_core_ChipContainer),
   '@digigov/react-core/ChipHeading': lazyImport(_digigov_react_core_ChipHeading),
   '@digigov/react-core/ChipKeyValue': lazyImport(_digigov_react_core_ChipKeyValue),
-  '@digigov/react-core/ChipSection': lazyImport(_digigov_react_core_ChipSection),
-  '@digigov/react-core/ChipSectionWrapper': lazyImport(_digigov_react_core_ChipSectionWrapper),
   '@digigov/react-core/ChoiceDividerText': lazyImport(_digigov_react_core_ChoiceDividerText),
   '@digigov/react-core/CircularProgress': lazyImport(_digigov_react_core_CircularProgress),
+  '@digigov/react-core/CloseButton': lazyImport(_digigov_react_core_CloseButton),
   '@digigov/react-core/Container': lazyImport(_digigov_react_core_Container),
   '@digigov/react-core/CopyrightContainer': lazyImport(_digigov_react_core_CopyrightContainer),
   '@digigov/react-core/CopyToClipboardContainer': lazyImport(_digigov_react_core_CopyToClipboardContainer),
@@ -597,7 +597,6 @@ var _default = {
   '@digigov/react-core/DetailsSummary': lazyImport(_digigov_react_core_DetailsSummary),
   '@digigov/react-core/Drawer': lazyImport(_digigov_react_core_Drawer),
   '@digigov/react-core/DrawerHeading': lazyImport(_digigov_react_core_DrawerHeading),
-  '@digigov/react-core/DropdownArrowDown': lazyImport(_digigov_react_core_DropdownArrowDown),
   '@digigov/react-core/DropdownBase': lazyImport(_digigov_react_core_DropdownBase),
   '@digigov/react-core/DropdownButton': lazyImport(_digigov_react_core_DropdownButton),
   '@digigov/react-core/DropdownContent': lazyImport(_digigov_react_core_DropdownContent),
@@ -609,11 +608,10 @@ var _default = {
   '@digigov/react-core/FileUpload': lazyImport(_digigov_react_core_FileUpload),
   '@digigov/react-core/FileUploadContainer': lazyImport(_digigov_react_core_FileUploadContainer),
   '@digigov/react-core/FillableText': lazyImport(_digigov_react_core_FillableText),
-  '@digigov/react-core/FilterCloseButton': lazyImport(_digigov_react_core_FilterCloseButton),
+  '@digigov/react-core/FilterContainer': lazyImport(_digigov_react_core_FilterContainer),
   '@digigov/react-core/FilterContent': lazyImport(_digigov_react_core_FilterContent),
-  '@digigov/react-core/FilterHeading': lazyImport(_digigov_react_core_FilterHeading),
+  '@digigov/react-core/FilterHeadingContainer': lazyImport(_digigov_react_core_FilterHeadingContainer),
   '@digigov/react-core/FilterOptionsSection': lazyImport(_digigov_react_core_FilterOptionsSection),
-  '@digigov/react-core/FilterSection': lazyImport(_digigov_react_core_FilterSection),
   '@digigov/react-core/FilterSelectedHeading': lazyImport(_digigov_react_core_FilterSelectedHeading),
   '@digigov/react-core/FilterSelectedSection': lazyImport(_digigov_react_core_FilterSelectedSection),
   '@digigov/react-core/Footer': lazyImport(_digigov_react_core_Footer),
@@ -622,15 +620,13 @@ var _default = {
   '@digigov/react-core/FooterContentLogos': lazyImport(_digigov_react_core_FooterContentLogos),
   '@digigov/react-core/FooterHeading': lazyImport(_digigov_react_core_FooterHeading),
   '@digigov/react-core/FooterImage': lazyImport(_digigov_react_core_FooterImage),
-  '@digigov/react-core/FooterInlineList': lazyImport(_digigov_react_core_FooterInlineList),
-  '@digigov/react-core/FooterInlineListItem': lazyImport(_digigov_react_core_FooterInlineListItem),
+  '@digigov/react-core/FooterInfo': lazyImport(_digigov_react_core_FooterInfo),
+  '@digigov/react-core/FooterInfoSection': lazyImport(_digigov_react_core_FooterInfoSection),
   '@digigov/react-core/FooterLink': lazyImport(_digigov_react_core_FooterLink),
   '@digigov/react-core/FooterList': lazyImport(_digigov_react_core_FooterList),
   '@digigov/react-core/FooterListItem': lazyImport(_digigov_react_core_FooterListItem),
-  '@digigov/react-core/FooterMeta': lazyImport(_digigov_react_core_FooterMeta),
-  '@digigov/react-core/FooterMetaItem': lazyImport(_digigov_react_core_FooterMetaItem),
   '@digigov/react-core/FooterNavigation': lazyImport(_digigov_react_core_FooterNavigation),
-  '@digigov/react-core/FooterSection': lazyImport(_digigov_react_core_FooterSection),
+  '@digigov/react-core/FooterNavigationSection': lazyImport(_digigov_react_core_FooterNavigationSection),
   '@digigov/react-core/Form': lazyImport(_digigov_react_core_Form),
   '@digigov/react-core/FullPageBackground': lazyImport(_digigov_react_core_FullPageBackground),
   '@digigov/react-core/GovGRLogo/govgr-logo-blue-base64': lazyImport(_digigov_react_core_GovGRLogo_govgr_logo_blue_base64),
@@ -697,6 +693,8 @@ var _default = {
   '@digigov/react-core/NotificationBannerHeader': lazyImport(_digigov_react_core_NotificationBannerHeader),
   '@digigov/react-core/NotificationBannerHeading': lazyImport(_digigov_react_core_NotificationBannerHeading),
   '@digigov/react-core/NotificationBannerLink': lazyImport(_digigov_react_core_NotificationBannerLink),
+  '@digigov/react-core/PageTitleCaption': lazyImport(_digigov_react_core_PageTitleCaption),
+  '@digigov/react-core/PageTitleContainer': lazyImport(_digigov_react_core_PageTitleContainer),
   '@digigov/react-core/PageTitleHeading': lazyImport(_digigov_react_core_PageTitleHeading),
   '@digigov/react-core/Pagination': lazyImport(_digigov_react_core_Pagination),
   '@digigov/react-core/PaginationLabelContainer': lazyImport(_digigov_react_core_PaginationLabelContainer),
@@ -717,14 +715,15 @@ var _default = {
   '@digigov/react-core/ResultsHeading': lazyImport(_digigov_react_core_ResultsHeading),
   '@digigov/react-core/ResultsHeadingActions': lazyImport(_digigov_react_core_ResultsHeadingActions),
   '@digigov/react-core/SearchButton': lazyImport(_digigov_react_core_SearchButton),
-  '@digigov/react-core/SearchSection': lazyImport(_digigov_react_core_SearchSection),
+  '@digigov/react-core/SearchContainer': lazyImport(_digigov_react_core_SearchContainer),
   '@digigov/react-core/Section': lazyImport(_digigov_react_core_Section),
   '@digigov/react-core/SectionBreak': lazyImport(_digigov_react_core_SectionBreak),
   '@digigov/react-core/SelectContainer': lazyImport(_digigov_react_core_SelectContainer),
   '@digigov/react-core/SelectOption': lazyImport(_digigov_react_core_SelectOption),
-  '@digigov/react-core/SingleCharacterInputContainer': lazyImport(_digigov_react_core_SingleCharacterInputContainer),
-  '@digigov/react-core/SingleCharacterInputItem': lazyImport(_digigov_react_core_SingleCharacterInputItem),
+  '@digigov/react-core/SingleCharacterInput': lazyImport(_digigov_react_core_SingleCharacterInput),
+  '@digigov/react-core/SingleCharacterInputs': lazyImport(_digigov_react_core_SingleCharacterInputs),
   '@digigov/react-core/SkipLink': lazyImport(_digigov_react_core_SkipLink),
+  '@digigov/react-core/Stack': lazyImport(_digigov_react_core_Stack),
   '@digigov/react-core/StepNav': lazyImport(_digigov_react_core_StepNav),
   '@digigov/react-core/StepNavAccordion': lazyImport(_digigov_react_core_StepNavAccordion),
   '@digigov/react-core/StepNavAccordionContent': lazyImport(_digigov_react_core_StepNavAccordionContent),
@@ -771,6 +770,7 @@ var _default = {
   '@digigov/react-core/TimelineHeading': lazyImport(_digigov_react_core_TimelineHeading),
   '@digigov/react-core/TimelineItem': lazyImport(_digigov_react_core_TimelineItem),
   '@digigov/react-core/Top': lazyImport(_digigov_react_core_Top),
+  '@digigov/react-core/Typography': lazyImport(_digigov_react_core_Typography),
   '@digigov/react-core/Unpurge': lazyImport(_digigov_react_core_Unpurge),
   '@digigov/react-core/VisuallyHidden': lazyImport(_digigov_react_core_VisuallyHidden),
   '@digigov/react-core/WarningText': lazyImport(_digigov_react_core_WarningText)

package/src/AccessibilityMenuButton/index.tsx

@@ -24,7 +24,7 @@ export const AccessibilityMenuButton = React.forwardRef<
       })}
       {...props}
     >
-      <AccessibilityIcon size="xl" />
+      <AccessibilityIcon size="lg" />
       {children}
     </Base>
   );

package/src/Accordion/index.tsx

@@ -2,19 +2,53 @@ import React from 'react';
 import clsx from 'clsx';
 import Base, { BaseProps } from '@digigov/react-core/Base';
 
-export interface AccordionProps extends BaseProps<'div'> {}
+export interface AccordionProps extends BaseProps<'div'> {
+  /*
+  * horizontalBorders is optional.
+  * If 'none', Accordion will have no borders.
+  * If 'top', Accordion will have a border on top.
+  * If 'bottom', Accordion will have a border on bottom.
+  * @value none
+  * @value top
+  * @value bottom
+  * @default top
+  */
+  horizontalBorders?: 'none' | 'top' | 'bottom';
+  /**
+   * summaryColor is optional.
+   * 'primary' color gives AccordionSectionSummary the default color.
+   * 'secondary' color gives AccordionSectionSummary a gray background.
+   * @value primary
+   * @value secondary
+   * @default primary
+   * */
+  summaryColor?: 'primary' | 'secondary';
+  /**
+   * dense is optional.
+   * If true, AccordionSection will have a smaller padding.
+   * @value true
+   * @value false
+   * @default false
+   * */
+  dense?: boolean;
+}
 /**
  * Accordion is the main component for an accordion.
  * Inside this component must be a list of AccordionSection components.
  */
 export const Accordion = React.forwardRef<HTMLDivElement, AccordionProps>(
-  function Accordion({ className, children, ...props }, ref) {
+  function Accordion({ className, horizontalBorders = 'top', summaryColor = 'primary', dense, children, ...props }, ref) {
     return (
       <Base
         as="div"
         ref={ref}
         className={clsx(className, {
           'govgr-accordion': true,
+          'govgr-accordion--no-border': horizontalBorders === 'none',
+          'govgr-accordion--border-top': horizontalBorders === 'top',
+          'govgr-accordion--border-bottom': horizontalBorders === 'bottom',
+          'govgr-accordion--dense': dense,
+          'govgr-accordion--secondary': summaryColor === 'secondary',
         })}
         {...props}
       >

package/src/AccordionSection/index.tsx

@@ -1,16 +1,7 @@
 import React from 'react';
 import clsx from 'clsx';
 import Base, { BaseProps } from '@digigov/react-core/Base';
-export interface AccordionSectionProps extends BaseProps<'details'> {
-  /*
-  * border is optional. The default value is true.
-  * In order to remove top and bottom border, change this value to false.
-  * @value true
-  * @value false
-  * @default true
-  */
-  border?: boolean;
-}
+export interface AccordionSectionProps extends BaseProps<'details'> { }
 /**
  * AccordionSection should be inside the Accordion component.
  *
@@ -20,7 +11,7 @@ export const AccordionSection = React.forwardRef<
   HTMLDetailsElement,
   AccordionSectionProps
 >(function AccordionSection(
-  { className, border = true, children, ...props },
+  { className, children, ...props },
   ref
 ) {
   return (
@@ -29,7 +20,6 @@ export const AccordionSection = React.forwardRef<
       ref={ref}
       className={clsx(className, {
         'govgr-accordion__section': true,
-        'govgr-accordion__section--no-border': !border,
       })}
       {...props}
     >

package/src/AccordionSectionSummary/index.tsx

@@ -2,14 +2,17 @@ import React from 'react';
 import clsx from 'clsx';
 import Base, { BaseProps } from '@digigov/react-core/Base';
 
-export interface AccordionSectionSummaryProps extends BaseProps<'summary'> {}
+export interface AccordionSectionSummaryProps extends BaseProps<'summary'> { }
 /**
  * AccordionSectionSummary is used as a wrapper component for AccordionSectionSummaryHeading.
  */
 export const AccordionSectionSummary = React.forwardRef<
   HTMLDivElement,
   AccordionSectionSummaryProps
->(function AccordionSectionSummary({ className, children, ...props }, ref) {
+>(function AccordionSectionSummary(
+  { className, children, ...props },
+  ref
+) {
   return (
     <Base
       as="summary"

package/src/AdminHeaderContent/__snapshots__/index.spec.tsx.snap

@@ -0,0 +1,16 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`renders the AdminHeaderContent with no props 1`] = `
+<ForwardRef(AdminHeaderContent)>
+  <ForwardRef(Base)
+    as="div"
+    className="govgr-admin-header__content"
+  >
+    <div
+      className="govgr-admin-header__content"
+    >
+      hello
+    </div>
+  </ForwardRef(Base)>
+</ForwardRef(AdminHeaderContent)>
+`;

package/src/AdminHeaderContent/index.spec.tsx

@@ -0,0 +1,10 @@
+import React from 'react';
+import { mount } from 'enzyme';
+
+import AdminHeaderContent from '@digigov/react-core/AdminHeaderContent';
+
+it('renders the AdminHeaderContent with no props', () => {
+  expect(
+    mount(<AdminHeaderContent>hello</AdminHeaderContent>)
+  ).toMatchSnapshot();
+});

package/src/AdminHeaderContent/index.tsx

@@ -0,0 +1,27 @@
+import React from 'react';
+import clsx from 'clsx';
+import Base, { BaseProps } from '@digigov/react-core/Base';
+
+export interface AdminHeaderContentProps extends BaseProps<'div'> {}
+/**
+ * AdminAdminHeaderContent is used inside AdminHeader as a container for its items.
+ */
+export const AdminHeaderContent = React.forwardRef<
+  HTMLDivElement,
+  AdminHeaderContentProps
+>(function AdminHeaderContent({ className, children, ...props }, ref) {
+  return (
+    <Base
+      as="div"
+      ref={ref}
+      className={clsx(className, {
+        'govgr-admin-header__content': true,
+      })}
+      {...props}
+    >
+      {children}
+    </Base>
+  );
+});
+
+export default AdminHeaderContent;

package/src/AdminLayout/index.tsx

@@ -20,7 +20,7 @@ export const AdminLayout = React.forwardRef<HTMLDivElement, AdminLayoutProps>(
         ref={ref}
         className={clsx(className, {
           'govgr-admin-layout-wrapper': true,
-          'govgr-layout-wrapper__full-height': fullHeight,
+          'govgr-layout--full-height': fullHeight,
         })}
         {...props}
       >

package/src/AdminTopSection/index.tsx

@@ -2,7 +2,23 @@ import React from 'react';
 import clsx from 'clsx';
 import Grid, { GridProps } from '@digigov/react-core/Grid';
 
-export interface AdminTopSectionProps extends GridProps {}
+export interface AdminTopSectionProps extends GridProps {
+  /**
+   * color is optional.
+   * 'primary' color gives AdminTopSection the default color.
+   * @value primary
+   * @value secondary
+   * @default primary
+   * */
+  color?: 'primary' | 'secondary';
+  /**
+   * border is optional.
+   * border prop adds border to AdminTopSection.
+   * @value true
+   * @value false
+   */
+  border?: boolean;
+}
 /**
  * Use  AdminTopSection component inside AdminContainer component to seperate content in
  * 1 to 12 individual equal spaces
@@ -10,13 +26,15 @@ export interface AdminTopSectionProps extends GridProps {}
 export const AdminTopSection = React.forwardRef<
   HTMLDivElement,
   AdminTopSectionProps
->(function AdminTopSection({ className, children, ...props }, ref) {
+>(function AdminTopSection({ color = 'primary', border, className, children, ...props }, ref) {
   return (
     <Grid
       as="div"
       ref={ref}
       className={clsx(className, {
         'govgr-admin-top-section': true,
+        'govgr-admin-top-section--secondary': color === 'secondary',
+        'govgr-admin-top-section--border': border,
       })}
       {...props}
     >

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

@@ -4,10 +4,10 @@ exports[`renders the Aside with no props 1`] = `
 <ForwardRef(Aside)>
   <ForwardRef(Base)
     as="aside"
-    className="govgr-grid-column-one-third"
+    className="govgr-aside govgr-grid-column-one-third"
   >
     <aside
-      className="govgr-grid-column-one-third"
+      className="govgr-aside govgr-grid-column-one-third"
     >
       hello
     </aside>

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

@@ -6,13 +6,13 @@ exports[`renders the AdminContainer with no props 1`] = `
     aria-atomic="true"
     aria-live="polite"
     as="div"
-    className="govgr-autocomplete--status"
+    className="govgr-autocomplete__status"
     role="status"
   >
     <div
       aria-atomic="true"
       aria-live="polite"
-      className="govgr-autocomplete--status"
+      className="govgr-autocomplete__status"
       role="status"
     >
       hello

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

@@ -4,10 +4,10 @@ exports[`renders the AdminContainer with no props 1`] = `
 <ForwardRef(AutoCompleteStatusWrapper)>
   <ForwardRef(Base)
     as="div"
-    className="govgr-autocomplete--status__wrapper"
+    className="govgr-autocomplete__status__wrapper"
   >
     <div
-      className="govgr-autocomplete--status__wrapper"
+      className="govgr-autocomplete__status__wrapper"
     >
       hello
     </div>

package/src/AutoCompleteWrapper/index.tsx

@@ -4,22 +4,17 @@ import Base, { BaseProps } from '@digigov/react-core/Base';
 
 export interface AutoCompleteWrapperProps extends BaseProps<'div'> {
   /**
-  * cellWidth is optional.
-  * Use cellWidth prop to define a custom width for a specific reference number in your components.
-  * @value 'one-quarter'
-  * @value 'one-third'
-  * @value 'one-half'
-  * @value 'two-thirds'
-  * @value 'three-quarters'
-  * @value 'full'
-  */
-  cellWidth?:
-    | 'one-quarter'
-    | 'one-third'
-    | 'one-half'
-    | 'two-thirds'
-    | 'three-quarters'
-    | 'full';
+   * width is optional.
+   * Use width prop to define a custom width in your component.
+   * @value '25%';
+   * @value '33.3%';
+   * @value '50%';
+   * @value '66.6%';
+   * @value '75%';
+   * @value '100%';
+   * @value 'full';
+   */
+  width?: '25%' | '33.3%' | '50%' |  '66.6%' | '75%' | '100%' | 'full';
 }
 /**
  * AutoCompleteWrapper is a wrapper for autocomplete element.
@@ -29,7 +24,7 @@ export const AutoCompleteWrapper = React.forwardRef<
   HTMLDivElement,
   AutoCompleteWrapperProps
 >(function AutoCompleteWrapper(
-  { className, cellWidth, children, ...props },
+  { className, width, children, ...props },
   ref
 ) {
   return (
@@ -38,12 +33,12 @@ export const AutoCompleteWrapper = React.forwardRef<
       ref={ref}
       className={clsx(className, {
         'govgr-autocomplete__wrapper': true,
-        'govgr-!-width-one-quarter': cellWidth === 'one-quarter',
-        'govgr-!-width-one-third': cellWidth === 'one-third',
-        'govgr-!-width-one-half': cellWidth === 'one-half',
-        'govgr-!-width-two-thirds': cellWidth === 'two-thirds',
-        'govgr-!-width-three-quarters': cellWidth === 'three-quarters',
-        'govgr-!-width-full': cellWidth === 'full',
+        'govgr-!-width-one-quarter': width === '25%',
+        'govgr-!-width-one-third': width === '33.3%',
+        'govgr-!-width-one-half': width === '50%',
+        'govgr-!-width-two-thirds': width === '66.6%',
+        'govgr-!-width-three-quarters': width === '75%',
+        'govgr-!-width-full': width === 'full',
       })}
       {...props}
     >

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

@@ -18,8 +18,11 @@ exports[`renders the BackLink with href="#" 1`] = `
       onClick={[Function]}
       tabIndex={0}
     >
-      <CaretIcon>
+      <CaretIcon
+        direction="left"
+      >
         <ForwardRef(Icon)
+          direction="left"
           icon="caret"
         >
           <ForwardRef(SvgIcon)
@@ -38,7 +41,9 @@ exports[`renders the BackLink with href="#" 1`] = `
                 focusable="false"
                 viewBox="0 0 24 24"
               >
-                <caret>
+                <caret
+                  direction="left"
+                >
                   <path
                     d="M18,22V2L6,12L18,22z"
                   />
@@ -68,8 +73,11 @@ exports[`renders the BackLink with no props 1`] = `
       onClick={[Function]}
       tabIndex={0}
     >
-      <CaretIcon>
+      <CaretIcon
+        direction="left"
+      >
         <ForwardRef(Icon)
+          direction="left"
           icon="caret"
         >
           <ForwardRef(SvgIcon)
@@ -88,7 +96,9 @@ exports[`renders the BackLink with no props 1`] = `
                 focusable="false"
                 viewBox="0 0 24 24"
               >
-                <caret>
+                <caret
+                  direction="left"
+                >
                   <path
                     d="M18,22V2L6,12L18,22z"
                   />

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

@@ -0,0 +1,16 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`renders the BannerContainer with no props 1`] = `
+<ForwardRef(BannerContainer)>
+  <ForwardRef(Base)
+    as="div"
+    className="govgr-cookie-banner"
+  >
+    <div
+      className="govgr-cookie-banner"
+    >
+      hello
+    </div>
+  </ForwardRef(Base)>
+</ForwardRef(BannerContainer)>
+`;