import { defineComponent as E, useSlots as P, computed as b, createElementBlock as n, openBlock as t, createCommentVNode as a, createElementVNode as m, normalizeClass as l, renderSlot as v, createBlock as w, createVNode as $, unref as y, withModifiers as p } from "vue";
import k from "../PlIcon16/PlIcon16.vue.js";
import c from "../PlIcon24/PlIcon24.vue.js";
const T = ["data-draggable"], A = /* @__PURE__ */ E({
  inheritAttrs: !1,
  __name: "PlElementListItem",
  props: {
    item: {},
    index: {},
    showDragHandle: { type: Boolean },
    isActive: { type: Boolean },
    isDraggable: { type: Boolean },
    isRemovable: { type: Boolean },
    isExpandable: { type: Boolean },
    isExpanded: { type: Boolean },
    isToggable: { type: Boolean },
    isToggled: { type: Boolean },
    isPinnable: { type: Boolean },
    isPinned: { type: Boolean },
    titleClass: {},
    contentClass: {},
    afterClass: {},
    beforeClass: {}
  },
  emits: ["click", "expand", "toggle", "pin", "remove"],
  setup(o, { emit: f }) {
    const e = o, g = P(), u = b(() => g.content !== void 0), C = b(() => g.after !== void 0), B = b(() => g.before !== void 0), d = f;
    return (s, i) => (t(), n("div", {
      onClick: i[4] || (i[4] = (r) => d("click", r))
    }, [
      B.value ? (t(), n("div", {
        key: 0,
        class: l(o.beforeClass)
      }, [
        v(s.$slots, "before", {
          item: e.item,
          index: e.index
        })
      ], 2)) : a("", !0),
      m("div", {
        class: l([s.$style.root, s.$attrs.class, {
          [s.$style.active]: e.isActive,
          [s.$style.pinned]: e.isPinned,
          [s.$style.opened]: e.isExpanded,
          [s.$style.disabled]: e.isToggled
        }])
      }, [
        m("div", {
          class: l([s.$style.head, o.titleClass, {
            [s.$style.clickable]: u.value
          }]),
          onClick: i[3] || (i[3] = (r) => o.isExpandable && d("expand", e.item, e.index))
        }, [
          e.showDragHandle ? (t(), n("div", {
            key: 0,
            class: l([s.$style.action, s.$style.draggable, { [s.$style.disable]: !e.isDraggable }]),
            "data-draggable": e.isDraggable
          }, [
            $(y(k), { name: "drag-dots" })
          ], 10, T)) : a("", !0),
          o.isExpandable ? (t(), w(y(k), {
            key: 1,
            class: l([s.$style.contentChevron, { [s.$style.opened]: e.isExpanded }]),
            name: "chevron-down"
          }, null, 8, ["class"])) : a("", !0),
          m("div", {
            class: l(s.$style.title)
          }, [
            v(s.$slots, "title", {
              item: e.item,
              index: e.index
            })
          ], 2),
          m("div", {
            class: l([s.$style.actions, s.$style.showOnHover])
          }, [
            e.isToggable ? (t(), n("div", {
              key: 0,
              class: l([s.$style.action, s.$style.clickable, { [s.$style.disable]: !e.isToggable }]),
              onClick: i[0] || (i[0] = p((r) => d("toggle", e.item, e.index), ["stop"]))
            }, [
              $(y(c), {
                name: e.isToggled === !0 ? "view-hide" : "view-show",
                size: "16"
              }, null, 8, ["name"])
            ], 2)) : a("", !0),
            e.isPinnable ? (t(), n("div", {
              key: 1,
              class: l([s.$style.action, s.$style.clickable, {
                [s.$style.disable]: !e.isPinnable,
                [s.$style.activated]: e.isPinned
              }]),
              onClick: i[1] || (i[1] = p((r) => d("pin", e.item, e.index), ["stop"]))
            }, [
              $(y(c), {
                name: "pin",
                size: "16"
              })
            ], 2)) : a("", !0),
            e.isRemovable ? (t(), n("div", {
              key: 2,
              class: l([s.$style.action, s.$style.clickable]),
              onClick: i[2] || (i[2] = p((r) => d("remove", e.item, e.index), ["stop"]))
            }, [
              $(y(k), { name: "close" })
            ], 2)) : a("", !0)
          ], 2)
        ], 2),
        u.value && e.isExpanded ? (t(), n("div", {
          key: 0,
          class: l([s.$style.body, o.contentClass, { [s.$style.disabled]: e.isToggled }])
        }, [
          v(s.$slots, "content", {
            item: e.item,
            index: e.index
          })
        ], 2)) : a("", !0)
      ], 2),
      C.value ? (t(), n("div", {
        key: 1,
        class: l(o.afterClass)
      }, [
        v(s.$slots, "after", {
          item: e.item,
          index: e.index
        })
      ], 2)) : a("", !0)
    ]));
  }
});
export {
  A as default
};
//# sourceMappingURL=PlElementListItem.vue2.js.map
