app/react/Markdown/components/specs/__snapshots__/BarChart.spec.js.snap
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`BarChart Markdown component should render a placeholder when data is undefined 1`] = `
<div
className="BarChart "
>
<Loader />
</div>
`;
exports[`BarChart Markdown component should render the data passed by mapStateToProps 1`] = `
<div
className="BarChart custom-class"
>
<ForwardRef
height={320}
>
<BarChart
barCategoryGap="10%"
barGap={4}
data={
Array [
Object {
"id": "id2",
"label": "label2",
"results": 33,
},
Object {
"id": "id1",
"label": "label1",
"results": 25,
},
Object {
"id": "id3",
"label": "label3",
"results": 13,
},
Object {
"id": "id4",
"label": "label4",
"results": 0,
},
]
}
height={300}
layout="horizontal"
margin={
Object {
"bottom": 5,
"left": 5,
"right": 5,
"top": 5,
}
}
reverseStackOrder={false}
stackOffset="none"
syncMethod="index"
>
<XAxis
allowDataOverflow={false}
allowDecimals={true}
allowDuplicatedCategory={true}
dataKey="label"
height={30}
hide={false}
label=""
mirror={false}
orientation="bottom"
padding={
Object {
"left": 0,
"right": 0,
}
}
reversed={false}
scale="auto"
tickCount={5}
type="category"
width={0}
xAxisId={0}
/>
<YAxis
allowDataOverflow={false}
allowDecimals={true}
allowDuplicatedCategory={true}
height={0}
hide={false}
mirror={false}
orientation="left"
padding={
Object {
"bottom": 0,
"top": 0,
}
}
reversed={false}
scale="auto"
tickCount={5}
type="number"
width={60}
yAxisId={0}
/>
<CartesianGrid
strokeDasharray="2 4"
/>
<Tooltip
accessibilityLayer={false}
allowEscapeViewBox={
Object {
"x": false,
"y": false,
}
}
animationDuration={400}
animationEasing="ease"
contentStyle={Object {}}
coordinate={
Object {
"x": 0,
"y": 0,
}
}
cursor={true}
cursorStyle={Object {}}
filterNull={true}
formatter={[Function]}
isAnimationActive={true}
itemStyle={Object {}}
labelStyle={Object {}}
offset={10}
reverseDirection={
Object {
"x": false,
"y": false,
}
}
separator=" : "
trigger="hover"
useTranslate3d={false}
viewBox={
Object {
"height": 0,
"width": 0,
"x": 0,
"y": 0,
}
}
wrapperStyle={Object {}}
/>
<Bar
activeBar={false}
animationBegin={0}
animationDuration={400}
animationEasing="ease"
data={Array []}
dataKey="results"
fill="rgb(30, 28, 138)"
hide={false}
isAnimationActive={true}
layout="vertical"
legendType="rect"
minPointSize={0}
stackId="unique"
xAxisId={0}
yAxisId={0}
>
<Cell
cursor="pointer"
fill="#1e1c8a"
key="cell-0"
/>
<Cell
cursor="pointer"
fill="#1e1c8a"
key="cell-1"
/>
<Cell
cursor="pointer"
fill="#1e1c8a"
key="cell-2"
/>
<Cell
cursor="pointer"
fill="#1e1c8a"
key="cell-3"
/>
</Bar>
</BarChart>
</ForwardRef>
</div>
`;
exports[`BarChart Markdown component when excludeZero should render without zero values 1`] = `
<div
className="BarChart custom-class"
>
<ForwardRef
height={320}
>
<BarChart
barCategoryGap="10%"
barGap={4}
data={
Array [
Object {
"id": "id2",
"label": "label2",
"results": 33,
},
Object {
"id": "id1",
"label": "label1",
"results": 25,
},
Object {
"id": "id3",
"label": "label3",
"results": 13,
},
]
}
height={300}
layout="horizontal"
margin={
Object {
"bottom": 5,
"left": 5,
"right": 5,
"top": 5,
}
}
reverseStackOrder={false}
stackOffset="none"
syncMethod="index"
>
<XAxis
allowDataOverflow={false}
allowDecimals={true}
allowDuplicatedCategory={true}
dataKey="label"
height={30}
hide={false}
label=""
mirror={false}
orientation="bottom"
padding={
Object {
"left": 0,
"right": 0,
}
}
reversed={false}
scale="auto"
tickCount={5}
type="category"
width={0}
xAxisId={0}
/>
<YAxis
allowDataOverflow={false}
allowDecimals={true}
allowDuplicatedCategory={true}
height={0}
hide={false}
mirror={false}
orientation="left"
padding={
Object {
"bottom": 0,
"top": 0,
}
}
reversed={false}
scale="auto"
tickCount={5}
type="number"
width={60}
yAxisId={0}
/>
<CartesianGrid
strokeDasharray="2 4"
/>
<Tooltip
accessibilityLayer={false}
allowEscapeViewBox={
Object {
"x": false,
"y": false,
}
}
animationDuration={400}
animationEasing="ease"
contentStyle={Object {}}
coordinate={
Object {
"x": 0,
"y": 0,
}
}
cursor={true}
cursorStyle={Object {}}
filterNull={true}
formatter={[Function]}
isAnimationActive={true}
itemStyle={Object {}}
labelStyle={Object {}}
offset={10}
reverseDirection={
Object {
"x": false,
"y": false,
}
}
separator=" : "
trigger="hover"
useTranslate3d={false}
viewBox={
Object {
"height": 0,
"width": 0,
"x": 0,
"y": 0,
}
}
wrapperStyle={Object {}}
/>
<Bar
activeBar={false}
animationBegin={0}
animationDuration={400}
animationEasing="ease"
data={Array []}
dataKey="results"
fill="rgb(30, 28, 138)"
hide={false}
isAnimationActive={true}
layout="vertical"
legendType="rect"
minPointSize={0}
stackId="unique"
xAxisId={0}
yAxisId={0}
>
<Cell
cursor="pointer"
fill="#1e1c8a"
key="cell-0"
/>
<Cell
cursor="pointer"
fill="#1e1c8a"
key="cell-1"
/>
<Cell
cursor="pointer"
fill="#1e1c8a"
key="cell-2"
/>
</Bar>
</BarChart>
</ForwardRef>
</div>
`;
exports[`BarChart Markdown component when layout is vertical should render axis properly 1`] = `
<YAxis
allowDataOverflow={false}
allowDecimals={true}
allowDuplicatedCategory={true}
dataKey="label"
height={0}
hide={false}
mirror={false}
orientation="left"
padding={
Object {
"bottom": 0,
"top": 0,
}
}
reversed={false}
scale="auto"
tickCount={5}
type="category"
width={200}
yAxisId={0}
/>
`;
exports[`BarChart Markdown component when layout is vertical should render axis properly 2`] = `
<XAxis
allowDataOverflow={false}
allowDecimals={true}
allowDuplicatedCategory={true}
dataKey="results"
height={30}
hide={false}
mirror={false}
orientation="bottom"
padding={
Object {
"left": 0,
"right": 0,
}
}
reversed={false}
scale="auto"
tickCount={5}
type="number"
width={0}
xAxisId={0}
/>
`;
exports[`BarChart Markdown component when passing maxCategories should only render the number of categories passed 1`] = `
<div
className="BarChart custom-class"
>
<ForwardRef
height={320}
>
<BarChart
barCategoryGap="10%"
barGap={4}
data={
Array [
Object {
"id": "id2",
"label": "label2",
"results": 33,
},
Object {
"id": "id1",
"label": "label1",
"results": 25,
},
]
}
height={300}
layout="horizontal"
margin={
Object {
"bottom": 5,
"left": 5,
"right": 5,
"top": 5,
}
}
reverseStackOrder={false}
stackOffset="none"
syncMethod="index"
>
<XAxis
allowDataOverflow={false}
allowDecimals={true}
allowDuplicatedCategory={true}
dataKey="label"
height={30}
hide={false}
label=""
mirror={false}
orientation="bottom"
padding={
Object {
"left": 0,
"right": 0,
}
}
reversed={false}
scale="auto"
tickCount={5}
type="category"
width={0}
xAxisId={0}
/>
<YAxis
allowDataOverflow={false}
allowDecimals={true}
allowDuplicatedCategory={true}
height={0}
hide={false}
mirror={false}
orientation="left"
padding={
Object {
"bottom": 0,
"top": 0,
}
}
reversed={false}
scale="auto"
tickCount={5}
type="number"
width={60}
yAxisId={0}
/>
<CartesianGrid
strokeDasharray="2 4"
/>
<Tooltip
accessibilityLayer={false}
allowEscapeViewBox={
Object {
"x": false,
"y": false,
}
}
animationDuration={400}
animationEasing="ease"
contentStyle={Object {}}
coordinate={
Object {
"x": 0,
"y": 0,
}
}
cursor={true}
cursorStyle={Object {}}
filterNull={true}
formatter={[Function]}
isAnimationActive={true}
itemStyle={Object {}}
labelStyle={Object {}}
offset={10}
reverseDirection={
Object {
"x": false,
"y": false,
}
}
separator=" : "
trigger="hover"
useTranslate3d={false}
viewBox={
Object {
"height": 0,
"width": 0,
"x": 0,
"y": 0,
}
}
wrapperStyle={Object {}}
/>
<Bar
activeBar={false}
animationBegin={0}
animationDuration={400}
animationEasing="ease"
data={Array []}
dataKey="results"
fill="rgb(30, 28, 138)"
hide={false}
isAnimationActive={true}
layout="vertical"
legendType="rect"
minPointSize={0}
stackId="unique"
xAxisId={0}
yAxisId={0}
>
<Cell
cursor="pointer"
fill="#1e1c8a"
key="cell-0"
/>
<Cell
cursor="pointer"
fill="#1e1c8a"
key="cell-1"
/>
</Bar>
</BarChart>
</ForwardRef>
</div>
`;
exports[`BarChart Markdown component when passing maxCategories should render others when passing aggregateOthers 1`] = `
<div
className="BarChart custom-class"
>
<ForwardRef
height={320}
>
<BarChart
barCategoryGap="10%"
barGap={4}
data={
Array [
Object {
"id": "id2",
"label": "label2",
"results": 33,
},
Object {
"id": "others",
"label": "others",
"others": true,
"results": 40,
},
]
}
height={300}
layout="horizontal"
margin={
Object {
"bottom": 5,
"left": 5,
"right": 5,
"top": 5,
}
}
reverseStackOrder={false}
stackOffset="none"
syncMethod="index"
>
<XAxis
allowDataOverflow={false}
allowDecimals={true}
allowDuplicatedCategory={true}
dataKey="label"
height={30}
hide={false}
label=""
mirror={false}
orientation="bottom"
padding={
Object {
"left": 0,
"right": 0,
}
}
reversed={false}
scale="auto"
tickCount={5}
type="category"
width={0}
xAxisId={0}
/>
<YAxis
allowDataOverflow={false}
allowDecimals={true}
allowDuplicatedCategory={true}
height={0}
hide={false}
mirror={false}
orientation="left"
padding={
Object {
"bottom": 0,
"top": 0,
}
}
reversed={false}
scale="auto"
tickCount={5}
type="number"
width={60}
yAxisId={0}
/>
<CartesianGrid
strokeDasharray="2 4"
/>
<Tooltip
accessibilityLayer={false}
allowEscapeViewBox={
Object {
"x": false,
"y": false,
}
}
animationDuration={400}
animationEasing="ease"
contentStyle={Object {}}
coordinate={
Object {
"x": 0,
"y": 0,
}
}
cursor={true}
cursorStyle={Object {}}
filterNull={true}
formatter={[Function]}
isAnimationActive={true}
itemStyle={Object {}}
labelStyle={Object {}}
offset={10}
reverseDirection={
Object {
"x": false,
"y": false,
}
}
separator=" : "
trigger="hover"
useTranslate3d={false}
viewBox={
Object {
"height": 0,
"width": 0,
"x": 0,
"y": 0,
}
}
wrapperStyle={Object {}}
/>
<Bar
activeBar={false}
animationBegin={0}
animationDuration={400}
animationEasing="ease"
data={Array []}
dataKey="results"
fill="rgb(30, 28, 138)"
hide={false}
isAnimationActive={true}
layout="vertical"
legendType="rect"
minPointSize={0}
stackId="unique"
xAxisId={0}
yAxisId={0}
>
<Cell
cursor="pointer"
fill="#1e1c8a"
key="cell-0"
/>
<Cell
cursor="pointer"
fill="#1e1c8a"
key="cell-1"
/>
</Bar>
</BarChart>
</ForwardRef>
</div>
`;
exports[`BarChart Markdown component when passing scatter parameter should display nested values with a composed label 1`] = `
<div
className="BarChart custom-class"
>
<ForwardRef
height={320}
>
<BarChart
barCategoryGap="10%"
barGap={4}
data={
Array [
Object {
"id": "zlel1nllvs",
"label": "A1",
"parent": "Nest A",
"results": 0,
},
Object {
"id": "7pu7fcxl8eg",
"label": "A2",
"parent": "Nest A",
"results": 1,
},
Object {
"id": "ipqlonrw89k",
"label": "A3",
"parent": "Nest A",
"results": 3,
},
Object {
"id": "jpw985bxwwg",
"label": "B1",
"parent": "Nest B",
"results": 1,
},
Object {
"id": "cbe3spt1k8o",
"label": "B2",
"parent": "Nest B",
"results": 0,
},
]
}
height={300}
layout="horizontal"
margin={
Object {
"bottom": 5,
"left": 5,
"right": 5,
"top": 5,
}
}
reverseStackOrder={false}
stackOffset="none"
syncMethod="index"
>
<XAxis
allowDataOverflow={false}
allowDecimals={true}
allowDuplicatedCategory={true}
dataKey="label"
height={30}
hide={false}
label=""
mirror={false}
orientation="bottom"
padding={
Object {
"left": 0,
"right": 0,
}
}
reversed={false}
scale="auto"
tickCount={5}
type="category"
width={0}
xAxisId={0}
/>
<YAxis
allowDataOverflow={false}
allowDecimals={true}
allowDuplicatedCategory={true}
height={0}
hide={false}
mirror={false}
orientation="left"
padding={
Object {
"bottom": 0,
"top": 0,
}
}
reversed={false}
scale="auto"
tickCount={5}
type="number"
width={60}
yAxisId={0}
/>
<CartesianGrid
strokeDasharray="2 4"
/>
<Tooltip
accessibilityLayer={false}
allowEscapeViewBox={
Object {
"x": false,
"y": false,
}
}
animationDuration={400}
animationEasing="ease"
contentStyle={Object {}}
coordinate={
Object {
"x": 0,
"y": 0,
}
}
cursor={true}
cursorStyle={Object {}}
filterNull={true}
formatter={[Function]}
isAnimationActive={true}
itemStyle={Object {}}
labelStyle={Object {}}
offset={10}
reverseDirection={
Object {
"x": false,
"y": false,
}
}
separator=" : "
trigger="hover"
useTranslate3d={false}
viewBox={
Object {
"height": 0,
"width": 0,
"x": 0,
"y": 0,
}
}
wrapperStyle={Object {}}
/>
<Bar
activeBar={false}
animationBegin={0}
animationDuration={400}
animationEasing="ease"
data={Array []}
dataKey="results"
fill="rgb(30, 28, 138)"
hide={false}
isAnimationActive={true}
layout="vertical"
legendType="rect"
minPointSize={0}
stackId="unique"
xAxisId={0}
yAxisId={0}
>
<Cell
cursor="pointer"
fill="#1e1c8a"
key="cell-0"
/>
<Cell
cursor="pointer"
fill="#1e1c8a"
key="cell-1"
/>
<Cell
cursor="pointer"
fill="#1e1c8a"
key="cell-2"
/>
<Cell
cursor="pointer"
fill="#1e1c8a"
key="cell-3"
/>
<Cell
cursor="pointer"
fill="#1e1c8a"
key="cell-4"
/>
</Bar>
</BarChart>
</ForwardRef>
</div>
`;