aibox-custom-component-packages 0.0.7 → 0.0.9

package/es/chunks/CustomToggle.BxxsaD-W.js

@@ -0,0 +1,181 @@
+import { t as e } from "./withinstall.dLh4K-0g.js";
+import { t } from "./_plugin-vue_export-helper.Ct3qlEzt.js";
+import { Fragment as n, computed as r, createBlock as i, createCommentVNode as a, createElementBlock as o, createElementVNode as s, createTextVNode as c, createVNode as l, nextTick as u, normalizeClass as d, normalizeStyle as f, onMounted as p, openBlock as m, ref as h, renderList as g, toDisplayString as _, unref as v, withCtx as y } from "vue";
+import { ElDropdown as b, ElDropdownItem as x, ElDropdownMenu as S, ElIcon as C } from "element-plus";
+import { IconZuoCopy as w } from "color-message-aibox-vue";
+import { useRoute as T } from "vue-router";
+import { emitsMap as E } from "color-star-custom-methods";
+import '../assets/CustomToggle.css';//#region components/CustomToggle/config.js
+var ee = (e) => `${e}-custom-toggle`, D = [
+	"id",
+	"data-option-value",
+	"onClick"
+], O = {
+	key: 0,
+	class: "order-number fz-12 text-center mg-r-10 pd-l-8 pd-r-8"
+}, k = {
+	key: 1,
+	class: "divider"
+}, A = { class: "toggle-item toggle-action flex items-center justify-center weight-500" }, j = { class: "dropdown-label" }, M = e(/* @__PURE__ */ t(/* @__PURE__ */ Object.assign({ name: "CustomToggle" }, {
+	__name: "layout",
+	props: {
+		options: {
+			type: Array,
+			default: () => []
+		},
+		modelValue: {
+			type: [
+				String,
+				Number,
+				Object
+			],
+			default: null
+		},
+		maxVisible: {
+			type: Number,
+			default: void 0
+		},
+		fieldMapping: {
+			type: Object,
+			default: () => ({
+				value: "value",
+				label: "label"
+			})
+		},
+		showOrderNumber: {
+			type: Boolean,
+			default: !1
+		},
+		styleType: {
+			type: [Number, String],
+			default: 1
+		}
+	},
+	emits: [E.updateModelValue, E.change],
+	setup(e, { emit: t }) {
+		let M = e, N = t, P = h(null), F = T(), I = r(() => ee(F.name)), L = () => {
+			try {
+				let e = sessionStorage.getItem(I.value);
+				if (e && M.options.length > 0 && M.options.some((t, n) => K(t, n) === e)) return e;
+			} catch {
+				return null;
+			}
+			return null;
+		}, R = (e) => {
+			sessionStorage.setItem(I.value, e);
+		}, z = [], B = r(() => M.maxVisible === void 0 ? M.options.length : M.maxVisible), V = r(() => W.value.length > 0);
+		r(() => W.value.length);
+		let H = r(() => {
+			if (!M.modelValue || M.options.length <= B.value) {
+				let e = M.options.slice(0, B.value);
+				return z = e, e;
+			}
+			let e = M.options.findIndex((e, t) => K(e, t) === M.modelValue);
+			if (e === -1) {
+				let e = M.options.slice(0, B.value);
+				return z = e, e;
+			}
+			if (z.map((e, t) => K(e, t)).includes(M.modelValue) && z.length > 0) return z;
+			let t = Math.max(0, e - B.value + 1), n = Math.min(M.options.length, t + B.value), r = M.options.slice(t, n);
+			return z = r, r;
+		}), U = r(() => `${100 / B.value}%`), W = r(() => {
+			let e = new Set(H.value.map((e, t) => K(e, t)));
+			return M.options.filter((t, n) => {
+				let r = K(t, n);
+				return !e.has(r);
+			});
+		});
+		r(() => M.options.slice(0, B.value));
+		let G = () => {
+			if (!M.options?.length) return;
+			let e = L();
+			if (e !== null) {
+				$(e);
+				return;
+			}
+			let t = M.options[0];
+			$(K(t, 0));
+		}, K = (e, t) => {
+			if (typeof e == "object" && e) {
+				let n = M.fieldMapping.value;
+				return e[n] === void 0 ? t : e[n];
+			}
+			return e;
+		}, q = (e) => {
+			if (typeof e == "object" && e) {
+				let t = M.fieldMapping.label, n = M.fieldMapping.value;
+				return e[t] || e[n] || e;
+			}
+			return e;
+		}, J = (e, t) => {
+			let n = K(e, t);
+			return M.options.findIndex((e, t) => K(e, t) === n) + 1;
+		}, Y = (e, t) => K(e, t) === M.modelValue, X = (e, t) => {
+			if (t >= H.value.length - 1 || Y(e, t)) return !1;
+			let n = H.value.findIndex((e, t) => Y(e, t));
+			return !(n === -1 || t === n - 1);
+		}, Z = (e, t) => {
+			$(K(e, t));
+		}, Q = (e) => {
+			$(e), setTimeout(() => {
+				te(e);
+			}, 50);
+		}, te = (e) => {
+			let t = `toggle-option-${e}`, n = document.getElementById(t);
+			n && n.scrollIntoView({
+				behavior: "smooth",
+				block: "nearest",
+				inline: "center"
+			});
+		}, $ = (e) => {
+			R(e), N(E.updateModelValue, e), u(() => {
+				N(E.change, e);
+			});
+		};
+		return p(() => {
+			G();
+		}), (t, r) => (m(), o("div", { class: d(["toggle-container flex w-full relative", `toggle-style-${e.styleType}`]) }, [s("div", {
+			ref_key: "optionsContainer",
+			ref: P,
+			class: "visible-options flex-1 overflow-x-auto overflow-y-hidden relative flex"
+		}, [(m(!0), o(n, null, g(H.value, (e, t) => (m(), o("div", {
+			key: K(e, t),
+			id: `toggle-option-${K(e, t)}`,
+			"data-option-value": K(e, t),
+			class: d(["toggle-item pointer text-center flex items-center justify-center ellipsis-1 relative pointer", {
+				active: Y(e, t),
+				"first-active": Y(e, t) && t === 0,
+				"last-active": Y(e, t) && t === H.value.length - 1
+			}]),
+			style: f({ width: U.value }),
+			onClick: (n) => Z(e, t)
+		}, [
+			M.showOrderNumber ? (m(), o("div", O, _(J(e, t)), 1)) : a("", !0),
+			c(" " + _(q(e)) + " ", 1),
+			X(e, t) ? (m(), o("span", k, "|")) : a("", !0)
+		], 14, D))), 128))], 512), V.value ? (m(), i(v(b), {
+			key: 0,
+			trigger: "click",
+			onCommand: Q
+		}, {
+			dropdown: y(() => [l(v(S), null, {
+				default: y(() => [(m(!0), o(n, null, g(W.value, (e, t) => (m(), i(v(x), {
+					key: K(e, t),
+					command: K(e, t),
+					class: d({ "is-active": Y(e, t) })
+				}, {
+					default: y(() => [s("span", j, _(q(e)), 1)]),
+					_: 2
+				}, 1032, ["command", "class"]))), 128))]),
+				_: 1
+			})]),
+			default: y(() => [s("div", A, [l(v(C), null, {
+				default: y(() => [l(v(w))]),
+				_: 1
+			})])]),
+			_: 1
+		})) : a("", !0)], 2));
+	}
+}), [["__scopeId", "data-v-380c0444"]]));
+//#endregion
+export { M as t };

package/es/chunks/DialogContainer.DL7aTMDS.js

@@ -0,0 +1,129 @@
+import { t as e } from "./withinstall.dLh4K-0g.js";
+import { computed as t, createBlock as n, createCommentVNode as r, createElementVNode as i, nextTick as a, normalizeClass as o, onBeforeUnmount as s, openBlock as c, ref as l, renderSlot as u, unref as d, withCtx as f } from "vue";
+import { ElDialog as p } from "element-plus";
+import '../assets/DialogContainer.css';//#region components/DialogContainer/useDialog.js
+var m = (e = l(!1)) => {
+	let t = l(null), n = l(null);
+	return {
+		dialogRef: t,
+		formRef: n,
+		showDialog: () => {
+			t.value.showDialog();
+		},
+		hideDialog: () => {
+			e.value = !1, t.value.hideDialog();
+		},
+		resetDialog: () => {
+			e.value = !1, n.value && a(() => {
+				n.value.resetFields();
+			});
+		}
+	};
+}, h = { class: "dialog-body" }, g = e({
+	__name: "DialogContainer",
+	props: {
+		width: {
+			type: String,
+			default: "720px"
+		},
+		title: {
+			type: String,
+			default: ""
+		},
+		closable: {
+			type: Boolean,
+			default: !0
+		},
+		destroyOnclose: {
+			type: Boolean,
+			default: !1
+		},
+		customClass: {
+			type: String,
+			default: ""
+		},
+		draggable: {
+			type: Boolean,
+			default: !0
+		},
+		modal: {
+			type: Boolean,
+			default: !0
+		},
+		fullscreen: {
+			type: Boolean,
+			default: !1
+		}
+	},
+	emits: [
+		"open",
+		"opened",
+		"close",
+		"closed"
+	],
+	setup(e, { expose: m, emit: g }) {
+		let _ = g, v = e, y = l(!1), b = l(!1), x = () => {
+			y.value = !0, a(() => {
+				b.value = !0;
+			});
+		}, S = () => {
+			b.value = !1;
+		}, C = t(() => {
+			let e = ["dialog-container"];
+			return v.customClass && e.push(v.customClass), v.fullscreen || e.push("not-fullscreen"), e.join(" ");
+		}), w = () => {
+			_("open");
+		}, T = () => {
+			_("opened");
+		}, E = () => {
+			_("close");
+		}, D = () => {
+			_("closed"), a(() => {
+				y.value = !1;
+			});
+		};
+		return s(() => {
+			y.value = !1;
+		}), m({
+			showDialog: x,
+			hideDialog: S
+		}), (t, a) => y.value ? (c(), n(d(p), {
+			key: 0,
+			ref: "Dialog",
+			modelValue: b.value,
+			"onUpdate:modelValue": a[0] ||= (e) => b.value = e,
+			width: e.width,
+			title: e.title,
+			"append-to-body": "",
+			modal: e.modal,
+			"close-on-click-modal": !1,
+			"close-on-press-escape": !1,
+			"show-close": e.closable,
+			"destroy-on-close": e.destroyOnclose,
+			class: o(C.value),
+			draggable: e.draggable,
+			fullscreen: e.fullscreen,
+			onOpen: w,
+			onOpened: T,
+			onClose: E,
+			onClosed: D
+		}, {
+			header: f(() => [u(t.$slots, "title")]),
+			footer: f(() => [u(t.$slots, "footer")]),
+			default: f(() => [i("div", h, [u(t.$slots, "default")])]),
+			_: 3
+		}, 8, [
+			"modelValue",
+			"width",
+			"title",
+			"modal",
+			"show-close",
+			"destroy-on-close",
+			"class",
+			"draggable",
+			"fullscreen"
+		])) : r("", !0);
+	}
+});
+//#endregion
+export { m as n, g as t };