@aplus-frontend/ui/es/src/business/batch-input-group/index.vue.mjs

import { defineComponent as _, ref as y, computed as u, unref as t, createElementBlock as z, openBlock as h, normalizeStyle as g, normalizeClass as T, createVNode as c, withCtx as B, createBlock as $, createCommentVNode as K, mergeProps as M } from "vue";
import "../../ap-field/index.mjs";
import { Space as D } from "@aplus-frontend/antdv";
import "../../config-provider/index.mjs";
import { isNumber as G, omit as q } from "lodash-unified";
import "./popover-input/index.vue.mjs";
import "../../hooks/index.mjs";
import { isDef as H } from "../../utils/index.mjs";
import { useDefaultPlaceholder as Y } from "../../ap-field/hooks/use-default-placeholder.mjs";
import { splitValue as J } from "./utils.mjs";
import { useControllableValue as Q } from "../../hooks/useControllableValue.mjs";
import { useLocale as W } from "../../config-provider/hooks/use-locale.mjs";
import { useNamespace as X } from "../../config-provider/hooks/use-namespace.mjs";
import Z from "../../ap-field/select/index.vue.mjs";
import { ApFieldText as ee } from "../../ap-field/text/index.mjs";
import te from "./popover-input/index.vue2.mjs";
const m = "GROUP_SEARCH_ALL", ge = /* @__PURE__ */ _({
  name: "BatchInputGroup",
  __name: "index",
  props: {
    style: { type: [Boolean, null, String, Object, Array] },
    inputStyle: { type: [Boolean, null, String, Object, Array] },
    options: {},
    hasAll: { type: Boolean, default: !0 },
    value: {},
    "onUpdate:value": {},
    popoverPlacement: { default: "left" },
    maxNum: { default: 200 },
    mode: { default: "edit" },
    class: {},
    variant: {},
    size: {},
    name: {},
    type: { default: "text" },
    onCompositionend: {},
    onCompositionstart: {},
    onFocus: {},
    onBlur: {},
    onChange: {},
    onInput: {},
    onKeydown: {},
    onKeyup: {},
    onMousedown: {},
    focused: { type: Boolean },
    hidden: { type: Boolean },
    disabled: { type: Boolean },
    prefixCls: {},
    id: {},
    readonly: { type: Boolean },
    autofocus: { type: Boolean },
    autocomplete: {},
    placeholder: {},
    lazy: { type: Boolean, default: !0 },
    maxlength: {},
    loading: { type: Boolean },
    bordered: { type: Boolean, default: !0 },
    showCount: { type: [Boolean, Object] },
    htmlSize: {},
    onPressEnter: {},
    onMouseUp: {},
    onRawInput: {},
    valueModifiers: {},
    status: {},
    defaultValue: {},
    inputElement: {},
    triggerFocus: {},
    handleReset: {},
    addonBefore: {},
    addonAfter: {},
    prefix: {},
    suffix: {},
    clearIcon: {},
    allowClear: { type: Boolean, default: !0 },
    emptyText: { default: "--" },
    beforeInput: {}
  },
  emits: ["update:value"],
  setup(b, { emit: A }) {
    const o = b, V = Y("Text", o), x = A, { value: a, updateValue: r } = Q(
      o,
      x
    ), s = y(), f = y(), { t: C } = W(), { b: S, cssVar: k } = X("batch-input-group"), I = u(() => {
      const e = o.popoverPlacement;
      return {
        "popover-left": G(e) ? `${e}px` : e === "left" ? "0px" : "unset",
        "popover-right": e === "right" ? "0px" : "unset"
      };
    }), U = u(() => o.options ? o.options.length > 1 && o.hasAll ? [
      { value: m, label: C("ap.common.all") },
      ...o.options
    ] : o.options : []), w = u(() => o.options ? o.options.map((e) => e.value) : []), P = u(() => t(a)?.value?.length ? t(a).value.join(",") : ""), R = u(() => t(a)?.value?.length ? t(a).value.join(`
`) : ""), N = u(() => {
      const e = t(a)?.key;
      if (e?.length)
        return e.length === 1 || !o.hasAll ? e[0] : m;
    }), j = u(() => {
      const e = t(a)?.key;
      return !e || e?.length <= 1 ? t(V) : (o.options || []).filter((n) => e.includes(n.value)).map((n) => n.label).join("/");
    });
    function E(e) {
      const l = t(a) || {}, n = e === m ? t(w) : H(e) ? [e] : [];
      r({
        ...l,
        key: n
      });
    }
    function F(e) {
      const l = t(a) || {}, n = e.target.value || "";
      let i = J(n, ",", ",", o.maxNum);
      if (n !== i) {
        const v = f.value?.$el?.querySelector("input");
        v && (v.value = i);
      }
      let p = i.split(",");
      p.length === 1 && p[0] === "" && (p = []), r({
        ...l,
        value: p
      });
    }
    function L(e) {
      const l = t(a) || {};
      let n = e.split(/,|\n/);
      r({
        ...l,
        value: n
      });
    }
    function d() {
      const e = t(a) || {}, l = e.value?.filter(Boolean);
      r({
        ...e,
        value: l
      });
    }
    function O(e) {
      d(), o.onBlur?.(e);
    }
    return (e, l) => (h(), z("div", {
      ref_key: "containerRef",
      ref: s,
      class: T(t(S)()),
      style: g(t(k)(I.value)),
      onFocus: l[0] || (l[0] = //@ts-ignore
      (...n) => e.onFocus && e.onFocus(...n)),
      onBlur: l[1] || (l[1] = //@ts-ignore
      (...n) => e.onBlur && e.onBlur(...n))
    }, [
      c(t(D).Compact, { block: "" }, {
        default: B(() => [
          e.options?.length ? (h(), $(t(Z), {
            key: 0,
            style: g(e.style),
            options: U.value,
            value: N.value,
            "allow-clear": !1,
            "dropdown-match-select-width": !1,
            disabled: e.disabled,
            "get-popup-container": () => s.value,
            "onUpdate:value": E
          }, null, 8, ["style", "options", "value", "disabled", "get-popup-container"])) : K("", !0),
          c(t(ee), M(
            t(q)(o, [
              "style",
              "value",
              "onUpdate:value",
              "inputStyle",
              "hasAll",
              "options",
              "onBlur"
            ]),
            {
              ref_key: "inputRef",
              ref: f,
              style: e.inputStyle,
              value: P.value,
              placeholder: j.value,
              onInput: F,
              onBlur: O
            }
          ), {
            suffix: B(() => [
              c(te, {
                _parent: s.value,
                value: R.value,
                disabled: e.disabled,
                placement: o.popoverPlacement,
                "max-num": e.maxNum,
                "onUpdate:value": L,
                onClose: d
              }, null, 8, ["_parent", "value", "disabled", "placement", "max-num"])
            ]),
            _: 1
          }, 16, ["style", "value", "placeholder"])
        ]),
        _: 1
      })
    ], 38));
  }
});
export {
  ge as default
};