@optiaxiom/react 3.4.2 → 3.5.0

package/dist/cjs/auth-provider.js

@@ -0,0 +1,37 @@
+"use client";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const require_useEvent = require("./useEvent-BGCT9scH.js");
+let react = require("react");
+let react_jsx_runtime = require("react/jsx-runtime");
+let _optiaxiom_globals = require("@optiaxiom/globals");
+//#region src/auth-provider/AuthProvider.tsx
+/**
+* `AuthProvider` is used to pass down the user credentials to all components. It should be rendered near the root of your application and should be used only once.
+*
+* @category provider
+* @since 1.6.2
+*/
+function AuthProvider({ children, instance, refresh: refreshProp, token }) {
+	const refresh = require_useEvent.useEvent(refreshProp);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_optiaxiom_globals.AxiomAuthContext.Provider, {
+		value: (0, react.useMemo)(() => ({
+			instance,
+			refresh,
+			token
+		}), [
+			instance,
+			refresh,
+			token
+		]),
+		children
+	});
+}
+AuthProvider.displayName = "@optiaxiom/react/AuthProvider";
+//#endregion
+//#region src/auth-provider/useAuthContext.ts
+function useAuthContext() {
+	return (0, react.useContext)(_optiaxiom_globals.AxiomAuthContext);
+}
+//#endregion
+exports.AuthProvider = AuthProvider;
+exports.useAuthContext = useAuthContext;

package/dist/cjs/avatar-QYjj8itt.js

@@ -0,0 +1,190 @@
+"use client";
+const require_rolldown_runtime = require("./rolldown-runtime-C0BPl7ul.js");
+const require_box = require("./box-B2PXBdH7.js");
+const require_recipeRuntime = require("./recipeRuntime-BV5B1H9r.js");
+const require_IconOpal = require("./IconOpal-CLnKV1ly.js");
+let react = require("react");
+require("./assets/layers.css.ts.vanilla-CTOkUrdE.css");
+let react_jsx_runtime = require("react/jsx-runtime");
+let _radix_ui_react_context = require("@radix-ui/react-context");
+let _optiaxiom_icons_IconUser = require("@optiaxiom/icons/IconUser");
+let _optiaxiom_icons_IconUserGroup = require("@optiaxiom/icons/IconUserGroup");
+let _radix_ui_react_avatar = require("@radix-ui/react-avatar");
+_radix_ui_react_avatar = require_rolldown_runtime.__toESM(_radix_ui_react_avatar, 1);
+require("./assets/ButtonGroup.css.ts.vanilla-Big2-ymt.css");
+require("./assets/Avatar.css.ts.vanilla-GQPhchAr.css");
+//#region src/avatar/Avatar.css.ts
+var avatar = require_recipeRuntime.recipeRuntime({
+	base: [{
+		alignItems: "center",
+		display: "inline-flex",
+		flex: "none",
+		fontWeight: "500",
+		justifyContent: "center",
+		overflow: "hidden",
+		rounded: "full"
+	}, "oj838y"],
+	variants: {
+		colorScheme: {
+			neutral: {
+				bg: "bg.avatar.neutral",
+				color: "fg.avatar.neutral"
+			},
+			purple: {
+				bg: "bg.avatar.purple",
+				color: "fg.avatar.purple"
+			}
+		},
+		size: {
+			"2xs": [{
+				fontWeight: "400",
+				size: "2xs"
+			}, "_1efn0os"],
+			xs: [{
+				fontWeight: "400",
+				size: "xs"
+			}, "_1witmdy"],
+			sm: [{ size: "sm" }, "nykq2z"],
+			md: [{ size: "md" }, "kpndzf"],
+			lg: [{ size: "lg" }, "_18vp85b"],
+			xl: [{ size: "xl" }, "_17m1dp3"],
+			"3xl": [{ size: "3xl" }, "_1axzror"]
+		}
+	}
+});
+var fallback = require_recipeRuntime.recipeRuntime({ base: {
+	alignItems: "center",
+	display: "flex",
+	justifyContent: "center",
+	rounded: "inherit",
+	size: "full",
+	textTransform: "uppercase"
+} });
+var icon = require_recipeRuntime.recipeRuntime({
+	base: [{ w: "auto" }],
+	variants: { size: {
+		"2xs": { h: "12" },
+		xs: [{ h: "16" }, "ylaxdj"],
+		sm: { h: "16" },
+		md: { h: "xs" },
+		lg: { h: "sm" },
+		xl: { h: "sm" },
+		"3xl": { h: "lg" }
+	} }
+});
+//#endregion
+//#region src/avatar/AvatarContext.tsx
+const [AvatarProvider, useAvatarContext] = (0, _radix_ui_react_context.createContext)("@optiaxiom/react/Avatar", { size: void 0 });
+//#endregion
+//#region src/avatar/Avatar.tsx
+function getInitialsFromName(name) {
+	const names = name.trim().split(" ");
+	const firstName = names[0] ?? "";
+	const lastName = names.length > 1 ? names[names.length - 1] : "";
+	return firstName && lastName ? `${firstName.charAt(0)}${lastName.charAt(0)}` : firstName.charAt(0);
+}
+const mapFallbackToIcon = {
+	opal: null,
+	team: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_optiaxiom_icons_IconUserGroup.IconUserGroup, {}),
+	user: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_optiaxiom_icons_IconUser.IconUser, { filled: true })
+};
+/**
+* Displays a user profile picture or initials. For multiple avatars, use
+* AvatarGroup.
+*
+* @category data-display
+* @since 0.1.0
+*/
+const Avatar = (0, react.forwardRef)(({ children, className, colorScheme = "neutral", fallback: fallback$1 = "user", name, size: sizeProp, src, ...props }, ref) => {
+	const context = useAvatarContext("@optiaxiom/react/Avatar");
+	const size = sizeProp || context?.size || "md";
+	if (fallback$1 === "opal") {
+		fallback$1 = "user";
+		src = "opal";
+	}
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_box.Box, {
+		asChild: true,
+		...avatar({
+			colorScheme,
+			size
+		}, className),
+		...props,
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_radix_ui_react_avatar.Root, {
+			ref,
+			children: [src && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_box.Box, {
+				asChild: true,
+				objectFit: "cover",
+				rounded: "inherit",
+				size: "full",
+				children: src === "opal" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_IconOpal.IconOpal, {
+					asChild: true,
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_radix_ui_react_avatar.Image, { alt: name ?? "Opal" })
+				}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_radix_ui_react_avatar.Image, {
+					alt: name ?? "avatar",
+					src
+				})
+			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_box.Box, {
+				asChild: true,
+				...fallback({}),
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_radix_ui_react_avatar.Fallback, {
+					delayMs: src ? 600 : void 0,
+					children: (children ?? (name ? getInitialsFromName(name) : void 0)) || /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_box.Box, {
+						asChild: true,
+						...icon({ size }),
+						children: mapFallbackToIcon[fallback$1]
+					})
+				})
+			})]
+		})
+	});
+});
+Avatar.displayName = "@optiaxiom/react/Avatar";
+//#endregion
+//#region src/avatar/AvatarGroup.css.ts
+var avatarGroup = require_recipeRuntime.recipeRuntime({ base: ["_1ixhddd", { display: "flex" }] });
+//#endregion
+//#region src/avatar/AvatarGroup.tsx
+/**
+* Displays a group of avatars representing multiple users with automatic layout
+* and overflow handling.
+*
+* Use this component whenever you have 2 or more Avatar components together,
+* even if they're not overlapping in the design. AvatarGroup handles consistent
+* sizing, spacing, overflow indicators (+N), and semantic grouping
+* automatically.
+*
+* Don't manually layout multiple Avatars in a Flex - use AvatarGroup instead.
+*
+* When to use:
+* - Multiple assignees on a task
+* - Team members or collaborators
+* - Participants in a conversation
+* - Any group of users
+*
+* @group Avatar
+*/
+const AvatarGroup = (0, react.forwardRef)(({ children, className, size = "md", ...props }, ref) => {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_box.Box, {
+		ref,
+		...avatarGroup({}, className),
+		...props,
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(AvatarProvider, {
+			size,
+			children
+		})
+	});
+});
+AvatarGroup.displayName = "@optiaxiom/react/AvatarGroup";
+//#endregion
+Object.defineProperty(exports, "Avatar", {
+	enumerable: true,
+	get: function() {
+		return Avatar;
+	}
+});
+Object.defineProperty(exports, "AvatarGroup", {
+	enumerable: true,
+	get: function() {
+		return AvatarGroup;
+	}
+});

package/dist/cjs/avatar.js

@@ -0,0 +1,4 @@
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const require_avatar = require("./avatar-QYjj8itt.js");
+exports.Avatar = require_avatar.Avatar;
+exports.AvatarGroup = require_avatar.AvatarGroup;

package/dist/cjs/axiom-provider-CNuLGdt0.js

@@ -0,0 +1,155 @@
+"use client";
+const require_box = require("./box-B2PXBdH7.js");
+const require_button = require("./button-BO_WcwyT.js");
+const require_FocusBookmarkProvider = require("./FocusBookmarkProvider-BJWt--oq.js");
+const require_text = require("./text-BWyl3PQL.js");
+const require_group = require("./group.js");
+const require_transition = require("./transition-tqiyzYYq.js");
+const require_dialog = require("./dialog-C_RmRBrt.js");
+const require_dialogkit = require("./dialogkit-gcepZ2zv.js");
+const require_Portal = require("./Portal-DI9aR5XU.js");
+const require_LocaleContext = require("./LocaleContext-C3x9rY0T.js");
+const require_theme_provider = require("./theme-provider.js");
+const require_toast = require("./toast-BMOq1v7J.js");
+const require_tooltip = require("./tooltip-DgIDNGYv.js");
+let _optiaxiom_icons_IconXmark = require("@optiaxiom/icons/IconXmark");
+let _radix_ui_react_id = require("@radix-ui/react-id");
+let react = require("react");
+let react_jsx_runtime = require("react/jsx-runtime");
+let _optiaxiom_globals = require("@optiaxiom/globals");
+let use_sync_external_store_shim = require("use-sync-external-store/shim");
+//#region src/dialog-kit/DialogKitProvider.tsx
+function DialogKitProvider({ kit = require_dialogkit.dialogkit }) {
+	return (0, use_sync_external_store_shim.useSyncExternalStore)(...kit.store).reduce((result, item) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_dialog.Dialog, {
+		open: item.open,
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_dialog.DialogKitContext.Provider, {
+			value: {
+				id: item.id,
+				onClose: item.onClose,
+				onDismiss: (event, reason) => {
+					item.onDismiss?.(event, reason);
+					if (event.defaultPrevented) return;
+					require_dialogkit.dialogkit.remove(item.id);
+				}
+			},
+			children: item.element
+		}), result]
+	}, item.id), null);
+}
+DialogKitProvider.displayName = "@optiaxiom/react/DialogKitProvider";
+//#endregion
+//#region src/suggestion/SuggestionProvider.tsx
+function SuggestionProvider({ children }) {
+	const id = (0, _radix_ui_react_id.useId)();
+	const [suggestions, setSuggestions] = (0, react.useState)([]);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_optiaxiom_globals.unstable_SuggestionContext.Provider, {
+		value: (0, react.useMemo)(() => ({ add: (suggestion, surface) => {
+			setSuggestions((suggestions) => [...suggestions, {
+				suggestion,
+				surface
+			}]);
+			return () => {
+				setSuggestions((suggestions) => suggestions.filter((s) => s.suggestion !== suggestion));
+			};
+		} }), []),
+		children: [children, suggestions.length > 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Portal.Portal, {
+			asChild: true,
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_group.Group, {
+				alignItems: "center",
+				flexDirection: "column",
+				gap: "16",
+				pointerEvents: "none",
+				style: {
+					bottom: 32,
+					insetInline: 32,
+					position: "fixed"
+				},
+				z: "popover",
+				children: suggestions.slice(0, 1).map(({ suggestion, surface }) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_transition.Transition, {
+					"data-side": "top",
+					type: "pop",
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_group.Group, {
+						"aria-describedby": id + "-" + suggestion.id,
+						"aria-label": "App companion suggestion",
+						bg: "bg.default",
+						color: "fg.default",
+						fontSize: "md",
+						gap: "16",
+						maxW: "lg",
+						p: "16",
+						pointerEvents: "auto",
+						role: "dialog",
+						rounded: "md",
+						shadow: "md",
+						children: [
+							/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_group.Group, {
+								flexDirection: "column",
+								gap: "4",
+								id: id + "-" + suggestion.id,
+								children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_text.Text, { children: suggestion.type === "message" ? suggestion.text : /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [
+									/* @__PURE__ */ (0, react_jsx_runtime.jsx)("strong", { children: "Suggested:" }),
+									" ",
+									surface.renderSuggestionValue ? surface.renderSuggestionValue(suggestion.value) : String(suggestion.value)
+								] }) }), suggestion.type === "value" && suggestion.reason && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_text.Text, {
+									color: "fg.secondary",
+									children: suggestion.reason
+								})]
+							}),
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_button.Button, {
+								appearance: "primary-opal",
+								onClick: async () => {
+									if (suggestion.type === "message" && suggestion.tool) await surface.executeTool(suggestion.tool.name, suggestion.tool.parameters);
+									surface.accept(suggestion.id);
+								},
+								size: "sm",
+								children: "Accept"
+							}),
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_button.Button, {
+								appearance: "subtle",
+								"aria-label": "close",
+								color: "fg.default",
+								flex: "none",
+								icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_optiaxiom_icons_IconXmark.IconXmark, {}),
+								onClick: () => {
+									surface.reject(suggestion.id);
+								},
+								size: "sm"
+							})
+						]
+					})
+				}, suggestion.id))
+			})
+		})]
+	});
+}
+SuggestionProvider.displayName = "@optiaxiom/react/SuggestionProvider";
+//#endregion
+//#region src/axiom-provider/AxiomProvider.tsx
+/**
+* `AxiomProvider` provides all the context managers required for our components to work. It must be rendered at the root of your application and should be used only once.
+*
+* @category provider
+* @since 0.1.0
+*/
+function AxiomProvider({ children, dialog, locale, toast, tooltip }) {
+	const resolvedLocale = locale ?? (typeof navigator !== "undefined" ? navigator.language : "en-US");
+	if (!(0, react.useContext)(_optiaxiom_globals.AxiomVersionContext)) children = /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_theme_provider.ThemeProvider, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(SuggestionProvider, { children: [children, /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_toast.ToastProvider, { ...toast })] }) });
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_optiaxiom_globals.AxiomVersionContext.Provider, {
+		value: require_box.version,
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_LocaleContext.LocaleProvider, {
+			locale: resolvedLocale,
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_tooltip.TooltipProvider, {
+				...tooltip,
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_FocusBookmarkProvider.FocusBookmarkProvider, { children: [children, /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DialogKitProvider, { ...dialog })] })
+			})
+		})
+	});
+}
+AxiomProvider.displayName = "@optiaxiom/react/AxiomProvider";
+//#endregion
+Object.defineProperty(exports, "AxiomProvider", {
+	enumerable: true,
+	get: function() {
+		return AxiomProvider;
+	}
+});

package/dist/cjs/axiom-provider.js

@@ -0,0 +1,3 @@
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const require_axiom_provider = require("./axiom-provider-CNuLGdt0.js");
+exports.AxiomProvider = require_axiom_provider.AxiomProvider;

package/dist/cjs/badge-DlmwJQtY.js

@@ -0,0 +1,70 @@
+"use client";
+const require_recipeRuntime = require("./recipeRuntime-BV5B1H9r.js");
+const require_text = require("./text-BWyl3PQL.js");
+let react = require("react");
+let _radix_ui_react_slot = require("@radix-ui/react-slot");
+require("./assets/layers.css.ts.vanilla-CTOkUrdE.css");
+let react_jsx_runtime = require("react/jsx-runtime");
+require("./assets/Badge.css.ts.vanilla-0WgkCZ_3.css");
+//#region src/badge/Badge.css.ts
+var badge = require_recipeRuntime.recipeRuntime({
+	base: [{
+		display: "inline-flex",
+		flex: "none",
+		fontFamily: "mono",
+		fontSize: "sm",
+		fontWeight: "400",
+		justifyContent: "center",
+		px: "8",
+		py: "2",
+		rounded: "full",
+		textTransform: "uppercase"
+	}, "_16zwvbh"],
+	variants: {
+		intent: {
+			danger: "_17exe0n",
+			information: "es7chb",
+			neutral: "_58706n",
+			primary: "_1pa4mna",
+			success: "g02yy2",
+			warning: "_1otovel"
+		},
+		variant: {
+			strong: "_1vvjdt7",
+			subtle: "fh858m"
+		}
+	}
+});
+//#endregion
+//#region src/badge/Badge.tsx
+const Slot = (0, _radix_ui_react_slot.createSlot)("@optiaxiom/react/Badge");
+/**
+* Use to emphasize a status, count, state or value.
+*
+* @since 0.1.0
+* @category data-display
+* @category feedback
+*/
+const Badge = (0, react.forwardRef)(({ asChild, children, className, intent = "neutral", variant = "subtle", ...props }, ref) => {
+	const Comp = asChild ? Slot : "span";
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_text.Text, {
+		asChild: true,
+		...badge({
+			intent,
+			variant
+		}, className),
+		...props,
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Comp, {
+			ref,
+			children
+		})
+	});
+});
+Badge.displayName = "@optiaxiom/react/Badge";
+//#endregion
+Object.defineProperty(exports, "Badge", {
+	enumerable: true,
+	get: function() {
+		return Badge;
+	}
+});

package/dist/cjs/badge.js

@@ -0,0 +1,3 @@
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const require_badge = require("./badge-DlmwJQtY.js");
+exports.Badge = require_badge.Badge;

package/dist/cjs/banner-du20CQ1N.js

@@ -0,0 +1,105 @@
+"use client";
+const require_recipeRuntime = require("./recipeRuntime-BV5B1H9r.js");
+const require_button = require("./button-BO_WcwyT.js");
+const require_group = require("./group.js");
+let _optiaxiom_icons_IconCheckCircleSolid = require("@optiaxiom/icons/IconCheckCircleSolid");
+let _optiaxiom_icons_IconCircleExclamation = require("@optiaxiom/icons/IconCircleExclamation");
+let _optiaxiom_icons_IconCircleInfo = require("@optiaxiom/icons/IconCircleInfo");
+let _optiaxiom_icons_IconTriangleExclamation = require("@optiaxiom/icons/IconTriangleExclamation");
+let _optiaxiom_icons_IconXmark = require("@optiaxiom/icons/IconXmark");
+let _radix_ui_react_id = require("@radix-ui/react-id");
+let react = require("react");
+require("./assets/layers.css.ts.vanilla-CTOkUrdE.css");
+let react_jsx_runtime = require("react/jsx-runtime");
+require("./assets/Banner.css.ts.vanilla-qHUcK0zZ.css");
+//#region src/banner/Banner.css.ts
+var banner = require_recipeRuntime.recipeRuntime({
+	base: [{
+		alignItems: "start",
+		color: "fg.default",
+		fontSize: "md",
+		fontWeight: "500",
+		gap: "12",
+		justifyContent: "space-between",
+		px: "24",
+		py: "12"
+	}],
+	variants: { intent: {
+		danger: { bg: "bg.error.subtle" },
+		information: { bg: "bg.information.subtle" },
+		neutral: { bg: "bg.tertiary" },
+		success: { bg: "bg.success.subtle" },
+		warning: { bg: "bg.warning.subtle" }
+	} }
+});
+var content = require_recipeRuntime.recipeRuntime({ base: [{
+	flex: "1",
+	flexDirection: "column",
+	gap: "8",
+	justifyContent: "center"
+}, "cz45pa"] });
+var icon = require_recipeRuntime.recipeRuntime({
+	base: [{ mt: "4" }],
+	variants: { intent: {
+		danger: { color: "fg.error.strong" },
+		information: { color: "fg.information.strong" },
+		neutral: { color: "fg.tertiary" },
+		success: { color: "fg.success.strong" },
+		warning: { color: "fg.warning.strong" }
+	} }
+});
+//#endregion
+//#region src/banner/Banner.tsx
+const mapIntentToIcon = {
+	danger: _optiaxiom_icons_IconCircleExclamation.IconCircleExclamation,
+	information: _optiaxiom_icons_IconCircleInfo.IconCircleInfo,
+	neutral: _optiaxiom_icons_IconCircleInfo.IconCircleInfo,
+	success: _optiaxiom_icons_IconCheckCircleSolid.IconCheckCircleSolid,
+	warning: _optiaxiom_icons_IconTriangleExclamation.IconTriangleExclamation
+};
+/**
+* Display a prominent message at the top of the screen.
+*
+* @category feedback
+* @category layout
+* @since 0.1.0
+*/
+const Banner = (0, react.forwardRef)(({ children, className, intent = "neutral", onDismiss, ...props }, ref) => {
+	const labelId = (0, _radix_ui_react_id.useId)();
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_group.Group, {
+		"aria-labelledby": labelId,
+		ref,
+		role: "alert",
+		...banner({ intent }, className),
+		...props,
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_button.Icon, {
+				asChild: true,
+				...icon({ intent }),
+				children: (0, react.createElement)(mapIntentToIcon[intent], { filled: true })
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_group.Group, {
+				id: labelId,
+				...content(),
+				children
+			}),
+			!!onDismiss && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_button.Button, {
+				appearance: "subtle",
+				"aria-label": "close",
+				color: "fg.default",
+				flex: "none",
+				icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_optiaxiom_icons_IconXmark.IconXmark, {}),
+				onClick: onDismiss,
+				size: "sm"
+			})
+		]
+	});
+});
+Banner.displayName = "@optiaxiom/react/Banner";
+//#endregion
+Object.defineProperty(exports, "Banner", {
+	enumerable: true,
+	get: function() {
+		return Banner;
+	}
+});

package/dist/cjs/banner.js

@@ -0,0 +1,3 @@
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const require_banner = require("./banner-du20CQ1N.js");
+exports.Banner = require_banner.Banner;

package/dist/cjs/box-B2PXBdH7.js

@@ -0,0 +1,79 @@
+"use client";
+const require_sprinkles = require("./sprinkles-COrycuH3.js");
+const require_recipeRuntime = require("./recipeRuntime-BV5B1H9r.js");
+let react = require("react");
+require("@optiaxiom/globals/fonts");
+let _radix_ui_react_slot = require("@radix-ui/react-slot");
+require("./assets/layers.css.ts.vanilla-CTOkUrdE.css");
+require("./assets/properties.css.ts.vanilla-BXH_2Ftd.css");
+require("./assets/Box.css.ts.vanilla-CacDRI-f.css");
+let react_jsx_runtime = require("react/jsx-runtime");
+//#region package.json
+var version = "3.5.0";
+//#endregion
+//#region src/box/Box.css.ts
+var box = require_recipeRuntime.recipeRuntime({ base: "_1720c51" });
+//#endregion
+//#region src/box/extractBoxProps.ts
+function extractBoxProps(props) {
+	const boxProps = {};
+	const restProps = {};
+	for (const [name, value] of Object.entries(props)) if (name === "className" || name === "style" || require_sprinkles.sprinkles.properties.has(name)) {
+		if (value !== null && value !== void 0) boxProps[name] = value;
+	} else restProps[name] = value;
+	return {
+		boxProps,
+		restProps
+	};
+}
+//#endregion
+//#region src/box/Box.tsx
+const Slot = (0, _radix_ui_react_slot.createSlot)("@optiaxiom/react/Box");
+/**
+* A primitive layout component that provides access to design tokens and
+* styling without custom CSS.
+*
+* Use Box for simple styling (padding, margin, colors, borders) when you
+* don't need flexbox layout features. For flexbox layouts with
+* direction/alignment/gap, use Group instead.
+*
+* Use `extractBoxProps` to separate sprinkle props from the rest when
+* rendering non-div elements with `asChild`.
+*
+* @category layout
+*/
+const Box = (0, react.forwardRef)(({ asChild, className, style, ...props }, ref) => {
+	const Comp = asChild ? Slot : "div";
+	const { boxProps, restProps } = extractBoxProps(props);
+	const sprinkleStyles = require_sprinkles.sprinkles(boxProps);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Comp, {
+		"data-axiom": version,
+		ref,
+		...(style || sprinkleStyles.style) && { style: {
+			...style,
+			...sprinkleStyles.style
+		} },
+		...box({}, require_sprinkles.sprinklesMerge(className, sprinkleStyles.className)),
+		...restProps
+	});
+});
+Box.displayName = "@optiaxiom/react/Box";
+//#endregion
+Object.defineProperty(exports, "Box", {
+	enumerable: true,
+	get: function() {
+		return Box;
+	}
+});
+Object.defineProperty(exports, "extractBoxProps", {
+	enumerable: true,
+	get: function() {
+		return extractBoxProps;
+	}
+});
+Object.defineProperty(exports, "version", {
+	enumerable: true,
+	get: function() {
+		return version;
+	}
+});

package/dist/cjs/box.js

@@ -0,0 +1,4 @@
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const require_box = require("./box-B2PXBdH7.js");
+exports.Box = require_box.Box;
+exports.extractBoxProps = require_box.extractBoxProps;