@ltht-react/description-list 2.0.190 → 2.0.192
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 +15 -15
- package/package.json +5 -5
- package/src/atoms/description.tsx +21 -21
- package/src/atoms/term.tsx +21 -21
- package/src/index.tsx +36 -36
package/README.md
CHANGED
|
@@ -1,15 +1,15 @@
|
|
|
1
|
-
# DescriptionList
|
|
2
|
-
|
|
3
|
-
<!-- STORY -->
|
|
4
|
-
|
|
5
|
-
### Import
|
|
6
|
-
|
|
7
|
-
```js
|
|
8
|
-
import DescriptionList from '@ltht-react/description-list'
|
|
9
|
-
```
|
|
10
|
-
|
|
11
|
-
### Usage
|
|
12
|
-
|
|
13
|
-
```jsx
|
|
14
|
-
<DescriptionList />
|
|
15
|
-
```
|
|
1
|
+
# DescriptionList
|
|
2
|
+
|
|
3
|
+
<!-- STORY -->
|
|
4
|
+
|
|
5
|
+
### Import
|
|
6
|
+
|
|
7
|
+
```js
|
|
8
|
+
import DescriptionList from '@ltht-react/description-list'
|
|
9
|
+
```
|
|
10
|
+
|
|
11
|
+
### Usage
|
|
12
|
+
|
|
13
|
+
```jsx
|
|
14
|
+
<DescriptionList />
|
|
15
|
+
```
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@ltht-react/description-list",
|
|
3
|
-
"version": "2.0.
|
|
3
|
+
"version": "2.0.192",
|
|
4
4
|
"description": "ltht-react DescriptionList component.",
|
|
5
5
|
"author": "LTHT",
|
|
6
6
|
"homepage": "",
|
|
@@ -28,11 +28,11 @@
|
|
|
28
28
|
"dependencies": {
|
|
29
29
|
"@emotion/react": "^11.0.0",
|
|
30
30
|
"@emotion/styled": "^11.0.0",
|
|
31
|
-
"@ltht-react/styles": "^2.0.
|
|
32
|
-
"@ltht-react/types": "^2.0.
|
|
33
|
-
"@ltht-react/utils": "^2.0.
|
|
31
|
+
"@ltht-react/styles": "^2.0.192",
|
|
32
|
+
"@ltht-react/types": "^2.0.192",
|
|
33
|
+
"@ltht-react/utils": "^2.0.192",
|
|
34
34
|
"classnames": "^2.2.6",
|
|
35
35
|
"react": "^18.2.0"
|
|
36
36
|
},
|
|
37
|
-
"gitHead": "
|
|
37
|
+
"gitHead": "d97c241ba79c5e28edb4dec124e156cda6e9af66"
|
|
38
38
|
}
|
|
@@ -1,21 +1,21 @@
|
|
|
1
|
-
import { HTMLAttributes, FC } from 'react'
|
|
2
|
-
import classNames from 'classnames'
|
|
3
|
-
import styled from '@emotion/styled'
|
|
4
|
-
import { TEXT_COLOURS } from '@ltht-react/styles'
|
|
5
|
-
|
|
6
|
-
const StyledDescription = styled.dd`
|
|
7
|
-
color: ${TEXT_COLOURS.SECONDARY};
|
|
8
|
-
margin-left: 0;
|
|
9
|
-
`
|
|
10
|
-
|
|
11
|
-
const Description: FC<Props> = ({ children, classes, ...rest }) => (
|
|
12
|
-
<StyledDescription className={classNames('description-list__description', classes)} {...rest}>
|
|
13
|
-
{children}
|
|
14
|
-
</StyledDescription>
|
|
15
|
-
)
|
|
16
|
-
|
|
17
|
-
export interface Props extends HTMLAttributes<HTMLElement> {
|
|
18
|
-
classes?: string
|
|
19
|
-
}
|
|
20
|
-
|
|
21
|
-
export default Description
|
|
1
|
+
import { HTMLAttributes, FC } from 'react'
|
|
2
|
+
import classNames from 'classnames'
|
|
3
|
+
import styled from '@emotion/styled'
|
|
4
|
+
import { TEXT_COLOURS } from '@ltht-react/styles'
|
|
5
|
+
|
|
6
|
+
const StyledDescription = styled.dd`
|
|
7
|
+
color: ${TEXT_COLOURS.SECONDARY};
|
|
8
|
+
margin-left: 0;
|
|
9
|
+
`
|
|
10
|
+
|
|
11
|
+
const Description: FC<Props> = ({ children, classes, ...rest }) => (
|
|
12
|
+
<StyledDescription className={classNames('description-list__description', classes)} {...rest}>
|
|
13
|
+
{children}
|
|
14
|
+
</StyledDescription>
|
|
15
|
+
)
|
|
16
|
+
|
|
17
|
+
export interface Props extends HTMLAttributes<HTMLElement> {
|
|
18
|
+
classes?: string
|
|
19
|
+
}
|
|
20
|
+
|
|
21
|
+
export default Description
|
package/src/atoms/term.tsx
CHANGED
|
@@ -1,21 +1,21 @@
|
|
|
1
|
-
import { HTMLAttributes, FC } from 'react'
|
|
2
|
-
import classNames from 'classnames'
|
|
3
|
-
import styled from '@emotion/styled'
|
|
4
|
-
import { TEXT_COLOURS } from '@ltht-react/styles'
|
|
5
|
-
|
|
6
|
-
const StyledDescriptionTerm = styled.dt`
|
|
7
|
-
color: ${TEXT_COLOURS.SECONDARY.LIGHTER25};
|
|
8
|
-
margin-bottom: 0.25rem;
|
|
9
|
-
`
|
|
10
|
-
|
|
11
|
-
const Term: FC<Props> = ({ children, classes, ...rest }) => (
|
|
12
|
-
<StyledDescriptionTerm className={classNames('description-list__term', classes)} {...rest}>
|
|
13
|
-
{children}
|
|
14
|
-
</StyledDescriptionTerm>
|
|
15
|
-
)
|
|
16
|
-
|
|
17
|
-
export interface Props extends HTMLAttributes<HTMLElement> {
|
|
18
|
-
classes?: string
|
|
19
|
-
}
|
|
20
|
-
|
|
21
|
-
export default Term
|
|
1
|
+
import { HTMLAttributes, FC } from 'react'
|
|
2
|
+
import classNames from 'classnames'
|
|
3
|
+
import styled from '@emotion/styled'
|
|
4
|
+
import { TEXT_COLOURS } from '@ltht-react/styles'
|
|
5
|
+
|
|
6
|
+
const StyledDescriptionTerm = styled.dt`
|
|
7
|
+
color: ${TEXT_COLOURS.SECONDARY.LIGHTER25};
|
|
8
|
+
margin-bottom: 0.25rem;
|
|
9
|
+
`
|
|
10
|
+
|
|
11
|
+
const Term: FC<Props> = ({ children, classes, ...rest }) => (
|
|
12
|
+
<StyledDescriptionTerm className={classNames('description-list__term', classes)} {...rest}>
|
|
13
|
+
{children}
|
|
14
|
+
</StyledDescriptionTerm>
|
|
15
|
+
)
|
|
16
|
+
|
|
17
|
+
export interface Props extends HTMLAttributes<HTMLElement> {
|
|
18
|
+
classes?: string
|
|
19
|
+
}
|
|
20
|
+
|
|
21
|
+
export default Term
|
package/src/index.tsx
CHANGED
|
@@ -1,36 +1,36 @@
|
|
|
1
|
-
import { FC, HTMLAttributes } from 'react'
|
|
2
|
-
import classNames from 'classnames'
|
|
3
|
-
import styled from '@emotion/styled'
|
|
4
|
-
|
|
5
|
-
import Term, { Props as TermProps } from './atoms/term'
|
|
6
|
-
import Description, { Props as DescriptionProps } from './atoms/description'
|
|
7
|
-
|
|
8
|
-
const StyledDescriptionList = styled.dl`
|
|
9
|
-
list-style: none;
|
|
10
|
-
margin-top: 1rem;
|
|
11
|
-
margin-bottom: 0;
|
|
12
|
-
|
|
13
|
-
&:first-of-type {
|
|
14
|
-
margin-top: 0;
|
|
15
|
-
}
|
|
16
|
-
`
|
|
17
|
-
|
|
18
|
-
const DescriptionList: FC<DescriptionListProps> & DescriptionListComposition = ({ classes, children, ...rest }) => (
|
|
19
|
-
<StyledDescriptionList className={classNames('description-list', classes)} {...rest}>
|
|
20
|
-
{children}
|
|
21
|
-
</StyledDescriptionList>
|
|
22
|
-
)
|
|
23
|
-
|
|
24
|
-
DescriptionList.Term = Term
|
|
25
|
-
DescriptionList.Description = Description
|
|
26
|
-
|
|
27
|
-
interface DescriptionListComposition {
|
|
28
|
-
Term: FC<TermProps>
|
|
29
|
-
Description: FC<DescriptionProps>
|
|
30
|
-
}
|
|
31
|
-
|
|
32
|
-
export interface DescriptionListProps extends HTMLAttributes<HTMLDListElement> {
|
|
33
|
-
classes?: string
|
|
34
|
-
}
|
|
35
|
-
|
|
36
|
-
export default DescriptionList
|
|
1
|
+
import { FC, HTMLAttributes } from 'react'
|
|
2
|
+
import classNames from 'classnames'
|
|
3
|
+
import styled from '@emotion/styled'
|
|
4
|
+
|
|
5
|
+
import Term, { Props as TermProps } from './atoms/term'
|
|
6
|
+
import Description, { Props as DescriptionProps } from './atoms/description'
|
|
7
|
+
|
|
8
|
+
const StyledDescriptionList = styled.dl`
|
|
9
|
+
list-style: none;
|
|
10
|
+
margin-top: 1rem;
|
|
11
|
+
margin-bottom: 0;
|
|
12
|
+
|
|
13
|
+
&:first-of-type {
|
|
14
|
+
margin-top: 0;
|
|
15
|
+
}
|
|
16
|
+
`
|
|
17
|
+
|
|
18
|
+
const DescriptionList: FC<DescriptionListProps> & DescriptionListComposition = ({ classes, children, ...rest }) => (
|
|
19
|
+
<StyledDescriptionList className={classNames('description-list', classes)} {...rest}>
|
|
20
|
+
{children}
|
|
21
|
+
</StyledDescriptionList>
|
|
22
|
+
)
|
|
23
|
+
|
|
24
|
+
DescriptionList.Term = Term
|
|
25
|
+
DescriptionList.Description = Description
|
|
26
|
+
|
|
27
|
+
interface DescriptionListComposition {
|
|
28
|
+
Term: FC<TermProps>
|
|
29
|
+
Description: FC<DescriptionProps>
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
export interface DescriptionListProps extends HTMLAttributes<HTMLDListElement> {
|
|
33
|
+
classes?: string
|
|
34
|
+
}
|
|
35
|
+
|
|
36
|
+
export default DescriptionList
|