const require_chunk = require("./chunk-9hOWP6kD.cjs");
const require_registries = require("./registries-CpUM406S.cjs");
let react_jsx_runtime = require("react/jsx-runtime");
let lucide_react = require("lucide-react");
//#region ../widgets/src/widgets/SeparatorWidget.tsx
var SeparatorWidget_exports = /* @__PURE__ */ require_chunk.__exportAll({
	SeparatorWidget: () => SeparatorWidget,
	separatorWidgetPropertySchema: () => separatorWidgetPropertySchema
});
function SeparatorWidget({ orientation = "horizontal", color = "muted", thickness = "1px", width = "100%", marginTop = 4, marginBottom = 4, className, style, ...props }) {
	const isHorizontal = orientation === "horizontal";
	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
		className: `flex ${isHorizontal ? "flex-row justify-center" : "h-full flex-col items-center"} ${className ?? ""}`,
		style: {
			...isHorizontal ? {
				marginTop: `${marginTop * 4}px`,
				marginBottom: `${marginBottom * 4}px`
			} : {
				paddingTop: `${marginTop * 4}px`,
				paddingBottom: `${marginBottom * 4}px`
			},
			...style
		},
		"aria-hidden": "true",
		...props,
		children: isHorizontal ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
			className: `bg-${color}`,
			style: {
				width,
				height: thickness
			}
		}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
			className: `bg-${color}`,
			style: {
				width: thickness,
				height: "100%"
			}
		})
	});
}
const separatorWidgetPropertySchema = {
	widgetType: "SeparatorWidget",
	displayName: "Separator",
	fields: [
		{
			key: "orientation",
			label: "Orientation",
			type: "select",
			description: "Direction of the separator line",
			defaultValue: "horizontal",
			options: [{
				label: "Horizontal",
				value: "horizontal"
			}, {
				label: "Vertical",
				value: "vertical"
			}],
			group: "Separator"
		},
		require_registries.getColorField({
			key: "color",
			label: "Color",
			description: "Color of the separator line",
			defaultValue: "muted",
			group: "Separator"
		}),
		{
			key: "thickness",
			label: "Thickness",
			type: "cssUnit",
			description: "Thickness of the separator line",
			defaultValue: "1px",
			allowedUnits: ["px"],
			minByUnit: { px: 1 },
			maxByUnit: { px: 20 },
			stepByUnit: { px: 1 },
			group: "Separator"
		},
		{
			key: "width",
			label: "Width",
			type: "cssUnit",
			description: "Width of the separator",
			defaultValue: "100%",
			allowedUnits: ["%"],
			defaultUnit: "%",
			minByUnit: { "%": 1 },
			maxByUnit: { "%": 100 },
			stepByUnit: { "%": 1 },
			group: "Separator",
			requiresKeyValue: {
				key: "orientation",
				value: "horizontal"
			}
		},
		{
			key: "marginTop",
			label: "Margin Top",
			type: "buttonGroup",
			description: "Space above the separator",
			defaultValue: 4,
			options: [
				{
					icon: lucide_react.Ban,
					ariaLabel: "No top margin",
					value: 0
				},
				{
					label: "SM",
					value: 2
				},
				{
					label: "MD",
					value: 4
				},
				{
					label: "LG",
					value: 6
				},
				{
					label: "XL",
					value: 8
				},
				{
					label: "FULL",
					value: 10
				}
			],
			group: "Spacing"
		},
		{
			key: "marginBottom",
			label: "Margin Bottom",
			type: "buttonGroup",
			description: "Space below the separator",
			defaultValue: 4,
			options: [
				{
					icon: lucide_react.Ban,
					ariaLabel: "No bottom margin",
					value: 0
				},
				{
					label: "SM",
					value: 2
				},
				{
					label: "MD",
					value: 4
				},
				{
					label: "LG",
					value: 6
				},
				{
					label: "XL",
					value: 8
				},
				{
					label: "FULL",
					value: 10
				}
			],
			group: "Spacing"
		}
	]
};
//#endregion
Object.defineProperty(exports, "SeparatorWidget", {
	enumerable: true,
	get: function() {
		return SeparatorWidget;
	}
});
Object.defineProperty(exports, "SeparatorWidget_exports", {
	enumerable: true,
	get: function() {
		return SeparatorWidget_exports;
	}
});
Object.defineProperty(exports, "separatorWidgetPropertySchema", {
	enumerable: true,
	get: function() {
		return separatorWidgetPropertySchema;
	}
});

//# sourceMappingURL=SeparatorWidget-CjVHbHzQ.cjs.map