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

//# sourceMappingURL=PlElementListItem.vue2.js.map