import { cn } from "./index3.js";
import { AIContainerContext } from "./index421.js";
import * as React from "react";
import { jsx, jsxs } from "react/jsx-runtime";
//#region src/components/organisms/ai/AIEmptyState/AIEmptyState.tsx
function useFadeState(fadeOn) {
	const ctx = React.useContext(AIContainerContext);
	if (!fadeOn || !ctx) return false;
	const { inputHasText, inputIsFocused } = ctx;
	switch (fadeOn) {
		case "type": return inputHasText;
		case "focus": return inputIsFocused;
		case "both": return inputHasText || inputIsFocused;
	}
}
function AIEmptyStateIcon({ children, fadeOn, className, ...props }) {
	const shouldFade = useFadeState(fadeOn);
	return /* @__PURE__ */ jsx("div", {
		"data-slot": "ai-empty-state-icon",
		className: cn("flex items-center justify-center text-quaternary-foreground transition-all duration-150 ease-out motion-reduce:transition-none", !shouldFade && "delight-stagger motion-reduce:animate-none", shouldFade && "opacity-0 -translate-y-5 pointer-events-none", className),
		...props,
		children
	});
}
AIEmptyStateIcon.displayName = "AIEmptyState.Icon";
function AIEmptyStateTitle({ children, fadeOn, className, ...props }) {
	const shouldFade = useFadeState(fadeOn);
	return /* @__PURE__ */ jsx("div", {
		"data-slot": "ai-empty-state-title",
		className: cn("flex flex-col items-center gap-4 transition-all duration-150 ease-out motion-reduce:transition-none", !shouldFade && "delight-stagger motion-reduce:animate-none", shouldFade && "opacity-0 -translate-y-5 pointer-events-none", className),
		style: !shouldFade ? { "--delight-delay": "100ms" } : void 0,
		...props,
		children
	});
}
AIEmptyStateTitle.displayName = "AIEmptyState.Title";
function AIEmptyStateDescription({ children, fadeOn, className, ...props }) {
	const shouldFade = useFadeState(fadeOn);
	return /* @__PURE__ */ jsx("p", {
		"data-slot": "ai-empty-state-description",
		className: cn("text-xs text-muted-foreground transition-all duration-150 ease-out motion-reduce:transition-none", !shouldFade && "delight-stagger motion-reduce:animate-none", shouldFade && "opacity-0 -translate-y-5 pointer-events-none", className),
		style: !shouldFade ? { "--delight-delay": "200ms" } : void 0,
		...props,
		children
	});
}
AIEmptyStateDescription.displayName = "AIEmptyState.Description";
function AIEmptyStateActions({ children, fadeOn, className, ...props }) {
	const shouldFade = useFadeState(fadeOn);
	return /* @__PURE__ */ jsx("div", {
		"data-slot": "ai-empty-state-actions",
		className: cn("flex flex-wrap items-center justify-center gap-4 transition-opacity duration-200 ease-out motion-reduce:transition-none", !shouldFade && "delight-stagger motion-reduce:animate-none", shouldFade && "opacity-0 pointer-events-none", className),
		style: !shouldFade ? { "--delight-delay": "300ms" } : void 0,
		...props,
		children
	});
}
AIEmptyStateActions.displayName = "AIEmptyState.Actions";
var GRID_COLS_MAP = {
	1: "grid-cols-1",
	2: "grid-cols-1 sm:grid-cols-2",
	3: "grid-cols-1 sm:grid-cols-2 md:grid-cols-3",
	4: "grid-cols-1 sm:grid-cols-2 md:grid-cols-4"
};
function AIEmptyStateSuggestionGrid({ children, fadeOn, columns = 2, className, ...props }) {
	const shouldFade = useFadeState(fadeOn);
	return /* @__PURE__ */ jsx("div", {
		"data-slot": "ai-empty-state-suggestion-grid",
		className: cn("grid gap-3 transition-opacity duration-200 ease-out motion-reduce:transition-none", GRID_COLS_MAP[columns], !shouldFade && "delight-stagger motion-reduce:animate-none", shouldFade && "opacity-0 pointer-events-none", className),
		style: !shouldFade ? { "--delight-delay": "350ms" } : void 0,
		...props,
		children
	});
}
AIEmptyStateSuggestionGrid.displayName = "AIEmptyState.SuggestionGrid";
function AIEmptyStateRoot({ children, className, ...props }) {
	return /* @__PURE__ */ jsx("div", {
		"data-slot": "ai-empty-state",
		className: cn("flex flex-col items-center justify-center gap-6 size-full", className),
		...props,
		children
	});
}
AIEmptyStateRoot.displayName = "AIEmptyState";
function AIEmptyStateDefault({ title, description, icon, children, className, ...props }) {
	if (title) return /* @__PURE__ */ jsxs(AIEmptyStateRoot, {
		className,
		...props,
		children: [
			icon && /* @__PURE__ */ jsx(AIEmptyStateIcon, { children: icon }),
			/* @__PURE__ */ jsxs("div", {
				className: "flex flex-col items-center gap-4",
				children: [/* @__PURE__ */ jsx("h1", {
					className: "text-2xl font-semibold text-foreground text-center",
					children: title
				}), description && /* @__PURE__ */ jsx("p", {
					className: "text-xs text-muted-foreground",
					children: description
				})]
			}),
			children && /* @__PURE__ */ jsx("div", {
				className: "flex flex-wrap items-center justify-center gap-4",
				children
			})
		]
	});
	return /* @__PURE__ */ jsx(AIEmptyStateRoot, {
		className,
		...props,
		children
	});
}
AIEmptyStateDefault.displayName = "AIEmptyState";
/**
* AIEmptyState - Empty state for AI chat interfaces.
*
* Supports two usage patterns:
*
* 1. **Monolithic API (simple usage)**:
* ```tsx
* <AIEmptyState
*   icon={<Stars01 className="size-12" />}
*   title="How can I help you?"
*   description="Powered by HumainOne"
* >
*   <Button>Get started</Button>
* </AIEmptyState>
* ```
*
* 2. **Compound API (full control)**:
* ```tsx
* <AIEmptyState.Root>
*   <AIEmptyState.Icon fadeOn="type">
*     <Stars01 className="size-12" />
*   </AIEmptyState.Icon>
*   <AIEmptyState.Title fadeOn="type">
*     <h1>How can I help you?</h1>
*   </AIEmptyState.Title>
*   <AIEmptyState.Description fadeOn="type">
*     Powered by HumainOne
*   </AIEmptyState.Description>
*   <AIEmptyState.Actions fadeOn="type">
*     <AIPromptSuggestion>What can I do?</AIPromptSuggestion>
*   </AIEmptyState.Actions>
* </AIEmptyState.Root>
* ```
*/
var AIEmptyState = Object.assign(AIEmptyStateDefault, {
	Root: AIEmptyStateRoot,
	Icon: AIEmptyStateIcon,
	Title: AIEmptyStateTitle,
	Description: AIEmptyStateDescription,
	Actions: AIEmptyStateActions,
	SuggestionGrid: AIEmptyStateSuggestionGrid
});
//#endregion
export { AIEmptyState, AIEmptyStateActions, AIEmptyStateDescription, AIEmptyStateIcon, AIEmptyStateRoot, AIEmptyStateSuggestionGrid, AIEmptyStateTitle };

//# sourceMappingURL=index422.js.map