import { withDirectives as _withDirectives, resolveDirective as _resolveDirective, isVNode as _isVNode, Fragment as _Fragment, createVNode as _createVNode } from "vue";
import "./styles/card.css";
import { pick, propsFactory } from "@veno-ui/utils";
import { defineComponent } from "../../utils";
import { makeRouterProps, useLink } from "../../composables/router";
import { makeLoadingProps, useLoading } from "../../composables/loading";
import { makeDisabledProps, useDisabled } from "../../composables/disabled";
import { genOverlays, makePaperProps, usePaper } from "../../composables/paper";
import { Ripple } from "../../directives";
import { Avatar } from "../avatar";
import { Divider } from "../divider";
import { Image } from "../image";
import { CardImage } from "./card-image";
import { CardAvatar } from "./card-avatar";
import { CardHeader } from "./card-header";
import { CardHeaderText } from "./card-header-text";
import { CardTitle } from "./card-title";
import { CardSubtitle } from "./card-subtitle";
import { CardText } from "./card-text";
import { CardActions } from "./card-actions";
function _isSlot(s) {
  return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !_isVNode(s);
}
const makeCardProps = propsFactory({
  link: Boolean,
  hover: Boolean,
  image: String,
  prependAvatar: String,
  prependIcon: String,
  appendAvatar: String,
  appendIcon: String,
  title: String,
  subtitle: String,
  divided: Boolean,
  text: String,
  ripple: {
    type: Boolean,
    default: true
  },
  ...makeRouterProps(),
  ...makeLoadingProps(),
  ...makeDisabledProps(),
  ...makePaperProps({
    shape: "rounded-sm",
    variant: "contained"
  })
}, "card");
const Card = defineComponent({
  name: "VeCard",
  directives: {
    Ripple
  },
  props: makeCardProps(),
  setup(props, {
    attrs,
    slots
  }) {
    const {
      paperClasses,
      paperStyles
    } = usePaper(props);
    const link = useLink(props, attrs);
    const {
      loadingClasses
    } = useLoading(props);
    const {
      disabledClasses
    } = useDisabled(props);
    return () => {
      let _slot;
      const Tag = link.isLink.value ? "a" : props.tag;
      const hasImage = !!(slots.image || props.image);
      const hasTitle = !!(slots.title || props.title);
      const hasSubtitle = !!(slots.subtitle || props.subtitle);
      const hasHeaderText = !!slots.headerText || hasTitle || hasSubtitle;
      const hasPrepend = !!(slots.prepend || props.prependAvatar || props.prependIcon);
      const hasAppend = !!(slots.append || props.appendAvatar || props.appendIcon);
      const hasHeader = !!slots.header || hasHeaderText || hasPrepend || hasAppend;
      const hasText = !!(slots.text || props.text);
      const isClickable = !props.disabled && (link.isClickable.value || props.link);
      return _withDirectives(_createVNode(Tag, {
        "class": ["ve-card", {
          "ve-card--hover": props.hover && !props.disabled,
          "ve-card--link": isClickable
        }, paperClasses.value, loadingClasses.value, disabledClasses.value],
        "style": paperStyles.value,
        "href": link.href.value,
        "onClick": isClickable && link.navigate
      }, {
        default: () => [genOverlays(isClickable, "ve-card"), hasImage && _createVNode(CardImage, null, {
          default: () => [slots.image?.({
            src: props.image
          }) ?? _createVNode(Image, {
            "src": props.image,
            "cover": true
          }, null)]
        }), slots.media?.(), hasHeader && _createVNode(CardHeader, null, {
          default: () => [slots.header?.() ?? _createVNode(_Fragment, null, [hasPrepend && _createVNode(CardAvatar, null, {
            default: () => [slots.prepend?.() ?? _createVNode(Avatar, {
              "density": props.density,
              "icon": props.prependIcon,
              "image": props.prependAvatar
            }, null)]
          }), hasHeaderText && _createVNode(CardHeaderText, null, {
            default: () => [slots.headerText?.() ?? _createVNode(_Fragment, null, [hasTitle && _createVNode(CardTitle, null, {
              default: () => [slots.title?.() ?? props.title]
            }), hasSubtitle && _createVNode(CardSubtitle, null, {
              default: () => [slots.subtitle?.() ?? props.subtitle]
            })])]
          }), hasAppend && _createVNode(CardAvatar, null, {
            default: () => [slots.append?.() ?? _createVNode(Avatar, {
              "density": props.density,
              "icon": props.appendIcon,
              "image": props.appendAvatar
            }, null)]
          })])]
        }), props.divided && _createVNode(Divider, null, null), hasText && _createVNode(CardText, null, {
          default: () => [slots.text?.() ?? props.text]
        }), slots.default?.(), slots.actions && props.divided && _createVNode(Divider, null, null), slots.actions && _createVNode(CardActions, null, _isSlot(_slot = slots.actions()) ? _slot : {
          default: () => [_slot]
        })]
      }), [[_resolveDirective("ripple"), isClickable && props.ripple]]);
    };
  }
});
function filterCardProps(props) {
  return pick(props, Object.keys(Card.props));
}
export {
  Card,
  filterCardProps,
  makeCardProps
};
//# sourceMappingURL=card.mjs.map
