@oxyhq/bloom 0.29.2 → 0.29.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (33) hide show
  1. package/lib/commonjs/design-tokens/theme.css +81 -0
  2. package/lib/commonjs/typography/defaults.js +22 -0
  3. package/lib/commonjs/typography/defaults.js.map +1 -0
  4. package/lib/commonjs/typography/index.js +32 -13
  5. package/lib/commonjs/typography/index.js.map +1 -1
  6. package/lib/commonjs/typography/styled-text.js +36 -0
  7. package/lib/commonjs/typography/styled-text.js.map +1 -0
  8. package/lib/module/design-tokens/theme.css +81 -0
  9. package/lib/module/typography/defaults.js +17 -0
  10. package/lib/module/typography/defaults.js.map +1 -0
  11. package/lib/module/typography/index.js +33 -14
  12. package/lib/module/typography/index.js.map +1 -1
  13. package/lib/module/typography/styled-text.js +31 -0
  14. package/lib/module/typography/styled-text.js.map +1 -0
  15. package/lib/typescript/commonjs/typography/defaults.d.ts +11 -0
  16. package/lib/typescript/commonjs/typography/defaults.d.ts.map +1 -0
  17. package/lib/typescript/commonjs/typography/index.d.ts +11 -9
  18. package/lib/typescript/commonjs/typography/index.d.ts.map +1 -1
  19. package/lib/typescript/commonjs/typography/styled-text.d.ts +15 -0
  20. package/lib/typescript/commonjs/typography/styled-text.d.ts.map +1 -0
  21. package/lib/typescript/module/typography/defaults.d.ts +11 -0
  22. package/lib/typescript/module/typography/defaults.d.ts.map +1 -0
  23. package/lib/typescript/module/typography/index.d.ts +11 -9
  24. package/lib/typescript/module/typography/index.d.ts.map +1 -1
  25. package/lib/typescript/module/typography/styled-text.d.ts +15 -0
  26. package/lib/typescript/module/typography/styled-text.d.ts.map +1 -0
  27. package/package.json +9 -3
  28. package/src/__tests__/design-tokens.test.ts +23 -0
  29. package/src/design-tokens/theme.css +81 -0
  30. package/src/typography/__tests__/defaults.test.ts +57 -0
  31. package/src/typography/defaults.ts +28 -0
  32. package/src/typography/index.tsx +53 -13
  33. package/src/typography/styled-text.ts +41 -0
@@ -0,0 +1,81 @@
1
+ /*
2
+ * AUTO-GENERATED by scripts/generate-theme-css.ts — DO NOT EDIT.
3
+ * Source of truth: bloomThemeCss() in src/design-tokens/theme-css.ts.
4
+ * Re-run `bun run generate:theme-css` (or any `bun run build`) after
5
+ * changing any design token.
6
+ */
7
+
8
+ @theme {
9
+ --color-bg: var(--background);
10
+ --color-fill: var(--card);
11
+ --color-fill-secondary: var(--muted);
12
+ --color-fill-hover: var(--accent);
13
+ --color-fill-brand: var(--primary);
14
+ --color-fill-brand-hover: var(--ring);
15
+ --color-fill-inverse: var(--foreground);
16
+ --color-fill-inverse-hover: var(--muted-foreground);
17
+ --color-fill-placeholder: var(--muted);
18
+ --color-text: var(--foreground);
19
+ --color-text-secondary: var(--muted-foreground);
20
+ --color-text-tertiary: var(--muted-foreground);
21
+ --color-text-inverse: var(--primary-foreground);
22
+ --color-text-fixed-light: var(--primary-foreground);
23
+ --color-text-placeholder: var(--muted-foreground);
24
+ --color-border: var(--border);
25
+ --color-border-image: var(--border);
26
+ --color-border-secondary: var(--input);
27
+ --color-border-input: var(--input);
28
+ --color-border-input-active: var(--ring);
29
+ --spacing-space-2: 2px;
30
+ --spacing-space-4: 4px;
31
+ --spacing-space-8: 8px;
32
+ --spacing-space-12: 12px;
33
+ --spacing-space-16: 16px;
34
+ --spacing-space-20: 20px;
35
+ --spacing-space-24: 24px;
36
+ --spacing-space-32: 32px;
37
+ --spacing-screen-margin: 20px;
38
+ --radius-radius-8: 8px;
39
+ --radius-radius-12: 12px;
40
+ --radius-radius-20: 20px;
41
+ --radius-radius-28: 28px;
42
+ --radius-radius-max: 9999px;
43
+ --border-width-hairline: 0.5px;
44
+ --text-caption: 11px;
45
+ --text-caption--line-height: 14px;
46
+ --text-caption--font-weight: 400;
47
+ --font-caption: var(--bloom-font-sans);
48
+ --text-bodySmall: 13px;
49
+ --text-bodySmall--line-height: 18px;
50
+ --text-bodySmall--font-weight: 400;
51
+ --font-bodySmall: var(--bloom-font-sans);
52
+ --text-bodyTitleSmall: 13px;
53
+ --text-bodyTitleSmall--line-height: 18px;
54
+ --text-bodyTitleSmall--font-weight: 600;
55
+ --font-bodyTitleSmall: var(--bloom-font-sans);
56
+ --text-body: 15px;
57
+ --text-body--line-height: 22px;
58
+ --text-body--font-weight: 400;
59
+ --font-body: var(--bloom-font-sans);
60
+ --text-subtitle: 17px;
61
+ --text-subtitle--line-height: 24px;
62
+ --text-subtitle--font-weight: 500;
63
+ --font-subtitle: var(--bloom-font-sans);
64
+ --text-sectionTitle: 20px;
65
+ --text-sectionTitle--line-height: 26px;
66
+ --text-sectionTitle--font-weight: 600;
67
+ --font-sectionTitle: var(--bloom-font-sans);
68
+ --text-headerBold: 28px;
69
+ --text-headerBold--line-height: 34px;
70
+ --text-headerBold--font-weight: 700;
71
+ --font-headerBold: var(--bloom-font-display);
72
+ --text-buttonLarge: 17px;
73
+ --text-buttonLarge--line-height: 22px;
74
+ --text-buttonLarge--font-weight: 600;
75
+ --font-buttonLarge: var(--bloom-font-sans);
76
+ --font-bloom-sans: var(--bloom-font-sans);
77
+ --font-bloom-display: var(--bloom-font-display);
78
+ --font-bloom-mono: var(--bloom-font-mono);
79
+ --shadow-s: 0 1px 2px rgb(0 0 0 / 0.06), 0 1px 3px rgb(0 0 0 / 0.10);
80
+ --shadow-m: 0 4px 12px rgb(0 0 0 / 0.08), 0 2px 6px rgb(0 0 0 / 0.12);
81
+ }
@@ -0,0 +1,22 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.mergeTypographyStyle = mergeTypographyStyle;
7
+ exports.typographyDefaultsWhenNoClassName = typographyDefaultsWhenNoClassName;
8
+ /**
9
+ * Bloom typography defaults are applied via inline `style` only when the caller
10
+ * does not pass `className`. When `className` is present, NativeWind compiles
11
+ * font-size / line-height / weight / color utilities into `style` first; inline
12
+ * defaults that repeat those keys would win the merge and silently override the
13
+ * utilities (the Homiio hero-title bug).
14
+ */
15
+ function typographyDefaultsWhenNoClassName(className, defaults) {
16
+ return className?.trim() ? undefined : defaults;
17
+ }
18
+ function mergeTypographyStyle(className, defaults, base, style) {
19
+ const resolvedDefaults = defaults ? typographyDefaultsWhenNoClassName(className, defaults) : undefined;
20
+ return [resolvedDefaults, base, style];
21
+ }
22
+ //# sourceMappingURL=defaults.js.map
@@ -0,0 +1 @@
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":[]}
@@ -16,6 +16,8 @@ var _react = _interopRequireWildcard(require("react"));
16
16
  var _reactNative = require("react-native");
17
17
  var _useTheme = require("../theme/use-theme.js");
18
18
  var _tokens = require("../fonts/tokens.js");
19
+ var _defaults = require("./defaults.js");
20
+ var _styledText = require("./styled-text.js");
19
21
  var _jsxRuntime = require("react/jsx-runtime");
20
22
  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); }
21
23
  /**
@@ -44,32 +46,42 @@ function fontFamilyStyle(kind) {
44
46
  }
45
47
  const SANS_FONT_FAMILY = fontFamilyStyle('sans');
46
48
  const DISPLAY_FONT_FAMILY = fontFamilyStyle('display');
49
+ const DEFAULT_TEXT_TYPOGRAPHY = {
50
+ fontSize: 13
51
+ };
47
52
 
48
53
  /**
49
54
  * Base text component with theme-aware default color and the Bloom sans
50
- * font family applied.
55
+ * font family applied. NativeWind `className` utilities (text-*, font-*,
56
+ * leading-*, text-foreground, …) override defaults when provided.
51
57
  */
52
58
  const TextComponent = function Text({
53
59
  children,
54
60
  style,
61
+ className,
55
62
  ...rest
56
63
  }) {
57
64
  const {
58
65
  colors
59
66
  } = (0, _useTheme.useTheme)();
60
- return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
67
+ const InteropText = (0, _styledText.getInteropText)();
68
+ const interopActive = (0, _styledText.hasTypographyClassNameInterop)();
69
+ const resolvedClassName = interopActive && className?.trim() ? className : undefined;
70
+ return /*#__PURE__*/(0, _jsxRuntime.jsx)(InteropText, {
61
71
  ...rest,
62
- style: [{
63
- fontSize: 13,
64
- color: colors.text,
65
- ...SANS_FONT_FAMILY
66
- }, style],
72
+ ...(resolvedClassName ? {
73
+ className: resolvedClassName
74
+ } : {}),
75
+ style: (0, _defaults.mergeTypographyStyle)(resolvedClassName, {
76
+ ...DEFAULT_TEXT_TYPOGRAPHY,
77
+ color: colors.text
78
+ }, SANS_FONT_FAMILY, style),
67
79
  children: children
68
80
  });
69
81
  };
70
82
  const Text = exports.Span = exports.Text = /*#__PURE__*/(0, _react.memo)(TextComponent);
71
83
  Text.displayName = 'Text';
72
- const HEADING_STYLE = {
84
+ const HEADING_TYPOGRAPHY = {
73
85
  ...DISPLAY_FONT_FAMILY,
74
86
  fontWeight: '700'
75
87
  };
@@ -78,16 +90,19 @@ function createHeadingElement({
78
90
  }) {
79
91
  return function HeadingElement({
80
92
  style,
93
+ className,
81
94
  ...rest
82
95
  }) {
83
96
  const extraProps = _reactNative.Platform.OS === 'web' ? {
84
97
  role: 'heading',
85
98
  'aria-level': level
86
99
  } : {};
100
+ const headingBase = className?.trim() ? DISPLAY_FONT_FAMILY : HEADING_TYPOGRAPHY;
87
101
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(Text, {
88
102
  ...extraProps,
89
103
  ...rest,
90
- style: [HEADING_STYLE, style]
104
+ className: className,
105
+ style: [headingBase, style]
91
106
  });
92
107
  };
93
108
  }
@@ -115,20 +130,24 @@ const H6 = exports.H6 = createHeadingElement({
115
130
  level: 6
116
131
  });
117
132
  H6.displayName = 'H6';
133
+ const DEFAULT_PARAGRAPH_TYPOGRAPHY = {
134
+ fontSize: 15,
135
+ lineHeight: 15 * 1.625
136
+ };
118
137
  function P({
119
138
  style,
139
+ className,
120
140
  ...rest
121
141
  }) {
122
142
  const extraProps = _reactNative.Platform.OS === 'web' ? {
123
143
  role: 'paragraph'
124
144
  } : {};
145
+ const paragraphDefaults = (0, _defaults.typographyDefaultsWhenNoClassName)(className, DEFAULT_PARAGRAPH_TYPOGRAPHY);
125
146
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(Text, {
126
147
  ...extraProps,
127
148
  ...rest,
128
- style: [{
129
- fontSize: 15,
130
- lineHeight: 15 * 1.625
131
- }, style]
149
+ className: className,
150
+ style: [paragraphDefaults, style]
132
151
  });
133
152
  }
134
153
  P.displayName = 'P';
@@ -1 +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":[]}
1
+ {"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":[]}
@@ -0,0 +1,36 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.getInteropText = getInteropText;
7
+ exports.hasTypographyClassNameInterop = hasTypographyClassNameInterop;
8
+ var _reactNative = require("react-native");
9
+ var _lazyRequire = require("../utils/lazy-require.js");
10
+ const getNativeWind = (0, _lazyRequire.lazyRequire)('nativewind');
11
+ let interopText = _reactNative.Text;
12
+
13
+ /**
14
+ * RN `Text` wired for NativeWind `className` → `style` interop when
15
+ * `nativewind` is installed in the consumer. Falls back to plain `RNText`
16
+ * otherwise (className is ignored upstream).
17
+ */
18
+ function getInteropText() {
19
+ if (interopText !== _reactNative.Text) {
20
+ return interopText;
21
+ }
22
+ const nativewind = getNativeWind();
23
+ if (nativewind?.styled) {
24
+ interopText = nativewind.styled(_reactNative.Text, {
25
+ className: 'style'
26
+ });
27
+ }
28
+ return interopText;
29
+ }
30
+
31
+ /** True when className interop is active (nativewind present). */
32
+ function hasTypographyClassNameInterop() {
33
+ getInteropText();
34
+ return interopText !== _reactNative.Text;
35
+ }
36
+ //# sourceMappingURL=styled-text.js.map
@@ -0,0 +1 @@
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":[]}
@@ -0,0 +1,81 @@
1
+ /*
2
+ * AUTO-GENERATED by scripts/generate-theme-css.ts — DO NOT EDIT.
3
+ * Source of truth: bloomThemeCss() in src/design-tokens/theme-css.ts.
4
+ * Re-run `bun run generate:theme-css` (or any `bun run build`) after
5
+ * changing any design token.
6
+ */
7
+
8
+ @theme {
9
+ --color-bg: var(--background);
10
+ --color-fill: var(--card);
11
+ --color-fill-secondary: var(--muted);
12
+ --color-fill-hover: var(--accent);
13
+ --color-fill-brand: var(--primary);
14
+ --color-fill-brand-hover: var(--ring);
15
+ --color-fill-inverse: var(--foreground);
16
+ --color-fill-inverse-hover: var(--muted-foreground);
17
+ --color-fill-placeholder: var(--muted);
18
+ --color-text: var(--foreground);
19
+ --color-text-secondary: var(--muted-foreground);
20
+ --color-text-tertiary: var(--muted-foreground);
21
+ --color-text-inverse: var(--primary-foreground);
22
+ --color-text-fixed-light: var(--primary-foreground);
23
+ --color-text-placeholder: var(--muted-foreground);
24
+ --color-border: var(--border);
25
+ --color-border-image: var(--border);
26
+ --color-border-secondary: var(--input);
27
+ --color-border-input: var(--input);
28
+ --color-border-input-active: var(--ring);
29
+ --spacing-space-2: 2px;
30
+ --spacing-space-4: 4px;
31
+ --spacing-space-8: 8px;
32
+ --spacing-space-12: 12px;
33
+ --spacing-space-16: 16px;
34
+ --spacing-space-20: 20px;
35
+ --spacing-space-24: 24px;
36
+ --spacing-space-32: 32px;
37
+ --spacing-screen-margin: 20px;
38
+ --radius-radius-8: 8px;
39
+ --radius-radius-12: 12px;
40
+ --radius-radius-20: 20px;
41
+ --radius-radius-28: 28px;
42
+ --radius-radius-max: 9999px;
43
+ --border-width-hairline: 0.5px;
44
+ --text-caption: 11px;
45
+ --text-caption--line-height: 14px;
46
+ --text-caption--font-weight: 400;
47
+ --font-caption: var(--bloom-font-sans);
48
+ --text-bodySmall: 13px;
49
+ --text-bodySmall--line-height: 18px;
50
+ --text-bodySmall--font-weight: 400;
51
+ --font-bodySmall: var(--bloom-font-sans);
52
+ --text-bodyTitleSmall: 13px;
53
+ --text-bodyTitleSmall--line-height: 18px;
54
+ --text-bodyTitleSmall--font-weight: 600;
55
+ --font-bodyTitleSmall: var(--bloom-font-sans);
56
+ --text-body: 15px;
57
+ --text-body--line-height: 22px;
58
+ --text-body--font-weight: 400;
59
+ --font-body: var(--bloom-font-sans);
60
+ --text-subtitle: 17px;
61
+ --text-subtitle--line-height: 24px;
62
+ --text-subtitle--font-weight: 500;
63
+ --font-subtitle: var(--bloom-font-sans);
64
+ --text-sectionTitle: 20px;
65
+ --text-sectionTitle--line-height: 26px;
66
+ --text-sectionTitle--font-weight: 600;
67
+ --font-sectionTitle: var(--bloom-font-sans);
68
+ --text-headerBold: 28px;
69
+ --text-headerBold--line-height: 34px;
70
+ --text-headerBold--font-weight: 700;
71
+ --font-headerBold: var(--bloom-font-display);
72
+ --text-buttonLarge: 17px;
73
+ --text-buttonLarge--line-height: 22px;
74
+ --text-buttonLarge--font-weight: 600;
75
+ --font-buttonLarge: var(--bloom-font-sans);
76
+ --font-bloom-sans: var(--bloom-font-sans);
77
+ --font-bloom-display: var(--bloom-font-display);
78
+ --font-bloom-mono: var(--bloom-font-mono);
79
+ --shadow-s: 0 1px 2px rgb(0 0 0 / 0.06), 0 1px 3px rgb(0 0 0 / 0.10);
80
+ --shadow-m: 0 4px 12px rgb(0 0 0 / 0.08), 0 2px 6px rgb(0 0 0 / 0.12);
81
+ }
@@ -0,0 +1,17 @@
1
+ "use strict";
2
+
3
+ /**
4
+ * Bloom typography defaults are applied via inline `style` only when the caller
5
+ * does not pass `className`. When `className` is present, NativeWind compiles
6
+ * font-size / line-height / weight / color utilities into `style` first; inline
7
+ * defaults that repeat those keys would win the merge and silently override the
8
+ * utilities (the Homiio hero-title bug).
9
+ */
10
+ export function typographyDefaultsWhenNoClassName(className, defaults) {
11
+ return className?.trim() ? undefined : defaults;
12
+ }
13
+ export function mergeTypographyStyle(className, defaults, base, style) {
14
+ const resolvedDefaults = defaults ? typographyDefaultsWhenNoClassName(className, defaults) : undefined;
15
+ return [resolvedDefaults, base, style];
16
+ }
17
+ //# sourceMappingURL=defaults.js.map
@@ -0,0 +1 @@
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":[]}
@@ -1,9 +1,11 @@
1
1
  "use strict";
2
2
 
3
3
  import React, { memo } from 'react';
4
- import { Text as RNText, Platform } from 'react-native';
4
+ import { Platform } from 'react-native';
5
5
  import { useTheme } from "../theme/use-theme.js";
6
6
  import { fontFamilies } from "../fonts/tokens.js";
7
+ import { mergeTypographyStyle, typographyDefaultsWhenNoClassName } from "./defaults.js";
8
+ import { getInteropText, hasTypographyClassNameInterop } from "./styled-text.js";
7
9
  import { jsx as _jsx } from "react/jsx-runtime";
8
10
  /**
9
11
  * Platform-aware font-family value. On web we resolve to the CSS custom
@@ -31,33 +33,43 @@ function fontFamilyStyle(kind) {
31
33
  }
32
34
  const SANS_FONT_FAMILY = fontFamilyStyle('sans');
33
35
  const DISPLAY_FONT_FAMILY = fontFamilyStyle('display');
36
+ const DEFAULT_TEXT_TYPOGRAPHY = {
37
+ fontSize: 13
38
+ };
34
39
 
35
40
  /**
36
41
  * Base text component with theme-aware default color and the Bloom sans
37
- * font family applied.
42
+ * font family applied. NativeWind `className` utilities (text-*, font-*,
43
+ * leading-*, text-foreground, …) override defaults when provided.
38
44
  */
39
45
  const TextComponent = function Text({
40
46
  children,
41
47
  style,
48
+ className,
42
49
  ...rest
43
50
  }) {
44
51
  const {
45
52
  colors
46
53
  } = useTheme();
47
- return /*#__PURE__*/_jsx(RNText, {
54
+ const InteropText = getInteropText();
55
+ const interopActive = hasTypographyClassNameInterop();
56
+ const resolvedClassName = interopActive && className?.trim() ? className : undefined;
57
+ return /*#__PURE__*/_jsx(InteropText, {
48
58
  ...rest,
49
- style: [{
50
- fontSize: 13,
51
- color: colors.text,
52
- ...SANS_FONT_FAMILY
53
- }, style],
59
+ ...(resolvedClassName ? {
60
+ className: resolvedClassName
61
+ } : {}),
62
+ style: mergeTypographyStyle(resolvedClassName, {
63
+ ...DEFAULT_TEXT_TYPOGRAPHY,
64
+ color: colors.text
65
+ }, SANS_FONT_FAMILY, style),
54
66
  children: children
55
67
  });
56
68
  };
57
69
  export const Text = /*#__PURE__*/memo(TextComponent);
58
70
  Text.displayName = 'Text';
59
71
  export { Text as Span };
60
- const HEADING_STYLE = {
72
+ const HEADING_TYPOGRAPHY = {
61
73
  ...DISPLAY_FONT_FAMILY,
62
74
  fontWeight: '700'
63
75
  };
@@ -66,16 +78,19 @@ function createHeadingElement({
66
78
  }) {
67
79
  return function HeadingElement({
68
80
  style,
81
+ className,
69
82
  ...rest
70
83
  }) {
71
84
  const extraProps = Platform.OS === 'web' ? {
72
85
  role: 'heading',
73
86
  'aria-level': level
74
87
  } : {};
88
+ const headingBase = className?.trim() ? DISPLAY_FONT_FAMILY : HEADING_TYPOGRAPHY;
75
89
  return /*#__PURE__*/_jsx(Text, {
76
90
  ...extraProps,
77
91
  ...rest,
78
- style: [HEADING_STYLE, style]
92
+ className: className,
93
+ style: [headingBase, style]
79
94
  });
80
95
  };
81
96
  }
@@ -103,20 +118,24 @@ export const H6 = createHeadingElement({
103
118
  level: 6
104
119
  });
105
120
  H6.displayName = 'H6';
121
+ const DEFAULT_PARAGRAPH_TYPOGRAPHY = {
122
+ fontSize: 15,
123
+ lineHeight: 15 * 1.625
124
+ };
106
125
  export function P({
107
126
  style,
127
+ className,
108
128
  ...rest
109
129
  }) {
110
130
  const extraProps = Platform.OS === 'web' ? {
111
131
  role: 'paragraph'
112
132
  } : {};
133
+ const paragraphDefaults = typographyDefaultsWhenNoClassName(className, DEFAULT_PARAGRAPH_TYPOGRAPHY);
113
134
  return /*#__PURE__*/_jsx(Text, {
114
135
  ...extraProps,
115
136
  ...rest,
116
- style: [{
117
- fontSize: 15,
118
- lineHeight: 15 * 1.625
119
- }, style]
137
+ className: className,
138
+ style: [paragraphDefaults, style]
120
139
  });
121
140
  }
122
141
  P.displayName = 'P';
@@ -1 +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":[]}
1
+ {"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":[]}
@@ -0,0 +1,31 @@
1
+ "use strict";
2
+
3
+ import { Text as RNText } from 'react-native';
4
+ import { lazyRequire } from "../utils/lazy-require.js";
5
+ const getNativeWind = lazyRequire('nativewind');
6
+ let interopText = RNText;
7
+
8
+ /**
9
+ * RN `Text` wired for NativeWind `className` → `style` interop when
10
+ * `nativewind` is installed in the consumer. Falls back to plain `RNText`
11
+ * otherwise (className is ignored upstream).
12
+ */
13
+ export function getInteropText() {
14
+ if (interopText !== RNText) {
15
+ return interopText;
16
+ }
17
+ const nativewind = getNativeWind();
18
+ if (nativewind?.styled) {
19
+ interopText = nativewind.styled(RNText, {
20
+ className: 'style'
21
+ });
22
+ }
23
+ return interopText;
24
+ }
25
+
26
+ /** True when className interop is active (nativewind present). */
27
+ export function hasTypographyClassNameInterop() {
28
+ getInteropText();
29
+ return interopText !== RNText;
30
+ }
31
+ //# sourceMappingURL=styled-text.js.map
@@ -0,0 +1 @@
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":[]}
@@ -0,0 +1,11 @@
1
+ import type { StyleProp, TextStyle } from 'react-native';
2
+ /**
3
+ * Bloom typography defaults are applied via inline `style` only when the caller
4
+ * does not pass `className`. When `className` is present, NativeWind compiles
5
+ * font-size / line-height / weight / color utilities into `style` first; inline
6
+ * defaults that repeat those keys would win the merge and silently override the
7
+ * utilities (the Homiio hero-title bug).
8
+ */
9
+ export declare function typographyDefaultsWhenNoClassName(className: string | undefined, defaults: TextStyle): TextStyle | undefined;
10
+ export declare function mergeTypographyStyle(className: string | undefined, defaults: TextStyle | undefined, base: StyleProp<TextStyle>, style: StyleProp<TextStyle> | undefined): StyleProp<TextStyle>;
11
+ //# sourceMappingURL=defaults.d.ts.map
@@ -0,0 +1 @@
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"}
@@ -1,16 +1,18 @@
1
1
  import React from 'react';
2
2
  import { type TextProps as RNTextProps } from 'react-native';
3
3
  import { fontFamilies } from '../fonts/tokens';
4
- export type TextProps = RNTextProps;
5
- export declare const Text: React.MemoExoticComponent<({ children, style, ...rest }: TextProps) => import("react/jsx-runtime").JSX.Element>;
4
+ export type TextProps = RNTextProps & {
5
+ className?: string;
6
+ };
7
+ export declare const Text: React.MemoExoticComponent<({ children, style, className, ...rest }: TextProps) => import("react/jsx-runtime").JSX.Element>;
6
8
  export { Text as Span };
7
- export declare const H1: React.FC<RNTextProps>;
8
- export declare const H2: React.FC<RNTextProps>;
9
- export declare const H3: React.FC<RNTextProps>;
10
- export declare const H4: React.FC<RNTextProps>;
11
- export declare const H5: React.FC<RNTextProps>;
12
- export declare const H6: React.FC<RNTextProps>;
13
- export declare function P({ style, ...rest }: TextProps): import("react/jsx-runtime").JSX.Element;
9
+ export declare const H1: React.FC<TextProps>;
10
+ export declare const H2: React.FC<TextProps>;
11
+ export declare const H3: React.FC<TextProps>;
12
+ export declare const H4: React.FC<TextProps>;
13
+ export declare const H5: React.FC<TextProps>;
14
+ export declare const H6: React.FC<TextProps>;
15
+ export declare function P({ style, className, ...rest }: TextProps): import("react/jsx-runtime").JSX.Element;
14
16
  export declare namespace P {
15
17
  var displayName: string;
16
18
  }
@@ -1 +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"}
1
+ {"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"}
@@ -0,0 +1,15 @@
1
+ import type { ComponentType } from 'react';
2
+ import { type TextProps } from 'react-native';
3
+ type StyledTextComponent = ComponentType<TextProps & {
4
+ className?: string;
5
+ }>;
6
+ /**
7
+ * RN `Text` wired for NativeWind `className` → `style` interop when
8
+ * `nativewind` is installed in the consumer. Falls back to plain `RNText`
9
+ * otherwise (className is ignored upstream).
10
+ */
11
+ export declare function getInteropText(): StyledTextComponent;
12
+ /** True when className interop is active (nativewind present). */
13
+ export declare function hasTypographyClassNameInterop(): boolean;
14
+ export {};
15
+ //# sourceMappingURL=styled-text.d.ts.map
@@ -0,0 +1 @@
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"}
@@ -0,0 +1,11 @@
1
+ import type { StyleProp, TextStyle } from 'react-native';
2
+ /**
3
+ * Bloom typography defaults are applied via inline `style` only when the caller
4
+ * does not pass `className`. When `className` is present, NativeWind compiles
5
+ * font-size / line-height / weight / color utilities into `style` first; inline
6
+ * defaults that repeat those keys would win the merge and silently override the
7
+ * utilities (the Homiio hero-title bug).
8
+ */
9
+ export declare function typographyDefaultsWhenNoClassName(className: string | undefined, defaults: TextStyle): TextStyle | undefined;
10
+ export declare function mergeTypographyStyle(className: string | undefined, defaults: TextStyle | undefined, base: StyleProp<TextStyle>, style: StyleProp<TextStyle> | undefined): StyleProp<TextStyle>;
11
+ //# sourceMappingURL=defaults.d.ts.map
@@ -0,0 +1 @@
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"}
@@ -1,16 +1,18 @@
1
1
  import React from 'react';
2
2
  import { type TextProps as RNTextProps } from 'react-native';
3
3
  import { fontFamilies } from '../fonts/tokens';
4
- export type TextProps = RNTextProps;
5
- export declare const Text: React.MemoExoticComponent<({ children, style, ...rest }: TextProps) => import("react/jsx-runtime").JSX.Element>;
4
+ export type TextProps = RNTextProps & {
5
+ className?: string;
6
+ };
7
+ export declare const Text: React.MemoExoticComponent<({ children, style, className, ...rest }: TextProps) => import("react/jsx-runtime").JSX.Element>;
6
8
  export { Text as Span };
7
- export declare const H1: React.FC<RNTextProps>;
8
- export declare const H2: React.FC<RNTextProps>;
9
- export declare const H3: React.FC<RNTextProps>;
10
- export declare const H4: React.FC<RNTextProps>;
11
- export declare const H5: React.FC<RNTextProps>;
12
- export declare const H6: React.FC<RNTextProps>;
13
- export declare function P({ style, ...rest }: TextProps): import("react/jsx-runtime").JSX.Element;
9
+ export declare const H1: React.FC<TextProps>;
10
+ export declare const H2: React.FC<TextProps>;
11
+ export declare const H3: React.FC<TextProps>;
12
+ export declare const H4: React.FC<TextProps>;
13
+ export declare const H5: React.FC<TextProps>;
14
+ export declare const H6: React.FC<TextProps>;
15
+ export declare function P({ style, className, ...rest }: TextProps): import("react/jsx-runtime").JSX.Element;
14
16
  export declare namespace P {
15
17
  var displayName: string;
16
18
  }
@@ -1 +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"}
1
+ {"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"}
@@ -0,0 +1,15 @@
1
+ import type { ComponentType } from 'react';
2
+ import { type TextProps } from 'react-native';
3
+ type StyledTextComponent = ComponentType<TextProps & {
4
+ className?: string;
5
+ }>;
6
+ /**
7
+ * RN `Text` wired for NativeWind `className` → `style` interop when
8
+ * `nativewind` is installed in the consumer. Falls back to plain `RNText`
9
+ * otherwise (className is ignored upstream).
10
+ */
11
+ export declare function getInteropText(): StyledTextComponent;
12
+ /** True when className interop is active (nativewind present). */
13
+ export declare function hasTypographyClassNameInterop(): boolean;
14
+ export {};
15
+ //# sourceMappingURL=styled-text.d.ts.map
@@ -0,0 +1 @@
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 CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@oxyhq/bloom",
3
- "version": "0.29.2",
3
+ "version": "0.29.4",
4
4
  "description": "Bloom UI — Oxy ecosystem component library for React Native + Expo + Web",
5
5
  "main": "lib/commonjs/index.js",
6
6
  "module": "lib/module/index.js",
@@ -887,6 +887,7 @@
887
887
  "default": "./lib/commonjs/list/index.js"
888
888
  }
889
889
  },
890
+ "./design-tokens/theme.css": "./src/design-tokens/theme.css",
890
891
  "./package.json": "./package.json"
891
892
  },
892
893
  "files": [
@@ -954,7 +955,8 @@
954
955
  "scripts": {
955
956
  "generate:exports": "node scripts/generate-platform-exports.mjs",
956
957
  "generate:font-data": "node scripts/generate-font-data.mjs",
957
- "prebuild": "node scripts/generate-platform-exports.mjs && node scripts/generate-font-data.mjs",
958
+ "generate:theme-css": "bun scripts/generate-theme-css.ts",
959
+ "prebuild": "node scripts/generate-platform-exports.mjs && node scripts/generate-font-data.mjs && bun scripts/generate-theme-css.ts",
958
960
  "build": "bob build",
959
961
  "test": "jest",
960
962
  "pretest": "node scripts/generate-font-data.mjs",
@@ -1028,7 +1030,8 @@
1028
1030
  "react-native-safe-area-context": ">=5.0.0",
1029
1031
  "react-native-svg": ">=13.0.0",
1030
1032
  "sonner": ">=2.0.0",
1031
- "sonner-native": ">=0.17.0"
1033
+ "sonner-native": ">=0.17.0",
1034
+ "nativewind": ">=5.0.0"
1032
1035
  },
1033
1036
  "peerDependenciesMeta": {
1034
1037
  "expo": {
@@ -1054,6 +1057,9 @@
1054
1057
  },
1055
1058
  "sonner-native": {
1056
1059
  "optional": true
1060
+ },
1061
+ "nativewind": {
1062
+ "optional": true
1057
1063
  }
1058
1064
  },
1059
1065
  "react-native-builder-bob": {
@@ -1,3 +1,6 @@
1
+ import { readFileSync } from 'node:fs';
2
+ import { join } from 'node:path';
3
+
1
4
  import {
2
5
  bloomTailwindPreset,
3
6
  bloomThemeCss,
@@ -161,6 +164,26 @@ describe('design-tokens v4 @theme css', () => {
161
164
  });
162
165
  });
163
166
 
167
+ describe('design-tokens shipped theme.css', () => {
168
+ // The static artifact consumers `@import`. Generated by
169
+ // scripts/generate-theme-css.ts from the SAME source as bloomThemeCss(),
170
+ // so this guards against JS/CSS drift.
171
+ const themeCss = readFileSync(
172
+ join(__dirname, '..', 'design-tokens', 'theme.css'),
173
+ 'utf8',
174
+ );
175
+
176
+ it('the @theme block equals bloomThemeBlock() (no drift)', () => {
177
+ const block = themeCss.slice(themeCss.indexOf('@theme')).trimEnd();
178
+ expect(block).toBe(bloomThemeBlock());
179
+ });
180
+
181
+ it('carries the auto-generated / do-not-edit header', () => {
182
+ expect(themeCss).toContain('AUTO-GENERATED');
183
+ expect(themeCss).toContain('bun run generate:theme-css');
184
+ });
185
+ });
186
+
164
187
  describe('design-tokens shadow style (web default)', () => {
165
188
  it('returns a boxShadow style on the web/default fork', () => {
166
189
  const style = bloomShadowStyle('m');
@@ -0,0 +1,81 @@
1
+ /*
2
+ * AUTO-GENERATED by scripts/generate-theme-css.ts — DO NOT EDIT.
3
+ * Source of truth: bloomThemeCss() in src/design-tokens/theme-css.ts.
4
+ * Re-run `bun run generate:theme-css` (or any `bun run build`) after
5
+ * changing any design token.
6
+ */
7
+
8
+ @theme {
9
+ --color-bg: var(--background);
10
+ --color-fill: var(--card);
11
+ --color-fill-secondary: var(--muted);
12
+ --color-fill-hover: var(--accent);
13
+ --color-fill-brand: var(--primary);
14
+ --color-fill-brand-hover: var(--ring);
15
+ --color-fill-inverse: var(--foreground);
16
+ --color-fill-inverse-hover: var(--muted-foreground);
17
+ --color-fill-placeholder: var(--muted);
18
+ --color-text: var(--foreground);
19
+ --color-text-secondary: var(--muted-foreground);
20
+ --color-text-tertiary: var(--muted-foreground);
21
+ --color-text-inverse: var(--primary-foreground);
22
+ --color-text-fixed-light: var(--primary-foreground);
23
+ --color-text-placeholder: var(--muted-foreground);
24
+ --color-border: var(--border);
25
+ --color-border-image: var(--border);
26
+ --color-border-secondary: var(--input);
27
+ --color-border-input: var(--input);
28
+ --color-border-input-active: var(--ring);
29
+ --spacing-space-2: 2px;
30
+ --spacing-space-4: 4px;
31
+ --spacing-space-8: 8px;
32
+ --spacing-space-12: 12px;
33
+ --spacing-space-16: 16px;
34
+ --spacing-space-20: 20px;
35
+ --spacing-space-24: 24px;
36
+ --spacing-space-32: 32px;
37
+ --spacing-screen-margin: 20px;
38
+ --radius-radius-8: 8px;
39
+ --radius-radius-12: 12px;
40
+ --radius-radius-20: 20px;
41
+ --radius-radius-28: 28px;
42
+ --radius-radius-max: 9999px;
43
+ --border-width-hairline: 0.5px;
44
+ --text-caption: 11px;
45
+ --text-caption--line-height: 14px;
46
+ --text-caption--font-weight: 400;
47
+ --font-caption: var(--bloom-font-sans);
48
+ --text-bodySmall: 13px;
49
+ --text-bodySmall--line-height: 18px;
50
+ --text-bodySmall--font-weight: 400;
51
+ --font-bodySmall: var(--bloom-font-sans);
52
+ --text-bodyTitleSmall: 13px;
53
+ --text-bodyTitleSmall--line-height: 18px;
54
+ --text-bodyTitleSmall--font-weight: 600;
55
+ --font-bodyTitleSmall: var(--bloom-font-sans);
56
+ --text-body: 15px;
57
+ --text-body--line-height: 22px;
58
+ --text-body--font-weight: 400;
59
+ --font-body: var(--bloom-font-sans);
60
+ --text-subtitle: 17px;
61
+ --text-subtitle--line-height: 24px;
62
+ --text-subtitle--font-weight: 500;
63
+ --font-subtitle: var(--bloom-font-sans);
64
+ --text-sectionTitle: 20px;
65
+ --text-sectionTitle--line-height: 26px;
66
+ --text-sectionTitle--font-weight: 600;
67
+ --font-sectionTitle: var(--bloom-font-sans);
68
+ --text-headerBold: 28px;
69
+ --text-headerBold--line-height: 34px;
70
+ --text-headerBold--font-weight: 700;
71
+ --font-headerBold: var(--bloom-font-display);
72
+ --text-buttonLarge: 17px;
73
+ --text-buttonLarge--line-height: 22px;
74
+ --text-buttonLarge--font-weight: 600;
75
+ --font-buttonLarge: var(--bloom-font-sans);
76
+ --font-bloom-sans: var(--bloom-font-sans);
77
+ --font-bloom-display: var(--bloom-font-display);
78
+ --font-bloom-mono: var(--bloom-font-mono);
79
+ --shadow-s: 0 1px 2px rgb(0 0 0 / 0.06), 0 1px 3px rgb(0 0 0 / 0.10);
80
+ --shadow-m: 0 4px 12px rgb(0 0 0 / 0.08), 0 2px 6px rgb(0 0 0 / 0.12);
81
+ }
@@ -0,0 +1,57 @@
1
+ import {
2
+ typographyDefaultsWhenNoClassName,
3
+ mergeTypographyStyle,
4
+ } from '../defaults';
5
+
6
+ describe('typography defaults', () => {
7
+ it('omits inline defaults when className is present', () => {
8
+ expect(
9
+ typographyDefaultsWhenNoClassName('text-[56px] font-bold', {
10
+ fontSize: 13,
11
+ color: 'red',
12
+ }),
13
+ ).toBeUndefined();
14
+ });
15
+
16
+ it('keeps inline defaults when className is absent', () => {
17
+ expect(
18
+ typographyDefaultsWhenNoClassName(undefined, { fontSize: 13, color: 'red' }),
19
+ ).toEqual({ fontSize: 13, color: 'red' });
20
+ });
21
+
22
+ it('keeps inline defaults when className is blank', () => {
23
+ expect(
24
+ typographyDefaultsWhenNoClassName(' ', { fontSize: 13 }),
25
+ ).toEqual({ fontSize: 13 });
26
+ });
27
+
28
+ it('merges base font family after optional defaults', () => {
29
+ expect(
30
+ mergeTypographyStyle(
31
+ 'text-[56px]',
32
+ { fontSize: 13, color: 'red' },
33
+ { fontFamily: 'BlomusModernus' },
34
+ { letterSpacing: -0.5 },
35
+ ),
36
+ ).toEqual([
37
+ undefined,
38
+ { fontFamily: 'BlomusModernus' },
39
+ { letterSpacing: -0.5 },
40
+ ]);
41
+ });
42
+
43
+ it('includes defaults when className is absent', () => {
44
+ expect(
45
+ mergeTypographyStyle(
46
+ undefined,
47
+ { fontSize: 13, color: 'red' },
48
+ { fontFamily: 'BlomusModernus' },
49
+ undefined,
50
+ ),
51
+ ).toEqual([
52
+ { fontSize: 13, color: 'red' },
53
+ { fontFamily: 'BlomusModernus' },
54
+ undefined,
55
+ ]);
56
+ });
57
+ });
@@ -0,0 +1,28 @@
1
+ import type { StyleProp, TextStyle } from 'react-native';
2
+
3
+ /**
4
+ * Bloom typography defaults are applied via inline `style` only when the caller
5
+ * does not pass `className`. When `className` is present, NativeWind compiles
6
+ * font-size / line-height / weight / color utilities into `style` first; inline
7
+ * defaults that repeat those keys would win the merge and silently override the
8
+ * utilities (the Homiio hero-title bug).
9
+ */
10
+ export function typographyDefaultsWhenNoClassName(
11
+ className: string | undefined,
12
+ defaults: TextStyle,
13
+ ): TextStyle | undefined {
14
+ return className?.trim() ? undefined : defaults;
15
+ }
16
+
17
+ export function mergeTypographyStyle(
18
+ className: string | undefined,
19
+ defaults: TextStyle | undefined,
20
+ base: StyleProp<TextStyle>,
21
+ style: StyleProp<TextStyle> | undefined,
22
+ ): StyleProp<TextStyle> {
23
+ const resolvedDefaults = defaults
24
+ ? typographyDefaultsWhenNoClassName(className, defaults)
25
+ : undefined;
26
+
27
+ return [resolvedDefaults, base, style];
28
+ }
@@ -1,16 +1,18 @@
1
1
  import React, { memo } from 'react';
2
2
  import {
3
- Text as RNText,
4
3
  type TextProps as RNTextProps,
5
4
  Platform,
6
- type StyleProp,
7
5
  type TextStyle,
8
6
  } from 'react-native';
9
7
 
10
8
  import { useTheme } from '../theme/use-theme';
11
9
  import { fontFamilies } from '../fonts/tokens';
10
+ import { mergeTypographyStyle, typographyDefaultsWhenNoClassName } from './defaults';
11
+ import { getInteropText, hasTypographyClassNameInterop } from './styled-text';
12
12
 
13
- export type TextProps = RNTextProps;
13
+ export type TextProps = RNTextProps & {
14
+ className?: string;
15
+ };
14
16
 
15
17
  /**
16
18
  * Platform-aware font-family value. On web we resolve to the CSS custom
@@ -36,19 +38,35 @@ function fontFamilyStyle(
36
38
  const SANS_FONT_FAMILY = fontFamilyStyle('sans');
37
39
  const DISPLAY_FONT_FAMILY = fontFamilyStyle('display');
38
40
 
41
+ const DEFAULT_TEXT_TYPOGRAPHY: TextStyle = {
42
+ fontSize: 13,
43
+ };
44
+
39
45
  /**
40
46
  * Base text component with theme-aware default color and the Bloom sans
41
- * font family applied.
47
+ * font family applied. NativeWind `className` utilities (text-*, font-*,
48
+ * leading-*, text-foreground, …) override defaults when provided.
42
49
  */
43
- const TextComponent = function Text({ children, style, ...rest }: TextProps) {
50
+ const TextComponent = function Text({ children, style, className, ...rest }: TextProps) {
44
51
  const { colors } = useTheme();
52
+ const InteropText = getInteropText();
53
+ const interopActive = hasTypographyClassNameInterop();
54
+
55
+ const resolvedClassName = interopActive && className?.trim() ? className : undefined;
45
56
 
46
57
  return (
47
- <RNText
58
+ <InteropText
48
59
  {...rest}
49
- style={[{ fontSize: 13, color: colors.text, ...SANS_FONT_FAMILY }, style]}>
60
+ {...(resolvedClassName ? { className: resolvedClassName } : {})}
61
+ style={mergeTypographyStyle(
62
+ resolvedClassName,
63
+ { ...DEFAULT_TEXT_TYPOGRAPHY, color: colors.text },
64
+ SANS_FONT_FAMILY,
65
+ style,
66
+ )}
67
+ >
50
68
  {children}
51
- </RNText>
69
+ </InteropText>
52
70
  );
53
71
  };
54
72
 
@@ -57,18 +75,30 @@ Text.displayName = 'Text';
57
75
 
58
76
  export { Text as Span };
59
77
 
60
- const HEADING_STYLE: StyleProp<TextStyle> = {
78
+ const HEADING_TYPOGRAPHY: TextStyle = {
61
79
  ...DISPLAY_FONT_FAMILY,
62
80
  fontWeight: '700',
63
81
  };
64
82
 
65
83
  function createHeadingElement({ level }: { level: number }): React.FC<TextProps> {
66
- return function HeadingElement({ style, ...rest }: TextProps) {
84
+ return function HeadingElement({ style, className, ...rest }: TextProps) {
67
85
  const extraProps: Record<string, unknown> =
68
86
  Platform.OS === 'web'
69
87
  ? { role: 'heading', 'aria-level': level }
70
88
  : {};
71
- return <Text {...extraProps} {...rest} style={[HEADING_STYLE, style]} />;
89
+
90
+ const headingBase = className?.trim()
91
+ ? DISPLAY_FONT_FAMILY
92
+ : HEADING_TYPOGRAPHY;
93
+
94
+ return (
95
+ <Text
96
+ {...extraProps}
97
+ {...rest}
98
+ className={className}
99
+ style={[headingBase, style]}
100
+ />
101
+ );
72
102
  };
73
103
  }
74
104
 
@@ -85,14 +115,24 @@ H5.displayName = 'H5';
85
115
  export const H6 = createHeadingElement({ level: 6 });
86
116
  H6.displayName = 'H6';
87
117
 
88
- export function P({ style, ...rest }: TextProps) {
118
+ const DEFAULT_PARAGRAPH_TYPOGRAPHY: TextStyle = {
119
+ fontSize: 15,
120
+ lineHeight: 15 * 1.625,
121
+ };
122
+
123
+ export function P({ style, className, ...rest }: TextProps) {
89
124
  const extraProps: Record<string, unknown> =
90
125
  Platform.OS === 'web' ? { role: 'paragraph' } : {};
126
+ const paragraphDefaults = typographyDefaultsWhenNoClassName(
127
+ className,
128
+ DEFAULT_PARAGRAPH_TYPOGRAPHY,
129
+ );
91
130
  return (
92
131
  <Text
93
132
  {...extraProps}
94
133
  {...rest}
95
- style={[{ fontSize: 15, lineHeight: 15 * 1.625 }, style]}
134
+ className={className}
135
+ style={[paragraphDefaults, style]}
96
136
  />
97
137
  );
98
138
  }
@@ -0,0 +1,41 @@
1
+ import type { ComponentType } from 'react';
2
+ import { Text as RNText, type TextProps } from 'react-native';
3
+
4
+ import { lazyRequire } from '../utils/lazy-require';
5
+
6
+ type StyledTextComponent = ComponentType<TextProps & { className?: string }>;
7
+
8
+ type NativeWindModule = {
9
+ styled: (
10
+ component: typeof RNText,
11
+ mapping?: { className: 'style' },
12
+ ) => StyledTextComponent;
13
+ };
14
+
15
+ const getNativeWind = lazyRequire<NativeWindModule>('nativewind');
16
+
17
+ let interopText: StyledTextComponent = RNText;
18
+
19
+ /**
20
+ * RN `Text` wired for NativeWind `className` → `style` interop when
21
+ * `nativewind` is installed in the consumer. Falls back to plain `RNText`
22
+ * otherwise (className is ignored upstream).
23
+ */
24
+ export function getInteropText(): StyledTextComponent {
25
+ if (interopText !== RNText) {
26
+ return interopText;
27
+ }
28
+
29
+ const nativewind = getNativeWind();
30
+ if (nativewind?.styled) {
31
+ interopText = nativewind.styled(RNText, { className: 'style' });
32
+ }
33
+
34
+ return interopText;
35
+ }
36
+
37
+ /** True when className interop is active (nativewind present). */
38
+ export function hasTypographyClassNameInterop(): boolean {
39
+ getInteropText();
40
+ return interopText !== RNText;
41
+ }