@selectwin/kit 0.1.197 → 0.1.198

package/dist/SelectTileMap.js

@@ -0,0 +1,268 @@
+/* empty css           */
+import { FloatingChartTooltip as e, useChartTooltip as t } from "./chartTip.js";
+import { forwardRef as n } from "react";
+import { jsx as r, jsxs as i } from "react/jsx-runtime";
+//#region src/SelectTileMap.tsx
+var a = n(function({ tiles: n, color: a = "var(--select-chart-1)", tileSize: o = 36, gap: s = 5, format: c = (e) => String(e), legend: l = !0, className: u, style: d, ...f }, p) {
+	let m = t(), h = Math.max(0, ...n.map((e) => e.value ?? 0)), g = Math.max(0, ...n.map((e) => e.col)) + 1, _ = Math.max(0, ...n.map((e) => e.row)) + 1, v = o + s, y = {
+		width: g * v - s,
+		height: _ * v - s
+	};
+	return /* @__PURE__ */ i("div", {
+		ref: p,
+		...f,
+		className: `select-tilemap${u ? " " + u : ""}`,
+		style: {
+			...d,
+			"--tile-color": a
+		},
+		children: [
+			/* @__PURE__ */ r("div", {
+				className: "select-tilemap__grid",
+				style: y,
+				role: "list",
+				children: n.map((e) => {
+					let t = e.value ?? 0, n = h > 0 && t > 0 ? Math.sqrt(t / h) : 0, i = Math.round(10 + n * 88);
+					return /* @__PURE__ */ r("div", {
+						role: "listitem",
+						"aria-label": `${e.title ?? e.label}${t > 0 ? `: ${String(c(t))}` : ""}`,
+						className: `select-tilemap__tile${t > 0 ? "" : " select-tilemap__tile--empty"}`,
+						style: {
+							left: e.col * v,
+							top: e.row * v,
+							width: o,
+							height: o,
+							...t > 0 ? {
+								background: `color-mix(in srgb, var(--tile-color) ${i}%, var(--select-surface))`,
+								color: n > .55 ? "#fff" : "var(--select-text)"
+							} : null
+						},
+						onMouseEnter: (n) => {
+							let r = n.currentTarget.getBoundingClientRect(), i = r.top < 72 ? "bottom" : "top";
+							m.show({
+								x: r.left + r.width / 2,
+								y: i === "bottom" ? r.bottom : r.top,
+								place: i,
+								title: e.title ?? e.label,
+								rows: [{
+									label: e.label,
+									value: t > 0 ? c(t) : "—",
+									color: a
+								}]
+							});
+						},
+						onMouseLeave: m.hide,
+						children: e.label
+					}, e.key);
+				})
+			}),
+			l && /* @__PURE__ */ i("div", {
+				className: "select-tilemap__legend",
+				"aria-hidden": "true",
+				children: [
+					/* @__PURE__ */ r("span", { children: "menos" }),
+					/* @__PURE__ */ r("span", { className: "select-tilemap__scale" }),
+					/* @__PURE__ */ r("span", { children: "mais" })
+				]
+			}),
+			/* @__PURE__ */ r(e, {
+				tip: m.tip,
+				onDismiss: m.hide
+			})
+		]
+	});
+}), o = [
+	{
+		key: "RR",
+		label: "RR",
+		title: "Roraima",
+		col: 1,
+		row: 0
+	},
+	{
+		key: "AP",
+		label: "AP",
+		title: "Amapá",
+		col: 3,
+		row: 0
+	},
+	{
+		key: "AM",
+		label: "AM",
+		title: "Amazonas",
+		col: 1,
+		row: 1
+	},
+	{
+		key: "PA",
+		label: "PA",
+		title: "Pará",
+		col: 2,
+		row: 1
+	},
+	{
+		key: "MA",
+		label: "MA",
+		title: "Maranhão",
+		col: 3,
+		row: 1
+	},
+	{
+		key: "CE",
+		label: "CE",
+		title: "Ceará",
+		col: 4,
+		row: 1
+	},
+	{
+		key: "RN",
+		label: "RN",
+		title: "Rio Grande do Norte",
+		col: 5,
+		row: 1
+	},
+	{
+		key: "AC",
+		label: "AC",
+		title: "Acre",
+		col: 0,
+		row: 2
+	},
+	{
+		key: "RO",
+		label: "RO",
+		title: "Rondônia",
+		col: 1,
+		row: 2
+	},
+	{
+		key: "TO",
+		label: "TO",
+		title: "Tocantins",
+		col: 2,
+		row: 2
+	},
+	{
+		key: "PI",
+		label: "PI",
+		title: "Piauí",
+		col: 3,
+		row: 2
+	},
+	{
+		key: "PE",
+		label: "PE",
+		title: "Pernambuco",
+		col: 4,
+		row: 2
+	},
+	{
+		key: "PB",
+		label: "PB",
+		title: "Paraíba",
+		col: 5,
+		row: 2
+	},
+	{
+		key: "MT",
+		label: "MT",
+		title: "Mato Grosso",
+		col: 1,
+		row: 3
+	},
+	{
+		key: "GO",
+		label: "GO",
+		title: "Goiás",
+		col: 2,
+		row: 3
+	},
+	{
+		key: "BA",
+		label: "BA",
+		title: "Bahia",
+		col: 3,
+		row: 3
+	},
+	{
+		key: "SE",
+		label: "SE",
+		title: "Sergipe",
+		col: 4,
+		row: 3
+	},
+	{
+		key: "AL",
+		label: "AL",
+		title: "Alagoas",
+		col: 5,
+		row: 3
+	},
+	{
+		key: "MS",
+		label: "MS",
+		title: "Mato Grosso do Sul",
+		col: 1,
+		row: 4
+	},
+	{
+		key: "DF",
+		label: "DF",
+		title: "Distrito Federal",
+		col: 2,
+		row: 4
+	},
+	{
+		key: "MG",
+		label: "MG",
+		title: "Minas Gerais",
+		col: 3,
+		row: 4
+	},
+	{
+		key: "ES",
+		label: "ES",
+		title: "Espírito Santo",
+		col: 4,
+		row: 4
+	},
+	{
+		key: "PR",
+		label: "PR",
+		title: "Paraná",
+		col: 2,
+		row: 5
+	},
+	{
+		key: "SP",
+		label: "SP",
+		title: "São Paulo",
+		col: 3,
+		row: 5
+	},
+	{
+		key: "RJ",
+		label: "RJ",
+		title: "Rio de Janeiro",
+		col: 4,
+		row: 5
+	},
+	{
+		key: "SC",
+		label: "SC",
+		title: "Santa Catarina",
+		col: 2,
+		row: 6
+	},
+	{
+		key: "RS",
+		label: "RS",
+		title: "Rio Grande do Sul",
+		col: 2,
+		row: 7
+	}
+];
+//#endregion
+export { o as SELECT_BR_UF_TILES, a as SelectTileMap };
+
+//# sourceMappingURL=SelectTileMap.js.map

package/dist/SelectTimeline.js

@@ -0,0 +1,76 @@
+/* empty css           */
+import { forwardRef as e } from "react";
+import { jsx as t, jsxs as n } from "react/jsx-runtime";
+//#region src/SelectTimeline.tsx
+var r = {
+	success: "var(--select-success-text)",
+	critical: "var(--select-danger-text)",
+	warning: "var(--select-warning-text)",
+	info: "var(--select-info-text)",
+	default: "var(--select-text-secondary)"
+}, i = {
+	success: "var(--select-dot-success)",
+	critical: "var(--select-dot-critical)",
+	warning: "var(--select-dot-warning)",
+	info: "var(--select-chart-1)",
+	default: "var(--select-text-muted)"
+}, a = e(function({ items: e, markers: a = "outcome", timePosition: o = "end", className: s, style: c, ...l }, u) {
+	var d;
+	let f = {
+		"--tl-final": r[e.length ? ((d = e[0]) == null ? void 0 : d.tone) ?? "default" : "default"],
+		...c
+	}, p = a === "each", m = o === "start";
+	return /* @__PURE__ */ t("ul", {
+		ref: u,
+		...l,
+		className: `select-timeline${p ? " select-timeline--each" : ""}${m ? " select-timeline--timestart" : ""}${s ? " " + s : ""}`,
+		style: f,
+		children: e.map((e, r) => {
+			let a = !p && r === 0, o = p ? { "--tl-dot": i[e.tone ?? "default"] } : void 0;
+			return /* @__PURE__ */ n("li", {
+				className: "select-timeline__item",
+				children: [
+					m && e.timestamp != null && /* @__PURE__ */ t("span", {
+						className: "select-timeline__when",
+						children: e.timestamp
+					}),
+					/* @__PURE__ */ t("span", {
+						className: `select-timeline__dot${a ? " select-timeline__dot--final" : ""}${p ? " select-timeline__dot--toned" : ""}`,
+						style: o,
+						"aria-hidden": "true"
+					}),
+					/* @__PURE__ */ n("div", {
+						className: "select-timeline__body",
+						children: [
+							/* @__PURE__ */ n("div", {
+								className: "select-timeline__head",
+								children: [/* @__PURE__ */ n("span", {
+									className: "select-timeline__title",
+									children: [e.title, e.badge != null && /* @__PURE__ */ t("span", {
+										className: "select-timeline__badge",
+										children: e.badge
+									})]
+								}), !m && e.timestamp != null && /* @__PURE__ */ t("span", {
+									className: "select-timeline__time",
+									children: e.timestamp
+								})]
+							}),
+							e.description != null && /* @__PURE__ */ t("p", {
+								className: "select-timeline__desc",
+								children: e.description
+							}),
+							e.content != null && /* @__PURE__ */ t("div", {
+								className: "select-timeline__content",
+								children: e.content
+							})
+						]
+					})
+				]
+			}, r);
+		})
+	});
+});
+//#endregion
+export { a as SelectTimeline };
+
+//# sourceMappingURL=SelectTimeline.js.map

package/dist/SelectToast.js

@@ -0,0 +1,159 @@
+/* empty css           */
+import { SelectButton as e } from "./SelectButton.js";
+import { CloseIcon as t } from "./icons.js";
+import { useSelectMessages as n } from "./SelectLocale.js";
+import { createContext as r, useCallback as i, useContext as a, useEffect as o, useMemo as s, useRef as c, useState as l } from "react";
+import { jsx as u, jsxs as d } from "react/jsx-runtime";
+import { createPortal as f } from "react-dom";
+//#region src/SelectToast.tsx
+var p = r(null), m = 220, h = 6e3, g = 8, _ = .04, v = 5;
+function y({ variant: e }) {
+	return e === "neutral" ? null : /* @__PURE__ */ d("svg", {
+		className: "select-toast__icon",
+		viewBox: "0 0 20 20",
+		fill: "none",
+		stroke: "currentColor",
+		strokeWidth: "1.8",
+		strokeLinecap: "round",
+		strokeLinejoin: "round",
+		"aria-hidden": "true",
+		children: [
+			/* @__PURE__ */ u("circle", {
+				cx: "10",
+				cy: "10",
+				r: "8"
+			}),
+			e === "success" && /* @__PURE__ */ u("path", { d: "M6.5 10.2l2.3 2.3 4.7-4.9" }),
+			e === "error" && /* @__PURE__ */ u("path", { d: "M10 6v4.6M10 13.6v.1" }),
+			e === "info" && /* @__PURE__ */ u("path", { d: "M10 9v5M10 6.2v.1" })
+		]
+	});
+}
+function b({ children: r }) {
+	let a = n().common, [b, x] = l([]), [S, C] = l(!1), w = c(0), T = c(/* @__PURE__ */ new Map()), E = i((e) => {
+		x((t) => t.filter((t) => t.id !== e)), T.current.delete(e);
+	}, []), D = i((e) => {
+		let t = T.current.get(e);
+		t != null && t.timer && clearTimeout(t.timer), x((t) => t.map((t) => t.id === e ? {
+			...t,
+			exiting: !0
+		} : t)), T.current.set(e, {
+			remaining: 0,
+			startedAt: null,
+			timer: setTimeout(() => E(e), m)
+		});
+	}, [E]), O = i((e) => {
+		let t = T.current.get(e);
+		!t || t.startedAt !== null || t.remaining <= 0 || (t.startedAt = Date.now(), t.timer = setTimeout(() => D(e), t.remaining));
+	}, [D]), k = i((e, t) => {
+		let n = ++w.current, r = (t == null ? void 0 : t.duration) ?? h;
+		x((i) => [...i, {
+			id: n,
+			content: e,
+			variant: (t == null ? void 0 : t.variant) ?? "neutral",
+			action: t == null ? void 0 : t.action,
+			duration: r
+		}]), r > 0 && (T.current.set(n, {
+			remaining: r,
+			startedAt: null
+		}), O(n));
+	}, [O]), A = i(() => {
+		C(!0), T.current.forEach((e) => {
+			e.startedAt !== null && e.timer && (clearTimeout(e.timer), e.remaining -= Date.now() - e.startedAt, e.startedAt = null);
+		});
+	}, []), j = i(() => {
+		C(!1), b.forEach((e) => !e.exiting && O(e.id));
+	}, [b, O]);
+	o(() => {
+		let e = T.current;
+		return () => {
+			e.forEach((e) => e.timer && clearTimeout(e.timer)), e.clear();
+		};
+	}, []);
+	let M = s(() => ({
+		show: k,
+		success: (e, t) => k(e, {
+			variant: "success",
+			duration: t
+		}),
+		error: (e, t) => k(e, {
+			variant: "error",
+			duration: t
+		}),
+		info: (e, t) => k(e, {
+			variant: "info",
+			duration: t
+		})
+	}), [k]);
+	return /* @__PURE__ */ d(p.Provider, {
+		value: M,
+		children: [r, b.length > 0 && f(/* @__PURE__ */ u("div", {
+			className: `select select-toasts${S ? " is-paused" : ""}`,
+			role: "region",
+			"aria-live": "polite",
+			"aria-label": a.notifications,
+			onMouseEnter: A,
+			onMouseLeave: j,
+			onFocus: A,
+			onBlur: (e) => {
+				e.currentTarget.contains(e.relatedTarget) || j();
+			},
+			children: b.map((n, r) => {
+				let i = b.length - 1 - r, o = n.exiting || i >= v, s = {
+					transform: `translate(-50%, ${-i * g}px) scale(${1 - i * _})`,
+					opacity: +!o,
+					zIndex: 1e3 - i,
+					pointerEvents: i === 0 && !n.exiting ? "auto" : "none"
+				};
+				return /* @__PURE__ */ d("div", {
+					className: `select-toast select-toast--${n.variant}`,
+					role: "status",
+					style: s,
+					children: [
+						/* @__PURE__ */ u(y, { variant: n.variant }),
+						/* @__PURE__ */ d("span", {
+							className: "select-toast__content",
+							children: [/* @__PURE__ */ u("span", {
+								className: "select-toast__text",
+								children: n.content
+							}), n.action ? /* @__PURE__ */ u("span", {
+								className: "select-toast__actions",
+								children: /* @__PURE__ */ u(e, {
+									variant: "secondary",
+									size: "sm",
+									inline: !0,
+									onClick: () => {
+										var e;
+										(e = n.action) == null || e.onAction(), D(n.id);
+									},
+									children: n.action.label
+								})
+							}) : null]
+						}),
+						/* @__PURE__ */ u("button", {
+							type: "button",
+							className: "select-toast__close",
+							"aria-label": a.close,
+							onClick: () => D(n.id),
+							children: /* @__PURE__ */ u(t, {})
+						}),
+						n.duration > 0 && !n.exiting && /* @__PURE__ */ u("span", {
+							className: "select-toast__time",
+							"aria-hidden": "true",
+							style: { animationDuration: `${n.duration}ms` }
+						})
+					]
+				}, n.id);
+			})
+		}), document.body)]
+	});
+}
+function x() {
+	let e = a(p);
+	if (!e) throw Error("useSelectToast must be used within a SelectToastProvider");
+	return e;
+}
+//#endregion
+export { b as SelectToastProvider, x as useSelectToast };
+
+//# sourceMappingURL=SelectToast.js.map

package/dist/SelectToggle.js

@@ -0,0 +1,80 @@
+import { SelectSwitch as e } from "./SelectSwitch.js";
+import { forwardRef as t, useId as n } from "react";
+import { jsx as r, jsxs as i } from "react/jsx-runtime";
+//#region src/SelectToggle.tsx
+var a = t(function({ children: e, scroll: t = !1, bordered: n = !1, className: i, ...a }, o) {
+	return /* @__PURE__ */ r("div", {
+		ref: o,
+		...a,
+		className: `select-togglelist${t ? " select-togglelist--scroll" : ""}${n ? " select-togglelist--bordered" : ""}${i ? " " + i : ""}`,
+		children: e
+	});
+}), o = t(function({ icon: t, label: a, checked: o, onChange: s, disabled: c = !1, description: l, children: u, className: d, ...f }, p) {
+	let m = n(), h = typeof a == "string" ? a : void 0;
+	return l == null && u == null ? /* @__PURE__ */ i("div", {
+		ref: p,
+		...f,
+		className: `select-togglerow${c ? " select-togglerow--disabled" : ""}${d ? " " + d : ""}`,
+		children: [
+			t && /* @__PURE__ */ r("span", {
+				className: "select-togglerow__icon",
+				children: t
+			}),
+			/* @__PURE__ */ r("span", {
+				className: "select-togglerow__label",
+				children: a
+			}),
+			/* @__PURE__ */ r(e, {
+				checked: o,
+				onChange: s,
+				disabled: c,
+				label: h
+			})
+		]
+	}) : /* @__PURE__ */ i("div", {
+		ref: p,
+		...f,
+		className: `select-togglerow select-togglerow--rich${o ? " is-on" : ""}${c ? " select-togglerow--disabled" : ""}${d ? " " + d : ""}`,
+		children: [/* @__PURE__ */ i("div", {
+			className: "select-togglerow__head",
+			children: [
+				t && /* @__PURE__ */ r("span", {
+					className: "select-togglerow__icon",
+					children: t
+				}),
+				/* @__PURE__ */ i("span", {
+					className: "select-togglerow__text",
+					children: [/* @__PURE__ */ r("span", {
+						className: "select-togglerow__label",
+						id: m,
+						children: a
+					}), l != null && /* @__PURE__ */ r("span", {
+						className: "select-togglerow__desc",
+						children: l
+					})]
+				}),
+				/* @__PURE__ */ r(e, {
+					checked: o,
+					onChange: s,
+					disabled: c,
+					label: h,
+					"aria-labelledby": h ? void 0 : m
+				})
+			]
+		}), u != null && /* @__PURE__ */ r("div", {
+			className: "select-togglerow__bodywrap",
+			children: /* @__PURE__ */ r("div", {
+				className: "select-togglerow__bodyclip",
+				"aria-hidden": !o,
+				children: /* @__PURE__ */ r("div", {
+					className: "select-togglerow__body",
+					children: u
+				})
+			})
+		})]
+	});
+});
+//#endregion
+export { a as SelectToggleList, o as SelectToggleRow };
+
+//# sourceMappingURL=SelectToggle.js.map

package/dist/SelectTogglePanel.js

@@ -0,0 +1,44 @@
+import { SelectSwitch as e } from "./SelectSwitch.js";
+import { forwardRef as t } from "react";
+import { jsx as n, jsxs as r } from "react/jsx-runtime";
+//#region src/SelectTogglePanel.tsx
+var i = t(function({ icon: t, title: i, checked: a, onChange: o, children: s, disabled: c = !1, className: l, ...u }, d) {
+	return /* @__PURE__ */ r("div", {
+		ref: d,
+		...u,
+		className: `select-togglepanel${a ? " is-on" : ""}${l ? " " + l : ""}`,
+		children: [/* @__PURE__ */ r("div", {
+			className: "select-togglepanel__header",
+			children: [
+				/* @__PURE__ */ n(e, {
+					checked: a,
+					onChange: o,
+					disabled: c,
+					label: typeof i == "string" ? i : void 0
+				}),
+				t && /* @__PURE__ */ n("span", {
+					className: "select-togglepanel__icon",
+					children: t
+				}),
+				/* @__PURE__ */ n("span", {
+					className: "select-togglepanel__title",
+					children: i
+				})
+			]
+		}), s && /* @__PURE__ */ n("div", {
+			className: "select-togglepanel__bodywrap",
+			children: /* @__PURE__ */ n("div", {
+				className: "select-togglepanel__bodyclip",
+				"aria-hidden": !a,
+				children: /* @__PURE__ */ n("div", {
+					className: "select-togglepanel__body",
+					children: s
+				})
+			})
+		})]
+	});
+});
+//#endregion
+export { i as SelectTogglePanel };
+
+//# sourceMappingURL=SelectTogglePanel.js.map