import { toRef, createVNode, mergeProps } from "vue";
import "./styles/scrim.scss";
import { makeTransitionProps, MaybeTransition } from "../../composables/transition/index.mjs";
import { useBackgroundColor } from "../../composables/color/index.mjs";
import { FadeTransition } from "../transition/fade-transition.mjs";
import { defineComponent } from "../../utils/define-component.mjs";
const Scrim = defineComponent({
  name: "VeScrim",
  inheritAttrs: false,
  props: {
    modelValue: Boolean,
    color: String,
    ...makeTransitionProps({
      transition: {
        component: FadeTransition
      }
    })
  },
  setup(props, {
    attrs
  }) {
    const {
      backgroundColorClasses,
      backgroundColorStyles
    } = useBackgroundColor(toRef(props, "color"));
    return () => {
      return createVNode(MaybeTransition, {
        "transition": props.transition,
        "appear": true
      }, {
        default: () => [props.modelValue && createVNode("div", mergeProps({
          "class": ["ve-scrim", backgroundColorClasses.value],
          "style": backgroundColorStyles.value
        }, attrs), null)]
      });
    };
  }
});
export {
  Scrim
};
//# sourceMappingURL=scrim.mjs.map
