@yamada-ui/react/dist/esm/components/alert/alert.js

React UI components of the Yamada, by the Yamada, for the Yamada built with React and Emotion

"use client";


import { styled } from "../../core/system/factory.js";
import { createSlotComponent } from "../../core/components/create-component.js";
import { CircleCheckBigIcon } from "../icon/icons/circle-check-big-icon.js";
import { InfoIcon } from "../icon/icons/info-icon.js";
import { OctagonAlertIcon } from "../icon/icons/octagon-alert-icon.js";
import { TriangleAlertIcon } from "../icon/icons/triangle-alert-icon.js";
import { alertStyle } from "./alert.style.js";
import { useLoadingComponent } from "../loading/use-loading-component.js";
import { useMemo } from "react";
import { jsx } from "react/jsx-runtime";

//#region src/components/alert/alert.tsx
const icons = {
	error: OctagonAlertIcon,
	info: InfoIcon,
	success: CircleCheckBigIcon,
	warning: TriangleAlertIcon
};
const { ComponentContext, PropsContext: AlertPropsContext, useComponentContext, usePropsContext: useAlertPropsContext, withContext, withProvider } = createSlotComponent("alert", alertStyle);
/**
* `Alert` is a component that conveys information to the user.
*
* @see https://yamada-ui.com/docs/components/alert
*/
const AlertRoot = withProvider(({ status, colorScheme = status,...props }) => {
	return /* @__PURE__ */ jsx(ComponentContext, {
		value: useMemo(() => ({ status }), [status]),
		children: /* @__PURE__ */ jsx(styled.div, {
			colorScheme,
			role: "alert",
			...props
		})
	});
}, "root")({ status: "info" });
const AlertIcon = withContext(({ as,...rest }) => {
	const { status } = useComponentContext();
	return /* @__PURE__ */ jsx(as || icons[status], { ...rest });
}, "icon")();
const AlertLoading = withContext(({ loadingScheme = "oval",...rest }) => {
	return /* @__PURE__ */ jsx(useLoadingComponent(loadingScheme), { ...rest });
}, ["icon", "loading"])();
const AlertTitle = withContext("p", "title")();
const AlertDescription = withContext("span", "description")();

//#endregion
export { AlertDescription, AlertIcon, AlertLoading, AlertPropsContext, AlertRoot, AlertTitle, useAlertPropsContext };
//# sourceMappingURL=alert.js.map