mine-h5-ui/es/MeActionSheet/index.vue.js

一款轻量级、模块化基于 Vue3.x 的 H5 前端 UI 组件库 👍

import { defineComponent as M, useModel as S, withDirectives as b, openBlock as o, createElementBlock as l, unref as e, normalizeStyle as w, normalizeClass as u, createElementVNode as c, withModifiers as s, Fragment as x, renderList as y, toDisplayString as g, vShow as B, mergeModels as f } from "vue";
import { useShowSheet as D, useBtns as z } from "./hooks.js";
const E = ["onClick"], N = /* @__PURE__ */ M({
  name: "MeActionSheet",
  __name: "index",
  props: /* @__PURE__ */ f({
    list: {},
    index: { default: "id" },
    label: { default: "value" }
  }, {
    visible: { type: Boolean, default: !1 },
    visibleModifiers: {}
  }),
  emits: /* @__PURE__ */ f(["change", "cancel"], ["update:visible"]),
  setup(n, { emit: k }) {
    const v = k, a = S(n, "visible"), { isShowMask: h, isShow: r, hideMask: d, animationDuration: p } = D({ visibleModel: a }), { onLi: C, onCancel: m } = z({ emit: v, visibleModel: a });
    return (L, t) => b((o(), l("div", {
      class: u(["me-action-sheet", { show: e(r) }]),
      style: w(`--animation-duration:${e(p)}ms;`),
      onClick: t[2] || (t[2] = //@ts-ignore
      (...i) => e(d) && e(d)(...i))
    }, [
      c("ul", {
        class: u(["list-li", { on: e(r) }]),
        onClick: t[1] || (t[1] = s(() => {
        }, ["stop"]))
      }, [
        (o(!0), l(x, null, y(n.list, (i) => (o(), l("li", {
          key: i[n.index],
          onClick: s(($) => e(C)(i), ["stop"])
        }, g(i[n.label]), 9, E))), 128)),
        c("li", {
          onClick: t[0] || (t[0] = s(
            //@ts-ignore
            (...i) => e(m) && e(m)(...i),
            ["stop"]
          ))
        }, "取消")
      ], 2)
    ], 6)), [
      [B, e(h)]
    ]);
  }
});
export {
  N as default
};