@digigov/react-core 1.0.0-266e80f3 → 1.0.0-3bfc7d37

package/src/RadioItem/index.test.tsx

@@ -17,8 +17,8 @@ it('renders the RadioItem  value props', () => {
   ).toMatchSnapshot();
 });
 
-it('renders the RadioItem  `divider` props', () => {
-  expect(mount(<RadioItem divider={'ή'}>hello</RadioItem>)).toMatchSnapshot();
+it('renders the RadioItem  `dividerText` props', () => {
+  expect(mount(<RadioItem dividerText={'ή'}>hello</RadioItem>)).toMatchSnapshot();
 });
 
 it('renders the RadioItem with name and value props', () => {
@@ -45,10 +45,10 @@ it('renders the RadioItem with name disabled and value props', () => {
   ).toMatchSnapshot();
 });
 
-it('renders the RadioItem with `name`, `disabled`, `divider` and `value` props', () => {
+it('renders the RadioItem with `name`, `disabled`, `dividerText` and `value` props', () => {
   expect(
     mount(
-      <RadioItem name={'name'} value={'someValue'} divider={'ή'} disabled>
+      <RadioItem name={'name'} value={'someValue'} dividerText={'ή'} disabled>
         hello
       </RadioItem>
     )

package/src/RadioItem/index.tsx

@@ -6,11 +6,11 @@ import LabelContainer from '@digigov/react-core/LabelContainer';
 
 export interface RadioItemProps extends BaseProps<'input'> {
   /**
-  * divider is optional.
-  * Add this prop to add a choice divider ontop of a radio item.
+  * dividerText is optional.
+  * Add this prop to add a choice dividerText on top of a radio item.
   * The string is the text that it will appear above this radio item.
   */
-  divider?: string;
+  dividerText?: string;
 }
 /**
  * RadioItem component is used for display radio buttons.
@@ -18,11 +18,11 @@ export interface RadioItemProps extends BaseProps<'input'> {
  */
 export const RadioItem = React.forwardRef<HTMLInputElement, RadioItemProps>(
   function RadioItem(
-    { divider, name, value, className, disabled = false, children, ...props },
+    { dividerText, name, value, className, disabled = false, children, ...props },
     ref
   ) {
     return <>
-      {divider && <ChoiceDividerText>{divider}</ChoiceDividerText>}
+      {dividerText && <ChoiceDividerText>{dividerText}</ChoiceDividerText>}
       <div
         className={clsx(className, {
           'govgr-radios__item': true,

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

@@ -1,5 +1,22 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
+exports[`renders the StepNav with dense props 1`] = `
+<ForwardRef(StepNav)
+  dense={true}
+>
+  <ForwardRef(Base)
+    as="div"
+    className="govgr-step--dense govgr-step-nav"
+  >
+    <div
+      className="govgr-step--dense govgr-step-nav"
+    >
+      hello
+    </div>
+  </ForwardRef(Base)>
+</ForwardRef(StepNav)>
+`;
+
 exports[`renders the StepNav with no props 1`] = `
 <ForwardRef(StepNav)>
   <ForwardRef(Base)

package/src/StepNav/index.test.tsx

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

package/src/StepNav/index.tsx

@@ -2,19 +2,28 @@ import React from 'react';
 import clsx from 'clsx';
 import Base, { BaseProps } from '@digigov/react-core/Base';
 
-export interface StepNavProps extends BaseProps<'div'> {}
+export interface StepNavProps extends BaseProps<'div'> {
+  /**
+  * dense is optional.
+  * @value true StepNav will be dense.
+  * @value false
+  * @default false
+  * */
+  dense?: boolean;
+}
 /**
  * StepNav contains the content or any other element for step-by-step implementation.
  * Use StepNav as wrapper component.
  */
 export const StepNav = React.forwardRef<HTMLDivElement, StepNavProps>(
-  function StepNav({ className, children, ...props }, ref) {
+  function StepNav({ className, dense, children, ...props }, ref) {
     return (
       <Base
         as="div"
         ref={ref}
         className={clsx(className, {
           'govgr-step-nav': true,
+          'govgr-step-nav--dense': dense,
         })}
         {...props}
       >

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

@@ -1,5 +1,22 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
+exports[`renders the TaskList with dense prop 1`] = `
+<ForwardRef(TaskList)
+  dense={true}
+>
+  <ForwardRef(Base)
+    as="ol"
+    className="govgr-task--dense govgr-task-list"
+  >
+    <ol
+      className="govgr-task--dense govgr-task-list"
+    >
+      hello
+    </ol>
+  </ForwardRef(Base)>
+</ForwardRef(TaskList)>
+`;
+
 exports[`renders the TaskList with no prop 1`] = `
 <ForwardRef(TaskList)>
   <ForwardRef(Base)

package/src/TaskList/index.test.tsx

@@ -6,3 +6,7 @@ import TaskList from '@digigov/react-core/TaskList';
 it('renders the TaskList with no prop', () => {
   expect(mount(<TaskList>hello</TaskList>)).toMatchSnapshot();
 });
+
+it('renders the TaskList with dense prop', () => {
+  expect(mount(<TaskList dense>hello</TaskList>)).toMatchSnapshot();
+});

package/src/TaskList/index.tsx

@@ -2,19 +2,28 @@ import React from 'react';
 import clsx from 'clsx';
 import Base, { BaseProps } from '@digigov/react-core/Base';
 
-export interface TaskListProps extends BaseProps<'ol'> {}
+export interface TaskListProps extends BaseProps<'ol'> {
+  /**
+   * dense is optional.
+   * @value true TaskList will be dense.
+   * @value false
+   * @default false
+   * */
+  dense?: boolean;
+}
 /**
  * TaskList component is used for listing items.
  * This component must contain TaskListItem component.
  */
 export const TaskList = React.forwardRef<HTMLOListElement, TaskListProps>(
-  function TaskList({ className, children, ...props }, ref) {
+  function TaskList({ className, dense, children, ...props }, ref) {
     return (
       <Base
         as="ol"
         ref={ref}
         className={clsx(className, {
           'govgr-task-list': true,
+          'govgr-task-list--dense': dense,
         })}
         {...props}
       >

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

@@ -1,5 +1,22 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
+exports[`renders the Timeline with dense prop 1`] = `
+<ForwardRef(Timeline)
+  dense={true}
+>
+  <ForwardRef(Base)
+    as="ol"
+    className="govgr-timeline--dense govgr-timeline"
+  >
+    <ol
+      className="govgr-timeline--dense govgr-timeline"
+    >
+      hello
+    </ol>
+  </ForwardRef(Base)>
+</ForwardRef(Timeline)>
+`;
+
 exports[`renders the Timeline with no prop 1`] = `
 <ForwardRef(Timeline)>
   <ForwardRef(Base)

package/src/Timeline/index.test.tsx

@@ -6,3 +6,7 @@ import Timeline from '@digigov/react-core/Timeline';
 it('renders the Timeline with no prop', () => {
   expect(mount(<Timeline>hello</Timeline>)).toMatchSnapshot();
 });
+
+it('renders the Timeline with dense prop', () => {
+  expect(mount(<Timeline dense>hello</Timeline>)).toMatchSnapshot();
+});

package/src/Timeline/index.tsx

@@ -4,8 +4,8 @@ import Base, { BaseProps } from '@digigov/react-core/Base';
 
 export interface TimelineProps extends BaseProps<'ol'> {
   /**
-   * spaced is optional. Use it to add space between the list items.
-   * @value true
+   * dense is optional.
+   * @value true Timeline will be dense.
    * @value false
    * @default true
    */
@@ -16,14 +16,14 @@ export interface TimelineProps extends BaseProps<'ol'> {
  * This component must contain TimelineItem component.
  */
 export const Timeline = React.forwardRef<HTMLOListElement, TimelineProps>(
-  function Timeline({ dense = true, className, children, ...props }, ref) {
+  function Timeline({ dense, className, children, ...props }, ref) {
     return (
       <Base
         as="ol"
         ref={ref}
         className={clsx(className, {
           'govgr-timeline': true,
-          'govgr-timeline--spaced': !dense,
+          'govgr-timeline--dense': dense,
         })}
         {...props}
       >

package/src/registry.js

@@ -255,7 +255,7 @@ function lazyImport(pkgImport) {
       get: (_target, name) => {
         if (name === '__esModule' || name === 'default') {
           return pkgImport.default;
-        } else if (
+        } else if(
           name === '*'
         ) {
           return pkgImport;
@@ -516,3 +516,4 @@ export default {
   '@digigov/react-core/VisuallyHidden': lazyImport(_digigov_react_core_VisuallyHidden),
   '@digigov/react-core/WarningText': lazyImport(_digigov_react_core_WarningText)
 };
+