'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var vue = require('vue');
require('../../../utils/index.cjs');
var useConfigInject = require('../../config-provider/src/hooks/useConfigInject.cjs');
var index = require('../style/index.cjs');
var MotionThumb = require('./MotionThumb.cjs');
var Options = require('./Options.cjs');
var props = require('./props.cjs');
var initDefaultProps = require('../../../utils/vue/initDefaultProps.cjs');
var _class = require('../../../utils/dom/class.cjs');

function normalizeOptions(options) {
  return options.map((option) => {
    if (typeof option === "object" && option !== null)
      return option;
    return {
      label: option == null ? void 0 : option.toString(),
      title: option == null ? void 0 : option.toString(),
      value: option
    };
  });
}
var ASegmented = /* @__PURE__ */ vue.defineComponent({
  name: "ASegmented",
  inheritAttrs: false,
  props: initDefaultProps.initDefaultProps(props.segmentedProps(), {
    options: [],
    motionName: "thumb-motion"
  }),
  slots: Object,
  setup(props, {
    emit,
    slots,
    attrs
  }) {
    const {
      prefixCls,
      direction,
      size
    } = useConfigInject.default("segmented", props);
    const [wrapSSR, hashId] = index.default(prefixCls);
    const rootRef = vue.shallowRef();
    const thumbShow = vue.shallowRef(false);
    const segmentedOptions = vue.computed(() => normalizeOptions(props.options));
    const handleChange = (_event, val) => {
      if (props.disabled)
        return;
      emit("update:value", val);
      emit("change", val);
    };
    return () => {
      const pre = prefixCls.value;
      return wrapSSR(vue.createVNode("div", {
        ...attrs,
        "class": _class.classNames(pre, {
          [hashId.value]: true,
          [`${pre}-block`]: props.block,
          [`${pre}-disabled`]: props.disabled,
          [`${pre}-lg`]: size.value === "large",
          [`${pre}-sm`]: size.value === "small",
          [`${pre}-rtl`]: direction.value === "rtl"
        }, attrs.class),
        "ref": rootRef
      }, [vue.createVNode("div", {
        "class": `${pre}-group`
      }, [vue.createVNode(MotionThumb.default, {
        "containerRef": rootRef,
        "prefixCls": pre,
        "value": props.value,
        "motionName": `${pre}-${props.motionName}`,
        "direction": direction.value,
        "getValueIndex": (val) => segmentedOptions.value.findIndex((n) => n.value === val),
        "onMotionStart": () => {
          thumbShow.value = true;
        },
        "onMotionEnd": () => {
          thumbShow.value = false;
        }
      }, null), segmentedOptions.value.map((segmentedOption) => vue.createVNode(Options.default, {
        "key": segmentedOption.value,
        "prefixCls": pre,
        "checked": segmentedOption.value === props.value,
        "onChange": handleChange,
        ...segmentedOption,
        "className": _class.classNames(segmentedOption.className, `${pre}-item`, {
          [`${pre}-item-selected`]: segmentedOption.value === props.value && !thumbShow.value
        }),
        "disabled": !!props.disabled || !!segmentedOption.disabled
      }, slots))])]));
    };
  }
});

exports.default = ASegmented;
//# sourceMappingURL=Segmented.cjs.map
