@usefragments/ui 1.5.4 → 1.7.0

package/dist/components/Grid/index.js

@@ -1,99 +1,79 @@
 import { jsx } from "react/jsx-runtime";
 import * as React from "react";
+import { resolveLayoutGap } from "../../utils/layout-spacing.js";
 import styles from "./Grid.module.scss.js";
 function isResponsiveColumns(columns) {
   return typeof columns === "object" && columns !== null;
 }
-const gapClasses = {
-  none: styles.gapNone,
-  xs: styles.gapXs,
-  sm: styles.gapSm,
-  md: styles.gapMd,
-  lg: styles.gapLg,
-  xl: styles.gapXl
-};
 const paddingClasses = {
   none: styles.paddingNone,
   sm: styles.paddingSm,
   md: styles.paddingMd,
   lg: styles.paddingLg
 };
-const Grid = React.forwardRef(
-  function Grid2({
-    children,
-    columns = 1,
-    minChildWidth,
-    gap = "md",
-    alignItems,
-    justifyItems,
-    padding = "none",
-    className,
-    style,
-    ...htmlProps
-  }, ref) {
-    let columnsClass;
-    let inlineStyle;
-    if (columns === "auto") {
-      columnsClass = styles.columnsAuto;
-      if (minChildWidth) {
-        inlineStyle = { "--fui-grid-min-child-width": minChildWidth };
-      }
-    } else if (isResponsiveColumns(columns)) {
-      columnsClass = styles.columnsResponsive;
-      const vars = {};
-      if (columns.base) vars["--fui-grid-cols"] = String(columns.base);
-      if (columns.sm) vars["--fui-grid-cols-sm"] = String(columns.sm);
-      if (columns.md) vars["--fui-grid-cols-md"] = String(columns.md);
-      if (columns.lg) vars["--fui-grid-cols-lg"] = String(columns.lg);
-      if (columns.xl) vars["--fui-grid-cols-xl"] = String(columns.xl);
-      inlineStyle = vars;
-    } else {
-      columnsClass = styles[`columns${columns}`];
-    }
-    if (typeof gap === "number") {
-      inlineStyle = { ...inlineStyle, gap: `var(--fui-space-${gap})` };
+const Grid = React.forwardRef(function Grid2({
+  children,
+  columns = 1,
+  minChildWidth,
+  gap = "md",
+  alignItems,
+  justifyItems,
+  padding = "none",
+  className,
+  style,
+  ...htmlProps
+}, ref) {
+  let columnsClass;
+  let inlineStyle;
+  if (columns === "auto") {
+    columnsClass = styles.columnsAuto;
+    if (minChildWidth) {
+      inlineStyle = { "--fui-grid-min-child-width": minChildWidth };
     }
-    const classes = [
-      styles.grid,
-      columnsClass,
-      typeof gap === "number" ? void 0 : gapClasses[gap],
-      paddingClasses[padding],
-      alignItems && styles[`align${cap(alignItems)}`],
-      justifyItems && styles[`justify${cap(justifyItems)}`],
-      className
-    ].filter(Boolean).join(" ");
-    const mergedStyle = inlineStyle ? { ...inlineStyle, ...style } : style;
-    return /* @__PURE__ */ jsx("div", { ...htmlProps, ref, className: classes, style: mergedStyle, children });
+  } else if (isResponsiveColumns(columns)) {
+    columnsClass = styles.columnsResponsive;
+    const vars = {};
+    if (columns.base) vars["--fui-grid-cols"] = String(columns.base);
+    if (columns.sm) vars["--fui-grid-cols-sm"] = String(columns.sm);
+    if (columns.md) vars["--fui-grid-cols-md"] = String(columns.md);
+    if (columns.lg) vars["--fui-grid-cols-lg"] = String(columns.lg);
+    if (columns.xl) vars["--fui-grid-cols-xl"] = String(columns.xl);
+    inlineStyle = vars;
+  } else {
+    columnsClass = styles[`columns${columns}`] ?? "";
   }
-);
+  inlineStyle = {
+    ...inlineStyle,
+    "--_fui-grid-gap": resolveLayoutGap(gap)
+  };
+  const classes = [
+    styles.grid,
+    columnsClass,
+    paddingClasses[padding],
+    alignItems && styles[`align${cap(alignItems)}`],
+    justifyItems && styles[`justify${cap(justifyItems)}`],
+    className
+  ].filter(Boolean).join(" ");
+  const mergedStyle = inlineStyle ? { ...inlineStyle, ...style } : style;
+  return /* @__PURE__ */ jsx("div", { ...htmlProps, ref, className: classes, style: mergedStyle, children });
+});
 const subgridClasses = {
   rows: styles.subgridRows,
   columns: styles.subgridColumns,
   both: styles.subgridBoth
 };
-const GridItem = React.forwardRef(
-  function GridItem2({
-    children,
-    colSpan,
-    rowSpan,
-    alignSelf,
-    subgrid,
-    className,
-    style,
-    ...htmlProps
-  }, ref) {
-    const subgridClass = subgrid ? subgridClasses[subgrid === true ? "rows" : subgrid] : void 0;
-    const classes = [
-      styles.item,
-      colSpan && (colSpan === "full" ? styles.colSpanFull : styles[`colSpan${colSpan}`]),
-      rowSpan && styles[`rowSpan${rowSpan}`],
-      alignSelf && styles[`selfAlign${cap(alignSelf)}`],
-      subgridClass,
-      className
-    ].filter(Boolean).join(" ");
-    return /* @__PURE__ */ jsx("div", { ...htmlProps, ref, className: classes, style, children });
-  }
-);
+const GridItem = React.forwardRef(function GridItem2({ children, colSpan, rowSpan, alignSelf, subgrid, className, style, ...htmlProps }, ref) {
+  const subgridClass = subgrid ? subgridClasses[subgrid === true ? "rows" : subgrid] : void 0;
+  const classes = [
+    styles.item,
+    colSpan && (colSpan === "full" ? styles.colSpanFull : styles[`colSpan${colSpan}`]),
+    rowSpan && styles[`rowSpan${rowSpan}`],
+    alignSelf && styles[`selfAlign${cap(alignSelf)}`],
+    subgridClass,
+    className
+  ].filter(Boolean).join(" ");
+  return /* @__PURE__ */ jsx("div", { ...htmlProps, ref, className: classes, style, children });
+});
 function cap(s) {
   return s.charAt(0).toUpperCase() + s.slice(1);
 }

package/dist/components/Header/Header.module.scss.cjs

@@ -1,38 +1,38 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const header = "_header_hge7p_1";
-const fixed = "_fixed_hge7p_13";
-const sticky = "_sticky_hge7p_20";
-const elevatedOnScroll = "_elevatedOnScroll_hge7p_25";
-const scrolled = "_scrolled_hge7p_30";
-const containerPage = "_containerPage_hge7p_34";
-const container = "_container_hge7p_34";
-const navCentered = "_navCentered_hge7p_55";
-const nav = "_nav_hge7p_55";
-const brand = "_brand_hge7p_67";
-const navList = "_navList_hge7p_95";
-const navItem = "_navItem_hge7p_104";
-const navItemActive = "_navItemActive_hge7p_152";
-const navMenuTrigger = "_navMenuTrigger_hge7p_166";
-const navMenuChevron = "_navMenuChevron_hge7p_171";
-const navMenuPositioner = "_navMenuPositioner_hge7p_179";
-const navMenuPopup = "_navMenuPopup_hge7p_184";
-const navMenuItem = "_navMenuItem_hge7p_205";
-const navMenuItemActive = "_navMenuItemActive_hge7p_241";
-const search = "_search_hge7p_263";
-const searchExpandable = "_searchExpandable_hge7p_273";
-const actions = "_actions_hge7p_277";
-const trigger = "_trigger_hge7p_284";
-const spacer = "_spacer_hge7p_326";
-const mobileNavBackdrop = "_mobileNavBackdrop_hge7p_330";
-const mobileNavDrawer = "_mobileNavDrawer_hge7p_338";
-const mobileNavHeader = "_mobileNavHeader_hge7p_352";
-const mobileNavClose = "_mobileNavClose_hge7p_360";
-const mobileNavBody = "_mobileNavBody_hge7p_398";
-const mobileNavLink = "_mobileNavLink_hge7p_404";
-const mobileNavLinkActive = "_mobileNavLinkActive_hge7p_438";
-const mobileNavActions = "_mobileNavActions_hge7p_443";
-const skipLink = "_skipLink_hge7p_472";
+const header = "_header_1ppet_1";
+const fixed = "_fixed_1ppet_29";
+const sticky = "_sticky_1ppet_36";
+const elevatedOnScroll = "_elevatedOnScroll_1ppet_41";
+const scrolled = "_scrolled_1ppet_46";
+const containerPage = "_containerPage_1ppet_50";
+const container = "_container_1ppet_50";
+const navCentered = "_navCentered_1ppet_71";
+const nav = "_nav_1ppet_71";
+const brand = "_brand_1ppet_83";
+const navList = "_navList_1ppet_111";
+const navItem = "_navItem_1ppet_120";
+const navItemActive = "_navItemActive_1ppet_183";
+const navMenuTrigger = "_navMenuTrigger_1ppet_193";
+const navMenuChevron = "_navMenuChevron_1ppet_198";
+const navMenuPositioner = "_navMenuPositioner_1ppet_206";
+const navMenuPopup = "_navMenuPopup_1ppet_211";
+const navMenuItem = "_navMenuItem_1ppet_260";
+const navMenuItemActive = "_navMenuItemActive_1ppet_304";
+const search = "_search_1ppet_326";
+const searchExpandable = "_searchExpandable_1ppet_338";
+const actions = "_actions_1ppet_342";
+const trigger = "_trigger_1ppet_349";
+const spacer = "_spacer_1ppet_417";
+const mobileNavBackdrop = "_mobileNavBackdrop_1ppet_421";
+const mobileNavDrawer = "_mobileNavDrawer_1ppet_429";
+const mobileNavHeader = "_mobileNavHeader_1ppet_443";
+const mobileNavClose = "_mobileNavClose_1ppet_451";
+const mobileNavBody = "_mobileNavBody_1ppet_514";
+const mobileNavLink = "_mobileNavLink_1ppet_520";
+const mobileNavLinkActive = "_mobileNavLinkActive_1ppet_573";
+const mobileNavActions = "_mobileNavActions_1ppet_578";
+const skipLink = "_skipLink_1ppet_607";
 const styles = {
   header,
   fixed,

package/dist/components/Header/Header.module.scss.js

@@ -1,36 +1,36 @@
-const header = "_header_hge7p_1";
-const fixed = "_fixed_hge7p_13";
-const sticky = "_sticky_hge7p_20";
-const elevatedOnScroll = "_elevatedOnScroll_hge7p_25";
-const scrolled = "_scrolled_hge7p_30";
-const containerPage = "_containerPage_hge7p_34";
-const container = "_container_hge7p_34";
-const navCentered = "_navCentered_hge7p_55";
-const nav = "_nav_hge7p_55";
-const brand = "_brand_hge7p_67";
-const navList = "_navList_hge7p_95";
-const navItem = "_navItem_hge7p_104";
-const navItemActive = "_navItemActive_hge7p_152";
-const navMenuTrigger = "_navMenuTrigger_hge7p_166";
-const navMenuChevron = "_navMenuChevron_hge7p_171";
-const navMenuPositioner = "_navMenuPositioner_hge7p_179";
-const navMenuPopup = "_navMenuPopup_hge7p_184";
-const navMenuItem = "_navMenuItem_hge7p_205";
-const navMenuItemActive = "_navMenuItemActive_hge7p_241";
-const search = "_search_hge7p_263";
-const searchExpandable = "_searchExpandable_hge7p_273";
-const actions = "_actions_hge7p_277";
-const trigger = "_trigger_hge7p_284";
-const spacer = "_spacer_hge7p_326";
-const mobileNavBackdrop = "_mobileNavBackdrop_hge7p_330";
-const mobileNavDrawer = "_mobileNavDrawer_hge7p_338";
-const mobileNavHeader = "_mobileNavHeader_hge7p_352";
-const mobileNavClose = "_mobileNavClose_hge7p_360";
-const mobileNavBody = "_mobileNavBody_hge7p_398";
-const mobileNavLink = "_mobileNavLink_hge7p_404";
-const mobileNavLinkActive = "_mobileNavLinkActive_hge7p_438";
-const mobileNavActions = "_mobileNavActions_hge7p_443";
-const skipLink = "_skipLink_hge7p_472";
+const header = "_header_1ppet_1";
+const fixed = "_fixed_1ppet_29";
+const sticky = "_sticky_1ppet_36";
+const elevatedOnScroll = "_elevatedOnScroll_1ppet_41";
+const scrolled = "_scrolled_1ppet_46";
+const containerPage = "_containerPage_1ppet_50";
+const container = "_container_1ppet_50";
+const navCentered = "_navCentered_1ppet_71";
+const nav = "_nav_1ppet_71";
+const brand = "_brand_1ppet_83";
+const navList = "_navList_1ppet_111";
+const navItem = "_navItem_1ppet_120";
+const navItemActive = "_navItemActive_1ppet_183";
+const navMenuTrigger = "_navMenuTrigger_1ppet_193";
+const navMenuChevron = "_navMenuChevron_1ppet_198";
+const navMenuPositioner = "_navMenuPositioner_1ppet_206";
+const navMenuPopup = "_navMenuPopup_1ppet_211";
+const navMenuItem = "_navMenuItem_1ppet_260";
+const navMenuItemActive = "_navMenuItemActive_1ppet_304";
+const search = "_search_1ppet_326";
+const searchExpandable = "_searchExpandable_1ppet_338";
+const actions = "_actions_1ppet_342";
+const trigger = "_trigger_1ppet_349";
+const spacer = "_spacer_1ppet_417";
+const mobileNavBackdrop = "_mobileNavBackdrop_1ppet_421";
+const mobileNavDrawer = "_mobileNavDrawer_1ppet_429";
+const mobileNavHeader = "_mobileNavHeader_1ppet_443";
+const mobileNavClose = "_mobileNavClose_1ppet_451";
+const mobileNavBody = "_mobileNavBody_1ppet_514";
+const mobileNavLink = "_mobileNavLink_1ppet_520";
+const mobileNavLinkActive = "_mobileNavLinkActive_1ppet_573";
+const mobileNavActions = "_mobileNavActions_1ppet_578";
+const skipLink = "_skipLink_1ppet_607";
 const styles = {
   header,
   fixed,

package/dist/components/Header/index.cjs

@@ -10,6 +10,7 @@ const a11y = require("../../utils/a11y.cjs");
 const index$1 = require("../ScrollArea/index.cjs");
 const Header_module = require("./Header.module.scss.cjs");
 const index = require("../Sidebar/index.cjs");
+const popup = require("../../recipes/popup.cjs");
 function _interopNamespaceDefault(e) {
   const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
   if (e) {
@@ -156,11 +157,7 @@ function HeaderNavItem({
   className,
   ...htmlProps
 }) {
-  const classes = [
-    Header_module.default.navItem,
-    active && Header_module.default.navItemActive,
-    className
-  ].filter(Boolean).join(" ");
+  const classes = [Header_module.default.navItem, active && Header_module.default.navItemActive, className].filter(Boolean).join(" ");
   const itemProps = {
     className: classes,
     onClick,
@@ -187,11 +184,7 @@ function HeaderSearch({
   className,
   ...htmlProps
 }) {
-  const classes = [
-    Header_module.default.search,
-    expandable && Header_module.default.searchExpandable,
-    className
-  ].filter(Boolean).join(" ");
+  const classes = [Header_module.default.search, expandable && Header_module.default.searchExpandable, className].filter(Boolean).join(" ");
   return /* @__PURE__ */ jsxRuntime.jsx("div", { ...htmlProps, className: classes, children });
 }
 function HeaderActions({ children, className, ...htmlProps }) {
@@ -261,7 +254,16 @@ function HeaderNavMenu({
       label,
       chevronIcon ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: Header_module.default.navMenuChevron, "aria-hidden": true, children: chevronIcon }) : /* @__PURE__ */ jsxRuntime.jsx(react.CaretDown, { size: 12, className: Header_module.default.navMenuChevron, "aria-hidden": true })
     ] }),
-    /* @__PURE__ */ jsxRuntime.jsx(menu.Menu.Portal, { children: /* @__PURE__ */ jsxRuntime.jsx(menu.Menu.Positioner, { side: "bottom", align: "start", sideOffset: 4, className: Header_module.default.navMenuPositioner, children: /* @__PURE__ */ jsxRuntime.jsx(menu.Menu.Popup, { className: Header_module.default.navMenuPopup, children }) }) })
+    /* @__PURE__ */ jsxRuntime.jsx(menu.Menu.Portal, { children: /* @__PURE__ */ jsxRuntime.jsx(
+      menu.Menu.Positioner,
+      {
+        side: "bottom",
+        align: "start",
+        sideOffset: popup.POPUP_OFFSET_PX,
+        className: Header_module.default.navMenuPositioner,
+        children: /* @__PURE__ */ jsxRuntime.jsx(menu.Menu.Popup, { className: Header_module.default.navMenuPopup, children })
+      }
+    ) })
   ] }) });
 }
 function HeaderNavMenuItem({
@@ -272,20 +274,9 @@ function HeaderNavMenuItem({
   className,
   ...htmlProps
 }) {
-  const classes = [
-    Header_module.default.navMenuItem,
-    active && Header_module.default.navMenuItemActive,
-    className
-  ].filter(Boolean).join(" ");
+  const classes = [Header_module.default.navMenuItem, active && Header_module.default.navMenuItemActive, className].filter(Boolean).join(" ");
   if (asChild && React__namespace.isValidElement(children)) {
-    return /* @__PURE__ */ jsxRuntime.jsx(
-      menu.Menu.Item,
-      {
-        ...htmlProps,
-        className: classes,
-        render: children
-      }
-    );
+    return /* @__PURE__ */ jsxRuntime.jsx(menu.Menu.Item, { ...htmlProps, className: classes, render: children });
   }
   if (href) {
     return /* @__PURE__ */ jsxRuntime.jsx(menu.Menu.Item, { ...htmlProps, className: classes, render: /* @__PURE__ */ jsxRuntime.jsx("a", { href }), children });
@@ -318,14 +309,7 @@ function HeaderMobileNav({ children, className }) {
     open: true
   });
   const drawerContent = /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-    /* @__PURE__ */ jsxRuntime.jsx(
-      "div",
-      {
-        className: Header_module.default.mobileNavBackdrop,
-        onClick: () => setMobileOpen(false),
-        "aria-hidden": true
-      }
-    ),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: Header_module.default.mobileNavBackdrop, onClick: () => setMobileOpen(false), "aria-hidden": true }),
     /* @__PURE__ */ jsxRuntime.jsxs(
       "div",
       {
@@ -345,7 +329,7 @@ function HeaderMobileNav({ children, className }) {
               children: closeIcon ?? /* @__PURE__ */ jsxRuntime.jsx(react.X, { size: 20, "aria-hidden": true })
             }
           ) }),
-          /* @__PURE__ */ jsxRuntime.jsx(index$1.ScrollArea, { orientation: "vertical", className: Header_module.default.mobileNavBody, children })
+          /* @__PURE__ */ jsxRuntime.jsx(index$1.ScrollArea, { orientation: "vertical", showFades: true, className: Header_module.default.mobileNavBody, children })
         ]
       }
     )
@@ -362,11 +346,7 @@ function HeaderMobileNavLink({
   ...htmlProps
 }) {
   const { setMobileOpen } = useHeaderContext();
-  const classes = [
-    Header_module.default.mobileNavLink,
-    active && Header_module.default.mobileNavLinkActive,
-    className
-  ].filter(Boolean).join(" ");
+  const classes = [Header_module.default.mobileNavLink, active && Header_module.default.mobileNavLinkActive, className].filter(Boolean).join(" ");
   const handleClick = (e) => {
     onClick == null ? void 0 : onClick(e);
     if (!e.defaultPrevented) setMobileOpen(false);

package/dist/components/Header/index.d.ts

@@ -1,13 +1,13 @@
-import * as React from 'react';
+import * as React from "react";
 export interface HeaderIconRenderState {
-    slot: 'menu' | 'close' | 'navMenuChevron' | 'mobileClose';
+    slot: "menu" | "close" | "navMenuChevron" | "mobileClose";
     open?: boolean;
     active?: boolean;
 }
 export type HeaderIconSlot = React.ReactNode | ((state: HeaderIconRenderState) => React.ReactNode);
-export type HeaderIcons = Partial<Record<HeaderIconRenderState['slot'], HeaderIconSlot>>;
-export type HeaderNavAlign = 'start' | 'center';
-export type HeaderContainer = 'full' | 'page';
+export type HeaderIcons = Partial<Record<HeaderIconRenderState["slot"], HeaderIconSlot>>;
+export type HeaderNavAlign = "start" | "center";
+export type HeaderContainer = "full" | "page";
 export interface HeaderElevatedOnScrollOptions {
     /** Scroll offset before the elevated surface is applied */
     threshold?: number;
@@ -17,7 +17,7 @@ export interface HeaderProps extends React.HTMLAttributes<HTMLElement> {
     /** Header height (default: '56px') */
     height?: string;
     /** Position behavior */
-    position?: 'static' | 'fixed' | 'sticky';
+    position?: "static" | "fixed" | "sticky";
     /** Apply the elevated header surface after scroll */
     elevatedOnScroll?: boolean | HeaderElevatedOnScrollOptions;
     /** Navigation alignment inside the header */
@@ -37,14 +37,18 @@ export interface HeaderBrandProps extends React.HTMLAttributes<HTMLElement> {
 export interface HeaderNavProps extends React.HTMLAttributes<HTMLElement> {
     children: React.ReactNode;
     /** Accessible label for navigation */
-    'aria-label'?: string;
+    "aria-label"?: string;
 }
-export interface HeaderNavItemProps extends Omit<React.HTMLAttributes<HTMLElement>, 'onClick'> {
+export interface HeaderNavItemProps extends Omit<React.HTMLAttributes<HTMLElement>, "onClick"> {
     children: React.ReactNode;
     /** Whether this item is active/current */
     active?: boolean;
     /** Link destination */
     href?: string;
+    /** Anchor target, when `href` renders an anchor */
+    target?: React.AnchorHTMLAttributes<HTMLAnchorElement>["target"];
+    /** Anchor rel, when `href` renders an anchor */
+    rel?: React.AnchorHTMLAttributes<HTMLAnchorElement>["rel"];
     /** Render as child element (polymorphic) */
     asChild?: boolean;
     /** Click handler */
@@ -62,7 +66,7 @@ export interface HeaderTriggerProps extends React.ButtonHTMLAttributes<HTMLButto
     /** Custom trigger content */
     children?: React.ReactNode;
     /** Accessible label */
-    'aria-label'?: string;
+    "aria-label"?: string;
 }
 export interface HeaderNavMenuProps extends React.HTMLAttributes<HTMLLIElement> {
     /** Trigger label text */
@@ -100,7 +104,7 @@ declare function HeaderBrand({ children, href, asChild, className, ...htmlProps
 /**
  * Header.Nav - Navigation container (hidden on mobile)
  */
-declare function HeaderNav({ children, 'aria-label': ariaLabel, className, ...htmlProps }: HeaderNavProps): import("react/jsx-runtime").JSX.Element;
+declare function HeaderNav({ children, "aria-label": ariaLabel, className, ...htmlProps }: HeaderNavProps): import("react/jsx-runtime").JSX.Element;
 /**
  * Header.NavItem - Navigation link
  */
@@ -120,7 +124,7 @@ declare function HeaderActions({ children, className, ...htmlProps }: HeaderActi
  * 1. With SidebarProvider — toggles sidebar open state (existing behavior)
  * 2. Standalone — toggles Header's internal mobile nav drawer
  */
-declare function HeaderTrigger({ children, 'aria-label': ariaLabel, className, onClick, ...htmlProps }: HeaderTriggerProps): import("react/jsx-runtime").JSX.Element | null;
+declare function HeaderTrigger({ children, "aria-label": ariaLabel, className, onClick, ...htmlProps }: HeaderTriggerProps): import("react/jsx-runtime").JSX.Element | null;
 /**
  * Header.Spacer - Flexible spacer to push items apart
  */

package/dist/components/Header/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Header/index.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Header/index.tsx"],"names":[],"mappings":"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"}

package/dist/components/Header/index.js

@@ -8,6 +8,7 @@ import { useFocusTrap } from "../../utils/a11y.js";
 import { ScrollArea } from "../ScrollArea/index.js";
 import styles from "./Header.module.scss.js";
 import { useSidebar } from "../Sidebar/index.js";
+import { POPUP_OFFSET_PX } from "../../recipes/popup.js";
 const HeaderContext = React.createContext(null);
 function useHeaderContext() {
   const ctx = React.useContext(HeaderContext);
@@ -137,11 +138,7 @@ function HeaderNavItem({
   className,
   ...htmlProps
 }) {
-  const classes = [
-    styles.navItem,
-    active && styles.navItemActive,
-    className
-  ].filter(Boolean).join(" ");
+  const classes = [styles.navItem, active && styles.navItemActive, className].filter(Boolean).join(" ");
   const itemProps = {
     className: classes,
     onClick,
@@ -168,11 +165,7 @@ function HeaderSearch({
   className,
   ...htmlProps
 }) {
-  const classes = [
-    styles.search,
-    expandable && styles.searchExpandable,
-    className
-  ].filter(Boolean).join(" ");
+  const classes = [styles.search, expandable && styles.searchExpandable, className].filter(Boolean).join(" ");
   return /* @__PURE__ */ jsx("div", { ...htmlProps, className: classes, children });
 }
 function HeaderActions({ children, className, ...htmlProps }) {
@@ -242,7 +235,16 @@ function HeaderNavMenu({
       label,
       chevronIcon ? /* @__PURE__ */ jsx("span", { className: styles.navMenuChevron, "aria-hidden": true, children: chevronIcon }) : /* @__PURE__ */ jsx(CaretDown, { size: 12, className: styles.navMenuChevron, "aria-hidden": true })
     ] }),
-    /* @__PURE__ */ jsx(Menu.Portal, { children: /* @__PURE__ */ jsx(Menu.Positioner, { side: "bottom", align: "start", sideOffset: 4, className: styles.navMenuPositioner, children: /* @__PURE__ */ jsx(Menu.Popup, { className: styles.navMenuPopup, children }) }) })
+    /* @__PURE__ */ jsx(Menu.Portal, { children: /* @__PURE__ */ jsx(
+      Menu.Positioner,
+      {
+        side: "bottom",
+        align: "start",
+        sideOffset: POPUP_OFFSET_PX,
+        className: styles.navMenuPositioner,
+        children: /* @__PURE__ */ jsx(Menu.Popup, { className: styles.navMenuPopup, children })
+      }
+    ) })
   ] }) });
 }
 function HeaderNavMenuItem({
@@ -253,20 +255,9 @@ function HeaderNavMenuItem({
   className,
   ...htmlProps
 }) {
-  const classes = [
-    styles.navMenuItem,
-    active && styles.navMenuItemActive,
-    className
-  ].filter(Boolean).join(" ");
+  const classes = [styles.navMenuItem, active && styles.navMenuItemActive, className].filter(Boolean).join(" ");
   if (asChild && React.isValidElement(children)) {
-    return /* @__PURE__ */ jsx(
-      Menu.Item,
-      {
-        ...htmlProps,
-        className: classes,
-        render: children
-      }
-    );
+    return /* @__PURE__ */ jsx(Menu.Item, { ...htmlProps, className: classes, render: children });
   }
   if (href) {
     return /* @__PURE__ */ jsx(Menu.Item, { ...htmlProps, className: classes, render: /* @__PURE__ */ jsx("a", { href }), children });
@@ -299,14 +290,7 @@ function HeaderMobileNav({ children, className }) {
     open: true
   });
   const drawerContent = /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(
-      "div",
-      {
-        className: styles.mobileNavBackdrop,
-        onClick: () => setMobileOpen(false),
-        "aria-hidden": true
-      }
-    ),
+    /* @__PURE__ */ jsx("div", { className: styles.mobileNavBackdrop, onClick: () => setMobileOpen(false), "aria-hidden": true }),
     /* @__PURE__ */ jsxs(
       "div",
       {
@@ -326,7 +310,7 @@ function HeaderMobileNav({ children, className }) {
               children: closeIcon ?? /* @__PURE__ */ jsx(X, { size: 20, "aria-hidden": true })
             }
           ) }),
-          /* @__PURE__ */ jsx(ScrollArea, { orientation: "vertical", className: styles.mobileNavBody, children })
+          /* @__PURE__ */ jsx(ScrollArea, { orientation: "vertical", showFades: true, className: styles.mobileNavBody, children })
         ]
       }
     )
@@ -343,11 +327,7 @@ function HeaderMobileNavLink({
   ...htmlProps
 }) {
   const { setMobileOpen } = useHeaderContext();
-  const classes = [
-    styles.mobileNavLink,
-    active && styles.mobileNavLinkActive,
-    className
-  ].filter(Boolean).join(" ");
+  const classes = [styles.mobileNavLink, active && styles.mobileNavLinkActive, className].filter(Boolean).join(" ");
   const handleClick = (e) => {
     onClick == null ? void 0 : onClick(e);
     if (!e.defaultPrevented) setMobileOpen(false);