import { computed, createVNode, mergeProps, Fragment } from "vue";
import "./styles/alert.scss";
import { useProxiedModel } from "../../composables/proxied-model/index.mjs";
import { makeTransitionProps, MaybeTransition } from "../../composables/transition/index.mjs";
import { makeLoadingProps, useLoading } from "../../composables/loading/index.mjs";
import { makeCardProps, filterCardProps, Card } from "../card/card.mjs";
import { FadeInExpandTransition } from "../transition/fade-in-expand-transition.mjs";
import { Icon } from "../icon/icon.mjs";
import { Progress } from "../progress/progress.mjs";
import { Button } from "../button/button.mjs";
import { propsFactory, pick } from "../../utils/dist/index.mjs";
import { genericComponent } from "../../utils/define-component.mjs";
const alertTypes = ["success", "info", "warning", "error"];
const makeAlertProps = propsFactory({
  modelValue: {
    type: Boolean,
    default: true
  },
  type: {
    type: String,
    default: "info",
    validator: (val) => alertTypes.includes(val)
  },
  icon: {
    type: [String, Boolean, Object],
    default: true
  },
  closable: Boolean,
  closeIcon: {
    type: [String, Object],
    default: "$close"
  },
  closeText: String,
  ...makeTransitionProps({
    transition: {
      component: FadeInExpandTransition
    }
  }),
  ...makeLoadingProps(),
  ...makeCardProps({
    shape: "rounded-sm",
    variant: "contained-outlined"
  })
}, "alert");
const Alert = genericComponent()({
  name: "VeAlert",
  props: makeAlertProps(),
  emits: {
    "update:modelValue": (_) => true
  },
  setup(props, {
    slots
  }) {
    const {
      loadingClasses
    } = useLoading(props);
    const computedProps = computed(() => {
      var _a;
      return {
        ...props,
        text: void 0,
        textColor: (_a = props.type) != null ? _a : props.textColor
      };
    });
    const isActive = useProxiedModel(props, "modelValue");
    const icon = computed(() => {
      if (props.icon === false)
        return void 0;
      if (typeof props.icon === "string")
        return props.icon;
      if (props.type)
        return `$${props.type}`;
      return void 0;
    });
    function onCloseClick(_) {
      isActive.value = false;
    }
    return () => {
      const [cardProps] = filterCardProps(computedProps.value);
      const hasLoading = props.loading;
      const hasIcon = !hasLoading && icon.value;
      const hasPrepend = hasIcon || hasLoading || slots.prepend;
      const hasTitle = !!props.title;
      const hasClosable = props.closable && (props.closeText || props.closeIcon);
      const hasAppend = hasClosable || slots.append;
      return createVNode(MaybeTransition, {
        "transition": props.transition
      }, {
        default: () => [isActive.value && createVNode(props.tag, {
          "role": "alert",
          "class": ["ve-alert", {
            "ve-alert--with-title": hasTitle
          }, loadingClasses.value]
        }, {
          default: () => [createVNode(Card, mergeProps(cardProps, {
            "tag": "div"
          }), {
            prepend: hasPrepend ? () => {
              var _a;
              return createVNode(Fragment, null, [hasIcon && createVNode(Icon, {
                "class": "ve-alert__icon",
                "size": "21",
                "icon": icon.value
              }, null), hasLoading && createVNode(Progress, {
                "class": "ve-alert__icon",
                "size": "21",
                "variant": "circular",
                "stroke-width": "2",
                "indeterminate": true
              }, null), (_a = slots.prepend) == null ? void 0 : _a.call(slots)]);
            } : void 0,
            headerText: () => {
              var _a, _b;
              return createVNode(Fragment, null, [hasTitle && createVNode("div", {
                "class": "ve-alert__title"
              }, [props.title]), (_b = (_a = slots.default) == null ? void 0 : _a.call(slots)) != null ? _b : props.text]);
            },
            append: hasAppend ? () => {
              var _a;
              return createVNode(Fragment, null, [(_a = slots.append) == null ? void 0 : _a.call(slots), hasClosable && createVNode(Button, {
                "class": "ve-alert__close",
                "variant": "plain",
                "ripple": false,
                "icon": props.closeText ? false : props.closeIcon,
                "text": props.closeText,
                "onClick": onCloseClick
              }, null)]);
            } : void 0
          })]
        })]
      });
    };
  }
});
function filterAlertProps(props) {
  return pick(props, Object.keys(Alert.props));
}
export {
  Alert,
  alertTypes,
  filterAlertProps,
  makeAlertProps
};
//# sourceMappingURL=alert.mjs.map
