@aplus-frontend/ui/es/src/business/ap-ladder/components/ValueGroupMode.mjs

import { defineComponent as i, createVNode as a, createTextVNode as d } from "vue";
import "../../../config-provider/index.mjs";
import s from "./RenderValue.mjs";
import { useNamespace as p } from "../../../config-provider/hooks/use-namespace.mjs";
const v = /* @__PURE__ */ i({
  name: "ApLadderValueGroupMode",
  props: {
    labelValues: {
      type: Array,
      default: () => []
    },
    labelAlign: {
      type: String,
      default: ""
    }
  },
  emits: ["update:valueRefs", "handleClick"],
  setup(o, {
    emit: r,
    slots: t
  }) {
    const {
      e: l
    } = p("ap-ladder"), n = (e) => {
      r("handleClick", e);
    };
    return () => a("div", {
      class: l("value-group-mode")
    }, [o.labelValues.map((e, u) => a("div", {
      key: u,
      class: [l("value-group-item"), e.label === "" && l("value-group-value-end")]
    }, [e.label && a("span", {
      class: [l("value-group-label"), o.labelAlign ? l(`value-group-label-${o.labelAlign}`) : null],
      style: e.labelColor ? {
        color: e.labelColor
      } : null,
      title: String(e.label)
    }, [e.label]), e.label && a("span", {
      class: l("value-group-label-semicolon")
    }, [d(":")]), a(s, {
      labelValue: e,
      labelValues: o.labelValues,
      onHandleClick: n
    }, null), t.title && t.title()]))]);
  }
});
export {
  v as default
};