cpk-ui 0.5.0-rc.1 → 0.5.0

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 (4) hide show
  1. package/components/uis/Typography/Typography.d.ts.map +1 -1
  2. package/components/uis/Typography/Typography.js +38 -20
  3. package/package.json +1 -1
  4. package/src/components/uis/Typography/Typography.tsx +43 -19
package/components/uis/Typography/Typography.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Typography.d.ts","sourceRoot":"","sources":["../../../../src/components/uis/Typography/Typography.tsx"],"names":[],"mappings":"AACA,OAAO,EAAY,IAAI,EAAY,MAAM,cAAc,CAAC;AACxD,OAAO,EAAC,QAAQ,EAAgB,MAAM,sBAAsB,CAAC;AAK7D,KAAK,iBAAiB,GAAG;IACvB,MAAM,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,KAAK,gBAAgB,GAAG;IACtB,OAAO,CAAC,EAAE,iBAAiB,CAAC;IAC5B,IAAI,CAAC,EAAE,iBAAiB,CAAC;CAC1B,CAAC;AAuNF,eAAO,MAAM,UAAU;;gBAjNI,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;CA4N5E,CAAC;AAEF,eAAO,MAAM,kBAAkB;;gBA9NJ,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;CAyO5E,CAAC;AAeF,eAAO,MAAM,aAAa,GAAI,cAAc,gBAAgB,KAAG,IAiF9D,CAAC;AAGF,eAAO,MAAM,eAAe,GAAI,WAAW,OAAO,KAAG,iBAOpD,CAAC"}
1
+ {"version":3,"file":"Typography.d.ts","sourceRoot":"","sources":["../../../../src/components/uis/Typography/Typography.tsx"],"names":[],"mappings":"AACA,OAAO,EAAY,IAAI,EAAkC,MAAM,cAAc,CAAC;AAC9E,OAAO,EAAC,QAAQ,EAAgB,MAAM,sBAAsB,CAAC;AAK7D,KAAK,iBAAiB,GAAG;IACvB,MAAM,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,KAAK,gBAAgB,GAAG;IACtB,OAAO,CAAC,EAAE,iBAAiB,CAAC;IAC5B,IAAI,CAAC,EAAE,iBAAiB,CAAC;CAC1B,CAAC;AAmPF,eAAO,MAAM,UAAU;;gBA7OI,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;CAwP5E,CAAC;AAEF,eAAO,MAAM,kBAAkB;;gBA1PJ,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;;gBAAlD,QAAQ;sBAAgB,QAAQ,GAAG,MAAM,GAAG,MAAM;;CAqQ5E,CAAC;AAeF,eAAO,MAAM,aAAa,GAAI,cAAc,gBAAgB,KAAG,IA6E9D,CAAC;AAGF,eAAO,MAAM,eAAe,GAAI,WAAW,OAAO,KAAG,iBAOpD,CAAC"}
package/components/uis/Typography/Typography.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import { jsx as _jsx } from "react/jsx-runtime";
2
2
  import React, { useMemo } from 'react';
3
- import { Text, TextInput } from 'react-native';
3
+ import { Text, TextInput, Platform, StyleSheet } from 'react-native';
4
4
  import { isEmptyObject } from '../../../utils/theme';
5
5
  import { light } from '../../../utils/colors';
6
6
  import { styled, css } from 'kstyled';
@@ -24,18 +24,22 @@ const createBaseText = (colorResolver, fallbackColor, isHeading) => styled(Text)
24
24
  return colorResolver(theme);
25
25
  }};
26
26
  `;
27
- const createTextComponent = ({ BaseText, fontSize, lineHeight, fontWeight, }) => React.memo(({ style, children, ...props }) => {
27
+ const createTextComponent = ({ BaseText, fontSize, lineHeight, fontWeight, isHeading, }) => React.memo(({ style, children, ...props }) => {
28
+ const fontFamilies = getFontFamilies(isHeading);
29
+ const isCustomFont = Platform?.OS === 'android' && fontFamilies.normal !== 'Pretendard';
30
+ // On Android, remove fontWeight when custom font is applied
31
+ const effectiveFontWeight = isCustomFont ? undefined : fontWeight;
28
32
  // Memoize style calculation
29
33
  const textStyle = useMemo(() => [
30
34
  css `
31
35
  font-size: ${fontSize}px;
32
36
  line-height: ${lineHeight}px;
33
- font-weight: ${fontWeight};
37
+ ${effectiveFontWeight ? `font-weight: ${effectiveFontWeight};` : ''}
34
38
  `,
35
39
  { includeFontPadding: false },
36
40
  style,
37
- ], [style]);
38
- return (_jsx(BaseText, { ...props, "$fontWeight": fontWeight, style: textStyle, children: children }));
41
+ ], [style, effectiveFontWeight]);
42
+ return (_jsx(BaseText, { ...props, "$fontWeight": effectiveFontWeight, style: textStyle, children: children }));
39
43
  });
40
44
  const StandardHeadingBaseText = createBaseText((theme) => theme.text.basic, 'gray', true);
41
45
  const StandardBodyBaseText = createBaseText((theme) => theme.text.basic, 'gray', false);
@@ -46,112 +50,132 @@ const Title = createTextComponent({
46
50
  fontSize: 36,
47
51
  lineHeight: 50.4,
48
52
  fontWeight: 'bold',
53
+ isHeading: true,
49
54
  });
50
55
  const Heading1 = createTextComponent({
51
56
  BaseText: StandardHeadingBaseText,
52
57
  fontSize: 28,
53
58
  lineHeight: 39.2,
54
59
  fontWeight: 'bold',
60
+ isHeading: true,
55
61
  });
56
62
  const Heading2 = createTextComponent({
57
63
  BaseText: StandardHeadingBaseText,
58
64
  fontSize: 26,
59
65
  lineHeight: 36.4,
60
66
  fontWeight: 'bold',
67
+ isHeading: true,
61
68
  });
62
69
  const Heading3 = createTextComponent({
63
70
  BaseText: StandardHeadingBaseText,
64
71
  fontSize: 24,
65
72
  lineHeight: 33.6,
66
73
  fontWeight: 'bold',
74
+ isHeading: true,
67
75
  });
68
76
  const Heading4 = createTextComponent({
69
77
  BaseText: StandardHeadingBaseText,
70
78
  fontSize: 22,
71
79
  lineHeight: 30.8,
72
80
  fontWeight: 'bold',
81
+ isHeading: true,
73
82
  });
74
83
  const Heading5 = createTextComponent({
75
84
  BaseText: StandardHeadingBaseText,
76
85
  fontSize: 20,
77
86
  lineHeight: 28,
78
87
  fontWeight: 'bold',
88
+ isHeading: true,
79
89
  });
80
90
  const Body1 = createTextComponent({
81
91
  BaseText: StandardBodyBaseText,
82
92
  fontSize: 18,
83
93
  lineHeight: 25.2,
94
+ isHeading: false,
84
95
  });
85
96
  const Body2 = createTextComponent({
86
97
  BaseText: StandardBodyBaseText,
87
98
  fontSize: 16,
88
99
  lineHeight: 22.4,
100
+ isHeading: false,
89
101
  });
90
102
  const Body3 = createTextComponent({
91
103
  BaseText: StandardBodyBaseText,
92
104
  fontSize: 14,
93
105
  lineHeight: 19.6,
106
+ isHeading: false,
94
107
  });
95
108
  const Body4 = createTextComponent({
96
109
  BaseText: StandardBodyBaseText,
97
110
  fontSize: 12,
98
111
  lineHeight: 16.4,
112
+ isHeading: false,
99
113
  });
100
114
  const InvertedTitle = createTextComponent({
101
115
  BaseText: InvertedHeadingBaseText,
102
116
  fontSize: 36,
103
117
  lineHeight: 50.4,
104
118
  fontWeight: 'bold',
119
+ isHeading: true,
105
120
  });
106
121
  const InvertedHeading1 = createTextComponent({
107
122
  BaseText: InvertedHeadingBaseText,
108
123
  fontSize: 28,
109
124
  lineHeight: 39.2,
110
125
  fontWeight: 'bold',
126
+ isHeading: true,
111
127
  });
112
128
  const InvertedHeading2 = createTextComponent({
113
129
  BaseText: InvertedHeadingBaseText,
114
130
  fontSize: 26,
115
131
  lineHeight: 36.4,
116
132
  fontWeight: 'bold',
133
+ isHeading: true,
117
134
  });
118
135
  const InvertedHeading3 = createTextComponent({
119
136
  BaseText: InvertedHeadingBaseText,
120
137
  fontSize: 24,
121
138
  lineHeight: 33.6,
122
139
  fontWeight: 'bold',
140
+ isHeading: true,
123
141
  });
124
142
  const InvertedHeading4 = createTextComponent({
125
143
  BaseText: InvertedHeadingBaseText,
126
144
  fontSize: 22,
127
145
  lineHeight: 30.8,
128
146
  fontWeight: 'bold',
147
+ isHeading: true,
129
148
  });
130
149
  const InvertedHeading5 = createTextComponent({
131
150
  BaseText: InvertedHeadingBaseText,
132
151
  fontSize: 20,
133
152
  lineHeight: 28,
134
153
  fontWeight: 'bold',
154
+ isHeading: true,
135
155
  });
136
156
  const InvertedBody1 = createTextComponent({
137
157
  BaseText: InvertedBodyBaseText,
138
158
  fontSize: 18,
139
159
  lineHeight: 25.2,
160
+ isHeading: false,
140
161
  });
141
162
  const InvertedBody2 = createTextComponent({
142
163
  BaseText: InvertedBodyBaseText,
143
164
  fontSize: 16,
144
165
  lineHeight: 22.4,
166
+ isHeading: false,
145
167
  });
146
168
  const InvertedBody3 = createTextComponent({
147
169
  BaseText: InvertedBodyBaseText,
148
170
  fontSize: 14,
149
171
  lineHeight: 19.6,
172
+ isHeading: false,
150
173
  });
151
174
  const InvertedBody4 = createTextComponent({
152
175
  BaseText: InvertedBodyBaseText,
153
176
  fontSize: 12,
154
177
  lineHeight: 16.4,
178
+ isHeading: false,
155
179
  });
156
180
  export const Typography = {
157
181
  Title,
@@ -209,6 +233,10 @@ export const setFontFamily = (fontFamilies) => {
209
233
  return userFontFamily;
210
234
  }
211
235
  const fontFamilies = isHeading ? currentFontFamilies.heading : currentFontFamilies.body;
236
+ if (!fontFamilies) {
237
+ // Fallback to default Pretendard if not configured
238
+ return 'Pretendard';
239
+ }
212
240
  const { normal, thin = normal, bold = normal } = fontFamilies;
213
241
  switch (fontWeight) {
214
242
  case 'bold':
@@ -228,23 +256,13 @@ export const setFontFamily = (fontFamilies) => {
228
256
  // @ts-ignore
229
257
  Component.render = function (...args) {
230
258
  const origin = oldRender.call(this, ...args);
231
- // Check if style is an array or object
232
- let flatStyle = {};
233
- if (Array.isArray(origin.props.style)) {
234
- // Flatten array of styles
235
- origin.props.style.forEach((s) => {
236
- if (s) {
237
- flatStyle = { ...flatStyle, ...s };
238
- }
239
- });
240
- }
241
- else if (origin.props.style) {
242
- flatStyle = origin.props.style;
243
- }
259
+ // Flatten styles using React Native's StyleSheet.flatten
260
+ const flatStyle = StyleSheet.flatten(origin.props.style) ?? {};
244
261
  const fontWeight = flatStyle?.fontWeight;
245
262
  const userFontFamily = flatStyle?.fontFamily;
246
- // Determine if this is a heading component (heuristic: bold fontWeight or fontSize > 18)
247
- const isHeading = fontWeight === 'bold' || fontWeight === '700' || (flatStyle?.fontSize && flatStyle.fontSize > 18);
263
+ // Default to body fonts for direct Text/TextInput usage
264
+ // Heading fonts are applied via Typography components
265
+ const isHeading = false;
248
266
  const updatedStyle = [
249
267
  {
250
268
  fontFamily: getFontFamily(fontWeight, userFontFamily, isHeading),
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "cpk-ui",
3
- "version": "0.5.0-rc.1",
3
+ "version": "0.5.0",
4
4
  "main": "index",
5
5
  "react-native": "index",
6
6
  "module": "index",
package/src/components/uis/Typography/Typography.tsx CHANGED
@@ -1,5 +1,5 @@
1
1
  import React, {ReactNode, useMemo} from 'react';
2
- import {StyleProp, Text, TextInput} from 'react-native';
2
+ import {StyleProp, Text, TextInput, Platform, StyleSheet} from 'react-native';
3
3
  import {CpkTheme, isEmptyObject} from '../../../utils/theme';
4
4
  import {light} from '../../../utils/colors';
5
5
  import {type TextStyle} from 'react-native';
@@ -48,11 +48,13 @@ const createTextComponent = ({
48
48
  fontSize,
49
49
  lineHeight,
50
50
  fontWeight,
51
+ isHeading,
51
52
  }: {
52
53
  BaseText: TextComponentType;
53
54
  fontSize: number;
54
55
  lineHeight: number;
55
56
  fontWeight?: 'normal' | 'bold' | 'thin';
57
+ isHeading: boolean;
56
58
  }) =>
57
59
  React.memo(({
58
60
  style,
@@ -62,21 +64,27 @@ const createTextComponent = ({
62
64
  style?: StyleProp<TextStyle>;
63
65
  children?: ReactNode;
64
66
  }) => {
67
+ const fontFamilies = getFontFamilies(isHeading);
68
+ const isCustomFont = Platform?.OS === 'android' && fontFamilies.normal !== 'Pretendard';
69
+
70
+ // On Android, remove fontWeight when custom font is applied
71
+ const effectiveFontWeight = isCustomFont ? undefined : fontWeight;
72
+
65
73
  // Memoize style calculation
66
74
  const textStyle = useMemo(() => [
67
75
  css`
68
76
  font-size: ${fontSize}px;
69
77
  line-height: ${lineHeight}px;
70
- font-weight: ${fontWeight};
78
+ ${effectiveFontWeight ? `font-weight: ${effectiveFontWeight};` : ''}
71
79
  `,
72
80
  {includeFontPadding: false},
73
81
  style,
74
- ], [style]);
82
+ ], [style, effectiveFontWeight]);
75
83
 
76
84
  return (
77
85
  <BaseText
78
86
  {...props}
79
- $fontWeight={fontWeight}
87
+ $fontWeight={effectiveFontWeight}
80
88
  style={textStyle}
81
89
  >
82
90
  {children}
@@ -102,6 +110,7 @@ const Title = createTextComponent({
102
110
  fontSize: 36,
103
111
  lineHeight: 50.4,
104
112
  fontWeight: 'bold',
113
+ isHeading: true,
105
114
  });
106
115
 
107
116
  const Heading1 = createTextComponent({
@@ -109,6 +118,7 @@ const Heading1 = createTextComponent({
109
118
  fontSize: 28,
110
119
  lineHeight: 39.2,
111
120
  fontWeight: 'bold',
121
+ isHeading: true,
112
122
  });
113
123
 
114
124
  const Heading2 = createTextComponent({
@@ -116,6 +126,7 @@ const Heading2 = createTextComponent({
116
126
  fontSize: 26,
117
127
  lineHeight: 36.4,
118
128
  fontWeight: 'bold',
129
+ isHeading: true,
119
130
  });
120
131
 
121
132
  const Heading3 = createTextComponent({
@@ -123,6 +134,7 @@ const Heading3 = createTextComponent({
123
134
  fontSize: 24,
124
135
  lineHeight: 33.6,
125
136
  fontWeight: 'bold',
137
+ isHeading: true,
126
138
  });
127
139
 
128
140
  const Heading4 = createTextComponent({
@@ -130,6 +142,7 @@ const Heading4 = createTextComponent({
130
142
  fontSize: 22,
131
143
  lineHeight: 30.8,
132
144
  fontWeight: 'bold',
145
+ isHeading: true,
133
146
  });
134
147
 
135
148
  const Heading5 = createTextComponent({
@@ -137,30 +150,35 @@ const Heading5 = createTextComponent({
137
150
  fontSize: 20,
138
151
  lineHeight: 28,
139
152
  fontWeight: 'bold',
153
+ isHeading: true,
140
154
  });
141
155
 
142
156
  const Body1 = createTextComponent({
143
157
  BaseText: StandardBodyBaseText,
144
158
  fontSize: 18,
145
159
  lineHeight: 25.2,
160
+ isHeading: false,
146
161
  });
147
162
 
148
163
  const Body2 = createTextComponent({
149
164
  BaseText: StandardBodyBaseText,
150
165
  fontSize: 16,
151
166
  lineHeight: 22.4,
167
+ isHeading: false,
152
168
  });
153
169
 
154
170
  const Body3 = createTextComponent({
155
171
  BaseText: StandardBodyBaseText,
156
172
  fontSize: 14,
157
173
  lineHeight: 19.6,
174
+ isHeading: false,
158
175
  });
159
176
 
160
177
  const Body4 = createTextComponent({
161
178
  BaseText: StandardBodyBaseText,
162
179
  fontSize: 12,
163
180
  lineHeight: 16.4,
181
+ isHeading: false,
164
182
  });
165
183
 
166
184
  const InvertedTitle = createTextComponent({
@@ -168,6 +186,7 @@ const InvertedTitle = createTextComponent({
168
186
  fontSize: 36,
169
187
  lineHeight: 50.4,
170
188
  fontWeight: 'bold',
189
+ isHeading: true,
171
190
  });
172
191
 
173
192
  const InvertedHeading1 = createTextComponent({
@@ -175,6 +194,7 @@ const InvertedHeading1 = createTextComponent({
175
194
  fontSize: 28,
176
195
  lineHeight: 39.2,
177
196
  fontWeight: 'bold',
197
+ isHeading: true,
178
198
  });
179
199
 
180
200
  const InvertedHeading2 = createTextComponent({
@@ -182,6 +202,7 @@ const InvertedHeading2 = createTextComponent({
182
202
  fontSize: 26,
183
203
  lineHeight: 36.4,
184
204
  fontWeight: 'bold',
205
+ isHeading: true,
185
206
  });
186
207
 
187
208
  const InvertedHeading3 = createTextComponent({
@@ -189,6 +210,7 @@ const InvertedHeading3 = createTextComponent({
189
210
  fontSize: 24,
190
211
  lineHeight: 33.6,
191
212
  fontWeight: 'bold',
213
+ isHeading: true,
192
214
  });
193
215
 
194
216
  const InvertedHeading4 = createTextComponent({
@@ -196,6 +218,7 @@ const InvertedHeading4 = createTextComponent({
196
218
  fontSize: 22,
197
219
  lineHeight: 30.8,
198
220
  fontWeight: 'bold',
221
+ isHeading: true,
199
222
  });
200
223
 
201
224
  const InvertedHeading5 = createTextComponent({
@@ -203,30 +226,35 @@ const InvertedHeading5 = createTextComponent({
203
226
  fontSize: 20,
204
227
  lineHeight: 28,
205
228
  fontWeight: 'bold',
229
+ isHeading: true,
206
230
  });
207
231
 
208
232
  const InvertedBody1 = createTextComponent({
209
233
  BaseText: InvertedBodyBaseText,
210
234
  fontSize: 18,
211
235
  lineHeight: 25.2,
236
+ isHeading: false,
212
237
  });
213
238
 
214
239
  const InvertedBody2 = createTextComponent({
215
240
  BaseText: InvertedBodyBaseText,
216
241
  fontSize: 16,
217
242
  lineHeight: 22.4,
243
+ isHeading: false,
218
244
  });
219
245
 
220
246
  const InvertedBody3 = createTextComponent({
221
247
  BaseText: InvertedBodyBaseText,
222
248
  fontSize: 14,
223
249
  lineHeight: 19.6,
250
+ isHeading: false,
224
251
  });
225
252
 
226
253
  const InvertedBody4 = createTextComponent({
227
254
  BaseText: InvertedBodyBaseText,
228
255
  fontSize: 12,
229
256
  lineHeight: 16.4,
257
+ isHeading: false,
230
258
  });
231
259
 
232
260
  export const Typography = {
@@ -290,7 +318,12 @@ export const setFontFamily = (fontFamilies: FontFamilyConfig): void => {
290
318
  return userFontFamily;
291
319
  }
292
320
 
293
- const fontFamilies = isHeading ? currentFontFamilies.heading! : currentFontFamilies.body!;
321
+ const fontFamilies = isHeading ? currentFontFamilies.heading : currentFontFamilies.body;
322
+ if (!fontFamilies) {
323
+ // Fallback to default Pretendard if not configured
324
+ return 'Pretendard';
325
+ }
326
+
294
327
  const {normal, thin = normal, bold = normal} = fontFamilies;
295
328
 
296
329
  switch (fontWeight) {
@@ -314,24 +347,15 @@ export const setFontFamily = (fontFamilies: FontFamilyConfig): void => {
314
347
  Component.render = function (...args: any) {
315
348
  const origin = oldRender.call(this, ...args);
316
349
 
317
- // Check if style is an array or object
318
- let flatStyle: any = {};
319
- if (Array.isArray(origin.props.style)) {
320
- // Flatten array of styles
321
- origin.props.style.forEach((s: any) => {
322
- if (s) {
323
- flatStyle = {...flatStyle, ...s};
324
- }
325
- });
326
- } else if (origin.props.style) {
327
- flatStyle = origin.props.style;
328
- }
350
+ // Flatten styles using React Native's StyleSheet.flatten
351
+ const flatStyle = StyleSheet.flatten(origin.props.style) ?? {};
329
352
 
330
353
  const fontWeight = flatStyle?.fontWeight;
331
354
  const userFontFamily = flatStyle?.fontFamily;
332
355
 
333
- // Determine if this is a heading component (heuristic: bold fontWeight or fontSize > 18)
334
- const isHeading = fontWeight === 'bold' || fontWeight === '700' || (flatStyle?.fontSize && flatStyle.fontSize > 18);
356
+ // Default to body fonts for direct Text/TextInput usage
357
+ // Heading fonts are applied via Typography components
358
+ const isHeading = false;
335
359
 
336
360
  const updatedStyle = [
337
361
  {