@well-insight/ui 0.1.7 → 0.1.9

package/dist/label/style.js

@@ -0,0 +1,3 @@
+import '../theme/styles.css'
+import '../styles/base.css'
+import '../components/Label/styles.css'

package/dist/lastPointer-CRxcUqdd.js

@@ -0,0 +1,20 @@
+//#region src/shared/lastPointer.ts
+var e = {
+	x: 0,
+	y: 0
+}, t = !1;
+function n(t) {
+	e.x = t.clientX, e.y = t.clientY;
+}
+function r() {
+	t || typeof window > "u" || (t = !0, e.x = window.innerWidth / 2, e.y = window.innerHeight / 2, window.addEventListener("pointerdown", n, !0), window.addEventListener("mousedown", n, !0));
+}
+function i() {
+	return r(), {
+		x: e.x,
+		y: e.y
+	};
+}
+typeof window < "u" && r();
+//#endregion
+export { i as t };

package/dist/layout/index.js

@@ -0,0 +1,398 @@
+import { n as e } from "../responsive-BLgfEhDG.js";
+import { t } from "../Scrollbar-D-bR2noX.js";
+import { n } from "../locale-CYkJyRd1.js";
+import "./style.js";
+import { computed as r, createBlock as i, createCommentVNode as a, createElementBlock as o, createElementVNode as s, defineComponent as c, inject as l, mergeProps as u, normalizeClass as d, normalizeStyle as f, openBlock as p, provide as m, ref as h, renderSlot as g, unref as _, useTemplateRef as v, watch as y, withCtx as b } from "vue";
+//#region src/components/Layout/context.ts
+var x = Symbol("wiLayout"), S = /* @__PURE__ */ c({
+	name: "WiLayout",
+	__name: "Layout",
+	props: {
+		embedded: {
+			type: Boolean,
+			default: !1
+		},
+		position: { default: "static" },
+		hasSider: {
+			type: Boolean,
+			default: !1
+		},
+		siderPlacement: { default: "left" },
+		nativeScrollbar: {
+			type: Boolean,
+			default: !0
+		},
+		scrollbarProps: {},
+		contentClass: {},
+		contentStyle: {}
+	},
+	emits: ["scroll"],
+	setup(e, { expose: n, emit: a }) {
+		let s = e, c = a;
+		m(x, {
+			get hasSider() {
+				return s.hasSider;
+			},
+			get siderPlacement() {
+				return s.siderPlacement;
+			}
+		});
+		let l = v("scrollEl"), h = v("scrollbarRef"), _ = r(() => [
+			"wi-layout",
+			`wi-layout--${s.position}-positioned`,
+			{
+				"wi-layout--embedded": s.embedded,
+				"wi-layout--has-sider": s.hasSider,
+				"wi-layout--sider-right": s.hasSider && s.siderPlacement === "right",
+				"wi-layout--custom-scrollbar": !s.nativeScrollbar
+			}
+		]), y = r(() => {
+			if (!s.hasSider) return s.contentStyle;
+			let e = {
+				display: "flex",
+				flexWrap: "nowrap",
+				width: "100%",
+				flexDirection: s.siderPlacement === "right" ? "row-reverse" : "row"
+			};
+			return [s.contentStyle, e];
+		}), S = r(() => [
+			"wi-layout__scroll",
+			s.contentClass,
+			{ "wi-layout__scroll--has-sider": s.hasSider }
+		]), C = r(() => {
+			let e = s.scrollbarProps?.viewClass, t = S.value.filter(Boolean);
+			return e == null || e === "" ? t : Array.isArray(e) ? [...t, ...e] : [...t, e];
+		}), w = r(() => {
+			let e = s.scrollbarProps?.viewStyle;
+			return e == null || e === "" ? y.value : [y.value, e];
+		});
+		function T(e, t) {
+			if (s.nativeScrollbar) {
+				let n = l.value;
+				if (!n) return;
+				typeof e == "number" ? n.scrollTo(e, t ?? 0) : n.scrollTo(e);
+				return;
+			}
+			let n = h.value;
+			n && (typeof e == "number" ? n.scrollTo(e, t ?? 0) : n.scrollTo(e));
+		}
+		function E(e) {
+			c("scroll", e);
+		}
+		function D() {
+			let e = h.value?.wrapRef;
+			if (!e) return;
+			let t = new Event("scroll");
+			Object.defineProperty(t, "target", { value: e }), Object.defineProperty(t, "currentTarget", { value: e }), c("scroll", t);
+		}
+		return n({ scrollTo: T }), (n, r) => (p(), o("div", { class: d(_.value) }, [e.nativeScrollbar ? (p(), o("div", {
+			key: 0,
+			ref_key: "scrollEl",
+			ref: l,
+			class: d(S.value),
+			style: f(y.value),
+			onScroll: E
+		}, [g(n.$slots, "default")], 38)) : (p(), i(t, u({
+			key: 1,
+			ref_key: "scrollbarRef",
+			ref: h,
+			class: "wi-layout__scrollbar",
+			height: "100%"
+		}, e.scrollbarProps, {
+			"view-class": C.value,
+			"view-style": w.value,
+			onScroll: D
+		}), {
+			default: b(() => [g(n.$slots, "default")]),
+			_: 3
+		}, 16, ["view-class", "view-style"]))], 2));
+	}
+}), C = /* @__PURE__ */ c({
+	name: "WiLayoutContent",
+	__name: "LayoutContent",
+	props: {
+		embedded: {
+			type: Boolean,
+			default: !1
+		},
+		position: { default: "static" },
+		nativeScrollbar: {
+			type: Boolean,
+			default: !0
+		},
+		scrollbarProps: {},
+		contentClass: {},
+		contentStyle: {}
+	},
+	emits: ["scroll"],
+	setup(e, { expose: n, emit: a }) {
+		let s = e, c = a, l = v("scrollEl"), m = v("scrollbarRef"), h = r(() => [
+			"wi-layout",
+			"wi-layout-content",
+			`wi-layout--${s.position}-positioned`,
+			{
+				"wi-layout--embedded": s.embedded,
+				"wi-layout--custom-scrollbar": !s.nativeScrollbar
+			}
+		]), _ = r(() => ["wi-layout__scroll", s.contentClass]), y = r(() => s.contentStyle), x = r(() => {
+			let e = s.scrollbarProps?.viewClass, t = _.value.filter(Boolean);
+			return e == null || e === "" ? t : Array.isArray(e) ? [...t, ...e] : [...t, e];
+		}), S = r(() => {
+			let e = s.scrollbarProps?.viewStyle;
+			return e == null || e === "" ? y.value : [y.value, e];
+		});
+		function C(e, t) {
+			if (s.nativeScrollbar) {
+				let n = l.value;
+				if (!n) return;
+				typeof e == "number" ? n.scrollTo(e, t ?? 0) : n.scrollTo(e);
+				return;
+			}
+			let n = m.value;
+			n && (typeof e == "number" ? n.scrollTo(e, t ?? 0) : n.scrollTo(e));
+		}
+		function w(e) {
+			c("scroll", e);
+		}
+		function T() {
+			let e = m.value?.wrapRef;
+			if (!e) return;
+			let t = new Event("scroll");
+			Object.defineProperty(t, "target", { value: e }), Object.defineProperty(t, "currentTarget", { value: e }), c("scroll", t);
+		}
+		return n({ scrollTo: C }), (n, r) => (p(), o("main", { class: d(h.value) }, [e.nativeScrollbar ? (p(), o("div", {
+			key: 0,
+			ref_key: "scrollEl",
+			ref: l,
+			class: d(_.value),
+			style: f(y.value),
+			onScroll: w
+		}, [g(n.$slots, "default")], 38)) : (p(), i(t, u({
+			key: 1,
+			ref_key: "scrollbarRef",
+			ref: m,
+			class: "wi-layout__scrollbar",
+			height: "100%"
+		}, e.scrollbarProps, {
+			"view-class": x.value,
+			"view-style": S.value,
+			onScroll: T
+		}), {
+			default: b(() => [g(n.$slots, "default")]),
+			_: 3
+		}, 16, ["view-class", "view-style"]))], 2));
+	}
+}), w = /* @__PURE__ */ c({
+	name: "WiLayoutFooter",
+	__name: "LayoutFooter",
+	props: {
+		bordered: {
+			type: Boolean,
+			default: !1
+		},
+		inverted: {
+			type: Boolean,
+			default: !1
+		},
+		position: { default: "static" }
+	},
+	setup(e) {
+		let t = e, n = r(() => [
+			"wi-layout-footer",
+			`wi-layout-footer--${t.position}-positioned`,
+			{
+				"wi-layout-footer--bordered": t.bordered,
+				"wi-layout-footer--inverted": t.inverted
+			}
+		]);
+		return (e, t) => (p(), o("footer", { class: d(n.value) }, [g(e.$slots, "default")], 2));
+	}
+}), T = /* @__PURE__ */ c({
+	name: "WiLayoutHeader",
+	__name: "LayoutHeader",
+	props: {
+		bordered: {
+			type: Boolean,
+			default: !1
+		},
+		inverted: {
+			type: Boolean,
+			default: !1
+		},
+		position: { default: "static" }
+	},
+	setup(e) {
+		let t = e, n = r(() => [
+			"wi-layout-header",
+			`wi-layout-header--${t.position}-positioned`,
+			{
+				"wi-layout-header--bordered": t.bordered,
+				"wi-layout-header--inverted": t.inverted
+			}
+		]);
+		return (e, t) => (p(), o("header", { class: d(n.value) }, [g(e.$slots, "default")], 2));
+	}
+}), E = ["aria-expanded", "aria-label"], D = {
+	key: 0,
+	class: "wi-layout-sider__arrow",
+	"aria-hidden": "true"
+}, O = {
+	key: 1,
+	class: "wi-layout-sider__bar",
+	"aria-hidden": "true"
+}, k = {
+	key: 3,
+	class: "wi-layout-sider__border",
+	"aria-hidden": "true"
+}, A = /* @__PURE__ */ c({
+	name: "WiLayoutSider",
+	__name: "LayoutSider",
+	props: {
+		bordered: {
+			type: Boolean,
+			default: !1
+		},
+		inverted: {
+			type: Boolean,
+			default: !1
+		},
+		position: { default: "static" },
+		width: { default: 272 },
+		collapsedWidth: { default: 48 },
+		collapsed: { type: Boolean },
+		defaultCollapsed: {
+			type: Boolean,
+			default: !1
+		},
+		collapseMode: { default: "transform" },
+		showCollapsedContent: {
+			type: Boolean,
+			default: !0
+		},
+		showTrigger: {
+			type: [Boolean, String],
+			default: !1
+		},
+		triggerClass: {},
+		triggerStyle: {},
+		collapsedTriggerClass: {},
+		collapsedTriggerStyle: {},
+		nativeScrollbar: {
+			type: Boolean,
+			default: !0
+		},
+		scrollbarProps: {},
+		contentClass: {},
+		contentStyle: {}
+	},
+	emits: [
+		"update:collapsed",
+		"collapse",
+		"expand",
+		"after-enter",
+		"after-leave",
+		"scroll"
+	],
+	setup(c, { expose: m, emit: S }) {
+		let C = c, w = S, T = n(), A = l(x, null), j = h(C.defaultCollapsed), M = v("scrollEl"), N = v("scrollbarRef"), P = r(() => C.collapsed !== void 0), F = r(() => P.value ? !!C.collapsed : j.value);
+		y(() => C.collapsed, (e) => {
+			e !== void 0 && (j.value = e);
+		});
+		let I = r(() => A?.siderPlacement ?? "left"), L = r(() => e(C.width) ?? "272px"), R = r(() => e(F.value ? C.collapsedWidth : C.width)), z = r(() => {
+			let e = C.showTrigger;
+			return e ? e === "bar" || e === !0 ? "bar" : "arrow-circle" : null;
+		}), B = r(() => !F.value || C.showCollapsedContent), V = r(() => [
+			"wi-layout-sider",
+			`wi-layout-sider--${C.position}-positioned`,
+			`wi-layout-sider--${I.value}-placement`,
+			`wi-layout-sider--collapse-${C.collapseMode}`,
+			{
+				"wi-layout-sider--bordered": C.bordered,
+				"wi-layout-sider--inverted": C.inverted,
+				"wi-layout-sider--collapsed": F.value,
+				"wi-layout-sider--show-content": B.value,
+				"wi-layout-sider--custom-scrollbar": !C.nativeScrollbar
+			}
+		]), H = r(() => ({
+			width: L.value,
+			maxWidth: R.value
+		})), U = r(() => {
+			let e = C.contentStyle;
+			return C.collapseMode === "transform" ? [e, { minWidth: L.value }] : e;
+		}), W = r(() => ["wi-layout-sider__scroll", C.contentClass]), G = r(() => {
+			let e = C.scrollbarProps?.viewClass, t = W.value.filter(Boolean);
+			return e == null || e === "" ? t : Array.isArray(e) ? [...t, ...e] : [...t, e];
+		}), K = r(() => {
+			let e = C.scrollbarProps?.viewStyle;
+			return e == null || e === "" ? U.value : [U.value, e];
+		}), q = r(() => F.value ? C.collapsedTriggerClass : C.triggerClass), J = r(() => F.value ? C.collapsedTriggerStyle : C.triggerStyle);
+		function Y() {
+			let e = !F.value;
+			j.value = e, w("update:collapsed", e), w(e ? "collapse" : "expand");
+		}
+		function X(e) {
+			e.propertyName === "max-width" && (F.value ? w("after-leave") : w("after-enter"));
+		}
+		function Z(e) {
+			w("scroll", e);
+		}
+		function Q() {
+			let e = N.value?.wrapRef;
+			if (!e) return;
+			let t = new Event("scroll");
+			Object.defineProperty(t, "target", { value: e }), Object.defineProperty(t, "currentTarget", { value: e }), w("scroll", t);
+		}
+		function $(e, t) {
+			if (C.nativeScrollbar) {
+				let n = M.value;
+				if (!n) return;
+				typeof e == "number" ? n.scrollTo(e, t ?? 0) : n.scrollTo(e);
+				return;
+			}
+			let n = N.value;
+			n && (typeof e == "number" ? n.scrollTo(e, t ?? 0) : n.scrollTo(e));
+		}
+		return m({ scrollTo: $ }), (e, n) => (p(), o("aside", {
+			class: d(V.value),
+			style: f(H.value),
+			onTransitionend: X
+		}, [
+			c.nativeScrollbar ? (p(), o("div", {
+				key: 0,
+				ref_key: "scrollEl",
+				ref: M,
+				class: d(W.value),
+				style: f(U.value),
+				onScroll: Z
+			}, [g(e.$slots, "default")], 38)) : (p(), i(t, u({
+				key: 1,
+				ref_key: "scrollbarRef",
+				ref: N,
+				class: "wi-layout-sider__scrollbar",
+				height: "100%"
+			}, c.scrollbarProps, {
+				"view-class": G.value,
+				"view-style": K.value,
+				onScroll: Q
+			}), {
+				default: b(() => [g(e.$slots, "default")]),
+				_: 3
+			}, 16, ["view-class", "view-style"])),
+			z.value ? (p(), o("button", {
+				key: 2,
+				type: "button",
+				class: d(["wi-layout-sider__trigger", [q.value, {
+					"wi-layout-sider__trigger--bar": z.value === "bar",
+					"wi-layout-sider__trigger--arrow-circle": z.value === "arrow-circle"
+				}]]),
+				style: f(J.value),
+				"aria-expanded": !F.value,
+				"aria-label": F.value ? _(T).expand : _(T).collapse,
+				onClick: Y
+			}, [z.value === "arrow-circle" ? (p(), o("span", D, " › ")) : (p(), o("span", O, [...n[0] ||= [s("i", { class: "wi-layout-sider__bar-top" }, null, -1), s("i", { class: "wi-layout-sider__bar-bottom" }, null, -1)]]))], 14, E)) : a("", !0),
+			c.bordered ? (p(), o("div", k)) : a("", !0)
+		], 38));
+	}
+});
+//#endregion
+export { x as WI_LAYOUT_KEY, S as WiLayout, C as WiLayoutContent, w as WiLayoutFooter, T as WiLayoutHeader, A as WiLayoutSider };