@widergy/mobile-ui 1.32.11 → 1.32.12

package/CHANGELOG.md

@@ -1,3 +1,10 @@
+## [1.32.12](https://github.com/widergy/mobile-ui/compare/v1.32.11...v1.32.12) (2024-12-11)
+
+
+### Bug Fixes
+
+* [UGC-1038] text scaling adjustments ([#398](https://github.com/widergy/mobile-ui/issues/398)) ([368fb41](https://github.com/widergy/mobile-ui/commit/368fb4158f03c9f1cf5c7a105aa7074bceb1eac5))
+
 ## [1.32.11](https://github.com/widergy/mobile-ui/compare/v1.32.10...v1.32.11) (2024-12-06)
 
 

package/lib/components/UTLabel/theme.js

@@ -1,7 +1,7 @@
 import { COLOR_SHADES } from '../../constants/Palette';
 import { getDefaultColorShade } from '../../utils/styleUtils';
 import { IS_IOS } from '../../utils/platformUtils/constants';
-import { scale } from '../../utils/scaleUtils';
+import { factorScale } from '../../utils/scaleUtils';
 
 import { LINE_HEIGHTS, VARIANTS_SIZES, WEIGHTS } from './constants';
 import { DEFAULT_PROPS } from './proptypes';
@@ -17,7 +17,8 @@ export const getFontFamily = (theme, weight) =>
     ? theme.fonts.fontFamily
     : theme.fonts?.customVariants?.[weight]?.fontFamily;
 
-export const getFontSize = variant => scale(VARIANTS_SIZES[variant] || VARIANTS_SIZES[DEFAULT_PROPS.variant]);
+export const getFontSize = variant =>
+  factorScale(VARIANTS_SIZES[variant] || VARIANTS_SIZES[DEFAULT_PROPS.variant]);
 
 export const getFontWeight = weight => (IS_IOS ? WEIGHTS[weight] || WEIGHTS[DEFAULT_PROPS.weight] : null);
 
@@ -44,5 +45,5 @@ export const retrieveStyle = ({ colorTheme, field, shade, theme, variant, weight
   margin: 0,
   paddingVertical: 0,
   textAlignVertical: 'center',
-  ...(LINE_HEIGHTS?.[variant] ? { lineHeight: scale(LINE_HEIGHTS[variant]) } : {})
+  ...(LINE_HEIGHTS?.[variant] ? { lineHeight: factorScale(LINE_HEIGHTS[variant]) } : {})
 });

package/lib/utils/constants.js

@@ -1,3 +1,5 @@
 // Base Device Guidelines (~5in)
 export const GUIDELINES_BASE_WIDTH = 350;
 export const GUIDELINES_BASE_HEIGHT = 680;
+
+export const SCALING_FACTOR = 0.7; // This value was determined by the UX team, please do not change it without prior consultation

package/lib/utils/scaleUtils/index.js

@@ -1,6 +1,6 @@
 import { Dimensions } from 'react-native';
 
-import { GUIDELINES_BASE_HEIGHT, GUIDELINES_BASE_WIDTH } from '../constants';
+import { GUIDELINES_BASE_HEIGHT, GUIDELINES_BASE_WIDTH, SCALING_FACTOR } from '../constants';
 
 export const { height: WINDOW_HEIGHT, width: WINDOW_WIDTH } = Dimensions.get('window');
 
@@ -32,7 +32,11 @@ export const verticalScale = size => (WINDOW_HEIGHT / GUIDELINES_BASE_HEIGHT) *
  */
 export const moderateVerticalScale = (size, factor = 0.5) => size + (verticalScale(size) - size) * factor;
 
-export const scale = size => Math.round((verticalScale(size) + horizontalScale(size)) / 2);
+const factorVerticalScale = size => (WINDOW_HEIGHT / GUIDELINES_BASE_HEIGHT) ** SCALING_FACTOR * size;
+
+const factorHorizontalScale = size => (WINDOW_WIDTH / GUIDELINES_BASE_WIDTH) ** SCALING_FACTOR * size;
+
+export const factorScale = size => (factorVerticalScale(size) + factorHorizontalScale(size)) / 2;
 
 export default {
   horizontalScale,
@@ -41,5 +45,5 @@ export default {
   verticalScale,
   WINDOW_HEIGHT,
   WINDOW_WIDTH,
-  scale
+  factorScale
 };

package/package.json

@@ -2,7 +2,7 @@
   "name": "@widergy/mobile-ui",
   "description": "Widergy Mobile Components",
   "author": "widergy",
-  "version": "1.32.11",
+  "version": "1.32.12",
   "repository": "https://github.com/widergy/mobile-ui.git",
   "main": "lib/index.js",
   "files": [