@ltht-react/timeline 2.0.33 → 2.0.34

package/README.md

@@ -1,19 +1,19 @@
-# Timeline
-
-### Import
-
-```js
-import Timeline from '@ltht-react/timeline'
-```
-
-### Usage
-
-```jsx
-<Timeline auditTrail={auditTrail} />
-```
-
-### Properties
-
-| Prop         | Required | Default | Type                  | Description        |
-| :----------- | :------- | :------ | :-------------------- | :----------------- |
-| `auditTrail` | Yes      |         | `Maybe<AuditEvent>[]` | Timeline of events |
+# Timeline
+
+### Import
+
+```js
+import Timeline from '@ltht-react/timeline'
+```
+
+### Usage
+
+```jsx
+<Timeline auditTrail={auditTrail} />
+```
+
+### Properties
+
+| Prop         | Required | Default | Type                  | Description        |
+| :----------- | :------- | :------ | :-------------------- | :----------------- |
+| `auditTrail` | Yes      |         | `Maybe<AuditEvent>[]` | Timeline of events |

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ltht-react/timeline",
-  "version": "2.0.33",
+  "version": "2.0.34",
   "description": "> TODO: description",
   "author": "Jonny Dyson",
   "homepage": "",
@@ -24,15 +24,15 @@
   },
   "dependencies": {
     "@emotion/styled": "^11.0.0",
-    "@ltht-react/banner": "^2.0.33",
-    "@ltht-react/hooks": "^2.0.33",
-    "@ltht-react/icon": "^2.0.33",
-    "@ltht-react/select": "^2.0.33",
-    "@ltht-react/styles": "^2.0.33",
-    "@ltht-react/types": "^2.0.33",
-    "@ltht-react/utils": "^2.0.33",
+    "@ltht-react/banner": "^2.0.34",
+    "@ltht-react/hooks": "^2.0.34",
+    "@ltht-react/icon": "^2.0.34",
+    "@ltht-react/select": "^2.0.34",
+    "@ltht-react/styles": "^2.0.34",
+    "@ltht-react/types": "^2.0.34",
+    "@ltht-react/utils": "^2.0.34",
     "html-react-parser": "^5.0.6",
     "react": "^18.2.0"
   },
-  "gitHead": "e93da870664a1bd99f61dc8bcc051975ed69e5f1"
+  "gitHead": "381e837b130f476b8241976bbe4e330f88ee22f1"
 }

package/src/atoms/timeline-author.tsx

@@ -1,88 +1,88 @@
-import { FC, HTMLAttributes } from 'react'
-import Icon from '@ltht-react/icon'
-import styled from '@emotion/styled'
-
-import {
-  AuditEvent,
-  DocumentReference,
-  Maybe,
-  QuestionnaireResponse,
-  TimelineDomainResourceType,
-} from '@ltht-react/types'
-import PRIMARY_AUTHOR from '../constants'
-
-const StyledTimelineItemLeft = styled.div`
-  flex-grow: 1;
-`
-
-const TimelineAuthor: FC<Props> = ({ domainResource, domainResourceType, ...rest }) => {
-  if (!domainResource) return <></>
-
-  switch (domainResourceType) {
-    case TimelineDomainResourceType.QuestionnaireResponse: {
-      const qr = domainResource as QuestionnaireResponse
-      if (!qr?.author) {
-        return <></>
-      }
-      return (
-        <StyledTimelineItemLeft {...rest}>
-          <Icon type="user" size="medium" color="grey" /> by {qr?.author?.display}
-        </StyledTimelineItemLeft>
-      )
-    }
-    case TimelineDomainResourceType.DocumentReference: {
-      const docRef = domainResource as DocumentReference
-      const authorList: string[] = []
-
-      if (docRef?.author == null) {
-        return <></>
-      }
-
-      docRef.author.forEach((auth) => {
-        if (auth) {
-          authorList.push(auth.specialty ? `${auth.fullName} (${auth.specialty})` : `${auth.fullName}`)
-        }
-      })
-
-      if (authorList.length === 0) {
-        return <></>
-      }
-
-      return (
-        <StyledTimelineItemLeft {...rest}>
-          <Icon type="user" size="medium" color="grey" /> by {authorList.join(', ')}
-        </StyledTimelineItemLeft>
-      )
-    }
-    case TimelineDomainResourceType.AuditEvent: {
-      const audit = domainResource as AuditEvent
-      let authorName = ''
-
-      audit.agent.forEach((agent) => {
-        agent?.role?.forEach((role) => {
-          const isPrimaryAuthor = !!role?.coding?.find((x) => x?.code === PRIMARY_AUTHOR)
-          !authorName && isPrimaryAuthor && (authorName = agent.who?.display || '')
-        })
-      })
-
-      if (!authorName) {
-        return <></>
-      }
-
-      return (
-        <StyledTimelineItemLeft {...rest}>
-          <Icon type="user" size="medium" color="grey" /> by {authorName}
-        </StyledTimelineItemLeft>
-      )
-    }
-  }
-
-  return <></>
-}
-
-interface Props extends HTMLAttributes<HTMLDivElement> {
-  domainResource?: Maybe<AuditEvent | QuestionnaireResponse | DocumentReference>
-  domainResourceType: TimelineDomainResourceType
-}
-
-export default TimelineAuthor
+import { FC, HTMLAttributes } from 'react'
+import Icon from '@ltht-react/icon'
+import styled from '@emotion/styled'
+
+import {
+  AuditEvent,
+  DocumentReference,
+  Maybe,
+  QuestionnaireResponse,
+  TimelineDomainResourceType,
+} from '@ltht-react/types'
+import PRIMARY_AUTHOR from '../constants'
+
+const StyledTimelineItemLeft = styled.div`
+  flex-grow: 1;
+`
+
+const TimelineAuthor: FC<Props> = ({ domainResource, domainResourceType, ...rest }) => {
+  if (!domainResource) return <></>
+
+  switch (domainResourceType) {
+    case TimelineDomainResourceType.QuestionnaireResponse: {
+      const qr = domainResource as QuestionnaireResponse
+      if (!qr?.author) {
+        return <></>
+      }
+      return (
+        <StyledTimelineItemLeft {...rest}>
+          <Icon type="user" size="medium" color="grey" /> by {qr?.author?.display}
+        </StyledTimelineItemLeft>
+      )
+    }
+    case TimelineDomainResourceType.DocumentReference: {
+      const docRef = domainResource as DocumentReference
+      const authorList: string[] = []
+
+      if (docRef?.author == null) {
+        return <></>
+      }
+
+      docRef.author.forEach((auth) => {
+        if (auth) {
+          authorList.push(auth.specialty ? `${auth.fullName} (${auth.specialty})` : `${auth.fullName}`)
+        }
+      })
+
+      if (authorList.length === 0) {
+        return <></>
+      }
+
+      return (
+        <StyledTimelineItemLeft {...rest}>
+          <Icon type="user" size="medium" color="grey" /> by {authorList.join(', ')}
+        </StyledTimelineItemLeft>
+      )
+    }
+    case TimelineDomainResourceType.AuditEvent: {
+      const audit = domainResource as AuditEvent
+      let authorName = ''
+
+      audit.agent.forEach((agent) => {
+        agent?.role?.forEach((role) => {
+          const isPrimaryAuthor = !!role?.coding?.find((x) => x?.code === PRIMARY_AUTHOR)
+          !authorName && isPrimaryAuthor && (authorName = agent.who?.display || '')
+        })
+      })
+
+      if (!authorName) {
+        return <></>
+      }
+
+      return (
+        <StyledTimelineItemLeft {...rest}>
+          <Icon type="user" size="medium" color="grey" /> by {authorName}
+        </StyledTimelineItemLeft>
+      )
+    }
+  }
+
+  return <></>
+}
+
+interface Props extends HTMLAttributes<HTMLDivElement> {
+  domainResource?: Maybe<AuditEvent | QuestionnaireResponse | DocumentReference>
+  domainResourceType: TimelineDomainResourceType
+}
+
+export default TimelineAuthor

package/src/atoms/timeline-button.tsx

@@ -1,44 +1,44 @@
-import { ButtonBanner } from '@ltht-react/banner'
-import Icon from '@ltht-react/icon'
-import { FC, HTMLAttributes } from 'react'
-import { ITimelineItem } from '../molecules/timeline-item'
-
-const TimelineButton: FC<Props> = ({ timelineItem, className }) => {
-  const { clickHandler, buttonState, buttonText } = timelineItem
-
-  switch (buttonState) {
-    case 'no-button':
-      return <></>
-    case 'permission-denied-button':
-      return (
-        <ButtonBanner className={className} type="warning" disabled>
-          {buttonText ?? 'Insufficient privileges to view this item'}
-        </ButtonBanner>
-      )
-    case 'selectable-button':
-      return (
-        <ButtonBanner className={className} type="info" onClick={clickHandler}>
-          {buttonText ?? ''}
-        </ButtonBanner>
-      )
-    case 'selected-button':
-      return (
-        <ButtonBanner
-          className={className}
-          type="highlight"
-          icon={<Icon type="info-circle" color="info-blue" size="medium" />}
-          onClick={clickHandler}
-        >
-          {buttonText ?? ''}
-        </ButtonBanner>
-      )
-    default:
-      throw new Error('ButtonState must be a valid value.')
-  }
-}
-
-interface Props extends HTMLAttributes<HTMLDivElement> {
-  timelineItem: ITimelineItem
-}
-
-export default TimelineButton
+import { ButtonBanner } from '@ltht-react/banner'
+import Icon from '@ltht-react/icon'
+import { FC, HTMLAttributes } from 'react'
+import { ITimelineItem } from '../molecules/timeline-item'
+
+const TimelineButton: FC<Props> = ({ timelineItem, className }) => {
+  const { clickHandler, buttonState, buttonText } = timelineItem
+
+  switch (buttonState) {
+    case 'no-button':
+      return <></>
+    case 'permission-denied-button':
+      return (
+        <ButtonBanner className={className} type="warning" disabled>
+          {buttonText ?? 'Insufficient privileges to view this item'}
+        </ButtonBanner>
+      )
+    case 'selectable-button':
+      return (
+        <ButtonBanner className={className} type="info" onClick={clickHandler}>
+          {buttonText ?? ''}
+        </ButtonBanner>
+      )
+    case 'selected-button':
+      return (
+        <ButtonBanner
+          className={className}
+          type="highlight"
+          icon={<Icon type="info-circle" color="info-blue" size="medium" />}
+          onClick={clickHandler}
+        >
+          {buttonText ?? ''}
+        </ButtonBanner>
+      )
+    default:
+      throw new Error('ButtonState must be a valid value.')
+  }
+}
+
+interface Props extends HTMLAttributes<HTMLDivElement> {
+  timelineItem: ITimelineItem
+}
+
+export default TimelineButton

package/src/atoms/timeline-description.tsx

@@ -1,52 +1,52 @@
-import { FC, HTMLAttributes } from 'react'
-import {
-  AuditEvent,
-  DocumentReference,
-  Maybe,
-  QuestionnaireResponse,
-  TimelineDomainResourceType,
-} from '@ltht-react/types'
-import parseHtml from 'html-react-parser'
-import styled from '@emotion/styled'
-
-const StyledDescription = styled.div`
-  p {
-    margin: 0 0.2rem;
-    display: inline;
-  }
-`
-
-const TimelineDescription: FC<Props> = ({ domainResource, domainResourceType, ...rest }) => {
-  if (!domainResource) return <></>
-
-  switch (domainResourceType) {
-    case TimelineDomainResourceType.QuestionnaireResponse: {
-      const qr = domainResource as QuestionnaireResponse
-      if (!qr.questionnaire?.description) {
-        return <></>
-      }
-      return <StyledDescription {...rest}>{parseHtml(qr.questionnaire?.description)}</StyledDescription>
-    }
-    case TimelineDomainResourceType.DocumentReference: {
-      const docRef = domainResource as DocumentReference
-      return docRef.description ? <>{docRef.description}</> : <></>
-    }
-    case TimelineDomainResourceType.AuditEvent: {
-      const audit = domainResource as AuditEvent
-      if (!audit.outcomeDesc) {
-        return <></>
-      }
-
-      return <StyledDescription {...rest}>{parseHtml(audit.outcomeDesc)}</StyledDescription>
-    }
-    default:
-      return <></>
-  }
-}
-
-interface Props extends HTMLAttributes<HTMLDivElement> {
-  domainResource?: Maybe<AuditEvent | QuestionnaireResponse | DocumentReference>
-  domainResourceType: TimelineDomainResourceType
-}
-
-export default TimelineDescription
+import { FC, HTMLAttributes } from 'react'
+import {
+  AuditEvent,
+  DocumentReference,
+  Maybe,
+  QuestionnaireResponse,
+  TimelineDomainResourceType,
+} from '@ltht-react/types'
+import parseHtml from 'html-react-parser'
+import styled from '@emotion/styled'
+
+const StyledDescription = styled.div`
+  p {
+    margin: 0 0.2rem;
+    display: inline;
+  }
+`
+
+const TimelineDescription: FC<Props> = ({ domainResource, domainResourceType, ...rest }) => {
+  if (!domainResource) return <></>
+
+  switch (domainResourceType) {
+    case TimelineDomainResourceType.QuestionnaireResponse: {
+      const qr = domainResource as QuestionnaireResponse
+      if (!qr.questionnaire?.description) {
+        return <></>
+      }
+      return <StyledDescription {...rest}>{parseHtml(qr.questionnaire?.description)}</StyledDescription>
+    }
+    case TimelineDomainResourceType.DocumentReference: {
+      const docRef = domainResource as DocumentReference
+      return docRef.description ? <>{docRef.description}</> : <></>
+    }
+    case TimelineDomainResourceType.AuditEvent: {
+      const audit = domainResource as AuditEvent
+      if (!audit.outcomeDesc) {
+        return <></>
+      }
+
+      return <StyledDescription {...rest}>{parseHtml(audit.outcomeDesc)}</StyledDescription>
+    }
+    default:
+      return <></>
+  }
+}
+
+interface Props extends HTMLAttributes<HTMLDivElement> {
+  domainResource?: Maybe<AuditEvent | QuestionnaireResponse | DocumentReference>
+  domainResourceType: TimelineDomainResourceType
+}
+
+export default TimelineDescription

package/src/atoms/timeline-time.tsx

@@ -1,49 +1,49 @@
-import { FC, HTMLAttributes } from 'react'
-import {
-  AuditEvent,
-  DocumentReference,
-  Maybe,
-  QuestionnaireResponse,
-  TimelineDomainResourceType,
-} from '@ltht-react/types'
-import { formatTime } from '@ltht-react/utils'
-
-const TimelineTime: FC<Props> = ({ domainResource, domainResourceType, ...rest }) => {
-  if (!domainResource) return <></>
-
-  switch (domainResourceType) {
-    case TimelineDomainResourceType.QuestionnaireResponse: {
-      const qr = domainResource as QuestionnaireResponse
-      if (!qr?.authored?.value) {
-        return <></>
-      }
-      const time = formatTime(new Date(qr?.authored.value))
-      return <div {...rest}>{time}</div>
-    }
-    case TimelineDomainResourceType.DocumentReference: {
-      const docRef = domainResource as DocumentReference
-      if (docRef && docRef?.created?.value) {
-        const time = formatTime(new Date(docRef.created.value))
-        return <div {...rest}>{time}</div>
-      }
-      return <></>
-    }
-    case TimelineDomainResourceType.AuditEvent: {
-      const audit = domainResource as AuditEvent
-      if (audit && audit?.recorded?.value) {
-        const time = formatTime(new Date(audit.recorded.value))
-        return <div {...rest}>{time}</div>
-      }
-      return <></>
-    }
-    default:
-      return <></>
-  }
-}
-
-interface Props extends HTMLAttributes<HTMLDivElement> {
-  domainResource?: Maybe<AuditEvent | QuestionnaireResponse | DocumentReference>
-  domainResourceType: TimelineDomainResourceType
-}
-
-export default TimelineTime
+import { FC, HTMLAttributes } from 'react'
+import {
+  AuditEvent,
+  DocumentReference,
+  Maybe,
+  QuestionnaireResponse,
+  TimelineDomainResourceType,
+} from '@ltht-react/types'
+import { formatTime } from '@ltht-react/utils'
+
+const TimelineTime: FC<Props> = ({ domainResource, domainResourceType, ...rest }) => {
+  if (!domainResource) return <></>
+
+  switch (domainResourceType) {
+    case TimelineDomainResourceType.QuestionnaireResponse: {
+      const qr = domainResource as QuestionnaireResponse
+      if (!qr?.authored?.value) {
+        return <></>
+      }
+      const time = formatTime(new Date(qr?.authored.value))
+      return <div {...rest}>{time}</div>
+    }
+    case TimelineDomainResourceType.DocumentReference: {
+      const docRef = domainResource as DocumentReference
+      if (docRef && docRef?.created?.value) {
+        const time = formatTime(new Date(docRef.created.value))
+        return <div {...rest}>{time}</div>
+      }
+      return <></>
+    }
+    case TimelineDomainResourceType.AuditEvent: {
+      const audit = domainResource as AuditEvent
+      if (audit && audit?.recorded?.value) {
+        const time = formatTime(new Date(audit.recorded.value))
+        return <div {...rest}>{time}</div>
+      }
+      return <></>
+    }
+    default:
+      return <></>
+  }
+}
+
+interface Props extends HTMLAttributes<HTMLDivElement> {
+  domainResource?: Maybe<AuditEvent | QuestionnaireResponse | DocumentReference>
+  domainResourceType: TimelineDomainResourceType
+}
+
+export default TimelineTime

package/src/atoms/timeline-title-redacted.tsx

@@ -1,13 +1,13 @@
-import { FC, HTMLAttributes } from 'react'
-import { TEXT_COLOURS } from '@ltht-react/styles'
-import styled from '@emotion/styled'
-
-const StyledRedactedMessage = styled.div`
-  color: ${TEXT_COLOURS.SECONDARY.VALUE};
-`
-
-const TimelineTitleRedacted: FC<HTMLAttributes<HTMLDivElement>> = (props) => (
-  <StyledRedactedMessage {...props}>Insufficient Privileges</StyledRedactedMessage>
-)
-
-export default TimelineTitleRedacted
+import { FC, HTMLAttributes } from 'react'
+import { TEXT_COLOURS } from '@ltht-react/styles'
+import styled from '@emotion/styled'
+
+const StyledRedactedMessage = styled.div`
+  color: ${TEXT_COLOURS.SECONDARY.VALUE};
+`
+
+const TimelineTitleRedacted: FC<HTMLAttributes<HTMLDivElement>> = (props) => (
+  <StyledRedactedMessage {...props}>Insufficient Privileges</StyledRedactedMessage>
+)
+
+export default TimelineTitleRedacted

package/src/atoms/timeline-title.tsx

@@ -1,41 +1,41 @@
-import { FC, HTMLAttributes } from 'react'
-import {
-  AuditEvent,
-  DocumentReference,
-  Maybe,
-  QuestionnaireResponse,
-  TimelineDomainResourceType,
-} from '@ltht-react/types'
-
-const TimelineTitle: FC<Props> = ({ domainResource, domainResourceType, ...rest }) => {
-  if (!domainResource) return <></>
-
-  switch (domainResourceType) {
-    case TimelineDomainResourceType.QuestionnaireResponse: {
-      const qr = domainResource as QuestionnaireResponse
-      const questionnaireTitle = qr.metadata.isRedacted
-        ? 'Insufficient privileges'
-        : qr.text?.text ?? qr.questionnaire?.title
-      return <div {...rest}>{questionnaireTitle}</div>
-    }
-    case TimelineDomainResourceType.DocumentReference: {
-      const docRef = domainResource as DocumentReference
-      const docTitle = docRef.metadata.isRedacted ? 'Insufficient privileges' : docRef.text?.text
-      return <div {...rest}>{docTitle}</div>
-    }
-    case TimelineDomainResourceType.AuditEvent: {
-      const audit = domainResource as AuditEvent
-      const auditTitle = audit.metadata.isRedacted ? 'Insufficient privileges' : audit.text?.text
-      return <div {...rest}>{auditTitle}</div>
-    }
-    default:
-      return <></>
-  }
-}
-
-interface Props extends HTMLAttributes<HTMLDivElement> {
-  domainResource?: Maybe<AuditEvent | QuestionnaireResponse | DocumentReference>
-  domainResourceType: TimelineDomainResourceType
-}
-
-export default TimelineTitle
+import { FC, HTMLAttributes } from 'react'
+import {
+  AuditEvent,
+  DocumentReference,
+  Maybe,
+  QuestionnaireResponse,
+  TimelineDomainResourceType,
+} from '@ltht-react/types'
+
+const TimelineTitle: FC<Props> = ({ domainResource, domainResourceType, ...rest }) => {
+  if (!domainResource) return <></>
+
+  switch (domainResourceType) {
+    case TimelineDomainResourceType.QuestionnaireResponse: {
+      const qr = domainResource as QuestionnaireResponse
+      const questionnaireTitle = qr.metadata.isRedacted
+        ? 'Insufficient privileges'
+        : qr.text?.text ?? qr.questionnaire?.title
+      return <div {...rest}>{questionnaireTitle}</div>
+    }
+    case TimelineDomainResourceType.DocumentReference: {
+      const docRef = domainResource as DocumentReference
+      const docTitle = docRef.metadata.isRedacted ? 'Insufficient privileges' : docRef.text?.text
+      return <div {...rest}>{docTitle}</div>
+    }
+    case TimelineDomainResourceType.AuditEvent: {
+      const audit = domainResource as AuditEvent
+      const auditTitle = audit.metadata.isRedacted ? 'Insufficient privileges' : audit.text?.text
+      return <div {...rest}>{auditTitle}</div>
+    }
+    default:
+      return <></>
+  }
+}
+
+interface Props extends HTMLAttributes<HTMLDivElement> {
+  domainResource?: Maybe<AuditEvent | QuestionnaireResponse | DocumentReference>
+  domainResourceType: TimelineDomainResourceType
+}
+
+export default TimelineTitle

package/src/constants.ts

@@ -1,3 +1,3 @@
-const PRIMARY_AUTHOR = 'PRIMAUTH'
-
-export default PRIMARY_AUTHOR
+const PRIMARY_AUTHOR = 'PRIMAUTH'
+
+export default PRIMARY_AUTHOR