@widergy/mobile-ui 2.13.0 → 2.14.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 (6) hide show
  1. package/CHANGELOG.md +19 -0
  2. package/lib/components/UTActionCard/components/BottomActions/constants.js +1 -0
  3. package/lib/components/UTActionCard/components/BottomActions/index.js +74 -31
  4. package/lib/components/UTActionCard/components/BottomActions/styles.js +8 -0
  5. package/lib/components/UTActionCard/index.js +7 -1
  6. package/package.json +1 -1
package/CHANGELOG.md CHANGED
@@ -1,3 +1,22 @@
1
+ # [2.14.0](https://github.com/widergy/mobile-ui/compare/v2.13.1...v2.14.0) (2026-04-27)
2
+
3
+
4
+ ### Bug Fixes
5
+
6
+ * fix ([d120571](https://github.com/widergy/mobile-ui/commit/d120571f6eba58fb7a19e5e832fb7a10bfbe0c17))
7
+
8
+
9
+ ### Features
10
+
11
+ * [CX-2203] extend UTActionCard bottomActions API ([2399427](https://github.com/widergy/mobile-ui/commit/23994271736ab648e2f4f8e926f3d31f8e68dfb0))
12
+
13
+ ## [2.13.1](https://github.com/widergy/mobile-ui/compare/v2.13.0...v2.13.1) (2026-04-24)
14
+
15
+
16
+ ### Bug Fixes
17
+
18
+ * updated docs ([#502](https://github.com/widergy/mobile-ui/issues/502)) ([936a98b](https://github.com/widergy/mobile-ui/commit/936a98bdc71e8e9e2a7283701cbe3581008846de))
19
+
1
20
  # [2.13.0](https://github.com/widergy/mobile-ui/compare/v2.12.2...v2.13.0) (2026-04-22)
2
21
 
3
22
 
package/lib/components/UTActionCard/components/BottomActions/constants.js CHANGED
@@ -1 +1,2 @@
1
1
  export const DEFAULT_REDIRECTION_ICON = 'IconChevronRight';
2
+ export const STATUS_TYPE = 'status';
package/lib/components/UTActionCard/components/BottomActions/index.js CHANGED
@@ -1,47 +1,83 @@
1
1
  import React, { Fragment, memo } from 'react';
2
- import { arrayOf, bool, elementType, func, oneOfType, shape, string } from 'prop-types';
2
+ import { arrayOf, bool, object, oneOfType, func, shape, string } from 'prop-types';
3
3
  import { View } from 'react-native';
4
4
 
5
5
  import UTButton from '../../../UTButton';
6
+ import UTIcon from '../../../UTIcon';
7
+ import UTLabel from '../../../UTLabel';
6
8
  import { ACTION_TYPES } from '../../constants';
7
9
  import { useTheme } from '../../../../theming';
8
10
  import { mergeMultipleStyles } from '../../../../utils/styleUtils';
9
11
 
10
- import { DEFAULT_REDIRECTION_ICON } from './constants';
12
+ import { DEFAULT_REDIRECTION_ICON, STATUS_TYPE } from './constants';
11
13
  import styles, { getThemeStyles } from './styles';
12
14
 
13
- const BottomActions = ({ actions = [], bottomActionsVariant }) => {
15
+ const BottomActions = ({ actions = [], bottomActionsVariant, withTopBorder = true }) => {
14
16
  const theme = useTheme();
15
17
  const type = actions.length > 2 ? ACTION_TYPES.REDIRECTION : bottomActionsVariant || ACTION_TYPES.DEFAULT;
16
18
  const isRedirection = type === ACTION_TYPES.REDIRECTION;
17
19
  const themedStyles = mergeMultipleStyles(styles, getThemeStyles(theme, isRedirection));
18
20
 
19
21
  return (
20
- <View style={[themedStyles.actionsContainer, themedStyles.redirectionActionsContainer]}>
21
- {actions.map(({ colorTheme = 'primary', disabled, Icon, label, loading, onPress }, i) => (
22
- <Fragment key={label}>
23
- {!isRedirection && i > 0 && <View style={[themedStyles.horizontalSeparator]} />}
24
- <UTButton
25
- style={{
26
- icon: themedStyles.icon,
27
- root: themedStyles.actionButton
28
- }}
29
- colorTheme={colorTheme}
30
- disabled={disabled}
31
- Icon={isRedirection ? Icon || DEFAULT_REDIRECTION_ICON : Icon}
32
- iconPlacement={isRedirection ? 'right' : 'left'}
33
- loading={loading}
34
- onPress={onPress}
35
- size="large"
36
- variant="text"
37
- >
38
- {label}
39
- </UTButton>
40
- {isRedirection && actions.length > 1 && i !== actions.length - 1 && (
41
- <View style={[themedStyles.verticalSeparator]} />
42
- )}
43
- </Fragment>
44
- ))}
22
+ <View
23
+ style={[
24
+ themedStyles.actionsContainer,
25
+ themedStyles.redirectionActionsContainer,
26
+ // eslint-disable-next-line react-native/no-inline-styles
27
+ !withTopBorder && { borderTopWidth: 0 }
28
+ ]}
29
+ >
30
+ {actions.map(
31
+ (
32
+ {
33
+ colorTheme = 'primary',
34
+ containerStyle,
35
+ disabled,
36
+ Icon,
37
+ iconArea,
38
+ iconProps = {},
39
+ label,
40
+ labelProps = {},
41
+ loading,
42
+ onPress,
43
+ size = 'large',
44
+ type: itemType
45
+ },
46
+ i
47
+ ) => (
48
+ <Fragment key={label}>
49
+ {!isRedirection && i > 0 && <View style={themedStyles.horizontalSeparator} />}
50
+ {itemType === STATUS_TYPE ? (
51
+ <View style={[themedStyles.statusContainer, containerStyle]}>
52
+ {Icon && <UTIcon area={iconArea} colorTheme={colorTheme} name={Icon} {...iconProps} />}
53
+ <UTLabel colorTheme={colorTheme} {...labelProps}>
54
+ {label}
55
+ </UTLabel>
56
+ </View>
57
+ ) : (
58
+ <UTButton
59
+ style={{
60
+ icon: themedStyles.icon,
61
+ root: { ...themedStyles.actionButton, ...containerStyle }
62
+ }}
63
+ colorTheme={colorTheme}
64
+ disabled={disabled}
65
+ Icon={isRedirection ? Icon || DEFAULT_REDIRECTION_ICON : Icon}
66
+ iconPlacement={isRedirection ? 'right' : 'left'}
67
+ loading={loading}
68
+ onPress={onPress}
69
+ size={size}
70
+ variant="text"
71
+ >
72
+ {label}
73
+ </UTButton>
74
+ )}
75
+ {isRedirection && actions.length > 1 && i !== actions.length - 1 && (
76
+ <View style={themedStyles.verticalSeparator} />
77
+ )}
78
+ </Fragment>
79
+ )
80
+ )}
45
81
  </View>
46
82
  );
47
83
  };
@@ -50,14 +86,21 @@ BottomActions.propTypes = {
50
86
  actions: arrayOf(
51
87
  shape({
52
88
  colorTheme: string,
89
+ containerStyle: object,
53
90
  disabled: bool,
54
- Icon: oneOfType([elementType, string]),
91
+ Icon: oneOfType([string]),
92
+ iconArea: bool,
93
+ iconProps: object,
55
94
  label: string,
95
+ labelProps: object,
56
96
  loading: bool,
57
- onPress: func
97
+ onPress: func,
98
+ size: string,
99
+ type: string
58
100
  })
59
101
  ),
60
- bottomActionsVariant: string
102
+ bottomActionsVariant: string,
103
+ withTopBorder: bool
61
104
  };
62
105
 
63
106
  export default memo(BottomActions);
package/lib/components/UTActionCard/components/BottomActions/styles.js CHANGED
@@ -1,5 +1,6 @@
1
1
  import { StyleSheet } from 'react-native';
2
2
 
3
+ // eslint-disable-next-line default-param-last
3
4
  export const getThemeStyles = (theme = {}, isRedirection) => {
4
5
  const lightPalette = theme.Palette.light;
5
6
 
@@ -42,6 +43,13 @@ const styles = StyleSheet.create({
42
43
  },
43
44
  icon: {
44
45
  marginLeft: 'auto'
46
+ },
47
+ statusContainer: {
48
+ alignItems: 'center',
49
+ flexDirection: 'row',
50
+ gap: 8,
51
+ paddingHorizontal: 16,
52
+ paddingVertical: 12
45
53
  }
46
54
  });
47
55
 
package/lib/components/UTActionCard/index.js CHANGED
@@ -40,6 +40,7 @@ const UTActionCard = ({
40
40
  BackgroundImage,
41
41
  backgroundWidth = '100%',
42
42
  bottomActions,
43
+ bottomActionsBorder = true,
43
44
  bottomActionsVariant,
44
45
  children,
45
46
  classNames = {},
@@ -130,7 +131,11 @@ const UTActionCard = ({
130
131
  {internalLoader && loading
131
132
  ? null
132
133
  : !isEmpty(bottomActions) && (
133
- <BottomActions actions={bottomActions} bottomActionsVariant={bottomActionsVariant} />
134
+ <BottomActions
135
+ actions={bottomActions}
136
+ bottomActionsVariant={bottomActionsVariant}
137
+ withTopBorder={bottomActionsBorder}
138
+ />
134
139
  )}
135
140
  </LoaderWrapper>
136
141
  </Surface>
@@ -163,6 +168,7 @@ UTActionCard.propTypes = {
163
168
  onClick: func
164
169
  })
165
170
  ),
171
+ bottomActionsBorder: bool,
166
172
  bottomActionsVariant: oneOf([ACTION_TYPES.DEFAULT, ACTION_TYPES.REDIRECTION]),
167
173
  classNames: objectOf(string),
168
174
  dataTestId: string,
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": "2.13.0",
5
+ "version": "2.14.0",
6
6
  "repository": "https://github.com/widergy/mobile-ui.git",
7
7
  "main": "lib/index.js",
8
8
  "files": [