fhir-react 0.3.8 → 0.3.11

package/src/components/resources/FamilyMemberHistory/FamilyMemberHistory.stories.js

@@ -1,5 +1,5 @@
 import React from 'react';
-import { object } from '@storybook/addon-knobs';
+import { defaultArgTypes } from '../../defaultArgTypes';
 
 import FamilyMemberHistory from './FamilyMemberHistory';
 import fhirVersions from '../fhirResourceVersions';
@@ -12,38 +12,32 @@ import fhirIcons from '../../../fixtures/example-icons';
 import FamilyMemberHistoryIcon from '../../../assets/containers/FamilyMemberHistory/family-member-history.svg';
 
 export default {
-  title: 'FamilyMemberHistory',
+  title: 'Coverage/FamilyMemberHistory',
+  component: FamilyMemberHistory,
+  argTypes: {
+    ...defaultArgTypes,
+  },
 };
 
-export const DefaultVisualizationDSTU2 = () => {
-  const fhirResource = object('Resource', example1DSTU2);
-  return (
-    <FamilyMemberHistory
-      fhirVersion={fhirVersions.DSTU2}
-      fhirResource={fhirResource}
-      fhirIcons={require('../../../assets/containers/FamilyMemberHistory/family-member-history.svg')}
-    />
-  );
+const Template = args => <FamilyMemberHistory {...args} />;
+
+export const DefaultVisualizationDSTU2 = Template.bind({});
+DefaultVisualizationDSTU2.args = {
+  fhirVersion: fhirVersions.DSTU2,
+  fhirResource: example1DSTU2,
+  fhirIcons: require('../../../assets/containers/FamilyMemberHistory/family-member-history.svg'),
 };
 
-export const Example1OfSTU3 = () => {
-  const fhirResource = object('Resource', example1STU3);
-  return (
-    <FamilyMemberHistory
-      fhirVersion={fhirVersions.STU3}
-      fhirResource={fhirResource}
-      fhirIcons={FamilyMemberHistoryIcon}
-    />
-  );
+export const Example1OfSTU3 = Template.bind({});
+Example1OfSTU3.args = {
+  fhirVersion: fhirVersions.STU3,
+  fhirResource: example1STU3,
+  fhirIcons: FamilyMemberHistoryIcon,
 };
 
-export const Example2OfSTU3 = () => {
-  const fhirResource = object('Resource', example2STU3);
-  return (
-    <FamilyMemberHistory
-      fhirVersion={fhirVersions.STU3}
-      fhirResource={fhirResource}
-      fhirIcons={fhirIcons}
-    />
-  );
+export const Example2OfSTU3 = Template.bind({});
+Example2OfSTU3.args = {
+  fhirVersion: fhirVersions.STU3,
+  fhirResource: example2STU3,
+  fhirIcons: fhirIcons,
 };

package/src/components/resources/Generic/Generic.js

@@ -4,7 +4,7 @@ import _get from 'lodash/get';
 import { Root, Header } from '../../ui';
 import Accordion from '../../containers/Accordion';
 
-const Generic = ({ fhirResource, fhirIcons, onClick }) => {
+const Generic = ({ fhirResource, fhirIcons, onClick, rawOnClick }) => {
   const title = fhirResource
     ? `${fhirResource.resourceType}/${fhirResource.id}`
     : `Unknown Resource`;
@@ -30,6 +30,7 @@ const Generic = ({ fhirResource, fhirIcons, onClick }) => {
           />
         }
         onClick={onClick}
+        rawOnClick={rawOnClick}
       />
     </Root>
   );

package/src/components/resources/Generic/Generic.stories.js

@@ -1,19 +1,28 @@
 import React from 'react';
-import { object } from '@storybook/addon-knobs';
+import { defaultArgTypes } from '../../defaultArgTypes';
 
 import Generic from './Generic';
 import fhirIcons from '../../../fixtures/example-icons';
 
-export default { title: 'Generic' };
+export default {
+  title: 'Generic',
+  component: Generic,
+  argTypes: {
+    ...defaultArgTypes,
+  },
+};
+
+const Template = args => <Generic {...args} />;
 
-export const DefaultVisualization = () => {
-  const exampleResource = {
-    resourceType: 'UnknownResource',
-    id: '12345',
-    code: {
-      text: 'Resource code text',
-    },
-  };
-  const fhirResource = object('Resource', exampleResource);
-  return <Generic fhirResource={fhirResource} fhirIcons={fhirIcons} />;
+const exampleResource = {
+  resourceType: 'UnknownResource',
+  id: '12345',
+  code: {
+    text: 'Resource code text',
+  },
+};
+export const DefaultVisualization = Template.bind({});
+DefaultVisualization.args = {
+  fhirResource: exampleResource,
+  fhirIcons: fhirIcons,
 };

package/src/components/resources/Goal/Goal.js

@@ -99,7 +99,13 @@ const resourceDTO = (fhirVersion, fhirResource) => {
   }
 };
 
-const Goal = ({ fhirResource, fhirVersion, fhirIcons, onClick }) => {
+const Goal = ({
+  fhirResource,
+  fhirVersion,
+  fhirIcons,
+  onClick,
+  rawOnClick,
+}) => {
   let fhirResourceData = {};
   try {
     fhirResourceData = resourceDTO(fhirVersion, fhirResource);
@@ -228,6 +234,7 @@ const Goal = ({ fhirResource, fhirVersion, fhirIcons, onClick }) => {
         }
         bodyContent={<Body tableData={tableData} />}
         onClick={onClick}
+        rawOnClick={rawOnClick}
       />
     </Root>
   );

package/src/components/resources/Goal/Goal.stories.js

@@ -1,5 +1,5 @@
 import React from 'react';
-import { object } from '@storybook/addon-knobs';
+import { defaultArgTypes } from '../../defaultArgTypes';
 
 import Goal from './Goal';
 import fhirIcons from '../../../fixtures/example-icons';
@@ -13,64 +13,50 @@ import GoalIcon from '../../../assets/containers/Goal/goal.svg';
 
 export default {
   title: 'Goal',
+  component: Goal,
+  argTypes: {
+    ...defaultArgTypes,
+  },
 };
 
-export const DefaultVisualizationDSTU2 = () => {
-  const fhirResource = object('Resource', dstu2Example1);
-  return (
-    <Goal
-      fhirVersion={fhirVersions.DSTU2}
-      fhirResource={fhirResource}
-      fhirIcons={require('../../../assets/containers/Goal/goal.svg')}
-    />
-  );
+const Template = args => <Goal {...args} />;
+
+export const DefaultVisualizationDSTU2 = Template.bind({});
+DefaultVisualizationDSTU2.args = {
+  fhirVersion: fhirVersions.DSTU2,
+  fhirResource: dstu2Example1,
+  fhirIcons: require('../../../assets/containers/Goal/goal.svg'),
 };
 
-export const Example2OfDSTU2 = () => {
-  const fhirResource = object('Resource', dstu2Example2);
-  return (
-    <Goal
-      fhirVersion={fhirVersions.DSTU2}
-      fhirResource={fhirResource}
-      fhirIcons={GoalIcon}
-    />
-  );
+export const Example2OfDSTU2 = Template.bind({});
+Example2OfDSTU2.args = {
+  fhirVersion: fhirVersions.DSTU2,
+  fhirResource: dstu2Example2,
+  fhirIcons: GoalIcon,
 };
 
-export const ExampleOfSTU3 = () => {
-  const fhirResource = object('Resource', stu3Example1);
-  return (
-    <Goal
-      fhirVersion={fhirVersions.STU3}
-      fhirResource={fhirResource}
-      fhirIcons={fhirIcons}
-    />
-  );
+export const ExampleOfSTU3 = Template.bind({});
+ExampleOfSTU3.args = {
+  fhirVersion: fhirVersions.STU3,
+  fhirResource: stu3Example1,
+  fhirIcons: fhirIcons,
 };
 
-export const Example1OfR4 = () => {
-  const fhirResource = object('Resource', r4Example1);
-  return (
-    <Goal
-      fhirVersion={fhirVersions.R4}
-      fhirResource={fhirResource}
-      fhirIcons={false}
-    />
-  );
+export const Example1OfR4 = Template.bind({});
+Example1OfR4.args = {
+  fhirVersion: fhirVersions.R4,
+  fhirResource: r4Example1,
+  fhirIcons: false,
 };
 
-export const Example2OfR4 = () => {
-  const fhirResource = object('Resource', r4Example2);
-  return (
-    <Goal
-      fhirVersion={fhirVersions.R4}
-      fhirResource={fhirResource}
-      fhirIcons={'random text'}
-    />
-  );
+export const Example2OfR4 = Template.bind({});
+Example2OfR4.args = {
+  fhirVersion: fhirVersions.R4,
+  fhirResource: r4Example2,
+  fhirIcons: 'random text',
 };
 
-export const ExampleWithoutFhirVersionProperty = () => {
-  const fhirResource = object('Resource', stu3Example1);
-  return <Goal fhirResource={fhirResource} fhirIcons={fhirIcons} />;
+export const ExampleWithoutFhirVersionProperty = Template.bind({});
+ExampleWithoutFhirVersionProperty.args = {
+  fhirResource: stu3Example1,
 };

package/src/components/resources/Immunization/Immunization.js

@@ -103,7 +103,13 @@ const resourceDTO = (fhirVersion, fhirResource) => {
   }
 };
 
-const Immunization = ({ fhirVersion, fhirResource, fhirIcons, onClick }) => {
+const Immunization = ({
+  fhirVersion,
+  fhirResource,
+  fhirIcons,
+  onClick,
+  rawOnClick,
+}) => {
   const {
     title,
     status,
@@ -241,6 +247,7 @@ const Immunization = ({ fhirVersion, fhirResource, fhirIcons, onClick }) => {
         }
         bodyContent={<Body tableData={tableData} />}
         onClick={onClick}
+        rawOnClick={rawOnClick}
       />
     </Root>
   );

package/src/components/resources/Immunization/Immunization.stories.js

@@ -1,5 +1,5 @@
 import React from 'react';
-import { object } from '@storybook/addon-knobs';
+import { defaultArgTypes } from '../../defaultArgTypes';
 
 import Immunization from './Immunization';
 
@@ -15,64 +15,51 @@ import ImmunizationIcon from '../../../assets/containers/Immunization/immunizati
 
 export default {
   title: 'Immunization',
+  component: Immunization,
+  argTypes: {
+    ...defaultArgTypes,
+  },
 };
 
-export const DefaultVisualizationDSTU2 = () => {
-  const fhirResource = object('Resource', example1);
-  return (
-    <Immunization
-      fhirResource={fhirResource}
-      fhirVersion={fhirVersions.DSTU2}
-      fhirIcons={require('../../../assets/containers/Immunization/immunization.svg')}
-    />
-  );
+const Template = args => <Immunization {...args} />;
+
+export const DefaultVisualizationDSTU2 = Template.bind({});
+DefaultVisualizationDSTU2.args = {
+  fhirVersion: fhirVersions.DSTU2,
+  fhirResource: example1,
+  fhirIcons: require('../../../assets/containers/Immunization/immunization.svg'),
 };
 
-export const Example2OfDSTU2 = () => {
-  const fhirResource = object('Resource', example2);
-  return (
-    <Immunization
-      fhirResource={fhirResource}
-      fhirVersion={fhirVersions.DSTU2}
-      fhirIcons={ImmunizationIcon}
-    />
-  );
+export const Example2OfDSTU2 = Template.bind({});
+Example2OfDSTU2.args = {
+  fhirVersion: fhirVersions.DSTU2,
+  fhirResource: example2,
+  fhirIcons: ImmunizationIcon,
 };
 
-export const ExampleSTU3 = () => {
-  const fhirResource = object('Resource', stu3Example);
-  return (
-    <Immunization
-      fhirResource={fhirResource}
-      fhirVersion={fhirVersions.STU3}
-      fhirIcons={fhirIcons}
-    />
-  );
+export const ExampleSTU3 = Template.bind({});
+ExampleSTU3.args = {
+  fhirVersion: fhirVersions.STU3,
+  fhirResource: stu3Example,
+  fhirIcons: fhirIcons,
 };
 
-export const Example1R4 = () => {
-  const fhirResource = object('Resource', r4Example1);
-  return (
-    <Immunization
-      fhirResource={fhirResource}
-      fhirVersion={fhirVersions.R4}
-      fhirIcons={false}
-    />
-  );
+export const Example1R4 = Template.bind({});
+Example1R4.args = {
+  fhirVersion: fhirVersions.R4,
+  fhirResource: r4Example1,
+  fhirIcons: false,
 };
-export const Example2R4 = () => {
-  const fhirResource = object('Resource', r4Example2);
-  return (
-    <Immunization
-      fhirResource={fhirResource}
-      fhirVersion={fhirVersions.R4}
-      fhirIcons={'random text'}
-    />
-  );
+
+export const Example2R4 = Template.bind({});
+Example2R4.args = {
+  fhirVersion: fhirVersions.R4,
+  fhirResource: r4Example2,
+  fhirIcons: 'random text',
 };
-export const Example3R4 = () => {
-  const fhirResource = object('Resource', r4Example3);
-  return (
-    <Immunization fhirResource={fhirResource} fhirVersion={fhirVersions.R4} />
-  );
+
+export const Example3R4 = Template.bind({});
+Example3R4.args = {
+  fhirVersion: fhirVersions.R4,
+  fhirResource: r4Example3,
 };

package/src/components/resources/List/List.js

@@ -131,6 +131,7 @@ const List = ({
   withDaVinciPDex = false,
   fhirIcons,
   onClick,
+  rawOnClick,
 }) => {
   let fhirResourceData = {};
   try {
@@ -291,6 +292,7 @@ const List = ({
           </Body>
         }
         onClick={onClick}
+        rawOnClick={rawOnClick}
       />
     </Root>
   );

package/src/components/resources/List/List.stories.js

@@ -1,5 +1,5 @@
 import React from 'react';
-import { object } from '@storybook/addon-knobs';
+import { defaultArgTypes } from '../../defaultArgTypes';
 
 import List from './List';
 import fhirVersions from '../fhirResourceVersions';
@@ -19,90 +19,86 @@ import ListIcon from '../../../assets/containers/List/list.svg';
 
 export default {
   title: 'List',
+  component: List,
+  argTypes: {
+    ...defaultArgTypes,
+    withDaVinciPDex: {
+      table: {
+        disable: true,
+      },
+    },
+  },
 };
 
-export const DefaultVisualizationDSTU2 = () => {
-  const fhirResource = object('Resource', example1Dstu2);
-  return (
-    <List
-      fhirVersion={fhirVersions.DSTU2}
-      fhirResource={fhirResource}
-      fhirIcons={require('../../../assets/containers/List/list.svg')}
-    />
-  );
+const Template = args => <List {...args} />;
+
+export const DefaultVisualizationDSTU2 = Template.bind({});
+DefaultVisualizationDSTU2.args = {
+  fhirVersion: fhirVersions.DSTU2,
+  fhirResource: example1Dstu2,
+  fhirIcons: require('../../../assets/containers/List/list.svg'),
 };
 
-export const Example2DSTU2 = () => {
-  const fhirResource = object('Resource', example2Dstu2);
-  return (
-    <List
-      fhirVersion={fhirVersions.DSTU2}
-      fhirResource={fhirResource}
-      fhirIcons={ListIcon}
-    />
-  );
+export const Example2DSTU2 = Template.bind({});
+Example2DSTU2.args = {
+  fhirVersion: fhirVersions.DSTU2,
+  fhirResource: example2Dstu2,
+  fhirIcons: ListIcon,
 };
-export const Example3DSTU2 = () => {
-  const fhirResource = object('Resource', example3Dstu2);
-  return (
-    <List
-      fhirVersion={fhirVersions.DSTU2}
-      fhirResource={fhirResource}
-      fhirIcons={fhirIcons}
-    />
-  );
+
+export const Example3DSTU2 = Template.bind({});
+Example3DSTU2.args = {
+  fhirVersion: fhirVersions.DSTU2,
+  fhirResource: example3Dstu2,
+  fhirIcons: fhirIcons,
 };
 
-export const DefaultVisualizationSTU3 = () => {
-  const fhirResource = object('Resource', example1Stu3);
-  return (
-    <List
-      fhirVersion={fhirVersions.STU3}
-      fhirResource={fhirResource}
-      fhirIcons={false}
-    />
-  );
+export const DefaultVisualizationSTU3 = Template.bind({});
+DefaultVisualizationSTU3.args = {
+  fhirVersion: fhirVersions.STU3,
+  fhirResource: example1Stu3,
+  fhirIcons: false,
 };
 
-export const Example2STU3 = () => {
-  const fhirResource = object('Resource', example2Stu3);
-  return (
-    <List
-      fhirVersion={fhirVersions.STU3}
-      fhirResource={fhirResource}
-      fhirIcons={'random text'}
-    />
-  );
+export const Example2STU3 = Template.bind({});
+Example2STU3.args = {
+  fhirVersion: fhirVersions.STU3,
+  fhirResource: example2Stu3,
+  fhirIcons: 'random text',
 };
-export const Example3STU3 = () => {
-  const fhirResource = object('Resource', example3Stu3);
-  return <List fhirVersion={fhirVersions.STU3} fhirResource={fhirResource} />;
+
+export const Example3STU3 = Template.bind({});
+Example3STU3.args = {
+  fhirVersion: fhirVersions.STU3,
+  fhirResource: example3Stu3,
 };
 
-export const DefaultVisualizationR4 = () => {
-  const fhirResource = object('Resource', example1R4);
-  return <List fhirVersion={fhirVersions.R4} fhirResource={fhirResource} />;
+export const DefaultVisualizationR4 = Template.bind({});
+DefaultVisualizationR4.args = {
+  fhirVersion: fhirVersions.R4,
+  fhirResource: example1R4,
 };
-export const ExampleR4WithoutDaVinciPDex = () => {
-  const fhirResource = object('Resource', example2R4);
-  return <List fhirVersion={fhirVersions.R4} fhirResource={fhirResource} />;
+
+export const ExampleR4WithoutDaVinciPDex = Template.bind({});
+ExampleR4WithoutDaVinciPDex.args = {
+  fhirVersion: fhirVersions.R4,
+  fhirResource: example2R4,
 };
-export const ExampleR4WithDaVinciPDex = () => {
-  const fhirResource = object('Resource', example2R4);
-  return (
-    <List
-      fhirVersion={fhirVersions.R4}
-      fhirResource={fhirResource}
-      withDaVinciPDex
-    />
-  );
+
+export const ExampleR4WithDaVinciPDex = Template.bind({});
+ExampleR4WithDaVinciPDex.args = {
+  fhirVersion: fhirVersions.R4,
+  fhirResource: example2R4,
+  withDaVinciPDex: true,
 };
-export const Example2R4 = () => {
-  const fhirResource = object('Resource', example3R4);
-  return <List fhirVersion={fhirVersions.R4} fhirResource={fhirResource} />;
+
+export const Example2R4 = Template.bind({});
+Example2R4.args = {
+  fhirVersion: fhirVersions.R4,
+  fhirResource: example3R4,
 };
 
-export const ExampleWithoutFHIRVersionProperty = () => {
-  const fhirResource = object('Resource', example3R4);
-  return <List fhirResource={fhirResource} />;
+export const ExampleWithoutFHIRVersionProperty = Template.bind({});
+ExampleWithoutFHIRVersionProperty.args = {
+  fhirResource: example3R4,
 };

package/src/components/resources/Location/Location.js

@@ -9,7 +9,7 @@ import CodeableConcept from '../../datatypes/CodeableConcept';
 import Reference from '../../datatypes/Reference';
 import Accordion from '../../containers/Accordion';
 
-const Location = ({ fhirResource, fhirIcons, onClick }) => {
+const Location = ({ fhirResource, fhirIcons, onClick, rawOnClick }) => {
   const name = _get(fhirResource, 'name');
   const status = _get(fhirResource, 'status');
   const description = _get(fhirResource, 'description');
@@ -82,6 +82,7 @@ const Location = ({ fhirResource, fhirIcons, onClick }) => {
         }
         bodyContent={<Body tableData={tableData} />}
         onClick={onClick}
+        rawOnClick={rawOnClick}
       />
     </Root>
   );

package/src/components/resources/Location/Location.stories.js

@@ -1,5 +1,5 @@
 import React from 'react';
-import { object } from '@storybook/addon-knobs';
+import { defaultArgTypes } from '../../defaultArgTypes';
 
 import Location from './Location';
 
@@ -12,29 +12,34 @@ import LocationIcon from '../../../assets/containers/Location/location.svg';
 
 export default {
   title: 'Location',
+  component: Location,
+  argTypes: {
+    ...defaultArgTypes,
+  },
 };
 
-export const DefaultVisualizationDSTU2 = () => {
-  const fhirResource = object('Resource', dstu2Example1);
-  return (
-    <Location
-      fhirResource={fhirResource}
-      fhirIcons={require('../../../assets/containers/Location/location.svg')}
-    />
-  );
+const Template = args => <Location {...args} />;
+
+export const DefaultVisualizationDSTU2 = Template.bind({});
+DefaultVisualizationDSTU2.args = {
+  fhirResource: dstu2Example1,
+  fhirIcons: require('../../../assets/containers/Location/location.svg'),
 };
 
-export const ExampleOfSTU3 = () => {
-  const fhirResource = object('Resource', stu3Example1);
-  return <Location fhirResource={fhirResource} fhirIcons={LocationIcon} />;
+export const ExampleOfSTU3 = Template.bind({});
+ExampleOfSTU3.args = {
+  fhirResource: stu3Example1,
+  fhirIcons: LocationIcon,
 };
 
-export const Example1OfR4 = () => {
-  const fhirResource = object('Resource', r4Example1);
-  return <Location fhirResource={fhirResource} fhirIcons={fhirIcons} />;
+export const Example1OfR4 = Template.bind({});
+Example1OfR4.args = {
+  fhirResource: r4Example1,
+  fhirIcons: fhirIcons,
 };
 
-export const Example2OfR4 = () => {
-  const fhirResource = object('Resource', r4Example2);
-  return <Location fhirResource={fhirResource} fhirIcons={false} />;
+export const Example2OfR4 = Template.bind({});
+Example2OfR4.args = {
+  fhirResource: r4Example2,
+  fhirIcons: false,
 };

package/src/components/resources/Medication/Medication.js

@@ -162,7 +162,13 @@ const Ingredient = props => {
   );
 };
 
-const Medication = ({ fhirResource, fhirVersion, fhirIcons, onClick }) => {
+const Medication = ({
+  fhirResource,
+  fhirVersion,
+  fhirIcons,
+  onClick,
+  rawOnClick,
+}) => {
   let fhirResourceData = {};
   try {
     fhirResourceData = resourceDTO(fhirVersion, fhirResource);
@@ -274,6 +280,7 @@ const Medication = ({ fhirResource, fhirVersion, fhirIcons, onClick }) => {
           </Body>
         }
         onClick={onClick}
+        rawOnClick={rawOnClick}
       />
     </Root>
   );