/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-f1f3d22 | Cube Dev Team */
import { tasty } from "../../../tasty/tasty.js";
import themes_default from "../../../data/themes.js";
import { useAlert } from "./use-alert.js";
import { forwardRef } from "react";
import { jsx } from "react/jsx-runtime";

//#region src/components/content/Alert/Alert.tsx
const AlertElement = tasty({
	name: "Alert",
	role: "alert",
	qa: "Alert",
	styles: {
		display: "block",
		flow: "column",
		radius: {
			"": "1cr",
			"shape=sharp": "0"
		},
		padding: "1.5x",
		preset: "t3",
		color: {
			"": "#dark-02",
			"type=disabled": themes_default.disabled.color
		},
		fill: {
			"": "#clear",
			...Object.keys(themes_default).reduce((map, type) => {
				map[`type=${type}`] = themes_default[type].fill;
				return map;
			}, {})
		},
		border: {
			"": "#clear",
			...Object.keys(themes_default).reduce((map, type) => {
				map[`type=${type}`] = themes_default[type].border;
				return map;
			}, {}),
			"shape=sharp": "0"
		}
	}
});
const Alert = forwardRef(function Alert(props, ref) {
	const { styles, mods, filteredProps } = useAlert(props);
	return /* @__PURE__ */ jsx(AlertElement, {
		...filteredProps,
		ref,
		mods,
		styles
	});
});

//#endregion
export { Alert };
//# sourceMappingURL=Alert.js.map