@abihealth/goapp-react-native 1.30.1 → 1.31.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.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,12 @@
1
1
  # Changelog
2
2
 
3
+ ## [1.31.0](https://github.com/abiglobalhealth/react-native-sdk/compare/goapp-react-native-v1.30.1...goapp-react-native-v1.31.0) (2025-05-23)
4
+
5
+
6
+ ### Features
7
+
8
+ * add custom text component and improve formatting ([#201](https://github.com/abiglobalhealth/react-native-sdk/issues/201)) ([46d4016](https://github.com/abiglobalhealth/react-native-sdk/commit/46d4016e6c766f5d40b396dcacc0361bff76564f))
9
+
3
10
  ## [1.30.1](https://github.com/abiglobalhealth/react-native-sdk/compare/goapp-react-native-v1.30.0...goapp-react-native-v1.30.1) (2025-05-20)
4
11
 
5
12
 
@@ -66,7 +66,7 @@ var getStyles = function (_a) {
66
66
  },
67
67
  input: {
68
68
  color: palette.black,
69
- fontSize: base.size,
69
+ fontSize: base.fontSize,
70
70
  minWidth: '80%'
71
71
  },
72
72
  error: {
@@ -32,7 +32,7 @@ var getStyles = function (_a) {
32
32
  },
33
33
  label: {
34
34
  color: palette.black,
35
- fontSize: sm.size,
35
+ fontSize: sm.fontSize,
36
36
  lineHeight: sm.lineHeight,
37
37
  fontWeight: 'bold',
38
38
  textAlign: 'auto'
@@ -68,7 +68,7 @@ var getStyles = function (_a) {
68
68
  return react_native_1.StyleSheet.create({
69
69
  input: {
70
70
  color: palette.black,
71
- fontSize: base.size,
71
+ fontSize: base.fontSize,
72
72
  padding: spacing.sm,
73
73
  borderWidth: 1,
74
74
  borderColor: palette.grey.base,
@@ -82,6 +82,12 @@ var getStyles = function (_a) {
82
82
  error: {
83
83
  borderColor: palette.error
84
84
  },
85
- hintContainer: { position: 'absolute', bottom: 4, width: '100%', alignItems: 'center', justifyContent: 'center' }
85
+ hintContainer: {
86
+ position: 'absolute',
87
+ bottom: 4,
88
+ width: '100%',
89
+ alignItems: 'center',
90
+ justifyContent: 'center'
91
+ }
86
92
  });
87
93
  };
@@ -69,7 +69,7 @@ var getStyles = function (_a) {
69
69
  },
70
70
  inputText: {
71
71
  color: palette.black,
72
- fontSize: base.size,
72
+ fontSize: base.fontSize,
73
73
  borderLeftWidth: 1,
74
74
  borderLeftColor: palette.grey.base,
75
75
  paddingLeft: spacing.xs
@@ -1,13 +1,6 @@
1
+ import { TEXT_VARIANT } from '../types/theme';
1
2
  import React from 'react';
2
3
  import { ColorValue, Text as RNText, TextProps as RNTextProps } from 'react-native';
3
- export declare enum TEXT_VARIANT {
4
- h1 = "h1",
5
- h2 = "h2",
6
- h3 = "h3",
7
- h4 = "h4",
8
- base = "base",
9
- sm = "sm"
10
- }
11
4
  type TEXT_VARIANT_KEYS = keyof typeof TEXT_VARIANT;
12
5
  export declare const Text: React.ForwardRefExoticComponent<RNTextProps & {
13
6
  variant?: TEXT_VARIANT_KEYS;
@@ -1,4 +1,15 @@
1
1
  "use strict";
2
+ var __assign = (this && this.__assign) || function () {
3
+ __assign = Object.assign || function(t) {
4
+ for (var s, i = 1, n = arguments.length; i < n; i++) {
5
+ s = arguments[i];
6
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
7
+ t[p] = s[p];
8
+ }
9
+ return t;
10
+ };
11
+ return __assign.apply(this, arguments);
12
+ };
2
13
  var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
14
  if (k2 === undefined) k2 = k;
4
15
  var desc = Object.getOwnPropertyDescriptor(m, k);
@@ -44,24 +55,15 @@ var __rest = (this && this.__rest) || function (s, e) {
44
55
  return t;
45
56
  };
46
57
  Object.defineProperty(exports, "__esModule", { value: true });
47
- exports.Text = exports.TEXT_VARIANT = void 0;
58
+ exports.Text = void 0;
48
59
  var useTheme_1 = require("../hooks/useTheme");
49
60
  var react_1 = __importStar(require("react"));
50
61
  var react_native_1 = require("react-native");
51
- var TEXT_VARIANT;
52
- (function (TEXT_VARIANT) {
53
- TEXT_VARIANT["h1"] = "h1";
54
- TEXT_VARIANT["h2"] = "h2";
55
- TEXT_VARIANT["h3"] = "h3";
56
- TEXT_VARIANT["h4"] = "h4";
57
- TEXT_VARIANT["base"] = "base";
58
- TEXT_VARIANT["sm"] = "sm";
59
- })(TEXT_VARIANT || (exports.TEXT_VARIANT = TEXT_VARIANT = {}));
60
62
  var getDefaultFontWeight = function (variant, font, bold) {
61
63
  var _a;
62
64
  if (bold)
63
65
  return 'bold';
64
- var customWeight = (_a = font[variant]) === null || _a === void 0 ? void 0 : _a.weight;
66
+ var customWeight = (_a = font[variant]) === null || _a === void 0 ? void 0 : _a.fontWeight;
65
67
  if (customWeight)
66
68
  return customWeight;
67
69
  switch (variant) {
@@ -76,36 +78,11 @@ var getDefaultFontWeight = function (variant, font, bold) {
76
78
  return 'normal';
77
79
  }
78
80
  };
79
- var getDefaultFontSize = function (variant, font) {
80
- var _a;
81
- return ((_a = font[variant]) === null || _a === void 0 ? void 0 : _a.size) || font.base.size;
82
- };
83
- var getDefaultLineHeight = function (variant, font) {
84
- var _a;
85
- return ((_a = font[variant]) === null || _a === void 0 ? void 0 : _a.lineHeight) || font.base.lineHeight;
86
- };
87
- var getDefaultAlignment = function (variant, font, center) {
88
- var _a;
89
- var customAlignment = (_a = font[variant]) === null || _a === void 0 ? void 0 : _a.alignment;
90
- if (customAlignment)
91
- return customAlignment;
92
- return center ? 'center' : font.base.alignment;
93
- };
94
- var getDefaultColor = function (variant, font) {
95
- var _a;
96
- return ((_a = font[variant]) === null || _a === void 0 ? void 0 : _a.color) || font.base.color;
97
- };
98
81
  exports.Text = (0, react_1.forwardRef)(function (props, ref) {
99
82
  var theme = (0, useTheme_1.useTheme)();
100
83
  var children = props.children, _a = props.variant, variant = _a === void 0 ? 'base' : _a, style = props.style, bold = props.bold, color = props.color, center = props.center, shrink = props.shrink, rest = __rest(props, ["children", "variant", "style", "bold", "color", "center", "shrink"]);
101
- var defaultStyle = (0, react_1.useMemo)(function () { return ({
102
- fontSize: getDefaultFontSize(variant, theme.font),
103
- fontWeight: getDefaultFontWeight(variant, theme.font, bold),
104
- lineHeight: getDefaultLineHeight(variant, theme.font),
105
- color: color || getDefaultColor(variant, theme.font),
106
- textAlign: getDefaultAlignment(variant, theme.font, center),
107
- flexShrink: shrink ? 1 : 0
108
- }); }, [variant, bold, color, center, shrink, theme]);
84
+ var variantStyle = theme.font[variant];
85
+ var defaultStyle = (0, react_1.useMemo)(function () { return (__assign(__assign({ fontWeight: getDefaultFontWeight(variant, theme.font, bold), textAlign: center ? 'center' : undefined }, variantStyle), { flexShrink: shrink ? 1 : 0 })); }, [variant, bold, color, center, shrink, theme]);
109
86
  return (<react_native_1.Text ref={ref} style={[defaultStyle, style]} {...rest}>
110
87
  {children}
111
88
  </react_native_1.Text>);
@@ -1,4 +1,3 @@
1
- import { TEXT_VARIANT } from '../components/Text';
2
1
  import { ColorValue, StyleProp, TextStyle, ViewStyle } from 'react-native';
3
2
  export type RecursivePartial<T> = {
4
3
  [P in keyof T]?: RecursivePartial<T[P]>;
@@ -98,14 +97,15 @@ export type Components = {
98
97
  placeholderTextColor: ColorValue;
99
98
  };
100
99
  };
101
- export type FontElement = {
102
- color?: ColorValue;
103
- size?: TextStyle['fontSize'];
104
- alignment?: TextStyle['textAlign'];
105
- lineHeight?: TextStyle['lineHeight'];
106
- weight?: TextStyle['fontWeight'];
107
- };
108
- export type Font = Record<TEXT_VARIANT, FontElement>;
100
+ export declare enum TEXT_VARIANT {
101
+ h1 = "h1",
102
+ h2 = "h2",
103
+ h3 = "h3",
104
+ h4 = "h4",
105
+ base = "base",
106
+ sm = "sm"
107
+ }
108
+ export type Font = Record<TEXT_VARIANT, TextStyle>;
109
109
  export type Theme = {
110
110
  palette: Palette;
111
111
  font: Font;
@@ -1,6 +1,15 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.DEFAULT_THEME = void 0;
3
+ exports.DEFAULT_THEME = exports.TEXT_VARIANT = void 0;
4
+ var TEXT_VARIANT;
5
+ (function (TEXT_VARIANT) {
6
+ TEXT_VARIANT["h1"] = "h1";
7
+ TEXT_VARIANT["h2"] = "h2";
8
+ TEXT_VARIANT["h3"] = "h3";
9
+ TEXT_VARIANT["h4"] = "h4";
10
+ TEXT_VARIANT["base"] = "base";
11
+ TEXT_VARIANT["sm"] = "sm";
12
+ })(TEXT_VARIANT || (exports.TEXT_VARIANT = TEXT_VARIANT = {}));
4
13
  exports.DEFAULT_THEME = {
5
14
  palette: {
6
15
  white: '#FFFFFF',
@@ -15,12 +24,27 @@ exports.DEFAULT_THEME = {
15
24
  surface: '#FFF'
16
25
  },
17
26
  font: {
18
- h1: { size: 28, color: '#161616', alignment: 'center', lineHeight: 40 },
19
- h2: { size: 24, color: '#161616', alignment: 'center', lineHeight: 36 },
20
- h3: { size: 20, color: '#161616', alignment: 'center', lineHeight: 24 },
21
- h4: { size: 18, color: '#161616', alignment: 'center', lineHeight: 24 },
22
- base: { size: 16, color: '#161616', alignment: 'center', lineHeight: 24 },
23
- sm: { size: 14, color: '#161616', alignment: 'center', lineHeight: 21 }
27
+ h1: { fontSize: 28, color: '#161616', textAlign: 'center', lineHeight: 40 },
28
+ h2: {
29
+ fontSize: 24,
30
+ color: '#161616',
31
+ textAlign: 'center',
32
+ lineHeight: 36
33
+ },
34
+ h3: { fontSize: 20, color: '#161616', textAlign: 'center', lineHeight: 24 },
35
+ h4: {
36
+ fontSize: 18,
37
+ color: '#161616',
38
+ textAlign: 'center',
39
+ lineHeight: 24
40
+ },
41
+ base: {
42
+ fontSize: 16,
43
+ color: '#161616',
44
+ textAlign: 'center',
45
+ lineHeight: 24
46
+ },
47
+ sm: { fontSize: 14, color: '#161616', textAlign: 'center', lineHeight: 21 }
24
48
  },
25
49
  borderRadius: {
26
50
  sm: 4,
@@ -38,7 +62,19 @@ exports.DEFAULT_THEME = {
38
62
  xxl: 40
39
63
  },
40
64
  shadows: {
41
- soft: { shadowColor: '#757575', shadowOffset: { width: 0, height: 1 }, shadowOpacity: 0.16, shadowRadius: 1.51, elevation: 2 },
42
- strong: { shadowColor: '#757575', shadowOffset: { width: 0, height: 3 }, shadowOpacity: 0.17, shadowRadius: 3.05, elevation: 4 }
65
+ soft: {
66
+ shadowColor: '#757575',
67
+ shadowOffset: { width: 0, height: 1 },
68
+ shadowOpacity: 0.16,
69
+ shadowRadius: 1.51,
70
+ elevation: 2
71
+ },
72
+ strong: {
73
+ shadowColor: '#757575',
74
+ shadowOffset: { width: 0, height: 3 },
75
+ shadowOpacity: 0.17,
76
+ shadowRadius: 3.05,
77
+ elevation: 4
78
+ }
43
79
  }
44
80
  };
@@ -166,12 +166,12 @@ var getStyles = function (_a) {
166
166
  },
167
167
  itemText: {
168
168
  color: palette.black,
169
- fontSize: font.base.size,
169
+ fontSize: font.base.fontSize,
170
170
  fontWeight: 'bold'
171
171
  },
172
172
  itemCategory: {
173
173
  color: palette.grey.dark,
174
- fontSize: font.sm.size,
174
+ fontSize: font.sm.fontSize,
175
175
  paddingLeft: spacing.sm
176
176
  },
177
177
  modal: {
@@ -199,7 +199,7 @@ var getStyles = function (_a) {
199
199
  maxHeight: 54,
200
200
  justifyContent: 'space-between'
201
201
  },
202
- input: __assign({ flex: 1, borderWidth: 0, paddingHorizontal: spacing.sm, fontSize: font.base.size, color: palette.black }, react_native_1.Platform.select({
202
+ input: __assign({ flex: 1, borderWidth: 0, paddingHorizontal: spacing.sm, fontSize: font.base.fontSize, color: palette.black }, react_native_1.Platform.select({
203
203
  web: {
204
204
  outlineWidth: 0
205
205
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@abihealth/goapp-react-native",
3
- "version": "1.30.1",
3
+ "version": "1.31.0",
4
4
  "publishConfig": {
5
5
  "access": "public",
6
6
  "registry": "https://registry.npmjs.org/"