@lumeweb/portal-framework-ui 0.0.1 → 0.1.0

package/dist/esm/components/dialog/Dialog.renderer.spec.js

@@ -0,0 +1,676 @@
+import { ActionItemType } from "../actions/types.js";
+import { DialogTypes, init_Dialog_types } from "./Dialog.types.js";
+import { DialogProvider, init_Dialog_context, useDialog } from "./Dialog.context.js";
+import { DialogRenderer, init_Dialog_renderer } from "./Dialog.renderer.js";
+import { init_actions } from "../actions/index.js";
+import React from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { act, cleanup, fireEvent, render, screen, waitFor, waitForElementToBeRemoved } from "@testing-library/react";
+import { afterEach, describe, expect, it, vi } from "/home/runner/work/web/web/node_modules/.pnpm/vitest@4.0.16_@types+node@25.0.6_@vitest+browser-playwright@4.0.16_happy-dom@20.1.0_jit_f9bfc6b661e56e62de1f809a028e46f4/node_modules/vitest/dist/index.js";
+
+//#region src/components/dialog/Dialog.renderer.spec.tsx
+init_actions();
+init_Dialog_context();
+init_Dialog_renderer();
+init_Dialog_types();
+const openNotificationSpy = vi.fn();
+vi.mock("@lumeweb/portal-framework-ui-core", async (importOriginal) => {
+	return {
+		...await importOriginal(),
+		Button: ({ children, disabled, onClick, variant, ...props }) => {
+			return /* @__PURE__ */ jsx("button", {
+				"data-testid": "mock-button",
+				"data-variant": variant,
+				disabled,
+				onClick,
+				...props,
+				children
+			});
+		},
+		cn: (...args) => {
+			const classes = [];
+			args.forEach((arg) => {
+				if (typeof arg === "string") classes.push(arg);
+				else if (typeof arg === "object" && arg !== null) Object.keys(arg).forEach((key) => {
+					if (arg[key]) classes.push(key);
+				});
+			});
+			return classes.filter(Boolean).join(" ");
+		},
+		Dialog: ({ children, onOpenChange, open, ...props }) => {
+			React.useEffect(() => {}, [open]);
+			const childrenWithOpenProp = React.Children.map(children, (child) => {
+				if (React.isValidElement(child)) return React.cloneElement(child, { open });
+				return child;
+			});
+			return /* @__PURE__ */ jsxs("div", {
+				"data-open": open,
+				"data-testid": "mock-dialog",
+				...props,
+				children: [
+					open && childrenWithOpenProp,
+					" // Render childrenWithOpenProp here",
+					open && onOpenChange && /* @__PURE__ */ jsx("button", {
+						"data-testid": "mock-outside-click-trigger",
+						onClick: () => {
+							onOpenChange(false);
+						},
+						style: {
+							height: "10px",
+							left: 0,
+							opacity: 0,
+							position: "fixed",
+							top: 0,
+							width: "10px",
+							zIndex: 9999
+						}
+					})
+				]
+			});
+		},
+		DialogContent: ({ children, className, onInteractOutside, open, ...props }) => {
+			React.useEffect(() => {}, [open]);
+			const childrenWithOpenProp = React.Children.map(children, (child) => {
+				if (React.isValidElement(child)) return React.cloneElement(child, { open });
+				return child;
+			});
+			if (!open) return null;
+			return /* @__PURE__ */ jsxs("div", {
+				className,
+				"data-testid": "mock-dialog-content",
+				...props,
+				children: [
+					childrenWithOpenProp,
+					" ",
+					onInteractOutside && /* @__PURE__ */ jsx("button", {
+						"data-testid": "mock-on-interact-outside-trigger",
+						onClick: (e) => {
+							onInteractOutside(e);
+						},
+						style: {
+							height: "10px",
+							opacity: 0,
+							position: "absolute",
+							right: 0,
+							top: 0,
+							width: "10px",
+							zIndex: 9999
+						}
+					})
+				]
+			});
+		},
+		DialogDescription: ({ children, ...props }) => {
+			return /* @__PURE__ */ jsx("p", {
+				"data-testid": "mock-dialog-description",
+				...props,
+				children
+			});
+		},
+		DialogFooter: ({ children, className, ...props }) => {
+			return /* @__PURE__ */ jsx("div", {
+				className,
+				"data-testid": "mock-dialog-footer",
+				...props,
+				children
+			});
+		},
+		DialogHeader: ({ children, className, ...props }) => {
+			return /* @__PURE__ */ jsx("div", {
+				className,
+				"data-testid": "mock-dialog-header",
+				...props,
+				children
+			});
+		},
+		DialogTitle: ({ children, className, ...props }) => {
+			return /* @__PURE__ */ jsx("h2", {
+				className,
+				"data-testid": "mock-dialog-title",
+				...props,
+				children
+			});
+		},
+		DropdownMenu: ({ children, ...props }) => {
+			const { currentDialog } = useDialog();
+			const open = !!currentDialog;
+			const childrenWithOpenProp = React.Children.map(children, (child) => {
+				if (React.isValidElement(child)) return React.cloneElement(child, { open });
+				return child;
+			});
+			return /* @__PURE__ */ jsx("div", {
+				"data-open": open,
+				"data-testid": "mock-dropdown-menu",
+				...props,
+				children: childrenWithOpenProp
+			});
+		},
+		DropdownMenuContent: ({ children, className, open, ...props }) => {
+			if (!open) return null;
+			return /* @__PURE__ */ jsx("div", {
+				className,
+				"data-testid": "mock-dropdown-content",
+				...props,
+				children
+			});
+		},
+		DropdownMenuItem: ({ children, closeDialog, onSelect, ...props }) => /* @__PURE__ */ jsx("button", {
+			"data-testid": "mock-dropdown-item",
+			onClick: () => {
+				onSelect?.();
+			},
+			...props,
+			children
+		}),
+		DropdownMenuTrigger: ({ asChild, children, ...props }) => {
+			if (asChild) {
+				const child = React.Children.only(children);
+				return React.cloneElement(child, {
+					...props,
+					...child.props,
+					"data-testid": "mock-dropdown-trigger"
+				});
+			}
+			return /* @__PURE__ */ jsx("button", {
+				"data-testid": "mock-dropdown-trigger",
+				...props,
+				children
+			});
+		},
+		Spinner: ({ ...props }) => {
+			return /* @__PURE__ */ jsx("span", {
+				"data-testid": "mock-spinner",
+				...props,
+				children: "Loading..."
+			});
+		}
+	};
+});
+vi.mock("@refinedev/core", async (importOriginal) => {
+	return {
+		...await importOriginal(),
+		useNotification: vi.fn(() => ({ open: openNotificationSpy }))
+	};
+});
+vi.mock("../form/SchemaForm", () => ({ SchemaForm: ({ config, dialogTitle }) => {
+	const mockMethods = { formState: { isSubmitting: false } };
+	return /* @__PURE__ */ jsxs("div", {
+		"data-testid": "mock-schema-form",
+		children: [
+			"SchemaForm for ",
+			dialogTitle,
+			config.footer && /* @__PURE__ */ jsx("div", {
+				"data-testid": "mock-form-footer",
+				children: typeof config.footer === "function" ? config.footer(mockMethods) : config.footer
+			})
+		]
+	});
+} }));
+vi.mock("../form/StepSchemaForm", () => ({ StepSchemaForm: ({ config, dialogTitle }) => /* @__PURE__ */ jsxs("div", {
+	"data-testid": "mock-step-schema-form",
+	children: ["StepSchemaForm for ", dialogTitle]
+}) }));
+vi.mock("../form/types", () => ({ isStepFormConfig: vi.fn((config) => !!config.steps) }));
+vi.mock("../actions", () => ({
+	ActionItemType: {
+		BUTTON: "button",
+		CANCEL: "cancel",
+		CUSTOM: "custom",
+		DATE: "date",
+		FILE: "file",
+		LINK: "link",
+		SUBMIT: "submit"
+	},
+	ActionListRenderer: ({ actions, closeDialog, isSubmitting, layout, ...props }) => {
+		return /* @__PURE__ */ jsx("div", {
+			"data-layout": layout,
+			"data-testid": "mock-action-list",
+			...props,
+			children: actions.map((action, index) => /* @__PURE__ */ jsx("button", {
+				"data-testid": action.type === "button" ? "mock-action-button" : `mock-action-${action.type}`,
+				disabled: isSubmitting && action.type === "submit",
+				onClick: () => {
+					if (action.type === "cancel") closeDialog("user");
+					if (action.type === "submit" && !isSubmitting) {}
+					if (action.onClick) action.onClick();
+				},
+				children: action.label || action.type
+			}, index))
+		});
+	}
+}));
+const DialogTrigger = ({ config }) => {
+	const { openDialog } = useDialog();
+	return /* @__PURE__ */ jsx("button", {
+		onClick: () => openDialog(config),
+		children: "Open Dialog"
+	});
+};
+describe("DialogRenderer", () => {
+	afterEach(() => {
+		cleanup();
+		vi.clearAllMocks();
+	});
+	it("should not render anything when no dialog is open", () => {
+		render(/* @__PURE__ */ jsx(DialogProvider, { children: /* @__PURE__ */ jsx(DialogRenderer, {}) }));
+		expect(screen.queryByTestId("mock-dialog")).not.toBeInTheDocument();
+	});
+	it("should render a dialog when currentDialog is set", async () => {
+		render(/* @__PURE__ */ jsxs(DialogProvider, { children: [/* @__PURE__ */ jsx(DialogTrigger, { config: {
+			title: "Test Dialog",
+			type: DialogTypes.ALERT
+		} }), /* @__PURE__ */ jsx(DialogRenderer, {})] }));
+		const openButton = screen.getByText("Open Dialog");
+		fireEvent.click(openButton);
+		await waitFor(() => {
+			expect(screen.getByTestId("mock-dialog")).toBeInTheDocument();
+			expect(screen.getByTestId("mock-dialog-title")).toHaveTextContent("Test Dialog");
+		});
+	});
+	it("should render title and description", async () => {
+		render(/* @__PURE__ */ jsxs(DialogProvider, { children: [/* @__PURE__ */ jsx(DialogTrigger, { config: {
+			description: "Test Description",
+			title: "Test Title",
+			type: DialogTypes.ALERT
+		} }), /* @__PURE__ */ jsx(DialogRenderer, {})] }));
+		fireEvent.click(screen.getByText("Open Dialog"));
+		await waitFor(() => {
+			expect(screen.getByTestId("mock-dialog-title")).toHaveTextContent("Test Title");
+			expect(screen.getByTestId("mock-dialog-description")).toHaveTextContent("Test Description");
+		});
+	});
+	it("should render custom content for 'custom' type", async () => {
+		const CustomContent = () => /* @__PURE__ */ jsx("div", {
+			"data-testid": "custom-content",
+			children: "This is custom content"
+		});
+		render(/* @__PURE__ */ jsxs(DialogProvider, { children: [/* @__PURE__ */ jsx(DialogTrigger, { config: {
+			content: /* @__PURE__ */ jsx(CustomContent, {}),
+			title: "Custom Dialog",
+			type: DialogTypes.CUSTOM
+		} }), /* @__PURE__ */ jsx(DialogRenderer, {})] }));
+		fireEvent.click(screen.getByText("Open Dialog"));
+		await waitFor(() => {
+			expect(screen.getByTestId("mock-dialog-title")).toHaveTextContent("Custom Dialog");
+			expect(screen.getByTestId("custom-content")).toBeInTheDocument();
+			expect(screen.queryByTestId("mock-dialog-description")).not.toBeInTheDocument();
+		});
+	});
+	it("should render default buttons for 'confirm' type", async () => {
+		const onConfirmMock = vi.fn();
+		const onCancelMock = vi.fn();
+		render(/* @__PURE__ */ jsxs(DialogProvider, { children: [/* @__PURE__ */ jsx(DialogTrigger, { config: {
+			cancelText: "No",
+			confirmText: "Yes",
+			onCancel: onCancelMock,
+			onConfirm: onConfirmMock,
+			title: "Confirm Action",
+			type: DialogTypes.CONFIRM
+		} }), /* @__PURE__ */ jsx(DialogRenderer, {})] }));
+		fireEvent.click(screen.getByText("Open Dialog"));
+		await waitFor(() => {
+			const buttons = screen.getAllByTestId("mock-button");
+			expect(buttons).toHaveLength(2);
+			expect(buttons[0]).toHaveTextContent("No");
+			expect(buttons[1]).toHaveTextContent("Yes");
+		});
+		fireEvent.click(screen.getByText("Yes"));
+		await waitFor(() => {
+			expect(onConfirmMock).toHaveBeenCalledTimes(1);
+		});
+		fireEvent.click(screen.getByText("Open Dialog"));
+		await waitFor(() => screen.getByText("No"));
+		fireEvent.click(screen.getByText("No"));
+		await waitFor(() => {
+			expect(onCancelMock).toHaveBeenCalledTimes(1);
+			expect(onCancelMock).toHaveBeenCalledWith("user");
+		});
+	});
+	it("should render ActionListRenderer for actionButtons", async () => {
+		const action1Mock = vi.fn();
+		const action2Mock = vi.fn();
+		render(/* @__PURE__ */ jsxs(DialogProvider, { children: [/* @__PURE__ */ jsx(DialogTrigger, { config: {
+			actionButtons: [{
+				label: "Action 1",
+				onClick: action1Mock,
+				type: ActionItemType.BUTTON
+			}, {
+				label: "Action 2",
+				onClick: action2Mock,
+				type: ActionItemType.BUTTON
+			}],
+			actionButtonsLayout: "vertical",
+			title: "Action Dialog",
+			type: DialogTypes.ALERT
+		} }), /* @__PURE__ */ jsx(DialogRenderer, {})] }));
+		fireEvent.click(screen.getByText("Open Dialog"));
+		await waitFor(() => {
+			expect(screen.getByTestId("mock-action-list")).toBeInTheDocument();
+			expect(screen.getByTestId("mock-action-list")).toHaveAttribute("data-layout", "vertical");
+			const actionButtons = screen.getAllByTestId("mock-action-button");
+			expect(actionButtons).toHaveLength(2);
+			expect(actionButtons[0]).toHaveTextContent("Action 1");
+			expect(actionButtons[1]).toHaveTextContent("Action 2");
+		});
+	});
+	it("should render SchemaForm for 'form' type (non-step)", async () => {
+		vi.mock("../form/types");
+		const { isStepFormConfig } = await import("../form/types.js");
+		isStepFormConfig.mockReturnValue(false);
+		const onSubmitMock = vi.fn();
+		const onSuccessMock = vi.fn();
+		render(/* @__PURE__ */ jsxs(DialogProvider, { children: [/* @__PURE__ */ jsx(DialogTrigger, { config: {
+			formConfig: {
+				fields: [],
+				onSubmit: onSubmitMock,
+				onSuccess: onSuccessMock
+			},
+			onSubmit: onSubmitMock,
+			onSuccess: onSuccessMock,
+			title: "Form Dialog",
+			type: DialogTypes.FORM
+		} }), /* @__PURE__ */ jsx(DialogRenderer, {})] }));
+		fireEvent.click(screen.getByText("Open Dialog"));
+		await waitFor(() => {
+			expect(screen.getByTestId("mock-schema-form")).toBeInTheDocument();
+			expect(screen.getByTestId("mock-schema-form")).toHaveTextContent("SchemaForm for Form Dialog");
+			expect(screen.getByTestId("mock-form-footer")).toBeInTheDocument();
+			expect(screen.getByTestId("mock-action-cancel")).toBeInTheDocument();
+			expect(screen.getByTestId("mock-action-submit")).toBeInTheDocument();
+		});
+	});
+	it("should render StepSchemaForm for 'form' type (step)", async () => {
+		vi.mock("../form/types");
+		const { isStepFormConfig } = await import("../form/types.js");
+		isStepFormConfig.mockReturnValue(true);
+		const onSubmitMock = vi.fn();
+		const onSuccessMock = vi.fn();
+		render(/* @__PURE__ */ jsxs(DialogProvider, { children: [/* @__PURE__ */ jsx(DialogTrigger, { config: {
+			formConfig: {
+				onSubmit: onSubmitMock,
+				onSuccess: onSuccessMock,
+				steps: []
+			},
+			onSubmit: onSubmitMock,
+			onSuccess: onSuccessMock,
+			title: "Step Form Dialog",
+			type: DialogTypes.FORM
+		} }), /* @__PURE__ */ jsx(DialogRenderer, {})] }));
+		fireEvent.click(screen.getByText("Open Dialog"));
+		await waitFor(() => {
+			expect(screen.getByTestId("mock-step-schema-form")).toBeInTheDocument();
+			expect(screen.getByTestId("mock-step-schema-form")).toHaveTextContent("StepSchemaForm for Step Form Dialog");
+			expect(screen.queryByTestId("mock-schema-form")).not.toBeInTheDocument();
+		});
+	});
+	it("should call onConfirm and close for alert/confirm types if dismissable", async () => {
+		const onConfirmMock = vi.fn();
+		render(/* @__PURE__ */ jsxs(DialogProvider, { children: [/* @__PURE__ */ jsx(DialogTrigger, { config: {
+			dismissable: true,
+			onConfirm: onConfirmMock,
+			title: "Dismissable Alert",
+			type: DialogTypes.ALERT
+		} }), /* @__PURE__ */ jsx(DialogRenderer, {})] }));
+		fireEvent.click(screen.getByText("Open Dialog"));
+		await waitFor(() => screen.getByText("Continue"));
+		fireEvent.click(screen.getByText("Continue"));
+		await waitForElementToBeRemoved(() => screen.queryByTestId("mock-dialog"));
+		expect(onConfirmMock).toHaveBeenCalledTimes(1);
+	});
+	it("should call onConfirm but not close for alert/confirm types if not dismissable", async () => {
+		const onConfirmMock = vi.fn();
+		render(/* @__PURE__ */ jsxs(DialogProvider, { children: [/* @__PURE__ */ jsx(DialogTrigger, { config: {
+			dismissable: false,
+			onConfirm: onConfirmMock,
+			title: "Non-Dismissable Alert",
+			type: DialogTypes.ALERT
+		} }), /* @__PURE__ */ jsx(DialogRenderer, {})] }));
+		fireEvent.click(screen.getByText("Open Dialog"));
+		await waitFor(() => screen.getByText("Continue"));
+		fireEvent.click(screen.getByText("Continue"));
+		await waitFor(() => {
+			expect(onConfirmMock).toHaveBeenCalledTimes(1);
+			expect(screen.getByTestId("mock-dialog")).toBeInTheDocument();
+		});
+	});
+	it("should prevent close on outside click if preventCloseOnOutsideClick is true", async () => {
+		const onCancelMock = vi.fn();
+		const { useNotification } = await import("@refinedev/core");
+		const { open: openNotificationMock } = useNotification();
+		render(/* @__PURE__ */ jsxs(DialogProvider, { children: [/* @__PURE__ */ jsx(DialogTrigger, { config: {
+			onCancel: onCancelMock,
+			preventCloseOnOutsideClick: true,
+			title: "Prevent Close",
+			type: DialogTypes.ALERT
+		} }), /* @__PURE__ */ jsx(DialogRenderer, {})] }));
+		fireEvent.click(screen.getByText("Open Dialog"));
+		await waitFor(() => screen.getByTestId("mock-outside-click-trigger"));
+		fireEvent.click(screen.getByTestId("mock-on-interact-outside-trigger"));
+		await new Promise((resolve) => setTimeout(resolve, 50));
+		expect(screen.getByTestId("mock-dialog")).toBeInTheDocument();
+		expect(onCancelMock).not.toHaveBeenCalled();
+		expect(openNotificationMock).not.toHaveBeenCalled();
+	});
+	it("should prevent close on outside click and show notification if preventCloseOnOutsideClick is 'dirty'", async () => {
+		const onCancelMock = vi.fn();
+		const { useNotification } = await import("@refinedev/core");
+		const { open: openNotificationMock } = useNotification();
+		render(/* @__PURE__ */ jsxs(DialogProvider, { children: [/* @__PURE__ */ jsx(DialogTrigger, { config: {
+			onCancel: onCancelMock,
+			preventCloseOnOutsideClick: "dirty",
+			title: "Prevent Close Dirty",
+			type: DialogTypes.ALERT
+		} }), /* @__PURE__ */ jsx(DialogRenderer, {})] }));
+		fireEvent.click(screen.getByText("Open Dialog"));
+		await waitFor(() => screen.getByTestId("mock-on-interact-outside-trigger"));
+		fireEvent.click(screen.getByTestId("mock-on-interact-outside-trigger"));
+		await waitFor(() => {
+			expect(openNotificationMock).toHaveBeenCalledTimes(1);
+		});
+		expect(screen.getByTestId("mock-dialog")).toBeInTheDocument();
+		expect(onCancelMock).not.toHaveBeenCalled();
+		expect(openNotificationMock).toHaveBeenCalledWith({
+			description: "You have unsaved changes. Are you sure you want to leave?",
+			message: "Unsaved Changes",
+			type: "error"
+		});
+	});
+	it("should render status icons", async () => {
+		render(/* @__PURE__ */ jsxs(DialogProvider, { children: [/* @__PURE__ */ jsx(DialogTrigger, { config: {
+			status: "success",
+			title: "Success Alert",
+			type: DialogTypes.ALERT
+		} }), /* @__PURE__ */ jsx(DialogRenderer, {})] }));
+		fireEvent.click(screen.getByText("Open Dialog"));
+		await waitFor(() => screen.getByLabelText("Success"));
+		expect(screen.getByLabelText("Success")).toBeInTheDocument();
+		cleanup();
+		render(/* @__PURE__ */ jsxs(DialogProvider, { children: [/* @__PURE__ */ jsx(DialogTrigger, { config: {
+			status: "error",
+			title: "Error Alert",
+			type: DialogTypes.ALERT
+		} }), /* @__PURE__ */ jsx(DialogRenderer, {})] }));
+		fireEvent.click(screen.getByText("Open Dialog"));
+		await waitFor(() => screen.getByLabelText("Error"));
+		expect(screen.getByLabelText("Error")).toBeInTheDocument();
+	});
+	it("should render custom icon", async () => {
+		const CustomIcon = () => /* @__PURE__ */ jsx("div", {
+			"data-testid": "custom-icon",
+			children: "Custom Icon"
+		});
+		render(/* @__PURE__ */ jsxs(DialogProvider, { children: [/* @__PURE__ */ jsx(DialogTrigger, { config: {
+			icon: /* @__PURE__ */ jsx(CustomIcon, {}),
+			title: "Icon Alert",
+			type: DialogTypes.ALERT
+		} }), /* @__PURE__ */ jsx(DialogRenderer, {})] }));
+		fireEvent.click(screen.getByText("Open Dialog"));
+		await waitFor(() => screen.getByTestId("custom-icon"));
+		expect(screen.getByTestId("custom-icon")).toBeInTheDocument();
+		expect(screen.queryByLabelText("Success")).not.toBeInTheDocument();
+		expect(screen.queryByLabelText("Error")).not.toBeInTheDocument();
+	});
+	it("should apply size class names", async () => {
+		render(/* @__PURE__ */ jsxs(DialogProvider, { children: [/* @__PURE__ */ jsx(DialogTrigger, { config: {
+			size: "2xl",
+			title: "Large Dialog",
+			type: DialogTypes.ALERT
+		} }), /* @__PURE__ */ jsx(DialogRenderer, {})] }));
+		fireEvent.click(screen.getByText("Open Dialog"));
+		await waitFor(() => screen.getByTestId("mock-dialog-content"));
+		expect(screen.getByTestId("mock-dialog-content")).toHaveClass("max-w-2xl");
+		cleanup();
+		render(/* @__PURE__ */ jsxs(DialogProvider, { children: [/* @__PURE__ */ jsx(DialogTrigger, { config: {
+			size: "md",
+			title: "Medium Dialog",
+			type: DialogTypes.ALERT
+		} }), /* @__PURE__ */ jsx(DialogRenderer, {})] }));
+		fireEvent.click(screen.getByText("Open Dialog"));
+		await waitFor(() => screen.getByTestId("mock-dialog-content"));
+		expect(screen.getByTestId("mock-dialog-content")).toHaveClass("max-w-xl");
+		cleanup();
+		render(/* @__PURE__ */ jsxs(DialogProvider, { children: [/* @__PURE__ */ jsx(DialogTrigger, { config: {
+			size: "sm",
+			title: "Small Dialog",
+			type: DialogTypes.ALERT
+		} }), /* @__PURE__ */ jsx(DialogRenderer, {})] }));
+		fireEvent.click(screen.getByText("Open Dialog"));
+		await waitFor(() => screen.getByTestId("mock-dialog-content"));
+		expect(screen.getByTestId("mock-dialog-content")).toHaveClass("max-w-sm");
+	});
+	it("should apply position class names", async () => {
+		render(/* @__PURE__ */ jsxs(DialogProvider, { children: [/* @__PURE__ */ jsx(DialogTrigger, { config: {
+			position: "top-right",
+			title: "Top Right Dialog",
+			type: DialogTypes.ALERT
+		} }), /* @__PURE__ */ jsx(DialogRenderer, {})] }));
+		fireEvent.click(screen.getByText("Open Dialog"));
+		await waitFor(() => screen.getByTestId("mock-dialog-content"));
+		expect(screen.getByTestId("mock-dialog-content")).toHaveClass("top-4 right-4");
+		cleanup();
+		render(/* @__PURE__ */ jsxs(DialogProvider, { children: [/* @__PURE__ */ jsx(DialogTrigger, { config: {
+			position: "bottom-left",
+			title: "Bottom Left Dialog",
+			type: DialogTypes.ALERT
+		} }), /* @__PURE__ */ jsx(DialogRenderer, {})] }));
+		fireEvent.click(screen.getByText("Open Dialog"));
+		await waitFor(() => screen.getByTestId("mock-dialog-content"));
+		expect(screen.getByTestId("mock-dialog-content")).toHaveClass("bottom-4 left-4");
+	});
+	it("should apply custom class names", async () => {
+		render(/* @__PURE__ */ jsxs(DialogProvider, { children: [/* @__PURE__ */ jsx(DialogTrigger, { config: {
+			classNames: {
+				content: "custom-content-class",
+				footer: "custom-footer-class",
+				header: "custom-header-class"
+			},
+			confirmText: "OK",
+			title: "Styled Dialog",
+			type: DialogTypes.ALERT
+		} }), /* @__PURE__ */ jsx(DialogRenderer, {})] }));
+		fireEvent.click(screen.getByText("Open Dialog"));
+		await waitFor(() => screen.getByTestId("mock-dialog-content"));
+		expect(screen.getByTestId("mock-dialog-header")).toHaveClass("custom-header-class");
+		expect(screen.getByTestId("mock-dialog-content")).toHaveClass("custom-content-class");
+		await waitFor(() => screen.getByTestId("mock-dialog-footer"));
+		expect(screen.getByTestId("mock-dialog-footer")).toHaveClass("custom-footer-class");
+	});
+	it("should render custom footer content", async () => {
+		const CustomFooter = () => /* @__PURE__ */ jsx("div", {
+			"data-testid": "custom-footer",
+			children: "This is a custom footer"
+		});
+		render(/* @__PURE__ */ jsxs(DialogProvider, { children: [/* @__PURE__ */ jsx(DialogTrigger, { config: {
+			footer: /* @__PURE__ */ jsx(CustomFooter, {}),
+			title: "Custom Footer Dialog",
+			type: DialogTypes.ALERT
+		} }), /* @__PURE__ */ jsx(DialogRenderer, {})] }));
+		fireEvent.click(screen.getByText("Open Dialog"));
+		await waitFor(() => screen.getByTestId("custom-footer"));
+		expect(screen.getByTestId("custom-footer")).toBeInTheDocument();
+		expect(screen.queryByTestId("mock-button")).not.toBeInTheDocument();
+	});
+	it("should render custom footer function content for form dialog", async () => {
+		vi.mock("../form/types");
+		const { isStepFormConfig } = await import("../form/types.js");
+		isStepFormConfig.mockReturnValue(false);
+		const CustomFormFooter = (methods) => /* @__PURE__ */ jsxs("div", {
+			"data-testid": "custom-form-footer",
+			children: ["Form Footer: ", methods ? "Methods Available" : "No Methods"]
+		});
+		const onSubmitMock = vi.fn();
+		const onSuccessMock = vi.fn();
+		render(/* @__PURE__ */ jsxs(DialogProvider, { children: [/* @__PURE__ */ jsx(DialogTrigger, { config: {
+			formConfig: {
+				fields: [],
+				footer: CustomFormFooter,
+				onSubmit: onSubmitMock,
+				onSuccess: onSuccessMock
+			},
+			onSubmit: onSubmitMock,
+			onSuccess: onSuccessMock,
+			title: "Form Dialog with Custom Footer",
+			type: DialogTypes.FORM
+		} }), /* @__PURE__ */ jsx(DialogRenderer, {})] }));
+		fireEvent.click(screen.getByText("Open Dialog"));
+		await waitFor(() => screen.getByTestId("custom-form-footer"));
+		expect(screen.getByTestId("custom-form-footer")).toBeInTheDocument();
+		expect(screen.getByTestId("custom-form-footer")).toHaveTextContent("Form Footer: Methods Available");
+		expect(screen.queryByTestId("mock-action-list")).not.toBeInTheDocument();
+	});
+	it.skip("should render actions dropdown for alert/confirm types if actions config is present", async () => {
+		const onConfirmMock = vi.fn();
+		const customActionMock = vi.fn();
+		render(/* @__PURE__ */ jsxs(DialogProvider, { children: [/* @__PURE__ */ jsx(DialogTrigger, { config: {
+			actions: {
+				content: /* @__PURE__ */ jsx("button", {
+					"data-testid": "custom-action-item",
+					onClick: customActionMock,
+					children: "Custom Action"
+				}),
+				triggerLabel: "Options"
+			},
+			dismissable: true,
+			onConfirm: onConfirmMock,
+			title: "Actions Dialog",
+			type: DialogTypes.ALERT
+		} }), /* @__PURE__ */ jsx(DialogRenderer, {})] }));
+		act(() => {
+			fireEvent.click(screen.getByText("Open Dialog"));
+		});
+		await waitFor(() => screen.getByTestId("mock-dropdown-trigger"));
+		expect(screen.getByTestId("mock-dropdown-trigger")).toHaveTextContent("Options");
+		expect(screen.queryByTestId("mock-dropdown-content")).not.toBeInTheDocument();
+		act(() => {
+			fireEvent.click(screen.getByTestId("mock-dropdown-trigger"));
+		});
+		await waitFor(() => screen.getByTestId("mock-dropdown-content"));
+		expect(screen.getByTestId("mock-dropdown-item")).toHaveTextContent("Continue");
+		expect(screen.getByTestId("custom-action-item")).toBeInTheDocument();
+		act(() => {
+			fireEvent.click(screen.getByTestId("mock-dropdown-item"));
+		});
+		await waitFor(() => {
+			expect(onConfirmMock).toHaveBeenCalledTimes(1);
+		});
+		await new Promise((resolve) => setTimeout(resolve, 50));
+		await waitForElementToBeRemoved(() => screen.queryByTestId("mock-dropdown-content"), { timeout: 2e3 });
+		act(() => {
+			fireEvent.click(screen.getByText("Open Dialog"));
+		});
+		await waitFor(() => screen.getByTestId("mock-dropdown-trigger"));
+		act(() => {
+			fireEvent.click(screen.getByTestId("mock-dropdown-trigger"));
+		});
+		await waitFor(() => screen.getByTestId("custom-action-item"));
+		act(() => {
+			fireEvent.click(screen.getByTestId("custom-action-item"));
+		});
+		expect(customActionMock).toHaveBeenCalledTimes(1);
+		await new Promise((resolve) => setTimeout(resolve, 50));
+		await waitForElementToBeRemoved(() => screen.queryByTestId("mock-dropdown-content"), { timeout: 2e3 });
+	});
+});
+
+//#endregion
+//# sourceMappingURL=Dialog.renderer.spec.js.map