fhir-react 0.3.9 → 0.3.12

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

@@ -168,6 +168,7 @@ const Medication = ({
   fhirIcons,
   onClick,
   rawOnClick,
+  customId,
 }) => {
   let fhirResourceData = {};
   try {
@@ -281,6 +282,7 @@ const Medication = ({
         }
         onClick={onClick}
         rawOnClick={rawOnClick}
+        customId={customId}
       />
     </Root>
   );

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

@@ -1,5 +1,5 @@
 import React from 'react';
-import { object } from '@storybook/addon-knobs';
+import { defaultArgTypes } from '../../defaultArgTypes';
 
 import Medication from './Medication';
 import fhirVersions from '../fhirResourceVersions';
@@ -16,79 +16,57 @@ import MedicationIcon from '../../../assets/containers/Medication/medication.svg
 
 export default {
   title: 'Medication',
+  component: Medication,
+  argTypes: {
+    ...defaultArgTypes,
+  },
 };
 
-export const DefaultVisualizationDSTU2 = () => {
-  const fhirResource = object('Resource', dstu2Example1);
-  return (
-    <Medication
-      fhirVersion={fhirVersions.DSTU2}
-      fhirResource={fhirResource}
-      fhirIcons={require('../../../assets/containers/Medication/medication.svg')}
-    />
-  );
+const Template = args => <Medication {...args} />;
+
+export const DefaultVisualizationDSTU2 = Template.bind({});
+DefaultVisualizationDSTU2.args = {
+  fhirVersion: fhirVersions.DSTU2,
+  fhirResource: dstu2Example1,
+  fhirIcons: require('../../../assets/containers/Medication/medication.svg'),
 };
 
-export const Example2OfDSTU2 = () => {
-  const fhirResource = object('Resource', dstu2Example2);
-  return (
-    <Medication
-      fhirVersion={fhirVersions.DSTU2}
-      fhirResource={fhirResource}
-      fhirIcons={MedicationIcon}
-    />
-  );
+export const Example2OfDSTU2 = Template.bind({});
+Example2OfDSTU2.args = {
+  fhirVersion: fhirVersions.DSTU2,
+  fhirResource: dstu2Example2,
+  fhirIcons: MedicationIcon,
 };
 
-export const Example1OfSTU3 = () => {
-  const fhirResource = object('Resource', stu3Example1);
-  return (
-    <Medication
-      fhirVersion={fhirVersions.STU3}
-      fhirResource={fhirResource}
-      fhirIcons={fhirIcons}
-    />
-  );
+export const Example1OfSTU3 = Template.bind({});
+Example1OfSTU3.args = {
+  fhirVersion: fhirVersions.STU3,
+  fhirResource: stu3Example1,
+  fhirIcons: fhirIcons,
 };
 
-export const Example2OfSTU3 = () => {
-  const fhirResource = object('Resource', stu3Example2);
-  return (
-    <Medication
-      fhirVersion={fhirVersions.STU3}
-      fhirResource={fhirResource}
-      fhirIcons={false}
-    />
-  );
+export const Example2OfSTU3 = Template.bind({});
+Example2OfSTU3.args = {
+  fhirVersion: fhirVersions.STU3,
+  fhirResource: stu3Example2,
+  fhirIcons: false,
 };
 
-export const Example1OfR4 = () => {
-  const fhirResource = object('Resource', r4Example1);
-  return (
-    <Medication
-      fhirVersion={fhirVersions.R4}
-      fhirResource={fhirResource}
-      fhirIcons={'random text'}
-    />
-  );
+export const Example1OfR4 = Template.bind({});
+Example1OfR4.args = {
+  fhirVersion: fhirVersions.R4,
+  fhirResource: r4Example1,
+  fhirIcons: 'random text',
 };
-export const Example2OfR4 = () => {
-  const fhirResource = object('Resource', r4Example2);
-  return (
-    <Medication
-      fhirVersion={fhirVersions.R4}
-      fhirResource={fhirResource}
-      fhirIcons={fhirIcons}
-    />
-  );
+
+export const Example2OfR4 = Template.bind({});
+Example2OfR4.args = {
+  fhirVersion: fhirVersions.R4,
+  fhirResource: r4Example2,
 };
-export const Example3OfR4 = () => {
-  const fhirResource = object('Resource', r4Example3);
-  return (
-    <Medication
-      fhirVersion={fhirVersions.R4}
-      fhirResource={fhirResource}
-      fhirIcons={fhirIcons}
-    />
-  );
+
+export const Example3OfR4 = Template.bind({});
+Example3OfR4.args = {
+  fhirVersion: fhirVersions.R4,
+  fhirResource: r4Example3,
 };

package/src/components/resources/MedicationAdministration/MedicationAdministration.js

@@ -28,12 +28,11 @@ const commonDTO = fhirResource => {
 
   return {
     medicationReference,
-
     dosageRoute,
-
     status,
   };
 };
+
 const dstu2DTO = fhirResource => {
   const periodTimeStart = _get(fhirResource, 'effectiveTimePeriod.start');
   const periodTimeEnd = _get(fhirResource, 'effectiveTimePeriod.end');
@@ -50,6 +49,7 @@ const dstu2DTO = fhirResource => {
     dosageQuantity,
   };
 };
+
 const stu3DTO = fhirResource => {
   const periodTimeStart = _get(fhirResource, 'effectivePeriod.start');
   const periodTimeEnd = _get(fhirResource, 'effectivePeriod.end');
@@ -116,6 +116,7 @@ const MedicationAdministration = ({
   fhirIcons,
   onClick,
   rawOnClick,
+  customId,
 }) => {
   let fhirResourceData = {};
   try {
@@ -215,6 +216,7 @@ const MedicationAdministration = ({
         }
         onClick={onClick}
         rawOnClick={rawOnClick}
+        customId={customId}
       />
     </Root>
   );

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

@@ -1,5 +1,5 @@
 import React from 'react';
-import { object } from '@storybook/addon-knobs';
+import { defaultArgTypes } from '../../defaultArgTypes';
 
 import MedicationAdministration from './MedicationAdministration';
 
@@ -14,59 +14,45 @@ import MedicationAdministrationIcon from '../../../assets/containers/MedicationA
 
 export default {
   title: 'MedicationAdministration',
+  component: MedicationAdministration,
+  argTypes: {
+    ...defaultArgTypes,
+  },
 };
 
-export const DefaultVisualizationDSTU2 = () => {
-  const fhirResource = object('Resource', dstu2Example1);
-  return (
-    <MedicationAdministration
-      fhirVersion={fhirVersions.DSTU2}
-      fhirResource={fhirResource}
-      fhirIcons={require('../../../assets/containers/MedicationAdministration/medication-administration.svg')}
-    />
-  );
+const Template = args => <MedicationAdministration {...args} />;
+
+export const DefaultVisualizationDSTU2 = Template.bind({});
+DefaultVisualizationDSTU2.args = {
+  fhirVersion: fhirVersions.DSTU2,
+  fhirResource: dstu2Example1,
+  fhirIcons: require('../../../assets/containers/MedicationAdministration/medication-administration.svg'),
 };
 
-export const ExampleOfSTU3 = () => {
-  const fhirResource = object('Resource', stu3Example1);
-  return (
-    <MedicationAdministration
-      fhirVersion={fhirVersions.STU3}
-      fhirResource={fhirResource}
-      fhirIcons={MedicationAdministrationIcon}
-    />
-  );
+export const ExampleOfSTU3 = Template.bind({});
+ExampleOfSTU3.args = {
+  fhirVersion: fhirVersions.STU3,
+  fhirResource: stu3Example1,
+  fhirIcons: MedicationAdministrationIcon,
 };
 
-export const Example1OfR4 = () => {
-  const fhirResource = object('Resource', r4Example1);
-  return (
-    <MedicationAdministration
-      fhirVersion={fhirVersions.R4}
-      fhirResource={fhirResource}
-      fhirIcons={fhirIcons}
-    />
-  );
+export const Example1OfR4 = Template.bind({});
+Example1OfR4.args = {
+  fhirVersion: fhirVersions.R4,
+  fhirResource: r4Example1,
+  fhirIcons: fhirIcons,
 };
 
-export const Example2OfR4 = () => {
-  const fhirResource = object('Resource', r4Example2);
-  return (
-    <MedicationAdministration
-      fhirVersion={fhirVersions.R4}
-      fhirResource={fhirResource}
-      fhirIcons={false}
-    />
-  );
+export const Example2OfR4 = Template.bind({});
+Example2OfR4.args = {
+  fhirVersion: fhirVersions.R4,
+  fhirResource: r4Example2,
+  fhirIcons: false,
 };
 
-export const Example3OfR4 = () => {
-  const fhirResource = object('Resource', r4Example3);
-  return (
-    <MedicationAdministration
-      fhirVersion={fhirVersions.R4}
-      fhirResource={fhirResource}
-      fhirIcons={'random text'}
-    />
-  );
+export const Example3OfR4 = Template.bind({});
+Example3OfR4.args = {
+  fhirVersion: fhirVersions.R4,
+  fhirResource: r4Example3,
+  fhirIcons: 'random text',
 };

package/src/components/resources/MedicationDispense/MedicationDispense.js

@@ -165,6 +165,7 @@ const MedicationDispense = ({
   fhirIcons,
   onClick,
   rawOnClick,
+  customId,
 }) => {
   let fhirResourceData = {};
   try {
@@ -245,6 +246,7 @@ const MedicationDispense = ({
         }
         onClick={onClick}
         rawOnClick={rawOnClick}
+        customId={customId}
       />
     </Root>
   );

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

@@ -1,5 +1,5 @@
 import React from 'react';
-import { object } from '@storybook/addon-knobs';
+import { defaultArgTypes } from '../../defaultArgTypes';
 
 import MedicationDispense from './MedicationDispense';
 import fhirVersions from '../fhirResourceVersions';
@@ -15,74 +15,56 @@ import MedicationDispenseIcon from '../../../assets/containers/MedicationDispens
 
 export default {
   title: 'MedicationDispense',
+  component: MedicationDispense,
+  argTypes: {
+    ...defaultArgTypes,
+  },
 };
 
-export const DefaultVisualizationDSTU2 = () => {
-  const fhirResource = object('Resource', dstu2Example1);
-  return (
-    <MedicationDispense
-      fhirResource={fhirResource}
-      fhirVersion={fhirVersions.DSTU2}
-      fhirIcons={require('../../../assets/containers/MedicationDispense/medication-dispense.svg')}
-    />
-  );
+const Template = args => <MedicationDispense {...args} />;
+
+export const DefaultVisualizationDSTU2 = Template.bind({});
+DefaultVisualizationDSTU2.args = {
+  fhirVersion: fhirVersions.DSTU2,
+  fhirResource: dstu2Example1,
+  fhirIcons: require('../../../assets/containers/MedicationDispense/medication-dispense.svg'),
 };
 
-export const Example2OfDSTU2 = () => {
-  const fhirResource = object('Resource', dstu2Example2);
-  return (
-    <MedicationDispense
-      fhirResource={fhirResource}
-      fhirVersion={fhirVersions.DSTU2}
-      fhirIcons={MedicationDispenseIcon}
-    />
-  );
+export const Example2OfDSTU2 = Template.bind({});
+Example2OfDSTU2.args = {
+  fhirVersion: fhirVersions.DSTU2,
+  fhirResource: dstu2Example2,
+  fhirIcons: MedicationDispenseIcon,
 };
 
-export const Example1OfSTU3 = () => {
-  const fhirResource = object('Resource', stu3Example1);
-  return (
-    <MedicationDispense
-      fhirResource={fhirResource}
-      fhirVersion={fhirVersions.STU3}
-      fhirIcons={fhirIcons}
-    />
-  );
+export const Example1OfSTU3 = Template.bind({});
+Example1OfSTU3.args = {
+  fhirVersion: fhirVersions.DSTU2,
+  fhirResource: stu3Example1,
+  fhirIcons: fhirIcons,
 };
 
-export const Example2OfSTU3 = () => {
-  const fhirResource = object('Resource', stu3Example2);
-  return (
-    <MedicationDispense
-      fhirResource={fhirResource}
-      fhirVersion={fhirVersions.STU3}
-      fhirIcons={false}
-    />
-  );
+export const Example2OfSTU3 = Template.bind({});
+Example2OfSTU3.args = {
+  fhirVersion: fhirVersions.STU3,
+  fhirResource: stu3Example2,
+  fhirIcons: false,
 };
 
-export const Example1OfR4 = () => {
-  const fhirResource = object('Resource', R4Example1);
-  return (
-    <MedicationDispense
-      fhirResource={fhirResource}
-      fhirVersion={fhirVersions.R4}
-      fhirIcons={'random text'}
-    />
-  );
+export const Example1OfR4 = Template.bind({});
+Example1OfR4.args = {
+  fhirVersion: fhirVersions.R4,
+  fhirResource: R4Example1,
+  fhirIcons: 'random text',
 };
 
-export const Example2OfR4 = () => {
-  const fhirResource = object('Resource', R4Example2);
-  return (
-    <MedicationDispense
-      fhirResource={fhirResource}
-      fhirVersion={fhirVersions.R4}
-    />
-  );
+export const Example2OfR4 = Template.bind({});
+Example2OfR4.args = {
+  fhirVersion: fhirVersions.R4,
+  fhirResource: R4Example2,
 };
 
-export const ExampleWithoutFhirVersionProperty = () => {
-  const fhirResource = object('Resource', stu3Example1);
-  return <MedicationDispense fhirResource={fhirResource} />;
+export const ExampleWithoutFhirVersionProperty = Template.bind({});
+ExampleWithoutFhirVersionProperty.args = {
+  fhirResource: stu3Example1,
 };

package/src/components/resources/MedicationKnowledge/MedicationKnowledge.js

@@ -110,6 +110,7 @@ const MedicationKnowledge = ({
   fhirIcons,
   onClick,
   rawOnClick,
+  customId,
 }) => {
   let fhirResourceData = {};
   try {
@@ -254,6 +255,7 @@ const MedicationKnowledge = ({
         }
         onClick={onClick}
         rawOnClick={rawOnClick}
+        customId={customId}
       />
     </Root>
   );

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

@@ -1,5 +1,5 @@
 import React from 'react';
-import { object } from '@storybook/addon-knobs';
+import { defaultArgTypes } from '../../defaultArgTypes';
 
 import MedicationKnowledge from './MedicationKnowledge';
 import fhirVersions from '../fhirResourceVersions';
@@ -13,72 +13,63 @@ import MedicationKnowledgeIcon from '../../../assets/containers/MedicationKnowle
 
 export default {
   title: 'MedicationKnowledge',
+  component: MedicationKnowledge,
+  argTypes: {
+    ...defaultArgTypes,
+    withDaVinciPDex: {
+      table: {
+        disable: true,
+      },
+    },
+  },
 };
 
-export const DefaultVisualizationR4 = () => {
-  const fhirResource = object('Resource', example1R4);
-  return (
-    <MedicationKnowledge
-      fhirVersion={fhirVersions.R4}
-      fhirResource={fhirResource}
-      fhirIcons={require('../../../assets/containers/MedicationKnowledge/medication-knowledge.svg')}
-    />
-  );
+const Template = args => <MedicationKnowledge {...args} />;
+
+export const DefaultVisualizationR4 = Template.bind({});
+DefaultVisualizationR4.args = {
+  fhirVersion: fhirVersions.R4,
+  fhirResource: example1R4,
+  fhirIcons: require('../../../assets/containers/MedicationKnowledge/medication-knowledge.svg'),
 };
-export const ExampleR4WithoutDaVinciPDex = () => {
-  const fhirResource = object('Resource', example2R4);
-  return (
-    <MedicationKnowledge
-      fhirVersion={fhirVersions.R4}
-      fhirResource={fhirResource}
-      fhirIcons={MedicationKnowledgeIcon}
-    />
-  );
+
+export const ExampleR4WithoutDaVinciPDex = Template.bind({});
+ExampleR4WithoutDaVinciPDex.args = {
+  fhirVersion: fhirVersions.R4,
+  fhirResource: example2R4,
+  fhirIcons: MedicationKnowledgeIcon,
 };
-export const ExampleR4WithDaVinciPDex = () => {
-  const fhirResource = object('Resource', example2R4);
-  return (
-    <MedicationKnowledge
-      fhirVersion={fhirVersions.R4}
-      fhirResource={fhirResource}
-      withDaVinciPDex
-      fhirIcons={fhirIcons}
-    />
-  );
+
+export const ExampleR4WithDaVinciPDex = Template.bind({});
+ExampleR4WithDaVinciPDex.args = {
+  fhirVersion: fhirVersions.R4,
+  fhirResource: example2R4,
+  fhirIcons: fhirIcons,
+  withDaVinciPDex: true,
 };
-export const Example2R4 = () => {
-  const fhirResource = object('Resource', example3R4);
-  return (
-    <MedicationKnowledge
-      fhirVersion={fhirVersions.R4}
-      fhirResource={fhirResource}
-    />
-  );
+
+export const Example2R4 = Template.bind({});
+Example2R4.args = {
+  fhirVersion: fhirVersions.R4,
+  fhirResource: example3R4,
+  fhirIcons: false,
 };
 
-export const Example3R4WithDaVinciPDex = () => {
-  const fhirResource = object('Resource', example4R4);
-  return (
-    <MedicationKnowledge
-      fhirVersion={fhirVersions.R4}
-      fhirResource={fhirResource}
-      withDaVinciPDex
-      fhirIcons={false}
-    />
-  );
+export const Example3R4WithDaVinciPDex = Template.bind({});
+Example3R4WithDaVinciPDex.args = {
+  fhirVersion: fhirVersions.R4,
+  fhirResource: example4R4,
+  fhirIcons: 'random text',
+  withDaVinciPDex: true,
 };
 
-export const ExampleWithoutFHIRVersionProperty = () => {
-  const fhirResource = object('Resource', example3R4);
-  return <MedicationKnowledge fhirResource={fhirResource} />;
+export const ExampleWithoutFHIRVersionProperty = Template.bind({});
+ExampleWithoutFHIRVersionProperty.args = {
+  fhirResource: example3R4,
 };
 
-export const ExampleWithUnsupportedFHIRVersionProperty = () => {
-  const fhirResource = object('Resource', example4R4);
-  return (
-    <MedicationKnowledge
-      fhirVersion={fhirVersions.DSTU2}
-      fhirResource={fhirResource}
-    />
-  );
+export const ExampleWithUnsupportedFHIRVersionProperty = Template.bind({});
+ExampleWithUnsupportedFHIRVersionProperty.args = {
+  fhirVersion: fhirVersions.DSTU2,
+  fhirResource: example4R4,
 };

package/src/components/resources/MedicationOrder/MedicationOrder.js

@@ -8,7 +8,13 @@ import Coding from '../../datatypes/Coding';
 
 import { Root, Header, Body } from '../../ui';
 
-const MedicationOrder = ({ fhirResource, fhirIcons, onClick, rawOnClick }) => {
+const MedicationOrder = ({
+  fhirResource,
+  fhirIcons,
+  onClick,
+  rawOnClick,
+  customId,
+}) => {
   const medicationReference = _get(fhirResource, 'medicationReference');
   const medicationCodeableConcept = _get(
     fhirResource,
@@ -66,6 +72,7 @@ const MedicationOrder = ({ fhirResource, fhirIcons, onClick, rawOnClick }) => {
         bodyContent={<Body tableData={tableData} />}
         onClick={onClick}
         rawOnClick={rawOnClick}
+        customId={customId}
       />
     </Root>
   );

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

@@ -1,5 +1,5 @@
 import React from 'react';
-import { object } from '@storybook/addon-knobs';
+import { defaultArgTypes } from '../../defaultArgTypes';
 
 import MedicationOrder from './MedicationOrder';
 
@@ -7,9 +7,16 @@ import dstu2Example from '../../../fixtures/dstu2/resources/medicationOrder/exam
 
 export default {
   title: 'MedicationOrder',
+  component: MedicationOrder,
+  argTypes: {
+    ...defaultArgTypes,
+  },
 };
 
-export const DefaultVisualizationDSTU2 = () => {
-  const fhirResource = object('Resource', dstu2Example);
-  return <MedicationOrder fhirResource={fhirResource} />;
+const Template = args => <MedicationOrder {...args} />;
+
+export const DefaultVisualizationDSTU2 = Template.bind({});
+DefaultVisualizationDSTU2.args = {
+  fhirResource: dstu2Example,
+  fhirIcons: require('../../../assets/containers/MedicationOrder/medication-order.svg'),
 };

package/src/components/resources/MedicationRequest/MedicationRequest.js

@@ -14,6 +14,7 @@ const MedicationRequest = ({
   fhirIcons,
   onClick,
   rawOnClick,
+  customId,
 }) => {
   const medicationReference = _get(fhirResource, 'medicationReference');
   const medicationCodeableConcept = _get(
@@ -94,6 +95,7 @@ const MedicationRequest = ({
         bodyContent={<Body tableData={tableData} />}
         onClick={onClick}
         rawOnClick={rawOnClick}
+        customId={customId}
       />
     </Root>
   );