@optiaxiom/react 3.4.2 → 3.5.0

package/dist/cjs/editor.js

@@ -1,25 +1,33 @@
 "use client";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const require_Tooltip = require("./Tooltip-DO_H320t.js");
-const require_ToggleButton = require("./ToggleButton-D9okcLhS.js");
-let _optiaxiom_icons = require("@optiaxiom/icons");
+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_group = require("./group.js");
+const require_tooltip = require("./tooltip-DgIDNGYv.js");
+const require_toggle_button = require("./toggle-button.js");
+let react = require("react");
+require("./assets/layers.css.ts.vanilla-CTOkUrdE.css");
+let react_jsx_runtime = require("react/jsx-runtime");
+let _optiaxiom_icons_IconBold = require("@optiaxiom/icons/IconBold");
+let _optiaxiom_icons_IconItalic = require("@optiaxiom/icons/IconItalic");
+let _optiaxiom_icons_IconLink = require("@optiaxiom/icons/IconLink");
+let _optiaxiom_icons_IconList = require("@optiaxiom/icons/IconList");
+let _optiaxiom_icons_IconListOl = require("@optiaxiom/icons/IconListOl");
 let _tiptap_extension_link = require("@tiptap/extension-link");
-_tiptap_extension_link = require_Tooltip.__toESM(_tiptap_extension_link, 1);
+_tiptap_extension_link = require_rolldown_runtime.__toESM(_tiptap_extension_link, 1);
 let _tiptap_extension_placeholder = require("@tiptap/extension-placeholder");
-_tiptap_extension_placeholder = require_Tooltip.__toESM(_tiptap_extension_placeholder, 1);
+_tiptap_extension_placeholder = require_rolldown_runtime.__toESM(_tiptap_extension_placeholder, 1);
 let _tiptap_extension_table = require("@tiptap/extension-table");
 let _tiptap_extension_table_cell = require("@tiptap/extension-table-cell");
 let _tiptap_extension_table_header = require("@tiptap/extension-table-header");
 let _tiptap_extension_table_row = require("@tiptap/extension-table-row");
 let _tiptap_react = require("@tiptap/react");
 let _tiptap_starter_kit = require("@tiptap/starter-kit");
-_tiptap_starter_kit = require_Tooltip.__toESM(_tiptap_starter_kit, 1);
-let react = require("react");
-require("./assets/layers.css.ts.vanilla-BFWK0cT2.css");
-let react_jsx_runtime = require("react/jsx-runtime");
-require("./assets/RichTextEditor.css.ts.vanilla-BlTjsfze.css");
+_tiptap_starter_kit = require_rolldown_runtime.__toESM(_tiptap_starter_kit, 1);
+require("./assets/RichTextEditor.css.ts.vanilla-DdyDUdjH.css");
 //#region src/rich-text-editor/RichTextEditor.css.ts
-var editor = require_Tooltip.recipeRuntime({ base: [
+var editor = require_recipeRuntime.recipeRuntime({ base: [
 	{
 		bg: "bg.default",
 		border: "1",
@@ -27,17 +35,17 @@ var editor = require_Tooltip.recipeRuntime({ base: [
 		flexDirection: "column",
 		rounded: "md"
 	},
-	"_1te6zg0",
-	"_1p9pjox"
+	"o4eets",
+	"_18b4oj1"
 ] });
-var toolbar = require_Tooltip.recipeRuntime({ base: [{
+var toolbar = require_recipeRuntime.recipeRuntime({ base: [{
 	alignItems: "center",
 	borderB: "1",
 	borderColor: "border.tertiary",
 	gap: "2",
 	px: "8",
 	py: "6"
-}, "z9kgzl"] });
+}, "rsr44e"] });
 //#endregion
 //#region src/rich-text-editor/RichTextEditor.tsx
 /**
@@ -85,63 +93,63 @@ const RichTextEditor = (0, react.forwardRef)(({ "aria-label": ariaLabel = "Rich
 		}
 		editor$1.chain().focus().extendMarkRange("link").setLink({ href: url }).run();
 	};
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_Tooltip.Box, {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_box.Box, {
 		ref,
 		...editor({}, className),
 		...props,
-		children: [!readOnly && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_Tooltip.Group, {
+		children: [!readOnly && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_group.Group, {
 			...toolbar(),
 			children: [
-				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Tooltip.Tooltip, {
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_tooltip.Tooltip, {
 					content: "Bold",
-					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_ToggleButton.ToggleButton, {
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_toggle_button.ToggleButton, {
 						appearance: "subtle",
 						"aria-label": "Bold",
-						icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_optiaxiom_icons.IconBold, {}),
+						icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_optiaxiom_icons_IconBold.IconBold, {}),
 						onPressedChange: () => editor$1.chain().focus().toggleBold().run(),
 						pressed: editor$1.isActive("bold"),
 						size: "sm"
 					})
 				}),
-				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Tooltip.Tooltip, {
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_tooltip.Tooltip, {
 					content: "Italic",
-					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_ToggleButton.ToggleButton, {
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_toggle_button.ToggleButton, {
 						appearance: "subtle",
 						"aria-label": "Italic",
-						icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_optiaxiom_icons.IconItalic, {}),
+						icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_optiaxiom_icons_IconItalic.IconItalic, {}),
 						onPressedChange: () => editor$1.chain().focus().toggleItalic().run(),
 						pressed: editor$1.isActive("italic"),
 						size: "sm"
 					})
 				}),
-				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Tooltip.Tooltip, {
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_tooltip.Tooltip, {
 					content: "Bullet list",
-					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_ToggleButton.ToggleButton, {
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_toggle_button.ToggleButton, {
 						appearance: "subtle",
 						"aria-label": "Bullet list",
-						icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_optiaxiom_icons.IconList, {}),
+						icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_optiaxiom_icons_IconList.IconList, {}),
 						onPressedChange: () => editor$1.chain().focus().toggleBulletList().run(),
 						pressed: editor$1.isActive("bulletList"),
 						size: "sm"
 					})
 				}),
-				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Tooltip.Tooltip, {
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_tooltip.Tooltip, {
 					content: "Numbered list",
-					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_ToggleButton.ToggleButton, {
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_toggle_button.ToggleButton, {
 						appearance: "subtle",
 						"aria-label": "Numbered list",
-						icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_optiaxiom_icons.IconListOl, {}),
+						icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_optiaxiom_icons_IconListOl.IconListOl, {}),
 						onPressedChange: () => editor$1.chain().focus().toggleOrderedList().run(),
 						pressed: editor$1.isActive("orderedList"),
 						size: "sm"
 					})
 				}),
-				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Tooltip.Tooltip, {
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_tooltip.Tooltip, {
 					content: "Link",
-					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_ToggleButton.ToggleButton, {
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_toggle_button.ToggleButton, {
 						appearance: "subtle",
 						"aria-label": "Link",
-						icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_optiaxiom_icons.IconLink, {}),
+						icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_optiaxiom_icons_IconLink.IconLink, {}),
 						onClick: setLink,
 						pressed: editor$1.isActive("link"),
 						size: "sm"

package/dist/cjs/ellipsis-menu-button.js

@@ -0,0 +1,29 @@
+"use client";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const require_button = require("./button-BO_WcwyT.js");
+let react = require("react");
+let react_jsx_runtime = require("react/jsx-runtime");
+let _optiaxiom_icons_IconEllipsisStroke = require("@optiaxiom/icons/IconEllipsisStroke");
+//#region src/ellipsis-menu-button/EllipsisMenuButton.tsx
+/**
+* Button with ellipsis icon for opening overflow menus and dropdowns.
+*
+* Use with MenuTrigger asChild for overflow menus.
+*
+* @example
+* <MenuTrigger asChild><EllipsisMenuButton /></MenuTrigger>
+*
+* @group Button
+*/
+const EllipsisMenuButton = (0, react.forwardRef)(({ children, ...props }, ref) => {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_button.Button, {
+		icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_optiaxiom_icons_IconEllipsisStroke.IconEllipsisStroke, {}),
+		iconPosition: "end",
+		ref,
+		...props,
+		children
+	});
+});
+EllipsisMenuButton.displayName = "@optiaxiom/react/EllipsisMenuButton";
+//#endregion
+exports.EllipsisMenuButton = EllipsisMenuButton;

package/dist/cjs/field.js

@@ -0,0 +1,140 @@
+"use client";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const require_rolldown_runtime = require("./rolldown-runtime-C0BPl7ul.js");
+const require_box = require("./box-B2PXBdH7.js");
+const require_button = require("./button-BO_WcwyT.js");
+const require_text = require("./text-BWyl3PQL.js");
+const require_group = require("./group.js");
+const require_VisuallyHidden = require("./VisuallyHidden-DK0Wtj7A.js");
+const require_FieldContext = require("./FieldContext-MRvFQT4y.js");
+const require_tooltip = require("./tooltip-DgIDNGYv.js");
+const require_SuggestionAlert = require("./SuggestionAlert-DxMozAgx.js");
+let _optiaxiom_icons_IconTriangleExclamation = require("@optiaxiom/icons/IconTriangleExclamation");
+let _radix_ui_react_id = require("@radix-ui/react-id");
+let react = require("react");
+let react_jsx_runtime = require("react/jsx-runtime");
+let _optiaxiom_icons_IconCircleQuestion = require("@optiaxiom/icons/IconCircleQuestion");
+let _radix_ui_react_label = require("@radix-ui/react-label");
+_radix_ui_react_label = require_rolldown_runtime.__toESM(_radix_ui_react_label, 1);
+//#region src/field/FieldLabel.tsx
+/**
+* @group Field
+*/
+const FieldLabel = (0, react.forwardRef)(({ children, info, inputId: inputIdProp, labelId: labelIdProp, required, ...props }, ref) => {
+	const inputId = (0, _radix_ui_react_id.useId)(inputIdProp);
+	const labelId = (0, _radix_ui_react_id.useId)(labelIdProp);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_group.Group, {
+		gap: "4",
+		ref,
+		...props,
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_text.Text, {
+			alignItems: "center",
+			asChild: true,
+			color: "fg.secondary",
+			display: "flex",
+			fontSize: "md",
+			fontWeight: "400",
+			gap: "2",
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_radix_ui_react_label.Root, {
+				htmlFor: inputId,
+				id: labelId,
+				children: [children, required && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_text.Text, {
+					"aria-hidden": "true",
+					asChild: true,
+					color: "fg.error",
+					fontWeight: "400",
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: "*" })
+				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_VisuallyHidden.VisuallyHidden, { children: "Required" })] })]
+			})
+		}), info && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_tooltip.Tooltip, {
+			content: info,
+			delayDuration: 0,
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_button.Button, {
+				"aria-label": "Information hover",
+				bg: "transparent",
+				border: "0",
+				color: "fg.secondary",
+				h: "2xs",
+				icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_box.Box, {
+					asChild: true,
+					flex: "initial",
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_optiaxiom_icons_IconCircleQuestion.IconCircleQuestion, {})
+				}),
+				onClick: (event) => {
+					event.currentTarget.focus();
+					event.preventDefault();
+				},
+				onPointerDownCapture: (event) => {
+					event.preventDefault();
+					event.stopPropagation();
+				},
+				p: "0",
+				w: "2xs"
+			})
+		})]
+	});
+});
+FieldLabel.displayName = "@optiaxiom/react/FieldLabel";
+//#endregion
+//#region src/field/Field.tsx
+/**
+* Wrapper for inputs to provide context such as label/help/required etc.
+*
+* @category form
+* @since 0.1.0
+*/
+const Field = (0, react.forwardRef)(({ children, description, error, info, inputId: inputIdProp, label, labelId: labelIdProp, required, ...props }, ref) => {
+	const inputId = (0, _radix_ui_react_id.useId)(inputIdProp);
+	const descriptionId = (0, _radix_ui_react_id.useId)();
+	const errorId = (0, _radix_ui_react_id.useId)();
+	const labelId = (0, _radix_ui_react_id.useId)(labelIdProp);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_group.Group, {
+		flexDirection: "column",
+		gap: "4",
+		ref,
+		...props,
+		children: [
+			label && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(FieldLabel, {
+				info,
+				inputId,
+				labelId,
+				required,
+				children: label
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_FieldContext.FieldProvider, {
+				descriptionId: description ? descriptionId : void 0,
+				error: !!error,
+				errorId: error ? errorId : void 0,
+				inputId,
+				labelId: label ? labelId : void 0,
+				children
+			}),
+			error && error !== true && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_group.Group, {
+				alignItems: "start",
+				color: "fg.error",
+				fontSize: "sm",
+				gap: "4",
+				id: errorId,
+				role: "alert",
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_box.Box, {
+					asChild: true,
+					flex: "none",
+					size: "16",
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_optiaxiom_icons_IconTriangleExclamation.IconTriangleExclamation, { "aria-label": "Error" })
+				}), error]
+			}),
+			description && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_box.Box, {
+				asChild: true,
+				color: "fg.tertiary",
+				fontSize: "sm",
+				id: descriptionId,
+				children: require_button.fallbackSpan(description)
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_SuggestionAlert.SuggestionAlert, {})
+		]
+	});
+});
+Field.displayName = "@optiaxiom/react/Field";
+//#endregion
+exports.Field = Field;
+exports.FieldLabel = FieldLabel;

package/dist/cjs/flex.js

@@ -0,0 +1,40 @@
+"use client";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const require_box = require("./box-B2PXBdH7.js");
+const require_sprinkles = require("./sprinkles-COrycuH3.js");
+let react = require("react");
+let react_jsx_runtime = require("react/jsx-runtime");
+//#region src/flex/Flex.tsx
+const mapDirectionToAlign = {
+	column: "stretch",
+	"column-reverse": "stretch",
+	row: "center",
+	"row-reverse": "center"
+};
+/**
+* Stack items vertically or horizontally in a flex container.
+*
+* @deprecated since 1.8.0 - use {@link Group} instead.
+*
+* To migrate existing Flex code: `npx @optiaxiom/codemod flex-to-group src/`
+*
+* ⚠️ Flex defaults to flexDirection='column' (NOT 'row' like standard CSS)
+* and gap='16'. Group uses standard CSS defaults (flexDirection='row', no
+* default gap).
+*
+* @category layout
+* @extends Box
+*/
+const Flex = (0, react.forwardRef)(({ alignItems, display = "flex", flexDirection = "column", gap = "16", ...props }, ref) => {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_box.Box, {
+		alignItems: alignItems ?? require_sprinkles.mapResponsiveValue(flexDirection, (value) => mapDirectionToAlign[value]),
+		display,
+		flexDirection,
+		gap,
+		ref,
+		...props
+	});
+});
+Flex.displayName = "@optiaxiom/react/Flex";
+//#endregion
+exports.Flex = Flex;

package/dist/cjs/grid.js

@@ -0,0 +1,24 @@
+"use client";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const require_box = require("./box-B2PXBdH7.js");
+let react = require("react");
+let react_jsx_runtime = require("react/jsx-runtime");
+//#region src/grid/Grid.tsx
+/**
+* Use `Grid` component to place items in a grid using equal width columns.
+*
+* @since 0.1.0
+* @category layout
+*/
+const Grid = (0, react.forwardRef)(({ display = "grid", gap = "16", gridTemplateColumns = "1", ...props }, ref) => {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_box.Box, {
+		display,
+		gap,
+		gridTemplateColumns,
+		ref,
+		...props
+	});
+});
+Grid.displayName = "@optiaxiom/react/Grid";
+//#endregion
+exports.Grid = Grid;

package/dist/cjs/group.js

@@ -0,0 +1,39 @@
+"use client";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const require_box = require("./box-B2PXBdH7.js");
+const require_sprinkles = require("./sprinkles-COrycuH3.js");
+let react = require("react");
+let react_jsx_runtime = require("react/jsx-runtime");
+//#region src/group/Group.tsx
+const mapDirectionToAlign = {
+	column: "stretch",
+	"column-reverse": "stretch",
+	row: "center",
+	"row-reverse": "center"
+};
+/**
+* A flexbox layout component for grouping items horizontally or vertically.
+*
+* Default Props:
+* - flexDirection: 'row' (CSS standard - horizontal layout)
+* - alignItems: 'center' (when row) or 'stretch' (when column)
+*
+* Common Usage:
+* - Horizontal button groups: <Group gap="8"><Button /><Button /></Group>
+* - Vertical forms: <Group flexDirection="column" gap="16"><Input /><Input /></Group>
+* - Icon + text combos: <Group gap="4" alignItems="center"><Icon /><Text /></Group>
+*
+* @category layout
+*/
+const Group = (0, react.forwardRef)(({ alignItems, display = "flex", flexDirection = "row", ...props }, ref) => {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_box.Box, {
+		alignItems: alignItems ?? require_sprinkles.mapResponsiveValue(flexDirection, (value) => mapDirectionToAlign[value]),
+		display,
+		flexDirection,
+		ref,
+		...props
+	});
+});
+Group.displayName = "@optiaxiom/react/Group";
+//#endregion
+exports.Group = Group;

package/dist/cjs/heading-hT47_aTz.js

@@ -0,0 +1,92 @@
+"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/Heading.css.ts.vanilla-CSAdBFKt.css");
+//#region src/heading/Heading.css.ts
+var heading = require_recipeRuntime.recipeRuntime({
+	base: { fontFamily: "heading" },
+	variants: {
+		level: {
+			"1": "cixemh",
+			"2": "_2qhtg1",
+			"3": "mry3v8",
+			"4": "rzstn1"
+		},
+		tracking: {
+			wide: "_1lxo0he",
+			wider: "_3ajeme",
+			widest: "gwyc2x"
+		}
+	}
+});
+//#endregion
+//#region src/heading/Heading.tsx
+const Slot = (0, _radix_ui_react_slot.createSlot)("@optiaxiom/react/Heading");
+const mapLevelToTag = {
+	"1": "h1",
+	"2": "h2",
+	"3": "h3",
+	"4": "h4"
+};
+const mapLevelToFontWeight = {
+	"1": "900",
+	"2": "700",
+	"3": "600",
+	"4": "600"
+};
+const mapLevelToTracking = {
+	"1": "wide",
+	"2": "wider",
+	"3": "wider",
+	"4": "widest"
+};
+/**
+* Renders semantic heading elements (h1-h4) for document structure and
+* accessibility.
+*
+* Use this for page titles, section headings, and any text that represents a
+* heading in the document outline. Don't use Text with large fontSize and bold
+* fontWeight for headings - Heading provides proper semantics for screen
+* readers and improves accessibility.
+*
+* When to use:
+* - Page titles
+* - Section headings
+* - Card/panel titles
+* - Any text with fontSize='xl'+ and fontWeight='500'+
+*
+* ⚠️ All heading levels (1-4) default to fontWeight="700". If your design shows
+* lighter headings, explicitly set fontWeight="500" or "600".
+*
+* Don't use Text component for headings - it lacks semantic meaning.
+*
+* @category typography
+* @since 0.1.0
+* @extends Text
+*/
+const Heading = (0, react.forwardRef)(({ asChild, children, className, fontWeight, level = "1", ...props }, ref) => {
+	const Comp = asChild ? Slot : mapLevelToTag[level] ?? "h1";
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_text.Text, {
+		asChild: true,
+		fontWeight: fontWeight ?? mapLevelToFontWeight[level] ?? "700",
+		ref,
+		...heading({
+			level,
+			tracking: mapLevelToTracking[level]
+		}, className),
+		...props,
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Comp, { children })
+	});
+});
+Heading.displayName = "@optiaxiom/react/Heading";
+//#endregion
+Object.defineProperty(exports, "Heading", {
+	enumerable: true,
+	get: function() {
+		return Heading;
+	}
+});

package/dist/cjs/heading.js

@@ -0,0 +1,3 @@
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const require_heading = require("./heading-hT47_aTz.js");
+exports.Heading = require_heading.Heading;