morya-ui 0.1.1

package/dist/split-button/style.js

@@ -0,0 +1,5 @@
+import '../theme/styles.css'
+import '../styles/base.css'
+import '../components/Button/styles.css'
+import '../components/Icon/styles.css'
+import '../components/SplitButton/styles.css'

package/dist/splitter/index.js

@@ -0,0 +1,186 @@
+import { n as e } from "../locale-DYGhxekd.js";
+import "./style.js";
+import { Comment as t, Fragment as n, Text as r, computed as i, createBlock as a, createCommentVNode as o, createElementBlock as s, createElementVNode as c, defineComponent as l, normalizeClass as u, normalizeStyle as d, onBeforeUnmount as ee, openBlock as f, ref as p, renderSlot as m, resolveDynamicComponent as h, unref as g, useSlots as _, watch as v } from "vue";
+//#region src/components/Splitter/size.ts
+function y(e, t = "percent") {
+	return e == null ? t : typeof e == "string" ? "px" : e <= 1 ? "ratio" : "percent";
+}
+function b(e, t, n) {
+	if (typeof e == "string") {
+		let t = Number.parseFloat(e);
+		return Number.isFinite(t) ? t : 0;
+	}
+	return n === "ratio" ? e * t : e / 100 * t;
+}
+function te(e, t, n) {
+	return t <= 0 ? n === "px" ? "0px" : 0 : n === "px" ? `${Math.round(e)}px` : Number(n === "ratio" ? (e / t).toFixed(4) : (e / t * 100).toFixed(1));
+}
+function ne(e, t) {
+	return t === "px" || typeof e == "string" ? typeof e == "string" ? e : `${e}px` : t === "ratio" ? `${e * 100}%` : `${e}%`;
+}
+function x(e, t, n, r) {
+	let i = Math.min(n, r);
+	return Math.min(i, Math.max(Math.min(t, i), e));
+}
+//#endregion
+//#region src/components/Splitter/Splitter.vue?vue&type=script&setup=true&lang.ts
+var S = ["aria-orientation"], re = [
+	"tabindex",
+	"aria-orientation",
+	"aria-valuenow",
+	"aria-valuemin",
+	"aria-valuemax",
+	"aria-disabled",
+	"aria-label"
+], C = /* @__PURE__ */ l({
+	__name: "Splitter",
+	props: {
+		layout: {},
+		direction: {},
+		size: {},
+		defaultSize: { default: 50 },
+		min: {},
+		max: {},
+		disabled: {
+			type: Boolean,
+			default: !1
+		},
+		resizeTriggerSize: { default: 6 },
+		pane1Class: {},
+		pane1Style: {},
+		pane2Class: {},
+		pane2Style: {}
+	},
+	emits: [
+		"update:size",
+		"resize",
+		"drag-start",
+		"drag-move",
+		"drag-end"
+	],
+	setup(l, { emit: C }) {
+		let w = l, T = C, E = e(), D = _(), O = p(null), k = p(!1), A = i(() => w.layout ?? w.direction ?? "horizontal"), j = i(() => A.value === "vertical"), M = i(() => w.size !== void 0), N = i(() => y(w.size ?? w.defaultSize, "percent")), P = i(() => w.min === void 0 ? N.value === "ratio" ? .1 : N.value === "px" ? "40px" : 10 : w.min), F = i(() => {
+			if (w.max !== void 0) return w.max;
+			if (N.value === "ratio") return .9;
+			if (N.value !== "px") return 90;
+		}), I = p(w.defaultSize), L = i(() => M.value ? w.size : I.value);
+		v(() => w.size, (e) => {
+			e !== void 0 && !k.value && (I.value = e);
+		}), v(() => w.defaultSize, (e) => {
+			M.value || (I.value = e);
+		});
+		let R = 0, z = 0, B = 0;
+		function V(e) {
+			let i = [];
+			for (let a of e) if (a.type !== t && !(a.type === r && !String(a.children ?? "").trim())) {
+				if (a.type === n && Array.isArray(a.children)) {
+					i.push(...V(a.children));
+					continue;
+				}
+				i.push(a);
+			}
+			return i;
+		}
+		let H = i(() => {
+			let e = V(D.default?.() ?? []);
+			return [e[0] ?? null, e[1] ?? null];
+		});
+		function U() {
+			let e = O.value;
+			if (!e) return 0;
+			let t = e.getBoundingClientRect(), n = j.value ? t.height : t.width;
+			return Math.max(0, n - w.resizeTriggerSize);
+		}
+		function W(e) {
+			return typeof e == "string" || e == null ? void 0 : e;
+		}
+		let G = i(() => ({
+			flex: `0 0 ${ne(L.value, N.value)}`,
+			...W(w.pane1Style)
+		})), K = i(() => W(w.pane2Style)), q = i(() => ({}));
+		function J(e) {
+			e !== L.value && (I.value = e, T("update:size", e), T("resize", e));
+		}
+		function Y(e, t) {
+			let n = N.value;
+			if (t <= 0) return;
+			let r = b(P.value, t, y(P.value, n)), i = F.value;
+			J(te(x(e, r, i === void 0 && n === "px" ? t : b(i ?? (n === "ratio" ? 1 : 100), t, y(i ?? 100, n)), t), t, n));
+		}
+		function X(e) {
+			if (!k.value || B <= 0 || w.disabled) return;
+			let t = j.value ? e.clientY : e.clientX;
+			Y(z + (t - R), B), T("drag-move", e);
+		}
+		function Z(e) {
+			k.value && (k.value = !1, window.removeEventListener("mousemove", X, !0), window.removeEventListener("mouseup", Q, !0), window.removeEventListener("pointermove", X, !0), window.removeEventListener("pointerup", Q, !0), document.body.style.removeProperty("cursor"), document.body.style.removeProperty("user-select"), e && T("drag-end", e));
+		}
+		function Q(e) {
+			Z(e);
+		}
+		function $(e) {
+			w.disabled || "button" in e && e.button > 0 || O.value && (e.preventDefault(), B = U(), !(B <= 0) && (R = j.value ? e.clientY : e.clientX, z = b(L.value, B, N.value), k.value = !0, document.body.style.cursor = j.value ? "row-resize" : "col-resize", document.body.style.userSelect = "none", T("drag-start", e), window.addEventListener("mousemove", X, !0), window.addEventListener("mouseup", Q, !0), window.addEventListener("pointermove", X, !0), window.addEventListener("pointerup", Q, !0)));
+		}
+		function ie(e) {
+			if (w.disabled) return;
+			let t = N.value, n = U();
+			n <= 0 && t !== "px" && (n = 100);
+			let r = b(L.value, n, t), i = e.shiftKey ? n * .05 : n * .01, a = (t) => {
+				e.preventDefault(), Y(r + t, n);
+			};
+			if (j.value) {
+				e.key === "ArrowUp" ? a(-i) : e.key === "ArrowDown" && a(i);
+				return;
+			}
+			e.key === "ArrowLeft" ? a(-i) : e.key === "ArrowRight" && a(i);
+		}
+		let ae = i(() => {
+			let e = N.value, t = L.value;
+			return e === "px" && typeof t == "string" ? Math.round(Number.parseFloat(t)) : e === "ratio" && typeof t == "number" ? Math.round(t * 100) : typeof t == "number" ? Math.round(t) : 0;
+		}), oe = i(() => {
+			let e = P.value;
+			return typeof e == "string" ? Math.round(Number.parseFloat(e)) : N.value === "ratio" ? Math.round(e * 100) : Math.round(e);
+		}), se = i(() => {
+			let e = F.value;
+			if (e !== void 0) return typeof e == "string" ? Math.round(Number.parseFloat(e)) : N.value === "ratio" ? Math.round(e * 100) : Math.round(e);
+		});
+		return ee(() => {
+			Z();
+		}), (e, t) => (f(), s("div", {
+			ref_key: "root",
+			ref: O,
+			class: u(["m-splitter", [`m-splitter--${A.value}`, {
+				"m-splitter--dragging": k.value,
+				"m-splitter--disabled": l.disabled
+			}]]),
+			style: d({ "--m-splitter-trigger-size": `${l.resizeTriggerSize}px` }),
+			"aria-orientation": j.value ? "vertical" : "horizontal"
+		}, [
+			c("div", {
+				class: u(["m-splitter__panel", l.pane1Class]),
+				style: d(G.value)
+			}, [g(D).panel1 ? m(e.$slots, "panel1", {}, void 0, void 0, 0) : g(D)[1] ? m(e.$slots, "1", {}, void 0, void 0, 1) : H.value[0] ? (f(), a(h(H.value[0]), { key: 2 })) : o("", !0)], 6),
+			c("div", {
+				class: "m-splitter__gutter",
+				role: "separator",
+				tabindex: l.disabled ? -1 : 0,
+				"aria-orientation": j.value ? "horizontal" : "vertical",
+				"aria-valuenow": ae.value,
+				"aria-valuemin": oe.value,
+				"aria-valuemax": se.value,
+				"aria-disabled": l.disabled || void 0,
+				"aria-label": j.value ? g(E).resizeVertical : g(E).resizeHorizontal,
+				style: d(q.value),
+				onPointerdown: $,
+				onMousedown: $,
+				onKeydown: ie
+			}, [m(e.$slots, "resize-trigger")], 44, re),
+			c("div", {
+				class: u(["m-splitter__panel wk-splitter__panel--fill", l.pane2Class]),
+				style: d(K.value)
+			}, [g(D).panel2 ? m(e.$slots, "panel2", {}, void 0, void 0, 0) : g(D)[2] ? m(e.$slots, "2", {}, void 0, void 0, 1) : H.value[1] ? (f(), a(h(H.value[1]), { key: 2 })) : o("", !0)], 6)
+		], 14, S));
+	}
+});
+//#endregion
+export { C as MSplitter };