/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-a795c5b | Cube Dev Team */
import { Space } from "../../layout/Space.js";
import { Grid } from "../../layout/Grid.js";
import { Flow } from "../../layout/Flow.js";
import { Placeholder } from "../Placeholder/Placeholder.js";
import { jsx, jsxs } from "react/jsx-runtime";

//#region src/components/content/Skeleton/Skeleton.tsx
const LAYOUT_MAP = {
	page({ lines, children, isStatic = false, rootProps }) {
		return /* @__PURE__ */ jsxs(Flow, {
			gap: "4x",
			...rootProps,
			children: [/* @__PURE__ */ jsxs(Space, {
				placeContent: "space-between",
				children: [/* @__PURE__ */ jsx(Placeholder, {
					isStatic,
					width: "100px 25% 300px"
				}), /* @__PURE__ */ jsx(Placeholder, {
					isStatic,
					width: "50px 10% 150px"
				})]
			}), /* @__PURE__ */ jsx(Flow, {
				gap: "2x",
				children: children || Array(lines || 5).fill(0).map((item, i) => /* @__PURE__ */ jsx(Placeholder, { isStatic }, i))
			})]
		});
	},
	content({ children, lines, isStatic = false, rootProps }) {
		return /* @__PURE__ */ jsx(Flow, {
			gap: "2x",
			...rootProps,
			children: children || Array(lines || 5).fill(0).map((item, i) => /* @__PURE__ */ jsx(Placeholder, { isStatic }, i))
		});
	},
	topbar({ isStatic = false, rootProps }) {
		return /* @__PURE__ */ jsxs(Space, {
			gap: "4x",
			placeContent: "space-between",
			height: "6x",
			padding: "1x",
			border: "bottom",
			...rootProps,
			children: [/* @__PURE__ */ jsxs(Space, { children: [/* @__PURE__ */ jsx(Placeholder, {
				circle: true,
				isStatic,
				size: "4x"
			}), /* @__PURE__ */ jsx(Placeholder, {
				isStatic,
				width: "20x"
			})] }), /* @__PURE__ */ jsxs(Space, { children: [/* @__PURE__ */ jsx(Placeholder, {
				isStatic,
				width: "10x"
			}), /* @__PURE__ */ jsx(Placeholder, {
				circle: true,
				isStatic,
				size: "4x"
			})] })]
		});
	},
	menu({ lines, isStatic = false, rootProps }) {
		return /* @__PURE__ */ jsx(Flow, {
			gap: "3.25x",
			padding: "3x 1x",
			...rootProps,
			children: Array(lines || 5).fill(0).map((item, i) => /* @__PURE__ */ jsx(Placeholder, { isStatic }, i))
		});
	},
	stats({ cards, isStatic = false, rootProps }) {
		return /* @__PURE__ */ jsx(Space, {
			gap: "4x",
			...rootProps,
			children: Array(cards || 3).fill(0).map((item, i) => /* @__PURE__ */ jsx(Placeholder, {
				isStatic,
				radius: "1r",
				width: "20x",
				height: "12x",
				flexGrow: 1
			}, i))
		});
	},
	tabs({ tabs, children, lines, isStatic = false, rootProps }) {
		return /* @__PURE__ */ jsxs(Flow, {
			gap: "4x",
			...rootProps,
			children: [/* @__PURE__ */ jsx(Space, { children: Array(tabs || 3).fill(0).map((item, i) => /* @__PURE__ */ jsx(Placeholder, {
				isStatic,
				width: "15x"
			}, i)) }), /* @__PURE__ */ jsx(Flow, {
				gap: "2x",
				children: children || Array(lines || 5).fill(0).map((item, i) => /* @__PURE__ */ jsx(Placeholder, { isStatic }, i))
			})]
		});
	},
	table({ rows, columns, isStatic = false, rootProps }) {
		columns = columns || 5;
		rows = rows || 5;
		return /* @__PURE__ */ jsx(Grid, {
			columns: `repeat(${columns}, 1fr)`,
			gap: "3x",
			padding: "1x 0",
			...rootProps,
			children: Array(rows).fill(0).map((item, i) => {
				return Array(columns).fill(0).map((item, j) => {
					return /* @__PURE__ */ jsx(Placeholder, {
						isStatic,
						size: !i ? "3x" : "2x"
					}, `${i}.${j}`);
				});
			})
		});
	},
	chart({ columns, isStatic = false, rootProps }) {
		columns = columns || 12;
		const heightMap = [
			1,
			4,
			2,
			5,
			8,
			9,
			5,
			3,
			4,
			2,
			6,
			7,
			2
		];
		return /* @__PURE__ */ jsx(Grid, {
			columns: `repeat(${columns}, 1fr)`,
			gap: "3x",
			padding: "1x 0",
			placeItems: "end stretch",
			height: "40x",
			...rootProps,
			children: Array(columns).fill(0).map((item, i) => {
				return /* @__PURE__ */ jsx(Placeholder, {
					isStatic,
					height: `${heightMap[i % 12] * 10}%`,
					width: "max 6x"
				}, i);
			})
		});
	}
};
function Skeleton({ layout, isStatic, columns, rows, lines, tabs, cards, ...props }) {
	layout = layout || "page";
	return LAYOUT_MAP[layout] ? LAYOUT_MAP[layout]({
		isStatic,
		columns,
		rows,
		lines,
		tabs,
		cards,
		rootProps: {
			qa: "Skeleton",
			...props
		}
	}) : /* @__PURE__ */ jsx(Placeholder, {
		qa: "Skeleton",
		isStatic,
		...props
	});
}

//#endregion
export { Skeleton };
//# sourceMappingURL=Skeleton.js.map