@ltht-react/diagnosis-summary 2.0.92 → 2.0.93

package/README.md

@@ -1,22 +1,22 @@
-# DiagnosisSummary
-
-<!-- STORY -->
-
-### Import
-
-```js
-import DiagnosisSummary from '@ltht-react/diagnosis-summary'
-```
-
-### Usage
-
-```jsx
-<DiagnosisSummary title="Conditions" conditions={conditions} clickHandler={handleCLick} />
-```
-
-### Properties
-
-| Prop           | Required | Default   | Type        | Description                                                   |
-| :------------- | :------- | :-------- | :---------- | :------------------------------------------------------------ |
-| `conditions`   | Yes      |           | Condition[] | Array of conditions to display                                |
-| `clickHandler` | No       | undefined | Function    | Callback click handler containing the selected condition item |
+# DiagnosisSummary
+
+<!-- STORY -->
+
+### Import
+
+```js
+import DiagnosisSummary from '@ltht-react/diagnosis-summary'
+```
+
+### Usage
+
+```jsx
+<DiagnosisSummary title="Conditions" conditions={conditions} clickHandler={handleCLick} />
+```
+
+### Properties
+
+| Prop           | Required | Default   | Type        | Description                                                   |
+| :------------- | :------- | :-------- | :---------- | :------------------------------------------------------------ |
+| `conditions`   | Yes      |           | Condition[] | Array of conditions to display                                |
+| `clickHandler` | No       | undefined | Function    | Callback click handler containing the selected condition item |

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ltht-react/diagnosis-summary",
-  "version": "2.0.92",
+  "version": "2.0.93",
   "description": "ltht-react clinical DiagnosisSummary component.",
   "author": "LTHT",
   "homepage": "",
@@ -28,15 +28,15 @@
   "dependencies": {
     "@emotion/react": "^11.0.0",
     "@emotion/styled": "^11.0.0",
-    "@ltht-react/button": "^2.0.92",
-    "@ltht-react/hooks": "^2.0.92",
-    "@ltht-react/icon": "^2.0.92",
-    "@ltht-react/list": "^2.0.92",
-    "@ltht-react/styles": "^2.0.92",
-    "@ltht-react/type-summary": "^2.0.92",
-    "@ltht-react/types": "^2.0.92",
-    "@ltht-react/utils": "^2.0.92",
+    "@ltht-react/button": "^2.0.93",
+    "@ltht-react/hooks": "^2.0.93",
+    "@ltht-react/icon": "^2.0.93",
+    "@ltht-react/list": "^2.0.93",
+    "@ltht-react/styles": "^2.0.93",
+    "@ltht-react/type-summary": "^2.0.93",
+    "@ltht-react/types": "^2.0.93",
+    "@ltht-react/utils": "^2.0.93",
     "react": "^18.2.0"
   },
-  "gitHead": "38e73d8070788d851439e08e61ffae6a16ea8004"
+  "gitHead": "a719fb23b34bec9e9913d310c94e385a1f9e4747"
 }

package/src/atoms/diagnosis-category.tsx

@@ -1,31 +1,31 @@
-import { FC, HTMLAttributes } from 'react'
-import styled from '@emotion/styled'
-
-import { TEXT_COLOURS } from '@ltht-react/styles'
-import { Condition } from '@ltht-react/types'
-import { codeableConceptDisplaySummary } from '@ltht-react/utils'
-
-const StyledConditionCategory = styled.div<IStyledDescription>`
-  color: ${TEXT_COLOURS.SECONDARY.VALUE};
-  text-align: left;
-  font-size: smaller;
-  padding-top: 0.25rem;
-  text-decoration: ${({ enteredInError }) => (enteredInError ? 'line-through' : 'none')};
-`
-
-const DiagnosisCategory: FC<Props> = ({ condition, enteredInError, ...rest }) => (
-  <StyledConditionCategory enteredInError={enteredInError} {...rest}>
-    {codeableConceptDisplaySummary(condition.severity)}
-  </StyledConditionCategory>
-)
-
-interface Props extends HTMLAttributes<HTMLDivElement> {
-  condition: Condition
-  enteredInError: boolean
-}
-
-interface IStyledDescription {
-  enteredInError: boolean
-}
-
-export default DiagnosisCategory
+import { FC, HTMLAttributes } from 'react'
+import styled from '@emotion/styled'
+
+import { TEXT_COLOURS } from '@ltht-react/styles'
+import { Condition } from '@ltht-react/types'
+import { codeableConceptDisplaySummary } from '@ltht-react/utils'
+
+const StyledConditionCategory = styled.div<IStyledDescription>`
+  color: ${TEXT_COLOURS.SECONDARY.VALUE};
+  text-align: left;
+  font-size: smaller;
+  padding-top: 0.25rem;
+  text-decoration: ${({ enteredInError }) => (enteredInError ? 'line-through' : 'none')};
+`
+
+const DiagnosisCategory: FC<Props> = ({ condition, enteredInError, ...rest }) => (
+  <StyledConditionCategory enteredInError={enteredInError} {...rest}>
+    {codeableConceptDisplaySummary(condition.severity)}
+  </StyledConditionCategory>
+)
+
+interface Props extends HTMLAttributes<HTMLDivElement> {
+  condition: Condition
+  enteredInError: boolean
+}
+
+interface IStyledDescription {
+  enteredInError: boolean
+}
+
+export default DiagnosisCategory

package/src/atoms/diagnosis-onset-estimated.tsx

@@ -1,39 +1,39 @@
-import { FC, HTMLAttributes } from 'react'
-import styled from '@emotion/styled'
-
-import { TEXT_COLOURS } from '@ltht-react/styles'
-import { Condition } from '@ltht-react/types'
-
-import { getBooleanExtension } from '@ltht-react/utils'
-
-const StyledOnsetEstimated = styled.div<IStyledDescription>`
-  color: ${TEXT_COLOURS.INFO};
-  font-size: x-small;
-  white-space: pre-wrap;
-  display: inline-block;
-  text-decoration: ${({ enteredInError }) => (enteredInError ? 'line-through' : 'none')};
-`
-
-const DiagnosisOnsetEstimated: FC<Props> = ({ condition, enteredInError, ...rest }) => {
-  const onsetDateEstimated = getBooleanExtension(
-    condition.extension,
-    'https://fhir.leedsth.nhs.uk/ValueSet/diagnosis-onset-date-estimated-1'
-  )
-
-  return (
-    <StyledOnsetEstimated enteredInError={enteredInError} {...rest}>
-      {onsetDateEstimated ? ' (estimated)' : ''}
-    </StyledOnsetEstimated>
-  )
-}
-
-interface Props extends HTMLAttributes<HTMLDivElement> {
-  condition: Condition
-  enteredInError: boolean
-}
-
-interface IStyledDescription {
-  enteredInError: boolean
-}
-
-export default DiagnosisOnsetEstimated
+import { FC, HTMLAttributes } from 'react'
+import styled from '@emotion/styled'
+
+import { TEXT_COLOURS } from '@ltht-react/styles'
+import { Condition } from '@ltht-react/types'
+
+import { getBooleanExtension } from '@ltht-react/utils'
+
+const StyledOnsetEstimated = styled.div<IStyledDescription>`
+  color: ${TEXT_COLOURS.INFO};
+  font-size: x-small;
+  white-space: pre-wrap;
+  display: inline-block;
+  text-decoration: ${({ enteredInError }) => (enteredInError ? 'line-through' : 'none')};
+`
+
+const DiagnosisOnsetEstimated: FC<Props> = ({ condition, enteredInError, ...rest }) => {
+  const onsetDateEstimated = getBooleanExtension(
+    condition.extension,
+    'https://fhir.leedsth.nhs.uk/ValueSet/diagnosis-onset-date-estimated-1'
+  )
+
+  return (
+    <StyledOnsetEstimated enteredInError={enteredInError} {...rest}>
+      {onsetDateEstimated ? ' (estimated)' : ''}
+    </StyledOnsetEstimated>
+  )
+}
+
+interface Props extends HTMLAttributes<HTMLDivElement> {
+  condition: Condition
+  enteredInError: boolean
+}
+
+interface IStyledDescription {
+  enteredInError: boolean
+}
+
+export default DiagnosisOnsetEstimated

package/src/atoms/diagnosis-status.tsx

@@ -1,38 +1,38 @@
-import { FC, HTMLAttributes } from 'react'
-import styled from '@emotion/styled'
-
-import { TEXT_COLOURS } from '@ltht-react/styles'
-import { Condition } from '@ltht-react/types'
-import { titleCase } from '@ltht-react/utils'
-
-const StyledConditionStatus = styled.div<IStyledDescription>`
-  color: ${TEXT_COLOURS.SECONDARY.VALUE};
-  text-align: left;
-  font-size: smaller;
-  padding-top: 0.25rem;
-  text-decoration: ${({ enteredInError }) => (enteredInError ? 'line-through' : 'none')};
-`
-
-const DiagnosisStatus: FC<Props> = ({ condition, enteredInError, ...rest }) => {
-  const values = []
-
-  if (condition.clinicalStatus) values.push(titleCase(condition.clinicalStatus))
-  if (condition.verificationStatus) values.push(titleCase(condition.verificationStatus))
-
-  return (
-    <StyledConditionStatus enteredInError={enteredInError} {...rest}>
-      {values.length > 0 ? values.join(' - ') : 'Insufficient data provided'}
-    </StyledConditionStatus>
-  )
-}
-
-interface Props extends HTMLAttributes<HTMLDivElement> {
-  condition: Condition
-  enteredInError: boolean
-}
-
-interface IStyledDescription {
-  enteredInError: boolean
-}
-
-export default DiagnosisStatus
+import { FC, HTMLAttributes } from 'react'
+import styled from '@emotion/styled'
+
+import { TEXT_COLOURS } from '@ltht-react/styles'
+import { Condition } from '@ltht-react/types'
+import { titleCase } from '@ltht-react/utils'
+
+const StyledConditionStatus = styled.div<IStyledDescription>`
+  color: ${TEXT_COLOURS.SECONDARY.VALUE};
+  text-align: left;
+  font-size: smaller;
+  padding-top: 0.25rem;
+  text-decoration: ${({ enteredInError }) => (enteredInError ? 'line-through' : 'none')};
+`
+
+const DiagnosisStatus: FC<Props> = ({ condition, enteredInError, ...rest }) => {
+  const values = []
+
+  if (condition.clinicalStatus) values.push(titleCase(condition.clinicalStatus))
+  if (condition.verificationStatus) values.push(titleCase(condition.verificationStatus))
+
+  return (
+    <StyledConditionStatus enteredInError={enteredInError} {...rest}>
+      {values.length > 0 ? values.join(' - ') : 'Insufficient data provided'}
+    </StyledConditionStatus>
+  )
+}
+
+interface Props extends HTMLAttributes<HTMLDivElement> {
+  condition: Condition
+  enteredInError: boolean
+}
+
+interface IStyledDescription {
+  enteredInError: boolean
+}
+
+export default DiagnosisStatus

package/src/atoms/diagnosis-title.tsx

@@ -1,37 +1,28 @@
-import { FC, HTMLAttributes } from 'react'
-import styled from '@emotion/styled'
-
-import { TEXT_COLOURS } from '@ltht-react/styles'
-import { Condition } from '@ltht-react/types'
-import { codeableConceptTextSummary } from '@ltht-react/utils'
-
-const StyledConditionTitle = styled.div<IStyledDescription>`
-  color: ${TEXT_COLOURS.PRIMARY};
-  text-align: left;
-  text-decoration: ${({ enteredInError }) => (enteredInError ? 'line-through' : 'none')};
-`
-
-const DiagnosisTitle: FC<Props> = ({ condition, enteredInError, ...rest }) => {
-  const codes = []
-  const snippets = []
-
-  if (condition.code) codes.push(condition.code)
-  snippets.push(codeableConceptTextSummary(codes))
-
-  return (
-    <StyledConditionTitle enteredInError={enteredInError} {...rest}>
-      {snippets.length > 0 ? snippets.join(', ') : 'Insufficient data provided'}
-    </StyledConditionTitle>
-  )
-}
-
-interface Props extends HTMLAttributes<HTMLDivElement> {
-  condition: Condition
-  enteredInError: boolean
-}
-
-interface IStyledDescription {
-  enteredInError: boolean
-}
-
-export default DiagnosisTitle
+import { FC, HTMLAttributes } from 'react'
+import styled from '@emotion/styled'
+
+import { TEXT_COLOURS } from '@ltht-react/styles'
+import { Maybe, Scalars } from '@ltht-react/types'
+
+const StyledConditionTitle = styled.div<IStyledDescription>`
+  color: ${TEXT_COLOURS.PRIMARY};
+  text-align: left;
+  text-decoration: ${({ enteredInError }) => (enteredInError ? 'line-through' : 'none')};
+`
+
+const DiagnosisTitle: FC<Props> = ({ text, enteredInError, ...rest }) => (
+  <StyledConditionTitle enteredInError={enteredInError} {...rest}>
+    {text || 'Insufficient data provided.'}
+  </StyledConditionTitle>
+)
+
+interface Props extends HTMLAttributes<HTMLDivElement> {
+  text?: Maybe<Scalars['String']>
+  enteredInError: boolean
+}
+
+interface IStyledDescription {
+  enteredInError: boolean
+}
+
+export default DiagnosisTitle

package/src/constants.ts

@@ -1,3 +1,3 @@
-const SNIPPET_HOVER_TEXT = 'https://leedsth.nhs.uk/cds/snippet-hover-text'
-
-export default SNIPPET_HOVER_TEXT
+const SNIPPET_HOVER_TEXT = 'https://leedsth.nhs.uk/cds/snippet-hover-text'
+
+export default SNIPPET_HOVER_TEXT

package/src/index.tsx

@@ -1,3 +1,3 @@
-import DiagnosisSummary from './organisms/diagnosis-summary'
-
-export default DiagnosisSummary
+import DiagnosisSummary from './organisms/diagnosis-summary'
+
+export default DiagnosisSummary

package/src/molecules/diagnosis-redacted.tsx

@@ -1,31 +1,31 @@
-import { FC } from 'react'
-import styled from '@emotion/styled'
-
-import { Condition } from '@ltht-react/types'
-import { DateSummary, RedactedDescription } from '@ltht-react/type-summary'
-
-const StyledRedactedDescription = styled.div`
-  flex-grow: 1;
-  text-align: left;
-`
-
-const StyledDateSummary = styled.div`
-  text-align: right;
-`
-
-const DiagnosisRedacted: FC<Props> = ({ condition }) => (
-  <>
-    <StyledRedactedDescription>
-      <RedactedDescription />
-    </StyledRedactedDescription>
-    <StyledDateSummary>
-      <DateSummary datetime={condition?.onset?.dateTime} />
-    </StyledDateSummary>
-  </>
-)
-
-interface Props {
-  condition?: Condition | null
-}
-
-export default DiagnosisRedacted
+import { FC } from 'react'
+import styled from '@emotion/styled'
+
+import { Condition } from '@ltht-react/types'
+import { DateSummary, RedactedDescription } from '@ltht-react/type-summary'
+
+const StyledRedactedDescription = styled.div`
+  flex-grow: 1;
+  text-align: left;
+`
+
+const StyledDateSummary = styled.div`
+  text-align: right;
+`
+
+const DiagnosisRedacted: FC<Props> = ({ condition }) => (
+  <>
+    <StyledRedactedDescription>
+      <RedactedDescription />
+    </StyledRedactedDescription>
+    <StyledDateSummary>
+      <DateSummary datetime={condition?.onset?.dateTime} />
+    </StyledDateSummary>
+  </>
+)
+
+interface Props {
+  condition?: Condition | null
+}
+
+export default DiagnosisRedacted