@digigov/react-core 0.1.0 → 0.4.0

package/src/BreadcrumbsListItem/index.test.tsx

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

package/src/BreadcrumbsListItem/index.tsx

@@ -1,39 +0,0 @@
-import React from 'react';
-import clsx from 'clsx';
-
-type LiElementAttributes = JSX.IntrinsicElements['li'];
-export interface BreadcrumbsListItemProps extends LiElementAttributes {
-  /**
-   * href is optional and provides the text and url of the Breadcrumbs items.
-   */
-  href?: string;
-}
-/**
- * BreadcrumbsListItem creates a list of items with the possibility of navigation.
- * It should be used inside BreadcrumbsList as children component
- */
-export const BreadcrumbsListItem = React.forwardRef<
-  HTMLLIElement,
-  BreadcrumbsListItemProps
->(function BreadcrumbsListItem({ href, className, children, ...props }, ref) {
-  return (
-    <li
-      ref={ref}
-      className={clsx(className, {
-        'govgr-breadcrumbs__list-item': true,
-      })}
-      {...props}
-    >
-      <a
-        href={href}
-        className={clsx({
-          'govgr-breadcrumbs__link': true,
-        })}
-      >
-        {children}
-      </a>
-    </li>
-  );
-});
-
-export default BreadcrumbsListItem;

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

@@ -1,59 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`renders the BurgerIcon with active=false 1`] = `
-<ForwardRef(BurgerIcon)
-  active={false}
->
-  <div
-    className="govgr-burger-menu govgr-burger-menu--white-bg"
-  >
-    <div
-      className="govgr-burger-menu__line1"
-    />
-    <div
-      className="govgr-burger-menu__line2"
-    />
-    <div
-      className="govgr-burger-menu__line3"
-    />
-  </div>
-</ForwardRef(BurgerIcon)>
-`;
-
-exports[`renders the BurgerIcon with active=true 1`] = `
-<ForwardRef(BurgerIcon)
-  active={true}
->
-  <div
-    className="govgr-burger-menu--active govgr-burger-menu govgr-burger-menu--white-bg"
-  >
-    <div
-      className="govgr-burger-menu__line1"
-    />
-    <div
-      className="govgr-burger-menu__line2"
-    />
-    <div
-      className="govgr-burger-menu__line3"
-    />
-  </div>
-</ForwardRef(BurgerIcon)>
-`;
-
-exports[`renders the BurgerIcon with no props 1`] = `
-<ForwardRef(BurgerIcon)>
-  <div
-    className="govgr-burger-menu govgr-burger-menu--white-bg"
-  >
-    <div
-      className="govgr-burger-menu__line1"
-    />
-    <div
-      className="govgr-burger-menu__line2"
-    />
-    <div
-      className="govgr-burger-menu__line3"
-    />
-  </div>
-</ForwardRef(BurgerIcon)>
-`;

package/src/BurgerIcon/index.test.tsx

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

package/src/BurgerIcon/index.tsx

@@ -1,49 +0,0 @@
-import React from 'react';
-import clsx from 'clsx';
-
-type DivElementAttributes = JSX.IntrinsicElements['div'];
-export interface BurgerIconProps extends DivElementAttributes {
-  /**
-   * active is optional.
-   * The default is 'false'.
-   * This prop should be 'true' whenever the NavHorizontal is 'active', so whenever the user clicks at the burger menu.
-   */
-  active?: boolean;
-}
-/**
- * BurgerIcon is used inside the Header component.
- * It should be linked with the NavHorizontal component. It is hidden when the NavHorizontal is visible and vice versa.
- */
-export const BurgerIcon = React.forwardRef<HTMLDivElement, BurgerIconProps>(
-  function BurgerIcon({ active, className, ...props }, ref) {
-    return (
-      <div
-        ref={ref}
-        className={clsx(className, {
-          'govgr-burger-menu': true,
-          'govgr-burger-menu--white-bg': true,
-          'govgr-burger-menu--active': active === true,
-        })}
-        {...props}
-      >
-        <div
-          className={clsx({
-            'govgr-burger-menu__line1': true,
-          })}
-        ></div>
-        <div
-          className={clsx({
-            'govgr-burger-menu__line2': true,
-          })}
-        ></div>
-        <div
-          className={clsx({
-            'govgr-burger-menu__line3': true,
-          })}
-        ></div>
-      </div>
-    );
-  }
-);
-
-export default BurgerIcon;

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

@@ -1,115 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`renders the Button with color=primary 1`] = `
-<ForwardRef(Button)
-  color="primary"
->
-  <button
-    className="govgr-btn-primary govgr-btn"
-  >
-    hello
-  </button>
-</ForwardRef(Button)>
-`;
-
-exports[`renders the Button with color=primary with disabled=true 1`] = `
-<ForwardRef(Button)
-  color="primary"
-  disabled={true}
->
-  <button
-    className="govgr-btn-primary govgr-btn-disabled govgr-btn"
-    disabled={true}
-  >
-    hello
-  </button>
-</ForwardRef(Button)>
-`;
-
-exports[`renders the Button with color=secondary 1`] = `
-<ForwardRef(Button)
-  color="secondary"
->
-  <button
-    className="govgr-btn-secondary govgr-btn"
-  >
-    hello
-  </button>
-</ForwardRef(Button)>
-`;
-
-exports[`renders the Button with color=secondary with disabled=true 1`] = `
-<ForwardRef(Button)
-  color="secondary"
-  disabled={true}
->
-  <button
-    className="govgr-btn-secondary govgr-btn-disabled govgr-btn"
-    disabled={true}
-  >
-    hello
-  </button>
-</ForwardRef(Button)>
-`;
-
-exports[`renders the Button with color=warning 1`] = `
-<ForwardRef(Button)
-  color="warning"
->
-  <button
-    className="govgr-btn-warning govgr-btn"
-  >
-    hello
-  </button>
-</ForwardRef(Button)>
-`;
-
-exports[`renders the Button with color=warning with disabled=true 1`] = `
-<ForwardRef(Button)
-  color="warning"
-  disabled={true}
->
-  <button
-    className="govgr-btn-warning govgr-btn-disabled govgr-btn"
-    disabled={true}
-  >
-    hello
-  </button>
-</ForwardRef(Button)>
-`;
-
-exports[`renders the Button with disabled=false 1`] = `
-<ForwardRef(Button)
-  disabled={false}
->
-  <button
-    className="govgr-btn-primary govgr-btn"
-    disabled={false}
-  >
-    hello
-  </button>
-</ForwardRef(Button)>
-`;
-
-exports[`renders the Button with disabled=true 1`] = `
-<ForwardRef(Button)
-  disabled={true}
->
-  <button
-    className="govgr-btn-primary govgr-btn-disabled govgr-btn"
-    disabled={true}
-  >
-    hello
-  </button>
-</ForwardRef(Button)>
-`;
-
-exports[`renders the Button with no props 1`] = `
-<ForwardRef(Button)>
-  <button
-    className="govgr-btn-primary govgr-btn"
-  >
-    hello
-  </button>
-</ForwardRef(Button)>
-`;

package/src/Button/index.test.tsx

@@ -1,50 +0,0 @@
-import React from 'react';
-import { mount } from 'enzyme';
-
-import Button from '@digigov/react-core/Button';
-
-it('renders the Button with no props', () => {
-  expect(mount(<Button>hello</Button>)).toMatchSnapshot();
-});
-it('renders the Button with color=primary', () => {
-  expect(mount(<Button color={'primary'}>hello</Button>)).toMatchSnapshot();
-});
-it('renders the Button with color=secondary', () => {
-  expect(mount(<Button color={'secondary'}>hello</Button>)).toMatchSnapshot();
-});
-it('renders the Button with color=warning', () => {
-  expect(mount(<Button color={'warning'}>hello</Button>)).toMatchSnapshot();
-});
-it('renders the Button with disabled=true', () => {
-  expect(mount(<Button disabled={true}>hello</Button>)).toMatchSnapshot();
-});
-it('renders the Button with disabled=false', () => {
-  expect(mount(<Button disabled={false}>hello</Button>)).toMatchSnapshot();
-});
-it('renders the Button with color=primary with disabled=true', () => {
-  expect(
-    mount(
-      <Button disabled={true} color={'primary'}>
-        hello
-      </Button>
-    )
-  ).toMatchSnapshot();
-});
-it('renders the Button with color=secondary with disabled=true', () => {
-  expect(
-    mount(
-      <Button disabled={true} color={'secondary'}>
-        hello
-      </Button>
-    )
-  ).toMatchSnapshot();
-});
-it('renders the Button with color=warning with disabled=true', () => {
-  expect(
-    mount(
-      <Button disabled={true} color={'warning'}>
-        hello
-      </Button>
-    )
-  ).toMatchSnapshot();
-});

package/src/Button/index.tsx

@@ -1,47 +0,0 @@
-import React from 'react';
-import clsx from 'clsx';
-
-type ButtonElementAttributes = JSX.IntrinsicElements['button'];
-export interface ButtonProps extends ButtonElementAttributes {
-  /**
-   * color is optional.
-   * 'primary' color is used for the main call to action on a page.
-   * 'secondary' color is used for secondary calls to action on a page.
-   * 'warning' color is used to make users think carefully before they use them.
-   * The default value is 'primary'.
-   */
-  color?: 'primary' | 'secondary' | 'warning';
-
-  /**
-   * disabled is optional.
-   */
-  disabled?: boolean;
-}
-/**
- * Use the Button component to help users carry out an action.
- */
-export const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
-  function Button(
-    { color = 'primary', disabled, className, children, ...props },
-    ref
-  ) {
-    return (
-      <button
-        disabled={disabled}
-        ref={ref}
-        className={clsx(className, {
-          'govgr-btn': true,
-          'govgr-btn-primary': color === 'primary',
-          'govgr-btn-secondary': color === 'secondary',
-          'govgr-btn-warning': color === 'warning',
-          'govgr-btn-disabled': disabled === true,
-        })}
-        {...props}
-      >
-        {children}
-      </button>
-    );
-  }
-);
-
-export default Button;

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

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

package/src/ButtonGroup/index.test.tsx

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

package/src/ButtonGroup/index.tsx

@@ -1,25 +0,0 @@
-import React from 'react';
-import clsx from 'clsx';
-
-type DivElementAttributes = JSX.IntrinsicElements['div'];
-export interface ButtonGroupProps extends DivElementAttributes {}
-/**
- * Use a button group when two or more buttons are placed together.
- */
-export const ButtonGroup = React.forwardRef<HTMLDivElement, ButtonGroupProps>(
-  function ButtonGroup({ className, children, ...props }, ref) {
-    return (
-      <div
-        ref={ref}
-        className={clsx(className, {
-          'govgr-button-group': true,
-        })}
-        {...props}
-      >
-        {children}
-      </div>
-    );
-  }
-);
-
-export default ButtonGroup;

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

@@ -1,13 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`renders the CallToAction with no props 1`] = `
-<ForwardRef(CallToAction)>
-  <button
-    className="govgr-btn govgr-btn-primary govgr-btn-cta"
-  >
-    <span
-      className="right-arrow"
-    />
-  </button>
-</ForwardRef(CallToAction)>
-`;

package/src/CallToAction/index.test.tsx

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

package/src/CallToAction/index.tsx

@@ -1,41 +0,0 @@
-import React from 'react';
-import clsx from 'clsx';
-
-type ButtonElementAttributes = JSX.IntrinsicElements['button'];
-export interface CallToActionProps extends ButtonElementAttributes {
-  /**
-   * disabled is optional.
-   */
-  disabled?: boolean;
-}
-/**
- * Use this button for the main call to action on your service’s start page.
- */
-export const CallToAction = React.forwardRef<
-  HTMLButtonElement,
-  CallToActionProps
->(function CallToAction({ disabled, className, children, ...props }, ref) {
-  return (
-    <button
-      disabled={disabled}
-      ref={ref}
-      className={clsx(className, {
-        'govgr-btn': true,
-        'govgr-btn-primary': true,
-        'govgr-btn-cta': true,
-        'govgr-btn-disabled': disabled === true,
-      })}
-      {...props}
-    >
-      {children}
-      <span
-        ref={ref}
-        className={clsx(className, {
-          'right-arrow': true,
-        })}
-      ></span>
-    </button>
-  );
-});
-
-export default CallToAction;

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

@@ -1,35 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`renders the Checkbox with no props 1`] = `
-<ForwardRef(Checkbox)>
-  <div
-    className="govgr-checkboxes"
-  >
-    hello
-  </div>
-</ForwardRef(Checkbox)>
-`;
-
-exports[`renders the Checkbox with no props and CheckboxItem 1`] = `
-<ForwardRef(Checkbox)>
-  <div
-    className="govgr-checkboxes"
-  >
-    <ForwardRef(CheckboxItem)>
-      <div
-        className="govgr-checkboxes__item"
-      >
-        <input
-          className="govgr-checkboxes__input"
-          type="checkbox"
-        />
-        <label
-          className="govgr-label govgr-checkboxes__label"
-        >
-          This is item 1
-        </label>
-      </div>
-    </ForwardRef(CheckboxItem)>
-  </div>
-</ForwardRef(Checkbox)>
-`;

package/src/Checkbox/index.test.tsx

@@ -1,19 +0,0 @@
-import React from 'react';
-import { mount } from 'enzyme';
-
-import Checkbox from '@digigov/react-core/Checkbox';
-import CheckboxItem from '@digigov/react-core/CheckboxItem';
-
-it('renders the Checkbox with no props', () => {
-  expect(mount(<Checkbox>hello</Checkbox>)).toMatchSnapshot();
-});
-
-it('renders the Checkbox with no props and CheckboxItem', () => {
-  expect(
-    mount(
-      <Checkbox>
-        <CheckboxItem>This is item 1</CheckboxItem>
-      </Checkbox>
-    )
-  ).toMatchSnapshot();
-});

package/src/Checkbox/index.tsx

@@ -1,27 +0,0 @@
-import React from 'react';
-import clsx from 'clsx';
-
-type DivElementAttributes = JSX.IntrinsicElements['div'];
-export interface CheckboxProps extends DivElementAttributes {}
-/**
- * Details for the Checkbox.
- * Checkbox component allow the user to select one or more items from a set.
- * It takes CheckboxItem as children
- */
-export const Checkbox = React.forwardRef<HTMLDivElement, CheckboxProps>(
-  function Checkbox({ className, children, ...props }, ref) {
-    return (
-      <div
-        ref={ref}
-        className={clsx(className, {
-          'govgr-checkboxes': true,
-        })}
-        {...props}
-      >
-        {children}
-      </div>
-    );
-  }
-);
-
-export default Checkbox;

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

@@ -1,48 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`renders the Blockquote with name prop 1`] = `
-<ForwardRef(CheckboxConditional)
-  name="some-name"
->
-  <div
-    className="govgr-checkboxes__conditional"
-  >
-    <div
-      className="govgr-form-group"
-    >
-      <label
-        className="govgr-label"
-      >
-        hello
-      </label>
-      <input
-        className="govgr-input govgr-!-width-one-third"
-        name="some-name"
-        type="text"
-      />
-    </div>
-  </div>
-</ForwardRef(CheckboxConditional)>
-`;
-
-exports[`renders the Blockquote with no props 1`] = `
-<ForwardRef(CheckboxConditional)>
-  <div
-    className="govgr-checkboxes__conditional"
-  >
-    <div
-      className="govgr-form-group"
-    >
-      <label
-        className="govgr-label"
-      >
-        hello
-      </label>
-      <input
-        className="govgr-input govgr-!-width-one-third"
-        type="text"
-      />
-    </div>
-  </div>
-</ForwardRef(CheckboxConditional)>
-`;

package/src/CheckboxConditional/index.test.tsx

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