@everchron/ec-shards 19.11.4 → 19.11.6

package/dist/ec-shards.js

@@ -3381,6 +3381,10 @@ var Vr = /*#__PURE__*/ V(zr, [["render", Br], ["__scopeId", "data-v-2f0cb806"]])
 		},
 		icon: String,
 		badgeIcon: String,
+		badge: {
+			type: [Boolean, Object],
+			default: !1
+		},
 		active: Boolean,
 		highlighted: Boolean,
 		loading: Boolean,
@@ -3422,6 +3426,75 @@ var Vr = /*#__PURE__*/ V(zr, [["render", Br], ["__scopeId", "data-v-2f0cb806"]])
 		},
 		badgeIconSize() {
 			return this.size == "xsml" ? "8" : this.size == "sml" ? "10" : this.size == "md" ? "12" : this.size == "lg" ? "14" : "12";
+		},
+		badgeSize() {
+			return this.size == "xsml" ? 4 : this.size == "sml" || this.size == "md" ? 6 : this.size == "lg" ? 8 : 6;
+		},
+		badgePosition() {
+			let e = this.size || "md";
+			return !this.iconOnly && this.icon ? {
+				xsml: {
+					top: 2,
+					left: 12
+				},
+				sml: {
+					top: 4,
+					left: 14
+				},
+				md: {
+					top: 6,
+					left: 18
+				},
+				lg: {
+					top: 8,
+					left: 26
+				}
+			}[e] : this.iconOnly ? {
+				xsml: {
+					top: 1,
+					right: 1
+				},
+				sml: {
+					top: 4,
+					right: 4
+				},
+				md: {
+					top: 6,
+					right: 6
+				},
+				lg: {
+					top: 8,
+					right: 8
+				}
+			}[e] : {
+				xsml: {
+					top: 1,
+					right: 1
+				},
+				sml: {
+					top: 1,
+					right: 1
+				},
+				md: {
+					top: 1,
+					right: 1
+				},
+				lg: {
+					top: 4,
+					right: 4
+				}
+			}[e];
+		},
+		badgeStyle() {
+			let e = `${this.badgeSize}px`, t = {
+				width: e,
+				height: e
+			}, { top: n, left: r, right: i } = this.badgePosition;
+			if (t.top = `${n}px`, r != null && (t.left = `${r}px`), i != null && (t.right = `${i}px`), this.badge && typeof this.badge == "object") {
+				let { positionTop: e, positionRight: n, positionLeft: r, color: i } = this.badge;
+				e != null && (t.top = e), r != null && (t.left = r, t.right = "auto"), n != null && (t.right = n, t.left = "auto"), i != null && (t.background = i);
+			}
+			return t;
 		}
 	},
 	mounted() {
@@ -3481,6 +3554,11 @@ function Xr(e, t, n, r, i, a) {
 		}, null, 8, ["type", "size"])) : s("", !0),
 		n.iconOnly ? s("", !0) : k(e.$slots, "default", { key: 2 }, void 0, !0),
 		n.shortcut && !n.iconOnly ? (T(), c("span", Kr, N(n.shortcut), 1)) : s("", !0),
+		n.badge ? (T(), c("div", {
+			key: 4,
+			class: "badge",
+			style: S(a.badgeStyle)
+		}, null, 4)) : s("", !0),
 		f(d, {
 			inset: n.focusInset,
 			danger: n.type == "danger" || n.type == "danger-vibrant"
@@ -3543,13 +3621,18 @@ function Xr(e, t, n, r, i, a) {
 		}, null, 8, ["type", "size"])) : s("", !0),
 		n.iconOnly ? s("", !0) : k(e.$slots, "default", { key: 2 }, void 0, !0),
 		n.shortcut && !n.iconOnly ? (T(), c("span", Jr, N(n.shortcut), 1)) : s("", !0),
+		n.badge ? (T(), c("div", {
+			key: 4,
+			class: "badge",
+			style: S(a.badgeStyle)
+		}, null, 4)) : s("", !0),
 		f(d, {
 			inset: n.focusInset,
 			danger: n.type == "danger" || n.type == "danger-vibrant"
 		}, null, 8, ["inset", "danger"])
 	], 42, qr));
 }
-var X = /*#__PURE__*/ V(Wr, [["render", Xr], ["__scopeId", "data-v-b7e356a6"]]), Zr = {
+var X = /*#__PURE__*/ V(Wr, [["render", Xr], ["__scopeId", "data-v-c54b96de"]]), Zr = {
 	name: "ecs-popover-list-item",
 	emits: [
 		"click",
@@ -7582,6 +7665,10 @@ var Nc = /*#__PURE__*/ V(vc, [["render", Mc]]), Pc = {
 		preventUnusableColors: {
 			type: Boolean,
 			default: !1
+		},
+		noBackground: {
+			type: Boolean,
+			default: !1
 		}
 	},
 	computed: {
@@ -7618,13 +7705,13 @@ function Fc(e, t, n, r, i, a) {
 			"preventUnusableColors"
 		])]),
 		default: I(() => [l("button", {
-			class: b(["ecs-color-picker-input-button", a.sizeClass]),
+			class: b(["ecs-color-picker-input-button", [a.sizeClass, { "ecs-color-picker-input-button-no-background": n.noBackground }]]),
 			style: S(a.selectedColorStyle)
 		}, [l("span", null, N(a.selectedColorName), 1)], 6)]),
 		_: 1
 	});
 }
-var Ic = /*#__PURE__*/ V(Pc, [["render", Fc], ["__scopeId", "data-v-08aaa823"]]), Lc = {
+var Ic = /*#__PURE__*/ V(Pc, [["render", Fc], ["__scopeId", "data-v-1eb48d38"]]), Lc = {
 	name: "ecs-data-card",
 	components: {
 		EcsIcon: H,
@@ -13277,7 +13364,7 @@ var $p = /*#__PURE__*/ V(Zp, [["render", Qp], ["__scopeId", "data-v-f66945cb"]])
 	name: "ecs-inline-edit",
 	emits: [
 		"save",
-		"cancel",
+		"undo",
 		"edit",
 		"update:editing"
 	],
@@ -13307,6 +13394,10 @@ var $p = /*#__PURE__*/ V(Zp, [["render", Qp], ["__scopeId", "data-v-f66945cb"]])
 			type: Boolean,
 			default: !1
 		},
+		modified: {
+			type: Boolean,
+			default: !1
+		},
 		triggerOnClick: {
 			type: Boolean,
 			default: !0
@@ -13315,15 +13406,6 @@ var $p = /*#__PURE__*/ V(Zp, [["render", Qp], ["__scopeId", "data-v-f66945cb"]])
 			type: Boolean,
 			default: !0
 		},
-		clickOutside: {
-			type: String,
-			default: "cancel",
-			validator: (e) => [
-				"cancel",
-				"save",
-				"none"
-			].includes(e)
-		},
 		align: {
 			type: String,
 			default: "right",
@@ -13341,6 +13423,9 @@ var $p = /*#__PURE__*/ V(Zp, [["render", Qp], ["__scopeId", "data-v-f66945cb"]])
 		actionsLabel() {
 			return "Edit actions";
 		},
+		showActions() {
+			return this.isEditing && this.modified;
+		},
 		popperPlacement() {
 			return this.align === "left" ? "bottom-start" : "bottom-end";
 		}
@@ -13349,7 +13434,7 @@ var $p = /*#__PURE__*/ V(Zp, [["render", Qp], ["__scopeId", "data-v-f66945cb"]])
 		editing(e) {
 			this.isEditing = e;
 		},
-		isEditing(e) {
+		showActions(e) {
 			e ? this.$nextTick(() => this.createActionsPopper()) : this.destroyActionsPopper();
 		},
 		align() {
@@ -13358,7 +13443,7 @@ var $p = /*#__PURE__*/ V(Zp, [["render", Qp], ["__scopeId", "data-v-f66945cb"]])
 	},
 	mounted() {
 		this.isEditing && this.$nextTick(() => {
-			this.createActionsPopper(), this.focusFirstEditable();
+			this.showActions && this.createActionsPopper(), this.focusFirstEditable();
 		});
 	},
 	beforeUnmount() {
@@ -13373,11 +13458,11 @@ var $p = /*#__PURE__*/ V(Zp, [["render", Qp], ["__scopeId", "data-v-f66945cb"]])
 				this.setEditing(!1);
 			}, this.saveDelay)));
 		},
-		cancel() {
-			this.disabled || (this.clearCloseTimeout(), this.$emit("cancel"), this.setEditing(!1));
+		undo() {
+			this.disabled || this.$emit("undo");
 		},
 		onClickOutside(e) {
-			!this.isEditing || this.disabled || this.loading || this.$refs.actionsEl && this.$refs.actionsEl.contains(e?.target) || (this.clickOutside === "cancel" ? this.cancel() : this.clickOutside === "save" && this.confirm());
+			!this.isEditing || this.disabled || this.loading || this.$refs.actionsEl && this.$refs.actionsEl.contains(e?.target) || this.confirm();
 		},
 		setEditing(e) {
 			this.isEditing = e, this.$emit("update:editing", e);
@@ -13431,7 +13516,7 @@ function im(e, n, i, a, u, d) {
 		default: I(() => [u.isEditing ? (T(), c("div", {
 			key: "edit",
 			class: "ecs-inline-edit-edit",
-			onKeydown: n[0] ||= L(R((...e) => d.cancel && d.cancel(...e), ["stop"]), ["esc"])
+			onKeydown: n[0] ||= L(R((...e) => d.undo && d.undo(...e), ["stop"]), ["esc"])
 		}, [l("div", nm, [k(e.$slots, "edit", {}, void 0, !0)], 512)], 32)) : (T(), o(p, {
 			key: "view",
 			class: "ecs-inline-edit-view",
@@ -13448,39 +13533,24 @@ function im(e, n, i, a, u, d) {
 			"onKeydown"
 		]))]),
 		_: 3
-	}, 8, ["onAfterEnter"]), (T(), o(t, { to: "body" }, [u.isEditing ? (T(), c("div", {
+	}, 8, ["onAfterEnter"]), (T(), o(t, { to: "body" }, [d.showActions ? (T(), c("div", {
 		key: 0,
 		ref: "actionsEl",
 		class: "ecs-inline-edit-actions",
 		role: "group",
-		"aria-label": d.actionsLabel,
-		onKeydown: n[1] ||= L(R((...e) => d.cancel && d.cancel(...e), ["stop"]), ["esc"])
+		"aria-label": d.actionsLabel
 	}, [f(m, {
-		onClick: d.confirm,
+		onClick: R(d.undo, ["stop"]),
 		type: "secondary",
 		size: "sml",
-		icon: "check",
+		icon: "undo",
 		"icon-only": "",
-		loading: i.loading,
 		disabled: i.disabled,
-		title: "Save",
-		"aria-label": "Save changes"
-	}, null, 8, [
-		"onClick",
-		"loading",
-		"disabled"
-	]), f(m, {
-		onClick: R(d.cancel, ["stop"]),
-		type: "secondary",
-		size: "sml",
-		icon: "close",
-		"icon-only": "",
-		disabled: i.loading || i.disabled,
-		title: "Cancel",
-		"aria-label": "Revert changes"
-	}, null, 8, ["onClick", "disabled"])], 40, rm)) : s("", !0)]))], 2)), [[h, d.onClickOutside]]);
+		title: "Undo",
+		"aria-label": "Undo changes"
+	}, null, 8, ["onClick", "disabled"])], 8, rm)) : s("", !0)]))], 2)), [[h, d.onClickOutside]]);
 }
-var am = /*#__PURE__*/ V(tm, [["render", im], ["__scopeId", "data-v-ecc56dd7"]]), om = {
+var am = /*#__PURE__*/ V(tm, [["render", im], ["__scopeId", "data-v-00fa7dec"]]), om = {
 	name: "ecs-input-group-addon",
 	components: { EcsIcon: H },
 	props: {