@progress/kendo-vue-grid/drag/GroupingIndicator.mjs

TODO

/**
 * @license
 *-------------------------------------------------------------------------------------------
 * Copyright © 2026 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the package root for more information
 *-------------------------------------------------------------------------------------------
 */
import { defineComponent as o, createVNode as t, ref as r } from "vue";
import { Draggable as a, setRef as c, Icon as i, Keys as s, getRef as l } from "@progress/kendo-vue-common";
import { sortAscSmallIcon as h, sortDescSmallIcon as p, xCircleIcon as m } from "@progress/kendo-svg-icons";
const u = /* @__PURE__ */ o({
  props: {
    title: String,
    dir: String,
    onRemove: Function,
    onSortChange: Function,
    onPress: Function,
    onDrag: Function,
    onRelease: Function
  },
  mounted() {
    this.element = l(this, "indicatorContainer"), this.element && (this.draggable = this.$refs.draggable);
  },
  methods: {
    press(e) {
      this.element && this.$emit("press", e, this.element);
    },
    drag(e) {
      this.element && this.$emit("drag", e, this.element);
    },
    release(e) {
      this.element && this.$emit("release", e, this.element);
    },
    sortChange(e) {
      e.preventDefault();
      const n = this.$props.dir === "asc" ? "desc" : "asc";
      this.$emit("sortChange", e, n);
    },
    handleKeyDown(e) {
      (e.keyCode === s.delete || e.keyCode === s.backspace) && (e.preventDefault(), e.stopPropagation(), this.$emit("remove", e));
    },
    groupRemove(e) {
      e.preventDefault(), this.$emit("remove", e);
    }
  },
  setup() {
    return {
      indicatorContainerRef: r(null)
    };
  },
  render() {
    return t(a, {
      onPress: this.press,
      onDrag: this.drag,
      onRelease: this.release,
      ref: "draggable"
    }, {
      default: () => [t("div", {
        class: "k-chip",
        ref: c(this, "indicatorContainer"),
        tabindex: "0",
        role: "button",
        onClick: this.sortChange,
        onKeydown: this.handleKeyDown,
        style: {
          touchAction: "none"
        }
      }, [t(i, {
        name: "sort-" + this.$props.dir + "-small",
        class: "k-chip-icon",
        icon: this.$props.dir === "asc" ? h : p
      }, null), t("span", {
        class: "k-chip-content"
      }, [t("span", {
        class: "k-chip-label"
      }, [this.$props.title])]), t("span", {
        class: "k-chip-actions"
      }, [t("span", {
        class: "k-chip-action k-chip-remove-action",
        tabindex: -1,
        onClick: this.groupRemove
      }, [t(i, {
        name: "x-circle",
        icon: m
      }, null)])])])]
    });
  }
});
export {
  u as GroupingIndicator
};