Passed
Push — main ( 1da5a1...d84d54 )
by Andrii
02:24
created

map.spec.tsx ➔ Component   A

Complexity

Conditions 2

Size

Total Lines 12
Code Lines 8

Duplication

Lines 0
Ratio 0 %

Importance

Changes 0
Metric Value
cc 2
eloc 8
dl 0
loc 12
rs 10
c 0
b 0
f 0
1
import React from "react"
2
import classNaming from ".";
3
import expectRender from "../expect-to-same-render";
4
import { ClassHash, ClassNamesProperty } from "./defs";
5
import classNamesMap from "./map";
6
7
8
type ComponentProps = {checked: boolean} & ClassNamesProperty<{
9
  Container: ClassHash
10
  Checked___true: ClassHash
11
  Checked___false: ClassHash
12
}>
13
14
function Component({
15
  checked,
16
  classnames, classnames: {
17
    Checked___true, Checked___false
18
  }
19
}: ComponentProps ) {
20
  const classes = classNaming({classnames})
21
22
  return <div {...classes({Container: true})}>
23
    <div {...classes(checked ? {Checked___true} : {Checked___false})}/>
24
  </div>
25
}
26
27
28
const classnames = {Root: "App", "Item--active": "hash1"} as Record<"Root"|"Theme--dark"|"Item--active", ClassHash>
29
, {Root} = classnames
30
, mapping = classNamesMap(classnames)
31
32
it("demo", () => expectRender(
33
  <Component checked={true} {...mapping<ComponentProps>(
34
    {
35
      Container: {Root, "Theme--dark": true},
36
      Checked___true: {"Item--active": true},
37
      Checked___false: {}
38
    }
39
  )}/>
40
).toSame(
41
  <div className="App Theme--dark">
42
    <div className="hash1"/>
43
  </div>
44
))