@oxyhq/bloom 0.29.3 → 0.29.4

package/lib/commonjs/typography/defaults.js

@@ -0,0 +1,22 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.mergeTypographyStyle = mergeTypographyStyle;
+exports.typographyDefaultsWhenNoClassName = typographyDefaultsWhenNoClassName;
+/**
+ * Bloom typography defaults are applied via inline `style` only when the caller
+ * does not pass `className`. When `className` is present, NativeWind compiles
+ * font-size / line-height / weight / color utilities into `style` first; inline
+ * defaults that repeat those keys would win the merge and silently override the
+ * utilities (the Homiio hero-title bug).
+ */
+function typographyDefaultsWhenNoClassName(className, defaults) {
+  return className?.trim() ? undefined : defaults;
+}
+function mergeTypographyStyle(className, defaults, base, style) {
+  const resolvedDefaults = defaults ? typographyDefaultsWhenNoClassName(className, defaults) : undefined;
+  return [resolvedDefaults, base, style];
+}
+//# sourceMappingURL=defaults.js.map

package/lib/commonjs/typography/defaults.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["typographyDefaultsWhenNoClassName","className","defaults","trim","undefined","mergeTypographyStyle","base","style","resolvedDefaults"],"sourceRoot":"../../../src","sources":["typography/defaults.ts"],"mappings":";;;;;;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,SAASA,iCAAiCA,CAC/CC,SAA6B,EAC7BC,QAAmB,EACI;EACvB,OAAOD,SAAS,EAAEE,IAAI,CAAC,CAAC,GAAGC,SAAS,GAAGF,QAAQ;AACjD;AAEO,SAASG,oBAAoBA,CAClCJ,SAA6B,EAC7BC,QAA+B,EAC/BI,IAA0B,EAC1BC,KAAuC,EACjB;EACtB,MAAMC,gBAAgB,GAAGN,QAAQ,GAC7BF,iCAAiC,CAACC,SAAS,EAAEC,QAAQ,CAAC,GACtDE,SAAS;EAEb,OAAO,CAACI,gBAAgB,EAAEF,IAAI,EAAEC,KAAK,CAAC;AACxC","ignoreList":[]}

package/lib/commonjs/typography/index.js

@@ -16,6 +16,8 @@ var _react = _interopRequireWildcard(require("react"));
 var _reactNative = require("react-native");
 var _useTheme = require("../theme/use-theme.js");
 var _tokens = require("../fonts/tokens.js");
+var _defaults = require("./defaults.js");
+var _styledText = require("./styled-text.js");
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
 /**
@@ -44,32 +46,42 @@ function fontFamilyStyle(kind) {
 }
 const SANS_FONT_FAMILY = fontFamilyStyle('sans');
 const DISPLAY_FONT_FAMILY = fontFamilyStyle('display');
+const DEFAULT_TEXT_TYPOGRAPHY = {
+  fontSize: 13
+};
 
 /**
  * Base text component with theme-aware default color and the Bloom sans
- * font family applied.
+ * font family applied. NativeWind `className` utilities (text-*, font-*,
+ * leading-*, text-foreground, …) override defaults when provided.
  */
 const TextComponent = function Text({
   children,
   style,
+  className,
   ...rest
 }) {
   const {
     colors
   } = (0, _useTheme.useTheme)();
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+  const InteropText = (0, _styledText.getInteropText)();
+  const interopActive = (0, _styledText.hasTypographyClassNameInterop)();
+  const resolvedClassName = interopActive && className?.trim() ? className : undefined;
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(InteropText, {
     ...rest,
-    style: [{
-      fontSize: 13,
-      color: colors.text,
-      ...SANS_FONT_FAMILY
-    }, style],
+    ...(resolvedClassName ? {
+      className: resolvedClassName
+    } : {}),
+    style: (0, _defaults.mergeTypographyStyle)(resolvedClassName, {
+      ...DEFAULT_TEXT_TYPOGRAPHY,
+      color: colors.text
+    }, SANS_FONT_FAMILY, style),
     children: children
   });
 };
 const Text = exports.Span = exports.Text = /*#__PURE__*/(0, _react.memo)(TextComponent);
 Text.displayName = 'Text';
-const HEADING_STYLE = {
+const HEADING_TYPOGRAPHY = {
   ...DISPLAY_FONT_FAMILY,
   fontWeight: '700'
 };
@@ -78,16 +90,19 @@ function createHeadingElement({
 }) {
   return function HeadingElement({
     style,
+    className,
     ...rest
   }) {
     const extraProps = _reactNative.Platform.OS === 'web' ? {
       role: 'heading',
       'aria-level': level
     } : {};
+    const headingBase = className?.trim() ? DISPLAY_FONT_FAMILY : HEADING_TYPOGRAPHY;
     return /*#__PURE__*/(0, _jsxRuntime.jsx)(Text, {
       ...extraProps,
       ...rest,
-      style: [HEADING_STYLE, style]
+      className: className,
+      style: [headingBase, style]
     });
   };
 }
@@ -115,20 +130,24 @@ const H6 = exports.H6 = createHeadingElement({
   level: 6
 });
 H6.displayName = 'H6';
+const DEFAULT_PARAGRAPH_TYPOGRAPHY = {
+  fontSize: 15,
+  lineHeight: 15 * 1.625
+};
 function P({
   style,
+  className,
   ...rest
 }) {
   const extraProps = _reactNative.Platform.OS === 'web' ? {
     role: 'paragraph'
   } : {};
+  const paragraphDefaults = (0, _defaults.typographyDefaultsWhenNoClassName)(className, DEFAULT_PARAGRAPH_TYPOGRAPHY);
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(Text, {
     ...extraProps,
     ...rest,
-    style: [{
-      fontSize: 15,
-      lineHeight: 15 * 1.625
-    }, style]
+    className: className,
+    style: [paragraphDefaults, style]
   });
 }
 P.displayName = 'P';

package/lib/commonjs/typography/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireWildcard","require","_reactNative","_useTheme","_tokens","_jsxRuntime","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","fontFamilyStyle","kind","Platform","OS","fontFamily","SANS_FONT_FAMILY","DISPLAY_FONT_FAMILY","TextComponent","Text","children","style","rest","colors","useTheme","jsx","fontSize","color","text","exports","Span","memo","displayName","HEADING_STYLE","fontWeight","createHeadingElement","level","HeadingElement","extraProps","role","H1","H2","H3","H4","H5","H6","P","lineHeight"],"sourceRoot":"../../../src","sources":["typography/index.tsx"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["_react","_interopRequireWildcard","require","_reactNative","_useTheme","_tokens","_defaults","_styledText","_jsxRuntime","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","fontFamilyStyle","kind","Platform","OS","fontFamily","SANS_FONT_FAMILY","DISPLAY_FONT_FAMILY","DEFAULT_TEXT_TYPOGRAPHY","fontSize","TextComponent","Text","children","style","className","rest","colors","useTheme","InteropText","getInteropText","interopActive","hasTypographyClassNameInterop","resolvedClassName","trim","undefined","jsx","mergeTypographyStyle","color","text","exports","Span","memo","displayName","HEADING_TYPOGRAPHY","fontWeight","createHeadingElement","level","HeadingElement","extraProps","role","headingBase","H1","H2","H3","H4","H5","H6","DEFAULT_PARAGRAPH_TYPOGRAPHY","lineHeight","P","paragraphDefaults","typographyDefaultsWhenNoClassName"],"sourceRoot":"../../../src","sources":["typography/index.tsx"],"mappings":";;;;;;;;;;;;;;AAAA,IAAAA,MAAA,GAAAC,uBAAA,CAAAC,OAAA;AACA,IAAAC,YAAA,GAAAD,OAAA;AAMA,IAAAE,SAAA,GAAAF,OAAA;AACA,IAAAG,OAAA,GAAAH,OAAA;AACA,IAAAI,SAAA,GAAAJ,OAAA;AACA,IAAAK,WAAA,GAAAL,OAAA;AAA8E,IAAAM,WAAA,GAAAN,OAAA;AAAA,SAAAD,wBAAAQ,CAAA,EAAAC,CAAA,6BAAAC,OAAA,MAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAV,uBAAA,YAAAA,CAAAQ,CAAA,EAAAC,CAAA,SAAAA,CAAA,IAAAD,CAAA,IAAAA,CAAA,CAAAK,UAAA,SAAAL,CAAA,MAAAM,CAAA,EAAAC,CAAA,EAAAC,CAAA,KAAAC,SAAA,QAAAC,OAAA,EAAAV,CAAA,iBAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,SAAAQ,CAAA,MAAAF,CAAA,GAAAL,CAAA,GAAAG,CAAA,GAAAD,CAAA,QAAAG,CAAA,CAAAK,GAAA,CAAAX,CAAA,UAAAM,CAAA,CAAAM,GAAA,CAAAZ,CAAA,GAAAM,CAAA,CAAAO,GAAA,CAAAb,CAAA,EAAAQ,CAAA,gBAAAP,CAAA,IAAAD,CAAA,gBAAAC,CAAA,OAAAa,cAAA,CAAAC,IAAA,CAAAf,CAAA,EAAAC,CAAA,OAAAM,CAAA,IAAAD,CAAA,GAAAU,MAAA,CAAAC,cAAA,KAAAD,MAAA,CAAAE,wBAAA,CAAAlB,CAAA,EAAAC,CAAA,OAAAM,CAAA,CAAAK,GAAA,IAAAL,CAAA,CAAAM,GAAA,IAAAP,CAAA,CAAAE,CAAA,EAAAP,CAAA,EAAAM,CAAA,IAAAC,CAAA,CAAAP,CAAA,IAAAD,CAAA,CAAAC,CAAA,WAAAO,CAAA,KAAAR,CAAA,EAAAC,CAAA;AAM9E;AACA;AACA;AACA;AACA;AACA;AACA,SAASkB,eAAeA,CACtBC,IAAiC,EACT;EACxB,IAAIC,qBAAQ,CAACC,EAAE,KAAK,KAAK,EAAE;IACzB,OAAO;MAAEC,UAAU,EAAE,oBAAoBH,IAAI;IAAI,CAAC;EACpD;EACA,IAAIA,IAAI,KAAK,MAAM,EAAE,OAAO;IAAEG,UAAU,EAAE;EAAa,CAAC;EACxD;EACA;EACA;EACA;EACA;EACA,OAAO;IAAEA,UAAU,EAAE;EAAiB,CAAC;AACzC;AAEA,MAAMC,gBAAgB,GAAGL,eAAe,CAAC,MAAM,CAAC;AAChD,MAAMM,mBAAmB,GAAGN,eAAe,CAAC,SAAS,CAAC;AAEtD,MAAMO,uBAAkC,GAAG;EACzCC,QAAQ,EAAE;AACZ,CAAC;;AAED;AACA;AACA;AACA;AACA;AACA,MAAMC,aAAa,GAAG,SAASC,IAAIA,CAAC;EAAEC,QAAQ;EAAEC,KAAK;EAAEC,SAAS;EAAE,GAAGC;AAAgB,CAAC,EAAE;EACtF,MAAM;IAAEC;EAAO,CAAC,GAAG,IAAAC,kBAAQ,EAAC,CAAC;EAC7B,MAAMC,WAAW,GAAG,IAAAC,0BAAc,EAAC,CAAC;EACpC,MAAMC,aAAa,GAAG,IAAAC,yCAA6B,EAAC,CAAC;EAErD,MAAMC,iBAAiB,GAAGF,aAAa,IAAIN,SAAS,EAAES,IAAI,CAAC,CAAC,GAAGT,SAAS,GAAGU,SAAS;EAEpF,oBACE,IAAA3C,WAAA,CAAA4C,GAAA,EAACP,WAAW;IAAA,GACNH,IAAI;IAAA,IACHO,iBAAiB,GAAG;MAAER,SAAS,EAAEQ;IAAkB,CAAC,GAAG,CAAC,CAAC;IAC9DT,KAAK,EAAE,IAAAa,8BAAoB,EACzBJ,iBAAiB,EACjB;MAAE,GAAGd,uBAAuB;MAAEmB,KAAK,EAAEX,MAAM,CAACY;IAAK,CAAC,EAClDtB,gBAAgB,EAChBO,KACF,CAAE;IAAAD,QAAA,EAEDA;EAAQ,CACE,CAAC;AAElB,CAAC;AAEM,MAAMD,IAAI,GAAAkB,OAAA,CAAAC,IAAA,GAAAD,OAAA,CAAAlB,IAAA,gBAAG,IAAAoB,WAAI,EAACrB,aAAa,CAAC;AACvCC,IAAI,CAACqB,WAAW,GAAG,MAAM;AAIzB,MAAMC,kBAA6B,GAAG;EACpC,GAAG1B,mBAAmB;EACtB2B,UAAU,EAAE;AACd,CAAC;AAED,SAASC,oBAAoBA,CAAC;EAAEC;AAAyB,CAAC,EAAuB;EAC/E,OAAO,SAASC,cAAcA,CAAC;IAAExB,KAAK;IAAEC,SAAS;IAAE,GAAGC;EAAgB,CAAC,EAAE;IACvE,MAAMuB,UAAmC,GACvCnC,qBAAQ,CAACC,EAAE,KAAK,KAAK,GACjB;MAAEmC,IAAI,EAAE,SAAS;MAAE,YAAY,EAAEH;IAAM,CAAC,GACxC,CAAC,CAAC;IAER,MAAMI,WAAW,GAAG1B,SAAS,EAAES,IAAI,CAAC,CAAC,GACjChB,mBAAmB,GACnB0B,kBAAkB;IAEtB,oBACE,IAAApD,WAAA,CAAA4C,GAAA,EAACd,IAAI;MAAA,GACC2B,UAAU;MAAA,GACVvB,IAAI;MACRD,SAAS,EAAEA,SAAU;MACrBD,KAAK,EAAE,CAAC2B,WAAW,EAAE3B,KAAK;IAAE,CAC7B,CAAC;EAEN,CAAC;AACH;AAEO,MAAM4B,EAAE,GAAAZ,OAAA,CAAAY,EAAA,GAAGN,oBAAoB,CAAC;EAAEC,KAAK,EAAE;AAAE,CAAC,CAAC;AACpDK,EAAE,CAACT,WAAW,GAAG,IAAI;AACd,MAAMU,EAAE,GAAAb,OAAA,CAAAa,EAAA,GAAGP,oBAAoB,CAAC;EAAEC,KAAK,EAAE;AAAE,CAAC,CAAC;AACpDM,EAAE,CAACV,WAAW,GAAG,IAAI;AACd,MAAMW,EAAE,GAAAd,OAAA,CAAAc,EAAA,GAAGR,oBAAoB,CAAC;EAAEC,KAAK,EAAE;AAAE,CAAC,CAAC;AACpDO,EAAE,CAACX,WAAW,GAAG,IAAI;AACd,MAAMY,EAAE,GAAAf,OAAA,CAAAe,EAAA,GAAGT,oBAAoB,CAAC;EAAEC,KAAK,EAAE;AAAE,CAAC,CAAC;AACpDQ,EAAE,CAACZ,WAAW,GAAG,IAAI;AACd,MAAMa,EAAE,GAAAhB,OAAA,CAAAgB,EAAA,GAAGV,oBAAoB,CAAC;EAAEC,KAAK,EAAE;AAAE,CAAC,CAAC;AACpDS,EAAE,CAACb,WAAW,GAAG,IAAI;AACd,MAAMc,EAAE,GAAAjB,OAAA,CAAAiB,EAAA,GAAGX,oBAAoB,CAAC;EAAEC,KAAK,EAAE;AAAE,CAAC,CAAC;AACpDU,EAAE,CAACd,WAAW,GAAG,IAAI;AAErB,MAAMe,4BAAuC,GAAG;EAC9CtC,QAAQ,EAAE,EAAE;EACZuC,UAAU,EAAE,EAAE,GAAG;AACnB,CAAC;AAEM,SAASC,CAACA,CAAC;EAAEpC,KAAK;EAAEC,SAAS;EAAE,GAAGC;AAAgB,CAAC,EAAE;EAC1D,MAAMuB,UAAmC,GACvCnC,qBAAQ,CAACC,EAAE,KAAK,KAAK,GAAG;IAAEmC,IAAI,EAAE;EAAY,CAAC,GAAG,CAAC,CAAC;EACpD,MAAMW,iBAAiB,GAAG,IAAAC,2CAAiC,EACzDrC,SAAS,EACTiC,4BACF,CAAC;EACD,oBACE,IAAAlE,WAAA,CAAA4C,GAAA,EAACd,IAAI;IAAA,GACC2B,UAAU;IAAA,GACVvB,IAAI;IACRD,SAAS,EAAEA,SAAU;IACrBD,KAAK,EAAE,CAACqC,iBAAiB,EAAErC,KAAK;EAAE,CACnC,CAAC;AAEN;AACAoC,CAAC,CAACjB,WAAW,GAAG,GAAG","ignoreList":[]}

package/lib/commonjs/typography/styled-text.js

@@ -0,0 +1,36 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getInteropText = getInteropText;
+exports.hasTypographyClassNameInterop = hasTypographyClassNameInterop;
+var _reactNative = require("react-native");
+var _lazyRequire = require("../utils/lazy-require.js");
+const getNativeWind = (0, _lazyRequire.lazyRequire)('nativewind');
+let interopText = _reactNative.Text;
+
+/**
+ * RN `Text` wired for NativeWind `className` → `style` interop when
+ * `nativewind` is installed in the consumer. Falls back to plain `RNText`
+ * otherwise (className is ignored upstream).
+ */
+function getInteropText() {
+  if (interopText !== _reactNative.Text) {
+    return interopText;
+  }
+  const nativewind = getNativeWind();
+  if (nativewind?.styled) {
+    interopText = nativewind.styled(_reactNative.Text, {
+      className: 'style'
+    });
+  }
+  return interopText;
+}
+
+/** True when className interop is active (nativewind present). */
+function hasTypographyClassNameInterop() {
+  getInteropText();
+  return interopText !== _reactNative.Text;
+}
+//# sourceMappingURL=styled-text.js.map

package/lib/commonjs/typography/styled-text.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_reactNative","require","_lazyRequire","getNativeWind","lazyRequire","interopText","RNText","getInteropText","nativewind","styled","className","hasTypographyClassNameInterop"],"sourceRoot":"../../../src","sources":["typography/styled-text.ts"],"mappings":";;;;;;;AACA,IAAAA,YAAA,GAAAC,OAAA;AAEA,IAAAC,YAAA,GAAAD,OAAA;AAWA,MAAME,aAAa,GAAG,IAAAC,wBAAW,EAAmB,YAAY,CAAC;AAEjE,IAAIC,WAAgC,GAAGC,iBAAM;;AAE7C;AACA;AACA;AACA;AACA;AACO,SAASC,cAAcA,CAAA,EAAwB;EACpD,IAAIF,WAAW,KAAKC,iBAAM,EAAE;IAC1B,OAAOD,WAAW;EACpB;EAEA,MAAMG,UAAU,GAAGL,aAAa,CAAC,CAAC;EAClC,IAAIK,UAAU,EAAEC,MAAM,EAAE;IACtBJ,WAAW,GAAGG,UAAU,CAACC,MAAM,CAACH,iBAAM,EAAE;MAAEI,SAAS,EAAE;IAAQ,CAAC,CAAC;EACjE;EAEA,OAAOL,WAAW;AACpB;;AAEA;AACO,SAASM,6BAA6BA,CAAA,EAAY;EACvDJ,cAAc,CAAC,CAAC;EAChB,OAAOF,WAAW,KAAKC,iBAAM;AAC/B","ignoreList":[]}

package/lib/module/typography/defaults.js

@@ -0,0 +1,17 @@
+"use strict";
+
+/**
+ * Bloom typography defaults are applied via inline `style` only when the caller
+ * does not pass `className`. When `className` is present, NativeWind compiles
+ * font-size / line-height / weight / color utilities into `style` first; inline
+ * defaults that repeat those keys would win the merge and silently override the
+ * utilities (the Homiio hero-title bug).
+ */
+export function typographyDefaultsWhenNoClassName(className, defaults) {
+  return className?.trim() ? undefined : defaults;
+}
+export function mergeTypographyStyle(className, defaults, base, style) {
+  const resolvedDefaults = defaults ? typographyDefaultsWhenNoClassName(className, defaults) : undefined;
+  return [resolvedDefaults, base, style];
+}
+//# sourceMappingURL=defaults.js.map

package/lib/module/typography/defaults.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["typographyDefaultsWhenNoClassName","className","defaults","trim","undefined","mergeTypographyStyle","base","style","resolvedDefaults"],"sourceRoot":"../../../src","sources":["typography/defaults.ts"],"mappings":";;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASA,iCAAiCA,CAC/CC,SAA6B,EAC7BC,QAAmB,EACI;EACvB,OAAOD,SAAS,EAAEE,IAAI,CAAC,CAAC,GAAGC,SAAS,GAAGF,QAAQ;AACjD;AAEA,OAAO,SAASG,oBAAoBA,CAClCJ,SAA6B,EAC7BC,QAA+B,EAC/BI,IAA0B,EAC1BC,KAAuC,EACjB;EACtB,MAAMC,gBAAgB,GAAGN,QAAQ,GAC7BF,iCAAiC,CAACC,SAAS,EAAEC,QAAQ,CAAC,GACtDE,SAAS;EAEb,OAAO,CAACI,gBAAgB,EAAEF,IAAI,EAAEC,KAAK,CAAC;AACxC","ignoreList":[]}

package/lib/module/typography/index.js

@@ -1,9 +1,11 @@
 "use strict";
 
 import React, { memo } from 'react';
-import { Text as RNText, Platform } from 'react-native';
+import { Platform } from 'react-native';
 import { useTheme } from "../theme/use-theme.js";
 import { fontFamilies } from "../fonts/tokens.js";
+import { mergeTypographyStyle, typographyDefaultsWhenNoClassName } from "./defaults.js";
+import { getInteropText, hasTypographyClassNameInterop } from "./styled-text.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 /**
  * Platform-aware font-family value. On web we resolve to the CSS custom
@@ -31,33 +33,43 @@ function fontFamilyStyle(kind) {
 }
 const SANS_FONT_FAMILY = fontFamilyStyle('sans');
 const DISPLAY_FONT_FAMILY = fontFamilyStyle('display');
+const DEFAULT_TEXT_TYPOGRAPHY = {
+  fontSize: 13
+};
 
 /**
  * Base text component with theme-aware default color and the Bloom sans
- * font family applied.
+ * font family applied. NativeWind `className` utilities (text-*, font-*,
+ * leading-*, text-foreground, …) override defaults when provided.
  */
 const TextComponent = function Text({
   children,
   style,
+  className,
   ...rest
 }) {
   const {
     colors
   } = useTheme();
-  return /*#__PURE__*/_jsx(RNText, {
+  const InteropText = getInteropText();
+  const interopActive = hasTypographyClassNameInterop();
+  const resolvedClassName = interopActive && className?.trim() ? className : undefined;
+  return /*#__PURE__*/_jsx(InteropText, {
     ...rest,
-    style: [{
-      fontSize: 13,
-      color: colors.text,
-      ...SANS_FONT_FAMILY
-    }, style],
+    ...(resolvedClassName ? {
+      className: resolvedClassName
+    } : {}),
+    style: mergeTypographyStyle(resolvedClassName, {
+      ...DEFAULT_TEXT_TYPOGRAPHY,
+      color: colors.text
+    }, SANS_FONT_FAMILY, style),
     children: children
   });
 };
 export const Text = /*#__PURE__*/memo(TextComponent);
 Text.displayName = 'Text';
 export { Text as Span };
-const HEADING_STYLE = {
+const HEADING_TYPOGRAPHY = {
   ...DISPLAY_FONT_FAMILY,
   fontWeight: '700'
 };
@@ -66,16 +78,19 @@ function createHeadingElement({
 }) {
   return function HeadingElement({
     style,
+    className,
     ...rest
   }) {
     const extraProps = Platform.OS === 'web' ? {
       role: 'heading',
       'aria-level': level
     } : {};
+    const headingBase = className?.trim() ? DISPLAY_FONT_FAMILY : HEADING_TYPOGRAPHY;
     return /*#__PURE__*/_jsx(Text, {
       ...extraProps,
       ...rest,
-      style: [HEADING_STYLE, style]
+      className: className,
+      style: [headingBase, style]
     });
   };
 }
@@ -103,20 +118,24 @@ export const H6 = createHeadingElement({
   level: 6
 });
 H6.displayName = 'H6';
+const DEFAULT_PARAGRAPH_TYPOGRAPHY = {
+  fontSize: 15,
+  lineHeight: 15 * 1.625
+};
 export function P({
   style,
+  className,
   ...rest
 }) {
   const extraProps = Platform.OS === 'web' ? {
     role: 'paragraph'
   } : {};
+  const paragraphDefaults = typographyDefaultsWhenNoClassName(className, DEFAULT_PARAGRAPH_TYPOGRAPHY);
   return /*#__PURE__*/_jsx(Text, {
     ...extraProps,
     ...rest,
-    style: [{
-      fontSize: 15,
-      lineHeight: 15 * 1.625
-    }, style]
+    className: className,
+    style: [paragraphDefaults, style]
   });
 }
 P.displayName = 'P';

package/lib/module/typography/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","memo","Text","RNText","Platform","useTheme","fontFamilies","jsx","_jsx","fontFamilyStyle","kind","OS","fontFamily","SANS_FONT_FAMILY","DISPLAY_FONT_FAMILY","TextComponent","children","style","rest","colors","fontSize","color","text","displayName","Span","HEADING_STYLE","fontWeight","createHeadingElement","level","HeadingElement","extraProps","role","H1","H2","H3","H4","H5","H6","P","lineHeight"],"sourceRoot":"../../../src","sources":["typography/index.tsx"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["React","memo","Platform","useTheme","fontFamilies","mergeTypographyStyle","typographyDefaultsWhenNoClassName","getInteropText","hasTypographyClassNameInterop","jsx","_jsx","fontFamilyStyle","kind","OS","fontFamily","SANS_FONT_FAMILY","DISPLAY_FONT_FAMILY","DEFAULT_TEXT_TYPOGRAPHY","fontSize","TextComponent","Text","children","style","className","rest","colors","InteropText","interopActive","resolvedClassName","trim","undefined","color","text","displayName","Span","HEADING_TYPOGRAPHY","fontWeight","createHeadingElement","level","HeadingElement","extraProps","role","headingBase","H1","H2","H3","H4","H5","H6","DEFAULT_PARAGRAPH_TYPOGRAPHY","lineHeight","P","paragraphDefaults"],"sourceRoot":"../../../src","sources":["typography/index.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/typography/styled-text.js

@@ -0,0 +1,31 @@
+"use strict";
+
+import { Text as RNText } from 'react-native';
+import { lazyRequire } from "../utils/lazy-require.js";
+const getNativeWind = lazyRequire('nativewind');
+let interopText = RNText;
+
+/**
+ * RN `Text` wired for NativeWind `className` → `style` interop when
+ * `nativewind` is installed in the consumer. Falls back to plain `RNText`
+ * otherwise (className is ignored upstream).
+ */
+export function getInteropText() {
+  if (interopText !== RNText) {
+    return interopText;
+  }
+  const nativewind = getNativeWind();
+  if (nativewind?.styled) {
+    interopText = nativewind.styled(RNText, {
+      className: 'style'
+    });
+  }
+  return interopText;
+}
+
+/** True when className interop is active (nativewind present). */
+export function hasTypographyClassNameInterop() {
+  getInteropText();
+  return interopText !== RNText;
+}
+//# sourceMappingURL=styled-text.js.map

package/lib/module/typography/styled-text.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["Text","RNText","lazyRequire","getNativeWind","interopText","getInteropText","nativewind","styled","className","hasTypographyClassNameInterop"],"sourceRoot":"../../../src","sources":["typography/styled-text.ts"],"mappings":";;AACA,SAASA,IAAI,IAAIC,MAAM,QAAwB,cAAc;AAE7D,SAASC,WAAW,QAAQ,0BAAuB;AAWnD,MAAMC,aAAa,GAAGD,WAAW,CAAmB,YAAY,CAAC;AAEjE,IAAIE,WAAgC,GAAGH,MAAM;;AAE7C;AACA;AACA;AACA;AACA;AACA,OAAO,SAASI,cAAcA,CAAA,EAAwB;EACpD,IAAID,WAAW,KAAKH,MAAM,EAAE;IAC1B,OAAOG,WAAW;EACpB;EAEA,MAAME,UAAU,GAAGH,aAAa,CAAC,CAAC;EAClC,IAAIG,UAAU,EAAEC,MAAM,EAAE;IACtBH,WAAW,GAAGE,UAAU,CAACC,MAAM,CAACN,MAAM,EAAE;MAAEO,SAAS,EAAE;IAAQ,CAAC,CAAC;EACjE;EAEA,OAAOJ,WAAW;AACpB;;AAEA;AACA,OAAO,SAASK,6BAA6BA,CAAA,EAAY;EACvDJ,cAAc,CAAC,CAAC;EAChB,OAAOD,WAAW,KAAKH,MAAM;AAC/B","ignoreList":[]}

package/lib/typescript/commonjs/typography/defaults.d.ts

@@ -0,0 +1,11 @@
+import type { StyleProp, TextStyle } from 'react-native';
+/**
+ * Bloom typography defaults are applied via inline `style` only when the caller
+ * does not pass `className`. When `className` is present, NativeWind compiles
+ * font-size / line-height / weight / color utilities into `style` first; inline
+ * defaults that repeat those keys would win the merge and silently override the
+ * utilities (the Homiio hero-title bug).
+ */
+export declare function typographyDefaultsWhenNoClassName(className: string | undefined, defaults: TextStyle): TextStyle | undefined;
+export declare function mergeTypographyStyle(className: string | undefined, defaults: TextStyle | undefined, base: StyleProp<TextStyle>, style: StyleProp<TextStyle> | undefined): StyleProp<TextStyle>;
+//# sourceMappingURL=defaults.d.ts.map

package/lib/typescript/commonjs/typography/defaults.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"defaults.d.ts","sourceRoot":"","sources":["../../../../src/typography/defaults.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAEzD;;;;;;GAMG;AACH,wBAAgB,iCAAiC,CAC/C,SAAS,EAAE,MAAM,GAAG,SAAS,EAC7B,QAAQ,EAAE,SAAS,GAClB,SAAS,GAAG,SAAS,CAEvB;AAED,wBAAgB,oBAAoB,CAClC,SAAS,EAAE,MAAM,GAAG,SAAS,EAC7B,QAAQ,EAAE,SAAS,GAAG,SAAS,EAC/B,IAAI,EAAE,SAAS,CAAC,SAAS,CAAC,EAC1B,KAAK,EAAE,SAAS,CAAC,SAAS,CAAC,GAAG,SAAS,GACtC,SAAS,CAAC,SAAS,CAAC,CAMtB"}

package/lib/typescript/commonjs/typography/index.d.ts

@@ -1,16 +1,18 @@
 import React from 'react';
 import { type TextProps as RNTextProps } from 'react-native';
 import { fontFamilies } from '../fonts/tokens';
-export type TextProps = RNTextProps;
-export declare const Text: React.MemoExoticComponent<({ children, style, ...rest }: TextProps) => import("react/jsx-runtime").JSX.Element>;
+export type TextProps = RNTextProps & {
+    className?: string;
+};
+export declare const Text: React.MemoExoticComponent<({ children, style, className, ...rest }: TextProps) => import("react/jsx-runtime").JSX.Element>;
 export { Text as Span };
-export declare const H1: React.FC<RNTextProps>;
-export declare const H2: React.FC<RNTextProps>;
-export declare const H3: React.FC<RNTextProps>;
-export declare const H4: React.FC<RNTextProps>;
-export declare const H5: React.FC<RNTextProps>;
-export declare const H6: React.FC<RNTextProps>;
-export declare function P({ style, ...rest }: TextProps): import("react/jsx-runtime").JSX.Element;
+export declare const H1: React.FC<TextProps>;
+export declare const H2: React.FC<TextProps>;
+export declare const H3: React.FC<TextProps>;
+export declare const H4: React.FC<TextProps>;
+export declare const H5: React.FC<TextProps>;
+export declare const H6: React.FC<TextProps>;
+export declare function P({ style, className, ...rest }: TextProps): import("react/jsx-runtime").JSX.Element;
 export declare namespace P {
     var displayName: string;
 }

package/lib/typescript/commonjs/typography/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/typography/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAe,MAAM,OAAO,CAAC;AACpC,OAAO,EAEL,KAAK,SAAS,IAAI,WAAW,EAI9B,MAAM,cAAc,CAAC;AAGtB,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAE/C,MAAM,MAAM,SAAS,GAAG,WAAW,CAAC;AA0CpC,eAAO,MAAM,IAAI,2DAZiD,SAAS,6CAYpC,CAAC;AAGxC,OAAO,EAAE,IAAI,IAAI,IAAI,EAAE,CAAC;AAiBxB,eAAO,MAAM,EAAE,uBAAqC,CAAC;AAErD,eAAO,MAAM,EAAE,uBAAqC,CAAC;AAErD,eAAO,MAAM,EAAE,uBAAqC,CAAC;AAErD,eAAO,MAAM,EAAE,uBAAqC,CAAC;AAErD,eAAO,MAAM,EAAE,uBAAqC,CAAC;AAErD,eAAO,MAAM,EAAE,uBAAqC,CAAC;AAGrD,wBAAgB,CAAC,CAAC,EAAE,KAAK,EAAE,GAAG,IAAI,EAAE,EAAE,SAAS,2CAU9C;yBAVe,CAAC;;;AAajB,OAAO,EAAE,YAAY,EAAE,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/typography/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAe,MAAM,OAAO,CAAC;AACpC,OAAO,EACL,KAAK,SAAS,IAAI,WAAW,EAG9B,MAAM,cAAc,CAAC;AAGtB,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAI/C,MAAM,MAAM,SAAS,GAAG,WAAW,GAAG;IACpC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AA0DF,eAAO,MAAM,IAAI,sEAvB4D,SAAS,6CAuB/C,CAAC;AAGxC,OAAO,EAAE,IAAI,IAAI,IAAI,EAAE,CAAC;AA6BxB,eAAO,MAAM,EAAE,qBAAqC,CAAC;AAErD,eAAO,MAAM,EAAE,qBAAqC,CAAC;AAErD,eAAO,MAAM,EAAE,qBAAqC,CAAC;AAErD,eAAO,MAAM,EAAE,qBAAqC,CAAC;AAErD,eAAO,MAAM,EAAE,qBAAqC,CAAC;AAErD,eAAO,MAAM,EAAE,qBAAqC,CAAC;AAQrD,wBAAgB,CAAC,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,EAAE,SAAS,2CAezD;yBAfe,CAAC;;;AAkBjB,OAAO,EAAE,YAAY,EAAE,CAAC"}

package/lib/typescript/commonjs/typography/styled-text.d.ts

@@ -0,0 +1,15 @@
+import type { ComponentType } from 'react';
+import { type TextProps } from 'react-native';
+type StyledTextComponent = ComponentType<TextProps & {
+    className?: string;
+}>;
+/**
+ * RN `Text` wired for NativeWind `className` → `style` interop when
+ * `nativewind` is installed in the consumer. Falls back to plain `RNText`
+ * otherwise (className is ignored upstream).
+ */
+export declare function getInteropText(): StyledTextComponent;
+/** True when className interop is active (nativewind present). */
+export declare function hasTypographyClassNameInterop(): boolean;
+export {};
+//# sourceMappingURL=styled-text.d.ts.map

package/lib/typescript/commonjs/typography/styled-text.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"styled-text.d.ts","sourceRoot":"","sources":["../../../../src/typography/styled-text.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAC3C,OAAO,EAAkB,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AAI9D,KAAK,mBAAmB,GAAG,aAAa,CAAC,SAAS,GAAG;IAAE,SAAS,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC,CAAC;AAa7E;;;;GAIG;AACH,wBAAgB,cAAc,IAAI,mBAAmB,CAWpD;AAED,kEAAkE;AAClE,wBAAgB,6BAA6B,IAAI,OAAO,CAGvD"}

package/lib/typescript/module/typography/defaults.d.ts

@@ -0,0 +1,11 @@
+import type { StyleProp, TextStyle } from 'react-native';
+/**
+ * Bloom typography defaults are applied via inline `style` only when the caller
+ * does not pass `className`. When `className` is present, NativeWind compiles
+ * font-size / line-height / weight / color utilities into `style` first; inline
+ * defaults that repeat those keys would win the merge and silently override the
+ * utilities (the Homiio hero-title bug).
+ */
+export declare function typographyDefaultsWhenNoClassName(className: string | undefined, defaults: TextStyle): TextStyle | undefined;
+export declare function mergeTypographyStyle(className: string | undefined, defaults: TextStyle | undefined, base: StyleProp<TextStyle>, style: StyleProp<TextStyle> | undefined): StyleProp<TextStyle>;
+//# sourceMappingURL=defaults.d.ts.map

package/lib/typescript/module/typography/defaults.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"defaults.d.ts","sourceRoot":"","sources":["../../../../src/typography/defaults.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAEzD;;;;;;GAMG;AACH,wBAAgB,iCAAiC,CAC/C,SAAS,EAAE,MAAM,GAAG,SAAS,EAC7B,QAAQ,EAAE,SAAS,GAClB,SAAS,GAAG,SAAS,CAEvB;AAED,wBAAgB,oBAAoB,CAClC,SAAS,EAAE,MAAM,GAAG,SAAS,EAC7B,QAAQ,EAAE,SAAS,GAAG,SAAS,EAC/B,IAAI,EAAE,SAAS,CAAC,SAAS,CAAC,EAC1B,KAAK,EAAE,SAAS,CAAC,SAAS,CAAC,GAAG,SAAS,GACtC,SAAS,CAAC,SAAS,CAAC,CAMtB"}

package/lib/typescript/module/typography/index.d.ts

@@ -1,16 +1,18 @@
 import React from 'react';
 import { type TextProps as RNTextProps } from 'react-native';
 import { fontFamilies } from '../fonts/tokens';
-export type TextProps = RNTextProps;
-export declare const Text: React.MemoExoticComponent<({ children, style, ...rest }: TextProps) => import("react/jsx-runtime").JSX.Element>;
+export type TextProps = RNTextProps & {
+    className?: string;
+};
+export declare const Text: React.MemoExoticComponent<({ children, style, className, ...rest }: TextProps) => import("react/jsx-runtime").JSX.Element>;
 export { Text as Span };
-export declare const H1: React.FC<RNTextProps>;
-export declare const H2: React.FC<RNTextProps>;
-export declare const H3: React.FC<RNTextProps>;
-export declare const H4: React.FC<RNTextProps>;
-export declare const H5: React.FC<RNTextProps>;
-export declare const H6: React.FC<RNTextProps>;
-export declare function P({ style, ...rest }: TextProps): import("react/jsx-runtime").JSX.Element;
+export declare const H1: React.FC<TextProps>;
+export declare const H2: React.FC<TextProps>;
+export declare const H3: React.FC<TextProps>;
+export declare const H4: React.FC<TextProps>;
+export declare const H5: React.FC<TextProps>;
+export declare const H6: React.FC<TextProps>;
+export declare function P({ style, className, ...rest }: TextProps): import("react/jsx-runtime").JSX.Element;
 export declare namespace P {
     var displayName: string;
 }

package/lib/typescript/module/typography/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/typography/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAe,MAAM,OAAO,CAAC;AACpC,OAAO,EAEL,KAAK,SAAS,IAAI,WAAW,EAI9B,MAAM,cAAc,CAAC;AAGtB,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAE/C,MAAM,MAAM,SAAS,GAAG,WAAW,CAAC;AA0CpC,eAAO,MAAM,IAAI,2DAZiD,SAAS,6CAYpC,CAAC;AAGxC,OAAO,EAAE,IAAI,IAAI,IAAI,EAAE,CAAC;AAiBxB,eAAO,MAAM,EAAE,uBAAqC,CAAC;AAErD,eAAO,MAAM,EAAE,uBAAqC,CAAC;AAErD,eAAO,MAAM,EAAE,uBAAqC,CAAC;AAErD,eAAO,MAAM,EAAE,uBAAqC,CAAC;AAErD,eAAO,MAAM,EAAE,uBAAqC,CAAC;AAErD,eAAO,MAAM,EAAE,uBAAqC,CAAC;AAGrD,wBAAgB,CAAC,CAAC,EAAE,KAAK,EAAE,GAAG,IAAI,EAAE,EAAE,SAAS,2CAU9C;yBAVe,CAAC;;;AAajB,OAAO,EAAE,YAAY,EAAE,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/typography/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAe,MAAM,OAAO,CAAC;AACpC,OAAO,EACL,KAAK,SAAS,IAAI,WAAW,EAG9B,MAAM,cAAc,CAAC;AAGtB,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAI/C,MAAM,MAAM,SAAS,GAAG,WAAW,GAAG;IACpC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AA0DF,eAAO,MAAM,IAAI,sEAvB4D,SAAS,6CAuB/C,CAAC;AAGxC,OAAO,EAAE,IAAI,IAAI,IAAI,EAAE,CAAC;AA6BxB,eAAO,MAAM,EAAE,qBAAqC,CAAC;AAErD,eAAO,MAAM,EAAE,qBAAqC,CAAC;AAErD,eAAO,MAAM,EAAE,qBAAqC,CAAC;AAErD,eAAO,MAAM,EAAE,qBAAqC,CAAC;AAErD,eAAO,MAAM,EAAE,qBAAqC,CAAC;AAErD,eAAO,MAAM,EAAE,qBAAqC,CAAC;AAQrD,wBAAgB,CAAC,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,EAAE,SAAS,2CAezD;yBAfe,CAAC;;;AAkBjB,OAAO,EAAE,YAAY,EAAE,CAAC"}

package/lib/typescript/module/typography/styled-text.d.ts

@@ -0,0 +1,15 @@
+import type { ComponentType } from 'react';
+import { type TextProps } from 'react-native';
+type StyledTextComponent = ComponentType<TextProps & {
+    className?: string;
+}>;
+/**
+ * RN `Text` wired for NativeWind `className` → `style` interop when
+ * `nativewind` is installed in the consumer. Falls back to plain `RNText`
+ * otherwise (className is ignored upstream).
+ */
+export declare function getInteropText(): StyledTextComponent;
+/** True when className interop is active (nativewind present). */
+export declare function hasTypographyClassNameInterop(): boolean;
+export {};
+//# sourceMappingURL=styled-text.d.ts.map

package/lib/typescript/module/typography/styled-text.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"styled-text.d.ts","sourceRoot":"","sources":["../../../../src/typography/styled-text.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAC3C,OAAO,EAAkB,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AAI9D,KAAK,mBAAmB,GAAG,aAAa,CAAC,SAAS,GAAG;IAAE,SAAS,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC,CAAC;AAa7E;;;;GAIG;AACH,wBAAgB,cAAc,IAAI,mBAAmB,CAWpD;AAED,kEAAkE;AAClE,wBAAgB,6BAA6B,IAAI,OAAO,CAGvD"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@oxyhq/bloom",
-  "version": "0.29.3",
+  "version": "0.29.4",
   "description": "Bloom UI — Oxy ecosystem component library for React Native + Expo + Web",
   "main": "lib/commonjs/index.js",
   "module": "lib/module/index.js",
@@ -1030,7 +1030,8 @@
     "react-native-safe-area-context": ">=5.0.0",
     "react-native-svg": ">=13.0.0",
     "sonner": ">=2.0.0",
-    "sonner-native": ">=0.17.0"
+    "sonner-native": ">=0.17.0",
+    "nativewind": ">=5.0.0"
   },
   "peerDependenciesMeta": {
     "expo": {
@@ -1056,6 +1057,9 @@
     },
     "sonner-native": {
       "optional": true
+    },
+    "nativewind": {
+      "optional": true
     }
   },
   "react-native-builder-bob": {

package/src/typography/__tests__/defaults.test.ts

@@ -0,0 +1,57 @@
+import {
+  typographyDefaultsWhenNoClassName,
+  mergeTypographyStyle,
+} from '../defaults';
+
+describe('typography defaults', () => {
+  it('omits inline defaults when className is present', () => {
+    expect(
+      typographyDefaultsWhenNoClassName('text-[56px] font-bold', {
+        fontSize: 13,
+        color: 'red',
+      }),
+    ).toBeUndefined();
+  });
+
+  it('keeps inline defaults when className is absent', () => {
+    expect(
+      typographyDefaultsWhenNoClassName(undefined, { fontSize: 13, color: 'red' }),
+    ).toEqual({ fontSize: 13, color: 'red' });
+  });
+
+  it('keeps inline defaults when className is blank', () => {
+    expect(
+      typographyDefaultsWhenNoClassName('   ', { fontSize: 13 }),
+    ).toEqual({ fontSize: 13 });
+  });
+
+  it('merges base font family after optional defaults', () => {
+    expect(
+      mergeTypographyStyle(
+        'text-[56px]',
+        { fontSize: 13, color: 'red' },
+        { fontFamily: 'BlomusModernus' },
+        { letterSpacing: -0.5 },
+      ),
+    ).toEqual([
+      undefined,
+      { fontFamily: 'BlomusModernus' },
+      { letterSpacing: -0.5 },
+    ]);
+  });
+
+  it('includes defaults when className is absent', () => {
+    expect(
+      mergeTypographyStyle(
+        undefined,
+        { fontSize: 13, color: 'red' },
+        { fontFamily: 'BlomusModernus' },
+        undefined,
+      ),
+    ).toEqual([
+      { fontSize: 13, color: 'red' },
+      { fontFamily: 'BlomusModernus' },
+      undefined,
+    ]);
+  });
+});

package/src/typography/defaults.ts

@@ -0,0 +1,28 @@
+import type { StyleProp, TextStyle } from 'react-native';
+
+/**
+ * Bloom typography defaults are applied via inline `style` only when the caller
+ * does not pass `className`. When `className` is present, NativeWind compiles
+ * font-size / line-height / weight / color utilities into `style` first; inline
+ * defaults that repeat those keys would win the merge and silently override the
+ * utilities (the Homiio hero-title bug).
+ */
+export function typographyDefaultsWhenNoClassName(
+  className: string | undefined,
+  defaults: TextStyle,
+): TextStyle | undefined {
+  return className?.trim() ? undefined : defaults;
+}
+
+export function mergeTypographyStyle(
+  className: string | undefined,
+  defaults: TextStyle | undefined,
+  base: StyleProp<TextStyle>,
+  style: StyleProp<TextStyle> | undefined,
+): StyleProp<TextStyle> {
+  const resolvedDefaults = defaults
+    ? typographyDefaultsWhenNoClassName(className, defaults)
+    : undefined;
+
+  return [resolvedDefaults, base, style];
+}

package/src/typography/index.tsx

@@ -1,16 +1,18 @@
 import React, { memo } from 'react';
 import {
-  Text as RNText,
   type TextProps as RNTextProps,
   Platform,
-  type StyleProp,
   type TextStyle,
 } from 'react-native';
 
 import { useTheme } from '../theme/use-theme';
 import { fontFamilies } from '../fonts/tokens';
+import { mergeTypographyStyle, typographyDefaultsWhenNoClassName } from './defaults';
+import { getInteropText, hasTypographyClassNameInterop } from './styled-text';
 
-export type TextProps = RNTextProps;
+export type TextProps = RNTextProps & {
+  className?: string;
+};
 
 /**
  * Platform-aware font-family value. On web we resolve to the CSS custom
@@ -36,19 +38,35 @@ function fontFamilyStyle(
 const SANS_FONT_FAMILY = fontFamilyStyle('sans');
 const DISPLAY_FONT_FAMILY = fontFamilyStyle('display');
 
+const DEFAULT_TEXT_TYPOGRAPHY: TextStyle = {
+  fontSize: 13,
+};
+
 /**
  * Base text component with theme-aware default color and the Bloom sans
- * font family applied.
+ * font family applied. NativeWind `className` utilities (text-*, font-*,
+ * leading-*, text-foreground, …) override defaults when provided.
  */
-const TextComponent = function Text({ children, style, ...rest }: TextProps) {
+const TextComponent = function Text({ children, style, className, ...rest }: TextProps) {
   const { colors } = useTheme();
+  const InteropText = getInteropText();
+  const interopActive = hasTypographyClassNameInterop();
+
+  const resolvedClassName = interopActive && className?.trim() ? className : undefined;
 
   return (
-    <RNText
+    <InteropText
       {...rest}
-      style={[{ fontSize: 13, color: colors.text, ...SANS_FONT_FAMILY }, style]}>
+      {...(resolvedClassName ? { className: resolvedClassName } : {})}
+      style={mergeTypographyStyle(
+        resolvedClassName,
+        { ...DEFAULT_TEXT_TYPOGRAPHY, color: colors.text },
+        SANS_FONT_FAMILY,
+        style,
+      )}
+    >
       {children}
-    </RNText>
+    </InteropText>
   );
 };
 
@@ -57,18 +75,30 @@ Text.displayName = 'Text';
 
 export { Text as Span };
 
-const HEADING_STYLE: StyleProp<TextStyle> = {
+const HEADING_TYPOGRAPHY: TextStyle = {
   ...DISPLAY_FONT_FAMILY,
   fontWeight: '700',
 };
 
 function createHeadingElement({ level }: { level: number }): React.FC<TextProps> {
-  return function HeadingElement({ style, ...rest }: TextProps) {
+  return function HeadingElement({ style, className, ...rest }: TextProps) {
     const extraProps: Record<string, unknown> =
       Platform.OS === 'web'
         ? { role: 'heading', 'aria-level': level }
         : {};
-    return <Text {...extraProps} {...rest} style={[HEADING_STYLE, style]} />;
+
+    const headingBase = className?.trim()
+      ? DISPLAY_FONT_FAMILY
+      : HEADING_TYPOGRAPHY;
+
+    return (
+      <Text
+        {...extraProps}
+        {...rest}
+        className={className}
+        style={[headingBase, style]}
+      />
+    );
   };
 }
 
@@ -85,14 +115,24 @@ H5.displayName = 'H5';
 export const H6 = createHeadingElement({ level: 6 });
 H6.displayName = 'H6';
 
-export function P({ style, ...rest }: TextProps) {
+const DEFAULT_PARAGRAPH_TYPOGRAPHY: TextStyle = {
+  fontSize: 15,
+  lineHeight: 15 * 1.625,
+};
+
+export function P({ style, className, ...rest }: TextProps) {
   const extraProps: Record<string, unknown> =
     Platform.OS === 'web' ? { role: 'paragraph' } : {};
+  const paragraphDefaults = typographyDefaultsWhenNoClassName(
+    className,
+    DEFAULT_PARAGRAPH_TYPOGRAPHY,
+  );
   return (
     <Text
       {...extraProps}
       {...rest}
-      style={[{ fontSize: 15, lineHeight: 15 * 1.625 }, style]}
+      className={className}
+      style={[paragraphDefaults, style]}
     />
   );
 }

package/src/typography/styled-text.ts

@@ -0,0 +1,41 @@
+import type { ComponentType } from 'react';
+import { Text as RNText, type TextProps } from 'react-native';
+
+import { lazyRequire } from '../utils/lazy-require';
+
+type StyledTextComponent = ComponentType<TextProps & { className?: string }>;
+
+type NativeWindModule = {
+  styled: (
+    component: typeof RNText,
+    mapping?: { className: 'style' },
+  ) => StyledTextComponent;
+};
+
+const getNativeWind = lazyRequire<NativeWindModule>('nativewind');
+
+let interopText: StyledTextComponent = RNText;
+
+/**
+ * RN `Text` wired for NativeWind `className` → `style` interop when
+ * `nativewind` is installed in the consumer. Falls back to plain `RNText`
+ * otherwise (className is ignored upstream).
+ */
+export function getInteropText(): StyledTextComponent {
+  if (interopText !== RNText) {
+    return interopText;
+  }
+
+  const nativewind = getNativeWind();
+  if (nativewind?.styled) {
+    interopText = nativewind.styled(RNText, { className: 'style' });
+  }
+
+  return interopText;
+}
+
+/** True when className interop is active (nativewind present). */
+export function hasTypographyClassNameInterop(): boolean {
+  getInteropText();
+  return interopText !== RNText;
+}