blob: 5db12a537b644d7cfe1f1d5365ce2c1fe17a65f8 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
|
import style from "./content-text.module.css"
import { createSignal } from "solid-js"
import { createOverflow } from "./common"
import { CopyButton } from "./copy-button"
interface Props {
text: string
expand?: boolean
compact?: boolean
}
export function ContentText(props: Props) {
const [expanded, setExpanded] = createSignal(false)
const overflow = createOverflow()
return (
<div
class={style.root}
data-expanded={expanded() || props.expand === true ? true : undefined}
data-compact={props.compact === true ? true : undefined}
>
<pre data-slot="text" ref={overflow.ref}>
{props.text}
</pre>
{((!props.expand && overflow.status) || expanded()) && (
<button
type="button"
data-component="text-button"
data-slot="expand-button"
onClick={() => setExpanded((e) => !e)}
>
{expanded() ? "Show less" : "Show more"}
</button>
)}
<CopyButton text={props.text} />
</div>
)
}
|
