@digigov/react-core 1.0.0-6b93ebf2 → 1.0.0-871b6be5

package/src/Typography/index.test.tsx

@@ -0,0 +1,44 @@
+import React from 'react';
+import { mount } from 'enzyme';
+
+import Typography from '@digigov/react-core/Typography';
+
+it('renders the Typography with fontSize=14 and as=span props', () => {
+    expect(mount(<Typography fontSize={14} as='span'>hello</Typography>)).toMatchSnapshot();
+});
+
+it('renders the Typography with fontSize=16 and as=span props', () => {
+    expect(mount(<Typography fontSize={16} as='span'>hello</Typography>)).toMatchSnapshot();
+});
+
+it('renders the Typography with fontSize=19 and as=span props', () => {
+    expect(mount(<Typography fontSize={19} as='span'>hello</Typography>)).toMatchSnapshot();
+});
+
+it('renders the Typography fontSize=24 and as=span props', () => {
+    expect(mount(<Typography fontSize={24} as='span'>hello</Typography>)).toMatchSnapshot();
+});
+
+it('renders the Typography fontSize=30 and as=span props', () => {
+    expect(mount(<Typography fontSize={30} as='span'>hello</Typography>)).toMatchSnapshot();
+});
+
+it('renders the Typography fontSize=36 and as=span props', () => {
+    expect(mount(<Typography fontSize={36} as='span'>hello</Typography>)).toMatchSnapshot();
+});
+
+it('renders the Typography fontSize=48 and as=span props', () => {
+    expect(mount(<Typography fontSize={48} as='span'>hello</Typography>)).toMatchSnapshot();
+});
+
+it('renders the Typography fontSize=72 and as=span props', () => {
+    expect(mount(<Typography fontSize={72} as='span'>hello</Typography>)).toMatchSnapshot();
+});
+
+it('renders the Typography with fontWeight=regular and as=p props', () => {
+    expect(mount(<Typography fontWeight='regular' as='p'>hello</Typography>)).toMatchSnapshot();
+});
+
+it('renders the Typography fontWeight=bold and as=p props', () => {
+    expect(mount(<Typography fontWeight='bold' as='p'>hello</Typography>)).toMatchSnapshot();
+});

package/src/Typography/index.tsx

@@ -0,0 +1,52 @@
+import React from 'react';
+import clsx from 'clsx';
+import Base, { BaseProps } from '@digigov/react-core/Base';
+
+export interface TypographyProps extends BaseProps<'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'span' | 'p'> {
+    /**
+    * fontSize is optional.
+    * Add this fontSize override prop in order to change the font size.
+    * @value 14
+    * @value 16
+    * @value 19
+    * @value 24
+    * @value 30
+    * @value 36
+    * @value 48
+    * @value 72
+    */
+    fontSize?: 14 | 16 | 19 | 24 | 30 | 36 | 48 | 72;
+    /**
+    * fontWeight is optional.
+    * You can add a fontWeight override prop to change the font weight to regular or bold.
+    * @value 'regular'
+    * @value 'bold'
+    */
+    fontWeight?: 'regular' | 'bold';
+}
+/**
+ * Typography component is used as generic component for typography.
+ * Use Typography component to extend components such as Heading, NormalText Paragraph etc.
+ */
+export const Typography = React.forwardRef<HTMLHeadingElement, TypographyProps>(
+    function Typography(
+        { as, fontSize, fontWeight, className, children, ...props },
+        ref
+    ) {
+        return (
+            <Base
+                as={as}
+                ref={ref}
+                className={clsx(className, {
+                    [`govgr-!-font-size-${fontSize}`]: fontSize !== undefined,
+                    [`govgr-!-font-weight-${fontWeight}`]: fontWeight !== undefined,
+                })}
+                {...props}
+            >
+                {children}
+            </Base>
+        );
+    }
+);
+
+export default Typography;

package/src/Unpurge/index.tsx

@@ -134,6 +134,23 @@ function Unpurge() {
     govgr-pb-12
     govgr-pr-12
     govgr-pl-12
+    govgr-gap-1
+    govgr-gap-2
+    govgr-gap-4
+    govgr-gap-6
+    govgr-gap-8
+    govgr-gap-10
+    govgr-gap-12
+    govgr-!-font-size-14
+    govgr-!-font-size-16
+    govgr-!-font-size-19
+    govgr-!-font-size-24
+    govgr-!-font-size-30
+    govgr-!-font-size-36
+    govgr-!-font-size-48
+    govgr-!-font-size-72
+    govgr-!-font-weight-regular
+    govgr-!-font-weight-bold
     govgr-print-hidden
     govgr-svg-icon--arrow
     govgr-svg-icon--burger
@@ -144,6 +161,115 @@ function Unpurge() {
     govgr-svg-icon--globe
     govgr-svg-icon--moreVert
     govgr-svg-icon--uncheck
+    xs:govgr-grid__col-span-1
+    xs:govgr-grid__col-span-2
+    xs:govgr-grid__col-span-3
+    xs:govgr-grid__col-span-4
+    xs:govgr-grid__col-span-5
+    xs:govgr-grid__col-span-6
+    xs:govgr-grid__col-span-7
+    xs:govgr-grid__col-span-8
+    xs:govgr-grid__col-span-9
+    xs:govgr-grid__col-span-10
+    xs:govgr-grid__col-span-11
+    xs:govgr-grid__col-span-12
+    sm:govgr-grid__col-span-1
+    sm:govgr-grid__col-span-2
+    sm:govgr-grid__col-span-3
+    sm:govgr-grid__col-span-4
+    sm:govgr-grid__col-span-5
+    sm:govgr-grid__col-span-6
+    sm:govgr-grid__col-span-7
+    sm:govgr-grid__col-span-8
+    sm:govgr-grid__col-span-9
+    sm:govgr-grid__col-span-10
+    sm:govgr-grid__col-span-11
+    sm:govgr-grid__col-span-12
+    md:govgr-grid__col-span-1
+    md:govgr-grid__col-span-2
+    md:govgr-grid__col-span-3
+    md:govgr-grid__col-span-4
+    md:govgr-grid__col-span-5
+    md:govgr-grid__col-span-6
+    md:govgr-grid__col-span-7
+    md:govgr-grid__col-span-8
+    md:govgr-grid__col-span-9
+    md:govgr-grid__col-span-10
+    md:govgr-grid__col-span-11
+    md:govgr-grid__col-span-12
+    lg:govgr-grid__col-span-1
+    lg:govgr-grid__col-span-2
+    lg:govgr-grid__col-span-3
+    lg:govgr-grid__col-span-4
+    lg:govgr-grid__col-span-5
+    lg:govgr-grid__col-span-6
+    lg:govgr-grid__col-span-7
+    lg:govgr-grid__col-span-8
+    lg:govgr-grid__col-span-9
+    lg:govgr-grid__col-span-10
+    lg:govgr-grid__col-span-11
+    lg:govgr-grid__col-span-12
+    govgr-stack--row
+    govgr-stack--row-reverse
+    govgr-stack--column
+    govgr-stack--column-reverse
+    govgr-stack--justify-flex-start
+    govgr-stack--justify-flex-end
+    govgr-stack--justify-center
+    govgr-stack--justify-space-between
+    govgr-stack--justify-space-around
+    govgr-stack--justify-space-evenly 
+    govgr-stack--align-stretch
+    govgr-stack--align-flex-start
+    govgr-stack--align-flex-end
+    govgr-stack--align-center
+    govgr-stack--align-baseline
+    govgr-stack--content-flex-start
+    govgr-stack--content-flex-end
+    govgr-stack--content-center
+    govgr-stack--content-space-between
+    govgr-stack--content-space-around
+    govgr-stack--content-space-evenly 
+    govgr-notification-banner--info
+    govgr-notification-banner--success
+    govgr-notification-banner--warning
+    govgr-notification-banner--error
+    govgr-input--width-2-char
+    govgr-input--width-3-char
+    govgr-input--width-4-char
+    govgr-input--width-5-char
+    govgr-input--width-10-char
+    govgr-input--width-20-char
+    govgr-!-width-one-quarter
+    govgr-!-width-one-third
+    govgr-!-width-one-half
+    govgr-!-width-two-thirds
+    govgr-!-width-three-quarters
+    govgr-!-width-one-third
+    govgr-!-width-one-half
+    govgr-!-width-two-thirds
+    govgr-!-width-three-quarters
+    govgr-!-width-full
+    govgr-table__caption--sm
+    govgr-table__caption--md
+    govgr-table__caption--lg
+    govgr-table__caption--xl
+    govgr-task-list__content__tag--primary
+    govgr-task-list__content__tag--secondary
+    govgr-task-list__content__tag--info
+    govgr-svg-icon--xs
+    govgr-svg-icon--sm
+    govgr-svg-icon--md
+    govgr-svg-icon--lg
+    govgr-svg-icon--xl
+    govgr-caption-md
+    govgr-caption-lg
+    govgr-caption-xl
+    govgr-heading-xs
+    govgr-heading-sm
+    govgr-heading-md
+    govgr-heading-lg
+    govgr-heading-xl
     `}
     ></div>
   );

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

@@ -1,5 +1,36 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
+exports[`renders the WarningText with assistive text 1`] = `
+<ForwardRef(WarningText)
+  assistiveText="alert"
+>
+  <ForwardRef(Base)
+    as="div"
+    className="govgr-warning-text"
+  >
+    <div
+      className="govgr-warning-text"
+    >
+      <span
+        className="govgr-warning-text__icon"
+      >
+        !
+      </span>
+      <strong
+        className="govgr-warning-text__text"
+      >
+        <span
+          className="govgr-warning-text__assistive"
+        >
+          alert
+        </span>
+        hello
+      </strong>
+    </div>
+  </ForwardRef(Base)>
+</ForwardRef(WarningText)>
+`;
+
 exports[`renders the WarningText with no props 1`] = `
 <ForwardRef(WarningText)>
   <ForwardRef(Base)

package/src/WarningText/index.test.tsx

@@ -6,3 +6,6 @@ import WarningText from '@digigov/react-core/WarningText';
 it('renders the WarningText with no props', () => {
   expect(mount(<WarningText>hello</WarningText>)).toMatchSnapshot();
 });
+it('renders the WarningText with assistive text', () => {
+  expect(mount(<WarningText assistiveText='alert'>hello</WarningText>)).toMatchSnapshot();
+});

package/src/WarningText/index.tsx

@@ -2,14 +2,24 @@ import React from 'react';
 import clsx from 'clsx';
 import Base, { BaseProps } from '@digigov/react-core/Base';
 
-export interface WarningTextProps extends BaseProps<'div'> {}
+export interface WarningTextProps extends BaseProps<'div'> {
+  /**
+   * assistiveText is optional.
+   * Default value is "Προσοχή".
+   * assistiveText is used to provide a textual warning for assistive technologies like screen readers.
+   */
+  assistiveText?: string;
+}
 /**
  * WarningText.
  * Use the WarningText component when you need to warn users about something important.
  * The component is used with a text inside it.
  */
 export const WarningText = React.forwardRef<HTMLDivElement, WarningTextProps>(
-  function WarningText({ className, children, ...props }, ref) {
+  function WarningText(
+    { className, assistiveText = 'Προσοχή', children, ...props },
+    ref
+  ) {
     return (
       <Base
         as="div"
@@ -36,7 +46,7 @@ export const WarningText = React.forwardRef<HTMLDivElement, WarningTextProps>(
               'govgr-warning-text__assistive': true,
             })}
           >
-            Προσοχή
+            {assistiveText}
           </span>
           {children}
         </strong>

package/src/index.ts

@@ -19,7 +19,6 @@ export * from '@digigov/react-core/Card';
 export * from '@digigov/react-core/CardAction';
 export * from '@digigov/react-core/CardHeading';
 export * from '@digigov/react-core/CardContent';
-export * from '@digigov/react-core/TableSortIconContainer';
 export * from '@digigov/react-core/Checkbox';
 export * from '@digigov/react-core/CheckboxConditional';
 export * from '@digigov/react-core/CheckboxItem';
@@ -45,15 +44,13 @@ export * from '@digigov/react-core/FooterContent';
 export * from '@digigov/react-core/FooterContentLogos';
 export * from '@digigov/react-core/FooterHeading';
 export * from '@digigov/react-core/FooterImage';
-export * from '@digigov/react-core/FooterInlineList';
-export * from '@digigov/react-core/FooterInlineListItem';
 export * from '@digigov/react-core/FooterLink';
 export * from '@digigov/react-core/FooterList';
 export * from '@digigov/react-core/FooterListItem';
-export * from '@digigov/react-core/FooterMeta';
-export * from '@digigov/react-core/FooterMetaItem';
+export * from '@digigov/react-core/FooterInfo';
+export * from '@digigov/react-core/FooterInfoSection';
 export * from '@digigov/react-core/FooterNavigation';
-export * from '@digigov/react-core/FooterSection';
+export * from '@digigov/react-core/FooterNavigationSection';
 export * from '@digigov/react-core/FieldContainer';
 export * from '@digigov/react-core/GovGRLogo';
 export * from '@digigov/react-core/Grid';
@@ -79,17 +76,16 @@ export * from '@digigov/react-core/Masthead';
 export * from '@digigov/react-core/MastheadBody';
 export * from '@digigov/react-core/Nav';
 export * from '@digigov/react-core/NavList';
-export * from '@digigov/react-core/NavListItem';
+export * from '@digigov/react-core/NavListItemAction';
+export * from '@digigov/react-core/NavListItemActionContainer';
 export * from '@digigov/react-core/NavListItemLink';
 export * from '@digigov/react-core/NavListItemButton';
-export * from '@digigov/react-core/NavMenu';
 export * from '@digigov/react-core/NavMenuContainer';
-export * from '@digigov/react-core/NavMenuContainerContent';
-export * from '@digigov/react-core/NavMenuContainerContentList';
-export * from '@digigov/react-core/NavMenuContainerContentListItem';
-export * from '@digigov/react-core/NavMenuContainerTitle';
-export * from '@digigov/react-core/NavVertical';
-export * from '@digigov/react-core/NavVerticalItem';
+export * from '@digigov/react-core/NavMenuContent';
+export * from '@digigov/react-core/NavMenuContentListBase';
+export * from '@digigov/react-core/NavMenuContentListItem';
+export * from '@digigov/react-core/NavMenuTitle';
+export * from '@digigov/react-core/NavListItemAction';
 export * from '@digigov/react-core/NormalText';
 export * from '@digigov/react-core/NotificationBannerContainer';
 export * from '@digigov/react-core/NotificationBannerContent';
@@ -97,6 +93,8 @@ export * from '@digigov/react-core/NotificationBannerHeader';
 export * from '@digigov/react-core/NotificationBannerHeading';
 export * from '@digigov/react-core/NotificationBannerLink';
 export * from '@digigov/react-core/Section';
+export * from '@digigov/react-core/PageTitleContainer';
+export * from '@digigov/react-core/PageTitleCaption';
 export * from '@digigov/react-core/PageTitleHeading';
 export * from '@digigov/react-core/Paragraph';
 export * from '@digigov/react-core/PhaseBannerHeaderContainer';
@@ -109,9 +107,10 @@ export * from '@digigov/react-core/RadioConditional';
 export * from '@digigov/react-core/SectionBreak';
 export * from '@digigov/react-core/SelectContainer';
 export * from '@digigov/react-core/SelectOption';
-export * from '@digigov/react-core/SingleCharacterInputContainer';
-export * from '@digigov/react-core/SingleCharacterInputItem';
+export * from '@digigov/react-core/SingleCharacterInputs';
+export * from '@digigov/react-core/SingleCharacterInput';
 export * from '@digigov/react-core/SkipLink';
+export * from '@digigov/react-core/Stack';
 export * from '@digigov/react-core/SummaryList';
 export * from '@digigov/react-core/SummaryListItem';
 export * from '@digigov/react-core/SummaryListItemAction';
@@ -128,6 +127,7 @@ export * from '@digigov/react-core/TableNoDataRow';
 export * from '@digigov/react-core/TableHead';
 export * from '@digigov/react-core/TableHeadCell';
 export * from '@digigov/react-core/TableRow';
+export * from '@digigov/react-core/TableSortIconContainer';
 export * from '@digigov/react-core/Tabs';
 export * from '@digigov/react-core/TabsHeading';
 export * from '@digigov/react-core/TabsList';
@@ -135,6 +135,7 @@ export * from '@digigov/react-core/TabsListItem';
 export * from '@digigov/react-core/TabsPanel';
 export * from '@digigov/react-core/TextArea';
 export * from '@digigov/react-core/TextInput';
+export * from '@digigov/react-core/Typography';
 export * from '@digigov/react-core/Top';
 export * from '@digigov/react-core/Base';
 export * from '@digigov/react-core/VisuallyHidden';
@@ -160,31 +161,29 @@ export * from '@digigov/react-core/AutoCompleteResultListItem';
 export * from '@digigov/react-core/AutoCompleteWrapper';
 export * from '@digigov/react-core/Chip';
 export * from '@digigov/react-core/ChipHeading';
-export * from '@digigov/react-core/ChipSection';
-export * from '@digigov/react-core/ChipSectionWrapper';
+export * from '@digigov/react-core/ChipContainer';
 export * from '@digigov/react-core/ChipKeyValue';
 export * from '@digigov/react-core/CopyToClipboardMessage';
 export * from '@digigov/react-core/CopyToClipboardContainer';
 export * from '@digigov/react-core/DropdownBase';
 export * from '@digigov/react-core/DropdownButton';
 export * from '@digigov/react-core/DropdownContent';
-export * from '@digigov/react-core/DropdownArrowDown';
 export * from '@digigov/react-core/FillableText';
 export * from '@digigov/react-core/Drawer';
 export * from '@digigov/react-core/DrawerHeading';
 export * from '@digigov/react-core/FilterContent';
-export * from '@digigov/react-core/FilterHeading';
+export * from '@digigov/react-core/FilterHeadingContainer';
 export * from '@digigov/react-core/FilterOptionsSection';
-export * from '@digigov/react-core/FilterSection';
+export * from '@digigov/react-core/FilterContainer';
 export * from '@digigov/react-core/FilterSelectedHeading';
 export * from '@digigov/react-core/FilterSelectedSection';
 export * from '@digigov/react-core/SearchButton';
-export * from '@digigov/react-core/SearchSection';
+export * from '@digigov/react-core/SearchContainer';
 export * from '@digigov/react-core/ResultsHeading';
 export * from '@digigov/react-core/ResultsHeadingActions';
 export * from '@digigov/react-core/ResultsActionBar';
 export * from '@digigov/react-core/AdminHeader';
-export * from '@digigov/react-core/AdminHeaderSection';
+export * from '@digigov/react-core/AdminHeaderContent';
 export * from '@digigov/react-core/ModalContainer';
 export * from '@digigov/react-core/ModalHeading';
 export * from '@digigov/react-core/ModalContent';