/**
 * @license MIT
 * author: Cube Dev Team
 * @cube-dev/ui-kit v0.0.0-canary-7eefd09
 * Released under the MIT license.
 */

import { jsx as _jsx } from "react/jsx-runtime";
import { forwardRef } from 'react';
import THEMES from '../../../data/themes.js';
import { tasty } from '../../../tasty/index.js';
import { useAlert } from './use-alert.js';
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.disabled.color,
        },
        fill: {
            '': '#clear',
            ...Object.keys(THEMES).reduce((map, type) => {
                map[`type=${type}`] = THEMES[type].fill;
                return map;
            }, {}),
        },
        border: {
            '': '#clear',
            ...Object.keys(THEMES).reduce((map, type) => {
                map[`type=${type}`] = THEMES[type].border;
                return map;
            }, {}),
            'shape=sharp': '0',
        },
    },
});
export const Alert = forwardRef(function Alert(props, ref) {
    const { styles, mods, filteredProps } = useAlert(props);
    return (_jsx(AlertElement, { ...filteredProps, ref: ref, mods: mods, styles: styles }));
});

        