@selectwin/kit 0.1.197 → 0.1.199

package/dist/SelectHorizontalBar.js

@@ -0,0 +1,100 @@
+/* empty css           */
+import { chartColor as e, formatCompact as t, niceMax as n, ticks as r, useChartSize as i } from "./chartUtils.js";
+import { ChartTooltip as a, useChartTooltip as o } from "./chartTip.js";
+import { useId as s } from "react";
+import { jsx as c, jsxs as l } from "react/jsx-runtime";
+//#region src/SelectHorizontalBar.tsx
+var u = 6.1, d = 12, f = 56, p = .4;
+function m({ data: m, height: h, color: g, format: _ = t, formatValue: v, distributed: y = !0, labelWidth: b, max: x, className: S, ...C }) {
+	let w = h ?? m.length * 36 + 6 + 26, { ref: T, width: E } = i(w), D = o(), O = s(), k = x && x > 0 ? x : n(Math.max(0, ...m.map((e) => e.value))), A = m.reduce((e, t) => Math.max(e, t.label.length), 0), j = Math.min(Math.max(f, A * u + d), Math.max(f, E * p)), M = b ?? j, N = Math.max(3, Math.floor((M - d) / u)), P = (e) => e.length <= N ? e : `${e.slice(0, N - 1).trimEnd()}…`, F = Math.max(0, E - M - 28), I = w - 6 - 26, L = m.length ? I / m.length : 0, R = Math.min(L * .62, 22), z = (e) => M + e / k * F, B = (t, n) => t.color ?? (y ? e(n) : g ?? e(0));
+	return /* @__PURE__ */ l("div", {
+		...C,
+		className: `select-chart-wrap${S ? " " + S : ""}`,
+		ref: T,
+		children: [E > 0 && /* @__PURE__ */ l("svg", {
+			width: E,
+			height: w,
+			className: "select-chart",
+			children: [
+				/* @__PURE__ */ c("defs", { children: m.map((e, t) => {
+					let n = B(e, t);
+					return /* @__PURE__ */ l("linearGradient", {
+						id: `${O}-h${t}`,
+						x1: "0",
+						y1: "0",
+						x2: "1",
+						y2: "0",
+						children: [/* @__PURE__ */ c("stop", {
+							offset: "0%",
+							stopColor: n,
+							stopOpacity: 1
+						}), /* @__PURE__ */ c("stop", {
+							offset: "100%",
+							stopColor: n,
+							stopOpacity: .5
+						})]
+					}, t);
+				}) }),
+				r(k).map((e, t) => /* @__PURE__ */ l("g", { children: [/* @__PURE__ */ c("line", {
+					x1: z(e),
+					x2: z(e),
+					y1: 6,
+					y2: 6 + I,
+					className: t === 0 ? "select-chart__axis" : "select-chart__grid"
+				}), /* @__PURE__ */ c("text", {
+					x: z(e),
+					y: w - 26 + 16,
+					className: "select-chart__xlabel",
+					textAnchor: "middle",
+					children: _(e)
+				})] }, t)),
+				m.map((e, t) => {
+					let n = 6 + L * t + L / 2, r = Math.min(F, e.value / k * F), i = B(e, t);
+					return /* @__PURE__ */ l("g", { children: [
+						/* @__PURE__ */ c("rect", {
+							x: M,
+							y: n - R / 2,
+							width: F,
+							height: R,
+							rx: 5,
+							className: "select-chart__track-bar"
+						}),
+						/* @__PURE__ */ c("rect", {
+							x: M,
+							y: n - R / 2,
+							width: Math.max(0, r),
+							height: R,
+							rx: 5,
+							fill: `url(#${O}-h${t})`,
+							className: "select-chart__hbar",
+							style: { animationDelay: `${t * 40}ms` },
+							onMouseEnter: () => D.show({
+								x: M + r,
+								y: n - R / 2,
+								place: n - R / 2 < 50 ? "bottom" : "top",
+								rows: [{
+									label: e.label,
+									value: (v ?? _)(e.value),
+									color: i
+								}]
+							}),
+							onMouseLeave: D.hide
+						}),
+						/* @__PURE__ */ l("text", {
+							x: M - d / 2,
+							y: n,
+							className: "select-chart__ylabel",
+							dominantBaseline: "middle",
+							textAnchor: "end",
+							children: [/* @__PURE__ */ c("title", { children: e.label }), P(e.label)]
+						})
+					] }, t);
+				})
+			]
+		}), /* @__PURE__ */ c(a, { tip: D.tip })]
+	});
+}
+//#endregion
+export { m as SelectHorizontalBar };
+
+//# sourceMappingURL=SelectHorizontalBar.js.map

package/dist/SelectHtmlFrame.js

@@ -0,0 +1,30 @@
+/* empty css           */
+import { jsx as e } from "react/jsx-runtime";
+//#region src/SelectHtmlFrame.tsx
+function t(e) {
+	let t = e.trim();
+	if (t.startsWith("/") && !t.startsWith("//") && !t.startsWith("/\\")) return !0;
+	try {
+		return new URL(t).protocol === "https:";
+	} catch {
+		return !1;
+	}
+}
+function n({ src: n, title: r, height: i = "28rem", allowLinks: a = !1, className: o }) {
+	let s = t(n);
+	return /* @__PURE__ */ e("div", {
+		className: `select-htmlframe${o ? " " + o : ""}`,
+		children: s ? /* @__PURE__ */ e("iframe", {
+			className: "select-htmlframe__frame",
+			title: r,
+			src: n,
+			sandbox: a ? "allow-popups allow-popups-to-escape-sandbox" : "",
+			referrerPolicy: "no-referrer",
+			style: { height: i }
+		}) : null
+	});
+}
+//#endregion
+export { n as SelectHtmlFrame, t as frameSrcAllowed };
+
+//# sourceMappingURL=SelectHtmlFrame.js.map

package/dist/SelectIcicle.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 { useState as a } from "react";
+import { jsx as o, jsxs as s } from "react/jsx-runtime";
+//#region src/SelectIcicle.tsx
+function c(e) {
+	return e.children && e.children.length ? e.children.reduce((e, t) => e + c(t), 0) : e.value ?? 0;
+}
+function l(e, t = 0) {
+	return !e.children || !e.children.length ? t : Math.max(...e.children.map((e) => l(e, t + 1)));
+}
+function u({ data: u, height: d = 240, format: f = t, className: p, ...m }) {
+	let { ref: h, width: g } = n(d), _ = i(), [v, y] = a(null), b = l(u), x = d / (b + 1), S = [], C = (t, n, r, i, a) => {
+		if (S.push({
+			node: t,
+			x0: n,
+			x1: r,
+			depth: i,
+			color: t.color ?? e(a),
+			value: c(t)
+		}), t.children && t.children.length) {
+			let e = t.children.reduce((e, t) => e + c(t), 0) || 1, o = n;
+			t.children.forEach((t, s) => {
+				let l = (r - n) * c(t) / e;
+				C(t, o, o + l, i + 1, i === 0 ? s : a), o += l;
+			});
+		}
+	};
+	return g > 0 && C(u, 0, g, 0, 0), /* @__PURE__ */ s("div", {
+		...m,
+		className: `select-chart-wrap${p ? " " + p : ""}`,
+		ref: h,
+		children: [g > 0 && /* @__PURE__ */ o("svg", {
+			width: g,
+			height: d,
+			className: "select-chart",
+			onMouseLeave: () => {
+				y(null), _.hide();
+			},
+			children: S.map((e) => {
+				let t = Math.max(0, e.x1 - e.x0 - 2), n = e.depth * x, r = `${e.depth}-${e.x0.toFixed(1)}-${e.node.label}`;
+				return /* @__PURE__ */ s("g", {
+					style: { opacity: v === null || v === r ? 1 : .5 },
+					children: [/* @__PURE__ */ o("rect", {
+						x: e.x0 + 1,
+						y: n + 1,
+						width: t,
+						height: Math.max(0, x - 2),
+						rx: 4,
+						fill: e.color,
+						fillOpacity: .3 + .14 * (1 - e.depth / (b + 1)),
+						stroke: e.color,
+						strokeOpacity: .5,
+						className: "select-icicle__cell",
+						onMouseEnter: () => {
+							y(r), _.show({
+								x: (e.x0 + e.x1) / 2,
+								y: n,
+								place: n < 40 ? "bottom" : "top",
+								title: e.node.label,
+								rows: [{
+									label: "Valor",
+									value: f(e.value),
+									color: e.color
+								}]
+							});
+						},
+						onMouseLeave: () => {
+							y(null), _.hide();
+						}
+					}), t > 42 && x > 16 && /* @__PURE__ */ o("text", {
+						x: e.x0 + 8,
+						y: n + x / 2,
+						className: "select-treemap__label",
+						dominantBaseline: "middle",
+						children: e.node.label
+					})]
+				}, r);
+			})
+		}), /* @__PURE__ */ o(r, { tip: _.tip })]
+	});
+}
+//#endregion
+export { u as SelectIcicle };
+
+//# sourceMappingURL=SelectIcicle.js.map

package/dist/SelectIcon.js

@@ -0,0 +1,21 @@
+/* empty css           */
+import { jsx as e } from "react/jsx-runtime";
+//#region src/SelectIcon.tsx
+var t = {
+	sm: "1rem",
+	md: "1.25rem",
+	lg: "1.5rem"
+};
+function n({ source: n, children: r, tone: i = "inherit", size: a = "md" }) {
+	let o = ["select-icon", i !== "inherit" && i !== "base" ? `select-icon--${i}` : ""].filter(Boolean).join(" "), s = t[a] ?? a;
+	return /* @__PURE__ */ e("span", {
+		className: o,
+		style: { "--select-icon-size": s },
+		"aria-hidden": "true",
+		children: n ? /* @__PURE__ */ e(n, {}) : r
+	});
+}
+//#endregion
+export { n as SelectIcon };
+
+//# sourceMappingURL=SelectIcon.js.map

package/dist/SelectIconButton.js

@@ -0,0 +1,24 @@
+import { SelectTooltip as e } from "./SelectTooltip.js";
+import { forwardRef as t } from "react";
+import { jsx as n } from "react/jsx-runtime";
+//#region src/SelectIconButton.tsx
+var r = t(function({ icon: t, label: r, onClick: i, disabled: a = !1, size: o = "md", variant: s = "ghost", active: c = !1, className: l, ...u }, d) {
+	return /* @__PURE__ */ n(e, {
+		content: r,
+		children: /* @__PURE__ */ n("button", {
+			ref: d,
+			...u,
+			type: "button",
+			className: `select-iconbtn select-iconbtn--${o} select-iconbtn--${s}${c ? " is-active" : ""}${l ? " " + l : ""}`,
+			"aria-label": r,
+			"aria-pressed": c,
+			onClick: i,
+			disabled: a,
+			children: t
+		})
+	});
+});
+//#endregion
+export { r as SelectIconButton };
+
+//# sourceMappingURL=SelectIconButton.js.map

package/dist/SelectIconPicker.js

@@ -0,0 +1,79 @@
+import { ChevronDownIcon as e } from "./icons.js";
+import { SelectLabelRow as t } from "./SelectField.js";
+import { SelectPopover as n } from "./SelectPopover.js";
+import { useId as r, useState as i } from "react";
+import { Fragment as a, jsx as o, jsxs as s } from "react/jsx-runtime";
+//#region src/SelectIconPicker.tsx
+function c({ label: c, options: l, value: u, onChange: d, help: f, hint: p, error: m, disabled: h = !1, unknownLabel: g = "Outro ícone", placeholder: _ = "Escolha um ícone", columns: v = 6 }) {
+	let y = r(), [b, x] = i(!1), S = l.find((e) => e.value === u), C = (e) => {
+		d(e), x(!1);
+	}, w = /* @__PURE__ */ s("button", {
+		id: y,
+		type: "button",
+		className: `select-input select-iconpicker__trigger${m ? " select-input--error" : ""}`,
+		onClick: () => !h && x((e) => !e),
+		disabled: h,
+		"aria-haspopup": "dialog",
+		"aria-expanded": b,
+		"aria-invalid": m ? !0 : void 0,
+		children: [S ? /* @__PURE__ */ s(a, { children: [/* @__PURE__ */ o("span", {
+			className: "select-iconpicker__glyph",
+			"aria-hidden": "true",
+			children: S.icon
+		}), /* @__PURE__ */ o("span", {
+			className: "select-iconpicker__name",
+			children: S.label
+		})] }) : /* @__PURE__ */ o("span", {
+			className: "select-iconpicker__name select-iconpicker__name--muted",
+			children: u ? g : _
+		}), /* @__PURE__ */ o("span", {
+			className: "select-iconpicker__chevron",
+			"aria-hidden": "true",
+			children: /* @__PURE__ */ o(e, {})
+		})]
+	});
+	return /* @__PURE__ */ s("div", {
+		className: "select-field",
+		children: [
+			(c || f) && /* @__PURE__ */ o(t, {
+				htmlFor: y,
+				label: c,
+				help: f
+			}),
+			/* @__PURE__ */ o(n, {
+				active: b,
+				onClose: () => x(!1),
+				placement: "bottom-start",
+				role: "dialog",
+				activator: w,
+				children: /* @__PURE__ */ o("div", {
+					className: "select-iconpicker__grid",
+					role: "listbox",
+					"aria-label": c ?? "Ícones",
+					style: { gridTemplateColumns: `repeat(${v}, 2.5rem)` },
+					children: l.map((e) => /* @__PURE__ */ o("button", {
+						type: "button",
+						role: "option",
+						"aria-selected": e.value === u,
+						"aria-label": e.label,
+						title: e.label,
+						className: `select-iconpicker__option${e.value === u ? " is-selected" : ""}`,
+						onClick: () => C(e.value),
+						children: e.icon
+					}, e.value))
+				})
+			}),
+			m ? /* @__PURE__ */ o("p", {
+				className: "select-field__error",
+				children: m
+			}) : p ? /* @__PURE__ */ o("p", {
+				className: "select-field__hint",
+				children: p
+			}) : null
+		]
+	});
+}
+//#endregion
+export { c as SelectIconPicker };
+
+//# sourceMappingURL=SelectIconPicker.js.map

package/dist/SelectIconTile.js

@@ -0,0 +1,17 @@
+/* empty css           */
+import { forwardRef as e } from "react";
+import { jsx as t } from "react/jsx-runtime";
+//#region src/SelectIconTile.tsx
+var n = e(function({ icon: e, tone: n = "neutral", size: r = "md", className: i, ...a }, o) {
+	return /* @__PURE__ */ t("span", {
+		ref: o,
+		"aria-hidden": "true",
+		...a,
+		className: `select-icontile select-icontile--${n} select-icontile--${r}${i ? " " + i : ""}`,
+		children: e
+	});
+});
+//#endregion
+export { n as SelectIconTile };
+
+//# sourceMappingURL=SelectIconTile.js.map

package/dist/SelectIdentityFooter.js

@@ -0,0 +1,30 @@
+import { forwardRef as e } from "react";
+import { jsx as t, jsxs as n } from "react/jsx-runtime";
+//#region src/SelectIdentityFooter.tsx
+var r = e(function({ email: e, onSignOut: r, signOutLabel: i = "Sair", prefix: a = "Conectado como", className: o, ...s }, c) {
+	return /* @__PURE__ */ n("span", {
+		ref: c,
+		...s,
+		className: `select-identity${o ? " " + o : ""}`,
+		children: [/* @__PURE__ */ n("span", {
+			className: "select-identity__text",
+			children: [
+				a,
+				" ",
+				/* @__PURE__ */ t("span", {
+					className: "select-identity__email",
+					children: e
+				})
+			]
+		}), r && /* @__PURE__ */ t("button", {
+			type: "button",
+			className: "select-identity__action",
+			onClick: r,
+			children: i
+		})]
+	});
+});
+//#endregion
+export { r as SelectIdentityFooter };
+
+//# sourceMappingURL=SelectIdentityFooter.js.map

package/dist/SelectImageField.js

@@ -0,0 +1,56 @@
+/* empty css           */
+import { SelectImageUploadField as e } from "./SelectImageUploadField.js";
+import { forwardRef as t, useState as n } from "react";
+import { jsx as r, jsxs as i } from "react/jsx-runtime";
+//#region src/SelectImageField.tsx
+function a(e) {
+	return new Promise((t, n) => {
+		let r = new FileReader();
+		r.onload = () => t(String(r.result)), r.onerror = () => n(r.error), r.readAsDataURL(e);
+	});
+}
+var o = t(function({ label: t, value: o, onChange: s, accept: c = "image/*", maxSizeMB: l = 3, urlPlaceholder: u, hint: d, uploadFile: f, className: p, ...m }, h) {
+	let [g, _] = n([]), [v, y] = n(null), b = o ? [o] : [], x = async (e) => {
+		let t = e[0];
+		if (!t) {
+			_([]);
+			return;
+		}
+		if (y(null), !f) {
+			s(await a(t)), _([]);
+			return;
+		}
+		_([t]);
+		try {
+			s(await f(t));
+		} catch (e) {
+			y(e instanceof Error ? e.message : "Não foi possível enviar a imagem.");
+		} finally {
+			_([]);
+		}
+	};
+	return /* @__PURE__ */ i("div", {
+		ref: h,
+		...m,
+		className: `select-imagefield${p ? " " + p : ""}`,
+		children: [/* @__PURE__ */ r(e, {
+			label: t,
+			mode: "single",
+			files: g,
+			onFilesChange: (e) => void x(e),
+			urls: g.length ? [] : b,
+			onUrlsChange: (e) => s(e[0] ?? ""),
+			accept: c,
+			maxSizeMB: l,
+			urlPlaceholder: u,
+			helpText: d
+		}), v && /* @__PURE__ */ r("span", {
+			className: "select-imagefield__error",
+			children: v
+		})]
+	});
+});
+//#endregion
+export { o as SelectImageField, a as fileToBase64 };
+
+//# sourceMappingURL=SelectImageField.js.map