@capra/core 1.6.0 → 1.7.0

package/dist/index.cjs

@@ -4196,7 +4196,7 @@ const MenuSection = ({ children, "aria-label": ariaLabel, "aria-labelledby": ari
 	}, resolvedChildren));
 };
 MenuSection.displayName = "Menu.Section";
-const MenuItem = ({ as, label, description, ariaLabel, href, disabled = false, active = false, variant = "default", icon, indent: indentProp, shortcut, parent = false, onClick, FORCE__className, children, ...rest }) => {
+const MenuItem = ({ as: Component, label, description, ariaLabel, href, disabled = false, active = false, variant = "default", icon, indent: indentProp, shortcut, parent = false, onPress, onClick, FORCE__className, children, ...rest }) => {
 	const indentFromSectionHeader = react.useContext(MenuSectionIndentContext);
 	const indent = indentProp !== void 0 ? indentProp : indentFromSectionHeader ? true : false;
 	const labelContent = children ?? label;
@@ -4210,59 +4210,27 @@ const MenuItem = ({ as, label, description, ariaLabel, href, disabled = false, a
 		size: "xs",
 		"aria-hidden": true
 	}) : null])));
-	const itemClassName = clsx(Menu_module_default.menuItem, FORCE__className);
-	const menuItemDataAttributes = {
-		"data-variant": variant,
-		"data-active": active || void 0,
-		"data-indent": indent || void 0,
-		"data-has-description": showDescription || void 0
-	};
-	/** React Aria runs menu activation through `onAction` (pointer + Enter/Space), not only `onPress`. */
-	const handleAction = () => {
-		if (!disabled && onClick) onClick({});
-	};
-	if (as) {
-		const Component = as;
-		return /* @__PURE__ */ react.createElement(react_aria_components.MenuItem, {
-			isDisabled: disabled,
-			textValue,
-			"aria-label": ariaLabel,
-			"aria-current": active ? "page" : void 0,
-			className: itemClassName,
-			...menuItemDataAttributes,
-			render: (domProps) => /* @__PURE__ */ react.createElement(Component, {
-				...domProps,
-				...rest
-			}),
-			onAction: handleAction
-		}, /* @__PURE__ */ react.createElement(ListItem, {
-			as: "div",
-			role: "presentation",
-			FORCE__className: Menu_module_default.menuItemListItemShell
-		}, listItemContent));
-	}
-	if (Boolean(href) && !disabled) return /* @__PURE__ */ react.createElement(react_aria_components.MenuItem, {
-		href,
-		isDisabled: disabled,
-		textValue,
-		"aria-label": ariaLabel,
-		"aria-current": active ? "page" : void 0,
-		className: itemClassName,
-		...menuItemDataAttributes,
-		onAction: handleAction
-	}, /* @__PURE__ */ react.createElement(ListItem, {
-		as: "div",
-		role: "presentation",
-		FORCE__className: Menu_module_default.menuItemListItemShell
-	}, listItemContent));
+	const render = Component ? (domProps) => {
+		const Element = Component;
+		return /* @__PURE__ */ react.createElement(Element, {
+			...domProps,
+			...rest
+		});
+	} : void 0;
 	return /* @__PURE__ */ react.createElement(react_aria_components.MenuItem, {
+		href,
 		isDisabled: disabled,
 		textValue,
 		"aria-label": ariaLabel,
 		"aria-current": active ? "page" : void 0,
-		className: itemClassName,
-		...menuItemDataAttributes,
-		onAction: handleAction
+		className: clsx(Menu_module_default.menuItem, FORCE__className),
+		"data-variant": variant,
+		"data-active": active || void 0,
+		"data-indent": indent || void 0,
+		"data-has-description": showDescription || void 0,
+		render,
+		onClick,
+		onPress
 	}, /* @__PURE__ */ react.createElement(ListItem, {
 		as: "div",
 		role: "presentation",
@@ -4294,10 +4262,9 @@ const MenuSubmenu = ({ label, children, itemHoverAppearance = "default", itemAct
 		size: "xs",
 		"aria-hidden": true
 	}))));
-	const triggerClassName = clsx(Menu_module_default.menuItem, classNameOverride);
 	return /* @__PURE__ */ react.createElement(react_aria_components.SubmenuTrigger, { delay }, /* @__PURE__ */ react.createElement(react_aria_components.MenuItem, {
 		textValue,
-		className: triggerClassName
+		className: clsx(Menu_module_default.menuItem, classNameOverride)
 	}, /* @__PURE__ */ react.createElement(ListItem, {
 		as: "div",
 		role: "presentation",
@@ -4708,10 +4675,7 @@ const TabNav = ({ activeKey, onTabClick, items, tabPlacement = "horizontal", cen
 		role: "navigation",
 		"aria-label": ariaLabel,
 		className: TabNav_module_default.tabBar
-	}, /* @__PURE__ */ react.createElement("div", {
-		className: TabNav_module_default.tabList,
-		"aria-orientation": tabPlacement === "horizontal" ? "horizontal" : "vertical"
-	}, items.map((item) => {
+	}, /* @__PURE__ */ react.createElement("div", { className: TabNav_module_default.tabList }, items.map((item) => {
 		const hasSubItems = Boolean(item.subItems?.length);
 		const showDropdown = hasSubItems || item.variant === "dropdown";
 		/** Accent “active” tab styling: current route only (not merely flyout open — open + non-route stays grey). */

package/dist/index.d.cts

@@ -1,6 +1,6 @@
 import * as React$2 from "react";
 import React$1, { HTMLAttributeAnchorTarget, HTMLAttributeReferrerPolicy } from "react";
-import { BreadcrumbProps as BreadcrumbProps$1, BreadcrumbsProps as BreadcrumbsProps$1, ButtonProps as ButtonProps$1, ComboBoxRenderProps, DatePickerProps, DateRangePickerProps, DateValue, DisclosureProps, Focusable, LinkProps as LinkProps$1, ListBoxItemProps, PopoverProps as PopoverProps$1, RouterProvider } from "react-aria-components";
+import { BreadcrumbProps as BreadcrumbProps$1, BreadcrumbsProps as BreadcrumbsProps$1, ButtonProps as ButtonProps$1, ComboBoxRenderProps, DatePickerProps, DateRangePickerProps, DateValue, DisclosureProps, Focusable, LinkProps as LinkProps$1, ListBoxItemProps, PopoverProps as PopoverProps$1, PressEvent, RouterProvider } from "react-aria-components";
 import { SvgIcon } from "@capra/icons";
 import { SvgLogo } from "@capra/icons/logos";
 
@@ -125,7 +125,7 @@ declare const TextInput: React$2.ForwardRefExoticComponent<{
    */
   size?: Size$3; /** Content after the input (e.g. icon or clear button). */
   trailingSlot?: React$2.ReactNode;
-} & StylingOverrideProps & Omit<Omit<React$2.DetailedHTMLProps<React$2.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref">, "style" | "size" | "className"> & React$2.RefAttributes<HTMLInputElement>>;
+} & StylingOverrideProps & Omit<Omit<React$2.DetailedHTMLProps<React$2.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref">, "style" | "className" | "size"> & React$2.RefAttributes<HTMLInputElement>>;
 //#endregion
 //#region src/components/input-helpers/fieldLayout.d.ts
 type FieldLayoutProps = {
@@ -172,7 +172,7 @@ declare const AutocompleteField: ((props: {
   leadingSlot?: React$1.ReactNode;
   size?: Size$3;
   trailingSlot?: React$1.ReactNode;
-} & StylingOverrideProps & Omit<Omit<React$1.DetailedHTMLProps<React$1.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref">, "style" | "size" | "className"> & React$1.RefAttributes<HTMLInputElement>, "ref">, "value" | "onChange"> & React$1.RefAttributes<HTMLInputElement>) => React$1.ReactElement) & {
+} & StylingOverrideProps & Omit<Omit<React$1.DetailedHTMLProps<React$1.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref">, "style" | "className" | "size"> & React$1.RefAttributes<HTMLInputElement>, "ref">, "onChange" | "value"> & React$1.RefAttributes<HTMLInputElement>) => React$1.ReactElement) & {
   Item: typeof AutocompleteItem;
 };
 //#endregion
@@ -429,7 +429,7 @@ type RadioGroupProps = RadioGroupContextValue & StylingOverrideProps & Omit<Reac
 /**
  * A control wrapper for a group of radio buttons.
  */
-declare const RadioGroup: (props: RadioGroupContextValue & StylingOverrideProps & Omit<Omit<React$2.DetailedHTMLProps<React$2.FieldsetHTMLAttributes<HTMLFieldSetElement>, HTMLFieldSetElement>, "ref">, "onChange" | "className"> & React$2.RefAttributes<HTMLFieldSetElement>) => React$2.ReactElement;
+declare const RadioGroup: (props: RadioGroupContextValue & StylingOverrideProps & Omit<Omit<React$2.DetailedHTMLProps<React$2.FieldsetHTMLAttributes<HTMLFieldSetElement>, HTMLFieldSetElement>, "ref">, "className" | "onChange"> & React$2.RefAttributes<HTMLFieldSetElement>) => React$2.ReactElement;
 //#endregion
 //#region src/components/Radio/Radio.d.ts
 type ChildrenLabel = {
@@ -562,7 +562,7 @@ declare const Checkbox: React$2.ForwardRefExoticComponent<{
   checked?: boolean; /** Default checked state for uncontrolled component. */
   defaultChecked?: boolean; /** The label for the checkbox. */
   children?: string | React$2.ReactNode;
-} & StylingOverrideProps & Omit<Omit<React$2.DetailedHTMLProps<React$2.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref">, "type" | "className"> & React$2.RefAttributes<HTMLInputElement>>;
+} & StylingOverrideProps & Omit<Omit<React$2.DetailedHTMLProps<React$2.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref">, "className" | "type"> & React$2.RefAttributes<HTMLInputElement>>;
 //#endregion
 //#region src/components/Collapse/Collapse.d.ts
 /** Props forwarded to React Aria `Disclosure`; see https://reactaria.adobe.com/Disclosure */
@@ -636,7 +636,7 @@ declare const TextField: React$2.ForwardRefExoticComponent<{
   /** Called with the new string value when the input changes. */onChange?: (value: string) => void; /** When true, shows a character count. */
   showCount?: boolean;
   value?: string | number | undefined;
-} & FieldLayoutProps & Omit<TextInputProps, "value" | "onChange"> & React$2.RefAttributes<HTMLInputElement>>;
+} & FieldLayoutProps & Omit<TextInputProps, "onChange" | "value"> & React$2.RefAttributes<HTMLInputElement>>;
 //#endregion
 //#region src/components/PasswordField/PasswordField.d.ts
 type PasswordFieldProps = Omit<TextFieldProps, 'trailingSlot' | 'type'>;
@@ -660,7 +660,7 @@ type NumberFieldProps = Omit<TextInputProps, 'type' | 'onChange' | 'min' | 'max'
 /**
  * Number field built on React Aria `NumberField`, with custom increment/decrement controls (native spinners hidden).
  */
-declare const NumberField: React$2.ForwardRefExoticComponent<Omit<TextInputProps, "max" | "min" | "step" | "type" | "onChange"> & {
+declare const NumberField: React$2.ForwardRefExoticComponent<Omit<TextInputProps, "onChange" | "max" | "min" | "type" | "step"> & {
   /** Called with the unformatted number value when the number changes. */onChange?: (value: number) => void; /** Locale-aware display and parsing for the displayed value (see https://react-aria.adobe.com/NumberField#format-options) */
   formatOptions?: Intl.NumberFormatOptions; /** Minimum value */
   min?: number; /** Maximum value */
@@ -682,7 +682,7 @@ type DatePickerFieldProps<T extends DateValue = DateValue> = FieldLayoutProps &
   required?: boolean; /** Invalid value; `appearance="danger"` also forces an invalid state for display. */
   isInvalid?: boolean;
 };
-declare const DatePickerField: React$2.ForwardRefExoticComponent<FieldLayoutProps & Pick<TextInputProps, "placeholder" | "size" | "appearance" | "leadingSlot"> & Pick<DatePickerProps<DateValue>, "value" | "onChange" | "defaultValue"> & {
+declare const DatePickerField: React$2.ForwardRefExoticComponent<FieldLayoutProps & Pick<TextInputProps, "placeholder" | "size" | "appearance" | "leadingSlot"> & Pick<DatePickerProps<DateValue>, "defaultValue" | "onChange" | "value"> & {
   /** Smallest date/time unit shown in the field. Only `day` and `second` are supported. */granularity?: "day" | "second";
 } & StylingOverrideProps & {
   /** When true, shows a clear control to the left of the calendar button while the field has a value. */canClear?: boolean; /** Disables the field. */
@@ -710,7 +710,7 @@ type DateRangePickerFieldProps<T extends DateValue = DateValue> = FieldLayoutPro
 };
 declare const DateRangePickerField: React$2.ForwardRefExoticComponent<FieldLayoutProps & Pick<TextInputProps, "size" | "appearance" | "leadingSlot"> & {
   /** Placeholders for empty start and end, shown with a swap icon between them when the group is not focus-within. */placeholder?: DateRangePickerFieldPlaceholder;
-} & Pick<DateRangePickerProps<DateValue>, "value" | "onChange" | "defaultValue" | "shouldCloseOnSelect"> & {
+} & Pick<DateRangePickerProps<DateValue>, "defaultValue" | "onChange" | "value" | "shouldCloseOnSelect"> & {
   /** Smallest date/time unit shown in the fields. Only `day` and `second` are supported. */granularity?: "day" | "second";
 } & StylingOverrideProps & {
   /** When true, shows a clear control to the left of the calendar button while the field has a value. */canClear?: boolean; /** Disables the field. */
@@ -770,7 +770,7 @@ declare const TextArea: React$2.ForwardRefExoticComponent<{
   autoSize?: TextAreaAutoSize; /** When true, shows a character count. */
   showCount?: boolean; /** Called with the new string value when the input changes. */
   onChange?: (value: string) => void;
-} & FieldLayoutProps & StylingOverrideProps & Omit<Omit<React$2.DetailedHTMLProps<React$2.TextareaHTMLAttributes<HTMLTextAreaElement>, HTMLTextAreaElement>, "ref">, "style" | "size" | "onChange" | "className"> & React$2.RefAttributes<HTMLTextAreaElement>>;
+} & FieldLayoutProps & StylingOverrideProps & Omit<Omit<React$2.DetailedHTMLProps<React$2.TextareaHTMLAttributes<HTMLTextAreaElement>, HTMLTextAreaElement>, "ref">, "style" | "className" | "onChange" | "size"> & React$2.RefAttributes<HTMLTextAreaElement>>;
 //#endregion
 //#region src/components/Modal/Modal.d.ts
 type ModalSize = 'sm' | 'md' | 'lg';
@@ -1763,8 +1763,13 @@ type MenuItemProps<As extends React$2.ElementType = 'a'> = Omit<React$2.Componen
    * Whether to show chevron (for submenu/parent items).
    */
   parent?: boolean;
+  /**
+   * Press handler.
+   */
+  onPress?: (e: PressEvent) => void;
   /**
    * Click handler.
+   * @deprecated Use `onPress` instead.
    */
   onClick?: (e: React$2.MouseEvent) => void;
   /**
@@ -1906,7 +1911,7 @@ declare const Menu: {
   displayName: string;
   Item: {
     <As extends React$2.ElementType = "a">({
-      as,
+      as: Component,
       label,
       description,
       ariaLabel,
@@ -1918,6 +1923,7 @@ declare const Menu: {
       indent: indentProp,
       shortcut,
       parent,
+      onPress,
       onClick,
       FORCE__className,
       children,

package/dist/index.d.mts

@@ -1,7 +1,7 @@
 import * as React$2 from "react";
 import React$1, { HTMLAttributeAnchorTarget, HTMLAttributeReferrerPolicy } from "react";
 import { SvgIcon } from "@capra/icons";
-import { BreadcrumbProps as BreadcrumbProps$1, BreadcrumbsProps as BreadcrumbsProps$1, ButtonProps as ButtonProps$1, ComboBoxRenderProps, DatePickerProps, DateRangePickerProps, DateValue, DisclosureProps, Focusable, LinkProps as LinkProps$1, ListBoxItemProps, PopoverProps as PopoverProps$1, RouterProvider } from "react-aria-components";
+import { BreadcrumbProps as BreadcrumbProps$1, BreadcrumbsProps as BreadcrumbsProps$1, ButtonProps as ButtonProps$1, ComboBoxRenderProps, DatePickerProps, DateRangePickerProps, DateValue, DisclosureProps, Focusable, LinkProps as LinkProps$1, ListBoxItemProps, PopoverProps as PopoverProps$1, PressEvent, RouterProvider } from "react-aria-components";
 import { SvgLogo } from "@capra/icons/logos";
 
 //#region src/utils/stylingOverride.d.ts
@@ -125,7 +125,7 @@ declare const TextInput: React$2.ForwardRefExoticComponent<{
    */
   size?: Size$3; /** Content after the input (e.g. icon or clear button). */
   trailingSlot?: React$2.ReactNode;
-} & StylingOverrideProps & Omit<Omit<React$2.DetailedHTMLProps<React$2.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref">, "style" | "size" | "className"> & React$2.RefAttributes<HTMLInputElement>>;
+} & StylingOverrideProps & Omit<Omit<React$2.DetailedHTMLProps<React$2.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref">, "style" | "className" | "size"> & React$2.RefAttributes<HTMLInputElement>>;
 //#endregion
 //#region src/components/input-helpers/fieldLayout.d.ts
 type FieldLayoutProps = {
@@ -172,7 +172,7 @@ declare const AutocompleteField: ((props: {
   leadingSlot?: React$1.ReactNode;
   size?: Size$3;
   trailingSlot?: React$1.ReactNode;
-} & StylingOverrideProps & Omit<Omit<React$1.DetailedHTMLProps<React$1.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref">, "style" | "size" | "className"> & React$1.RefAttributes<HTMLInputElement>, "ref">, "value" | "onChange"> & React$1.RefAttributes<HTMLInputElement>) => React$1.ReactElement) & {
+} & StylingOverrideProps & Omit<Omit<React$1.DetailedHTMLProps<React$1.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref">, "style" | "className" | "size"> & React$1.RefAttributes<HTMLInputElement>, "ref">, "onChange" | "value"> & React$1.RefAttributes<HTMLInputElement>) => React$1.ReactElement) & {
   Item: typeof AutocompleteItem;
 };
 //#endregion
@@ -429,7 +429,7 @@ type RadioGroupProps = RadioGroupContextValue & StylingOverrideProps & Omit<Reac
 /**
  * A control wrapper for a group of radio buttons.
  */
-declare const RadioGroup: (props: RadioGroupContextValue & StylingOverrideProps & Omit<Omit<React$2.DetailedHTMLProps<React$2.FieldsetHTMLAttributes<HTMLFieldSetElement>, HTMLFieldSetElement>, "ref">, "onChange" | "className"> & React$2.RefAttributes<HTMLFieldSetElement>) => React$2.ReactElement;
+declare const RadioGroup: (props: RadioGroupContextValue & StylingOverrideProps & Omit<Omit<React$2.DetailedHTMLProps<React$2.FieldsetHTMLAttributes<HTMLFieldSetElement>, HTMLFieldSetElement>, "ref">, "className" | "onChange"> & React$2.RefAttributes<HTMLFieldSetElement>) => React$2.ReactElement;
 //#endregion
 //#region src/components/Radio/Radio.d.ts
 type ChildrenLabel = {
@@ -562,7 +562,7 @@ declare const Checkbox: React$2.ForwardRefExoticComponent<{
   checked?: boolean; /** Default checked state for uncontrolled component. */
   defaultChecked?: boolean; /** The label for the checkbox. */
   children?: string | React$2.ReactNode;
-} & StylingOverrideProps & Omit<Omit<React$2.DetailedHTMLProps<React$2.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref">, "type" | "className"> & React$2.RefAttributes<HTMLInputElement>>;
+} & StylingOverrideProps & Omit<Omit<React$2.DetailedHTMLProps<React$2.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref">, "className" | "type"> & React$2.RefAttributes<HTMLInputElement>>;
 //#endregion
 //#region src/components/Collapse/Collapse.d.ts
 /** Props forwarded to React Aria `Disclosure`; see https://reactaria.adobe.com/Disclosure */
@@ -636,7 +636,7 @@ declare const TextField: React$2.ForwardRefExoticComponent<{
   /** Called with the new string value when the input changes. */onChange?: (value: string) => void; /** When true, shows a character count. */
   showCount?: boolean;
   value?: string | number | undefined;
-} & FieldLayoutProps & Omit<TextInputProps, "value" | "onChange"> & React$2.RefAttributes<HTMLInputElement>>;
+} & FieldLayoutProps & Omit<TextInputProps, "onChange" | "value"> & React$2.RefAttributes<HTMLInputElement>>;
 //#endregion
 //#region src/components/PasswordField/PasswordField.d.ts
 type PasswordFieldProps = Omit<TextFieldProps, 'trailingSlot' | 'type'>;
@@ -660,7 +660,7 @@ type NumberFieldProps = Omit<TextInputProps, 'type' | 'onChange' | 'min' | 'max'
 /**
  * Number field built on React Aria `NumberField`, with custom increment/decrement controls (native spinners hidden).
  */
-declare const NumberField: React$2.ForwardRefExoticComponent<Omit<TextInputProps, "max" | "min" | "step" | "type" | "onChange"> & {
+declare const NumberField: React$2.ForwardRefExoticComponent<Omit<TextInputProps, "onChange" | "max" | "min" | "type" | "step"> & {
   /** Called with the unformatted number value when the number changes. */onChange?: (value: number) => void; /** Locale-aware display and parsing for the displayed value (see https://react-aria.adobe.com/NumberField#format-options) */
   formatOptions?: Intl.NumberFormatOptions; /** Minimum value */
   min?: number; /** Maximum value */
@@ -682,7 +682,7 @@ type DatePickerFieldProps<T extends DateValue = DateValue> = FieldLayoutProps &
   required?: boolean; /** Invalid value; `appearance="danger"` also forces an invalid state for display. */
   isInvalid?: boolean;
 };
-declare const DatePickerField: React$2.ForwardRefExoticComponent<FieldLayoutProps & Pick<TextInputProps, "placeholder" | "size" | "appearance" | "leadingSlot"> & Pick<DatePickerProps<DateValue>, "value" | "onChange" | "defaultValue"> & {
+declare const DatePickerField: React$2.ForwardRefExoticComponent<FieldLayoutProps & Pick<TextInputProps, "placeholder" | "size" | "appearance" | "leadingSlot"> & Pick<DatePickerProps<DateValue>, "defaultValue" | "onChange" | "value"> & {
   /** Smallest date/time unit shown in the field. Only `day` and `second` are supported. */granularity?: "day" | "second";
 } & StylingOverrideProps & {
   /** When true, shows a clear control to the left of the calendar button while the field has a value. */canClear?: boolean; /** Disables the field. */
@@ -710,7 +710,7 @@ type DateRangePickerFieldProps<T extends DateValue = DateValue> = FieldLayoutPro
 };
 declare const DateRangePickerField: React$2.ForwardRefExoticComponent<FieldLayoutProps & Pick<TextInputProps, "size" | "appearance" | "leadingSlot"> & {
   /** Placeholders for empty start and end, shown with a swap icon between them when the group is not focus-within. */placeholder?: DateRangePickerFieldPlaceholder;
-} & Pick<DateRangePickerProps<DateValue>, "value" | "onChange" | "defaultValue" | "shouldCloseOnSelect"> & {
+} & Pick<DateRangePickerProps<DateValue>, "defaultValue" | "onChange" | "value" | "shouldCloseOnSelect"> & {
   /** Smallest date/time unit shown in the fields. Only `day` and `second` are supported. */granularity?: "day" | "second";
 } & StylingOverrideProps & {
   /** When true, shows a clear control to the left of the calendar button while the field has a value. */canClear?: boolean; /** Disables the field. */
@@ -770,7 +770,7 @@ declare const TextArea: React$2.ForwardRefExoticComponent<{
   autoSize?: TextAreaAutoSize; /** When true, shows a character count. */
   showCount?: boolean; /** Called with the new string value when the input changes. */
   onChange?: (value: string) => void;
-} & FieldLayoutProps & StylingOverrideProps & Omit<Omit<React$2.DetailedHTMLProps<React$2.TextareaHTMLAttributes<HTMLTextAreaElement>, HTMLTextAreaElement>, "ref">, "style" | "size" | "onChange" | "className"> & React$2.RefAttributes<HTMLTextAreaElement>>;
+} & FieldLayoutProps & StylingOverrideProps & Omit<Omit<React$2.DetailedHTMLProps<React$2.TextareaHTMLAttributes<HTMLTextAreaElement>, HTMLTextAreaElement>, "ref">, "style" | "className" | "onChange" | "size"> & React$2.RefAttributes<HTMLTextAreaElement>>;
 //#endregion
 //#region src/components/Modal/Modal.d.ts
 type ModalSize = 'sm' | 'md' | 'lg';
@@ -1763,8 +1763,13 @@ type MenuItemProps<As extends React$2.ElementType = 'a'> = Omit<React$2.Componen
    * Whether to show chevron (for submenu/parent items).
    */
   parent?: boolean;
+  /**
+   * Press handler.
+   */
+  onPress?: (e: PressEvent) => void;
   /**
    * Click handler.
+   * @deprecated Use `onPress` instead.
    */
   onClick?: (e: React$2.MouseEvent) => void;
   /**
@@ -1906,7 +1911,7 @@ declare const Menu: {
   displayName: string;
   Item: {
     <As extends React$2.ElementType = "a">({
-      as,
+      as: Component,
       label,
       description,
       ariaLabel,
@@ -1918,6 +1923,7 @@ declare const Menu: {
       indent: indentProp,
       shortcut,
       parent,
+      onPress,
       onClick,
       FORCE__className,
       children,

package/dist/index.mjs

@@ -4172,7 +4172,7 @@ const MenuSection$1 = ({ children, "aria-label": ariaLabel, "aria-labelledby": a
 	}, resolvedChildren));
 };
 MenuSection$1.displayName = "Menu.Section";
-const MenuItem$1 = ({ as, label, description, ariaLabel, href, disabled = false, active = false, variant = "default", icon, indent: indentProp, shortcut, parent = false, onClick, FORCE__className, children, ...rest }) => {
+const MenuItem$1 = ({ as: Component, label, description, ariaLabel, href, disabled = false, active = false, variant = "default", icon, indent: indentProp, shortcut, parent = false, onPress, onClick, FORCE__className, children, ...rest }) => {
 	const indentFromSectionHeader = React$1.useContext(MenuSectionIndentContext);
 	const indent = indentProp !== void 0 ? indentProp : indentFromSectionHeader ? true : false;
 	const labelContent = children ?? label;
@@ -4186,59 +4186,27 @@ const MenuItem$1 = ({ as, label, description, ariaLabel, href, disabled = false,
 		size: "xs",
 		"aria-hidden": true
 	}) : null])));
-	const itemClassName = clsx(Menu_module_default.menuItem, FORCE__className);
-	const menuItemDataAttributes = {
-		"data-variant": variant,
-		"data-active": active || void 0,
-		"data-indent": indent || void 0,
-		"data-has-description": showDescription || void 0
-	};
-	/** React Aria runs menu activation through `onAction` (pointer + Enter/Space), not only `onPress`. */
-	const handleAction = () => {
-		if (!disabled && onClick) onClick({});
-	};
-	if (as) {
-		const Component = as;
-		return /* @__PURE__ */ React$1.createElement(MenuItem, {
-			isDisabled: disabled,
-			textValue,
-			"aria-label": ariaLabel,
-			"aria-current": active ? "page" : void 0,
-			className: itemClassName,
-			...menuItemDataAttributes,
-			render: (domProps) => /* @__PURE__ */ React$1.createElement(Component, {
-				...domProps,
-				...rest
-			}),
-			onAction: handleAction
-		}, /* @__PURE__ */ React$1.createElement(ListItem, {
-			as: "div",
-			role: "presentation",
-			FORCE__className: Menu_module_default.menuItemListItemShell
-		}, listItemContent));
-	}
-	if (Boolean(href) && !disabled) return /* @__PURE__ */ React$1.createElement(MenuItem, {
-		href,
-		isDisabled: disabled,
-		textValue,
-		"aria-label": ariaLabel,
-		"aria-current": active ? "page" : void 0,
-		className: itemClassName,
-		...menuItemDataAttributes,
-		onAction: handleAction
-	}, /* @__PURE__ */ React$1.createElement(ListItem, {
-		as: "div",
-		role: "presentation",
-		FORCE__className: Menu_module_default.menuItemListItemShell
-	}, listItemContent));
+	const render = Component ? (domProps) => {
+		const Element = Component;
+		return /* @__PURE__ */ React$1.createElement(Element, {
+			...domProps,
+			...rest
+		});
+	} : void 0;
 	return /* @__PURE__ */ React$1.createElement(MenuItem, {
+		href,
 		isDisabled: disabled,
 		textValue,
 		"aria-label": ariaLabel,
 		"aria-current": active ? "page" : void 0,
-		className: itemClassName,
-		...menuItemDataAttributes,
-		onAction: handleAction
+		className: clsx(Menu_module_default.menuItem, FORCE__className),
+		"data-variant": variant,
+		"data-active": active || void 0,
+		"data-indent": indent || void 0,
+		"data-has-description": showDescription || void 0,
+		render,
+		onClick,
+		onPress
 	}, /* @__PURE__ */ React$1.createElement(ListItem, {
 		as: "div",
 		role: "presentation",
@@ -4270,10 +4238,9 @@ const MenuSubmenu = ({ label, children, itemHoverAppearance = "default", itemAct
 		size: "xs",
 		"aria-hidden": true
 	}))));
-	const triggerClassName = clsx(Menu_module_default.menuItem, classNameOverride);
 	return /* @__PURE__ */ React$1.createElement(SubmenuTrigger, { delay }, /* @__PURE__ */ React$1.createElement(MenuItem, {
 		textValue,
-		className: triggerClassName
+		className: clsx(Menu_module_default.menuItem, classNameOverride)
 	}, /* @__PURE__ */ React$1.createElement(ListItem, {
 		as: "div",
 		role: "presentation",
@@ -4684,10 +4651,7 @@ const TabNav = ({ activeKey, onTabClick, items, tabPlacement = "horizontal", cen
 		role: "navigation",
 		"aria-label": ariaLabel,
 		className: TabNav_module_default.tabBar
-	}, /* @__PURE__ */ React$1.createElement("div", {
-		className: TabNav_module_default.tabList,
-		"aria-orientation": tabPlacement === "horizontal" ? "horizontal" : "vertical"
-	}, items.map((item) => {
+	}, /* @__PURE__ */ React$1.createElement("div", { className: TabNav_module_default.tabList }, items.map((item) => {
 		const hasSubItems = Boolean(item.subItems?.length);
 		const showDropdown = hasSubItems || item.variant === "dropdown";
 		/** Accent “active” tab styling: current route only (not merely flyout open — open + non-route stays grey). */

package/docs/core-tabnav--design.md

@@ -56,12 +56,12 @@ Tab labels should be one or two words, using title case (Tab Label). Labels shou
 
 ### Keyboard interaction
 
-| Key                          | Function                                                                                                                                                                         |
-| ---------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
-| `Tab` / `Shift + Tab`        | Moves focus into the tab list, putting focus onto the active tab. When the tab list has focus, moves focus to the next focusable element (generally within the tab panel).       |
-| `Left Arrow` / `Up Arrow`    | Moves focus to, and activate, the previous tab. If focus is on the first tab, move focus to the last tab. Up performs the same action when `aria-orientation="vertical"` is set. |
-| `Right Arrow` / `Down Arrow` | Moves focus to, and activate, the next tab. If focus is on the last tab, move focus to the first tab. Down performs the same action when `aria-orientation="vertical"` is set.   |
-| `Shift+F10`                  | Opens the menu for tabs with a dropdown.                                                                                                                                         |
+| Key                          | Function                                                                                                                                                                   |
+| ---------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| `Tab` / `Shift + Tab`        | Moves focus into the tab list, putting focus onto the active tab. When the tab list has focus, moves focus to the next focusable element (generally within the tab panel). |
+| `Left Arrow` / `Up Arrow`    | Moves focus to, and activate, the previous tab. If focus is on the first tab, move focus to the last tab. Up performs the same action when `tabPlacement="vertical"`.      |
+| `Right Arrow` / `Down Arrow` | Moves focus to, and activate, the next tab. If focus is on the last tab, move focus to the first tab. Down performs the same action when `tabPlacement="vertical"`.        |
+| `Shift+F10`                  | Opens the menu for tabs with a dropdown.                                                                                                                                   |
 
 ### ARIA considerations
 
@@ -74,4 +74,4 @@ TabNav uses link-based navigation. The following apply:
 
 ### Orientation
 
-Use `tabPlacement="horizontal"` (default) for a horizontal tab bar at the bottom, or `tabPlacement="vertical"` for a vertical tab bar on the left. Vertical tabs have `aria-orientation="vertical"` set.
+Use `tabPlacement="horizontal"` (default) for a horizontal tab bar at the bottom, or `tabPlacement="vertical"` for a vertical tab bar on the left.

package/docs/history-changelogs-capra-core--docs.md

@@ -1,5 +1,16 @@
 # History/Changelogs/@capra-core
 
+### 1.7.0
+
+#### Minor Changes
+
+* [540b651](https://bitbucket.org/cribl/capra-ui/commits/540b651): Add `onPress` event handler to `Menu.Item` and deprecate `onClick`
+
+#### Patch Changes
+
+* [540b651](https://bitbucket.org/cribl/capra-ui/commits/540b651): Fix issue where event in `Menu.Item` `onClick` was not bubbling correctly
+* [684cc26](https://bitbucket.org/cribl/capra-ui/commits/684cc26): Remove invalid `aria-orientation` attribute in TabNav component.
+
 ### 1.6.0
 
 #### Minor Changes

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@capra/core",
-  "version": "1.6.0",
+  "version": "1.7.0",
   "license": "SEE LICENSE IN LICENSE.txt",
   "type": "module",
   "description": "Core React components for the Capra design system",
@@ -44,9 +44,9 @@
     "antd": "4.24.16",
     "storybook": "^10.4.6",
     "tsdown": "^0.22.0",
-    "@capra/theme": "1.3.0",
-    "@private/linting": "0.0.0",
     "@private/building": "0.0.4",
+    "@private/linting": "0.0.0",
+    "@capra/theme": "1.3.0",
     "@private/stories": "0.0.0",
     "@private/testing": "0.0.7"
   },