import type { LabeledRectangleDiagramProps } from "@/widgets/generators/labeled-rectangle-diagram"

export const labeledRectangleDiagramExamples: LabeledRectangleDiagramProps[] = [
	{
		type: "labeledRectangleDiagram",
		width: 300,
		height: 300,
		topLabel: "<mn>5</mn><mtext>\u00A0cm</mtext>",
		bottomLabel: "<mn>5</mn><mtext>\u00A0cm</mtext>",
		leftLabel: "<mi>x</mi><mtext>\u00A0cm</mtext>",
		rightLabel: "<mi>x</mi><mtext>\u00A0cm</mtext>",
		areaLabel:
			"<mn>20</mn><mtext>\u00A0cm</mtext><msup><mn></mn><mn>2</mn></msup>",
		fillColor: "#F8E8EE",
		borderColor: "#C06C84",
		textColor: "#333333"
	},
	{
		type: "labeledRectangleDiagram",
		width: 300,
		height: 300,
		topLabel: "<mn>4</mn><mtext>\u00A0cm</mtext>",
		bottomLabel: "<mn>4</mn><mtext>\u00A0cm</mtext>",
		leftLabel: "<mi>x</mi><mtext>\u00A0cm</mtext>",
		rightLabel: "<mi>x</mi><mtext>\u00A0cm</mtext>",
		areaLabel:
			"<mn>12</mn><mtext>\u00A0cm</mtext><msup><mn></mn><mn>2</mn></msup>",
		fillColor: "#FEF2E4",
		borderColor: "#D27D2D",
		textColor: "#333333"
	},
	{
		type: "labeledRectangleDiagram",
		width: 300,
		height: 300,
		topLabel: "<mn>5</mn><mtext>\u00A0cm</mtext>",
		bottomLabel: "<mn>5</mn><mtext>\u00A0cm</mtext>",
		leftLabel: "<mi>x</mi><mtext>\u00A0cm</mtext>",
		rightLabel: "<mi>x</mi><mtext>\u00A0cm</mtext>",
		areaLabel: null,
		fillColor: "#FEF2E4",
		borderColor: "#D27D2D",
		textColor: "#333333"
	}
]