@dloizides/ui-nav 1.24.0 → 1.25.0

package/CHANGELOG.md

@@ -1,5 +1,9 @@
 # Changelog
 
+## 1.25.0
+
+- `PillNav` / `PillNavMenu` get an optional `menuHeading`: a visible, non-focusable heading at the top of the open `Menu` that also names it (needs `@dloizides/ui-layout` >= 1.30.0) (KEFI-EDITOR-HEADER-1 "Compact the landing editor header").
+
 ## 1.24.0
 
 - `Topbar` gets an optional `center` slot between `left` and the actions (testID `topbar-center`); callers that do not pass it render as before (KEFI-EDITOR-HEADER-1 "Compact the landing editor header").

package/dist/index.d.mts

@@ -941,6 +941,8 @@ interface PillNavProps {
     variant?: PillNavVariant;
     /** a11y hint for the `Menu` trigger. Defaults to `regionLabel`. */
     menuHint?: string;
+    /** Visible heading at the top of the open `Menu` (e.g. "Your dashboards"); also names the menu. */
+    menuHeading?: string;
     /** testID for the `Menu` trigger. Defaults to `NAV_TEST_IDS.pillNavMenu`. */
     menuTestID?: string;
     /** Forces the `Menu` dropdown variant (default: responsive). */
@@ -948,7 +950,7 @@ interface PillNavProps {
     /** Extra container style overrides. */
     containerStyle?: ViewStyle | ViewStyle[];
 }
-declare const PillNav: ({ items, pathname, onNavigate, regionLabel, navigateHint, minItems, variant, menuHint, menuTestID, dropdownVariant, containerStyle, }: PillNavProps) => React.ReactElement | null;
+declare const PillNav: ({ items, pathname, onNavigate, regionLabel, navigateHint, minItems, variant, menuHint, menuHeading, menuTestID, dropdownVariant, containerStyle, }: PillNavProps) => React.ReactElement | null;
 
 /** The label the compact menu trigger shows: the active item's label, else `fallback`. */
 declare function resolvePillMenuLabel(items: NavItem[], pathname: string, fallback: string): string;

package/dist/index.d.ts

@@ -941,6 +941,8 @@ interface PillNavProps {
     variant?: PillNavVariant;
     /** a11y hint for the `Menu` trigger. Defaults to `regionLabel`. */
     menuHint?: string;
+    /** Visible heading at the top of the open `Menu` (e.g. "Your dashboards"); also names the menu. */
+    menuHeading?: string;
     /** testID for the `Menu` trigger. Defaults to `NAV_TEST_IDS.pillNavMenu`. */
     menuTestID?: string;
     /** Forces the `Menu` dropdown variant (default: responsive). */
@@ -948,7 +950,7 @@ interface PillNavProps {
     /** Extra container style overrides. */
     containerStyle?: ViewStyle | ViewStyle[];
 }
-declare const PillNav: ({ items, pathname, onNavigate, regionLabel, navigateHint, minItems, variant, menuHint, menuTestID, dropdownVariant, containerStyle, }: PillNavProps) => React.ReactElement | null;
+declare const PillNav: ({ items, pathname, onNavigate, regionLabel, navigateHint, minItems, variant, menuHint, menuHeading, menuTestID, dropdownVariant, containerStyle, }: PillNavProps) => React.ReactElement | null;
 
 /** The label the compact menu trigger shows: the active item's label, else `fallback`. */
 declare function resolvePillMenuLabel(items: NavItem[], pathname: string, fallback: string): string;

package/dist/index.js

@@ -1884,7 +1884,8 @@ var PillNavMenu = ({
   regionLabel,
   hint,
   testID = NAV_TEST_IDS.pillNavMenu,
-  dropdownVariant
+  dropdownVariant,
+  menuHeading
 }) => {
   const { theme } = uiFeedback.useUi();
   const primaryColor = theme.palette.primary["500"];
@@ -1900,6 +1901,7 @@ var PillNavMenu = ({
     {
       accessibilityHint: hint,
       accessibilityLabel: label,
+      menuHeading,
       menuMinWidth: PILL_MENU_MIN_WIDTH,
       optionTestID,
       options,
@@ -1932,6 +1934,7 @@ var PillNav = ({
   minItems = DEFAULT_MIN_ITEMS,
   variant = "pills" /* Pills */,
   menuHint,
+  menuHeading,
   menuTestID,
   dropdownVariant,
   containerStyle
@@ -1947,6 +1950,7 @@ var PillNav = ({
         dropdownVariant,
         hint: menuHint ?? regionLabel,
         items,
+        menuHeading,
         pathname,
         regionLabel,
         testID: menuTestID,