vexip-ui/es/components/button/button-group.vue2.mjs

A Vue 3 UI library, Highly customizability, full TypeScript, performance pretty good

import { defineComponent as v, reactive as p, toRef as u, computed as l, provide as h, createElementBlock as y, openBlock as g, normalizeClass as z, renderSlot as G } from "vue";
import { useProps as S, useNameHelper as x } from "@vexip-ui/config";
import { debounceMinor as B } from "@vexip-ui/utils";
import { buttonGroupProps as I } from "./props.mjs";
import { buttonTypes as P, GROUP_STATE as T } from "./symbol.mjs";
const R = /* @__PURE__ */ v({
  name: "ButtonGroup",
  __name: "button-group",
  props: I,
  setup(a) {
    const t = S("buttonGroup", a, {
      size: null,
      type: {
        default: "default",
        validator: (e) => P.includes(e)
      },
      circle: !1
    }), o = x("button-group"), r = p(/* @__PURE__ */ new Set()), m = u(t, "size"), d = u(t, "type"), f = l(() => ({
      [o.b()]: !0,
      [o.bm("inherit")]: t.inherit,
      [o.bm("circle")]: t.circle
    })), i = l(() => Array.from(r)), n = B(() => {
      for (let e = 0, s = i.value.length; e < s; ++e) {
        const c = i.value[e];
        c.index = e + 1, c.isLast = e === s - 1;
      }
    });
    h(
      T,
      p({
        size: m,
        type: d,
        increaseItem: b,
        decreaseItem: _,
        refreshIndexes: n
      })
    );
    function b(e) {
      r.add(e), n();
    }
    function _(e) {
      r.delete(e), n();
    }
    return (e, s) => (g(), y("div", {
      class: z(f.value),
      role: "group"
    }, [
      G(e.$slots, "default")
    ], 2));
  }
});
export {
  R as default
};
//# sourceMappingURL=button-group.vue2.mjs.map