@selectwin/kit 0.1.218 → 0.1.220

package/dist/SelectLocale.js

@@ -87,6 +87,17 @@ var r = {
 			progress: (e, t) => `${e} de ${t}`
 		},
 		sideNav: { pending: (e) => `${e} (com pendências)` },
+		carousel: {
+			label: "Destaques",
+			carousel: "carrossel",
+			slide: "slide",
+			position: (e, t) => `${e} de ${t}`,
+			previous: "Anterior",
+			next: "Próximo",
+			pause: "Parar de passar sozinho",
+			play: "Passar sozinho",
+			open: (e) => `Ver: ${e}`
+		},
 		fees: {
 			gross: "Valor bruto",
 			net: "Valor líquido",
@@ -180,6 +191,17 @@ var r = {
 			progress: (e, t) => `${e} of ${t}`
 		},
 		sideNav: { pending: (e) => `${e} (pending)` },
+		carousel: {
+			label: "Highlights",
+			carousel: "carousel",
+			slide: "slide",
+			position: (e, t) => `${e} of ${t}`,
+			previous: "Previous",
+			next: "Next",
+			pause: "Stop rotating",
+			play: "Rotate automatically",
+			open: (e) => `Open: ${e}`
+		},
 		fees: {
 			gross: "Gross amount",
 			net: "Net amount",

package/dist/SelectSetupGuide.d.ts

@@ -9,6 +9,12 @@ export interface SelectSetupStep {
     trailing?: ReactNode;
     /** A linha inteira vira botão e leva até a etapa (0.1.163). */
     onSelect?: () => void;
+    /**
+     * 0.1.220: a linha inteira é um LINK de verdade até a etapa — `to` é um endereço do app (o `<Link>` do roteador) e
+     * `href`, um de fora. Abre em outra aba, copia o endereço e o leitor de tela diz "link" (o `onSelect` é um botão).
+     */
+    to?: string;
+    href?: string;
 }
 export interface SelectSetupGroup {
     title: ReactNode;

package/dist/SelectSetupGuide.js

@@ -1,20 +1,22 @@
 /* empty css           */
-import { formatSelectNumber as e, useSelectLocale as t, useSelectMessages as n } from "./SelectLocale.js";
-import { useInsideFrame as r } from "./internal/frame.js";
-import { inertProps as i } from "./internal/inert.js";
-import { forwardRef as a, useEffect as o, useRef as s, useState as c } from "react";
-import { jsx as l, jsxs as u } from "react/jsx-runtime";
+import { safeHref as e } from "./internal/safeHref.js";
+import { formatSelectNumber as t, useSelectLocale as n, useSelectMessages as r } from "./SelectLocale.js";
+import { useInsideFrame as i } from "./internal/frame.js";
+import { inertProps as a } from "./internal/inert.js";
+import { forwardRef as o, useEffect as s, useRef as c, useState as l } from "react";
+import { Fragment as u, jsx as d, jsxs as f } from "react/jsx-runtime";
+import { Link as p } from "react-router-dom";
 //#region src/SelectSetupGuide.tsx
-function d({ status: e }) {
-	return /* @__PURE__ */ l("span", {
+function m({ status: e }) {
+	return /* @__PURE__ */ d("span", {
 		className: `select-setupguide__icon select-setupguide__icon--${e}`,
 		"aria-hidden": "true",
-		children: e === "done" && /* @__PURE__ */ l("svg", {
+		children: e === "done" && /* @__PURE__ */ d("svg", {
 			viewBox: "0 0 16 16",
 			width: "10",
 			height: "10",
 			fill: "none",
-			children: /* @__PURE__ */ l("path", {
+			children: /* @__PURE__ */ d("path", {
 				d: "M3.5 8.5l3 3 6-7",
 				stroke: "currentColor",
 				strokeWidth: "2",
@@ -24,7 +26,7 @@ function d({ status: e }) {
 		})
 	});
 }
-var f = /* @__PURE__ */ l("svg", {
+var h = /* @__PURE__ */ d("svg", {
 	viewBox: "0 0 20 20",
 	width: "16",
 	height: "16",
@@ -34,120 +36,134 @@ var f = /* @__PURE__ */ l("svg", {
 	strokeLinecap: "round",
 	strokeLinejoin: "round",
 	"aria-hidden": "true",
-	children: /* @__PURE__ */ l("path", { d: "M8 5l5 5-5 5" })
+	children: /* @__PURE__ */ d("path", { d: "M8 5l5 5-5 5" })
 });
-function p({ group: e, justDone: t }) {
-	let r = n().setupGuide, [a, o] = c(!!(e.collapsible && e.defaultCollapsed)), s = !e.collapsible || !a;
-	return /* @__PURE__ */ u("div", {
-		className: `select-setupguide__group${s ? "" : " is-collapsed"}`,
-		children: [e.collapsible ? /* @__PURE__ */ u("button", {
+function g({ group: t, justDone: n }) {
+	let i = r().setupGuide, [o, s] = l(!!(t.collapsible && t.defaultCollapsed)), c = !t.collapsible || !o;
+	return /* @__PURE__ */ f("div", {
+		className: `select-setupguide__group${c ? "" : " is-collapsed"}`,
+		children: [t.collapsible ? /* @__PURE__ */ f("button", {
 			type: "button",
 			className: "select-setupguide__grouptitle select-setupguide__grouptoggle",
-			"aria-expanded": s,
-			onClick: () => o((e) => !e),
-			children: [/* @__PURE__ */ l("span", { children: e.title }), f]
-		}) : /* @__PURE__ */ l("div", {
+			"aria-expanded": c,
+			onClick: () => s((e) => !e),
+			children: [/* @__PURE__ */ d("span", { children: t.title }), h]
+		}) : /* @__PURE__ */ d("div", {
 			className: "select-setupguide__grouptitle",
-			children: e.title
-		}), /* @__PURE__ */ l("div", {
+			children: t.title
+		}), /* @__PURE__ */ d("div", {
 			className: "select-setupguide__collapse",
-			...i(!s),
-			children: /* @__PURE__ */ l("ul", {
+			...a(!c),
+			children: /* @__PURE__ */ d("ul", {
 				className: "select-setupguide__list",
-				children: e.steps.map((e) => /* @__PURE__ */ u("li", {
-					className: `select-setupguide__step is-${e.status}${e.onSelect ? " is-link" : ""}${t.has(e.id) ? " is-just-done" : ""}`,
-					children: [
-						/* @__PURE__ */ l(d, { status: e.status }),
-						/* @__PURE__ */ u("span", {
-							className: "select-setupguide__text",
-							children: [e.onSelect ? /* @__PURE__ */ u("button", {
-								type: "button",
-								className: "select-setupguide__steptitle select-setupguide__go",
-								onClick: e.onSelect,
-								children: [e.title, /* @__PURE__ */ u("span", {
-									className: "select-setupguide__sr",
-									children: [" — ", r[e.status]]
+				children: t.steps.map((t) => {
+					let r = t.to != null || t.href != null ? e(t.to ?? t.href) : void 0, a = r !== void 0, o = /* @__PURE__ */ f(u, { children: [t.title, /* @__PURE__ */ f("span", {
+						className: "select-setupguide__sr",
+						children: [" — ", i[t.status]]
+					})] });
+					return /* @__PURE__ */ f("li", {
+						className: `select-setupguide__step is-${t.status}${t.onSelect || a ? " is-link" : ""}${n.has(t.id) ? " is-just-done" : ""}`,
+						children: [
+							/* @__PURE__ */ d(m, { status: t.status }),
+							/* @__PURE__ */ f("span", {
+								className: "select-setupguide__text",
+								children: [a && t.to != null ? /* @__PURE__ */ d(p, {
+									to: r,
+									className: "select-setupguide__steptitle select-setupguide__go",
+									children: o
+								}) : a ? /* @__PURE__ */ d("a", {
+									href: r,
+									className: "select-setupguide__steptitle select-setupguide__go",
+									children: o
+								}) : t.onSelect ? /* @__PURE__ */ f("button", {
+									type: "button",
+									className: "select-setupguide__steptitle select-setupguide__go",
+									onClick: t.onSelect,
+									children: [t.title, /* @__PURE__ */ f("span", {
+										className: "select-setupguide__sr",
+										children: [" — ", i[t.status]]
+									})]
+								}) : /* @__PURE__ */ f("span", {
+									className: "select-setupguide__steptitle",
+									children: [t.title, /* @__PURE__ */ f("span", {
+										className: "select-setupguide__sr",
+										children: [" — ", i[t.status]]
+									})]
+								}), t.description && /* @__PURE__ */ d("span", {
+									className: "select-setupguide__stepdesc",
+									children: t.description
 								})]
-							}) : /* @__PURE__ */ u("span", {
-								className: "select-setupguide__steptitle",
-								children: [e.title, /* @__PURE__ */ u("span", {
-									className: "select-setupguide__sr",
-									children: [" — ", r[e.status]]
-								})]
-							}), e.description && /* @__PURE__ */ l("span", {
-								className: "select-setupguide__stepdesc",
-								children: e.description
-							})]
-						}),
-						e.trailing ? /* @__PURE__ */ l("span", {
-							className: "select-setupguide__trailing",
-							children: e.trailing
-						}) : e.onSelect && e.status !== "done" ? /* @__PURE__ */ l("span", {
-							className: "select-setupguide__chevron",
-							children: f
-						}) : null
-					]
-				}, e.id))
+							}),
+							t.trailing ? /* @__PURE__ */ d("span", {
+								className: "select-setupguide__trailing",
+								children: t.trailing
+							}) : (t.onSelect || a) && t.status !== "done" ? /* @__PURE__ */ d("span", {
+								className: "select-setupguide__chevron",
+								children: h
+							}) : null
+						]
+					}, t.id);
+				})
 			})
 		})]
 	});
 }
-var m = a(function({ title: a, description: c, progress: d, actions: f, next: m, groups: h, minimized: g = !1, tone: _ = "default", className: v, ...y }, b) {
-	let x = n().setupGuide, S = t(), C = d && d.total > 0 ? Math.round(d.done / d.total * 100) : 0, w = r(), T = s(null), E = /* @__PURE__ */ new Set(), D = h.flatMap((e) => e.steps);
+var _ = o(function({ title: e, description: o, progress: l, actions: u, next: p, groups: m, minimized: h = !1, tone: _ = "default", className: v, ...y }, b) {
+	let x = r().setupGuide, S = n(), C = l && l.total > 0 ? Math.round(l.done / l.total * 100) : 0, w = i(), T = c(null), E = /* @__PURE__ */ new Set(), D = m.flatMap((e) => e.steps);
 	if (T.current) for (let e of D) e.status === "done" && T.current.get(e.id) !== "done" && E.add(e.id);
-	return o(() => {
+	return s(() => {
 		T.current = new Map(D.map((e) => [e.id, e.status]));
-	}), /* @__PURE__ */ u("section", {
+	}), /* @__PURE__ */ f("section", {
 		ref: b,
 		...y,
-		className: `select-setupguide${w ? " select-setupguide--nested" : ""}${g ? " is-minimized" : ""}${_ === "sandbox" ? " select-setupguide--sandbox" : ""}${v ? " " + v : ""}`,
-		children: [/* @__PURE__ */ u("div", {
+		className: `select-setupguide${w ? " select-setupguide--nested" : ""}${h ? " is-minimized" : ""}${_ === "sandbox" ? " select-setupguide--sandbox" : ""}${v ? " " + v : ""}`,
+		children: [/* @__PURE__ */ f("div", {
 			className: "select-setupguide__head",
 			children: [
-				/* @__PURE__ */ u("div", {
+				/* @__PURE__ */ f("div", {
 					className: "select-setupguide__heading",
-					children: [/* @__PURE__ */ l("h2", {
+					children: [/* @__PURE__ */ d("h2", {
 						className: "select-setupguide__title",
-						children: a
-					}), c && /* @__PURE__ */ l("p", {
+						children: e
+					}), o && /* @__PURE__ */ d("p", {
 						className: "select-setupguide__desc",
-						children: c
+						children: o
 					})]
 				}),
-				d && /* @__PURE__ */ u("div", {
+				l && /* @__PURE__ */ f("div", {
 					className: "select-setupguide__progress",
-					children: [/* @__PURE__ */ l("div", {
+					children: [/* @__PURE__ */ d("div", {
 						className: "select-setupguide__bar",
 						role: "progressbar",
 						"aria-valuemin": 0,
-						"aria-valuemax": d.total,
-						"aria-valuenow": d.done,
+						"aria-valuemax": l.total,
+						"aria-valuenow": l.done,
 						"aria-label": x.progressLabel,
-						children: /* @__PURE__ */ l("span", {
+						children: /* @__PURE__ */ d("span", {
 							className: "select-setupguide__fill",
 							style: { width: `${Math.max(C, 3)}%` }
 						})
-					}), /* @__PURE__ */ l("span", {
+					}), /* @__PURE__ */ d("span", {
 						className: "select-setupguide__count",
-						children: d.label ?? x.progress(e(d.done, S), e(d.total, S))
+						children: l.label ?? x.progress(t(l.done, S), t(l.total, S))
 					})]
 				}),
-				f && /* @__PURE__ */ l("div", {
+				u && /* @__PURE__ */ d("div", {
 					className: "select-setupguide__actions",
-					children: f
+					children: u
 				})
 			]
-		}), /* @__PURE__ */ l("div", {
+		}), /* @__PURE__ */ d("div", {
 			className: "select-setupguide__fold",
-			...i(g),
-			children: /* @__PURE__ */ u("div", {
+			...a(h),
+			children: /* @__PURE__ */ f("div", {
 				className: "select-setupguide__body",
-				children: [m && /* @__PURE__ */ l("div", {
+				children: [p && /* @__PURE__ */ d("div", {
 					className: "select-setupguide__next",
-					children: m
-				}), /* @__PURE__ */ l("div", {
+					children: p
+				}), /* @__PURE__ */ d("div", {
 					className: "select-setupguide__steps",
-					children: h.map((e, t) => /* @__PURE__ */ l(p, {
+					children: m.map((e, t) => /* @__PURE__ */ d(g, {
 						group: e,
 						justDone: E
 					}, t))
@@ -156,32 +172,32 @@ var m = a(function({ title: a, description: c, progress: d, actions: f, next: m,
 		})]
 	});
 });
-function h({ eyebrow: e, title: t, children: n, actions: r }) {
-	return /* @__PURE__ */ u("div", {
+function v({ eyebrow: e, title: t, children: n, actions: r }) {
+	return /* @__PURE__ */ f("div", {
 		className: "select-setupnext",
-		children: [/* @__PURE__ */ u("div", {
+		children: [/* @__PURE__ */ f("div", {
 			className: "select-setupnext__text",
 			children: [
-				e && /* @__PURE__ */ l("div", {
+				e && /* @__PURE__ */ d("div", {
 					className: "select-setupnext__eyebrow",
 					children: e
 				}),
-				/* @__PURE__ */ l("h3", {
+				/* @__PURE__ */ d("h3", {
 					className: "select-setupnext__title",
 					children: t
 				}),
-				n && /* @__PURE__ */ l("div", {
+				n && /* @__PURE__ */ d("div", {
 					className: "select-setupnext__body",
 					children: n
 				})
 			]
-		}), r && /* @__PURE__ */ l("div", {
+		}), r && /* @__PURE__ */ d("div", {
 			className: "select-setupnext__actions",
 			children: r
 		})]
 	});
 }
 //#endregion
-export { m as SelectSetupGuide, h as SelectSetupNext };
+export { _ as SelectSetupGuide, v as SelectSetupNext };
 
 //# sourceMappingURL=SelectSetupGuide.js.map

package/dist/SelectSparkBars.d.ts

@@ -0,0 +1,19 @@
+import { ComponentPropsWithoutRef, ReactNode } from 'react';
+import { SelectColumnTooltip } from './SelectColumnChart';
+type SelectSparkBarsOwnProps = {
+    data: number[];
+    /** A altura das barras, em px (padrão 96). */
+    height?: number;
+    color?: string;
+    /** Os rótulos embaixo, espalhados ("12/10", "19/10", "25/10"). */
+    labels?: ReactNode[];
+    /** O nome do gráfico: com ele, o gráfico entra no Tab e anda pelas setas. */
+    label?: string;
+    /** A dica de cada barra (o título e as linhas); `null` para nenhuma. */
+    tooltip?: (index: number) => SelectColumnTooltip | null;
+    /** A barra que o foco do teclado acende primeiro (padrão: a última). */
+    start?: number;
+};
+export type SelectSparkBarsProps = SelectSparkBarsOwnProps & Omit<ComponentPropsWithoutRef<'div'>, keyof SelectSparkBarsOwnProps>;
+export declare function SelectSparkBars({ data, height, color, labels, label, tooltip, start, className, ...rest }: SelectSparkBarsProps): import("react").JSX.Element;
+export {};

package/dist/SelectSparkBars.js

@@ -0,0 +1,98 @@
+/* empty css           */
+import { chartColor as e, useChartSize as t } from "./chartUtils.js";
+import { FloatingChartTooltip as n } from "./chartTip.js";
+import { tipSpeech as r, useChartPointer as i } from "./internal/chartPointer.js";
+import { useId as a, useReducer as o } from "react";
+import { jsx as s, jsxs as c } from "react/jsx-runtime";
+//#region src/SelectSparkBars.tsx
+function l({ data: l, height: u = 96, color: d, labels: f, label: p, tooltip: m, start: h, className: g, ..._ }) {
+	var v;
+	let { ref: y, width: b } = t(u), x = a(), [, S] = o((e) => e + 1, 0), C = d ?? e(0), w = l.length, T = Math.max(...l, 1), E = w > 0 && b > 0 ? Math.min(12, Math.max(1.5, (b - (w > 60 ? 1.5 : 3) * (w - 1)) / w)) : 0, D = w > 1 ? (b - E * w) / (w - 1) : 0, O = (e) => e * (E + D), k = (e) => u - e / T * (u - 8), { active: A, props: j } = i({
+		count: w,
+		indexAt: (e) => Math.floor((e + D / 2) / (E + D || 1)),
+		start: h,
+		focusable: p != null
+	}), M = A != null && m ? m(A) : null, N = M && A != null ? (v = y.current) == null ? void 0 : v.getBoundingClientRect() : void 0, P = A == null ? 0 : k(l[A] ?? 0), F = N != null && N.top + P < 96, I = w - 1;
+	return /* @__PURE__ */ c("div", {
+		..._,
+		ref: y,
+		className: `select-sparkbars${g ? " " + g : ""}`,
+		children: [
+			b > 0 && w > 0 && /* @__PURE__ */ c("svg", {
+				width: b,
+				height: u,
+				className: "select-chart",
+				...p == null ? { "aria-hidden": !0 } : {
+					role: "img",
+					"aria-label": p
+				},
+				...j,
+				children: [
+					/* @__PURE__ */ s("defs", { children: /* @__PURE__ */ c("linearGradient", {
+						id: `${x}-glow`,
+						x1: "0",
+						y1: "0",
+						x2: "0",
+						y2: "1",
+						children: [/* @__PURE__ */ s("stop", {
+							offset: "0%",
+							stopColor: C,
+							stopOpacity: .16
+						}), /* @__PURE__ */ s("stop", {
+							offset: "100%",
+							stopColor: C,
+							stopOpacity: 0
+						})]
+					}) }),
+					/* @__PURE__ */ s("rect", {
+						x: 0,
+						y: k(T) - 4,
+						width: O(I) + E,
+						height: u - k(T) + 4,
+						rx: 6,
+						fill: `url(#${x}-glow)`
+					}),
+					l.map((e, t) => /* @__PURE__ */ s("rect", {
+						className: `select-sparkbars__bar${A != null && A !== t ? " is-dim" : ""}`,
+						x: O(t),
+						y: k(e),
+						width: E,
+						height: u - k(e),
+						rx: E > 3 ? 1.5 : 0,
+						fill: C
+					}, t)),
+					/* @__PURE__ */ s("circle", {
+						className: "select-sparkbars__end",
+						cx: O(I) + E / 2,
+						cy: k(l[I] ?? 0) - 5,
+						r: 4,
+						fill: C
+					})
+				]
+			}),
+			f != null && f.length > 0 && /* @__PURE__ */ s("div", {
+				className: "select-sparkbars__labels",
+				children: f.map((e, t) => /* @__PURE__ */ s("span", { children: e }, t))
+			}),
+			p != null && /* @__PURE__ */ s("span", {
+				className: "select-visually-hidden",
+				"aria-live": "polite",
+				children: M ? r(M.title, M.rows) : ""
+			}),
+			/* @__PURE__ */ s(n, {
+				tip: M && N && A != null ? {
+					x: N.left + O(A) + E / 2,
+					y: F ? N.top + u + 2 : N.top + P - 6,
+					place: F ? "bottom" : "top",
+					title: M.title,
+					rows: M.rows
+				} : null,
+				onDismiss: S
+			})
+		]
+	});
+}
+//#endregion
+export { l as SelectSparkBars };
+
+//# sourceMappingURL=SelectSparkBars.js.map

package/dist/chartTip.d.ts

@@ -3,6 +3,8 @@ export interface ChartTipRow {
     label: ReactNode;
     value: ReactNode;
     color?: string;
+    /** 0.1.219: a linha da soma (sem o ponto, com o fio acima). */
+    total?: boolean;
 }
 export interface ChartTipState {
     x: number;

package/dist/icons.d.ts

@@ -154,6 +154,8 @@ export declare function UsersIcon(): import("react").JSX.Element;
 /** Três círculos sobrepostos (Iconsax colorfilter) — cor, identidade visual. */
 export declare function PaletteIcon(): import("react").JSX.Element;
 /** Duas barras (Iconsax pause) — pausar uma cobrança recorrente. */
+/** Tocar (0.1.220): o triângulo, o par do `PauseIcon` (o botão de passar sozinho do SelectCarousel). */
+export declare function PlayIcon(): import("react").JSX.Element;
 export declare function PauseIcon(): import("react").JSX.Element;
 /** Seta voltando em volta (Iconsax arrow-rotate-left) — o ESTORNO: o dinheiro que volta. Não é o
  *  `RefreshIcon` (recarregar), que desenha o mesmo gesto para "de novo". */