@digigov/react-core 0.18.1 → 0.19.1

package/src/NotificationBannerHeading/index.test.tsx

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

package/src/NotificationBannerHeading/index.tsx

@@ -0,0 +1,29 @@
+import React from 'react';
+import Base, { BaseProps } from '@digigov/react-core/Base';
+import clsx from 'clsx';
+
+export interface NotificationBannerHeadingProps extends BaseProps<'h3'> {}
+/**
+ * Details for the NotificationBannerHeading.
+ * NotificationBannerHeading component is used for placing text content to NotificationBanner component.
+ * NotificationBannerHeading component must be used inside NotificationBannerContent as children
+ */
+export const NotificationBannerHeading = React.forwardRef<
+  HTMLHeadingElement,
+  NotificationBannerHeadingProps
+>(function NotificationBannerHeading({ className, children, ...props }, ref) {
+  return (
+    <Base
+      as="h3"
+      ref={ref}
+      className={clsx(className, {
+        'govgr-notification-banner__heading': true,
+      })}
+      {...props}
+    >
+      {children}
+    </Base>
+  );
+});
+
+export default NotificationBannerHeading;

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

@@ -0,0 +1,37 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`renders the NotificationBannerLink with href prop props 1`] = `
+<ForwardRef(NotificationBannerLink)
+  href="https://www.w3schools.com/html/html_links.asp"
+>
+  <ForwardRef(Base)
+    as="a"
+    className="govgr-notification-banner__link"
+    href="https://www.w3schools.com/html/html_links.asp"
+  >
+    <a
+      className="govgr-notification-banner__link"
+      href="https://www.w3schools.com/html/html_links.asp"
+    >
+      hello
+    </a>
+  </ForwardRef(Base)>
+</ForwardRef(NotificationBannerLink)>
+`;
+
+exports[`renders the NotificationBannerLink with no props 1`] = `
+<ForwardRef(NotificationBannerLink)>
+  <ForwardRef(Base)
+    as="a"
+    className="govgr-notification-banner__link"
+    href="#"
+  >
+    <a
+      className="govgr-notification-banner__link"
+      href="#"
+    >
+      hello
+    </a>
+  </ForwardRef(Base)>
+</ForwardRef(NotificationBannerLink)>
+`;

package/src/NotificationBannerLink/index.test.tsx

@@ -0,0 +1,20 @@
+import React from 'react';
+import { mount } from 'enzyme';
+
+import NotificationBannerLink from '@digigov/react-core/NotificationBannerLink';
+
+it('renders the NotificationBannerLink with no props', () => {
+  expect(
+    mount(<NotificationBannerLink>hello</NotificationBannerLink>)
+  ).toMatchSnapshot();
+});
+
+it('renders the NotificationBannerLink with href prop props', () => {
+  expect(
+    mount(
+      <NotificationBannerLink href="https://www.w3schools.com/html/html_links.asp">
+        hello
+      </NotificationBannerLink>
+    )
+  ).toMatchSnapshot();
+});

package/src/NotificationBannerLink/index.tsx

@@ -0,0 +1,38 @@
+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;
+}
+/**
+ * Details for the NotificationBannerLink.
+ * NotificationBannerLink allow users to click their way from page to page.
+ * NotificationBannerLink must be wrapped inside NotificationContent component as children
+ */
+export const NotificationBannerLink = React.forwardRef<
+  HTMLAnchorElement,
+  NotificationBannerLinkProps
+>(function NotificationBannerLink(
+  { href = '#', className, children, ...props },
+  ref
+) {
+  return (
+    <Base
+      as="a"
+      ref={ref}
+      href={href}
+      className={clsx(className, {
+        'govgr-notification-banner__link': true,
+      })}
+      {...props}
+    >
+      {children}
+    </Base>
+  );
+});
+
+export default NotificationBannerLink;

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

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

package/src/PageTitle/index.test.tsx

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

package/src/PageTitle/index.tsx

@@ -0,0 +1,19 @@
+import React from 'react';
+import Base, { BaseProps } from '@digigov/react-core/Base';
+import clsx from 'clsx';
+
+export interface PageTitleProps extends BaseProps<'div'> {}
+/**
+ * Details for the PageTitle.
+ */
+export const PageTitle = React.forwardRef<HTMLDivElement, PageTitleProps>(
+  function PageTitle({ className, children, ...props }, ref) {
+    return (
+      <Base as="div" ref={ref} className={clsx(className, {})} {...props}>
+        {children}
+      </Base>
+    );
+  }
+);
+
+export default PageTitle;

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

@@ -0,0 +1,67 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`renders the PageTitleCaption with no props 1`] = `
+<ForwardRef(PageTitleCaption)>
+  <ForwardRef(Base)
+    as="span"
+    className="govgr-caption-l"
+  >
+    <span
+      className="govgr-caption-l"
+    >
+      hello
+    </span>
+  </ForwardRef(Base)>
+</ForwardRef(PageTitleCaption)>
+`;
+
+exports[`renders the PageTitleCaption with size=l 1`] = `
+<ForwardRef(PageTitleCaption)
+  size="l"
+>
+  <ForwardRef(Base)
+    as="span"
+    className="govgr-caption-l"
+  >
+    <span
+      className="govgr-caption-l"
+    >
+      hello
+    </span>
+  </ForwardRef(Base)>
+</ForwardRef(PageTitleCaption)>
+`;
+
+exports[`renders the PageTitleCaption with size=m 1`] = `
+<ForwardRef(PageTitleCaption)
+  size="m"
+>
+  <ForwardRef(Base)
+    as="span"
+    className="govgr-caption-m"
+  >
+    <span
+      className="govgr-caption-m"
+    >
+      hello
+    </span>
+  </ForwardRef(Base)>
+</ForwardRef(PageTitleCaption)>
+`;
+
+exports[`renders the PageTitleCaption with size=xl 1`] = `
+<ForwardRef(PageTitleCaption)
+  size="xl"
+>
+  <ForwardRef(Base)
+    as="span"
+    className="govgr-caption-xl"
+  >
+    <span
+      className="govgr-caption-xl"
+    >
+      hello
+    </span>
+  </ForwardRef(Base)>
+</ForwardRef(PageTitleCaption)>
+`;

package/src/PageTitleCaption/index.test.tsx

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

package/src/PageTitleCaption/index.tsx

@@ -0,0 +1,38 @@
+import React from 'react';
+import Base, { BaseProps } from '@digigov/react-core/Base';
+import clsx from 'clsx';
+
+export interface PageTitleCaptionProps extends BaseProps<'span'> {
+  /**
+   * size is optional. The default value is 'l'.
+   * This size should be the same as the matching Heading.
+   */
+  size?: 'xl' | 'l' | 'm';
+}
+/**
+ * PageTitleCaption will be replaced by HeadingCaption.
+ */
+export const PageTitleCaption = React.forwardRef<
+  HTMLSpanElement,
+  PageTitleCaptionProps
+>(function PageTitleCaption(
+  { size = 'l', className, children, ...props },
+  ref
+) {
+  return (
+    <Base
+      as="span"
+      ref={ref}
+      className={clsx(className, {
+        'govgr-caption-xl': size === 'xl',
+        'govgr-caption-l': size === 'l',
+        'govgr-caption-m': size === 'm',
+      })}
+      {...props}
+    >
+      {children}
+    </Base>
+  );
+});
+
+export default PageTitleCaption;

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

@@ -0,0 +1,84 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`renders the PageTitleHeading with no props 1`] = `
+<ForwardRef(PageTitleHeading)>
+  <ForwardRef(Base)
+    as="h1"
+    className="govgr-heading-xl"
+  >
+    <h1
+      className="govgr-heading-xl"
+    >
+      hello
+    </h1>
+  </ForwardRef(Base)>
+</ForwardRef(PageTitleHeading)>
+`;
+
+exports[`renders the PageTitleHeading with size=l 1`] = `
+<ForwardRef(PageTitleHeading)
+  size="l"
+>
+  <ForwardRef(Base)
+    as="h1"
+    className="govgr-heading-l"
+  >
+    <h1
+      className="govgr-heading-l"
+    >
+      hello
+    </h1>
+  </ForwardRef(Base)>
+</ForwardRef(PageTitleHeading)>
+`;
+
+exports[`renders the PageTitleHeading with size=m 1`] = `
+<ForwardRef(PageTitleHeading)
+  size="m"
+>
+  <ForwardRef(Base)
+    as="h1"
+    className="govgr-heading-m"
+  >
+    <h1
+      className="govgr-heading-m"
+    >
+      hello
+    </h1>
+  </ForwardRef(Base)>
+</ForwardRef(PageTitleHeading)>
+`;
+
+exports[`renders the PageTitleHeading with size=s 1`] = `
+<ForwardRef(PageTitleHeading)
+  size="s"
+>
+  <ForwardRef(Base)
+    as="h1"
+    className="govgr-heading-s"
+  >
+    <h1
+      className="govgr-heading-s"
+    >
+      hello
+    </h1>
+  </ForwardRef(Base)>
+</ForwardRef(PageTitleHeading)>
+`;
+
+exports[`renders the PageTitleHeading with size=xl 1`] = `
+<ForwardRef(PageTitleHeading)
+  size="xl"
+>
+  <ForwardRef(Base)
+    as="h1"
+    className="govgr-heading-xl"
+  >
+    <h1
+      className="govgr-heading-xl"
+    >
+      hello
+    </h1>
+  </ForwardRef(Base)>
+</ForwardRef(PageTitleHeading)>
+`;

package/src/PageTitleHeading/index.test.tsx

@@ -0,0 +1,32 @@
+import React from 'react';
+import { mount } from 'enzyme';
+
+import PageTitleHeading from '@digigov/react-core/PageTitleHeading';
+
+it('renders the PageTitleHeading with no props', () => {
+  expect(mount(<PageTitleHeading>hello</PageTitleHeading>)).toMatchSnapshot();
+});
+
+it('renders the PageTitleHeading with size=xl', () => {
+  expect(
+    mount(<PageTitleHeading size={'xl'}>hello</PageTitleHeading>)
+  ).toMatchSnapshot();
+});
+
+it('renders the PageTitleHeading with size=l', () => {
+  expect(
+    mount(<PageTitleHeading size={'l'}>hello</PageTitleHeading>)
+  ).toMatchSnapshot();
+});
+
+it('renders the PageTitleHeading with size=m', () => {
+  expect(
+    mount(<PageTitleHeading size={'m'}>hello</PageTitleHeading>)
+  ).toMatchSnapshot();
+});
+
+it('renders the PageTitleHeading with size=s', () => {
+  expect(
+    mount(<PageTitleHeading size={'s'}>hello</PageTitleHeading>)
+  ).toMatchSnapshot();
+});

package/src/PageTitleHeading/index.tsx

@@ -0,0 +1,38 @@
+import React from 'react';
+import Base, { BaseProps } from '@digigov/react-core/Base';
+import clsx from 'clsx';
+
+export interface PageTitleHeadingProps extends BaseProps<'h1'> {
+  /**
+   * size is optional.
+   */
+  size?: 'xl' | 'l' | 'm' | 's';
+}
+/**
+ * Details for the PageTitleHeading.
+ */
+export const PageTitleHeading = React.forwardRef<
+  HTMLHeadingElement,
+  PageTitleHeadingProps
+>(function PageTitleHeading(
+  { size = 'xl', className, children, ...props },
+  ref
+) {
+  return (
+    <Base
+      as="h1"
+      ref={ref}
+      className={clsx(className, {
+        'govgr-heading-xl': size === 'xl',
+        'govgr-heading-l': size === 'l',
+        'govgr-heading-m': size === 'm',
+        'govgr-heading-s': size === 's',
+      })}
+      {...props}
+    >
+      {children}
+    </Base>
+  );
+});
+
+export default PageTitleHeading;

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

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

package/src/PageTitleSection/index.test.tsx

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

package/src/PageTitleSection/index.tsx

@@ -0,0 +1,21 @@
+import React from 'react';
+import Base, { BaseProps } from '@digigov/react-core/Base';
+import clsx from 'clsx';
+
+export interface PageTitleSectionProps extends BaseProps<'div'> {}
+/**
+ * Details for the PageTitleSection.
+ * Use this as a wrapper for PageTitleHeading.
+ */
+export const PageTitleSection = React.forwardRef<
+  HTMLDivElement,
+  PageTitleSectionProps
+>(function PageTitleSection({ className, children, ...props }, ref) {
+  return (
+    <Base as="div" ref={ref} className={clsx(className, {})} {...props}>
+      {children}
+    </Base>
+  );
+});
+
+export default PageTitleSection;