fhir-react 0.3.8 → 0.3.11

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

@@ -115,6 +115,7 @@ const MedicationAdministration = ({
   fhirVersion,
   fhirIcons,
   onClick,
+  rawOnClick,
 }) => {
   let fhirResourceData = {};
   try {
@@ -213,6 +214,7 @@ const MedicationAdministration = ({
           </Body>
         }
         onClick={onClick}
+        rawOnClick={rawOnClick}
       />
     </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

@@ -164,6 +164,7 @@ const MedicationDispense = ({
   fhirVersion,
   fhirIcons,
   onClick,
+  rawOnClick,
 }) => {
   let fhirResourceData = {};
   try {
@@ -243,6 +244,7 @@ const MedicationDispense = ({
           </Body>
         }
         onClick={onClick}
+        rawOnClick={rawOnClick}
       />
     </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

@@ -109,6 +109,7 @@ const MedicationKnowledge = ({
   withDaVinciPDex = false,
   fhirIcons,
   onClick,
+  rawOnClick,
 }) => {
   let fhirResourceData = {};
   try {
@@ -252,6 +253,7 @@ const MedicationKnowledge = ({
           </Body>
         }
         onClick={onClick}
+        rawOnClick={rawOnClick}
       />
     </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,7 @@ import Coding from '../../datatypes/Coding';
 
 import { Root, Header, Body } from '../../ui';
 
-const MedicationOrder = ({ fhirResource, fhirIcons, onClick }) => {
+const MedicationOrder = ({ fhirResource, fhirIcons, onClick, rawOnClick }) => {
   const medicationReference = _get(fhirResource, 'medicationReference');
   const medicationCodeableConcept = _get(
     fhirResource,
@@ -65,6 +65,7 @@ const MedicationOrder = ({ fhirResource, fhirIcons, onClick }) => {
         }
         bodyContent={<Body tableData={tableData} />}
         onClick={onClick}
+        rawOnClick={rawOnClick}
       />
     </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

@@ -9,7 +9,12 @@ import Date from '../../datatypes/Date';
 
 import { Root, Header, Body } from '../../ui';
 
-const MedicationRequest = ({ fhirResource, fhirIcons, onClick }) => {
+const MedicationRequest = ({
+  fhirResource,
+  fhirIcons,
+  onClick,
+  rawOnClick,
+}) => {
   const medicationReference = _get(fhirResource, 'medicationReference');
   const medicationCodeableConcept = _get(
     fhirResource,
@@ -88,6 +93,7 @@ const MedicationRequest = ({ fhirResource, fhirIcons, onClick }) => {
         }
         bodyContent={<Body tableData={tableData} />}
         onClick={onClick}
+        rawOnClick={rawOnClick}
       />
     </Root>
   );

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

@@ -1,5 +1,5 @@
 import React from 'react';
-import { object } from '@storybook/addon-knobs';
+import { defaultArgTypes } from '../../defaultArgTypes';
 
 import MedicationRequest from './MedicationRequest';
 
@@ -13,43 +13,40 @@ import MedicationRequestIcon from '../../../assets/containers/MedicationRequest/
 
 export default {
   title: 'MedicationRequest',
+  component: MedicationRequest,
+  argTypes: {
+    ...defaultArgTypes,
+  },
 };
 
-export const DefaultVisualizationSTU3 = () => {
-  const fhirResource = object('Resource', stu3Example1);
-  return (
-    <MedicationRequest
-      fhirResource={fhirResource}
-      fhirIcons={require('../../../assets/containers/MedicationRequest/medication-request.svg')}
-    />
-  );
+const Template = args => <MedicationRequest {...args} />;
+
+export const DefaultVisualizationSTU3 = Template.bind({});
+DefaultVisualizationSTU3.args = {
+  fhirResource: stu3Example1,
+  fhirIcons: require('../../../assets/containers/MedicationRequest/medication-request.svg'),
 };
 
-export const Example2OfSTU3 = () => {
-  const fhirResource = object('Resource', stu3Example2);
-  return (
-    <MedicationRequest
-      fhirResource={fhirResource}
-      fhirIcons={MedicationRequestIcon}
-    />
-  );
+export const Example2OfSTU3 = Template.bind({});
+Example2OfSTU3.args = {
+  fhirResource: stu3Example2,
+  fhirIcons: MedicationRequestIcon,
 };
 
-export const Example1OfR4 = () => {
-  const fhirResource = object('Resource', R4Example1);
-  return (
-    <MedicationRequest fhirResource={fhirResource} fhirIcons={fhirIcons} />
-  );
+export const Example1OfR4 = Template.bind({});
+Example1OfR4.args = {
+  fhirResource: R4Example1,
+  fhirIcons: fhirIcons,
 };
 
-export const Example2OfR4 = () => {
-  const fhirResource = object('Resource', R4Example2);
-  return <MedicationRequest fhirResource={fhirResource} fhirIcons={false} />;
+export const Example2OfR4 = Template.bind({});
+Example2OfR4.args = {
+  fhirResource: R4Example2,
+  fhirIcons: false,
 };
 
-export const Example3OfR4 = () => {
-  const fhirResource = object('Resource', R4Example3);
-  return (
-    <MedicationRequest fhirResource={fhirResource} fhirIcons={'random text'} />
-  );
+export const Example3OfR4 = Template.bind({});
+Example3OfR4.args = {
+  fhirResource: R4Example3,
+  fhirIcons: 'random text',
 };