asheeui 1.0.0 → 1.1.1

package/dist/components/calendar/DateGrid.js

@@ -1,194 +1,194 @@
 "use client";
 import { cn as e } from "../../utils/cn.js";
 import { ChevronRightIcon as t } from "../../icons/ChevronRightIcon.js";
-import { ChevronLeftIcon as n } from "../../icons/ChevronLeftIcon.js";
-import { DAYS_OF_WEEK as r, MONTHS as i, buildDayCells as a } from "./calendar.helpers.js";
-import { CALENDAR_COLOR_CLASSES as o, DATE_PICKER_CELL_SIZE_CLASS as s } from "./calendar-styles.js";
-import { TimeSpinner as c } from "./TimeSpinner.js";
-import { memo as l, useCallback as u, useEffect as d, useMemo as f, useRef as p, useState as m } from "react";
-import { jsx as h, jsxs as g } from "react/jsx-runtime";
+import { DAYS_OF_WEEK as n, MONTHS as r, buildDayCells as ee } from "./calendar.helpers.js";
+import { ChevronLeftIcon as i } from "../../icons/ChevronLeftIcon.js";
+import { CALENDAR_COLOR_CLASSES as a, DATE_PICKER_CELL_SIZE_CLASS as o } from "./calendar-styles.js";
+import { TimeSpinner as s } from "./TimeSpinner.js";
+import { memo as c, useCallback as te, useEffect as l, useMemo as u, useRef as d, useState as f } from "react";
+import { jsx as p, jsxs as m } from "react/jsx-runtime";
 //#region src/components/calendar/DateGrid.tsx
-var _ = l(function({ selected: l, mode: _, isClearable: v, resolvedSizeKey: y, resolvedColor: b, radiusClass: x, onSelect: S, onClose: C, disableFuture: w = !1 }) {
-	let T = /* @__PURE__ */ new Date(), [E, D] = m(l?.getFullYear() ?? T.getFullYear()), [O, k] = m(l?.getMonth() ?? T.getMonth()), [A, ee] = m(l?.getHours() ?? 0), [j, te] = m(l?.getMinutes() ?? 0), [M, N] = m(l?.getSeconds() ?? 0), [P, F] = m(() => l ?? T), I = p({}), L = p(!1), R = (e) => `${e.getFullYear()}-${e.getMonth()}-${e.getDate()}`, z = u((e) => {
-		F((t) => {
+var h = c(function({ selected: c, mode: h, isClearable: g, resolvedSizeKey: _, resolvedColor: v, radiusClass: y, onSelect: b, onClose: x, disableFuture: S = !1 }) {
+	let C = /* @__PURE__ */ new Date(), [w, T] = f(c?.getFullYear() ?? C.getFullYear()), [E, D] = f(c?.getMonth() ?? C.getMonth()), [O, ne] = f(c?.getHours() ?? 0), [k, A] = f(c?.getMinutes() ?? 0), [j, M] = f(c?.getSeconds() ?? 0), [N, P] = f(() => c ?? C), F = d({}), I = d(!1), L = (e) => `${e.getFullYear()}-${e.getMonth()}-${e.getDate()}`, R = te((e) => {
+		P((t) => {
 			let n = new Date(t.getFullYear(), t.getMonth(), t.getDate() + e);
-			return D(n.getFullYear()), k(n.getMonth()), L.current = !0, n;
+			return T(n.getFullYear()), D(n.getMonth()), I.current = !0, n;
 		});
 	}, []);
-	d(() => {
-		L.current && (L.current = !1, I.current[R(P)]?.focus());
+	l(() => {
+		I.current && (I.current = !1, F.current[L(N)]?.focus());
 	});
-	function B(e) {
+	function z(e) {
 		switch (e.key) {
 			case "ArrowLeft":
-				e.preventDefault(), z(-1);
+				e.preventDefault(), R(-1);
 				return;
 			case "ArrowRight":
-				e.preventDefault(), z(1);
+				e.preventDefault(), R(1);
 				return;
 			case "ArrowUp":
-				e.preventDefault(), z(-7);
+				e.preventDefault(), R(-7);
 				return;
 			case "ArrowDown":
-				e.preventDefault(), z(7);
+				e.preventDefault(), R(7);
 				return;
 			case "PageUp":
-				e.preventDefault(), z(-30);
+				e.preventDefault(), R(-30);
 				return;
 			case "PageDown":
-				e.preventDefault(), z(30);
+				e.preventDefault(), R(30);
 				return;
 		}
 	}
-	let V = o[b] ?? o.primary;
-	function H(e, t, n) {
-		let r = l ?? /* @__PURE__ */ new Date();
-		S(new Date(r.getFullYear(), r.getMonth(), r.getDate(), e, t, n, 0));
+	let B = a[v] ?? a.primary;
+	function V(e, t, n) {
+		let r = c ?? /* @__PURE__ */ new Date();
+		b(new Date(r.getFullYear(), r.getMonth(), r.getDate(), e, t, n, 0));
+	}
+	function H(e) {
+		ne(e), V(e, k, j);
 	}
 	function U(e) {
-		ee(e), H(e, j, M);
+		A(e), V(O, e, j);
 	}
 	function W(e) {
-		te(e), H(A, e, M);
+		M(e), V(O, k, e);
 	}
 	function G(e) {
-		N(e), H(A, j, e);
-	}
-	function K(e) {
-		S(new Date(E, O, e, A, j, M, 0)), _ === "date" && C();
+		b(new Date(w, E, e, O, k, j, 0)), h === "date" && x();
 	}
-	function ne() {
-		O === 0 ? (k(11), D((e) => e - 1)) : k((e) => e - 1);
+	function K() {
+		E === 0 ? (D(11), T((e) => e - 1)) : D((e) => e - 1);
 	}
 	function re() {
-		O === 11 ? (k(0), D((e) => e + 1)) : k((e) => e + 1);
+		E === 11 ? (D(0), T((e) => e + 1)) : D((e) => e + 1);
 	}
 	function q(e) {
-		return !!l && l.getFullYear() === E && l.getMonth() === O && l.getDate() === e;
+		return !!c && c.getFullYear() === w && c.getMonth() === E && c.getDate() === e;
 	}
 	function J(e) {
-		return T.getFullYear() === E && T.getMonth() === O && T.getDate() === e;
+		return C.getFullYear() === w && C.getMonth() === E && C.getDate() === e;
 	}
-	let ie = new Date(T.getFullYear(), T.getMonth(), T.getDate());
+	let ie = new Date(C.getFullYear(), C.getMonth(), C.getDate());
 	function Y(e) {
-		return w ? new Date(E, O, e) > ie : !1;
+		return S ? new Date(w, E, e) > ie : !1;
 	}
-	let X = !w || E < T.getFullYear() || E === T.getFullYear() && O < T.getMonth(), Z = _ === "date" || _ === "datetime", ae = _ === "time" || _ === "datetime", oe = _ !== "date" || v && !!l, Q = a(E, O), $ = f(() => Q.map((e, t) => ({
+	let X = !S || w < C.getFullYear() || w === C.getFullYear() && E < C.getMonth(), Z = h === "date" || h === "datetime", ae = h === "time" || h === "datetime", oe = h !== "date" || g && !!c, Q = ee(w, E), $ = u(() => Q.map((e, t) => ({
 		key: e === null ? `empty-slot-${t}` : `day-${e}`,
 		day: e
-	})), [Q]), se = f(() => {
+	})), [Q]), se = u(() => {
 		let e = [];
 		for (let t = 0; t < $.length; t += 7) e.push($.slice(t, t + 7));
 		return e;
 	}, [$]);
-	return /* @__PURE__ */ g("div", {
-		className: e("bg-background border border-border/70 shadow-xl select-none p-4 w-max", x),
-		children: [/* @__PURE__ */ g("div", {
+	return /* @__PURE__ */ m("div", {
+		className: e("bg-background border border-border/70 shadow-xl select-none p-4 w-max", y),
+		children: [/* @__PURE__ */ m("div", {
 			className: "flex flex-row",
-			children: [Z && /* @__PURE__ */ g("div", {
+			children: [Z && /* @__PURE__ */ m("div", {
 				className: "flex flex-col w-[264px]",
-				children: [/* @__PURE__ */ g("div", {
+				children: [/* @__PURE__ */ m("div", {
 					className: "flex items-center justify-between pb-3 mb-2 border-b border-border/60",
 					children: [
-						/* @__PURE__ */ h("button", {
+						/* @__PURE__ */ p("button", {
 							type: "button",
-							onClick: ne,
+							onClick: K,
 							"aria-label": "Previous month",
-							className: e("p-1.5 text-foreground/70 transition-all active:scale-95", "hover:text-foreground hover:bg-secondary", x),
-							children: /* @__PURE__ */ h(n, {})
+							className: e("p-1.5 text-foreground/70 transition-all active:scale-95", "hover:text-foreground hover:bg-secondary", y),
+							children: /* @__PURE__ */ p(i, {})
 						}),
-						/* @__PURE__ */ g("span", {
+						/* @__PURE__ */ m("span", {
 							className: "font-semibold text-sm text-foreground tracking-wide",
 							children: [
-								i[O],
+								r[E],
 								" ",
-								E
+								w
 							]
 						}),
-						/* @__PURE__ */ h("button", {
+						/* @__PURE__ */ p("button", {
 							type: "button",
 							onClick: re,
 							disabled: !X,
 							"aria-label": "Next month",
-							className: e("p-1.5 text-foreground/70 transition-all", X ? "hover:text-foreground hover:bg-secondary active:scale-95" : "opacity-30 cursor-not-allowed", x),
-							children: /* @__PURE__ */ h(t, {})
+							className: e("p-1.5 text-foreground/70 transition-all", X ? "hover:text-foreground hover:bg-secondary active:scale-95" : "opacity-30 cursor-not-allowed", y),
+							children: /* @__PURE__ */ p(t, {})
 						})
 					]
-				}), /* @__PURE__ */ g("table", {
+				}), /* @__PURE__ */ m("table", {
 					role: "grid",
-					"aria-label": `${i[O]} ${E}`,
+					"aria-label": `${r[E]} ${w}`,
 					tabIndex: -1,
-					onKeyDown: B,
+					onKeyDown: z,
 					className: "w-full table-fixed border-separate border-spacing-1 text-center",
-					children: [/* @__PURE__ */ h("thead", { children: /* @__PURE__ */ h("tr", { children: r.map((e) => /* @__PURE__ */ h("th", {
+					children: [/* @__PURE__ */ p("thead", { children: /* @__PURE__ */ p("tr", { children: n.map((e) => /* @__PURE__ */ p("th", {
 						scope: "col",
 						className: "text-[11px] font-bold tracking-wider text-foreground/50 uppercase py-1 mb-1",
 						children: e
-					}, e)) }) }), /* @__PURE__ */ h("tbody", { children: se.map((t, n) => /* @__PURE__ */ h("tr", { children: t.map(({ key: t, day: n }) => n === null ? /* @__PURE__ */ h("td", {}, t) : /* @__PURE__ */ h("td", {
+					}, e)) }) }), /* @__PURE__ */ p("tbody", { children: se.map((t, n) => /* @__PURE__ */ p("tr", { children: t.map(({ key: t, day: n }) => n === null ? /* @__PURE__ */ p("td", {}, t) : /* @__PURE__ */ p("td", {
 						role: "gridcell",
 						tabIndex: -1,
 						"aria-selected": q(n),
 						"aria-current": J(n) ? "date" : void 0,
-						children: /* @__PURE__ */ h("button", {
+						children: /* @__PURE__ */ p("button", {
 							ref: (e) => {
-								I.current[R(new Date(E, O, n))] = e;
+								F.current[L(new Date(w, E, n))] = e;
 							},
 							type: "button",
-							tabIndex: P.getFullYear() === E && P.getMonth() === O && P.getDate() === n ? 0 : -1,
-							"aria-label": `${n} ${i[O]} ${E}`,
-							onClick: () => K(n),
+							tabIndex: N.getFullYear() === w && N.getMonth() === E && N.getDate() === n ? 0 : -1,
+							"aria-label": `${n} ${r[E]} ${w}`,
+							onClick: () => G(n),
 							disabled: Y(n),
-							className: e("w-full flex items-center justify-center font-medium transition-all duration-200", s[y], x, Y(n) ? "opacity-30 cursor-not-allowed text-foreground/50" : "active:scale-90", !Y(n) && !q(n) && !J(n) && V.hover, q(n) && e(V.bg, "font-semibold shadow-sm"), J(n) && !q(n) && e("border", V.border, V.text), !q(n) && !J(n) && "text-foreground"),
+							className: e("w-full flex items-center justify-center font-medium transition-all duration-200", o[_], y, Y(n) ? "opacity-30 cursor-not-allowed text-foreground/50" : "active:scale-90", !Y(n) && !q(n) && !J(n) && B.hover, q(n) && e(B.bg, "font-semibold shadow-sm"), J(n) && !q(n) && e("border", B.border, B.text), !q(n) && !J(n) && "text-foreground"),
 							children: n
 						})
 					}, t)) }, t[0]?.key ?? `week-${n}`)) })]
 				})]
-			}), ae && /* @__PURE__ */ g("div", {
+			}), ae && /* @__PURE__ */ m("div", {
 				className: e("flex items-center justify-center gap-4", Z && "pl-5 ml-4 border-l border-border/60"),
 				children: [
-					/* @__PURE__ */ h(c, {
-						value: A,
+					/* @__PURE__ */ p(s, {
+						value: O,
 						max: 23,
 						label: "HH",
-						onChange: U,
-						resolvedColor: b,
-						radiusClass: x
+						onChange: H,
+						resolvedColor: v,
+						radiusClass: y
 					}),
-					/* @__PURE__ */ h(c, {
-						value: j,
+					/* @__PURE__ */ p(s, {
+						value: k,
 						max: 59,
 						label: "MM",
-						onChange: W,
-						resolvedColor: b,
-						radiusClass: x
+						onChange: U,
+						resolvedColor: v,
+						radiusClass: y
 					}),
-					/* @__PURE__ */ h(c, {
-						value: M,
+					/* @__PURE__ */ p(s, {
+						value: j,
 						max: 59,
 						label: "SS",
-						onChange: G,
-						resolvedColor: b,
-						radiusClass: x
+						onChange: W,
+						resolvedColor: v,
+						radiusClass: y
 					})
 				]
 			})]
-		}), oe && /* @__PURE__ */ g("div", {
+		}), oe && /* @__PURE__ */ m("div", {
 			className: "flex items-center justify-between border-t border-border/60 pt-3 mt-3",
-			children: [v && l ? /* @__PURE__ */ h("button", {
+			children: [g && c ? /* @__PURE__ */ p("button", {
 				type: "button",
 				onClick: () => {
-					S(null), C();
+					b(null), x();
 				},
 				className: "text-xs font-medium text-foreground/50 hover:text-danger transition-colors active:scale-95 px-2 py-1",
 				children: "Clear"
-			}) : /* @__PURE__ */ h("div", {}), _ !== "date" && /* @__PURE__ */ h("button", {
+			}) : /* @__PURE__ */ p("div", {}), h !== "date" && /* @__PURE__ */ p("button", {
 				type: "button",
-				onClick: C,
-				className: e("ml-auto text-xs font-semibold px-4 py-2 transition-all hover:opacity-90 active:scale-95 shadow-sm", x, V.bg),
+				onClick: x,
+				className: e("ml-auto text-xs font-semibold px-4 py-2 transition-all hover:opacity-90 active:scale-95 shadow-sm", y, B.bg),
 				children: "Done"
 			})]
 		})]
 	});
 });
 //#endregion
-export { _ as DateGrid };
+export { h as DateGrid };

package/dist/components/clipboard/Clipboard.d.ts

@@ -0,0 +1,75 @@
+import { ReactNode } from 'react';
+/**
+ * What a clipboard consumer renders with.
+ */
+export interface ClipboardState {
+    /**
+     * Whether the text is on the clipboard.
+     * It returns to false after the configured timeout.
+     */
+    copied: boolean;
+    /**
+     * Whether the last attempt failed.
+     * A browser refuses clipboard access outside a user gesture or without
+     * permission, which is a state a consumer usually wants to surface.
+     */
+    error: boolean;
+    /**
+     * Copy the component's value, or the given text.
+     *
+     * @param text - Text to copy instead of the component's value.
+     * @returns Whether the copy succeeded.
+     */
+    copy: (text?: string) => Promise<boolean>;
+    /** Clear the copied and error states without copying. */
+    reset: () => void;
+}
+/**
+ * Props for the Clipboard component.
+ */
+export interface ClipboardProps {
+    /** Text copied when `copy` is called without an argument. */
+    value?: string;
+    /**
+     * How long the copied state lasts, in milliseconds.
+     * Defaults to `components.clipboard.timeout`, then to the framework fallback.
+     */
+    timeout?: number;
+    /** Called after a successful copy. */
+    onCopy?: (text: string) => void;
+    /** Called after a failed copy. */
+    onError?: (error: unknown) => void;
+    /** Renders the control, using the clipboard state. */
+    children: (state: ClipboardState) => ReactNode;
+}
+/**
+ * Copies text and reports the result through a render function.
+ *
+ * The copied state is a timer, not a change of value, so this component keeps
+ * one and clears it on unmount. Copying is a user-triggered side effect, so the
+ * component performs no clipboard work during render and renders identically on
+ * the server and the client.
+ *
+ * @param props - The value, the timing and the render function.
+ * @param props.value - Text copied by a bare `copy()` call.
+ * @param props.timeout - How long the copied state lasts.
+ * @param props.onCopy - Called after a successful copy.
+ * @param props.onError - Called after a failed copy.
+ * @param props.children - Renders the control.
+ * @returns The rendered control.
+ *
+ * @example
+ * ```tsx
+ * <Clipboard value={invoice.id}>
+ *   {({ copied, copy }) => (
+ *     <button type="button" onClick={() => copy()}>
+ *       {copied ? "Copied" : "Copy invoice number"}
+ *     </button>
+ *   )}
+ * </Clipboard>
+ * ```
+ *
+ * @see CopyButton - The framework's own copy control.
+ */
+export declare function Clipboard({ value, timeout, onCopy, onError, children, }: ClipboardProps): import("react").JSX.Element;
+//# sourceMappingURL=Clipboard.d.ts.map

package/dist/components/clipboard/Clipboard.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Clipboard.d.ts","sourceRoot":"","sources":["../../../src/components/clipboard/Clipboard.tsx"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAIH,OAAO,EACL,KAAK,SAAS,EAKf,MAAM,OAAO,CAAC;AAKf;;GAEG;AACH,MAAM,WAAW,cAAc;IAC7B;;;OAGG;IACH,MAAM,EAAE,OAAO,CAAC;IAEhB;;;;OAIG;IACH,KAAK,EAAE,OAAO,CAAC;IAEf;;;;;OAKG;IACH,IAAI,EAAE,CAAC,IAAI,CAAC,EAAE,MAAM,KAAK,OAAO,CAAC,OAAO,CAAC,CAAC;IAE1C,yDAAyD;IACzD,KAAK,EAAE,MAAM,IAAI,CAAC;CACnB;AAED;;GAEG;AACH,MAAM,WAAW,cAAc;IAC7B,6DAA6D;IAC7D,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB,sCAAsC;IACtC,MAAM,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAEhC,kCAAkC;IAClC,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAC;IAEnC,sDAAsD;IACtD,QAAQ,EAAE,CAAC,KAAK,EAAE,cAAc,KAAK,SAAS,CAAC;CAChD;AA0CD;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AACH,wBAAgB,SAAS,CAAC,EACxB,KAAK,EACL,OAAO,EACP,MAAM,EACN,OAAO,EACP,QAAQ,GACT,EAAE,cAAc,+BAiEhB"}

package/dist/components/clipboard/Clipboard.js

@@ -0,0 +1,53 @@
+"use client";
+"use client";
+import { useAsheeConfig as e } from "../../libs/context.js";
+import { resolveAnimate as t } from "../../utils/resolve-token.js";
+import { FALLBACK_CLIPBOARD_CONFIG as n } from "./clipboard-config.js";
+import { useCallback as r, useEffect as i, useRef as a, useState as o } from "react";
+import { Fragment as s, jsx as c } from "react/jsx-runtime";
+//#region src/components/clipboard/Clipboard.tsx
+async function l(e) {
+	if (typeof navigator < "u" && navigator.clipboard?.writeText) return await navigator.clipboard.writeText(e), !0;
+	if (typeof document > "u") return !1;
+	let t = document.createElement("textarea");
+	t.value = e, t.setAttribute("readonly", ""), t.style.position = "fixed", t.style.opacity = "0";
+	let n = document.activeElement;
+	document.body.appendChild(t), t.select();
+	try {
+		return document.execCommand("copy");
+	} finally {
+		t.remove(), n instanceof HTMLElement && n.focus();
+	}
+}
+function u({ value: u, timeout: d, onCopy: f, onError: p, children: m }) {
+	let h = e(), g = t(d, h.components?.clipboard?.timeout, n.timeout), [_, v] = o(!1), [y, b] = o(!1), x = a(null), S = r(() => {
+		x.current !== null && (clearTimeout(x.current), x.current = null);
+	}, []);
+	i(() => S, [S]);
+	let C = r(() => {
+		S(), v(!1), b(!1);
+	}, [S]), w = r(async (e) => {
+		let t = e ?? u ?? "";
+		try {
+			return await l(t) ? (S(), b(!1), v(!0), f?.(t), x.current = setTimeout(() => {
+				v(!1), x.current = null;
+			}, g), !0) : (S(), b(!0), v(!1), p?.(/* @__PURE__ */ Error("Clipboard access was refused")), !1);
+		} catch (e) {
+			return S(), b(!0), v(!1), p?.(e), !1;
+		}
+	}, [
+		S,
+		f,
+		p,
+		g,
+		u
+	]);
+	return /* @__PURE__ */ c(s, { children: m({
+		copied: _,
+		error: y,
+		copy: w,
+		reset: C
+	}) });
+}
+//#endregion
+export { u as Clipboard };

package/dist/components/clipboard/CopyButton.d.ts

@@ -0,0 +1,64 @@
+import { ReactNode } from 'react';
+import { ButtonProps } from '../button/Button';
+type BaseCopyButtonProps = Omit<ButtonProps, "children" | "startContent" | "endContent" | "onClick" | "onCopy" | "isLoading">;
+/**
+ * Props for the CopyButton component.
+ */
+export interface CopyButtonProps extends BaseCopyButtonProps {
+    /** Text written to the clipboard. */
+    value: string;
+    /** Name of the control. Defaults to `components.clipboard.label`. */
+    label?: ReactNode;
+    /** Name of the control once the text is copied. Defaults to
+     * `components.clipboard.copiedLabel`. */
+    copiedLabel?: ReactNode;
+    /** Announcement made through the status region once the text is copied. */
+    copiedAnnouncement?: string;
+    /**
+     * How long the copied state lasts, in milliseconds.
+     * Defaults to `components.clipboard.timeout`.
+     */
+    timeout?: number;
+    /** Called after a successful copy. */
+    onCopy?: (text: string) => void;
+    /** Called after a failed copy. */
+    onError?: (error: unknown) => void;
+    /** Icon shown before the copy. @default CopyIcon */
+    copyIcon?: ReactNode;
+    /** Icon shown after a successful copy. @default CheckIcon */
+    copiedIcon?: ReactNode;
+}
+/**
+ * A button that copies a value to the clipboard.
+ *
+ * The control reports its result twice: the label changes to the copied wording
+ * and a status region announces the same thing, because a label change alone is
+ * not announced by a screen reader. Focus stays on the button, so a reader can
+ * copy again immediately.
+ *
+ * @param props - CopyButton configuration options and button props.
+ * @param props.value - Text written to the clipboard.
+ * @param props.label - Name of the control before a copy.
+ * @param props.copiedLabel - Name of the control after a copy.
+ * @param props.copiedAnnouncement - Announcement made after a copy.
+ * @param props.timeout - How long the copied state lasts.
+ * @param props.onCopy - Called after a successful copy.
+ * @param props.onError - Called after a failed copy.
+ * @param props.copyIcon - Icon shown before the copy.
+ * @param props.copiedIcon - Icon shown after a copy.
+ * @returns The rendered control and its status region.
+ *
+ * @example
+ * ```tsx
+ * <CopyButton
+ *   value="INV-1042"
+ *   label="Copy invoice number"
+ *   copiedAnnouncement="Invoice number copied"
+ * />
+ * ```
+ *
+ * @see Clipboard - The headless primitive, for a consumer's own control.
+ */
+export declare const CopyButton: import('react').ForwardRefExoticComponent<CopyButtonProps & import('react').RefAttributes<HTMLButtonElement>>;
+export {};
+//# sourceMappingURL=CopyButton.d.ts.map

package/dist/components/clipboard/CopyButton.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CopyButton.d.ts","sourceRoot":"","sources":["../../../src/components/clipboard/CopyButton.tsx"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAIH,OAAO,EAAc,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAKnD,OAAO,EAAU,KAAK,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAK5D,KAAK,mBAAmB,GAAG,IAAI,CAC7B,WAAW,EACT,UAAU,GACV,cAAc,GACd,YAAY,GACZ,SAAS,GACT,QAAQ,GACR,WAAW,CACd,CAAC;AAEF;;GAEG;AACH,MAAM,WAAW,eAAgB,SAAQ,mBAAmB;IAC1D,qCAAqC;IACrC,KAAK,EAAE,MAAM,CAAC;IAEd,qEAAqE;IACrE,KAAK,CAAC,EAAE,SAAS,CAAC;IAElB;6CACyC;IACzC,WAAW,CAAC,EAAE,SAAS,CAAC;IAExB,2EAA2E;IAC3E,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAE5B;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB,sCAAsC;IACtC,MAAM,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAEhC,kCAAkC;IAClC,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAC;IAEnC,oDAAoD;IACpD,QAAQ,CAAC,EAAE,SAAS,CAAC;IAErB,6DAA6D;IAC7D,UAAU,CAAC,EAAE,SAAS,CAAC;CACxB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8BG;AACH,eAAO,MAAM,UAAU,+GAyEtB,CAAC"}

package/dist/components/clipboard/CopyButton.js

@@ -0,0 +1,44 @@
+"use client";
+"use client";
+import { useAsheeConfig as e } from "../../libs/context.js";
+import { resolveCascade as t } from "../../utils/resolve-token.js";
+import { CheckIcon as n } from "../../icons/CheckIcon.js";
+import { Button as r } from "../button/Button.js";
+import { FALLBACK_CLIPBOARD_CONFIG as i } from "./clipboard-config.js";
+import { Clipboard as a } from "./Clipboard.js";
+import { CopyIcon as o } from "../../icons/CopyIcon.js";
+import { CLIPBOARD_STATUS_CLASS as s } from "./clipboard-styles.js";
+import { forwardRef as c } from "react";
+import { Fragment as l, jsx as u, jsxs as d } from "react/jsx-runtime";
+//#region src/components/clipboard/CopyButton.tsx
+var f = c(({ value: c, label: f, copiedLabel: p, copiedAnnouncement: m, timeout: h, onCopy: g, onError: _, copyIcon: v, copiedIcon: y, ...b }, x) => {
+	let S = e().components?.clipboard, C = t(f, S?.label, void 0, i.label), w = t(p, S?.copiedLabel, void 0, i.copiedLabel);
+	return /* @__PURE__ */ u(a, {
+		value: c,
+		timeout: h,
+		onCopy: g,
+		onError: _,
+		children: ({ copied: e, copy: t }) => /* @__PURE__ */ d(l, { children: [/* @__PURE__ */ u(r, {
+			ref: x,
+			type: "button",
+			variant: b.variant ?? S?.variant ?? void 0,
+			color: b.color ?? S?.color ?? void 0,
+			size: b.size ?? S?.size ?? void 0,
+			startContent: e ? y ?? /* @__PURE__ */ u(n, {}) : v ?? /* @__PURE__ */ u(o, {}),
+			onClick: () => {
+				t();
+			},
+			...b,
+			children: e ? w : C
+		}), /* @__PURE__ */ u("span", {
+			role: "status",
+			"aria-live": "polite",
+			className: s,
+			"data-copied": e ? "true" : void 0,
+			children: e ? m ?? `${String(w)}: ${c}` : ""
+		})] })
+	});
+});
+f.displayName = "CopyButton";
+//#endregion
+export { f as CopyButton };

package/dist/components/clipboard/clipboard-config.d.ts

@@ -0,0 +1,42 @@
+import { Color, Radius, Size, Variant } from '../../shared';
+/**
+ * Theme configuration options for the clipboard components.
+ *
+ * Set under `components.clipboard` in the AsheeUI config. Values feed the
+ * component-level fallback tier of the theme cascade.
+ */
+export interface ClipboardConfig {
+    /**
+     * How long the copied state lasts, in milliseconds.
+     *
+     * @default 2000
+     */
+    timeout?: number;
+    /** Name of the copy control. @default "Copy" */
+    label?: string;
+    /** Name of the copy control once the text is on the clipboard.
+     * @default "Copied" */
+    copiedLabel?: string;
+    /** Visual style of the copy control. @default "bordered" */
+    variant?: Variant;
+    /** Accent colour of the copy control. @default "primary" */
+    color?: Color;
+    /** Density of the copy control. @default "sm" */
+    size?: Size;
+    /** Corner rounding of the copy control. Defaults to the framework radius. */
+    radius?: Radius;
+}
+/**
+ * Default config values registered for the clipboard components.
+ */
+export declare const defaultClipboardConfig: ClipboardConfig;
+declare module "../../libs/registry" {
+    interface ComponentTypeConfigRegistry {
+        clipboard: ClipboardConfig;
+    }
+}
+/**
+ * Hard fallback values used when no config tier provides a value.
+ */
+export declare const FALLBACK_CLIPBOARD_CONFIG: Required<ClipboardConfig>;
+//# sourceMappingURL=clipboard-config.d.ts.map

package/dist/components/clipboard/clipboard-config.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"clipboard-config.d.ts","sourceRoot":"","sources":["../../../src/components/clipboard/clipboard-config.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAGH,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AAEjE;;;;;GAKG;AACH,MAAM,WAAW,eAAe;IAC9B;;;;OAIG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB,gDAAgD;IAChD,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;2BACuB;IACvB,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB,4DAA4D;IAC5D,OAAO,CAAC,EAAE,OAAO,CAAC;IAElB,4DAA4D;IAC5D,KAAK,CAAC,EAAE,KAAK,CAAC;IAEd,iDAAiD;IACjD,IAAI,CAAC,EAAE,IAAI,CAAC;IAEZ,6EAA6E;IAC7E,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED;;GAEG;AACH,eAAO,MAAM,sBAAsB,EAAE,eAOpC,CAAC;AAEF,OAAO,QAAQ,qBAAqB,CAAC;IACnC,UAAU,2BAA2B;QACnC,SAAS,EAAE,eAAe,CAAC;KAC5B;CACF;AAID;;GAEG;AACH,eAAO,MAAM,yBAAyB,EAAE,QAAQ,CAAC,eAAe,CAQ/D,CAAC"}

package/dist/components/clipboard/clipboard-config.js

@@ -0,0 +1,23 @@
+"use client";
+import { registerComponentDefaults as e } from "../../libs/registry.js";
+//#region src/components/clipboard/clipboard-config.ts
+var t = {
+	timeout: 2e3,
+	label: "Copy",
+	copiedLabel: "Copied",
+	variant: "bordered",
+	color: "primary",
+	size: "sm"
+};
+e("clipboard", t);
+var n = {
+	timeout: 2e3,
+	label: "Copy",
+	copiedLabel: "Copied",
+	variant: "bordered",
+	color: "primary",
+	size: "sm",
+	radius: "sm"
+};
+//#endregion
+export { n as FALLBACK_CLIPBOARD_CONFIG, t as defaultClipboardConfig };

package/dist/components/clipboard/clipboard-styles.d.ts

@@ -0,0 +1,11 @@
+/**
+ * Clipboard component styles for AsheeUI.
+ * This file provides the static class mappings for the clipboard pair.
+ */
+/**
+ * The status region a copy control announces its result through.
+ * It is visually hidden and stays in the document, so the change is announced
+ * without moving the reader's focus off the control they pressed.
+ */
+export declare const CLIPBOARD_STATUS_CLASS = "sr-only";
+//# sourceMappingURL=clipboard-styles.d.ts.map

package/dist/components/clipboard/clipboard-styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"clipboard-styles.d.ts","sourceRoot":"","sources":["../../../src/components/clipboard/clipboard-styles.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH;;;;GAIG;AACH,eAAO,MAAM,sBAAsB,YAAY,CAAC"}

package/dist/components/clipboard/clipboard-styles.js

@@ -0,0 +1,5 @@
+"use client";
+//#region src/components/clipboard/clipboard-styles.ts
+var e = "sr-only";
+//#endregion
+export { e as CLIPBOARD_STATUS_CLASS };

package/dist/components/clipboard/index.d.ts

@@ -0,0 +1,4 @@
+export * from './Clipboard';
+export * from './CopyButton';
+export * from './clipboard-config';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/clipboard/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/clipboard/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAC;AAC5B,cAAc,cAAc,CAAC;AAC7B,cAAc,oBAAoB,CAAC"}

package/dist/components/clipboard/index.js

@@ -0,0 +1,4 @@
+export * from "./Clipboard.js";
+export * from "./CopyButton.js";
+export * from "./clipboard-config.js";
+export * from "./clipboard-styles.js";