@ltht-react/document-summary 2.0.189 → 2.0.191
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +22 -22
- package/package.json +8 -8
- package/src/atoms/document-date.tsx +23 -23
- package/src/atoms/document-description.tsx +18 -18
- package/src/atoms/document-source.tsx +21 -21
- package/src/atoms/document-status.tsx +23 -23
- package/src/index.tsx +3 -3
- package/src/molecules/document-redacted.tsx +32 -32
- package/src/organisms/document-summary.tsx +61 -61
package/README.md
CHANGED
|
@@ -1,22 +1,22 @@
|
|
|
1
|
-
# DocumentSummary
|
|
2
|
-
|
|
3
|
-
<!-- STORY -->
|
|
4
|
-
|
|
5
|
-
### Import
|
|
6
|
-
|
|
7
|
-
```js
|
|
8
|
-
import DocumentSummary from '@ltht-react/document-summary'
|
|
9
|
-
```
|
|
10
|
-
|
|
11
|
-
### Usage
|
|
12
|
-
|
|
13
|
-
```jsx
|
|
14
|
-
<DocumentSummary documents={documentReferences} />
|
|
15
|
-
```
|
|
16
|
-
|
|
17
|
-
### Properties
|
|
18
|
-
|
|
19
|
-
| Prop | Required | Default | Type | Description |
|
|
20
|
-
| :------------- | :------- | :------ | :---------------------------------------- | :----------------------------------------------------- |
|
|
21
|
-
| `documents` | No | | DocumentReference[] | An array of document references |
|
|
22
|
-
| `clickHandler` | No | | clickHandler(document: DocumentReference) | A click handler that will return the selected document |
|
|
1
|
+
# DocumentSummary
|
|
2
|
+
|
|
3
|
+
<!-- STORY -->
|
|
4
|
+
|
|
5
|
+
### Import
|
|
6
|
+
|
|
7
|
+
```js
|
|
8
|
+
import DocumentSummary from '@ltht-react/document-summary'
|
|
9
|
+
```
|
|
10
|
+
|
|
11
|
+
### Usage
|
|
12
|
+
|
|
13
|
+
```jsx
|
|
14
|
+
<DocumentSummary documents={documentReferences} />
|
|
15
|
+
```
|
|
16
|
+
|
|
17
|
+
### Properties
|
|
18
|
+
|
|
19
|
+
| Prop | Required | Default | Type | Description |
|
|
20
|
+
| :------------- | :------- | :------ | :---------------------------------------- | :----------------------------------------------------- |
|
|
21
|
+
| `documents` | No | | DocumentReference[] | An array of document references |
|
|
22
|
+
| `clickHandler` | No | | clickHandler(document: DocumentReference) | A click handler that will return the selected document |
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@ltht-react/document-summary",
|
|
3
|
-
"version": "2.0.
|
|
3
|
+
"version": "2.0.191",
|
|
4
4
|
"description": "ltht-react clinical DocumentSummary component.",
|
|
5
5
|
"author": "LTHT",
|
|
6
6
|
"homepage": "",
|
|
@@ -28,13 +28,13 @@
|
|
|
28
28
|
"dependencies": {
|
|
29
29
|
"@emotion/react": "^11.0.0",
|
|
30
30
|
"@emotion/styled": "^11.0.0",
|
|
31
|
-
"@ltht-react/icon": "^2.0.
|
|
32
|
-
"@ltht-react/list": "^2.0.
|
|
33
|
-
"@ltht-react/styles": "^2.0.
|
|
34
|
-
"@ltht-react/type-summary": "^2.0.
|
|
35
|
-
"@ltht-react/types": "^2.0.
|
|
36
|
-
"@ltht-react/utils": "^2.0.
|
|
31
|
+
"@ltht-react/icon": "^2.0.191",
|
|
32
|
+
"@ltht-react/list": "^2.0.191",
|
|
33
|
+
"@ltht-react/styles": "^2.0.191",
|
|
34
|
+
"@ltht-react/type-summary": "^2.0.191",
|
|
35
|
+
"@ltht-react/types": "^2.0.191",
|
|
36
|
+
"@ltht-react/utils": "^2.0.191",
|
|
37
37
|
"react": "^18.2.0"
|
|
38
38
|
},
|
|
39
|
-
"gitHead": "
|
|
39
|
+
"gitHead": "c5113953a19f4ed9ae82b545f073b5feb7d5a20b"
|
|
40
40
|
}
|
|
@@ -1,23 +1,23 @@
|
|
|
1
|
-
import { FC, HTMLAttributes } from 'react'
|
|
2
|
-
import styled from '@emotion/styled'
|
|
3
|
-
|
|
4
|
-
import { DocumentReference } from '@ltht-react/types'
|
|
5
|
-
import { formatDate } from '@ltht-react/utils'
|
|
6
|
-
|
|
7
|
-
const StyledDocumentDate = styled.div``
|
|
8
|
-
|
|
9
|
-
const DocumentDate: FC<Props> = ({ document: { created, description, indexed }, ...rest }) => {
|
|
10
|
-
if (!description) return <></>
|
|
11
|
-
|
|
12
|
-
const date = created?.value ? created?.value ?? '' : indexed.value ?? ''
|
|
13
|
-
|
|
14
|
-
const formattedDate = formatDate(new Date(Date.parse(date)))
|
|
15
|
-
|
|
16
|
-
return <StyledDocumentDate {...rest}>{formattedDate}</StyledDocumentDate>
|
|
17
|
-
}
|
|
18
|
-
|
|
19
|
-
interface Props extends HTMLAttributes<HTMLDivElement> {
|
|
20
|
-
document: DocumentReference
|
|
21
|
-
}
|
|
22
|
-
|
|
23
|
-
export default DocumentDate
|
|
1
|
+
import { FC, HTMLAttributes } from 'react'
|
|
2
|
+
import styled from '@emotion/styled'
|
|
3
|
+
|
|
4
|
+
import { DocumentReference } from '@ltht-react/types'
|
|
5
|
+
import { formatDate } from '@ltht-react/utils'
|
|
6
|
+
|
|
7
|
+
const StyledDocumentDate = styled.div``
|
|
8
|
+
|
|
9
|
+
const DocumentDate: FC<Props> = ({ document: { created, description, indexed }, ...rest }) => {
|
|
10
|
+
if (!description) return <></>
|
|
11
|
+
|
|
12
|
+
const date = created?.value ? created?.value ?? '' : indexed.value ?? ''
|
|
13
|
+
|
|
14
|
+
const formattedDate = formatDate(new Date(Date.parse(date)))
|
|
15
|
+
|
|
16
|
+
return <StyledDocumentDate {...rest}>{formattedDate}</StyledDocumentDate>
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
interface Props extends HTMLAttributes<HTMLDivElement> {
|
|
20
|
+
document: DocumentReference
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
export default DocumentDate
|
|
@@ -1,18 +1,18 @@
|
|
|
1
|
-
import { FC, HTMLAttributes } from 'react'
|
|
2
|
-
import styled from '@emotion/styled'
|
|
3
|
-
|
|
4
|
-
import { DocumentReference } from '@ltht-react/types'
|
|
5
|
-
|
|
6
|
-
const StyledDocumentDescription = styled.div``
|
|
7
|
-
|
|
8
|
-
const DocumentDescription: FC<Props> = ({ document: { description } }, ...rest) => {
|
|
9
|
-
if (!description) return <></>
|
|
10
|
-
|
|
11
|
-
return <StyledDocumentDescription {...rest}>{description}</StyledDocumentDescription>
|
|
12
|
-
}
|
|
13
|
-
|
|
14
|
-
interface Props extends HTMLAttributes<HTMLDivElement> {
|
|
15
|
-
document: DocumentReference
|
|
16
|
-
}
|
|
17
|
-
|
|
18
|
-
export default DocumentDescription
|
|
1
|
+
import { FC, HTMLAttributes } from 'react'
|
|
2
|
+
import styled from '@emotion/styled'
|
|
3
|
+
|
|
4
|
+
import { DocumentReference } from '@ltht-react/types'
|
|
5
|
+
|
|
6
|
+
const StyledDocumentDescription = styled.div``
|
|
7
|
+
|
|
8
|
+
const DocumentDescription: FC<Props> = ({ document: { description } }, ...rest) => {
|
|
9
|
+
if (!description) return <></>
|
|
10
|
+
|
|
11
|
+
return <StyledDocumentDescription {...rest}>{description}</StyledDocumentDescription>
|
|
12
|
+
}
|
|
13
|
+
|
|
14
|
+
interface Props extends HTMLAttributes<HTMLDivElement> {
|
|
15
|
+
document: DocumentReference
|
|
16
|
+
}
|
|
17
|
+
|
|
18
|
+
export default DocumentDescription
|
|
@@ -1,21 +1,21 @@
|
|
|
1
|
-
import { FC, HTMLAttributes } from 'react'
|
|
2
|
-
import styled from '@emotion/styled'
|
|
3
|
-
|
|
4
|
-
import { titleCase } from '@ltht-react/utils'
|
|
5
|
-
import { DocumentReference } from '@ltht-react/types'
|
|
6
|
-
|
|
7
|
-
const StyledDocumentSource = styled.div``
|
|
8
|
-
|
|
9
|
-
const DocumentSource: FC<Props> = ({ document, ...rest }) => {
|
|
10
|
-
const source = document.metadata?.dataSources ? document.metadata.dataSources[0]?.display : undefined
|
|
11
|
-
|
|
12
|
-
if (!source) return <></>
|
|
13
|
-
|
|
14
|
-
return <StyledDocumentSource {...rest}>{titleCase(source)}</StyledDocumentSource>
|
|
15
|
-
}
|
|
16
|
-
|
|
17
|
-
interface Props extends HTMLAttributes<HTMLDivElement> {
|
|
18
|
-
document: DocumentReference
|
|
19
|
-
}
|
|
20
|
-
|
|
21
|
-
export default DocumentSource
|
|
1
|
+
import { FC, HTMLAttributes } from 'react'
|
|
2
|
+
import styled from '@emotion/styled'
|
|
3
|
+
|
|
4
|
+
import { titleCase } from '@ltht-react/utils'
|
|
5
|
+
import { DocumentReference } from '@ltht-react/types'
|
|
6
|
+
|
|
7
|
+
const StyledDocumentSource = styled.div``
|
|
8
|
+
|
|
9
|
+
const DocumentSource: FC<Props> = ({ document, ...rest }) => {
|
|
10
|
+
const source = document.metadata?.dataSources ? document.metadata.dataSources[0]?.display : undefined
|
|
11
|
+
|
|
12
|
+
if (!source) return <></>
|
|
13
|
+
|
|
14
|
+
return <StyledDocumentSource {...rest}>{titleCase(source)}</StyledDocumentSource>
|
|
15
|
+
}
|
|
16
|
+
|
|
17
|
+
interface Props extends HTMLAttributes<HTMLDivElement> {
|
|
18
|
+
document: DocumentReference
|
|
19
|
+
}
|
|
20
|
+
|
|
21
|
+
export default DocumentSource
|
|
@@ -1,23 +1,23 @@
|
|
|
1
|
-
import { FC, HTMLAttributes } from 'react'
|
|
2
|
-
import styled from '@emotion/styled'
|
|
3
|
-
|
|
4
|
-
import { TEXT_COLOURS } from '@ltht-react/styles'
|
|
5
|
-
import { titleCase } from '@ltht-react/utils'
|
|
6
|
-
import { DocumentReference } from '@ltht-react/types'
|
|
7
|
-
|
|
8
|
-
const StyledStatus = styled.div`
|
|
9
|
-
font-size: smaller;
|
|
10
|
-
color: ${TEXT_COLOURS.SECONDARY.VALUE};
|
|
11
|
-
`
|
|
12
|
-
|
|
13
|
-
const DocumentStatus: FC<Props> = ({ document: { status } }) => {
|
|
14
|
-
if (!status) return <></>
|
|
15
|
-
|
|
16
|
-
return <StyledStatus>{titleCase(status)}</StyledStatus>
|
|
17
|
-
}
|
|
18
|
-
|
|
19
|
-
interface Props extends HTMLAttributes<HTMLDivElement> {
|
|
20
|
-
document: DocumentReference
|
|
21
|
-
}
|
|
22
|
-
|
|
23
|
-
export default DocumentStatus
|
|
1
|
+
import { FC, HTMLAttributes } from 'react'
|
|
2
|
+
import styled from '@emotion/styled'
|
|
3
|
+
|
|
4
|
+
import { TEXT_COLOURS } from '@ltht-react/styles'
|
|
5
|
+
import { titleCase } from '@ltht-react/utils'
|
|
6
|
+
import { DocumentReference } from '@ltht-react/types'
|
|
7
|
+
|
|
8
|
+
const StyledStatus = styled.div`
|
|
9
|
+
font-size: smaller;
|
|
10
|
+
color: ${TEXT_COLOURS.SECONDARY.VALUE};
|
|
11
|
+
`
|
|
12
|
+
|
|
13
|
+
const DocumentStatus: FC<Props> = ({ document: { status } }) => {
|
|
14
|
+
if (!status) return <></>
|
|
15
|
+
|
|
16
|
+
return <StyledStatus>{titleCase(status)}</StyledStatus>
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
interface Props extends HTMLAttributes<HTMLDivElement> {
|
|
20
|
+
document: DocumentReference
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
export default DocumentStatus
|
package/src/index.tsx
CHANGED
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import DocumentSummary from './organisms/document-summary'
|
|
2
|
-
|
|
3
|
-
export default DocumentSummary
|
|
1
|
+
import DocumentSummary from './organisms/document-summary'
|
|
2
|
+
|
|
3
|
+
export default DocumentSummary
|
|
@@ -1,32 +1,32 @@
|
|
|
1
|
-
import { FC } from 'react'
|
|
2
|
-
import styled from '@emotion/styled'
|
|
3
|
-
|
|
4
|
-
import { DocumentReference } from '@ltht-react/types'
|
|
5
|
-
import { RedactedDescription } from '@ltht-react/type-summary'
|
|
6
|
-
|
|
7
|
-
import Date from '../atoms/document-date'
|
|
8
|
-
|
|
9
|
-
const StyledDescription = styled.div`
|
|
10
|
-
flex: 1;
|
|
11
|
-
text-align: right;
|
|
12
|
-
`
|
|
13
|
-
const StyledDate = styled.div`
|
|
14
|
-
flex: 1;
|
|
15
|
-
`
|
|
16
|
-
|
|
17
|
-
const DocumentRedacted: FC<Props> = ({ document }) => (
|
|
18
|
-
<>
|
|
19
|
-
<StyledDate>
|
|
20
|
-
<Date document={document} />
|
|
21
|
-
</StyledDate>
|
|
22
|
-
<StyledDescription>
|
|
23
|
-
<RedactedDescription />
|
|
24
|
-
</StyledDescription>
|
|
25
|
-
</>
|
|
26
|
-
)
|
|
27
|
-
|
|
28
|
-
interface Props {
|
|
29
|
-
document: DocumentReference
|
|
30
|
-
}
|
|
31
|
-
|
|
32
|
-
export default DocumentRedacted
|
|
1
|
+
import { FC } from 'react'
|
|
2
|
+
import styled from '@emotion/styled'
|
|
3
|
+
|
|
4
|
+
import { DocumentReference } from '@ltht-react/types'
|
|
5
|
+
import { RedactedDescription } from '@ltht-react/type-summary'
|
|
6
|
+
|
|
7
|
+
import Date from '../atoms/document-date'
|
|
8
|
+
|
|
9
|
+
const StyledDescription = styled.div`
|
|
10
|
+
flex: 1;
|
|
11
|
+
text-align: right;
|
|
12
|
+
`
|
|
13
|
+
const StyledDate = styled.div`
|
|
14
|
+
flex: 1;
|
|
15
|
+
`
|
|
16
|
+
|
|
17
|
+
const DocumentRedacted: FC<Props> = ({ document }) => (
|
|
18
|
+
<>
|
|
19
|
+
<StyledDate>
|
|
20
|
+
<Date document={document} />
|
|
21
|
+
</StyledDate>
|
|
22
|
+
<StyledDescription>
|
|
23
|
+
<RedactedDescription />
|
|
24
|
+
</StyledDescription>
|
|
25
|
+
</>
|
|
26
|
+
)
|
|
27
|
+
|
|
28
|
+
interface Props {
|
|
29
|
+
document: DocumentReference
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
export default DocumentRedacted
|
|
@@ -1,61 +1,61 @@
|
|
|
1
|
-
import { FC, HTMLAttributes } from 'react'
|
|
2
|
-
import styled from '@emotion/styled'
|
|
3
|
-
|
|
4
|
-
import { DocumentReference } from '@ltht-react/types'
|
|
5
|
-
|
|
6
|
-
import Date from '../atoms/document-date'
|
|
7
|
-
import Description from '../atoms/document-description'
|
|
8
|
-
import Source from '../atoms/document-source'
|
|
9
|
-
import Status from '../atoms/document-status'
|
|
10
|
-
import Redacted from '../molecules/document-redacted'
|
|
11
|
-
|
|
12
|
-
const StyledSummary = styled.div`
|
|
13
|
-
display: flex;
|
|
14
|
-
flex-direction: row;
|
|
15
|
-
align-items: center;
|
|
16
|
-
`
|
|
17
|
-
|
|
18
|
-
const StyledDate = styled.div`
|
|
19
|
-
margin-right: 0.5rem;
|
|
20
|
-
`
|
|
21
|
-
|
|
22
|
-
const StyledDescription = styled.div`
|
|
23
|
-
flex-grow: 1;
|
|
24
|
-
`
|
|
25
|
-
|
|
26
|
-
const StyledSource = styled.div`
|
|
27
|
-
display: flex;
|
|
28
|
-
flex-direction: column;
|
|
29
|
-
text-align: right;
|
|
30
|
-
`
|
|
31
|
-
|
|
32
|
-
const DocumentSummary: FC<Props> = ({ document, ...rest }) => {
|
|
33
|
-
if (document.metadata.isRedacted) {
|
|
34
|
-
return (
|
|
35
|
-
<StyledSummary {...rest}>
|
|
36
|
-
<Redacted document={document} />
|
|
37
|
-
</StyledSummary>
|
|
38
|
-
)
|
|
39
|
-
}
|
|
40
|
-
|
|
41
|
-
return (
|
|
42
|
-
<StyledSummary {...rest}>
|
|
43
|
-
<StyledDate>
|
|
44
|
-
<Date document={document} />
|
|
45
|
-
</StyledDate>
|
|
46
|
-
<StyledDescription>
|
|
47
|
-
<Description document={document} />
|
|
48
|
-
</StyledDescription>
|
|
49
|
-
<StyledSource>
|
|
50
|
-
<Source document={document} />
|
|
51
|
-
<Status document={document} />
|
|
52
|
-
</StyledSource>
|
|
53
|
-
</StyledSummary>
|
|
54
|
-
)
|
|
55
|
-
}
|
|
56
|
-
|
|
57
|
-
interface Props extends HTMLAttributes<HTMLDivElement> {
|
|
58
|
-
document: DocumentReference
|
|
59
|
-
}
|
|
60
|
-
|
|
61
|
-
export default DocumentSummary
|
|
1
|
+
import { FC, HTMLAttributes } from 'react'
|
|
2
|
+
import styled from '@emotion/styled'
|
|
3
|
+
|
|
4
|
+
import { DocumentReference } from '@ltht-react/types'
|
|
5
|
+
|
|
6
|
+
import Date from '../atoms/document-date'
|
|
7
|
+
import Description from '../atoms/document-description'
|
|
8
|
+
import Source from '../atoms/document-source'
|
|
9
|
+
import Status from '../atoms/document-status'
|
|
10
|
+
import Redacted from '../molecules/document-redacted'
|
|
11
|
+
|
|
12
|
+
const StyledSummary = styled.div`
|
|
13
|
+
display: flex;
|
|
14
|
+
flex-direction: row;
|
|
15
|
+
align-items: center;
|
|
16
|
+
`
|
|
17
|
+
|
|
18
|
+
const StyledDate = styled.div`
|
|
19
|
+
margin-right: 0.5rem;
|
|
20
|
+
`
|
|
21
|
+
|
|
22
|
+
const StyledDescription = styled.div`
|
|
23
|
+
flex-grow: 1;
|
|
24
|
+
`
|
|
25
|
+
|
|
26
|
+
const StyledSource = styled.div`
|
|
27
|
+
display: flex;
|
|
28
|
+
flex-direction: column;
|
|
29
|
+
text-align: right;
|
|
30
|
+
`
|
|
31
|
+
|
|
32
|
+
const DocumentSummary: FC<Props> = ({ document, ...rest }) => {
|
|
33
|
+
if (document.metadata.isRedacted) {
|
|
34
|
+
return (
|
|
35
|
+
<StyledSummary {...rest}>
|
|
36
|
+
<Redacted document={document} />
|
|
37
|
+
</StyledSummary>
|
|
38
|
+
)
|
|
39
|
+
}
|
|
40
|
+
|
|
41
|
+
return (
|
|
42
|
+
<StyledSummary {...rest}>
|
|
43
|
+
<StyledDate>
|
|
44
|
+
<Date document={document} />
|
|
45
|
+
</StyledDate>
|
|
46
|
+
<StyledDescription>
|
|
47
|
+
<Description document={document} />
|
|
48
|
+
</StyledDescription>
|
|
49
|
+
<StyledSource>
|
|
50
|
+
<Source document={document} />
|
|
51
|
+
<Status document={document} />
|
|
52
|
+
</StyledSource>
|
|
53
|
+
</StyledSummary>
|
|
54
|
+
)
|
|
55
|
+
}
|
|
56
|
+
|
|
57
|
+
interface Props extends HTMLAttributes<HTMLDivElement> {
|
|
58
|
+
document: DocumentReference
|
|
59
|
+
}
|
|
60
|
+
|
|
61
|
+
export default DocumentSummary
|