import {
	Layer_1,
	Layer_10,
	Layer_11,
	Layer_12,
	Layer_2,
	Layer_3,
	Layer_4,
	Layer_5,
	Layer_6,
	Layer_7,
	Layer_8,
	Layer_9,
	ShapeArrowIcon,
	ShapeArrowSplitIcon,
	ShapeBookIcon,
	ShapeCloudsIcon,
	ShapeCurveAsymmetricalIcon,
	ShapeCurveIcon,
	ShapeDropsIcon,
	ShapeFanOpacity,
	ShapeMountainIcon,
	ShapePyramidsIcon,
	ShapeTiltIcon,
	ShapeTiltOpacityIcon,
	ShapeTriangleAsymmetricalIcon,
	ShapeTriangleIcon,
	ShapeWavesBrushIcon,
	ShapeWavesIcon,
	ShapeWavesPatternIcon,
	ShapeZigzagIcon,
} from "./presetLayerIcon";

export const presetLayerArray = [
	{
		layer: "layer-one",
		icon: <Layer_1 />,
		flexDirection: "row",
		columns: 1,
		flexWrap: "nowrap",
		label: "100",
		layout: "container-column-one-layout-one",
	},
	{
		layer: "layer-two",
		icon: <Layer_2 />,
		flexDirection: "row",
		columns: 2,
		flexWrap: "nowrap",
		label: "50/50",
		layout: "container-column-two-layout-one",
	},
	{
		layer: "layer-three",
		icon: <Layer_3 />,
		flexDirection: "row",
		columns: 3,
		flexWrap: "nowrap",
		label: "33/33/33",
		layout: "container-column-three-layout-one",
	},
	{
		layer: "layer-four",
		icon: <Layer_4 />,
		flexDirection: "row",
		columns: 4,
		flexWrap: "nowrap",
		label: "25/25/25/25",
		layout: "container-column-four-layout-one",
	},
	{
		layer: "layer-five",
		icon: <Layer_5 />,
		flexDirection: "row",
		columns: 5,
		flexWrap: "nowrap",
		label: "20x5",
		layout: "container-column-five-layout-one",
	},
	{
		// layer: 'layer-multi-row',
		layer: "layer-multi-row-six",
		icon: <Layer_6 />,
		flexDirection: "row",
		columns: "multi-row",
		flexWrap: "wrap",
		layout: "container-column-multi-row-layout-one",
		label: "33/33/33x2",
	},
	{
		layer: "layer-seven",
		icon: <Layer_7 />,
		flexDirection: "row",
		columns: 2,
		indexNo: 2,
		flexWrap: "nowrap",
		label: "60/40",
		layout: "container-column-two-layout-three",
	},
	{
		// layer: 'layer-multi-row',
		layer: "layer-multi-row-eight",
		icon: <Layer_8 />,
		flexDirection: "row",
		columns: "multi-row",
		indexNo: 4,
		flexWrap: "wrap",
		layout: "container-column-multi-row-layout-five",
		label: "50/50x100",
	},
	{
		layer: "layer-nine",
		icon: <Layer_9 />,
		flexDirection: "row",
		columns: 3,
		indexNo: 8,
		flexWrap: "nowrap",
		label: "50/25/25",
		layout: "container-column-three-layout-four",
	},
	{
		layer: "layer-ten",
		icon: <Layer_10 />,
		flexDirection: "row",
		columns: 4,
		indexNo: 2,
		flexWrap: "nowrap",
		label: "40/20/20/20",
		layout: "container-column-four-layout-three",
	},
	{
		// layer: 'layer-multi-row',
		layer: "layer-multi-row-eleven",
		icon: <Layer_11 />,
		flexDirection: "row",
		columns: "multi-row",
		indexNo: 1,
		flexWrap: "wrap",
		layout: "container-column-multi-row-layout-two",
		label: "50/50x2",
	},
	{
		// layer: 'layer-multi-row',
		layer: "layer-multi-row-twelve",
		icon: <Layer_12 />,
		flexDirection: "row",
		columns: "multi-row",
		indexNo: 2,
		flexWrap: "wrap",
		layout: "container-column-multi-row-layout-three",
		label: "70/30x2",
	},
];

export const layerColumnsWidth = {
	"layer-one": [100],
	"layer-two": [50, 50],
	"layer-three": [33, 33, 33],
	"layer-four": [25, 25, 25, 25],
	"layer-five": [20, 20, 20, 20, 20],
	"layer-multi-row-six": [33, 33, 33, 33, 33, 33],
	"layer-seven": [60, 40],
	"layer-multi-row-eight": [50, 50, 100],
	"layer-nine": [50, 25, 25],
	"layer-ten": [40, 20, 20, 20],
	"layer-multi-row-eleven": [50, 50, 50, 50],
	"layer-multi-row-twelve": [70, 30, 30, 70],
};

export const layoutsColumnsWidth = {
	"container-column-one-layout-one": [100],
	"container-column-two-layout-one": [50, 50],
	"container-column-two-layout-two": [40, 60],
	"container-column-two-layout-three": [60, 40],
	"container-column-two-layout-four": [30, 70],
	"container-column-two-layout-five": [70, 30],
	"container-column-three-layout-one": [33.33, 33.33, 33.33],
	"container-column-three-layout-two": [60, 20, 20],
	"container-column-three-layout-three": [20, 20, 60],
	"container-column-three-layout-four": [50, 25, 25],
	"container-column-three-layout-five": [25, 25, 50],
	"container-column-three-layout-six": [20, 60, 20],
	"container-column-four-layout-one": [25, 25, 25, 25],
	"container-column-four-layout-two": [20, 20, 20, 40],
	"container-column-four-layout-three": [40, 20, 20, 20],
	"container-column-five-layout-one": [20, 20, 20, 20],
	"container-column-six-layout-one": [16, 16, 16, 16, 16],
	"container-column-multi-row-layout-one": [33.33, 33.33, 33.33, 33.33, 33.33, 33.33],
	"container-column-multi-row-layout-two": [50, 50, 50, 50],
	"container-column-multi-row-layout-three": [67, 33, 33, 67],
	"container-column-multi-row-layout-four": [33, 67, 67, 33],
	"container-column-multi-row-layout-five": [50, 50, 100],
};

export const shapeDividerIconConstant = {
	mountains: <ShapeMountainIcon />,
	drops: <ShapeDropsIcon />,
	clouds: <ShapeCloudsIcon />,
	zigzag: <ShapeZigzagIcon />,
	pyramids: <ShapePyramidsIcon />,
	triangle: <ShapeTriangleIcon />,
	"triangle-asymmetrical": <ShapeTriangleAsymmetricalIcon />,
	tilt: <ShapeTiltIcon />,
	"tilt-opacity": <ShapeTiltOpacityIcon />,
	"fan-opacity": <ShapeFanOpacity />,
	curve: <ShapeCurveIcon />,
	"curve-asymmetrical": <ShapeCurveAsymmetricalIcon />,
	waves: <ShapeWavesIcon />,
	"waves-brush": <ShapeWavesBrushIcon />,
	"waves-pattern": <ShapeWavesPatternIcon />,
	arrow: <ShapeArrowIcon />,
	"arrow-split": <ShapeArrowSplitIcon />,
	book: <ShapeBookIcon />,
};

export const containerTemplatesConstant = {
	"layer-one": [["sp-smart-post-show/column"]],
	"layer-two": [["sp-smart-post-show/column"], ["sp-smart-post-show/column"]],
	"layer-three": [["sp-smart-post-show/column"], ["sp-smart-post-show/column"], ["sp-smart-post-show/column"]],
	"layer-four": [["sp-smart-post-show/column"], ["sp-smart-post-show/column"], ["sp-smart-post-show/column"], ["sp-smart-post-show/column"]],
	"layer-five": [["sp-smart-post-show/column"], ["sp-smart-post-show/column"], ["sp-smart-post-show/column"], ["sp-smart-post-show/column"], ["sp-smart-post-show/column"]],
	"layer-multi-row-six": [["sp-smart-post-show/column"], ["sp-smart-post-show/column"], ["sp-smart-post-show/column"], ["sp-smart-post-show/column"], ["sp-smart-post-show/column"], ["sp-smart-post-show/column"]],
	"layer-seven": [["sp-smart-post-show/column"], ["sp-smart-post-show/column"]],
	"layer-multi-row-eight": [["sp-smart-post-show/column"], ["sp-smart-post-show/column"], ["sp-smart-post-show/column"]],
	"layer-nine": [["sp-smart-post-show/column"], ["sp-smart-post-show/column"], ["sp-smart-post-show/column"]],
	"layer-ten": [["sp-smart-post-show/column"], ["sp-smart-post-show/column"], ["sp-smart-post-show/column"], ["sp-smart-post-show/column"]],
	"layer-multi-row-eleven": [["sp-smart-post-show/column"], ["sp-smart-post-show/column"], ["sp-smart-post-show/column"], ["sp-smart-post-show/column"]],
	"layer-multi-row-twelve": [["sp-smart-post-show/column"], ["sp-smart-post-show/column"], ["sp-smart-post-show/column"], ["sp-smart-post-show/column"]],
};