@jfrader/ui 0.4.0 → 0.5.1

package/README.md

@@ -18,6 +18,7 @@ React components styled with Emotion and themed through the CSS custom propertie
 | `@jfrader/ui/combobox` | `Combobox` |
 | `@jfrader/ui/command-palette` | `CommandPalette` |
 | `@jfrader/ui/container` | `Container` |
+| `@jfrader/ui/copy-button` | `CopyButton` |
 | `@jfrader/ui/date-picker` | `DatePicker` |
 | `@jfrader/ui/dialog` | `Dialog` |
 | `@jfrader/ui/divider` | `Divider` |
@@ -38,6 +39,7 @@ React components styled with Emotion and themed through the CSS custom propertie
 | `@jfrader/ui/text-field` | `TextField` |
 | `@jfrader/ui/textarea` | `Textarea` |
 | `@jfrader/ui/theme-root` | `ThemeRoot` |
+| `@jfrader/ui/time-picker` | `TimePicker` |
 | `@jfrader/ui/toast` | `Toast`, `useToast` |
 | `@jfrader/ui/toggle-group` | `ToggleGroup` |
 | `@jfrader/ui/tooltip` | `Tooltip` |

package/dist/accordion-DLul6vIl.js

@@ -0,0 +1,205 @@
+'use client';
+import { r as e, t } from "./sx-Dx9JUKp5.js";
+import { t as n } from "./disclosure-caret-C5T3fcl6.js";
+import { t as r } from "./focus-ring-BK5W5_NY.js";
+import { n as i, r as a } from "./media-8yrN85VT.js";
+import { n as o } from "./roving-focus-CYlo_Kf8.js";
+import { t as s } from "./use-controlled-state-DpeVQZNR.js";
+import { createContext as c, useContext as l, useId as u, useMemo as d } from "react";
+import { vars as f } from "@jfrader/tokens/vars";
+import { jsx as p } from "@emotion/react/jsx-runtime";
+//#region src/components/accordion/accordion.tsx
+var m = c(null), h = c(null);
+function g(e) {
+	let t = l(m);
+	if (!t) throw Error(`Accordion.${e} must be rendered inside <Accordion>.`);
+	return t;
+}
+function _(e) {
+	let t = l(h);
+	if (!t) throw Error(`Accordion.${e} must be rendered inside <Accordion.Item>.`);
+	return t;
+}
+var v = "", y = {
+	itemSelector: "[data-ui=\"accordion-trigger\"]:not([disabled])",
+	ownerSelector: "[data-ui=\"accordion\"]"
+}, b = (e, t) => {
+	if (t === "multiple" && Array.isArray(e)) return e;
+	let n = Array.isArray(e) ? e[0] : e;
+	return n === void 0 || n === v ? [] : [n];
+}, x = e({
+	borderBlockEnd: `1px solid ${f.color.border}`,
+	"&:first-of-type": { borderBlockStart: `1px solid ${f.color.border}` }
+}), S = e({
+	margin: 0,
+	font: "inherit"
+}), C = e({
+	appearance: "none",
+	display: "flex",
+	alignItems: "center",
+	justifyContent: "space-between",
+	gap: f.space[3],
+	inlineSize: "100%",
+	border: 0,
+	background: "transparent",
+	cursor: "pointer",
+	paddingBlock: f.space[3],
+	paddingInline: f.space[4],
+	font: "inherit",
+	fontSize: f.textSize.sm,
+	fontWeight: f.fontWeight.medium,
+	color: f.color.text,
+	textAlign: "start",
+	transitionProperty: "background-color",
+	transitionDuration: f.motion.duration.fast,
+	transitionTimingFunction: f.motion.easeStandard,
+	"&::after": { ...n },
+	"&[aria-expanded=\"true\"]::after": { transform: "rotate(90deg)" },
+	"&[aria-expanded=\"true\"]:dir(rtl)::after": { transform: "rotate(-90deg)" },
+	"&:hover:not(:disabled):not([aria-disabled=\"true\"])": { backgroundColor: f.color.surfaceHover },
+	"&[aria-disabled=\"true\"]": { cursor: "default" },
+	"&:disabled": {
+		opacity: .55,
+		cursor: "not-allowed"
+	},
+	"&:focus-visible": { ...r },
+	[i]: {
+		"&::after": {
+			forcedColorAdjust: "none",
+			borderInlineStartColor: "ButtonText"
+		},
+		"&:disabled::after": { borderInlineStartColor: "GrayText" }
+	},
+	[a]: {
+		transitionDuration: "0s",
+		"&::after": { transitionDuration: "0s" }
+	}
+}), w = e({
+	paddingBlock: f.space[3],
+	paddingInline: f.space[4],
+	color: f.color.textMuted,
+	lineHeight: f.lineHeight.relaxed,
+	"&[hidden]": { display: "none" }
+});
+function T({ ref: e, value: n, defaultValue: r, onValueChange: i, type: a = "single", collapsible: c = !0, onKeyDown: l, className: u, sx: f, ...h }) {
+	let [g, _] = s(n, r, i), x = d(() => {
+		let e = b(g, a), t = c || e.length > 1;
+		return {
+			openValues: e,
+			toggle: (n) => {
+				let r = e.includes(n);
+				(!r || t) && _(a === "multiple" ? r ? e.filter((e) => e !== n) : [...e, n] : r ? v : n);
+			},
+			canCollapse: t
+		};
+	}, [
+		g,
+		_,
+		a,
+		c
+	]), S = (e) => {
+		l?.(e), !e.defaultPrevented && o(e, e.currentTarget, "vertical", y);
+	};
+	return /* @__PURE__ */ p(m.Provider, {
+		value: x,
+		children: /* @__PURE__ */ p(t, {
+			className: u,
+			sx: f,
+			children: (t) => /* @__PURE__ */ p("div", {
+				...h,
+				ref: e,
+				"data-ui": "accordion",
+				onKeyDown: S,
+				className: t
+			})
+		})
+	});
+}
+T.displayName = "Accordion";
+function E({ ref: e, value: n, disabled: r = !1, className: i, sx: a, ...o }) {
+	let { openValues: s } = g("Item"), c = u(), l = s.includes(n), f = d(() => ({
+		value: n,
+		disabled: r,
+		expanded: l,
+		triggerId: `${c}-trigger`,
+		panelId: `${c}-panel`
+	}), [
+		n,
+		r,
+		l,
+		c
+	]);
+	return /* @__PURE__ */ p(h.Provider, {
+		value: f,
+		children: /* @__PURE__ */ p(t, {
+			className: i,
+			styles: x,
+			sx: a,
+			children: (t) => /* @__PURE__ */ p("div", {
+				...o,
+				ref: e,
+				"data-ui": "accordion-item",
+				"data-state": l ? "open" : "closed",
+				"data-disabled": r ? "" : void 0,
+				className: t
+			})
+		})
+	});
+}
+E.displayName = "Accordion.Item";
+function D({ ref: e, onClick: n, disabled: r, className: i, sx: a, ...o }) {
+	let { toggle: s, canCollapse: c } = g("Trigger"), { value: l, disabled: u, expanded: d, triggerId: f, panelId: m } = _("Trigger"), h = d && !c, v = (e) => {
+		n?.(e), !e.defaultPrevented && s(l);
+	};
+	return /* @__PURE__ */ p("h3", {
+		"data-ui": "accordion-heading",
+		css: S,
+		children: /* @__PURE__ */ p(t, {
+			className: i,
+			styles: C,
+			sx: a,
+			children: (t) => /* @__PURE__ */ p("button", {
+				...o,
+				ref: e,
+				type: "button",
+				id: f,
+				"data-ui": "accordion-trigger",
+				"data-state": d ? "open" : "closed",
+				"aria-expanded": d,
+				"aria-controls": m,
+				"aria-disabled": h || void 0,
+				disabled: u || r,
+				onClick: v,
+				className: t
+			})
+		})
+	});
+}
+D.displayName = "Accordion.Trigger";
+function O({ ref: e, "aria-labelledby": n, className: r, sx: i, ...a }) {
+	let { expanded: o, triggerId: s, panelId: c } = _("Panel"), l = [n, s].filter(Boolean).join(" ");
+	return /* @__PURE__ */ p(t, {
+		className: r,
+		styles: w,
+		sx: i,
+		children: (t) => /* @__PURE__ */ p("div", {
+			...a,
+			ref: e,
+			role: "region",
+			id: c,
+			"aria-labelledby": l,
+			hidden: !o,
+			"data-ui": "accordion-panel",
+			"data-state": o ? "open" : "closed",
+			className: t
+		})
+	});
+}
+O.displayName = "Accordion.Panel";
+var k = Object.assign(T, {
+	Item: E,
+	Trigger: D,
+	Panel: O
+});
+//#endregion
+export { k as t };

package/dist/accordion.js

@@ -1,2 +1,2 @@
 'use client';
-export { t as Accordion } from "./accordion-Bd-j04hW.js";
+export { t as Accordion } from "./accordion-DLul6vIl.js";

package/dist/{alert-BBqaKI4k.js → alert-DS_einpy.js}

@@ -1,7 +1,7 @@
 'use client';
 import { r as e, t } from "./sx-Dx9JUKp5.js";
 import { n } from "./focus-ring-BK5W5_NY.js";
-import { n as r } from "./media-D_eA_I-e.js";
+import { r } from "./media-8yrN85VT.js";
 import { t as i } from "./visually-hidden-BJdvqqvn.js";
 import { t as a } from "./renderable-DzcIj1Lo.js";
 import { vars as o } from "@jfrader/tokens/vars";

package/dist/alert.js

@@ -1,2 +1,2 @@
 'use client';
-export { t as Alert } from "./alert-BBqaKI4k.js";
+export { t as Alert } from "./alert-DS_einpy.js";

package/dist/announcement-bar-Dlbq5-9D.js

@@ -0,0 +1,382 @@
+'use client';
+import { i as e, r as t, t as n } from "./sx-Dx9JUKp5.js";
+import { n as r } from "./focus-ring-BK5W5_NY.js";
+import { n as i, r as a } from "./media-8yrN85VT.js";
+import { t as ee } from "./use-latest-callback-cj1OOQL6.js";
+import { t as o } from "./use-controlled-state-DpeVQZNR.js";
+import { t as s } from "./renderable-DzcIj1Lo.js";
+import { t as c } from "./button-NLY0h6EJ.js";
+import { t as te } from "./countdown-Dp_TD1VP.js";
+import { useEffect as l, useId as ne, useRef as u, useState as d } from "react";
+import { vars as f } from "@jfrader/tokens/vars";
+import { Fragment as p, jsx as m, jsxs as h } from "@emotion/react/jsx-runtime";
+import { useMergeRefs as re } from "@floating-ui/react";
+//#region src/components/announcement-bar/announcement-bar.tsx
+var g = 6e3, _ = "35rem", v = "3px", y = 2147483647, ie = {
+	previous: "Previous announcement",
+	next: "Next announcement",
+	pause: "Pause announcements",
+	resume: "Resume announcements",
+	dismiss: "Dismiss announcement",
+	slide: "slide",
+	carousel: "carousel"
+}, b = (e, t) => t && Number.isFinite(e) ? (Math.trunc(e) % t + t) % t : 0, x = (e) => s(e) && e !== "", S = e({
+	from: {
+		opacity: 0,
+		transform: `translateY(${f.space[2]})`
+	},
+	to: {
+		opacity: 1,
+		transform: "translateY(0)"
+	}
+}), C = e({
+	from: { strokeDashoffset: 0 },
+	to: { strokeDashoffset: 100 }
+}), ae = t({
+	display: "grid",
+	gridTemplateRows: "1fr",
+	opacity: 1,
+	backgroundColor: f.color.surfaceRaised,
+	color: f.color.text,
+	fontFamily: f.font.sans,
+	fontSize: f.textSize.sm,
+	lineHeight: f.lineHeight.base,
+	borderBlock: `1px solid ${f.color.borderControl}`,
+	borderInlineStart: `${v} solid var(--announcement-tone)`,
+	transitionProperty: "grid-template-rows, opacity",
+	transitionDuration: f.motion.duration.slow,
+	transitionTimingFunction: f.motion.easeStandard,
+	"&[data-state=\"closed\"]": {
+		gridTemplateRows: "0fr",
+		opacity: 0
+	},
+	[a]: { transitionDuration: "0s" },
+	[i]: {
+		backgroundColor: "Canvas",
+		color: "CanvasText",
+		borderColor: "ButtonText"
+	}
+}), oe = t({
+	backgroundColor: f.color.text,
+	color: f.color.bg,
+	"--announcement-tone": "currentColor",
+	borderColor: "currentColor",
+	[i]: {
+		backgroundColor: "Canvas",
+		color: "CanvasText"
+	}
+}), se = {
+	neutral: t({ "--announcement-tone": f.color.borderControl }),
+	info: t({ "--announcement-tone": f.color.info }),
+	warning: t({ "--announcement-tone": f.color.warning }),
+	danger: t({ "--announcement-tone": f.color.dangerText })
+}, ce = t({
+	minBlockSize: 0,
+	"&[data-closing=\"true\"]": { overflow: "hidden" }
+}), w = f.space[3], T = `(${_} - ${v} - 2 * ${f.space[4]})`, le = t({
+	display: "flex",
+	flexWrap: "wrap",
+	gap: w,
+	alignItems: "center",
+	padding: f.space[4]
+}), ue = t({
+	flex: "0 1 auto",
+	minInlineSize: `min(100%, calc((${T} - 100%) * 999))`
+}), de = t({
+	display: "flex",
+	flexWrap: "wrap",
+	alignItems: "center",
+	gap: f.space[3],
+	minInlineSize: 0,
+	animation: `${S} ${f.motion.duration.base} ${f.motion.easeStandard}`,
+	[a]: { animation: "none" }
+}), fe = t({
+	overflowWrap: "anywhere",
+	minInlineSize: 0
+}), pe = t({
+	display: "inline-block",
+	"&:dir(rtl)": { transform: "scaleX(-1)" }
+}), me = t({
+	flex: "1 1 0",
+	display: "flex",
+	flexWrap: "wrap",
+	gap: f.space[2],
+	justifyContent: "end",
+	minInlineSize: "fit-content",
+	maxInlineSize: `calc((100% - ${T}) * 999)`,
+	"&:empty": {
+		flexBasis: w,
+		marginInline: `calc(-0.5 * ${w})`
+	}
+}), he = t({
+	minBlockSize: f.space[8],
+	blockSize: "auto",
+	minInlineSize: f.space[8],
+	paddingBlock: f.space[1],
+	paddingInline: f.space[2],
+	whiteSpace: "normal",
+	color: "inherit",
+	backgroundColor: "transparent",
+	borderColor: "currentColor",
+	borderRadius: f.radius.sm,
+	"&:hover:not(:disabled):not([aria-disabled=\"true\"])": {
+		backgroundColor: "transparent",
+		color: "inherit"
+	},
+	[i]: {
+		borderColor: "ButtonText",
+		color: "ButtonText"
+	}
+}), ge = t({
+	...r,
+	outline: "none",
+	display: "inline-flex",
+	alignItems: "center",
+	boxSizing: "border-box",
+	minBlockSize: f.space[8],
+	padding: f.space[2],
+	color: "inherit",
+	fontWeight: f.fontWeight.medium,
+	overflowWrap: "anywhere",
+	"&:focus-visible": r
+}), _e = t({
+	inlineSize: "1em",
+	blockSize: "1em",
+	fill: "none",
+	stroke: "currentColor",
+	strokeWidth: 2,
+	animationName: `${C}`,
+	animationDuration: "var(--announcement-interval)",
+	animationTimingFunction: "linear",
+	animationIterationCount: "infinite",
+	[a]: { display: "none" },
+	[i]: { display: "none" }
+});
+function E({ ref: e, messages: t, open: r, defaultOpen: i = !0, onOpenChange: a, value: s, defaultValue: f = 0, onValueChange: _, autoPlay: v = !1, paused: S, defaultPaused: C = !1, onPausedChange: w, interval: T = g, controls: E = !0, dismissible: ve = !0, variant: D = "subtle", tone: O = "neutral", label: ye = "Announcements", live: be = "off", locale: k, labels: xe, getMessageLabel: Se, onAction: Ce, onCountdownEnd: we, dismissFocusRef: Te, slotProps: A, className: Ee, sx: De, ...j }) {
+	let [M, Oe] = o(r, i, a), [ke, N] = o(s === void 0 ? void 0 : b(s, t.length), b(f, t.length), _), [Ae, P] = o(S, C, w), F = b(ke ?? 0, t.length), I = Number.isFinite(T) && T > 0 ? T : g, L = u(null), je = re([L, e]), [Me, R] = d(!1), [z, B] = d(!1), [Ne, Pe] = d(!1), [V, Fe] = d(!0), [H, U] = d(!!M), W = u(!1), G = u(/* @__PURE__ */ new Map()), K = ne(), q = {
+		...ie,
+		...xe
+	}, J = t.length > 1, Y = v && J && !!M && !Ae && !Me && !z && !Ne && !V, X = !!Ae || z || V, Z = u({ remaining: I }), [Ie, Le] = d(0), [Re, ze] = d(0), Be = ee(() => N(b(F + 1, t.length))), Ve = ee(we);
+	if (l(() => {
+		if (!M) return;
+		let e = L.current?.ownerDocument, t = e?.defaultView;
+		if (!e || !t) return;
+		let n = t.matchMedia("(prefers-reduced-motion: reduce)"), r = () => Fe(n.matches), i = () => Pe(e.visibilityState === "hidden");
+		return r(), i(), n.addEventListener("change", r), e.addEventListener("visibilitychange", i), () => {
+			n.removeEventListener("change", r), e.removeEventListener("visibilitychange", i);
+		};
+	}, [
+		M,
+		H,
+		t.length === 0
+	]), l(() => {
+		Z.current.remaining = I, Le((e) => e + 1);
+	}, [
+		F,
+		I,
+		t[F]?.id,
+		Re
+	]), l(() => {
+		if (!Y) return;
+		let e = Date.now() + Z.current.remaining, t, n = () => {
+			let r = Math.max(0, e - Date.now());
+			r > 0 ? t = setTimeout(n, Math.min(r, y)) : (Z.current.remaining = I, e = Date.now() + I, Be(), Le((e) => e + 1), t = setTimeout(n, Math.min(I, y)));
+		};
+		return t = setTimeout(n, Math.min(Z.current.remaining, y)), () => {
+			clearTimeout(t), Z.current.remaining = Math.max(0, e - Date.now());
+		};
+	}, [
+		Y,
+		F,
+		I,
+		Be,
+		t[F]?.id,
+		Re
+	]), l(() => {
+		if (M) {
+			U(!0);
+			return;
+		}
+		let e = L.current;
+		if (W.current && e) {
+			let t = Te?.current;
+			t?.isConnected && t.ownerDocument === e.ownerDocument && t.focus();
+		}
+		if (W.current = !1, !e || V) {
+			U(!1);
+			return;
+		}
+		let t = parseFloat(e.ownerDocument.defaultView.getComputedStyle(e).transitionDuration) * 1e3, n = setTimeout(() => U(!1), t);
+		return () => clearTimeout(n);
+	}, [
+		M,
+		V,
+		Te
+	]), !t.length || !M && !H) return null;
+	let Q = t[F], { css: He, ...Ue } = A?.root ?? {}, We = new Intl.NumberFormat(k), Ge = Se?.(F, t.length) ?? `${We.format(F + 1)} of ${We.format(t.length)}`, Ke = (e) => {
+		A?.action?.onClick?.(e), e.defaultPrevented || Q.action?.onClick?.(e), e.defaultPrevented || Ce?.(Q);
+	}, qe = (e) => {
+		ze((e) => e + 1), N(b(F + e, t.length));
+	}, $ = (e, t, n, r) => {
+		let i = A?.[e];
+		return /* @__PURE__ */ m(c, {
+			...i,
+			type: "button",
+			render: (t) => /* @__PURE__ */ m("button", {
+				...t,
+				"data-ui": `announcement-bar-${e}`
+			}),
+			size: "sm",
+			css: [he, i?.css],
+			"aria-label": i?.["aria-label"] ?? t,
+			"aria-controls": e === "previous" || e === "next" ? K : void 0,
+			"aria-pressed": void 0,
+			onClick: (e) => {
+				i?.onClick?.(e), e.defaultPrevented || r();
+			},
+			children: n
+		});
+	};
+	return /* @__PURE__ */ m(n, {
+		className: [Ee, A?.root?.className].filter(Boolean).join(" ") || void 0,
+		styles: [
+			ae,
+			se[O],
+			D === "inverted" && oe,
+			A?.root?.css
+		],
+		sx: De,
+		children: (e) => /* @__PURE__ */ m("section", {
+			...Ue,
+			...j,
+			ref: je,
+			className: e,
+			"data-ui": "announcement-bar",
+			"data-state": M ? "open" : "closed",
+			"data-running": Y,
+			"data-variant": D,
+			"data-tone": O,
+			role: "region",
+			inert: !M || void 0,
+			"aria-label": j["aria-label"] ?? A?.root?.["aria-label"] ?? (j["aria-labelledby"] ?? A?.root?.["aria-labelledby"] ? void 0 : ye),
+			"aria-labelledby": [A?.root?.["aria-labelledby"], j["aria-labelledby"]].filter(Boolean).join(" ") || void 0,
+			"aria-describedby": [A?.root?.["aria-describedby"], j["aria-describedby"]].filter(Boolean).join(" ") || void 0,
+			"aria-roledescription": J ? q.carousel : void 0,
+			onMouseEnter: (e) => {
+				A?.root?.onMouseEnter?.(e), j.onMouseEnter?.(e), R(!0);
+			},
+			onMouseLeave: (e) => {
+				A?.root?.onMouseLeave?.(e), j.onMouseLeave?.(e), R(!1);
+			},
+			onFocusCapture: (e) => {
+				if (A?.root?.onFocusCapture?.(e), j.onFocusCapture?.(e), v && J && !z) {
+					let t = !e.currentTarget.contains(e.relatedTarget), n = Y && e.target?.closest?.("[data-ui=\"announcement-bar-content\"]") != null;
+					(t || n) && (B(!0), P(!0));
+				}
+			},
+			children: /* @__PURE__ */ m("div", {
+				css: ce,
+				"data-closing": !M,
+				children: /* @__PURE__ */ h("div", {
+					css: le,
+					children: [
+						/* @__PURE__ */ m("div", {
+							css: me,
+							children: v && J && $("rotation", X ? q.resume : q.pause, /* @__PURE__ */ h(p, { children: [X ? q.resume : q.pause, /* @__PURE__ */ m("svg", {
+								"aria-hidden": "true",
+								viewBox: "0 0 36 36",
+								css: _e,
+								style: {
+									"--announcement-interval": `${I}ms`,
+									animationPlayState: Y ? "running" : "paused"
+								},
+								children: /* @__PURE__ */ m("circle", {
+									cx: "18",
+									cy: "18",
+									r: "15",
+									pathLength: "100",
+									strokeDasharray: "100"
+								})
+							}, `${F}-${Ie}`)] }), () => {
+								X ? (B(!1), P(!1)) : P(!0);
+							})
+						}),
+						/* @__PURE__ */ m("div", {
+							...A?.content,
+							id: K,
+							"data-ui": "announcement-bar-content",
+							css: [ue, A?.content?.css],
+							"aria-live": "off",
+							children: /* @__PURE__ */ h("div", {
+								role: "group",
+								"aria-roledescription": J ? q.slide : void 0,
+								"aria-label": J ? Ge : void 0,
+								css: de,
+								children: [
+									x(Q.message) && /* @__PURE__ */ m("span", {
+										...A?.message,
+										"data-ui": "announcement-bar-message",
+										css: [fe, A?.message?.css],
+										"aria-live": Y ? "off" : be,
+										"aria-atomic": "true",
+										children: Q.message
+									}),
+									M && Q.countdown && /* @__PURE__ */ m(te, {
+										...A?.countdown,
+										css: A?.countdown?.css,
+										...Q.countdown,
+										variant: "compact",
+										locale: k,
+										announceCompletion: !1,
+										onComplete: (e) => {
+											let t = G.current.get(Q.id) ?? /* @__PURE__ */ new Set();
+											t.has(e) || (t.add(e), G.current.set(Q.id, t), Ve(Q));
+										}
+									}),
+									Q.action && x(Q.action.label) && (Q.action.href === void 0 ? /* @__PURE__ */ m(c, {
+										...A?.action,
+										type: "button",
+										render: (e) => /* @__PURE__ */ m("button", {
+											...e,
+											"data-ui": "announcement-bar-action"
+										}),
+										css: [he, A?.action?.css],
+										onClick: Ke,
+										children: Q.action.label
+									}) : /* @__PURE__ */ m("a", {
+										...A?.action,
+										href: Q.action.href,
+										"data-ui": "announcement-bar-action",
+										css: [ge, A?.action?.css],
+										onClick: Ke,
+										children: Q.action.label
+									}))
+								]
+							}, Q.id)
+						}),
+						/* @__PURE__ */ h("div", {
+							css: me,
+							children: [J && (E || v) && /* @__PURE__ */ h(p, { children: [$("previous", q.previous, /* @__PURE__ */ m("span", {
+								"aria-hidden": "true",
+								css: pe,
+								children: "‹"
+							}), () => qe(-1)), $("next", q.next, /* @__PURE__ */ m("span", {
+								"aria-hidden": "true",
+								css: pe,
+								children: "›"
+							}), () => qe(1))] }), ve && $("dismiss", q.dismiss, /* @__PURE__ */ m("span", {
+								"aria-hidden": "true",
+								children: "×"
+							}), () => {
+								W.current = L.current?.contains(L.current.ownerDocument.activeElement) ?? !1, Oe(!1);
+							})]
+						})
+					]
+				})
+			})
+		})
+	});
+}
+E.displayName = "AnnouncementBar";
+//#endregion
+export { E as t };

package/dist/announcement-bar.js

@@ -0,0 +1,2 @@
+'use client';
+export { t as AnnouncementBar } from "./announcement-bar-Dlbq5-9D.js";