react-native-terra-ui 0.11.10 → 0.11.12

package/lib/module/components/header/variants/LargeTitleHeader/parts/LargeTitleContent.js

@@ -0,0 +1,72 @@
+"use strict";
+
+import { Text } from "react-native-unistyles/components/native/Text";
+import Animated from "react-native-reanimated";
+import { StyleSheet, useUnistyles } from "react-native-unistyles";
+import { FONT_WEIGHT_VALUE } from "../../../../../utils/typography.js";
+import { isTextTitle } from "../../../utils.js";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export function LargeTitleContent({
+  title,
+  overline,
+  subtitle,
+  hasAccessoryBelow,
+  onHeightChange,
+  animatedStyle
+}) {
+  const {
+    theme
+  } = useUnistyles();
+  // Layout height excludes the collapse transform.
+  const handleLayout = event => onHeightChange?.(event.nativeEvent.layout.height);
+  return /*#__PURE__*/_jsxs(Animated.View, {
+    style: [styles.portalContent(hasAccessoryBelow), animatedStyle],
+    onLayout: handleLayout,
+    children: [!!overline && /*#__PURE__*/_jsx(Text, {
+      style: styles.overline,
+      maxFontSizeMultiplier: theme.typography.variants["label-sm"].maxFontSizeMultiplier,
+      children: overline
+    }), isTextTitle(title) ? /*#__PURE__*/_jsx(Text, {
+      style: styles.largeTitle,
+      maxFontSizeMultiplier: theme.typography.variants["headline-lg"].maxFontSizeMultiplier,
+      children: title
+    }) : title, !!subtitle && /*#__PURE__*/_jsx(Text, {
+      style: styles.subtitle,
+      maxFontSizeMultiplier: theme.typography.variants["body-lg"].maxFontSizeMultiplier,
+      children: subtitle
+    })]
+  });
+}
+const styles = StyleSheet.create(theme => ({
+  portalContent: hasAccessoryBelow => ({
+    gap: theme.spacing["1"] / 2,
+    // Include the gap in the measured height used to position the accessory.
+    paddingBottom: hasAccessoryBelow ? theme.spacing["2"] : 0,
+    paddingHorizontal: theme.layout.screen.padding.x,
+    uni__dependencies: [0]
+  }),
+  overline: {
+    fontSize: theme.typography.variants["label-sm"].fontSize,
+    lineHeight: theme.typography.variants["label-sm"].lineHeight,
+    letterSpacing: theme.typography.variants["label-sm"].letterSpacing,
+    fontWeight: FONT_WEIGHT_VALUE[theme.typography.variants["label-sm"].fontWeight],
+    color: theme.color["text.tertiary"] ?? "",
+    uni__dependencies: [0]
+  },
+  largeTitle: {
+    fontSize: theme.typography.variants["headline-lg"].fontSize,
+    lineHeight: theme.typography.variants["headline-lg"].lineHeight,
+    letterSpacing: theme.typography.variants["headline-lg"].letterSpacing,
+    fontWeight: FONT_WEIGHT_VALUE[theme.typography.variants["headline-lg"].fontWeight],
+    color: theme.color["text.primary"] ?? "",
+    uni__dependencies: [0]
+  },
+  subtitle: {
+    fontSize: theme.typography.variants["body-lg"].fontSize,
+    lineHeight: theme.typography.variants["body-lg"].lineHeight,
+    letterSpacing: theme.typography.variants["body-lg"].letterSpacing,
+    color: theme.color["text.tertiary"] ?? "",
+    uni__dependencies: [0]
+  }
+}));
+//# sourceMappingURL=LargeTitleContent.js.map

package/lib/module/components/header/variants/LargeTitleHeader/parts/LargeTitleContent.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["Animated","StyleSheet","useUnistyles","FONT_WEIGHT_VALUE","isTextTitle","jsx","_jsx","jsxs","_jsxs","LargeTitleContent","title","overline","subtitle","hasAccessoryBelow","onHeightChange","animatedStyle","theme","handleLayout","event","nativeEvent","layout","height","View","style","styles","portalContent","onLayout","children","Text","maxFontSizeMultiplier","typography","variants","largeTitle","create","gap","spacing","paddingBottom","paddingHorizontal","screen","padding","x","uni__dependencies","fontSize","lineHeight","letterSpacing","fontWeight","color"],"sourceRoot":"../../../../../../../src","sources":["components/header/variants/LargeTitleHeader/parts/LargeTitleContent.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/components/header/variants/TitleHeader/index.js

@@ -1,36 +1,15 @@
 "use strict";
 
 import { View } from "react-native-unistyles/components/native/View";
-import { Text } from "react-native-unistyles/components/native/Text";
-import { useCallback, useContext } from "react";
-import { StyleSheet, useUnistyles } from "react-native-unistyles";
-import { resolveThemeColor } from "../../../../utils/resolve-theme-color.js";
-import { FONT_WEIGHT_VALUE } from "../../../../utils/typography.js";
+import { useContext } from "react";
+import { StyleSheet } from "react-native-unistyles";
 import { useHeaderBackground } from "../../../screen/parts/ScreenHeaderAppearance.js";
 import { ScreenContext } from "../../../screen/ScreenContext.js";
-import { Toolbar } from "../../../toolbar/index.js";
-import { HeaderDismissButton } from "../../header-buttons.js";
+import { useHeaderColor } from "../../hooks/use-header-color.js";
 import { HeaderAccessory } from "../../parts/HeaderAccessory.js";
-import { HeaderSurface } from "../../parts/HeaderSurface.js";
-import { isCustomTitle, isTextTitle } from "../../utils.js";
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-/**
- * Compact title bar (leading slot · title · trailing slot) with a top safe-area
- * inset outside Screen. Within Screen, the root owns safe-area clearance. The inline counterpart to `Header.LargeTitle`; use it for screens that
- * don't need a collapsing large title.
- *
- * @example
- * ```tsx
- * <Screen.Header>
- *   <Header.Title
- *     title="Stats"
- *     trailingActions={
- *       <Toolbar.Button icon="add" accessibilityLabel="Add" onPress={add} />
- *     }
- *   />
- * </Screen.Header>
- * ```
- */
+import { HeaderBar } from "../../parts/HeaderBar.js";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/** Compact header. Screen owns the safe area when present; standalone headers reserve it here. */
 export function TitleHeader({
   title,
   leadingActions,
@@ -39,79 +18,34 @@ export function TitleHeader({
   RightToolbar,
   accessory,
   accessoryPadding = "x",
-  dismissAction = "none",
-  navigation,
-  onDismiss,
   titleAlignment = "center",
   background,
-  bg
+  bg,
+  ...dismissProps
 }) {
-  const {
-    theme
-  } = useUnistyles();
   const screen = useContext(ScreenContext);
-  const colorToken = background ?? bg;
-  const bgColor = (colorToken ? resolveThemeColor(colorToken, theme) : screen?.background) ?? theme.color["surface.canvas"];
-  useHeaderBackground(bgColor);
-  const leadingContent = leadingActions !== undefined ? leadingActions : LeftToolbar;
-  const trailingContent = trailingActions !== undefined ? trailingActions : RightToolbar;
-  const setAccessoryInset = screen?.setHeaderAccessoryHeight;
-  // Compact headers always reserve the accessory height as top padding.
-  const handleAccessoryHeightChange = useCallback(height => setAccessoryInset?.(height), [setAccessoryInset]);
-  const isTransparent = bgColor === "transparent";
-  const gradientColor = bgColor;
-  const _styles = styles;
-  {
-    const styles = _styles.useVariants({
-      titleAlignment
-    });
-    const leading = dismissAction === "back" ? /*#__PURE__*/_jsxs(_Fragment, {
-      children: [/*#__PURE__*/_jsx(HeaderDismissButton, {
-        dismissAction: dismissAction,
-        navigation: navigation,
-        onDismiss: onDismiss
-      }), leadingContent]
-    }) : leadingContent;
-    const trailing = dismissAction === "close" ? /*#__PURE__*/_jsxs(_Fragment, {
-      children: [trailingContent, /*#__PURE__*/_jsx(HeaderDismissButton, {
-        dismissAction: dismissAction,
-        navigation: navigation,
-        onDismiss: onDismiss
-      })]
-    }) : trailingContent;
-    return /*#__PURE__*/_jsxs(View, {
-      style: styles.container,
-      children: [/*#__PURE__*/_jsx(View, {
-        style: styles.safeArea(isTransparent, bgColor, screen !== null)
-      }), /*#__PURE__*/_jsxs(View, {
-        style: styles.barGroup,
-        children: [/*#__PURE__*/_jsx(HeaderSurface, {
-          color: gradientColor
-        }), /*#__PURE__*/_jsxs(View, {
-          style: styles.bar,
-          children: [leading != null && /*#__PURE__*/_jsx(Toolbar, {
-            children: leading
-          }), /*#__PURE__*/_jsx(View, {
-            style: styles.titleContainer,
-            pointerEvents: isCustomTitle(title) ? "box-none" : "none",
-            children: isTextTitle(title) ? String(title).trim().length > 0 && /*#__PURE__*/_jsx(Text, {
-              style: styles.title,
-              children: title
-            }) : title
-          }), trailing != null && /*#__PURE__*/_jsx(Toolbar, {
-            style: styles.trailing,
-            children: trailing
-          })]
-        }), accessory != null && /*#__PURE__*/_jsx(HeaderAccessory, {
-          padding: accessoryPadding,
-          onHeightChange: handleAccessoryHeightChange,
-          children: accessory
-        })]
-      })]
-    });
-  }
+  const color = useHeaderColor(background ?? bg);
+  useHeaderBackground(color);
+  return /*#__PURE__*/_jsxs(View, {
+    style: styles.container,
+    children: [/*#__PURE__*/_jsx(View, {
+      style: styles.safeArea(color, screen !== null)
+    }), /*#__PURE__*/_jsx(HeaderBar, {
+      ...dismissProps,
+      title: title,
+      titleAlignment: titleAlignment,
+      color: color,
+      leading: leadingActions !== undefined ? leadingActions : LeftToolbar,
+      trailing: trailingActions !== undefined ? trailingActions : RightToolbar
+    }), accessory != null && /*#__PURE__*/_jsx(HeaderAccessory, {
+      padding: accessoryPadding,
+      color: color,
+      onHeightChange: screen?.setHeaderAccessoryHeight,
+      children: accessory
+    })]
+  });
 }
-const styles = StyleSheet.create((theme, runtime) => ({
+const styles = StyleSheet.create((_, runtime) => ({
   container: {
     position: "absolute",
     top: 0,
@@ -119,73 +53,10 @@ const styles = StyleSheet.create((theme, runtime) => ({
     right: 0,
     zIndex: 1000
   },
-  safeArea: (isTransparent, bgColor, withinScreen) => ({
+  safeArea: (color, withinScreen) => ({
     height: withinScreen ? 0 : runtime.insets.top,
-    backgroundColor: isTransparent ? "transparent" : bgColor,
+    backgroundColor: color,
     uni__dependencies: [9]
-  }),
-  // Anchors the absolutely positioned surface over the bar and the accessory both.
-  barGroup: {
-    position: "relative"
-  },
-  bar: {
-    height: theme.layout.header.height,
-    flexDirection: "row",
-    alignItems: "center",
-    paddingHorizontal: theme.layout.screen.padding.x,
-    gap: theme.spacing["3"],
-    justifyContent: "space-between",
-    uni__dependencies: [0]
-  },
-  // A centered title is absolutely positioned, so it leaves the flex row. With
-  // no leading slot the trailing toolbar would be the only in-flow child and
-  // `space-between` would park it on the left — the auto margin pins it right.
-  trailing: {
-    justifyContent: "flex-end",
-    variants: {
-      titleAlignment: {
-        center: {
-          marginLeft: "auto"
-        },
-        left: {}
-      }
-    },
-    uni__dependencies: [4]
-  },
-  titleContainer: {
-    variants: {
-      titleAlignment: {
-        center: {
-          position: "absolute",
-          left: 0,
-          right: 0,
-          alignItems: "center"
-        },
-        left: {
-          flex: 1,
-          alignItems: "flex-start"
-        }
-      }
-    },
-    uni__dependencies: [4]
-  },
-  title: {
-    fontSize: theme.typography.variants["title-md"].fontSize,
-    lineHeight: theme.typography.variants["title-md"].lineHeight,
-    letterSpacing: theme.typography.variants["title-md"].letterSpacing,
-    fontWeight: FONT_WEIGHT_VALUE[theme.typography.variants["title-md"].fontWeight],
-    color: theme.color["text.primary"] ?? "",
-    variants: {
-      titleAlignment: {
-        center: {
-          textAlign: "center"
-        },
-        left: {
-          textAlign: "left"
-        }
-      }
-    },
-    uni__dependencies: [0, 4]
-  }
+  })
 }));
 //# sourceMappingURL=index.js.map

package/lib/module/components/header/variants/TitleHeader/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["useCallback","useContext","StyleSheet","useUnistyles","resolveThemeColor","FONT_WEIGHT_VALUE","useHeaderBackground","ScreenContext","Toolbar","HeaderDismissButton","HeaderAccessory","HeaderSurface","isCustomTitle","isTextTitle","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","TitleHeader","title","leadingActions","trailingActions","LeftToolbar","RightToolbar","accessory","accessoryPadding","dismissAction","navigation","onDismiss","titleAlignment","background","bg","theme","screen","colorToken","bgColor","color","leadingContent","undefined","trailingContent","setAccessoryInset","setHeaderAccessoryHeight","handleAccessoryHeightChange","height","isTransparent","gradientColor","_styles","styles","useVariants","leading","children","trailing","View","style","container","safeArea","barGroup","bar","titleContainer","pointerEvents","String","trim","length","Text","padding","onHeightChange","create","runtime","position","top","left","right","zIndex","withinScreen","insets","backgroundColor","uni__dependencies","layout","header","flexDirection","alignItems","paddingHorizontal","x","gap","spacing","justifyContent","variants","center","marginLeft","flex","fontSize","typography","lineHeight","letterSpacing","fontWeight","textAlign"],"sourceRoot":"../../../../../../src","sources":["components/header/variants/TitleHeader/index.tsx"],"mappings":";;;;AAAA,SAAyBA,WAAW,EAAEC,UAAU,QAAQ,OAAO;AAG/D,SAASC,UAAU,EAAEC,YAAY,QAAQ,wBAAwB;AAGjE,SAASC,iBAAiB;AAC1B,SAASC,iBAAiB;AAC1B,SAASC,mBAAmB;AAC5B,SAASC,aAAa;AACtB,SAASC,OAAO;AAChB,SAASC,mBAAmB;AAC5B,SAASC,eAAe;AACxB,SAASC,aAAa;AAEtB,SAASC,aAAa,EAAEC,WAAW;AAAsB,SAAAC,GAAA,IAAAC,IAAA,EAAAC,QAAA,IAAAC,SAAA,EAAAC,IAAA,IAAAC,KAAA;AA2CzD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASC,WAAWA,CAAC;EAC1BC,KAAK;EACLC,cAAc;EACdC,eAAe;EACfC,WAAW;EACXC,YAAY;EACZC,SAAS;EACTC,gBAAgB,GAAG,GAAG;EACtBC,aAAa,GAAG,MAAM;EACtBC,UAAU;EACVC,SAAS;EACTC,cAAc,GAAG,QAAQ;EACzBC,UAAU;EACVC;AACgB,CAAC,EAAE;EACnB,MAAM;IAAEC;EAAM,CAAC,GAAG/B,YAAY,CAAC,CAAC;EAEhC,MAAMgC,MAAM,GAAGlC,UAAU,CAACM,aAAa,CAAC;EACxC,MAAM6B,UAAU,GAAGJ,UAAU,IAAIC,EAAE;EACnC,MAAMI,OAAO,GACX,CAACD,UAAU,GAAGhC,iBAAiB,CAACgC,UAAU,EAAEF,KAAK,CAAC,GAAGC,MAAM,EAAEH,UAAU,KAAKE,KAAK,CAACI,KAAK,CAAC,gBAAgB,CAAC;EAC3GhC,mBAAmB,CAAC+B,OAAO,CAAC;EAC5B,MAAME,cAAc,GAAGjB,cAAc,KAAKkB,SAAS,GAAGlB,cAAc,GAAGE,WAAW;EAClF,MAAMiB,eAAe,GAAGlB,eAAe,KAAKiB,SAAS,GAAGjB,eAAe,GAAGE,YAAY;EACtF,MAAMiB,iBAAiB,GAAGP,MAAM,EAAEQ,wBAAwB;EAC1D;EACA,MAAMC,2BAA2B,GAAG5C,WAAW,CAC5C6C,MAAc,IAAKH,iBAAiB,GAAGG,MAAM,CAAC,EAC/C,CAACH,iBAAiB,CACpB,CAAC;EACD,MAAMI,aAAa,GAAGT,OAAO,KAAK,aAAa;EAC/C,MAAMU,aAAa,GAAGV,OAAO;EAAC,MAAAW,OAAA,GAAAC,MAAA;EAAA;IAAA,MAAAA,MAAA,GAAAD,OAAA,CAAAE,WAAA,CACX;MAAEnB;IAAe,CAAC;IAErC,MAAMoB,OAAO,GACXvB,aAAa,KAAK,MAAM,gBACtBT,KAAA,CAAAF,SAAA;MAAAmC,QAAA,gBACErC,IAAA,CAACN,mBAAmB;QAACmB,aAAa,EAAEA,aAAc;QAACC,UAAU,EAAEA,UAAW;QAACC,SAAS,EAAEA;MAAU,CAAE,CAAC,EAClGS,cAAc;IAAA,CACf,CAAC,GAEHA,cACD;IAEH,MAAMc,QAAQ,GACZzB,aAAa,KAAK,OAAO,gBACvBT,KAAA,CAAAF,SAAA;MAAAmC,QAAA,GACGX,eAAe,eAChB1B,IAAA,CAACN,mBAAmB;QAACmB,aAAa,EAAEA,aAAc;QAACC,UAAU,EAAEA,UAAW;QAACC,SAAS,EAAEA;MAAU,CAAE,CAAC;IAAA,CACnG,CAAC,GAEHW,eACD;IACH,oBACEtB,KAAA,CAACmC,IAAI;MAACC,KAAK,EAAEN,MAAM,CAACO,SAAU;MAAAJ,QAAA,gBAC5BrC,IAAA,CAACuC,IAAI;QAACC,KAAK,EAAEN,MAAM,CAACQ,QAAQ,CAACX,aAAa,EAAET,OAAO,EAAEF,MAAM,KAAK,IAAI;MAAE,CAAE,CAAC,eAGzEhB,KAAA,CAACmC,IAAI;QAACC,KAAK,EAAEN,MAAM,CAACS,QAAS;QAAAN,QAAA,gBAC3BrC,IAAA,CAACJ,aAAa;UAAC2B,KAAK,EAAES;QAAc,CAAE,CAAC,eACvC5B,KAAA,CAACmC,IAAI;UAACC,KAAK,EAAEN,MAAM,CAACU,GAAI;UAAAP,QAAA,GACrBD,OAAO,IAAI,IAAI,iBAAIpC,IAAA,CAACP,OAAO;YAAA4C,QAAA,EAAED;UAAO,CAAU,CAAC,eAGhDpC,IAAA,CAACuC,IAAI;YAACC,KAAK,EAAEN,MAAM,CAACW,cAAe;YAACC,aAAa,EAAEjD,aAAa,CAACS,KAAK,CAAC,GAAG,UAAU,GAAG,MAAO;YAAA+B,QAAA,EAC3FvC,WAAW,CAACQ,KAAK,CAAC,GACfyC,MAAM,CAACzC,KAAK,CAAC,CAAC0C,IAAI,CAAC,CAAC,CAACC,MAAM,GAAG,CAAC,iBAAIjD,IAAA,CAACkD,IAAI;cAACV,KAAK,EAAEN,MAAM,CAAC5B,KAAM;cAAA+B,QAAA,EAAE/B;YAAK,CAAO,CAAC,GAC5EA;UAAK,CACL,CAAC,EACNgC,QAAQ,IAAI,IAAI,iBAAItC,IAAA,CAACP,OAAO;YAAC+C,KAAK,EAAEN,MAAM,CAACI,QAAS;YAAAD,QAAA,EAAEC;UAAQ,CAAU,CAAC;QAAA,CACtE,CAAC,EACN3B,SAAS,IAAI,IAAI,iBAChBX,IAAA,CAACL,eAAe;UAACwD,OAAO,EAAEvC,gBAAiB;UAACwC,cAAc,EAAEvB,2BAA4B;UAAAQ,QAAA,EACrF1B;QAAS,CACK,CAClB;MAAA,CACG,CAAC;IAAA,CACH,CAAC;EACP;AACJ;AAEA,MAAMuB,MAAM,GAAG/C,UAAU,CAACkE,MAAM,CAAC,CAAClC,KAAK,EAAEmC,OAAO,MAAM;EACpDb,SAAS,EAAE;IACTc,QAAQ,EAAE,UAAU;IACpBC,GAAG,EAAE,CAAC;IACNC,IAAI,EAAE,CAAC;IACPC,KAAK,EAAE,CAAC;IACRC,MAAM,EAAE;EACV,CAAC;EACDjB,QAAQ,EAAEA,CAACX,aAAsB,EAAET,OAAe,EAAEsC,YAAqB,MAAM;IAC7E9B,MAAM,EAAE8B,YAAY,GAAG,CAAC,GAAGN,OAAO,CAACO,MAAM,CAACL,GAAG;IAC7CM,eAAe,EAAE/B,aAAa,GAAG,aAAa,GAAGT,OAAO;IAAAyC,iBAAA;EAC1D,CAAC,CAAC;EACF;EACApB,QAAQ,EAAE;IAAEY,QAAQ,EAAE;EAAW,CAAC;EAClCX,GAAG,EAAE;IACHd,MAAM,EAAEX,KAAK,CAAC6C,MAAM,CAACC,MAAM,CAACnC,MAAM;IAClCoC,aAAa,EAAE,KAAK;IACpBC,UAAU,EAAE,QAAQ;IACpBC,iBAAiB,EAAEjD,KAAK,CAAC6C,MAAM,CAAC5C,MAAM,CAAC+B,OAAO,CAACkB,CAAC;IAChDC,GAAG,EAAEnD,KAAK,CAACoD,OAAO,CAAC,GAAG,CAAC;IACvBC,cAAc,EAAE,eAAe;IAAAT,iBAAA;EACjC,CAAC;EACD;EACA;EACA;EACAzB,QAAQ,EAAE;IACRkC,cAAc,EAAE,UAAU;IAC1BC,QAAQ,EAAE;MACRzD,cAAc,EAAE;QACd0D,MAAM,EAAE;UAAEC,UAAU,EAAE;QAAO,CAAC;QAC9BlB,IAAI,EAAE,CAAC;MACT;IACF,CAAC;IAAAM,iBAAA;EACH,CAAC;EACDlB,cAAc,EAAE;IACd4B,QAAQ,EAAE;MACRzD,cAAc,EAAE;QACd0D,MAAM,EAAE;UACNnB,QAAQ,EAAE,UAAU;UACpBE,IAAI,EAAE,CAAC;UACPC,KAAK,EAAE,CAAC;UACRS,UAAU,EAAE;QACd,CAAC;QACDV,IAAI,EAAE;UACJmB,IAAI,EAAE,CAAC;UACPT,UAAU,EAAE;QACd;MACF;IACF,CAAC;IAAAJ,iBAAA;EACH,CAAC;EACDzD,KAAK,EAAE;IACLuE,QAAQ,EAAE1D,KAAK,CAAC2D,UAAU,CAACL,QAAQ,CAAC,UAAU,CAAC,CAACI,QAAQ;IACxDE,UAAU,EAAE5D,KAAK,CAAC2D,UAAU,CAACL,QAAQ,CAAC,UAAU,CAAC,CAACM,UAAU;IAC5DC,aAAa,EAAE7D,KAAK,CAAC2D,UAAU,CAACL,QAAQ,CAAC,UAAU,CAAC,CAACO,aAAa;IAClEC,UAAU,EAAE3F,iBAAiB,CAAC6B,KAAK,CAAC2D,UAAU,CAACL,QAAQ,CAAC,UAAU,CAAC,CAACQ,UAAU,CAAC;IAC/E1D,KAAK,EAAGJ,KAAK,CAACI,KAAK,CAAmD,cAAc,CAAC,IAAI,EAAE;IAC3FkD,QAAQ,EAAE;MACRzD,cAAc,EAAE;QACd0D,MAAM,EAAE;UAAEQ,SAAS,EAAE;QAAS,CAAC;QAC/BzB,IAAI,EAAE;UAAEyB,SAAS,EAAE;QAAO;MAC5B;IACF,CAAC;IAAAnB,iBAAA;EACH;AACF,CAAC,CAAC,CAAC","ignoreList":[]}
+{"version":3,"names":["useContext","StyleSheet","useHeaderBackground","ScreenContext","useHeaderColor","HeaderAccessory","HeaderBar","jsx","_jsx","jsxs","_jsxs","TitleHeader","title","leadingActions","trailingActions","LeftToolbar","RightToolbar","accessory","accessoryPadding","titleAlignment","background","bg","dismissProps","screen","color","View","style","styles","container","children","safeArea","leading","undefined","trailing","padding","onHeightChange","setHeaderAccessoryHeight","create","_","runtime","position","top","left","right","zIndex","withinScreen","height","insets","backgroundColor","uni__dependencies"],"sourceRoot":"../../../../../../src","sources":["components/header/variants/TitleHeader/index.tsx"],"mappings":";;;AAAA,SAAyBA,UAAU,QAAQ,OAAO;AAGlD,SAASC,UAAU,QAAQ,wBAAwB;AAGnD,SAASC,mBAAmB;AAC5B,SAASC,aAAa;AAEtB,SAASC,cAAc;AACvB,SAASC,eAAe;AACxB,SAASC,SAAS;AAAgC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AA4ClD;AACA,OAAO,SAASC,WAAWA,CAAC;EAC1BC,KAAK;EACLC,cAAc;EACdC,eAAe;EACfC,WAAW;EACXC,YAAY;EACZC,SAAS;EACTC,gBAAgB,GAAG,GAAG;EACtBC,cAAc,GAAG,QAAQ;EACzBC,UAAU;EACVC,EAAE;EACF,GAAGC;AACa,CAAC,EAAE;EACnB,MAAMC,MAAM,GAAGvB,UAAU,CAACG,aAAa,CAAC;EACxC,MAAMqB,KAAK,GAAGpB,cAAc,CAACgB,UAAU,IAAIC,EAAE,CAAC;EAC9CnB,mBAAmB,CAACsB,KAAK,CAAC;EAC1B,oBACEd,KAAA,CAACe,IAAI;IAACC,KAAK,EAAEC,MAAM,CAACC,SAAU;IAAAC,QAAA,gBAC5BrB,IAAA,CAACiB,IAAI;MAACC,KAAK,EAAEC,MAAM,CAACG,QAAQ,CAACN,KAAK,EAAED,MAAM,KAAK,IAAI;IAAE,CAAE,CAAC,eACxDf,IAAA,CAACF,SAAS;MAAA,GACJgB,YAAY;MAChBV,KAAK,EAAEA,KAAM;MACbO,cAAc,EAAEA,cAAe;MAC/BK,KAAK,EAAEA,KAAM;MACbO,OAAO,EAAElB,cAAc,KAAKmB,SAAS,GAAGnB,cAAc,GAAGE,WAAY;MACrEkB,QAAQ,EAAEnB,eAAe,KAAKkB,SAAS,GAAGlB,eAAe,GAAGE;IAAa,CAC1E,CAAC,EACDC,SAAS,IAAI,IAAI,iBAChBT,IAAA,CAACH,eAAe;MACd6B,OAAO,EAAEhB,gBAAiB;MAC1BM,KAAK,EAAEA,KAAM;MACbW,cAAc,EAAEZ,MAAM,EAAEa,wBAAyB;MAAAP,QAAA,EAEhDZ;IAAS,CACK,CAClB;EAAA,CACG,CAAC;AAEX;AAEA,MAAMU,MAAM,GAAG1B,UAAU,CAACoC,MAAM,CAAC,CAACC,CAAC,EAAEC,OAAO,MAAM;EAChDX,SAAS,EAAE;IAAEY,QAAQ,EAAE,UAAU;IAAEC,GAAG,EAAE,CAAC;IAAEC,IAAI,EAAE,CAAC;IAAEC,KAAK,EAAE,CAAC;IAAEC,MAAM,EAAE;EAAK,CAAC;EAC5Ed,QAAQ,EAAEA,CAACN,KAAa,EAAEqB,YAAqB,MAAM;IACnDC,MAAM,EAAED,YAAY,GAAG,CAAC,GAAGN,OAAO,CAACQ,MAAM,CAACN,GAAG;IAC7CO,eAAe,EAAExB,KAAK;IAAAyB,iBAAA;EACxB,CAAC;AACH,CAAC,CAAC,CAAC","ignoreList":[]}

package/lib/module/components/surface/Surface.js

@@ -61,6 +61,7 @@ const resolveElevation = (variant, elevation) => {
  */
 export const Surface = /*#__PURE__*/forwardRef(function Surface({
   variant = "base",
+  p = "3",
   elevation,
   radius,
   borderWidth,
@@ -71,6 +72,7 @@ export const Surface = /*#__PURE__*/forwardRef(function Surface({
   return /*#__PURE__*/_jsx(Box, {
     ref: ref,
     background: VARIANT_BG[variant],
+    p: p,
     radius: radius ?? getDefaultRadius("surface"),
     borderWidth: borderWidth ?? variantBorder.borderWidth,
     borderColor: borderColor ?? variantBorder.borderColor,

package/lib/module/components/surface/Surface.js.map

@@ -1 +1 @@
-{"version":3,"names":["forwardRef","getDefaultRadius","getSurfaceElevation","Box","jsx","_jsx","VARIANT_BG","base","raised","sunken","transparent","VARIANT_BORDER","borderWidth","borderColor","resolveElevation","variant","elevation","undefined","Surface","radius","rest","ref","variantBorder","background"],"sourceRoot":"../../../../src","sources":["components/surface/Surface.tsx"],"mappings":";;AAAA,SAA4BA,UAAU,QAAQ,OAAO;AAGrD,SAASC,gBAAgB,EAAEC,mBAAmB;AAE9C,SAAgCC,GAAG;;AAEnC;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAgBA,MAAMC,UAA8C,GAAG;EACrDC,IAAI,EAAE,iBAAiB;EACvBC,MAAM,EAAE,gBAAgB;EACxBC,MAAM,EAAE,gBAAgB;EACxBC,WAAW,EAAE;AACf,CAAC;;AAED;AACA,MAAMC,cAAoG,GAAG;EAC3GJ,IAAI,EAAE,CAAC,CAAC;EACRC,MAAM,EAAE;IAAEI,WAAW,EAAE,UAAU;IAAEC,WAAW,EAAE;EAAgB,CAAC;EACjEJ,MAAM,EAAE;IAAEG,WAAW,EAAE,UAAU;IAAEC,WAAW,EAAE;EAAiB,CAAC;EAClEH,WAAW,EAAE,CAAC;AAChB,CAAC;;AAED;AACA;AACA;AACA;AACA;AACA,MAAMI,gBAAgB,GAAGA,CAACC,OAAuB,EAAEC,SAAwB,KAAmB;EAC5F,IAAID,OAAO,KAAK,aAAa,EAAE,OAAO,MAAM;EAC5C,IAAIC,SAAS,KAAKC,SAAS,EAAE,OAAOD,SAAS;EAC7C,IAAID,OAAO,KAAK,QAAQ,EAAE,OAAO,IAAI;EACrC,OAAOb,mBAAmB,CAAC,CAAC;AAC9B,CAAC;;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMgB,OAAO,gBAAGlB,UAAU,CAA0C,SAASkB,OAAOA,CACzF;EAAEH,OAAO,GAAG,MAAM;EAAEC,SAAS;EAAEG,MAAM;EAAEP,WAAW;EAAEC,WAAW;EAAE,GAAGO;AAAK,CAAC,EAC1EC,GAAG,EACH;EACA,MAAMC,aAAa,GAAGX,cAAc,CAACI,OAAO,CAAC;EAE7C,oBACEV,IAAA,CAACF,GAAG;IACFkB,GAAG,EAAEA,GAAI;IACTE,UAAU,EAAEjB,UAAU,CAACS,OAAO,CAAE;IAChCI,MAAM,EAAEA,MAAM,IAAIlB,gBAAgB,CAAC,SAAS,CAAE;IAC9CW,WAAW,EAAEA,WAAW,IAAIU,aAAa,CAACV,WAAY;IACtDC,WAAW,EAAEA,WAAW,IAAIS,aAAa,CAACT,WAAY;IACtDG,SAAS,EAAEF,gBAAgB,CAACC,OAAO,EAAEC,SAAS,CAAE;IAAA,GAC5CI;EAAI,CACT,CAAC;AAEN,CAAC,CAAC","ignoreList":[]}
+{"version":3,"names":["forwardRef","getDefaultRadius","getSurfaceElevation","Box","jsx","_jsx","VARIANT_BG","base","raised","sunken","transparent","VARIANT_BORDER","borderWidth","borderColor","resolveElevation","variant","elevation","undefined","Surface","p","radius","rest","ref","variantBorder","background"],"sourceRoot":"../../../../src","sources":["components/surface/Surface.tsx"],"mappings":";;AAAA,SAA4BA,UAAU,QAAQ,OAAO;AAGrD,SAASC,gBAAgB,EAAEC,mBAAmB;AAE9C,SAAgCC,GAAG;;AAEnC;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAgBA,MAAMC,UAA8C,GAAG;EACrDC,IAAI,EAAE,iBAAiB;EACvBC,MAAM,EAAE,gBAAgB;EACxBC,MAAM,EAAE,gBAAgB;EACxBC,WAAW,EAAE;AACf,CAAC;;AAED;AACA,MAAMC,cAAoG,GAAG;EAC3GJ,IAAI,EAAE,CAAC,CAAC;EACRC,MAAM,EAAE;IAAEI,WAAW,EAAE,UAAU;IAAEC,WAAW,EAAE;EAAgB,CAAC;EACjEJ,MAAM,EAAE;IAAEG,WAAW,EAAE,UAAU;IAAEC,WAAW,EAAE;EAAiB,CAAC;EAClEH,WAAW,EAAE,CAAC;AAChB,CAAC;;AAED;AACA;AACA;AACA;AACA;AACA,MAAMI,gBAAgB,GAAGA,CAACC,OAAuB,EAAEC,SAAwB,KAAmB;EAC5F,IAAID,OAAO,KAAK,aAAa,EAAE,OAAO,MAAM;EAC5C,IAAIC,SAAS,KAAKC,SAAS,EAAE,OAAOD,SAAS;EAC7C,IAAID,OAAO,KAAK,QAAQ,EAAE,OAAO,IAAI;EACrC,OAAOb,mBAAmB,CAAC,CAAC;AAC9B,CAAC;;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMgB,OAAO,gBAAGlB,UAAU,CAA0C,SAASkB,OAAOA,CACzF;EAAEH,OAAO,GAAG,MAAM;EAAEI,CAAC,GAAG,GAAG;EAAEH,SAAS;EAAEI,MAAM;EAAER,WAAW;EAAEC,WAAW;EAAE,GAAGQ;AAAK,CAAC,EACnFC,GAAG,EACH;EACA,MAAMC,aAAa,GAAGZ,cAAc,CAACI,OAAO,CAAC;EAE7C,oBACEV,IAAA,CAACF,GAAG;IACFmB,GAAG,EAAEA,GAAI;IACTE,UAAU,EAAElB,UAAU,CAACS,OAAO,CAAE;IAChCI,CAAC,EAAEA,CAAE;IACLC,MAAM,EAAEA,MAAM,IAAInB,gBAAgB,CAAC,SAAS,CAAE;IAC9CW,WAAW,EAAEA,WAAW,IAAIW,aAAa,CAACX,WAAY;IACtDC,WAAW,EAAEA,WAAW,IAAIU,aAAa,CAACV,WAAY;IACtDG,SAAS,EAAEF,gBAAgB,CAACC,OAAO,EAAEC,SAAS,CAAE;IAAA,GAC5CK;EAAI,CACT,CAAC;AAEN,CAAC,CAAC","ignoreList":[]}

package/lib/typescript/src/components/box/Box.d.ts

@@ -1,12 +1,36 @@
-import { type ViewProps } from "react-native";
+import { type ComponentPropsWithRef, type ElementType, type ReactElement } from "react";
+import { View } from "react-native";
 import { type BoxStyleProps } from "./utils.js";
-export interface BoxProps extends ViewProps, BoxStyleProps {
-    /** Merge Box's style/props onto a single child instead of rendering a View. */
+/** Props owned by Box itself — everything else belongs to the rendered element. */
+interface BoxOwnProps extends BoxStyleProps {
+    /** Merge Box's style/props onto a single child instead of rendering an element. Takes precedence over `as`. */
     asChild?: boolean;
 }
+/**
+ * Props of `Box` when cast as `T`. Token style-props plus everything the
+ * rendered component accepts — `<Box as={Pressable} onPress={…} />` type-checks
+ * against `Pressable`, not `View`.
+ */
+export type BoxProps<T extends ElementType = typeof View> = BoxOwnProps & {
+    /** Render as this component instead of `View`. It must accept a `style` prop. */
+    as?: T;
+} & Omit<ComponentPropsWithRef<T>, keyof BoxOwnProps | "as">;
 /**
  * Base layout primitive: a `View` styled through theme-token props.
  * The only component family exposing token style-props.
+ *
+ * Pass `as` to cast it as another component — the token style-props still
+ * resolve, and the rest of the props are typed against that component.
+ * Note that `as` renders a component Box does not own, so a Unistyles style
+ * handed to it only stays theme-reactive if that component's own module runs
+ * through the Unistyles Babel plugin (see the stylesheet note below).
+ *
+ * @example
+ * ```tsx
+ * <Box row gap="2" p="4" />
+ * <Box as={Pressable} onPress={onPress} p="3" radius="md" />
+ * ```
  */
-export declare const Box: import("react").ForwardRefExoticComponent<BoxProps & import("react").RefAttributes<import("react-native/types_generated/src/private/webapis/dom/nodes/ReactNativeElement").default>>;
+export declare const Box: <T extends ElementType = typeof View>(props: BoxProps<T>) => ReactElement | null;
+export {};
 //# sourceMappingURL=Box.d.ts.map

package/lib/typescript/src/components/box/Box.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Box.d.ts","sourceRoot":"","sources":["../../../../../src/components/box/Box.tsx"],"names":[],"mappings":"AACA,OAAO,EAAQ,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AAKpD,OAAO,EAAuB,KAAK,aAAa,EAAmB,MAAM,YAAS,CAAC;AAEnF,MAAM,WAAW,QAAS,SAAQ,SAAS,EAAE,aAAa;IACxD,+EAA+E;IAC/E,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAID;;;GAGG;AACH,eAAO,MAAM,GAAG,sLA6Bd,CAAC"}
+{"version":3,"file":"Box.d.ts","sourceRoot":"","sources":["../../../../../src/components/box/Box.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,qBAAqB,EAC1B,KAAK,WAAW,EAEhB,KAAK,YAAY,EAElB,MAAM,OAAO,CAAC;AACf,OAAO,EAAkB,IAAI,EAAkB,MAAM,cAAc,CAAC;AAKpE,OAAO,EAAuB,KAAK,aAAa,EAAmB,MAAM,YAAS,CAAC;AAEnF,mFAAmF;AACnF,UAAU,WAAY,SAAQ,aAAa;IACzC,+GAA+G;IAC/G,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED;;;;GAIG;AACH,MAAM,MAAM,QAAQ,CAAC,CAAC,SAAS,WAAW,GAAG,OAAO,IAAI,IAAI,WAAW,GAAG;IACxE,iFAAiF;IACjF,EAAE,CAAC,EAAE,CAAC,CAAC;CACR,GAAG,IAAI,CAAC,qBAAqB,CAAC,CAAC,CAAC,EAAE,MAAM,WAAW,GAAG,IAAI,CAAC,CAAC;AA6C7D;;;;;;;;;;;;;;;GAeG;AACH,eAAO,MAAM,GAAG,EAA4B,CAAC,CAAC,SAAS,WAAW,GAAG,OAAO,IAAI,EAC9E,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC,KACf,YAAY,GAAG,IAAI,CAAC"}

package/lib/typescript/src/components/header/hooks/use-header-color.d.ts

@@ -0,0 +1,4 @@
+import type { ColorToken } from "../../../theme/types";
+/** Explicit header color wins, then Screen, then the theme canvas. */
+export declare function useHeaderColor(token?: ColorToken): string;
+//# sourceMappingURL=use-header-color.d.ts.map

package/lib/typescript/src/components/header/hooks/use-header-color.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-header-color.d.ts","sourceRoot":"","sources":["../../../../../../src/components/header/hooks/use-header-color.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAI/C,sEAAsE;AACtE,wBAAgB,cAAc,CAAC,KAAK,CAAC,EAAE,UAAU,UAIhD"}

package/lib/typescript/src/components/header/hooks/use-large-title-header.d.ts

@@ -0,0 +1,36 @@
+import type { HeaderAccessoryBehavior } from "../types.js";
+interface LargeTitleLayoutOptions {
+    hasAccessory: boolean;
+    accessoryBehavior: HeaderAccessoryBehavior;
+    isLargeTitleHidden: boolean;
+}
+/** Coordinates measured layout and UI-thread animation without animating accessory padding. */
+export declare function useLargeTitleHeader({ hasAccessory, accessoryBehavior, isLargeTitleHidden, }: LargeTitleLayoutOptions): {
+    isSticky: boolean;
+    accessoryOffset: number;
+    reservedAccessoryHeight: number;
+    setAccessoryHeight: import("react").Dispatch<import("react").SetStateAction<number>>;
+    setLargeTitleHeight: import("react").Dispatch<import("react").SetStateAction<number>>;
+    accessoryStyle: import("react-native-reanimated/lib/typescript/hook/commonTypes").AnimatedStyleHandle<{
+        transform: {
+            translateY: number;
+        }[];
+    }>;
+    surfaceStyle: import("react-native-reanimated/lib/typescript/hook/commonTypes").AnimatedStyleHandle<{
+        opacity: number;
+    }>;
+    compactTitleStyle: import("react-native-reanimated/lib/typescript/hook/commonTypes").AnimatedStyleHandle<{
+        opacity: number;
+        transform: {
+            translateY: number;
+        }[];
+    }>;
+    largeTitleStyle: import("react-native-reanimated/lib/typescript/hook/commonTypes").AnimatedStyleHandle<{
+        opacity: number;
+        transform: {
+            translateY: number;
+        }[];
+    }>;
+};
+export {};
+//# sourceMappingURL=use-large-title-header.d.ts.map

package/lib/typescript/src/components/header/hooks/use-large-title-header.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-large-title-header.d.ts","sourceRoot":"","sources":["../../../../../../src/components/header/hooks/use-large-title-header.ts"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,aAAU,CAAC;AAExD,UAAU,uBAAuB;IAC/B,YAAY,EAAE,OAAO,CAAC;IACtB,iBAAiB,EAAE,uBAAuB,CAAC;IAC3C,kBAAkB,EAAE,OAAO,CAAC;CAC7B;AAED,+FAA+F;AAC/F,wBAAgB,mBAAmB,CAAC,EAClC,YAAY,EACZ,iBAAiB,EACjB,kBAAkB,GACnB,EAAE,uBAAuB;;;;;;;;;;;;;;;;;;;;;;;;;;EA0DzB"}

package/lib/typescript/src/components/header/parts/HeaderAccessory.d.ts

@@ -1,17 +1,20 @@
-import { type ReactNode } from "react";
-import { type StyleProp, type ViewStyle } from "react-native";
+import { type ComponentProps, type ReactNode } from "react";
+import Animated from "react-native-reanimated";
 import type { HeaderAccessoryPadding } from "../types.js";
+import { type HeaderSurfaceProps } from "./HeaderSurface.js";
 export interface HeaderAccessoryProps {
     children: ReactNode;
     /** Horizontal padding around the accessory. */
     padding: HeaderAccessoryPadding;
+    color: string;
+    surfaceStyle?: HeaderSurfaceProps["animatedStyle"];
     /** Reports layout height in dp; reports zero on cleanup to release reserved space. */
-    onHeightChange: (height: number) => void;
+    onHeightChange?: (height: number) => void;
     /** Additional styles for the accessory container. */
-    style?: StyleProp<ViewStyle>;
+    style?: ComponentProps<typeof Animated.View>["style"];
 }
 /** Measures accessory content so the header can reserve space in the scroll container. */
-export declare function HeaderAccessory({ children, padding, onHeightChange, style }: HeaderAccessoryProps): import("react").JSX.Element;
+export declare function HeaderAccessory({ children, padding, color, surfaceStyle, onHeightChange, style, }: HeaderAccessoryProps): import("react").JSX.Element;
 /** Reserves scroll-content space for the sticky accessory rendered in the header overlay. */
 export declare function HeaderAccessorySpacer({ height }: {
     height: number;

package/lib/typescript/src/components/header/parts/HeaderAccessory.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"HeaderAccessory.d.ts","sourceRoot":"","sources":["../../../../../../src/components/header/parts/HeaderAccessory.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,SAAS,EAA0B,MAAM,OAAO,CAAC;AAC/D,OAAO,EAA0B,KAAK,SAAS,EAAQ,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AAK5F,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,aAAU,CAAC;AAEvD,MAAM,WAAW,oBAAoB;IACnC,QAAQ,EAAE,SAAS,CAAC;IACpB,+CAA+C;IAC/C,OAAO,EAAE,sBAAsB,CAAC;IAChC,sFAAsF;IACtF,cAAc,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC,qDAAqD;IACrD,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;CAC9B;AAED,0FAA0F;AAC1F,wBAAgB,eAAe,CAAC,EAAE,QAAQ,EAAE,OAAO,EAAE,cAAc,EAAE,KAAK,EAAE,EAAE,oBAAoB,+BAkBjG;AAED,6FAA6F;AAC7F,wBAAgB,qBAAqB,CAAC,EAAE,MAAM,EAAE,EAAE;IAAE,MAAM,EAAE,MAAM,CAAA;CAAE,+BAEnE"}
+{"version":3,"file":"HeaderAccessory.d.ts","sourceRoot":"","sources":["../../../../../../src/components/header/parts/HeaderAccessory.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,cAAc,EAAE,KAAK,SAAS,EAAwC,MAAM,OAAO,CAAC;AAGlG,OAAO,QAAQ,MAAM,yBAAyB,CAAC;AAG/C,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,aAAU,CAAC;AACvD,OAAO,EAAiB,KAAK,kBAAkB,EAAE,MAAM,oBAAiB,CAAC;AAEzE,MAAM,WAAW,oBAAoB;IACnC,QAAQ,EAAE,SAAS,CAAC;IACpB,+CAA+C;IAC/C,OAAO,EAAE,sBAAsB,CAAC;IAChC,KAAK,EAAE,MAAM,CAAC;IACd,YAAY,CAAC,EAAE,kBAAkB,CAAC,eAAe,CAAC,CAAC;IACnD,sFAAsF;IACtF,cAAc,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1C,qDAAqD;IACrD,KAAK,CAAC,EAAE,cAAc,CAAC,OAAO,QAAQ,CAAC,IAAI,CAAC,CAAC,OAAO,CAAC,CAAC;CACvD;AAED,0FAA0F;AAC1F,wBAAgB,eAAe,CAAC,EAC9B,QAAQ,EACR,OAAO,EACP,KAAK,EACL,YAAY,EACZ,cAAc,EACd,KAAK,GACN,EAAE,oBAAoB,+BAwBtB;AAED,6FAA6F;AAC7F,wBAAgB,qBAAqB,CAAC,EAAE,MAAM,EAAE,EAAE;IAAE,MAAM,EAAE,MAAM,CAAA;CAAE,+BAEnE"}

package/lib/typescript/src/components/header/parts/HeaderBar.d.ts

@@ -0,0 +1,17 @@
+import type { ComponentProps, ReactNode } from "react";
+import Animated from "react-native-reanimated";
+import { type HeaderDismissProps } from "../header-buttons.js";
+import { type HeaderSurfaceProps } from "./HeaderSurface.js";
+interface HeaderBarProps extends HeaderDismissProps {
+    title?: ReactNode;
+    leading?: ReactNode;
+    trailing?: ReactNode;
+    titleAlignment: "center" | "left";
+    color: string;
+    surfaceStyle?: HeaderSurfaceProps["animatedStyle"];
+    titleStyle?: ComponentProps<typeof Animated.View>["style"];
+}
+/** Shared compact bar. Only the title and background animate; actions stay interactive. */
+export declare function HeaderBar({ title, leading, trailing, titleAlignment, color, surfaceStyle, titleStyle, dismissAction, navigation, onDismiss, }: HeaderBarProps): import("react").JSX.Element;
+export {};
+//# sourceMappingURL=HeaderBar.d.ts.map

package/lib/typescript/src/components/header/parts/HeaderBar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"HeaderBar.d.ts","sourceRoot":"","sources":["../../../../../../src/components/header/parts/HeaderBar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGvD,OAAO,QAAQ,MAAM,yBAAyB,CAAC;AAK/C,OAAO,EAAuB,KAAK,kBAAkB,EAAE,MAAM,sBAAmB,CAAC;AAEjF,OAAO,EAAiB,KAAK,kBAAkB,EAAE,MAAM,oBAAiB,CAAC;AAEzE,UAAU,cAAe,SAAQ,kBAAkB;IACjD,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,cAAc,EAAE,QAAQ,GAAG,MAAM,CAAC;IAClC,KAAK,EAAE,MAAM,CAAC;IACd,YAAY,CAAC,EAAE,kBAAkB,CAAC,eAAe,CAAC,CAAC;IACnD,UAAU,CAAC,EAAE,cAAc,CAAC,OAAO,QAAQ,CAAC,IAAI,CAAC,CAAC,OAAO,CAAC,CAAC;CAC5D;AAED,2FAA2F;AAC3F,wBAAgB,SAAS,CAAC,EACxB,KAAK,EACL,OAAO,EACP,QAAQ,EACR,cAAc,EACd,KAAK,EACL,YAAY,EACZ,UAAU,EACV,aAAsB,EACtB,UAAU,EACV,SAAS,GACV,EAAE,cAAc,+BAsChB"}

package/lib/typescript/src/components/header/parts/HeaderGradientOverlay.d.ts

@@ -1,24 +1,21 @@
 /**
- * How far the overlay extends below the bar's bottom edge, in dp.
- *
- * The fade needs more room than the bar alone can give it: confined to the bar,
- * the curve has to be steep enough to read as a band. Overhanging lets the tail
- * finish in open space, so the header releases content instead of cutting it.
+ * Opacity at the overlay's bottom edge. The top is fully opaque, so the header
+ * thins slightly toward the boundary rather than cutting content off square —
+ * but never far enough to read as see-through.
  */
-export declare const HEADER_FADE_EXTENT = 8;
+export declare const HEADER_FADE_END_OPACITY = 0.85;
 export interface HeaderGradientOverlayProps {
-    /** Fill color, fading to fully transparent along the overlay. */
+    /** Fill color, ramped from opaque to {@link HEADER_FADE_END_OPACITY}. */
     color: string;
+    startOpacity?: number;
+    endOpacity?: number;
 }
 /**
- * Vertical fade-out overlay behind header content, shared by header variants.
- *
- * Reaches zero rather than stopping short. An overlay ending at partial opacity
- * leaves a hard step wherever it is clipped, and that step is far more visible
- * than the fade it was meant to hide — it is what cuts content off square as it
- * scrolls under the header.
+ * Vertical fade behind header content, shared by header variants.
  *
- * Callers size it to overhang the bar by {@link HEADER_FADE_EXTENT}.
+ * A two-stop linear ramp spanning the overlay's own box: it neither overhangs
+ * the surface nor reserves a band inside it, so callers size the surface and
+ * the ramp simply spans whatever they gave it.
  */
-export declare function HeaderGradientOverlay({ color }: HeaderGradientOverlayProps): import("react").JSX.Element;
+export declare function HeaderGradientOverlay({ color, startOpacity, endOpacity, }: HeaderGradientOverlayProps): import("react").JSX.Element;
 //# sourceMappingURL=HeaderGradientOverlay.d.ts.map

package/lib/typescript/src/components/header/parts/HeaderGradientOverlay.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"HeaderGradientOverlay.d.ts","sourceRoot":"","sources":["../../../../../../src/components/header/parts/HeaderGradientOverlay.tsx"],"names":[],"mappings":"AAIA;;;;;;GAMG;AACH,eAAO,MAAM,kBAAkB,IAAI,CAAC;AAsDpC,MAAM,WAAW,0BAA0B;IACzC,iEAAiE;IACjE,KAAK,EAAE,MAAM,CAAC;CACf;AAED;;;;;;;;;GASG;AACH,wBAAgB,qBAAqB,CAAC,EAAE,KAAK,EAAE,EAAE,0BAA0B,+BAe1E"}
+{"version":3,"file":"HeaderGradientOverlay.d.ts","sourceRoot":"","sources":["../../../../../../src/components/header/parts/HeaderGradientOverlay.tsx"],"names":[],"mappings":"AAIA;;;;GAIG;AACH,eAAO,MAAM,uBAAuB,OAAO,CAAC;AAE5C,MAAM,WAAW,0BAA0B;IACzC,yEAAyE;IACzE,KAAK,EAAE,MAAM,CAAC;IACd,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAED;;;;;;GAMG;AACH,wBAAgB,qBAAqB,CAAC,EACpC,KAAK,EACL,YAAgB,EAChB,UAAoC,GACrC,EAAE,0BAA0B,+BAc5B"}

package/lib/typescript/src/components/header/parts/HeaderSurface.d.ts

@@ -3,20 +3,19 @@ type HeaderOpacityStyle = ReturnType<typeof useAnimatedStyle<{
     opacity: number;
 }>>;
 export interface HeaderSurfaceProps {
-    /** Fill color, fading to fully transparent along the bottom edge. */
+    /** Fill color, ramped toward the surface's bottom edge. */
     color: string;
     /** Opacity style for variants that fade the whole surface in as they collapse. */
     animatedStyle?: HeaderOpacityStyle;
-    /**
-     * Height of the bottom gradient in dp. The region above it uses a solid fill.
-     * @defaultValue The themed bar height plus `HEADER_FADE_EXTENT`.
-     */
-    fadeHeight?: number;
+    /** Continue the bar's gradient from 0.85 to 0.80 beneath an accessory. */
+    accessory?: boolean;
 }
 /**
- * Header background with a solid fill and a bottom gradient.
- * A fixed gradient height keeps tall accessories from becoming translucent.
+ * Header background with matching gradient boundaries for the bar and accessory.
+ *
+ * The ramp spans the surface itself: it is sized by the caller and stays inside
+ * those bounds, so a taller surface stretches the fade rather than adding to it.
  */
-export declare function HeaderSurface({ color, animatedStyle, fadeHeight }: HeaderSurfaceProps): import("react").JSX.Element;
+export declare function HeaderSurface({ color, animatedStyle, accessory }: HeaderSurfaceProps): import("react").JSX.Element;
 export {};
 //# sourceMappingURL=HeaderSurface.d.ts.map

package/lib/typescript/src/components/header/parts/HeaderSurface.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"HeaderSurface.d.ts","sourceRoot":"","sources":["../../../../../../src/components/header/parts/HeaderSurface.tsx"],"names":[],"mappings":"AAEA,OAAiB,EAAE,KAAK,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AAK1E,KAAK,kBAAkB,GAAG,UAAU,CAAC,OAAO,gBAAgB,CAAC;IAAE,OAAO,EAAE,MAAM,CAAA;CAAE,CAAC,CAAC,CAAC;AAEnF,MAAM,WAAW,kBAAkB;IACjC,qEAAqE;IACrE,KAAK,EAAE,MAAM,CAAC;IACd,kFAAkF;IAClF,aAAa,CAAC,EAAE,kBAAkB,CAAC;IACnC;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAED;;;GAGG;AACH,wBAAgB,aAAa,CAAC,EAAE,KAAK,EAAE,aAAa,EAAE,UAAU,EAAE,EAAE,kBAAkB,+BASrF"}
+{"version":3,"file":"HeaderSurface.d.ts","sourceRoot":"","sources":["../../../../../../src/components/header/parts/HeaderSurface.tsx"],"names":[],"mappings":"AAAA,OAAiB,EAAE,KAAK,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AAK1E,KAAK,kBAAkB,GAAG,UAAU,CAAC,OAAO,gBAAgB,CAAC;IAAE,OAAO,EAAE,MAAM,CAAA;CAAE,CAAC,CAAC,CAAC;AAEnF,MAAM,WAAW,kBAAkB;IACjC,2DAA2D;IAC3D,KAAK,EAAE,MAAM,CAAC;IACd,kFAAkF;IAClF,aAAa,CAAC,EAAE,kBAAkB,CAAC;IACnC,0EAA0E;IAC1E,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED;;;;;GAKG;AACH,wBAAgB,aAAa,CAAC,EAAE,KAAK,EAAE,aAAa,EAAE,SAAS,EAAE,EAAE,kBAAkB,+BAUpF"}