@indielayer/ui/lib/components/button/ButtonGroup.vue2.js

Indielayer UI Components with Tailwind CSS build for Vue 3

import { defineComponent as a, provide as u, openBlock as m, createBlock as i, resolveDynamicComponent as d, normalizeStyle as f, unref as t, normalizeClass as c, withCtx as B, renderSlot as y } from "vue";
import { useTheme as g } from "../../composables/useTheme.js";
import { useCommon as r } from "../../composables/useCommon.js";
import { useColors as v } from "../../composables/useColors.js";
import { useInteractive as C } from "../../composables/useInteractive.js";
import { injectButtonGroupKey as h } from "../../composables/keys.js";
const G = {
  ...r.props(),
  ...v.props(),
  ...C.props(),
  tag: {
    type: String,
    default: "div"
  },
  outlined: Boolean,
  rounded: Boolean,
  ghost: Boolean,
  light: Boolean,
  flat: Boolean
}, _ = {
  name: "XButtonGroup",
  validators: {
    ...r.validators()
  }
}, j = /* @__PURE__ */ a({
  ..._,
  props: G,
  setup(s) {
    const e = s;
    u(h, {
      groupProps: e,
      isButtonGroup: !0
    });
    const { className: n, classes: p, styles: l } = g("ButtonGroup", {}, e);
    return (o, b) => (m(), i(d(o.tag), {
      style: f(t(l)),
      class: c([
        t(n),
        o.$style["button-group"],
        o.rounded ? o.$style["button-group--rounded"] : "",
        t(p).wrapper
      ])
    }, {
      default: B(() => [
        y(o.$slots, "default")
      ]),
      _: 3
    }, 8, ["style", "class"]));
  }
});
export {
  j as default
};