@selectwin/kit 0.1.197 → 0.1.199

package/dist/SelectMailEditor.js

@@ -0,0 +1,224 @@
+/* empty css           */
+import { ClearFormatIcon as e, LinkIcon as t, ListBulletIcon as n, ListNumberIcon as r, TextBoldIcon as i, TextItalicIcon as a, TextQuoteIcon as o, TextStrikeIcon as s, TextUnderlineIcon as c } from "./icons.js";
+import { SelectTooltip as l } from "./SelectTooltip.js";
+import { SelectPopover as u } from "./SelectPopover.js";
+import { useEffect as d, useLayoutEffect as f, useRef as p, useState as m } from "react";
+import { jsx as h, jsxs as g } from "react/jsx-runtime";
+//#region src/SelectMailEditor.tsx
+var _ = (e) => e.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;");
+function v(e) {
+	return e.replace(/\r\n?/g, "\n").split(/\n{2,}/).filter((e, t) => e.length > 0 || t === 0).map((e) => `<p>${e ? _(e).replace(/\n/g, "<br>") : "<br>"}</p>`).join("");
+}
+function y(e) {
+	let t = e.trim();
+	if (!t || /\s/.test(t)) return null;
+	if (/^(https?:\/\/|mailto:)/i.test(t)) try {
+		let e = new URL(t);
+		return e.protocol === "mailto:" || e.hostname ? t : null;
+	} catch {
+		return null;
+	}
+	return /^[^@/:]+@[^@/:]+\.[a-z]{2,}$/i.test(t) ? `mailto:${t}` : /^[a-z0-9-]+(\.[a-z0-9-]+)+(\/\S*)?$/i.test(t) ? `https://${t}` : null;
+}
+function b(e, t) {
+	try {
+		typeof document.execCommand == "function" && document.execCommand(e, !1, t);
+	} catch {}
+}
+function x(e) {
+	try {
+		return typeof document.queryCommandState == "function" && document.queryCommandState(e);
+	} catch {
+		return !1;
+	}
+}
+function S(e) {
+	return (typeof e.innerText == "string" && e.innerText !== "" ? e.innerText : e.textContent ?? "").replace(/ /g, " ").replace(/\n{3,}/g, "\n\n").trim();
+}
+function C(e, t) {
+	let n = document.getSelection(), r = n && n.rangeCount ? n.getRangeAt(0).startContainer : null;
+	for (; r && r !== e;) {
+		if (r instanceof HTMLElement && r.tagName.toLowerCase() === t) return r;
+		r = r.parentNode;
+	}
+	return null;
+}
+function w({ value: v, onChange: w, placeholder: T, "aria-label": E = "Mensagem", size: D = "inline" }) {
+	let O = p(null), k = p(null), A = p(null), [j, M] = m(!0), [N, P] = m({}), [F, I] = m(!1), [L, R] = m(""), [z, B] = m("");
+	f(() => {
+		let e = O.current;
+		e && v !== k.current && (e.innerHTML = v, k.current = v, M(S(e) === "" && !e.querySelector("li, blockquote")));
+	}, [v]);
+	let V = () => {
+		let e = O.current;
+		if (!e) return;
+		let t = e.innerHTML;
+		k.current = t;
+		let n = S(e);
+		M(n === "" && !e.querySelector("li, blockquote")), w(t, n);
+	}, H = () => {
+		let e = O.current;
+		e && P({
+			bold: x("bold"),
+			italic: x("italic"),
+			underline: x("underline"),
+			strikeThrough: x("strikeThrough"),
+			insertUnorderedList: x("insertUnorderedList"),
+			insertOrderedList: x("insertOrderedList"),
+			quote: !!C(e, "blockquote"),
+			link: !!C(e, "a")
+		});
+	};
+	d(() => {
+		let e = () => {
+			let e = O.current, t = document.getSelection();
+			e && t && t.rangeCount && e.contains(t.getRangeAt(0).startContainer) && H();
+		};
+		return document.addEventListener("selectionchange", e), () => document.removeEventListener("selectionchange", e);
+	}, []);
+	let U = (e, t) => {
+		var n;
+		(n = O.current) == null || n.focus(), b("defaultParagraphSeparator", "p"), b(e, t), V(), H();
+	}, W = () => {
+		let e = O.current;
+		e && (e.focus(), U("formatBlock", C(e, "blockquote") ? "p" : "blockquote"));
+	}, G = (e) => {
+		e && (b("insertText", e), V());
+	}, K = (e) => {
+		e.preventDefault(), G(e.clipboardData.getData("text/plain"));
+	}, q = (e) => {
+		var t;
+		Array.from(((t = e.dataTransfer) == null ? void 0 : t.types) ?? []).includes("Files") || (e.preventDefault(), G(e.dataTransfer.getData("text/plain")));
+	}, J = () => {
+		let e = O.current, t = document.getSelection();
+		A.current = e && t && t.rangeCount && e.contains(t.getRangeAt(0).startContainer) ? t.getRangeAt(0).cloneRange() : null;
+		let n = e ? C(e, "a") : null;
+		R((n == null ? void 0 : n.getAttribute("href")) ?? ""), B(""), I(!0);
+	}, Y = () => {
+		let e = O.current;
+		if (!e) return;
+		e.focus();
+		let t = document.getSelection();
+		A.current && t && (t.removeAllRanges(), t.addRange(A.current));
+	}, X = () => {
+		let e = y(L);
+		if (!e) {
+			B("Use um endereço como https://site.com.br ou nome@empresa.com.");
+			return;
+		}
+		Y();
+		let t = document.getSelection();
+		if (!t || !t.rangeCount || t.getRangeAt(0).collapsed) {
+			let t = e.replace(/^mailto:/i, "");
+			b("insertHTML", `<a href="${_(e)}">${_(t)}</a>&nbsp;`);
+		} else b("createLink", e);
+		I(!1), V(), H();
+	}, Z = () => {
+		Y(), b("unlink"), I(!1), V(), H();
+	}, Q = (e, t, n, r) => /* @__PURE__ */ h(l, {
+		content: t,
+		children: /* @__PURE__ */ h("button", {
+			type: "button",
+			className: `select-maileditor__tool${e && N[e] ? " is-active" : ""}`,
+			"aria-label": t,
+			"aria-pressed": e ? !!N[e] : void 0,
+			onMouseDown: (e) => e.preventDefault(),
+			onClick: r,
+			children: n
+		})
+	});
+	return /* @__PURE__ */ g("div", {
+		className: `select-maileditor select-maileditor--${D}`,
+		children: [/* @__PURE__ */ h("div", {
+			ref: O,
+			className: `select-maileditor__area${j ? " is-empty" : ""}`,
+			contentEditable: !0,
+			suppressContentEditableWarning: !0,
+			role: "textbox",
+			"aria-multiline": "true",
+			"aria-label": E,
+			"data-placeholder": T,
+			spellCheck: !0,
+			onInput: V,
+			onKeyUp: H,
+			onMouseUp: H,
+			onPaste: K,
+			onDrop: q
+		}), /* @__PURE__ */ g("div", {
+			className: "select-maileditor__bar",
+			role: "toolbar",
+			"aria-label": "Formatação",
+			children: [
+				Q("bold", "Negrito", /* @__PURE__ */ h(i, {}), () => U("bold")),
+				Q("italic", "Itálico", /* @__PURE__ */ h(a, {}), () => U("italic")),
+				Q("underline", "Sublinhado", /* @__PURE__ */ h(c, {}), () => U("underline")),
+				Q("strikeThrough", "Riscado", /* @__PURE__ */ h(s, {}), () => U("strikeThrough")),
+				/* @__PURE__ */ h("span", {
+					className: "select-maileditor__sep",
+					"aria-hidden": "true"
+				}),
+				Q("insertUnorderedList", "Lista com marcadores", /* @__PURE__ */ h(n, {}), () => U("insertUnorderedList")),
+				Q("insertOrderedList", "Lista numerada", /* @__PURE__ */ h(r, {}), () => U("insertOrderedList")),
+				Q("quote", "Citação", /* @__PURE__ */ h(o, {}), W),
+				/* @__PURE__ */ h("span", {
+					className: "select-maileditor__sep",
+					"aria-hidden": "true"
+				}),
+				/* @__PURE__ */ h(u, {
+					active: F,
+					onClose: () => I(!1),
+					placement: "top-start",
+					role: "dialog",
+					activator: Q("link", N.link ? "Editar o link" : "Link", /* @__PURE__ */ h(t, {}), () => F ? I(!1) : J()),
+					children: /* @__PURE__ */ g("form", {
+						className: "select-maileditor__link",
+						onSubmit: (e) => {
+							e.preventDefault(), X();
+						},
+						children: [
+							/* @__PURE__ */ g("label", {
+								className: "select-maileditor__linklabel",
+								children: [/* @__PURE__ */ h("span", { children: "Endereço do link" }), /* @__PURE__ */ h("input", {
+									className: "select-maileditor__linkinput",
+									value: L,
+									onChange: (e) => {
+										R(e.target.value), B("");
+									},
+									placeholder: "https://site.com.br",
+									inputMode: "url",
+									autoComplete: "off",
+									autoFocus: !0
+								})]
+							}),
+							z ? /* @__PURE__ */ h("span", {
+								className: "select-maileditor__linkerror",
+								role: "alert",
+								children: z
+							}) : null,
+							/* @__PURE__ */ g("span", {
+								className: "select-maileditor__linkactions",
+								children: [N.link ? /* @__PURE__ */ h("button", {
+									type: "button",
+									className: "select-maileditor__linkbtn",
+									onClick: Z,
+									children: "Tirar o link"
+								}) : null, /* @__PURE__ */ h("button", {
+									type: "submit",
+									className: "select-maileditor__linkbtn select-maileditor__linkbtn--primary",
+									children: "Aplicar"
+								})]
+							})
+						]
+					})
+				}),
+				Q(null, "Limpar a formatação", /* @__PURE__ */ h(e, {}), () => {
+					U("removeFormat"), b("unlink"), V();
+				})
+			]
+		})]
+	});
+}
+//#endregion
+export { w as SelectMailEditor, y as mailLinkHref, v as mailTextToHtml };
+
+//# sourceMappingURL=SelectMailEditor.js.map

package/dist/SelectMarimekko.js

@@ -0,0 +1,87 @@
+/* empty css           */
+import { chartColor as e, formatCompact as t, useChartSize as n } from "./chartUtils.js";
+import { ChartTooltip as r, useChartTooltip as i } from "./chartTip.js";
+import { jsx as a, jsxs as o } from "react/jsx-runtime";
+//#region src/SelectMarimekko.tsx
+function s({ columns: s, height: c = 240, format: l = t, gap: u = 3, className: d, ...f }) {
+	let { ref: p, width: m } = n(c), h = i(), g = {
+		top: 6,
+		right: 6,
+		bottom: 24,
+		left: 6
+	}, _ = Math.max(0, m - g.left - g.right), v = c - g.top - g.bottom, y = s.map((e) => e.segments.reduce((e, t) => e + t.value, 0)), b = y.reduce((e, t) => e + t, 0) || 1, x = [];
+	s.forEach((e) => e.segments.forEach((e) => {
+		x.includes(e.key) || x.push(e.key);
+	}));
+	let S = (t, n) => n ?? e(x.indexOf(t)), C = u * Math.max(0, s.length - 1), w = Math.max(0, _ - C), T = g.left;
+	return /* @__PURE__ */ o("div", {
+		...f,
+		className: `select-chart-wrap${d ? " " + d : ""}`,
+		ref: p,
+		children: [
+			m > 0 && /* @__PURE__ */ a("svg", {
+				width: m,
+				height: c,
+				className: "select-chart",
+				children: s.map((e, t) => {
+					let n = y[t] || 1, r = n / b * w, i = T;
+					T += r + u;
+					let s = g.top;
+					return /* @__PURE__ */ o("g", { children: [e.segments.map((t, o) => {
+						let c = t.value / n * v, u = s;
+						s += c;
+						let d = S(t.key, t.color);
+						return /* @__PURE__ */ a("rect", {
+							x: i,
+							y: u,
+							width: Math.max(0, r),
+							height: Math.max(0, c - 1),
+							fill: d,
+							fillOpacity: .85,
+							className: "select-chart__seg",
+							onMouseEnter: () => h.show({
+								x: i + r / 2,
+								y: u,
+								place: u < g.top + 44 ? "bottom" : "top",
+								title: `${e.label} · ${t.key}`,
+								rows: [{
+									label: "Valor",
+									value: l(t.value),
+									color: d
+								}, {
+									label: "Share",
+									value: `${Math.round(t.value / n * 100)}%`
+								}]
+							}),
+							onMouseLeave: h.hide
+						}, o);
+					}), /* @__PURE__ */ a("text", {
+						x: i + r / 2,
+						y: c - g.bottom + 16,
+						className: "select-chart__xlabel",
+						textAnchor: "middle",
+						children: e.label
+					})] }, t);
+				})
+			}),
+			/* @__PURE__ */ a("ul", {
+				className: "select-donut__legend select-mekko__legend",
+				children: x.map((t, n) => /* @__PURE__ */ o("li", {
+					className: "select-donut__legitem",
+					children: [/* @__PURE__ */ a("span", {
+						className: "select-donut__dot",
+						style: { background: e(n) }
+					}), /* @__PURE__ */ a("span", {
+						className: "select-donut__leglabel",
+						children: t
+					})]
+				}, t))
+			}),
+			/* @__PURE__ */ a(r, { tip: h.tip })
+		]
+	});
+}
+//#endregion
+export { s as SelectMarimekko };
+
+//# sourceMappingURL=SelectMarimekko.js.map

package/dist/SelectMarkStack.js

@@ -0,0 +1,30 @@
+import { forwardRef as e } from "react";
+import { jsx as t, jsxs as n } from "react/jsx-runtime";
+//#region src/SelectMarkStack.tsx
+var r = e(function({ marks: e, max: r = 4, className: i, ...a }, o) {
+	let s = e.slice(0, r), c = e.length - s.length, l = s.some((e) => e.icon == null && (e.initials ?? "").length > 2);
+	return /* @__PURE__ */ n("div", {
+		ref: o,
+		...a,
+		className: `select-markstack${l ? " select-markstack--spaced" : ""}${i ? " " + i : ""}`,
+		children: [s.map((e) => {
+			var n;
+			let r = e.initials ?? ((n = e.label.trim()[0]) == null ? void 0 : n.toUpperCase()) ?? "•", i = e.icon == null && r.length > 2;
+			return /* @__PURE__ */ t("span", {
+				className: `select-markstack__mark${i ? " select-markstack__mark--wide" : ""}`,
+				role: "img",
+				"aria-label": e.label,
+				title: e.label,
+				children: e.icon ?? r
+			}, e.id);
+		}), c > 0 && /* @__PURE__ */ n("span", {
+			className: "select-markstack__mark select-markstack__mark--more",
+			title: e.slice(r).map((e) => e.label).join(", "),
+			children: ["+", c]
+		})]
+	});
+});
+//#endregion
+export { r as SelectMarkStack };
+
+//# sourceMappingURL=SelectMarkStack.js.map

package/dist/SelectMediaCell.js

@@ -0,0 +1,28 @@
+/* empty css           */
+import { forwardRef as e } from "react";
+import { jsx as t, jsxs as n } from "react/jsx-runtime";
+//#region src/SelectMediaCell.tsx
+var r = e(function({ media: e, title: r, secondary: i, className: a, ...o }, s) {
+	return /* @__PURE__ */ n("span", {
+		ref: s,
+		...o,
+		className: `select-mediacell${a ? " " + a : ""}`,
+		children: [e && /* @__PURE__ */ t("span", {
+			className: "select-mediacell__media",
+			children: e
+		}), /* @__PURE__ */ n("span", {
+			className: "select-mediacell__text",
+			children: [/* @__PURE__ */ t("span", {
+				className: "select-mediacell__title",
+				children: r
+			}), i != null && i !== "" && /* @__PURE__ */ t("span", {
+				className: "select-mediacell__secondary",
+				children: i
+			})]
+		})]
+	});
+});
+//#endregion
+export { r as SelectMediaCell };
+
+//# sourceMappingURL=SelectMediaCell.js.map

package/dist/SelectMenu.js

@@ -0,0 +1,110 @@
+import { ChevronDownIcon as e, ExternalLinkIcon as t } from "./icons.js";
+import { safeHref as n } from "./internal/safeHref.js";
+import { forwardRef as r } from "react";
+import { jsx as i, jsxs as a } from "react/jsx-runtime";
+//#region src/SelectMenu.tsx
+var o = r(function({ children: e, className: t, ...n }, r) {
+	return /* @__PURE__ */ i("div", {
+		ref: r,
+		...n,
+		className: `select-menu${t ? " " + t : ""}`,
+		role: "menu",
+		children: e
+	});
+});
+function s({ children: e, description: t }) {
+	return t == null || t === "" ? /* @__PURE__ */ i("span", {
+		className: "select-menu__label",
+		children: e
+	}) : /* @__PURE__ */ a("span", {
+		className: "select-menu__label select-menu__label--desc",
+		children: [/* @__PURE__ */ i("span", {
+			className: "select-menu__title",
+			children: e
+		}), /* @__PURE__ */ i("span", {
+			className: "select-menu__desc",
+			children: t
+		})]
+	});
+}
+var c = r(function({ children: e, description: t, icon: n, trailing: r, onClick: o, active: c = !1, tone: l = "default", className: u, ...d }, f) {
+	return /* @__PURE__ */ a("button", {
+		ref: f,
+		...d,
+		type: "button",
+		role: "menuitem",
+		className: `select-menu__item select-menu__item--${l}${c ? " is-active" : ""}${u ? " " + u : ""}`,
+		onClick: o,
+		children: [
+			n && /* @__PURE__ */ i("span", {
+				className: "select-menu__icon",
+				children: n
+			}),
+			/* @__PURE__ */ i(s, {
+				description: t,
+				children: e
+			}),
+			r && /* @__PURE__ */ i("span", {
+				className: "select-menu__trailing",
+				children: r
+			})
+		]
+	});
+}), l = r(function({ children: e, description: r, href: o, icon: c, trailing: l, external: u, tone: d = "default", className: f, ...p }, m) {
+	let h = n(o), g = u ?? /^(https?:|mailto:|tel:)/i.test(h ?? ""), _ = l ?? (g ? /* @__PURE__ */ i(t, {}) : void 0);
+	return /* @__PURE__ */ a("a", {
+		ref: m,
+		...p,
+		href: h,
+		role: "menuitem",
+		target: g ? "_blank" : p.target,
+		rel: g ? "noreferrer" : p.rel,
+		className: `select-menu__item select-menu__item--${d}${f ? " " + f : ""}`,
+		children: [
+			c && /* @__PURE__ */ i("span", {
+				className: "select-menu__icon",
+				children: c
+			}),
+			/* @__PURE__ */ i(s, {
+				description: r,
+				children: e
+			}),
+			_ && /* @__PURE__ */ i("span", {
+				className: "select-menu__trailing",
+				children: _
+			})
+		]
+	});
+});
+function u({ children: e }) {
+	return /* @__PURE__ */ i("div", {
+		className: "select-menu__heading",
+		children: e
+	});
+}
+function d() {
+	return /* @__PURE__ */ i("div", {
+		className: "select-menu__divider",
+		role: "separator"
+	});
+}
+var f = r(function({ children: t, onClick: n, active: r = !1, className: o, ...s }, c) {
+	return /* @__PURE__ */ a("button", {
+		ref: c,
+		...s,
+		type: "button",
+		className: `select-menubtn${r ? " is-active" : ""}${o ? " " + o : ""}`,
+		onClick: n,
+		"aria-haspopup": "menu",
+		"aria-expanded": r,
+		children: [/* @__PURE__ */ i("span", { children: t }), /* @__PURE__ */ i("span", {
+			className: "select-menubtn__caret",
+			"aria-hidden": "true",
+			children: /* @__PURE__ */ i(e, {})
+		})]
+	});
+});
+//#endregion
+export { o as SelectMenu, f as SelectMenuButton, d as SelectMenuDivider, u as SelectMenuHeading, c as SelectMenuItem, l as SelectMenuLink };
+
+//# sourceMappingURL=SelectMenu.js.map

package/dist/SelectMiniStats.js

@@ -0,0 +1,37 @@
+/* empty css           */
+import { SelectInfoTip as e } from "./SelectInfoTip.js";
+import { forwardRef as t } from "react";
+import { jsx as n, jsxs as r } from "react/jsx-runtime";
+//#region src/SelectMiniStats.tsx
+var i = t(function({ items: t, order: i = "label-first", columns: a, narrowColumns: o, loading: s = !1, className: c, ...l }, u) {
+	return /* @__PURE__ */ n("dl", {
+		ref: u,
+		"aria-busy": s || void 0,
+		...l,
+		className: `select-ministats select-ministats--${i}${a ? ` select-ministats--cols-${a}` : ""}${o ? ` select-ministats--narrow-${o}` : ""}${s ? " select-ministats--loading" : ""}${c ? " " + c : ""}`,
+		children: t.map((t, i) => /* @__PURE__ */ r("div", {
+			className: "select-ministats__item",
+			children: [
+				/* @__PURE__ */ r("dt", {
+					className: `select-ministats__label${t.help == null ? "" : " select-ministats__label--help"}`,
+					children: [t.label, t.help != null && /* @__PURE__ */ n(e, { content: t.help })]
+				}),
+				/* @__PURE__ */ n("dd", {
+					className: "select-ministats__value",
+					children: s ? /* @__PURE__ */ n("span", {
+						className: "select-skeleton select-ministats__skeleton",
+						"aria-hidden": "true"
+					}) : t.value
+				}),
+				t.hint != null && /* @__PURE__ */ n("dd", {
+					className: "select-ministats__hint",
+					children: t.hint
+				})
+			]
+		}, t.key ?? i))
+	});
+});
+//#endregion
+export { i as SelectMiniStats };
+
+//# sourceMappingURL=SelectMiniStats.js.map