@homebound/beam 2.349.1 → 2.350.0

package/dist/components/Tabs.d.ts

@@ -1,5 +1,5 @@
 import { ReactNode } from "react";
-import type { IconKey } from "./";
+import { IconKey } from "./";
 import { Margin, Only, Padding, Xss } from "../Css";
 import { AnyObject } from "../types";
 export interface Tab<V extends string = string> {
@@ -7,7 +7,8 @@ export interface Tab<V extends string = string> {
     value: V;
     icon?: IconKey;
     endAdornment?: ReactNode;
-    disabled?: boolean;
+    /** Whether the Tab is disabled. If a ReactNode, it's treated as a "disabled reason" that's shown in a tooltip. */
+    disabled?: boolean | ReactNode;
 }
 type TabsContentXss = Xss<Margin | Padding | "backgroundColor">;
 export interface TabsProps<V extends string, X> {

package/dist/components/Tabs.js

@@ -88,7 +88,8 @@ function Tabs(props) {
 exports.Tabs = Tabs;
 function TabImpl(props) {
     const { tab, onClick, active, onKeyUp, onBlur, focusProps, isFocusVisible = false, ...others } = props;
-    const { disabled: isDisabled = false, name: label, icon, endAdornment } = tab;
+    const { disabled = false, name: label, icon, endAdornment } = tab;
+    const isDisabled = !!disabled;
     const { hoverProps, isHovered } = (0, react_aria_1.useHover)({ isDisabled });
     const { baseStyles, activeStyles, focusRingStyles, hoverStyles, disabledStyles, activeHoverStyles } = (0, react_1.useMemo)(() => getTabStyles(), []);
     const uniqueValue = uniqueTabValue(tab);
@@ -115,7 +116,11 @@ function TabImpl(props) {
         ...(isRouteTab(tab) ? {} : { onClick: () => onClick(tab.value) }),
     });
     const tabLabel = ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [label, (icon || endAdornment) && (0, jsx_runtime_1.jsx)("span", { css: Css_1.Css.ml1.$, children: icon ? (0, jsx_runtime_1.jsx)(Icon_1.Icon, { icon: icon }) : endAdornment })] }));
-    return isDisabled ? ((0, jsx_runtime_1.jsx)("div", { ...tabProps, children: tabLabel })) : isRouteTab(tab) ? ((0, jsx_runtime_1.jsx)(react_router_dom_1.Link, { ...{ ...tabProps, ...interactiveProps }, className: "navLink", to: tab.href, children: tabLabel })) : ((0, jsx_runtime_1.jsx)("button", { ...{ ...tabProps, ...interactiveProps }, children: tabLabel }));
+    return isDisabled ? ((0, components_1.maybeTooltip)({
+        title: (0, components_1.resolveTooltip)(disabled),
+        placement: "top",
+        children: (0, jsx_runtime_1.jsx)("div", { ...tabProps, children: tabLabel }),
+    })) : isRouteTab(tab) ? ((0, jsx_runtime_1.jsx)(react_router_dom_1.Link, { ...{ ...tabProps, ...interactiveProps }, className: "navLink", to: tab.href, children: tabLabel })) : ((0, jsx_runtime_1.jsx)("button", { ...{ ...tabProps, ...interactiveProps }, children: tabLabel }));
 }
 function getTabStyles() {
     const borderBottomWidthPx = 4;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@homebound/beam",
-  "version": "2.349.1",
+  "version": "2.350.0",
   "author": "Homebound",
   "license": "MIT",
   "main": "dist/index.js",