import { isArray } from "../utils/assertion.js";
import { cs } from "../utils/styles.js";
import { useStyleConfig } from "../core/theme.js";
import styled from "../core/styled.js";
import vui from "../core/vui.js";
import Box from "../box/box.js";
import Icon from "../icon/icon.js";
import P from "../p/p.js";
import { createElement } from "react";
import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";

//#region src/definition/definitionContent.tsx
const DefinitionItemKey = styled.dtBox``;
const DefinitionItemValue = styled.ddBox``;
const DefinitionContent = vui((props, ref) => {
	const { iconLeft, iconRight, isLabelBold, isValueBold, items, orientation } = props;
	const styles = useStyleConfig("Definition", props);
	return /* @__PURE__ */ jsx(Fragment$1, { children: isArray(items) ? items.map(({ key, value, ...props }, index) => /* @__PURE__ */ jsxs(Box, {
		className: "vui-definitionItemWrapper",
		ref,
		children: [/* @__PURE__ */ jsxs(DefinitionItemKey, {
			fontWeight: isLabelBold ? "demi" : "default",
			...styles.dt,
			children: [
				props.keyHasIcon && iconLeft && /* @__PURE__ */ jsx(Icon, {
					className: cs("vui-definitionIcon"),
					name: iconLeft,
					...styles.icon
				}),
				key,
				props.keyHasIcon && iconRight && /* @__PURE__ */ jsx(Icon, {
					className: cs("vui-definitionIcon"),
					name: iconRight,
					...styles.icon
				})
			]
		}), isArray(value) ? /* @__PURE__ */ createElement(DefinitionItemValue, {
			display: "block",
			fontWeight: isValueBold ? "demi" : "default",
			...styles.dd,
			key: index
		}, orientation === "horizontal" ? value.join(", ") : value.map((value, index) => /* @__PURE__ */ jsxs(P, {
			display: "flex",
			children: [
				props.valueHasIcon && iconLeft && /* @__PURE__ */ jsx(Icon, {
					className: cs("vui-definitionIcon"),
					name: iconLeft,
					...styles.icon
				}),
				value,
				props.valueHasIcon && iconRight && /* @__PURE__ */ jsx(Icon, {
					className: cs("vui-definitionIcon"),
					name: iconRight,
					...styles.icon
				})
			]
		}, index + value))) : /* @__PURE__ */ jsxs(DefinitionItemValue, {
			fontWeight: isValueBold ? "demi" : "default",
			...styles.dd,
			children: [
				props.valueHasIcon && iconLeft && /* @__PURE__ */ jsx(Icon, {
					className: cs("vui-definitionIcon"),
					name: iconLeft,
					...styles.icon
				}),
				value,
				props.valueHasIcon && iconRight && /* @__PURE__ */ jsx(Icon, {
					className: cs("vui-definitionIcon"),
					name: iconRight,
					...styles.icon
				})
			]
		})]
	}, index)) : items });
});
DefinitionContent.displayName = "DefinitionContent";

//#endregion
export { DefinitionContent as default };
globalThis.__vuiVersion__ = "4.0.0-beta.1"
//# sourceMappingURL=definitionContent.js.map