@varlet/ui/es/snackbar/core.mjs

A Vue3 component library based on Material Design 2 and 3, supporting mobile and desktop.

import { computed, defineComponent, ref, watch } from "vue";
import { call } from "@varlet/shared";
import { onSmartMounted } from "@varlet/use";
import { useLock } from "../context/lock.mjs";
import { useZIndex } from "../context/zIndex.mjs";
import VarIcon from "../icon/index.mjs";
import VarLoading from "../loading/index.mjs";
import { createNamespace, formatElevation } from "../utils/components.mjs";
import { SNACKBAR_TYPE } from "./index.mjs";
import { props } from "./props.mjs";
const { n, classes } = createNamespace("snackbar");
const ICON_TYPE_DICT = {
  success: "checkbox-marked-circle",
  warning: "warning",
  info: "information",
  error: "error",
  loading: ""
};
import { renderSlot as _renderSlot, toDisplayString as _toDisplayString, createTextVNode as _createTextVNode, normalizeClass as _normalizeClass, createElementVNode as _createElementVNode, resolveComponent as _resolveComponent, openBlock as _openBlock, createBlock as _createBlock, createCommentVNode as _createCommentVNode, createElementBlock as _createElementBlock, normalizeStyle as _normalizeStyle, vShow as _vShow, withDirectives as _withDirectives } from "vue";
function __render__(_ctx, _cache) {
  const _component_var_icon = _resolveComponent("var-icon");
  const _component_var_loading = _resolveComponent("var-loading");
  return _withDirectives((_openBlock(), _createElementBlock(
    "div",
    {
      class: _normalizeClass(_ctx.n()),
      style: _normalizeStyle({ pointerEvents: _ctx.isForbidClick ? "auto" : "none", zIndex: _ctx.zIndex })
    },
    [
      _createElementVNode(
        "div",
        {
          class: _normalizeClass(
            _ctx.classes(
              _ctx.n("wrapper"),
              _ctx.n(`wrapper-${_ctx.position}`),
              _ctx.formatElevation(_ctx.elevation, 4),
              [_ctx.vertical, _ctx.n("vertical")],
              [_ctx.type && _ctx.SNACKBAR_TYPE.includes(_ctx.type), _ctx.n(`wrapper-${_ctx.type}`)]
            )
          ),
          style: _normalizeStyle({ zIndex: _ctx.zIndex })
        },
        [
          _createElementVNode(
            "div",
            {
              class: _normalizeClass([_ctx.n("content"), _ctx.contentClass])
            },
            [
              _renderSlot(_ctx.$slots, "default", {}, () => [
                _createTextVNode(
                  _toDisplayString(_ctx.content),
                  1
                  /* TEXT */
                )
              ])
            ],
            2
            /* CLASS */
          ),
          _ctx.iconName || _ctx.type === "loading" || _ctx.$slots.icon ? (_openBlock(), _createElementBlock(
            "div",
            {
              key: 0,
              class: _normalizeClass(_ctx.n("icon"))
            },
            [
              _ctx.iconName ? (_openBlock(), _createBlock(_component_var_icon, {
                key: 0,
                name: _ctx.iconName
              }, null, 8, ["name"])) : _createCommentVNode("v-if", true),
              _ctx.type === "loading" ? (_openBlock(), _createBlock(_component_var_loading, {
                key: 1,
                type: _ctx.loadingType,
                size: _ctx.loadingSize,
                color: _ctx.loadingColor,
                radius: _ctx.loadingRadius
              }, null, 8, ["type", "size", "color", "radius"])) : _createCommentVNode("v-if", true),
              _renderSlot(_ctx.$slots, "icon")
            ],
            2
            /* CLASS */
          )) : _createCommentVNode("v-if", true),
          _ctx.$slots.action ? (_openBlock(), _createElementBlock(
            "div",
            {
              key: 1,
              class: _normalizeClass(_ctx.n("action"))
            },
            [
              _renderSlot(_ctx.$slots, "action")
            ],
            2
            /* CLASS */
          )) : _createCommentVNode("v-if", true)
        ],
        6
        /* CLASS, STYLE */
      )
    ],
    6
    /* CLASS, STYLE */
  )), [
    [_vShow, _ctx.show]
  ]);
}
const __sfc__ = defineComponent({
  name: "VarSnackbarCore",
  components: {
    VarLoading,
    VarIcon
  },
  props,
  setup(props2) {
    const timer = ref(null);
    const { zIndex } = useZIndex(() => props2.show, 1);
    useLock(
      () => props2.show,
      () => props2.lockScroll
    );
    const isForbidClick = computed(() => {
      const { type, forbidClick } = props2;
      return type === "loading" || forbidClick;
    });
    const iconName = computed(() => !props2.type ? "" : ICON_TYPE_DICT[props2.type]);
    function updateAfterDuration() {
      timer.value = setTimeout(() => {
        if (props2.type !== "loading") {
          call(props2["onUpdate:show"], false);
        }
      }, props2.duration);
    }
    watch(
      () => props2.show,
      (show) => {
        if (show) {
          call(props2.onOpen);
          updateAfterDuration();
        } else {
          clearTimeout(timer.value);
          call(props2.onClose);
        }
      }
    );
    watch(
      () => props2._update,
      () => {
        clearTimeout(timer.value);
        updateAfterDuration();
      }
    );
    onSmartMounted(() => {
      if (props2.show) {
        call(props2.onOpen);
        updateAfterDuration();
      }
    });
    return {
      SNACKBAR_TYPE,
      zIndex,
      iconName,
      isForbidClick,
      n,
      classes,
      formatElevation
    };
  }
});
__sfc__.render = __render__;
var stdin_default = __sfc__;
export {
  stdin_default as default
};