@logicplanes/kaeso-ui 0.4.1 → 0.4.3

package/dist/components/toast.js

@@ -1,31 +1,31 @@
 "use client";
-import { t as e } from "../chunks/cn-Isw2DnQX.js";
+import { t as e } from "../chunks/cn-Dj6sRgkF.js";
 import { r as t } from "../chunks/portal-context-BBbzDKmY.js";
 import { i as n } from "../chunks/context-BELWW79w.js";
-import { t as r } from "../chunks/icon-D5uD_mnL.js";
+import { t as r } from "../chunks/icon-D7ja-_Yk.js";
 import { t as i } from "../chunks/observe-resize-DhxhmoyB.js";
-import { r as a } from "../chunks/loader-DqOUwS1j.js";
-import { r as o } from "../chunks/swap-text-CC77iKJF.js";
-import { useLayoutEffect 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 { Alert02Icon as p, AlertCircleIcon as m, Cancel01Icon as h, CheckmarkCircle02Icon as g, InformationCircleIcon as _ } from "@hugeicons/core-free-icons";
-import { Toast as v } from "@base-ui/react/toast";
+import { r as a } from "../chunks/loader-DCfPndXa.js";
+import { r as o } from "../chunks/swap-text-Dr0Irxz6.js";
+import { forwardRef as s, useLayoutEffect as c, useRef as l, useState as u } from "react";
+import { Fragment as d, jsx as f, jsxs as p } from "react/jsx-runtime";
+import { Alert02Icon as m, AlertCircleIcon as h, Cancel01Icon as g, CheckmarkCircle02Icon as _, InformationCircleIcon as v } from "@hugeicons/core-free-icons";
+import { Toast as y } from "@base-ui/react/toast";
 //#region src/components/toast/toast.tsx
-var y = { tone: {
+var b = { tone: {
 	neutral: { classes: "" },
 	success: { classes: "text-success" },
 	error: { classes: "text-danger" },
 	warning: { classes: "text-warning" },
 	info: { classes: "text-info" },
 	loading: { classes: "text-toast-fg-secondary" }
-} }, b = { tone: "neutral" }, x = {
-	success: g,
-	error: m,
-	warning: p,
-	info: _
-}, S = /* @__PURE__ */ v.createToastManager();
-function C(e, t, n = {}) {
-	return S.add({
+} }, x = { tone: "neutral" }, S = {
+	success: _,
+	error: h,
+	warning: m,
+	info: v
+}, C = /* @__PURE__ */ y.createToastManager();
+function w(e, t, n = {}) {
+	return C.add({
 		title: t,
 		type: e,
 		...n.description === void 0 ? {} : { description: n.description },
@@ -38,19 +38,19 @@ function C(e, t, n = {}) {
 		} } : {}
 	});
 }
-var w = /* @__PURE__ */ Object.assign((e, t) => C("neutral", e, t), {
-	success: (e, t) => C("success", e, t),
-	error: (e, t) => C("error", e, t),
-	warning: (e, t) => C("warning", e, t),
-	info: (e, t) => C("info", e, t),
-	dismiss: (e) => S.close(e),
+var T = /* @__PURE__ */ Object.assign((e, t) => w("neutral", e, t), {
+	success: (e, t) => w("success", e, t),
+	error: (e, t) => w("error", e, t),
+	warning: (e, t) => w("warning", e, t),
+	info: (e, t) => w("info", e, t),
+	dismiss: (e) => C.close(e),
 	promise: (e, t) => {
 		let n = [
 			t.loading,
 			...typeof t.success == "string" ? [t.success] : [],
 			...typeof t.error == "string" ? [t.error] : []
 		];
-		return S.promise(e, {
+		return C.promise(e, {
 			loading: {
 				title: t.loading,
 				type: "loading",
@@ -71,63 +71,64 @@ var w = /* @__PURE__ */ Object.assign((e, t) => C("neutral", e, t), {
 		});
 	}
 });
-function T({ tone: t }) {
-	return t === "neutral" ? null : /* @__PURE__ */ d("span", {
-		className: e("flex shrink-0", y.tone[t].classes),
-		children: t === "loading" ? /* @__PURE__ */ d(a, { size: "sm" }) : /* @__PURE__ */ d(r, {
-			icon: x[t],
+function E({ tone: t }) {
+	return t === "neutral" ? null : /* @__PURE__ */ f("span", {
+		className: e("flex shrink-0", b.tone[t].classes),
+		children: t === "loading" ? /* @__PURE__ */ f(a, { size: "sm" }) : /* @__PURE__ */ f(r, {
+			icon: S[t],
 			size: "sm"
 		})
 	});
 }
-var E = "relative flex min-h-44 max-w-560 items-center gap-10 bg-toast py-8 text-body font-medium text-toast-fg shadow-toast", D = "inline-flex h-32 shrink-0 cursor-pointer items-center rounded-pill bg-toast-action px-12 text-body font-medium text-toast-fg transition-control hover:bg-toast-action-hover focus-ring", O = "k-toast-close absolute -top-6 -left-6 inline-flex size-20 cursor-pointer items-center justify-center rounded-pill bg-toast text-toast-fg-secondary shadow-toast hover:text-toast-fg focus-ring";
-function k(e, t) {
-	let n = c(null), [r, i] = l(!1);
-	return s(() => {
+var D = "relative flex min-h-44 max-w-560 items-center gap-10 bg-toast py-8 text-body font-medium text-toast-fg shadow-toast", O = "inline-flex h-32 shrink-0 cursor-pointer items-center rounded-pill bg-toast-action px-12 text-body font-medium text-toast-fg transition-control hover:bg-toast-action-hover focus-ring", k = "k-toast-close absolute -top-6 -left-6 inline-flex size-20 cursor-pointer items-center justify-center rounded-pill bg-toast text-toast-fg-secondary shadow-toast hover:text-toast-fg focus-ring";
+function A(e, t) {
+	let n = l(null), [r, i] = u(!1);
+	return c(() => {
 		let e = n.current;
 		e && i(e.offsetHeight > 46);
 	}, [e, t]), [n, r];
 }
-function A({ tone: t = "neutral", title: i, description: a, action: o, closable: s, "data-force": c }) {
-	let [l, u] = k(i, a), p = n();
-	return /* @__PURE__ */ f("div", {
+var j = /* @__PURE__ */ s(function({ tone: t = "neutral", title: i, description: a, action: o, closable: s, "data-force": c }, l) {
+	let [u, d] = A(i, a), m = n();
+	return /* @__PURE__ */ p("div", {
+		ref: l,
 		role: "status",
 		className: "k-toast-static relative w-max",
-		children: [/* @__PURE__ */ f("div", {
-			ref: l,
-			className: e(E, u ? "rounded-toast" : "rounded-pill", t === "neutral" ? "pl-16" : "pl-14", o ? "pr-6" : "pr-16"),
+		children: [/* @__PURE__ */ p("div", {
+			ref: u,
+			className: e(D, d ? "rounded-toast" : "rounded-pill", t === "neutral" ? "pl-16" : "pl-14", o ? "pr-6" : "pr-16"),
 			children: [
-				/* @__PURE__ */ d(T, { tone: t }),
-				/* @__PURE__ */ f("span", {
+				/* @__PURE__ */ f(E, { tone: t }),
+				/* @__PURE__ */ p("span", {
 					className: "min-w-0 text-pretty",
-					children: [i, a && /* @__PURE__ */ f("span", {
+					children: [i, a && /* @__PURE__ */ p("span", {
 						className: "font-regular text-toast-fg-secondary",
 						children: [" ", a]
 					})]
 				}),
-				o && /* @__PURE__ */ d("button", {
+				o && /* @__PURE__ */ f("button", {
 					type: "button",
-					className: D,
+					className: O,
 					children: o
 				})
 			]
-		}), s && /* @__PURE__ */ d("button", {
+		}), s && /* @__PURE__ */ f("button", {
 			type: "button",
-			"aria-label": p("toast.dismiss", "Dismiss"),
-			className: O,
+			"aria-label": m("toast.dismiss", "Dismiss"),
+			className: k,
 			"data-force": c ? `visible ${c}` : "visible",
-			children: /* @__PURE__ */ d(r, {
-				icon: h,
+			children: /* @__PURE__ */ f(r, {
+				icon: g,
 				size: "xs",
 				className: "size-12"
 			})
 		})]
 	});
-}
-process.env.NODE_ENV !== "production" && (A.displayName = "ToastCapsule");
-function j({ item: t, index: a, limit: c, onFrontWidth: l }) {
-	let p = n(), m = t.type ?? "neutral", g = t.data?.reserve, [_, y] = k(t.title, t.description);
-	return s(() => {
+});
+process.env.NODE_ENV !== "production" && (j.displayName = "ToastCapsule");
+function M({ item: t, index: a, limit: s, onFrontWidth: l }) {
+	let u = n(), m = t.type ?? "neutral", h = t.data?.reserve, [_, v] = A(t.title, t.description);
+	return c(() => {
 		let e = _.current;
 		if (a !== 0 || !e) return;
 		let t = () => l(Math.round(e.offsetWidth));
@@ -136,7 +137,7 @@ function j({ item: t, index: a, limit: c, onFrontWidth: l }) {
 		a,
 		l,
 		_
-	]), /* @__PURE__ */ f(v.Root, {
+	]), /* @__PURE__ */ p(y.Root, {
 		toast: t,
 		swipeDirection: [
 			"down",
@@ -145,69 +146,77 @@ function j({ item: t, index: a, limit: c, onFrontWidth: l }) {
 		],
 		className: "k-toast outline-none",
 		...a > 0 ? { "data-behind": "" } : {},
-		...a >= c ? { "data-index-hidden": "" } : {},
-		children: [/* @__PURE__ */ d("div", {
+		...a >= s ? { "data-index-hidden": "" } : {},
+		children: [/* @__PURE__ */ f("div", {
 			ref: _,
-			className: e("k-toast-surface", E, y ? "rounded-toast" : "rounded-pill", m === "neutral" ? "pl-16" : "pl-14", t.actionProps ? "pr-6" : "pr-16"),
-			children: /* @__PURE__ */ f("div", {
+			className: e("k-toast-surface", D, v ? "rounded-toast" : "rounded-pill", m === "neutral" ? "pl-16" : "pl-14", t.actionProps ? "pr-6" : "pr-16"),
+			children: /* @__PURE__ */ p("div", {
 				className: "k-toast-content flex min-w-0 items-center gap-10",
 				children: [
-					/* @__PURE__ */ d(T, { tone: m }),
-					/* @__PURE__ */ f("span", {
+					/* @__PURE__ */ f(E, { tone: m }),
+					/* @__PURE__ */ p("span", {
 						className: "min-w-0 text-pretty",
-						children: [g ? /* @__PURE__ */ d(o, {
-							reserve: g,
+						children: [h ? /* @__PURE__ */ f(o, {
+							reserve: h,
 							align: "start",
-							children: /* @__PURE__ */ d(v.Title, { render: /* @__PURE__ */ d("span", {}) })
-						}) : /* @__PURE__ */ d(v.Title, { render: /* @__PURE__ */ d("span", {}) }), t.description && /* @__PURE__ */ f(u, { children: [" ", /* @__PURE__ */ d(v.Description, {
-							render: /* @__PURE__ */ d("span", {}),
+							children: /* @__PURE__ */ f(y.Title, { render: /* @__PURE__ */ f("span", {}) })
+						}) : /* @__PURE__ */ f(y.Title, { render: /* @__PURE__ */ f("span", {}) }), t.description && /* @__PURE__ */ p(d, { children: [" ", /* @__PURE__ */ f(y.Description, {
+							render: /* @__PURE__ */ f("span", {}),
 							className: "font-regular text-toast-fg-secondary"
 						})] })]
 					}),
-					t.actionProps && /* @__PURE__ */ d(v.Action, { className: D })
+					t.actionProps && /* @__PURE__ */ f(y.Action, { className: O })
 				]
 			})
-		}), /* @__PURE__ */ d(v.Close, {
-			"aria-label": p("toast.dismiss", "Dismiss"),
-			className: O,
-			children: /* @__PURE__ */ d(r, {
-				icon: h,
+		}), /* @__PURE__ */ f(y.Close, {
+			"aria-label": u("toast.dismiss", "Dismiss"),
+			className: k,
+			children: /* @__PURE__ */ f(r, {
+				icon: g,
 				size: "xs",
 				className: "size-12"
 			})
 		})]
 	});
 }
-function M({ limit: e }) {
-	let { toasts: r } = v.useToastManager(), i = r.filter((e) => e.transitionStatus !== "ending"), [a, o] = l(0), s = n();
-	return /* @__PURE__ */ d(v.Portal, {
+function N({ limit: e, viewportRef: r }) {
+	let { toasts: i } = y.useToastManager(), a = i.filter((e) => e.transitionStatus !== "ending"), [o, s] = u(0), c = n();
+	return /* @__PURE__ */ f(y.Portal, {
 		container: t(),
-		children: /* @__PURE__ */ d(v.Viewport, {
-			"aria-label": s("toast.notifications", "Notifications"),
+		children: /* @__PURE__ */ f(y.Viewport, {
+			ref: r,
+			"aria-label": c("toast.notifications", "Notifications"),
 			className: "fixed right-0 bottom-24 left-0 z-60 mx-auto h-0 w-full toast-viewport-width outline-none",
-			style: { "--k-front-width": a ? `${a}px` : "auto" },
-			children: r.map((t) => /* @__PURE__ */ d(j, {
+			style: { "--k-front-width": o ? `${o}px` : "auto" },
+			children: i.map((t) => /* @__PURE__ */ f(M, {
 				item: t,
-				index: Math.max(0, i.indexOf(t)),
+				index: Math.max(0, a.indexOf(t)),
 				limit: e,
-				onFrontWidth: o
+				onFrontWidth: s
 			}, t.id))
 		})
 	});
 }
-function N({ limit: e = 3, timeout: t = 5e3 }) {
-	return /* @__PURE__ */ d(v.Provider, {
-		toastManager: S,
+var P = /* @__PURE__ */ s(function({ limit: e = 3, timeout: t = 5e3 }, n) {
+	return /* @__PURE__ */ f(y.Provider, {
+		toastManager: C,
 		limit: e,
 		timeout: t,
-		children: /* @__PURE__ */ d(M, { limit: e })
+		children: /* @__PURE__ */ f(N, {
+			limit: e,
+			viewportRef: n
+		})
 	});
-}
-process.env.NODE_ENV !== "production" && (N.displayName = "Toaster");
-var P = /* @__PURE__ */ Object.assign(function(e) {
-	return /* @__PURE__ */ d(N, { ...e });
-}, { add: w });
+});
+process.env.NODE_ENV !== "production" && (P.displayName = "Toaster");
+var F = /* @__PURE__ */ Object.assign(/* @__PURE__ */ s(function(e, t) {
+	return /* @__PURE__ */ f(P, {
+		ref: t,
+		...e
+	});
+}), { add: T });
+process.env.NODE_ENV !== "production" && (F.displayName = "Toast");
 //#endregion
-export { b as KAESO_TOAST_DEFAULT_VARIANTS, y as KAESO_TOAST_VARIANTS, P as Toast, A as ToastCapsule, N as Toaster, w as toast, S as toastManager };
+export { x as KAESO_TOAST_DEFAULT_VARIANTS, b as KAESO_TOAST_VARIANTS, F as Toast, j as ToastCapsule, P as Toaster, T as toast, C as toastManager };
 
 //# sourceMappingURL=toast.js.map

package/dist/components/toast.js.map

@@ -1 +1 @@
-{"version":3,"file":"toast.js","names":["__icon_CheckmarkCircle02Icon","__icon_AlertCircleIcon","__icon_Alert02Icon","__icon_InformationCircleIcon","__icon_Cancel01Icon","BaseToast","_Fragment","cn","usePortalContainer","useUiText","Icon","observeResize","Spinner","SwapText","Fragment$1","Toast$1","KAESO_TOAST_VARIANTS","KAESO_TOAST_DEFAULT_VARIANTS","ICON","CheckmarkCircle02Icon","AlertCircleIcon","Alert02Icon","InformationCircleIcon","toastManager","add","tone","o","toast","title","id","reserve","m","p","v","ToneIcon","SURFACE","ACTION","CLOSE","useMultiline","ref","useRef","multi","setMulti","useState","useLayoutEffect","el","description","ToastCapsule","force","t","action","closable","Cancel01Icon","ToastItem","item","index","report","onFrontWidth","limit","List","live","toasts","frontWidth","setFrontWidth","Toaster","Toast","props"],"sources":["../../src/components/toast/toast.tsx"],"sourcesContent":["import { useLayoutEffect, useRef, useState, type ReactNode } from \"react\";\nimport { Toast as BaseToast } from \"@base-ui/react/toast\";\nimport { usePortalContainer } from \"../../utils/portal-context.js\";\nimport { observeResize } from \"../../utils/observe-resize.js\";\nimport { cn } from \"../../utils/cn.js\";\nimport { CheckmarkCircle02Icon as __icon_CheckmarkCircle02Icon, AlertCircleIcon as __icon_AlertCircleIcon, Alert02Icon as __icon_Alert02Icon, InformationCircleIcon as __icon_InformationCircleIcon, Cancel01Icon as __icon_Cancel01Icon } from \"@hugeicons/core-free-icons\";\nimport { Icon } from \"../icon/icon.js\";\nimport { Spinner } from \"../loader/loader.js\";\nimport { SwapText } from \"../swap-text/swap-text.js\";\nimport { useUiText } from \"../../i18n/context.js\";\n\nexport const KAESO_TOAST_VARIANTS = {\n  tone: {\n    neutral: { classes: \"\" },\n    success: { classes: \"text-success\" },\n    error: { classes: \"text-danger\" },\n    warning: { classes: \"text-warning\" },\n    info: { classes: \"text-info\" },\n    loading: { classes: \"text-toast-fg-secondary\" },\n  },\n} as const;\nexport const KAESO_TOAST_DEFAULT_VARIANTS = { tone: \"neutral\" } as const;\ntype Tone = keyof typeof KAESO_TOAST_VARIANTS.tone;\n\nconst ICON = { success: __icon_CheckmarkCircle02Icon, error: __icon_AlertCircleIcon, warning: __icon_Alert02Icon, info: __icon_InformationCircleIcon } as const;\n\nexport const toastManager = /* @__PURE__ */ BaseToast.createToastManager();\n\nexport interface ToastOptions {\n  description?: ReactNode | undefined;\n  action?: { label: string; onClick: () => void } | undefined;\n  timeout?: number | undefined;\n  id?: string | undefined;\n}\n\ninterface ToastData {\n  reserve?: ReactNode[] | undefined;\n}\n\nfunction add(tone: Tone, title: ReactNode, o: ToastOptions = {}) {\n  return toastManager.add({\n    title,\n    type: tone,\n    ...(o.description !== undefined ? { description: o.description } : {}),\n    ...(o.timeout !== undefined ? { timeout: o.timeout } : {}),\n    ...(o.id ? { id: o.id } : {}),\n    ...(tone === \"error\" ? { priority: \"high\" as const } : {}),\n    ...(o.action ? { actionProps: { children: o.action.label, onClick: o.action.onClick } } : {}),\n  });\n}\n\nexport const toast = /* @__PURE__ */ Object.assign((title: ReactNode, o?: ToastOptions) => add(\"neutral\", title, o), {\n  success: (title: ReactNode, o?: ToastOptions) => add(\"success\", title, o),\n  error: (title: ReactNode, o?: ToastOptions) => add(\"error\", title, o),\n  warning: (title: ReactNode, o?: ToastOptions) => add(\"warning\", title, o),\n  info: (title: ReactNode, o?: ToastOptions) => add(\"info\", title, o),\n  dismiss: (id?: string) => toastManager.close(id),\n  promise: <T,>(p: Promise<T>, m: { loading: string; success: string | ((v: T) => string); error: string | ((e: unknown) => string) }) => {\n    const reserve = [m.loading, ...(typeof m.success === \"string\" ? [m.success] : []), ...(typeof m.error === \"string\" ? [m.error] : [])];\n    return toastManager.promise(p, {\n      loading: { title: m.loading, type: \"loading\", timeout: 0, data: { reserve } },\n      success: (v: T) => ({ title: typeof m.success === \"function\" ? m.success(v) : m.success, type: \"success\", data: { reserve } }),\n      error: (e: unknown) => ({ title: typeof m.error === \"function\" ? m.error(e) : m.error, type: \"error\", priority: \"high\", data: { reserve } }),\n    });\n  },\n});\n\nfunction ToneIcon({ tone }: { tone: Tone }) {\n  if (tone === \"neutral\") return null;\n  return (\n    <span className={cn(\"flex shrink-0\", KAESO_TOAST_VARIANTS.tone[tone].classes)}>\n      {tone === \"loading\" ? <Spinner size=\"sm\" /> : <Icon icon={ICON[tone]} size=\"sm\" />}\n    </span>\n  );\n}\n\nconst SURFACE = \"relative flex min-h-44 max-w-560 items-center gap-10 bg-toast py-8 text-body font-medium text-toast-fg shadow-toast\";\nconst ACTION =\n  \"inline-flex h-32 shrink-0 cursor-pointer items-center rounded-pill bg-toast-action px-12 text-body font-medium text-toast-fg transition-control hover:bg-toast-action-hover focus-ring\";\nconst CLOSE =\n  \"k-toast-close absolute -top-6 -left-6 inline-flex size-20 cursor-pointer items-center justify-center rounded-pill bg-toast text-toast-fg-secondary shadow-toast hover:text-toast-fg focus-ring\";\n\nfunction useMultiline(title: ReactNode, description: ReactNode) {\n  const ref = useRef<HTMLDivElement>(null);\n  const [multi, setMulti] = useState(false);\n  useLayoutEffect(() => {\n    const el = ref.current;\n    if (el) setMulti(el.offsetHeight > 46);\n  }, [title, description]);\n  return [ref, multi] as const;\n}\n\nexport function ToastCapsule({\n  tone = \"neutral\",\n  title,\n  description,\n  action,\n  closable,\n  \"data-force\": force,\n}: {\n  tone?: Tone | undefined;\n  title: ReactNode;\n  description?: ReactNode | undefined;\n  action?: string | undefined;\n  closable?: boolean | undefined;\n  \"data-force\"?: string | undefined;\n}) {\n  const [ref, multi] = useMultiline(title, description);\n  const t = useUiText();\n  return (\n    <div role=\"status\" className=\"k-toast-static relative w-max\">\n      <div ref={ref} className={cn(SURFACE, multi ? \"rounded-toast\" : \"rounded-pill\", tone === \"neutral\" ? \"pl-16\" : \"pl-14\", action ? \"pr-6\" : \"pr-16\")}>\n        <ToneIcon tone={tone} />\n        <span className=\"min-w-0 text-pretty\">\n          {title}\n          {description && <span className=\"font-regular text-toast-fg-secondary\"> {description}</span>}\n        </span>\n        {action && (\n          <button type=\"button\" className={ACTION}>\n            {action}\n          </button>\n        )}\n      </div>\n      {closable && (\n        <button type=\"button\" aria-label={t(\"toast.dismiss\", \"Dismiss\")} className={CLOSE} data-force={force ? `visible ${force}` : \"visible\"}>\n          <Icon icon={__icon_Cancel01Icon} size=\"xs\" className=\"size-12\" />\n        </button>\n      )}\n    </div>\n  );\n}\nif (process.env.NODE_ENV !== \"production\") ToastCapsule.displayName = \"ToastCapsule\";\n\ntype ManagedToast = ReturnType<typeof BaseToast.useToastManager>[\"toasts\"][number];\n\nfunction ToastItem({ item, index, limit, onFrontWidth }: { item: ManagedToast; index: number; limit: number; onFrontWidth: (w: number) => void }) {\n  const t = useUiText();\n  const tone = ((item.type as Tone) ?? \"neutral\") as Tone;\n  const reserve = (item.data as ToastData | undefined)?.reserve;\n  const [ref, multi] = useMultiline(item.title, item.description);\n  useLayoutEffect(() => {\n    const el = ref.current;\n    if (index !== 0 || !el) return;\n    const report = () => onFrontWidth(Math.round(el.offsetWidth));\n    report();\n    return observeResize([el], report);\n  }, [index, onFrontWidth, ref]);\n  return (\n    <BaseToast.Root\n      toast={item}\n      swipeDirection={[\"down\", \"left\", \"right\"]}\n      className=\"k-toast outline-none\"\n      {...(index > 0 ? { \"data-behind\": \"\" } : {})}\n      {...(index >= limit ? { \"data-index-hidden\": \"\" } : {})}\n    >\n      <div\n        ref={ref}\n        className={cn(\n          \"k-toast-surface\",\n          SURFACE,\n          multi ? \"rounded-toast\" : \"rounded-pill\",\n          tone === \"neutral\" ? \"pl-16\" : \"pl-14\",\n          item.actionProps ? \"pr-6\" : \"pr-16\",\n        )}\n      >\n        <div className=\"k-toast-content flex min-w-0 items-center gap-10\">\n          <ToneIcon tone={tone} />\n          <span className=\"min-w-0 text-pretty\">\n            {reserve ? (\n              <SwapText reserve={reserve} align=\"start\">\n                <BaseToast.Title render={<span />} />\n              </SwapText>\n            ) : (\n              <BaseToast.Title render={<span />} />\n            )}\n            {item.description && (\n              <>\n                {\" \"}\n                <BaseToast.Description render={<span />} className=\"font-regular text-toast-fg-secondary\" />\n              </>\n            )}\n          </span>\n          {item.actionProps && <BaseToast.Action className={ACTION} />}\n        </div>\n      </div>\n      <BaseToast.Close aria-label={t(\"toast.dismiss\", \"Dismiss\")} className={CLOSE}>\n        <Icon icon={__icon_Cancel01Icon} size=\"xs\" className=\"size-12\" />\n      </BaseToast.Close>\n    </BaseToast.Root>\n  );\n}\n\nfunction List({ limit }: { limit: number }) {\n  const { toasts } = BaseToast.useToastManager();\n  const live = toasts.filter((item) => item.transitionStatus !== \"ending\");\n  const [frontWidth, setFrontWidth] = useState(0);\n  const t = useUiText();\n  return (\n    <BaseToast.Portal container={usePortalContainer()}>\n      <BaseToast.Viewport\n        aria-label={t(\"toast.notifications\", \"Notifications\")}\n        className=\"fixed right-0 bottom-24 left-0 z-60 mx-auto h-0 w-full toast-viewport-width outline-none\"\n        style={{ [\"--k-front-width\" as string]: frontWidth ? `${frontWidth}px` : \"auto\" }}\n      >\n        {toasts.map((item) => (\n          <ToastItem key={item.id} item={item} index={Math.max(0, live.indexOf(item))} limit={limit} onFrontWidth={setFrontWidth} />\n        ))}\n      </BaseToast.Viewport>\n    </BaseToast.Portal>\n  );\n}\n\nexport function Toaster({ limit = 3, timeout = 5000 }: { limit?: number | undefined; timeout?: number | undefined }) {\n  return (\n    <BaseToast.Provider toastManager={toastManager} limit={limit} timeout={timeout}>\n      <List limit={limit} />\n    </BaseToast.Provider>\n  );\n}\nif (process.env.NODE_ENV !== \"production\") Toaster.displayName = \"Toaster\";\n\nexport const Toast = /* @__PURE__ */ Object.assign(\n  function Toast(props: { limit?: number | undefined; timeout?: number | undefined }) {\n    return <Toaster {...props} />;\n  },\n  { add: toast },\n);\n"],"mappings":"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"}
+{"version":3,"file":"toast.js","names":["__icon_CheckmarkCircle02Icon","__icon_AlertCircleIcon","__icon_Alert02Icon","__icon_InformationCircleIcon","__icon_Cancel01Icon","BaseToast","_Fragment","cn","usePortalContainer","useUiText","Icon","observeResize","Spinner","SwapText","Fragment$1","Toast$1","KAESO_TOAST_VARIANTS","KAESO_TOAST_DEFAULT_VARIANTS","ICON","CheckmarkCircle02Icon","AlertCircleIcon","Alert02Icon","InformationCircleIcon","toastManager","add","tone","o","toast","title","id","reserve","m","p","v","ToneIcon","SURFACE","ACTION","CLOSE","useMultiline","ref","useRef","multi","setMulti","useState","useLayoutEffect","el","description","ToastCapsule","force","surface","t","action","closable","Cancel01Icon","ToastItem","item","index","report","onFrontWidth","limit","List","live","toasts","frontWidth","setFrontWidth","viewportRef","Toaster","Toast","props"],"sources":["../../src/components/toast/toast.tsx"],"sourcesContent":["import { forwardRef, useLayoutEffect, useRef, useState, type ReactNode, type Ref } from \"react\";\nimport { Toast as BaseToast } from \"@base-ui/react/toast\";\nimport { usePortalContainer } from \"../../utils/portal-context.js\";\nimport { observeResize } from \"../../utils/observe-resize.js\";\nimport { cn } from \"../../utils/cn.js\";\nimport { CheckmarkCircle02Icon as __icon_CheckmarkCircle02Icon, AlertCircleIcon as __icon_AlertCircleIcon, Alert02Icon as __icon_Alert02Icon, InformationCircleIcon as __icon_InformationCircleIcon, Cancel01Icon as __icon_Cancel01Icon } from \"@hugeicons/core-free-icons\";\nimport { Icon } from \"../icon/icon.js\";\nimport { Spinner } from \"../loader/loader.js\";\nimport { SwapText } from \"../swap-text/swap-text.js\";\nimport { useUiText } from \"../../i18n/context.js\";\n\nexport const KAESO_TOAST_VARIANTS = {\n  tone: {\n    neutral: { classes: \"\" },\n    success: { classes: \"text-success\" },\n    error: { classes: \"text-danger\" },\n    warning: { classes: \"text-warning\" },\n    info: { classes: \"text-info\" },\n    loading: { classes: \"text-toast-fg-secondary\" },\n  },\n} as const;\nexport const KAESO_TOAST_DEFAULT_VARIANTS = { tone: \"neutral\" } as const;\ntype Tone = keyof typeof KAESO_TOAST_VARIANTS.tone;\n\nconst ICON = { success: __icon_CheckmarkCircle02Icon, error: __icon_AlertCircleIcon, warning: __icon_Alert02Icon, info: __icon_InformationCircleIcon } as const;\n\nexport const toastManager = /* @__PURE__ */ BaseToast.createToastManager();\n\nexport interface ToastOptions {\n  description?: ReactNode | undefined;\n  action?: { label: string; onClick: () => void } | undefined;\n  timeout?: number | undefined;\n  id?: string | undefined;\n}\n\ninterface ToastData {\n  reserve?: ReactNode[] | undefined;\n}\n\nfunction add(tone: Tone, title: ReactNode, o: ToastOptions = {}) {\n  return toastManager.add({\n    title,\n    type: tone,\n    ...(o.description !== undefined ? { description: o.description } : {}),\n    ...(o.timeout !== undefined ? { timeout: o.timeout } : {}),\n    ...(o.id ? { id: o.id } : {}),\n    ...(tone === \"error\" ? { priority: \"high\" as const } : {}),\n    ...(o.action ? { actionProps: { children: o.action.label, onClick: o.action.onClick } } : {}),\n  });\n}\n\nexport const toast = /* @__PURE__ */ Object.assign((title: ReactNode, o?: ToastOptions) => add(\"neutral\", title, o), {\n  success: (title: ReactNode, o?: ToastOptions) => add(\"success\", title, o),\n  error: (title: ReactNode, o?: ToastOptions) => add(\"error\", title, o),\n  warning: (title: ReactNode, o?: ToastOptions) => add(\"warning\", title, o),\n  info: (title: ReactNode, o?: ToastOptions) => add(\"info\", title, o),\n  dismiss: (id?: string) => toastManager.close(id),\n  promise: <T,>(p: Promise<T>, m: { loading: string; success: string | ((v: T) => string); error: string | ((e: unknown) => string) }) => {\n    const reserve = [m.loading, ...(typeof m.success === \"string\" ? [m.success] : []), ...(typeof m.error === \"string\" ? [m.error] : [])];\n    return toastManager.promise(p, {\n      loading: { title: m.loading, type: \"loading\", timeout: 0, data: { reserve } },\n      success: (v: T) => ({ title: typeof m.success === \"function\" ? m.success(v) : m.success, type: \"success\", data: { reserve } }),\n      error: (e: unknown) => ({ title: typeof m.error === \"function\" ? m.error(e) : m.error, type: \"error\", priority: \"high\", data: { reserve } }),\n    });\n  },\n});\n\nfunction ToneIcon({ tone }: { tone: Tone }) {\n  if (tone === \"neutral\") return null;\n  return (\n    <span className={cn(\"flex shrink-0\", KAESO_TOAST_VARIANTS.tone[tone].classes)}>\n      {tone === \"loading\" ? <Spinner size=\"sm\" /> : <Icon icon={ICON[tone]} size=\"sm\" />}\n    </span>\n  );\n}\n\nconst SURFACE = \"relative flex min-h-44 max-w-560 items-center gap-10 bg-toast py-8 text-body font-medium text-toast-fg shadow-toast\";\nconst ACTION =\n  \"inline-flex h-32 shrink-0 cursor-pointer items-center rounded-pill bg-toast-action px-12 text-body font-medium text-toast-fg transition-control hover:bg-toast-action-hover focus-ring\";\nconst CLOSE =\n  \"k-toast-close absolute -top-6 -left-6 inline-flex size-20 cursor-pointer items-center justify-center rounded-pill bg-toast text-toast-fg-secondary shadow-toast hover:text-toast-fg focus-ring\";\n\nfunction useMultiline(title: ReactNode, description: ReactNode) {\n  const ref = useRef<HTMLDivElement>(null);\n  const [multi, setMulti] = useState(false);\n  useLayoutEffect(() => {\n    const el = ref.current;\n    if (el) setMulti(el.offsetHeight > 46);\n  }, [title, description]);\n  return [ref, multi] as const;\n}\n\nexport interface ToastCapsuleProps {\n  tone?: Tone | undefined;\n  title: ReactNode;\n  description?: ReactNode | undefined;\n  action?: string | undefined;\n  closable?: boolean | undefined;\n  \"data-force\"?: string | undefined;\n}\n\nexport const ToastCapsule = /* @__PURE__ */ forwardRef<HTMLDivElement, ToastCapsuleProps>(function ToastCapsule(\n  { tone = \"neutral\", title, description, action, closable, \"data-force\": force },\n  ref,\n) {\n  const [surface, multi] = useMultiline(title, description);\n  const t = useUiText();\n  return (\n    <div ref={ref} role=\"status\" className=\"k-toast-static relative w-max\">\n      <div ref={surface} className={cn(SURFACE, multi ? \"rounded-toast\" : \"rounded-pill\", tone === \"neutral\" ? \"pl-16\" : \"pl-14\", action ? \"pr-6\" : \"pr-16\")}>\n        <ToneIcon tone={tone} />\n        <span className=\"min-w-0 text-pretty\">\n          {title}\n          {description && <span className=\"font-regular text-toast-fg-secondary\"> {description}</span>}\n        </span>\n        {action && (\n          <button type=\"button\" className={ACTION}>\n            {action}\n          </button>\n        )}\n      </div>\n      {closable && (\n        <button type=\"button\" aria-label={t(\"toast.dismiss\", \"Dismiss\")} className={CLOSE} data-force={force ? `visible ${force}` : \"visible\"}>\n          <Icon icon={__icon_Cancel01Icon} size=\"xs\" className=\"size-12\" />\n        </button>\n      )}\n    </div>\n  );\n});\nif (process.env.NODE_ENV !== \"production\") ToastCapsule.displayName = \"ToastCapsule\";\n\ntype ManagedToast = ReturnType<typeof BaseToast.useToastManager>[\"toasts\"][number];\n\nfunction ToastItem({ item, index, limit, onFrontWidth }: { item: ManagedToast; index: number; limit: number; onFrontWidth: (w: number) => void }) {\n  const t = useUiText();\n  const tone = ((item.type as Tone) ?? \"neutral\") as Tone;\n  const reserve = (item.data as ToastData | undefined)?.reserve;\n  const [ref, multi] = useMultiline(item.title, item.description);\n  useLayoutEffect(() => {\n    const el = ref.current;\n    if (index !== 0 || !el) return;\n    const report = () => onFrontWidth(Math.round(el.offsetWidth));\n    report();\n    return observeResize([el], report);\n  }, [index, onFrontWidth, ref]);\n  return (\n    <BaseToast.Root\n      toast={item}\n      swipeDirection={[\"down\", \"left\", \"right\"]}\n      className=\"k-toast outline-none\"\n      {...(index > 0 ? { \"data-behind\": \"\" } : {})}\n      {...(index >= limit ? { \"data-index-hidden\": \"\" } : {})}\n    >\n      <div\n        ref={ref}\n        className={cn(\n          \"k-toast-surface\",\n          SURFACE,\n          multi ? \"rounded-toast\" : \"rounded-pill\",\n          tone === \"neutral\" ? \"pl-16\" : \"pl-14\",\n          item.actionProps ? \"pr-6\" : \"pr-16\",\n        )}\n      >\n        <div className=\"k-toast-content flex min-w-0 items-center gap-10\">\n          <ToneIcon tone={tone} />\n          <span className=\"min-w-0 text-pretty\">\n            {reserve ? (\n              <SwapText reserve={reserve} align=\"start\">\n                <BaseToast.Title render={<span />} />\n              </SwapText>\n            ) : (\n              <BaseToast.Title render={<span />} />\n            )}\n            {item.description && (\n              <>\n                {\" \"}\n                <BaseToast.Description render={<span />} className=\"font-regular text-toast-fg-secondary\" />\n              </>\n            )}\n          </span>\n          {item.actionProps && <BaseToast.Action className={ACTION} />}\n        </div>\n      </div>\n      <BaseToast.Close aria-label={t(\"toast.dismiss\", \"Dismiss\")} className={CLOSE}>\n        <Icon icon={__icon_Cancel01Icon} size=\"xs\" className=\"size-12\" />\n      </BaseToast.Close>\n    </BaseToast.Root>\n  );\n}\n\nfunction List({ limit, viewportRef }: { limit: number; viewportRef: Ref<HTMLDivElement> }) {\n  const { toasts } = BaseToast.useToastManager();\n  const live = toasts.filter((item) => item.transitionStatus !== \"ending\");\n  const [frontWidth, setFrontWidth] = useState(0);\n  const t = useUiText();\n  return (\n    <BaseToast.Portal container={usePortalContainer()}>\n      <BaseToast.Viewport\n        ref={viewportRef}\n        aria-label={t(\"toast.notifications\", \"Notifications\")}\n        className=\"fixed right-0 bottom-24 left-0 z-60 mx-auto h-0 w-full toast-viewport-width outline-none\"\n        style={{ [\"--k-front-width\" as string]: frontWidth ? `${frontWidth}px` : \"auto\" }}\n      >\n        {toasts.map((item) => (\n          <ToastItem key={item.id} item={item} index={Math.max(0, live.indexOf(item))} limit={limit} onFrontWidth={setFrontWidth} />\n        ))}\n      </BaseToast.Viewport>\n    </BaseToast.Portal>\n  );\n}\n\nexport interface ToasterProps {\n  limit?: number | undefined;\n  timeout?: number | undefined;\n}\n\nexport const Toaster = /* @__PURE__ */ forwardRef<HTMLDivElement, ToasterProps>(function Toaster({ limit = 3, timeout = 5000 }, ref) {\n  return (\n    <BaseToast.Provider toastManager={toastManager} limit={limit} timeout={timeout}>\n      <List limit={limit} viewportRef={ref} />\n    </BaseToast.Provider>\n  );\n});\nif (process.env.NODE_ENV !== \"production\") Toaster.displayName = \"Toaster\";\n\nexport const Toast = /* @__PURE__ */ Object.assign(\n  /* @__PURE__ */ forwardRef<HTMLDivElement, ToasterProps>(function Toast(props, ref) {\n    return <Toaster ref={ref} {...props} />;\n  }),\n  { add: toast },\n);\nif (process.env.NODE_ENV !== \"production\") Toast.displayName = \"Toast\";\n"],"mappings":"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"}

package/dist/components/toc.js

@@ -1,5 +1,5 @@
 "use client";
-import { t as e } from "../chunks/cn-Isw2DnQX.js";
+import { t as e } from "../chunks/cn-Dj6sRgkF.js";
 import { i as t } from "../chunks/context-BELWW79w.js";
 import { forwardRef as n, useEffect as r, useState as i } from "react";
 import { jsx as a, jsxs as o } from "react/jsx-runtime";
@@ -7,33 +7,48 @@ import { jsx as a, jsxs as o } from "react/jsx-runtime";
 var s = { state: {
 	default: { classes: "text-fg-secondary hover:text-fg" },
 	active: { classes: "text-fg" }
-} }, c = { state: "default" }, l = /* @__PURE__ */ n(function({ items: n, title: c, active: l, className: u }, d) {
-	let f = t(), p = c ?? f("tableOfContents.title", "On this page"), [m, h] = i(n[0]?.id);
+} }, c = { state: "default" }, l = .3;
+function u(e) {
+	for (let t = e.parentElement; t; t = t.parentElement) if (/(auto|scroll)/.test(getComputedStyle(t).overflowY) && t.scrollHeight > t.clientHeight) return t;
+	return document.scrollingElement ?? document.documentElement;
+}
+var d = /* @__PURE__ */ n(function({ items: n, title: c, active: d, className: f }, p) {
+	let m = t(), h = c ?? m("tableOfContents.title", "On this page"), [g, _] = i(n[0]?.id);
 	r(() => {
-		if (l !== void 0 || typeof IntersectionObserver > "u") return;
-		let e = new IntersectionObserver((e) => {
-			for (let t of e) t.isIntersecting && h(t.target.id);
-		}, { rootMargin: "0px 0px -70% 0px" });
-		return n.forEach((t) => {
-			let n = document.getElementById(t.id);
-			n && e.observe(n);
-		}), () => e.disconnect();
-	}, [n, l]);
-	let g = l ?? m;
+		if (d !== void 0) return;
+		let e = n.map((e) => document.getElementById(e.id)).filter((e) => e !== null), t = e[0];
+		if (!t) return;
+		let r = u(t), i = 0, a = () => {
+			i = 0;
+			let n = window.innerHeight * l, a = t.id;
+			for (let t of e) t.getBoundingClientRect().top <= n && (a = t.id);
+			let o = r.scrollTop > 0 && r.scrollTop + r.clientHeight >= r.scrollHeight - 2;
+			_(o ? e.at(-1)?.id ?? a : a);
+		}, o = () => {
+			i ||= requestAnimationFrame(a);
+		};
+		return a(), document.addEventListener("scroll", o, {
+			capture: !0,
+			passive: !0
+		}), window.addEventListener("resize", o), () => {
+			cancelAnimationFrame(i), document.removeEventListener("scroll", o, { capture: !0 }), window.removeEventListener("resize", o);
+		};
+	}, [n, d]);
+	let v = d ?? g;
 	return /* @__PURE__ */ o("nav", {
-		ref: d,
-		"aria-label": p,
-		className: e("flex flex-col", u),
+		ref: p,
+		"aria-label": h,
+		className: e("flex flex-col", f),
 		children: [/* @__PURE__ */ a("span", {
 			className: "mb-8 text-caption font-medium text-fg-secondary",
-			children: p
+			children: h
 		}), /* @__PURE__ */ a("ul", {
 			className: "flex flex-col hairline-l",
 			children: n.map((t) => /* @__PURE__ */ a("li", { children: /* @__PURE__ */ o("a", {
 				href: `#${t.id}`,
-				"aria-current": t.id === g ? "location" : void 0,
-				className: e("relative flex min-h-28 items-center py-4 text-small transition-control focus-ring-inset rounded-code", t.depth ? "pl-24" : "pl-12", s.state[t.id === g ? "active" : "default"].classes),
-				children: [t.id === g && /* @__PURE__ */ a("span", {
+				"aria-current": t.id === v ? "location" : void 0,
+				className: e("relative flex min-h-28 items-center py-4 text-small transition-control focus-ring-inset rounded-code", t.depth ? "pl-24" : "pl-12", s.state[t.id === v ? "active" : "default"].classes),
+				children: [t.id === v && /* @__PURE__ */ a("span", {
 					"aria-hidden": !0,
 					className: "absolute inset-y-4 left-0 w-2 rounded-pill bg-ink"
 				}), t.label]
@@ -41,8 +56,8 @@ var s = { state: {
 		})]
 	});
 });
-process.env.NODE_ENV !== "production" && (l.displayName = "TableOfContents");
+process.env.NODE_ENV !== "production" && (d.displayName = "TableOfContents");
 //#endregion
-export { c as KAESO_TABLE_OF_CONTENTS_DEFAULT_VARIANTS, s as KAESO_TABLE_OF_CONTENTS_VARIANTS, l as TableOfContents };
+export { c as KAESO_TABLE_OF_CONTENTS_DEFAULT_VARIANTS, s as KAESO_TABLE_OF_CONTENTS_VARIANTS, d as TableOfContents };
 
 //# sourceMappingURL=toc.js.map

package/dist/components/toc.js.map

@@ -1 +1 @@
-{"version":3,"file":"toc.js","names":["cn","useUiText","KAESO_TABLE_OF_CONTENTS_VARIANTS","KAESO_TABLE_OF_CONTENTS_DEFAULT_VARIANTS","TableOfContents","titleProp","t","title","seen","setSeen","useState","items","active","io","e","entries","el","i","current","className"],"sources":["../../src/components/toc/toc.tsx"],"sourcesContent":["import { forwardRef, useEffect, useState } from \"react\";\nimport { cn } from \"../../utils/cn.js\";\nimport { useUiText } from \"../../i18n/context.js\";\n\nexport const KAESO_TABLE_OF_CONTENTS_VARIANTS = {\n  state: {\n    default: { classes: \"text-fg-secondary hover:text-fg\" },\n    active: { classes: \"text-fg\" },\n  },\n} as const;\nexport const KAESO_TABLE_OF_CONTENTS_DEFAULT_VARIANTS = { state: \"default\" } as const;\n\nexport interface TocItem {\n  id: string;\n  label: string;\n  depth?: 0 | 1 | undefined;\n}\n\nexport interface TableOfContentsProps {\n  items: TocItem[];\n  title?: string | undefined;\n  active?: string | undefined;\n  className?: string | undefined;\n}\n\nexport const TableOfContents = /* @__PURE__ */ forwardRef<HTMLElement, TableOfContentsProps>(function TableOfContents({ items, title: titleProp, active, className }, ref) {\n  const t = useUiText();\n  const title = titleProp ?? t(\"tableOfContents.title\", \"On this page\");\n  const [seen, setSeen] = useState(items[0]?.id);\n  useEffect(() => {\n    if (active !== undefined || typeof IntersectionObserver === \"undefined\") return;\n    const io = new IntersectionObserver(\n      (entries) => {\n        for (const e of entries) if (e.isIntersecting) setSeen(e.target.id);\n      },\n      { rootMargin: \"0px 0px -70% 0px\" },\n    );\n    items.forEach((i) => {\n      const el = document.getElementById(i.id);\n      if (el) io.observe(el);\n    });\n    return () => io.disconnect();\n  }, [items, active]);\n  const current = active ?? seen;\n  return (\n    <nav ref={ref} aria-label={title} className={cn(\"flex flex-col\", className)}>\n      <span className=\"mb-8 text-caption font-medium text-fg-secondary\">{title}</span>\n      <ul className=\"flex flex-col hairline-l\">\n        {items.map((i) => (\n          <li key={i.id}>\n            <a\n              href={`#${i.id}`}\n              aria-current={i.id === current ? \"location\" : undefined}\n              className={cn(\n                \"relative flex min-h-28 items-center py-4 text-small transition-control focus-ring-inset rounded-code\",\n                i.depth ? \"pl-24\" : \"pl-12\",\n                KAESO_TABLE_OF_CONTENTS_VARIANTS.state[i.id === current ? \"active\" : \"default\"].classes,\n              )}\n            >\n              {i.id === current && <span aria-hidden className=\"absolute inset-y-4 left-0 w-2 rounded-pill bg-ink\" />}\n              {i.label}\n            </a>\n          </li>\n        ))}\n      </ul>\n    </nav>\n  );\n});\nif (process.env.NODE_ENV !== \"production\") TableOfContents.displayName = \"TableOfContents\";\n"],"mappings":";;;;;;AAIA,IAAaE,IAAmC,EAC9C,OAAO;CACL,SAAS,EAAE,SAAS,kCAAkC;CACtD,QAAQ,EAAE,SAAS,UAAU;AAC/B,EACF,GACaC,IAA2C,EAAE,OAAO,UAAU,GAe9DC,IAAkC,kBAA8C,SAAyB,EAAE,UAAO,OAAOC,GAAW,WAAQ,gBAAa,GAAK;CACzK,IAAMC,IAAIL,EAAU,GACdM,IAAQF,KAAaC,EAAE,yBAAyB,cAAc,GAC9D,CAACE,GAAMC,KAAWC,EAASC,EAAM,EAAE,EAAE,EAAE;CAC7C,QAAgB;EACd,IAAIC,MAAW,KAAA,KAAa,OAAO,uBAAyB,KAAa;EACzE,IAAMC,IAAK,IAAI,sBACZ,MAAY;GACX,KAAK,IAAMC,KAAKC,GAAS,AAAID,EAAE,kBAAgBL,EAAQK,EAAE,OAAO,EAAE;EACpE,GACA,EAAE,YAAY,mBAAmB,CACnC;EAKA,OAJAH,EAAM,SAAS,MAAM;GACnB,IAAMK,IAAK,SAAS,eAAeC,EAAE,EAAE;GACvC,AAAID,KAAIH,EAAG,QAAQG,CAAE;EACvB,CAAC,SACYH,EAAG,WAAW;CAC7B,GAAG,CAACF,GAAOC,CAAM,CAAC;CAClB,IAAMM,IAAUN,KAAUJ;CAC1B,OACE,kBAAC,OAAD;EAAU;EAAK,cAAYD;EAAO,WAAWP,EAAG,iBAAiBmB,CAAS;EAA1E,UAAA,CACE,kBAAC,QAAD;GAAM,WAAU;GAAmD,UAAAZ;EAAY,CAAA,GAC/E,kBAAC,MAAD;GAAI,WAAU;GACX,UAAAI,EAAM,KAAK,MACV,kBAAC,MAAD,EAAA,UACE,kBAAC,KAAD;IACE,MAAM,IAAIM,EAAE;IACZ,gBAAcA,EAAE,OAAOC,IAAU,aAAa,KAAA;IAC9C,WAAWlB,EACT,wGACAiB,EAAE,QAAQ,UAAU,SACpBf,EAAiC,MAAMe,EAAE,OAAOC,IAAU,WAAW,UAAU,CAAC,OAClF;IAPF,UAAA,CASGD,EAAE,OAAOC,KAAW,kBAAC,QAAD;KAAM,eAAA;KAAY,WAAU;IAAqD,CAAA,GACrGD,EAAE,KACF;GACD,CAAA,EAAA,GAbKA,EAAE,EAaP,CACL;EACC,CAAA,CACD;;AAET,CAAC;AACD,QAAA,IAAA,aAA6B,iBAAc,EAAgB,cAAc"}
+{"version":3,"file":"toc.js","names":["cn","useUiText","KAESO_TABLE_OF_CONTENTS_VARIANTS","KAESO_TABLE_OF_CONTENTS_DEFAULT_VARIANTS","READING_LINE","scrollParent","parent","el","TableOfContents","titleProp","t","title","seen","setSeen","useState","items","active","headings","i","first","scroller","frame","pick","line","id","h","end","schedule","current","className"],"sources":["../../src/components/toc/toc.tsx"],"sourcesContent":["import { forwardRef, useEffect, useState } from \"react\";\nimport { cn } from \"../../utils/cn.js\";\nimport { useUiText } from \"../../i18n/context.js\";\n\nexport const KAESO_TABLE_OF_CONTENTS_VARIANTS = {\n  state: {\n    default: { classes: \"text-fg-secondary hover:text-fg\" },\n    active: { classes: \"text-fg\" },\n  },\n} as const;\nexport const KAESO_TABLE_OF_CONTENTS_DEFAULT_VARIANTS = { state: \"default\" } as const;\n\nexport interface TocItem {\n  id: string;\n  label: string;\n  depth?: 0 | 1 | undefined;\n}\n\nexport interface TableOfContentsProps {\n  items: TocItem[];\n  title?: string | undefined;\n  active?: string | undefined;\n  className?: string | undefined;\n}\n\nconst READING_LINE = 0.3;\n\nfunction scrollParent(el: HTMLElement): Element {\n  for (let parent = el.parentElement; parent; parent = parent.parentElement) {\n    if (/(auto|scroll)/.test(getComputedStyle(parent).overflowY) && parent.scrollHeight > parent.clientHeight) return parent;\n  }\n  return document.scrollingElement ?? document.documentElement;\n}\n\nexport const TableOfContents = /* @__PURE__ */ forwardRef<HTMLElement, TableOfContentsProps>(function TableOfContents({ items, title: titleProp, active, className }, ref) {\n  const t = useUiText();\n  const title = titleProp ?? t(\"tableOfContents.title\", \"On this page\");\n  const [seen, setSeen] = useState(items[0]?.id);\n  useEffect(() => {\n    if (active !== undefined) return;\n    const headings = items.map((i) => document.getElementById(i.id)).filter((el): el is HTMLElement => el !== null);\n    const first = headings[0];\n    if (!first) return;\n    const scroller = scrollParent(first);\n    let frame = 0;\n    const pick = () => {\n      frame = 0;\n      const line = window.innerHeight * READING_LINE;\n      let id = first.id;\n      for (const h of headings) if (h.getBoundingClientRect().top <= line) id = h.id;\n      const end = scroller.scrollTop > 0 && scroller.scrollTop + scroller.clientHeight >= scroller.scrollHeight - 2;\n      setSeen(end ? (headings.at(-1)?.id ?? id) : id);\n    };\n    const schedule = () => {\n      frame ||= requestAnimationFrame(pick);\n    };\n    pick();\n    document.addEventListener(\"scroll\", schedule, { capture: true, passive: true });\n    window.addEventListener(\"resize\", schedule);\n    return () => {\n      cancelAnimationFrame(frame);\n      document.removeEventListener(\"scroll\", schedule, { capture: true });\n      window.removeEventListener(\"resize\", schedule);\n    };\n  }, [items, active]);\n  const current = active ?? seen;\n  return (\n    <nav ref={ref} aria-label={title} className={cn(\"flex flex-col\", className)}>\n      <span className=\"mb-8 text-caption font-medium text-fg-secondary\">{title}</span>\n      <ul className=\"flex flex-col hairline-l\">\n        {items.map((i) => (\n          <li key={i.id}>\n            <a\n              href={`#${i.id}`}\n              aria-current={i.id === current ? \"location\" : undefined}\n              className={cn(\n                \"relative flex min-h-28 items-center py-4 text-small transition-control focus-ring-inset rounded-code\",\n                i.depth ? \"pl-24\" : \"pl-12\",\n                KAESO_TABLE_OF_CONTENTS_VARIANTS.state[i.id === current ? \"active\" : \"default\"].classes,\n              )}\n            >\n              {i.id === current && <span aria-hidden className=\"absolute inset-y-4 left-0 w-2 rounded-pill bg-ink\" />}\n              {i.label}\n            </a>\n          </li>\n        ))}\n      </ul>\n    </nav>\n  );\n});\nif (process.env.NODE_ENV !== \"production\") TableOfContents.displayName = \"TableOfContents\";\n"],"mappings":";;;;;;AAIA,IAAaE,IAAmC,EAC9C,OAAO;CACL,SAAS,EAAE,SAAS,kCAAkC;CACtD,QAAQ,EAAE,SAAS,UAAU;AAC/B,EACF,GACaC,IAA2C,EAAE,OAAO,UAAU,GAerEC,IAAe;AAErB,SAASC,EAAa,GAA0B;CAC9C,KAAK,IAAIC,IAASC,EAAG,eAAeD,GAAQ,IAASA,EAAO,eAC1D,IAAI,gBAAgB,KAAK,iBAAiBA,CAAM,CAAC,CAAC,SAAS,KAAKA,EAAO,eAAeA,EAAO,cAAc,OAAOA;CAEpH,OAAO,SAAS,oBAAoB,SAAS;AAC/C;AAEA,IAAaE,IAAkC,kBAA8C,SAAyB,EAAE,UAAO,OAAOC,GAAW,WAAQ,gBAAa,GAAK;CACzK,IAAMC,IAAIT,EAAU,GACdU,IAAQF,KAAaC,EAAE,yBAAyB,cAAc,GAC9D,CAACE,GAAMC,KAAWC,EAASC,EAAM,EAAE,EAAE,EAAE;CAC7C,QAAgB;EACd,IAAIC,MAAW,KAAA,GAAW;EAC1B,IAAMC,IAAWF,EAAM,KAAK,MAAM,SAAS,eAAeG,EAAE,EAAE,CAAC,CAAC,CAAC,QAAQ,MAA0BX,MAAO,IAAI,GACxGY,IAAQF,EAAS;EACvB,IAAI,CAACE,GAAO;EACZ,IAAMC,IAAWf,EAAac,CAAK,GAC/BE,IAAQ,GACNC,UAAa;GACjB,IAAQ;GACR,IAAMC,IAAO,OAAO,cAAcnB,GAC9BoB,IAAKL,EAAM;GACf,KAAK,IAAMM,KAAKR,GAAU,AAAIQ,EAAE,sBAAsB,CAAC,CAAC,OAAOF,MAAM,IAAKE,EAAE;GAC5E,IAAMC,IAAMN,EAAS,YAAY,KAAKA,EAAS,YAAYA,EAAS,gBAAgBA,EAAS,eAAe;GAC5G,EAAQM,IAAOT,EAAS,GAAG,EAAE,CAAC,EAAE,MAAMO,IAAMA,CAAE;EAChD,GACMG,UAAiB;GACrB,MAAU,sBAAsBL,CAAI;EACtC;EAIA,OAHAA,EAAK,GACL,SAAS,iBAAiB,UAAUK,GAAU;GAAE,SAAS;GAAM,SAAS;EAAK,CAAC,GAC9E,OAAO,iBAAiB,UAAUA,CAAQ,SAC7B;GAGX,AAFA,qBAAqBN,CAAK,GAC1B,SAAS,oBAAoB,UAAUM,GAAU,EAAE,SAAS,GAAK,CAAC,GAClE,OAAO,oBAAoB,UAAUA,CAAQ;EAC/C;CACF,GAAG,CAACZ,GAAOC,CAAM,CAAC;CAClB,IAAMY,IAAUZ,KAAUJ;CAC1B,OACE,kBAAC,OAAD;EAAU;EAAK,cAAYD;EAAO,WAAWX,EAAG,iBAAiB6B,CAAS;EAA1E,UAAA,CACE,kBAAC,QAAD;GAAM,WAAU;GAAmD,UAAAlB;EAAY,CAAA,GAC/E,kBAAC,MAAD;GAAI,WAAU;GACX,UAAAI,EAAM,KAAK,MACV,kBAAC,MAAD,EAAA,UACE,kBAAC,KAAD;IACE,MAAM,IAAIG,EAAE;IACZ,gBAAcA,EAAE,OAAOU,IAAU,aAAa,KAAA;IAC9C,WAAW5B,EACT,wGACAkB,EAAE,QAAQ,UAAU,SACpBhB,EAAiC,MAAMgB,EAAE,OAAOU,IAAU,WAAW,UAAU,CAAC,OAClF;IAPF,UAAA,CASGV,EAAE,OAAOU,KAAW,kBAAC,QAAD;KAAM,eAAA;KAAY,WAAU;IAAqD,CAAA,GACrGV,EAAE,KACF;GACD,CAAA,EAAA,GAbKA,EAAE,EAaP,CACL;EACC,CAAA,CACD;;AAET,CAAC;AACD,QAAA,IAAA,aAA6B,iBAAc,EAAgB,cAAc"}

package/dist/components/toolbar.js

@@ -1,2 +1,2 @@
 "use client";
-export { t as KAESO_TOOLBAR_DEFAULT_VARIANTS, n as KAESO_TOOLBAR_VARIANTS, r as Toolbar } from "../chunks/toolbar-B_960Ttx.js";
+export { t as KAESO_TOOLBAR_DEFAULT_VARIANTS, n as KAESO_TOOLBAR_VARIANTS, r as Toolbar } from "../chunks/toolbar-WA_oZgu-.js";

package/dist/components/tooltip.js

@@ -1,5 +1,5 @@
 "use client";
-import { i as e, n as t, r as n, t as r } from "../chunks/tooltip-CRApbLF6.js";
+import { i as e, n as t, r as n, t as r } from "../chunks/tooltip-OcwO0VUT.js";
 import { jsx as i } from "react/jsx-runtime";
 import { Tooltip as a } from "@base-ui/react/tooltip";
 //#region src/components/tooltip/tooltip-provider.tsx

package/dist/components/visually-hidden.js

@@ -1,5 +1,5 @@
 "use client";
-import { t as e } from "../chunks/cn-Isw2DnQX.js";
+import { t as e } from "../chunks/cn-Dj6sRgkF.js";
 import { forwardRef as t } from "react";
 import { jsx as n } from "react/jsx-runtime";
 //#region src/components/visually-hidden/visually-hidden.tsx