@commenda/pathfinder 0.1.0 → 0.2.0

package/dist/components/feedback/FeedbackSurface.js

@@ -1,38 +1,66 @@
 "use client";
 import e from "clsx";
-import { useEffect as t, useState as n } from "react";
-import { jsx as r } from "react/jsx-runtime";
+import { useEffect as t, useLayoutEffect as n, useRef as r, useState as i } from "react";
+import { jsx as a } from "react/jsx-runtime";
 //#region src/components/feedback/FeedbackSurface.tsx
-var i = ({ open: i, defaultOpen: a = !0, onOpenChange: o, dismissConfig: s, children: c }) => {
-	let [l, u] = n(a), [d, f] = n(!1), [p, m] = n(!1), h = i ?? l, [g, _] = n(h);
-	g !== h && (_(h), h && f(!1));
-	let v = s?.onDismiss;
+var o = typeof window > "u" ? t : n, s = ({ open: n, defaultOpen: s = !0, onOpenChange: c, dismissConfig: l, children: u }) => {
+	let d = r(null), f = r([]), [p, m] = i(!1), [h, g] = i(s), [_, v] = i(!(n ?? s)), [y, b] = i(!1), x = n ?? h, [S, C] = i(x);
+	S !== x && (C(x), x && v(!1));
+	let w = l?.onDismiss;
 	return t(() => {
-		if (h || d) return;
+		if (x || _ && !y) return;
 		let e = setTimeout(() => {
-			f(!0), p && (m(!1), v?.());
-		}, 200);
+			_ ? (b(!1), w?.()) : (f.current = p ? Array.from(d.current?.parentElement?.children ?? []).filter((e) => e instanceof HTMLElement && e !== d.current).map((e) => {
+				let t = e.getBoundingClientRect();
+				return {
+					element: e,
+					top: t.top,
+					left: t.left
+				};
+			}) : [], v(!0));
+		}, p ? _ ? 180 : 100 : 0);
 		return () => {
 			clearTimeout(e);
 		};
 	}, [
-		h,
-		d,
-		p,
-		v
-	]), !h && d ? null : /* @__PURE__ */ r("div", {
-		"aria-hidden": !h || void 0,
+		x,
+		_,
+		y,
+		w,
+		p
+	]), o(() => {
+		if (!_ || x || !p) return;
+		let e = f.current.flatMap(({ element: e, top: t, left: n }) => {
+			let r = e.getBoundingClientRect(), i = n - r.left, a = t - r.top;
+			if (!i && !a || typeof e.animate != "function") return [];
+			let o = getComputedStyle(e).transform, s = o === "none" ? "" : o;
+			return [e.animate([{ transform: `translate(${String(i)}px, ${String(a)}px) ${s}` }, { transform: s || "none" }], {
+				duration: 180,
+				easing: "cubic-bezier(0.23,1,0.32,1)"
+			})];
+		});
+		return () => {
+			e.forEach((e) => {
+				e.cancel();
+			});
+		};
+	}, [
+		_,
+		x,
+		p
+	]), !x && _ ? null : /* @__PURE__ */ a("div", {
+		"aria-hidden": !x || void 0,
 		ref: (e) => {
-			e && (e.inert = !h);
+			d.current = e, e && (e.inert = !x);
 		},
-		className: e("pf:grid pf:transition-[grid-template-rows,opacity] pf:duration-200 pf:ease-[ease-out] pf:motion-reduce:transition-none", h ? "pf:grid-rows-[1fr] pf:opacity-100" : "pf:pointer-events-none pf:grid-rows-[0fr] pf:opacity-0"),
-		children: /* @__PURE__ */ r("div", {
+		className: e("pf:motion-reduce:transition-none", p && "pf:transition-opacity pf:duration-100 pf:ease-out", x ? "pf:opacity-100" : "pf:pointer-events-none pf:opacity-0"),
+		children: /* @__PURE__ */ a("div", {
 			className: "pf:min-h-0 pf:overflow-hidden",
-			children: c(() => {
-				m(!0), f(!1), u(!1), o?.(!1);
+			children: u((e) => {
+				m(e.detail > 0 && !(typeof window.matchMedia == "function" && window.matchMedia("(prefers-reduced-motion: reduce)").matches)), b(!0), v(!1), g(!1), c?.(!1);
 			})
 		})
 	});
 };
 //#endregion
-export { i as FeedbackSurface };
+export { s as FeedbackSurface };

package/dist/components/fields/FieldAction.d.ts

@@ -1,6 +1,7 @@
 export type CopyAction = {
     kind: 'copy';
     label?: string;
+    onCopy?: () => void;
     onCopyError?: (error: Error) => void;
 };
 export type FieldActionConfig = CopyAction | {

package/dist/components/fields/FieldAction.js

@@ -16,7 +16,7 @@ function c({ config: c, value: l, fieldLabel: u, disabled: d, revealed: f, onAct
 		onClick: () => {
 			c.kind === "copy" ? (async () => {
 				try {
-					await navigator.clipboard.writeText(l), h("Copied");
+					await navigator.clipboard.writeText(l), h("Copied"), c.onCopy?.();
 				} catch (e) {
 					h("Could not copy. Select the text and copy it manually."), c.onCopyError?.(e instanceof Error ? e : /* @__PURE__ */ Error("Clipboard unavailable"));
 				}
@@ -24,7 +24,7 @@ function c({ config: c, value: l, fieldLabel: u, disabled: d, revealed: f, onAct
 				h("Could not copy.");
 			}) : p();
 		},
-		className: "pf:self-stretch pf:shrink-0 pf:w-[28px] pf:flex pf:items-center pf:justify-center pf:border-0 pf:border-s pf:border-solid pf:border-soft-pearl-400 pf:bg-transparent pf:text-soft-pearl-800 pf:rounded-e-sm pf:hover:bg-soft-pearl-200 pf:focus-visible:outline-2 pf:focus-visible:outline-blue-700 pf:focus-visible:-outline-offset-2 pf:disabled:opacity-50 pf:disabled:cursor-not-allowed",
+		className: "pf:cursor-pointer pf:self-stretch pf:shrink-0 pf:w-[28px] pf:flex pf:items-center pf:justify-center pf:border-0 pf:border-s pf:border-solid pf:border-soft-pearl-400 pf:bg-transparent pf:text-soft-pearl-800 pf:rounded-e-sm pf:hover:bg-soft-pearl-200 pf:focus-visible:outline-2 pf:focus-visible:outline-blue-700 pf:focus-visible:-outline-offset-2 pf:disabled:opacity-50 pf:disabled:cursor-not-allowed",
 		children: /* @__PURE__ */ o(_, { size: 16 })
 	}), /* @__PURE__ */ o("span", {
 		role: "status",

package/dist/components/icon-button/IconButton.js

@@ -1,46 +1,46 @@
 "use client";
-import { getControlClassNames as e } from "../controls/control-class-names.js";
-import { ControlHint as t } from "../controls/ControlHint.js";
-import { ControlIcon as n } from "../controls/ControlIcon.js";
-import r from "clsx";
-import { Button as i } from "@base-ui/react/button";
-import { forwardRef as a, useId as o } from "react";
-import { Fragment as s, jsx as c, jsxs as l } from "react/jsx-runtime";
+import { controlPressClassNames as e, getControlClassNames as t } from "../controls/control-class-names.js";
+import { ControlHint as n } from "../controls/ControlHint.js";
+import { ControlIcon as r } from "../controls/ControlIcon.js";
+import i from "clsx";
+import { Button as a } from "@base-ui/react/button";
+import { forwardRef as o, useId as s } from "react";
+import { Fragment as c, jsx as l, jsxs as u } from "react/jsx-runtime";
 //#region src/components/icon-button/IconButton.tsx
-var u = a(({ label: a, children: u, variant: d = "tertiary", size: f = "md", destructive: p, disabled: m = !1, disabledReason: h, tooltip: g = !0, className: _, type: v = "button", "aria-describedby": y, focusableWhenDisabled: b, ...x }, S) => {
-	let C = o(), w = m ? h : void 0;
-	return /* @__PURE__ */ l(s, { children: [/* @__PURE__ */ c(t, {
-		label: g ? w ? `${a}: ${w}` : a : void 0,
-		children: /* @__PURE__ */ c(i, {
-			...x,
-			type: v,
-			ref: S,
-			"aria-label": a,
-			disabled: m,
-			focusableWhenDisabled: b ?? !!w,
-			"aria-describedby": [y, w ? C : void 0].filter(Boolean).join(" ") || void 0,
-			"data-variant": d,
-			"data-size": f,
-			"data-destructive": p || void 0,
-			"data-unavailable": m || void 0,
-			className: r("pf-control pf-icon-button", e({
-				variant: d,
-				size: f,
-				destructive: p,
-				disabled: m,
+var d = o(({ label: o, children: d, variant: f = "tertiary", size: p = "md", destructive: m, disabled: h = !1, disabledReason: g, tooltip: _ = !0, className: v, type: y = "button", "aria-describedby": b, focusableWhenDisabled: x, ...S }, C) => {
+	let w = s(), T = h ? g : void 0;
+	return /* @__PURE__ */ u(c, { children: [/* @__PURE__ */ l(n, {
+		label: _ ? T ? `${o}: ${T}` : o : void 0,
+		children: /* @__PURE__ */ l(a, {
+			...S,
+			type: y,
+			ref: C,
+			"aria-label": o,
+			disabled: h,
+			focusableWhenDisabled: x ?? !!T,
+			"aria-describedby": [b, T ? w : void 0].filter(Boolean).join(" ") || void 0,
+			"data-variant": f,
+			"data-size": p,
+			"data-destructive": m || void 0,
+			"data-unavailable": h || void 0,
+			className: i("pf-control pf-icon-button", t({
+				variant: f,
+				size: p,
+				destructive: m,
+				disabled: h,
 				iconOnly: !0
-			}), _),
-			children: /* @__PURE__ */ c(n, {
-				size: f === "lg" ? 20 : 16,
-				children: u
+			}), e, v),
+			children: /* @__PURE__ */ l(r, {
+				size: p === "lg" ? 20 : 16,
+				children: d
 			})
 		})
-	}), w && /* @__PURE__ */ c("span", {
+	}), T && /* @__PURE__ */ l("span", {
 		className: "pf-control-sr pf:sr-only",
-		id: C,
-		children: w
+		id: w,
+		children: T
 	})] });
 });
-u.displayName = "PathfinderIconButton";
+d.displayName = "PathfinderIconButton";
 //#endregion
-export { u as IconButton };
+export { d as IconButton };