@widergy/mobile-ui 1.3.1 → 1.3.3

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/CHANGELOG.md +14 -0
  2. package/lib/components/Button/index.js +26 -21
  3. package/lib/components/UTHeader/index.js +43 -23
  4. package/package.json +1 -1
package/CHANGELOG.md CHANGED
@@ -1,3 +1,17 @@
1
+ ## [1.3.3](https://github.com/widergy/mobile-ui/compare/v1.3.2...v1.3.3) (2024-03-15)
2
+
3
+
4
+ ### Bug Fixes
5
+
6
+ * custom components in utheader ([#269](https://github.com/widergy/mobile-ui/issues/269)) ([4400fce](https://github.com/widergy/mobile-ui/commit/4400fce3977d35080ebd766a253dba6d0da0c753))
7
+
8
+ ## [1.3.2](https://github.com/widergy/mobile-ui/compare/v1.3.1...v1.3.2) (2024-03-14)
9
+
10
+
11
+ ### Bug Fixes
12
+
13
+ * added iconContainer ([#266](https://github.com/widergy/mobile-ui/issues/266)) ([bfe9d47](https://github.com/widergy/mobile-ui/commit/bfe9d4733f51d876c45ff002d2dd64cbaac183b1))
14
+
1
15
  ## [1.3.1](https://github.com/widergy/mobile-ui/compare/v1.3.0...v1.3.1) (2024-03-13)
2
16
 
3
17
 
package/lib/components/Button/index.js CHANGED
@@ -19,17 +19,18 @@ const Button = ({
19
19
  effectColor,
20
20
  elevation,
21
21
  icon,
22
- iconStyle,
22
+ iconContainerStyle,
23
23
  iconPlacement,
24
+ iconStyle,
24
25
  labelColor,
25
- testID,
26
26
  labelProps,
27
27
  lowerCase,
28
28
  mode,
29
29
  onPress,
30
+ outerContainerStyles,
30
31
  secondary,
32
+ testID,
31
33
  theme,
32
- outerContainerStyles,
33
34
  title
34
35
  }) => {
35
36
  const themeStyles = getThemeStyles(theme);
@@ -61,15 +62,17 @@ const Button = ({
61
62
  >
62
63
  <View style={[styles.button, contentStyle]}>
63
64
  {icon && iconPlacement !== ICON_PLACEMENTS.right && (
64
- <Icon
65
- color={textColor}
66
- name={icon.name}
67
- type={icon.type}
68
- style={[title && styles.leftIcon, iconStyle]}
69
- size={icon.size || themeStyles.fontSize}
70
- width={icon.width}
71
- height={icon.height}
72
- />
65
+ <View style={[title && styles.leftIcon, iconContainerStyle]}>
66
+ <Icon
67
+ color={textColor}
68
+ name={icon.name}
69
+ type={icon.type}
70
+ style={iconStyle}
71
+ size={icon.size || themeStyles.fontSize}
72
+ width={icon.width}
73
+ height={icon.height}
74
+ />
75
+ </View>
73
76
  )}
74
77
  {title && (
75
78
  <Label base color={textColor} {...labelProps}>
@@ -77,15 +80,17 @@ const Button = ({
77
80
  </Label>
78
81
  )}
79
82
  {icon && iconPlacement === ICON_PLACEMENTS.right && (
80
- <Icon
81
- color={textColor}
82
- name={icon.name}
83
- type={icon.type}
84
- style={[title && styles.rightIcon, iconStyle]}
85
- size={icon.size || themeStyles.fontSize}
86
- width={icon.width}
87
- height={icon.height}
88
- />
83
+ <View style={[title && styles.rightIcon, iconContainerStyle]}>
84
+ <Icon
85
+ color={textColor}
86
+ name={icon.name}
87
+ type={icon.type}
88
+ style={iconStyle}
89
+ size={icon.size || themeStyles.fontSize}
90
+ width={icon.width}
91
+ height={icon.height}
92
+ />
93
+ </View>
89
94
  )}
90
95
  </View>
91
96
  </Touchable>
package/lib/components/UTHeader/index.js CHANGED
@@ -8,33 +8,53 @@ import UTBanner from '../UTBanner';
8
8
  import ownStyles from './styles';
9
9
 
10
10
  const UTHeader = ({ tagline, title, subtitle, requiredFieldInfo, helpText, useMarkdown, banner }) => {
11
+ const renderComponent = (prop, standardComponent) =>
12
+ React.isValidElement(prop) ? prop : standardComponent;
13
+
14
+ const Tagline = renderComponent(
15
+ tagline,
16
+ <Label disabled bold useMarkdown={useMarkdown} style={ownStyles.child}>
17
+ {tagline.toUpperCase()}
18
+ </Label>
19
+ );
20
+
21
+ const Title = renderComponent(
22
+ title,
23
+ <Label big bold style={ownStyles.title} useMarkdown={useMarkdown}>
24
+ {title}
25
+ </Label>
26
+ );
27
+
28
+ const Subtitle = renderComponent(
29
+ subtitle,
30
+ <Label disabled useMarkdown={useMarkdown} style={ownStyles.child}>
31
+ {subtitle}
32
+ </Label>
33
+ );
34
+
35
+ const RequiredFieldInfo = renderComponent(
36
+ requiredFieldInfo,
37
+ <Label disabled useMarkdown={useMarkdown} style={ownStyles.child}>
38
+ {requiredFieldInfo}
39
+ </Label>
40
+ );
41
+
42
+ const HelpText = renderComponent(
43
+ helpText,
44
+ <Label disabled useMarkdown={useMarkdown} style={ownStyles.child}>
45
+ {helpText}
46
+ </Label>
47
+ );
48
+
11
49
  return (
12
50
  <View style={ownStyles.header}>
13
- {tagline && (
14
- <Label disabled bold useMarkdown={useMarkdown} style={ownStyles.child}>
15
- {tagline.toUpperCase()}
16
- </Label>
17
- )}
51
+ {!!tagline && Tagline}
18
52
  <View>
19
- <Label big bold style={ownStyles.title} useMarkdown={useMarkdown}>
20
- {title}
21
- </Label>
22
- {subtitle && (
23
- <Label disabled useMarkdown={useMarkdown} style={ownStyles.child}>
24
- {subtitle}
25
- </Label>
26
- )}
53
+ {Title}
54
+ {!!subtitle && Subtitle}
27
55
  </View>
28
- {requiredFieldInfo && (
29
- <Label disabled useMarkdown={useMarkdown} style={ownStyles.child}>
30
- {requiredFieldInfo}
31
- </Label>
32
- )}
33
- {helpText && (
34
- <Label disabled useMarkdown={useMarkdown} style={ownStyles.child}>
35
- {helpText}
36
- </Label>
37
- )}
56
+ {!!requiredFieldInfo && RequiredFieldInfo}
57
+ {!!helpText && HelpText}
38
58
  {banner?.text && <UTBanner text={banner.text} icon={banner.icon} style={{ banner: ownStyles.child }} />}
39
59
  </View>
40
60
  );
package/package.json CHANGED
@@ -2,7 +2,7 @@
2
2
  "name": "@widergy/mobile-ui",
3
3
  "description": "Widergy Mobile Components",
4
4
  "author": "widergy",
5
- "version": "1.3.1",
5
+ "version": "1.3.3",
6
6
  "repository": "https://github.com/widergy/mobile-ui.git",
7
7
  "main": "lib/index.js",
8
8
  "files": [