@ltht-react/timeline 2.0.62 → 2.0.64

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 { itemClickHandler, 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={itemClickHandler}>
-          {buttonText ?? ''}
-        </ButtonBanner>
-      )
-    case 'selected-button':
-      return (
-        <ButtonBanner
-          className={className}
-          type="highlight"
-          icon={<Icon type="info-circle" color="info-blue" size="medium" />}
-          onClick={itemClickHandler}
-        >
-          {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 { itemClickHandler, 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={itemClickHandler}>
+          {buttonText ?? ''}
+        </ButtonBanner>
+      )
+    case 'selected-button':
+      return (
+        <ButtonBanner
+          className={className}
+          type="highlight"
+          icon={<Icon type="info-circle" color="info-blue" size="medium" />}
+          onClick={itemClickHandler}
+        >
+          {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,69 +1,69 @@
-import { FC, HTMLAttributes } from 'react'
-import {
-  AuditEvent,
-  DocumentReference,
-  Maybe,
-  QuestionnaireResponse,
-  TimelineDomainResourceType,
-} from '@ltht-react/types'
-import TimeElement, { Orientation } from './time-element'
-
-const TimelineTime: FC<Props> = ({
-  domainResource,
-  domainResourceType,
-  orientation,
-  pointInTimeClickHandler,
-  ...rest
-}) => {
-  if (!domainResource) return <></>
-
-  switch (domainResourceType) {
-    case TimelineDomainResourceType.QuestionnaireResponse: {
-      const qr = domainResource as QuestionnaireResponse
-      if (!qr?.authored?.value) {
-        return null
-      }
-      const date = new Date(qr?.authored.value)
-      return (
-        <div {...rest}>
-          <TimeElement orientation={orientation} date={date} pointInTimeClicked={pointInTimeClickHandler} />
-        </div>
-      )
-    }
-    case TimelineDomainResourceType.DocumentReference: {
-      const docRef = domainResource as DocumentReference
-      if (docRef && docRef?.created?.value) {
-        const date = new Date(docRef.created.value)
-        return (
-          <div {...rest}>
-            <TimeElement orientation={orientation} date={date} pointInTimeClicked={pointInTimeClickHandler} />
-          </div>
-        )
-      }
-      return null
-    }
-    case TimelineDomainResourceType.AuditEvent: {
-      const audit = domainResource as AuditEvent
-      if (audit && audit?.recorded?.value) {
-        const date = new Date(audit.recorded.value)
-        return (
-          <div {...rest}>
-            <TimeElement orientation={orientation} date={date} pointInTimeClicked={pointInTimeClickHandler} />
-          </div>
-        )
-      }
-      return null
-    }
-    default:
-      return null
-  }
-}
-
-interface Props extends HTMLAttributes<HTMLDivElement> {
-  domainResource?: Maybe<AuditEvent | QuestionnaireResponse | DocumentReference>
-  domainResourceType: TimelineDomainResourceType
-  orientation?: Orientation
-  pointInTimeClickHandler?: (date: Date) => void
-}
-
-export default TimelineTime
+import { FC, HTMLAttributes } from 'react'
+import {
+  AuditEvent,
+  DocumentReference,
+  Maybe,
+  QuestionnaireResponse,
+  TimelineDomainResourceType,
+} from '@ltht-react/types'
+import TimeElement, { Orientation } from './time-element'
+
+const TimelineTime: FC<Props> = ({
+  domainResource,
+  domainResourceType,
+  orientation,
+  pointInTimeClickHandler,
+  ...rest
+}) => {
+  if (!domainResource) return <></>
+
+  switch (domainResourceType) {
+    case TimelineDomainResourceType.QuestionnaireResponse: {
+      const qr = domainResource as QuestionnaireResponse
+      if (!qr?.authored?.value) {
+        return null
+      }
+      const date = new Date(qr?.authored.value)
+      return (
+        <div {...rest}>
+          <TimeElement orientation={orientation} date={date} pointInTimeClicked={pointInTimeClickHandler} />
+        </div>
+      )
+    }
+    case TimelineDomainResourceType.DocumentReference: {
+      const docRef = domainResource as DocumentReference
+      if (docRef && docRef?.created?.value) {
+        const date = new Date(docRef.created.value)
+        return (
+          <div {...rest}>
+            <TimeElement orientation={orientation} date={date} pointInTimeClicked={pointInTimeClickHandler} />
+          </div>
+        )
+      }
+      return null
+    }
+    case TimelineDomainResourceType.AuditEvent: {
+      const audit = domainResource as AuditEvent
+      if (audit && audit?.recorded?.value) {
+        const date = new Date(audit.recorded.value)
+        return (
+          <div {...rest}>
+            <TimeElement orientation={orientation} date={date} pointInTimeClicked={pointInTimeClickHandler} />
+          </div>
+        )
+      }
+      return null
+    }
+    default:
+      return null
+  }
+}
+
+interface Props extends HTMLAttributes<HTMLDivElement> {
+  domainResource?: Maybe<AuditEvent | QuestionnaireResponse | DocumentReference>
+  domainResourceType: TimelineDomainResourceType
+  orientation?: Orientation
+  pointInTimeClickHandler?: (date: Date) => void
+}
+
+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

package/src/index.tsx

@@ -1,6 +1,6 @@
-import Timeline, { ITimelineFilter, ITimelineFilterOption } from './organisms/timeline'
-import { ITimelineItem } from './molecules/timeline-item'
-import PRIMARY_AUTHOR from './constants'
-
-export default Timeline
-export { ITimelineItem, ITimelineFilter, ITimelineFilterOption, PRIMARY_AUTHOR }
+import Timeline, { ITimelineFilter, ITimelineFilterOption } from './organisms/timeline'
+import { ITimelineItem } from './molecules/timeline-item'
+import PRIMARY_AUTHOR from './constants'
+
+export default Timeline
+export { ITimelineItem, ITimelineFilter, ITimelineFilterOption, PRIMARY_AUTHOR }