@opensig/opendesign/es/message/OMessageList.vue.mjs

<p align="center"><img src="../docs/public/opendesign-logo-light.png"/></p> <h1 align="center">opendesign</h1> <p align="center">一个 Vue 3 组件库</p> <p align="center"><b>皮肤可定制，使用 TypeScript</b></p>

import { defineComponent, ref, createElementBlock, createCommentVNode, openBlock, normalizeClass, createVNode, TransitionGroup, withCtx, Fragment, renderList, createBlock, createSlots, unref, createTextVNode, toDisplayString, resolveDynamicComponent, shallowRef } from "vue";
import { messageListProps } from "./types.mjs";
import _sfc_main$1 from "./OMessage.vue.mjs";
import { isString } from "../_utils/is.mjs";
const _sfc_main = /* @__PURE__ */ defineComponent({
  __name: "OMessageList",
  props: messageListProps,
  setup(__props, { expose: __expose }) {
    const props = __props;
    const getUniqueId = /* @__PURE__ */ (() => {
      let id = 0;
      return () => {
        id += 1;
        return id;
      };
    })();
    const optionList = ref([]);
    const add = (params) => {
      const option = {
        id: getUniqueId(),
        ...params
      };
      if (params.icon) {
        option.icon = shallowRef(params.icon);
      }
      optionList.value.push(option);
    };
    const remove = (idx) => {
      optionList.value.splice(idx, 1);
    };
    const removeAll = () => {
      optionList.value = [];
    };
    const close = (id) => {
      const idx = optionList.value.findIndex((option) => option.id === id);
      remove(idx);
      if (optionList.value.length === 0 && props.onDestory) {
        props.onDestory();
      }
    };
    const handleDurationEnd = (item) => {
      const { id, onDurationEnd } = item;
      onDurationEnd == null ? void 0 : onDurationEnd();
      close(id);
    };
    const handleClose = (item, ev) => {
      const { id, onClose } = item;
      onClose == null ? void 0 : onClose(ev);
      close(id);
    };
    __expose({ add, remove, removeAll });
    return (_ctx, _cache) => {
      return optionList.value.length ? (openBlock(), createElementBlock(
        "div",
        {
          key: 0,
          class: normalizeClass(["o-message-list", [`o-message-list-${props.position}`]])
        },
        [
          createVNode(TransitionGroup, { name: "o-message-fade" }, {
            default: withCtx(() => [
              (openBlock(true), createElementBlock(
                Fragment,
                null,
                renderList(optionList.value, (item) => {
                  return openBlock(), createBlock(_sfc_main$1, {
                    key: item.id,
                    status: item.status,
                    duration: item.duration,
                    closable: item.closable,
                    onDurationEnd: ($event) => handleDurationEnd(item),
                    onClose: (ev) => {
                      handleClose(item, ev);
                    }
                  }, createSlots({
                    default: withCtx(() => [
                      unref(isString)(item.content) ? (openBlock(), createElementBlock(
                        Fragment,
                        { key: 0 },
                        [
                          createTextVNode(
                            toDisplayString(item.content),
                            1
                            /* TEXT */
                          )
                        ],
                        64
                        /* STABLE_FRAGMENT */
                      )) : (openBlock(), createBlock(resolveDynamicComponent(item.content), { key: 1 }))
                    ]),
                    _: 2
                    /* DYNAMIC */
                  }, [
                    item.icon ? {
                      name: "icon",
                      fn: withCtx(() => [
                        (openBlock(), createBlock(resolveDynamicComponent(item.icon)))
                      ]),
                      key: "0"
                    } : void 0
                  ]), 1032, ["status", "duration", "closable", "onDurationEnd", "onClose"]);
                }),
                128
                /* KEYED_FRAGMENT */
              ))
            ]),
            _: 1
            /* STABLE */
          })
        ],
        2
        /* CLASS */
      )) : createCommentVNode("v-if", true);
    };
  }
});
export {
  _sfc_main as default
};