ikualo-ui-kit-mobile 1.9.4 → 1.9.6

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 (5) hide show
  1. package/app.json +1 -1
  2. package/assets/icons/svgs/InfoIcon.tsx +14 -9
  3. package/assets/styles/elements/alert.ts +7 -6
  4. package/package.json +2 -1
  5. package/src/elements/alerts/Alert.tsx +12 -5
package/app.json CHANGED
@@ -3,7 +3,7 @@
3
3
  "name": "ikualo-app-2.0",
4
4
  "slug": "ikualo-app-20",
5
5
  "owner": "ikualo",
6
- "version": "1.9.4",
6
+ "version": "1.9.6",
7
7
  "orientation": "portrait",
8
8
  "icon": "./assets/icon.png",
9
9
  "userInterfaceStyle": "automatic",
package/assets/icons/svgs/InfoIcon.tsx CHANGED
@@ -1,11 +1,16 @@
1
- import Svg, {Path } from "react-native-svg";
2
- import useStore from "../../../src/store";
1
+ import Svg, { Path } from 'react-native-svg';
2
+ import useStore from '../../../src/store';
3
3
 
4
- export const InfoIcon = (props:{style?:any}) => {
5
- const theme = useStore().theme
4
+ export const InfoIcon = (props: { style?: any }) => {
5
+ const theme = useStore().theme;
6
6
 
7
- return (
8
- <Svg width="20" height="20" viewBox="0 0 20 20" fill="none" >
9
- <Path id="Vector" d="M9 5H11V7H9V5ZM10 15C10.55 15 11 14.55 11 14V10C11 9.45 10.55 9 10 9C9.45 9 9 9.45 9 10V14C9 14.55 9.45 15 10 15ZM10 0C4.48 0 0 4.48 0 10C0 15.52 4.48 20 10 20C15.52 20 20 15.52 20 10C20 4.48 15.52 0 10 0ZM10 18C5.59 18 2 14.41 2 10C2 5.59 5.59 2 10 2C14.41 2 18 5.59 18 10C18 14.41 14.41 18 10 18Z" fill={theme.colors.info}/>
10
- </Svg>)
11
- };
7
+ return (
8
+ <Svg width="20" height="20" viewBox="0 0 20 20" fill="none">
9
+ <Path
10
+ id="Vector"
11
+ d="M9 5H11V7H9V5ZM10 15C10.55 15 11 14.55 11 14V10C11 9.45 10.55 9 10 9C9.45 9 9 9.45 9 10V14C9 14.55 9.45 15 10 15ZM10 0C4.48 0 0 4.48 0 10C0 15.52 4.48 20 10 20C15.52 20 20 15.52 20 10C20 4.48 15.52 0 10 0ZM10 18C5.59 18 2 14.41 2 10C2 5.59 5.59 2 10 2C14.41 2 18 5.59 18 10C18 14.41 14.41 18 10 18Z"
12
+ fill={theme.colors.freezed}
13
+ />
14
+ </Svg>
15
+ );
16
+ };
package/assets/styles/elements/alert.ts CHANGED
@@ -8,6 +8,7 @@ export const getStyleAlerts = (theme: ITheme) =>
8
8
  borderRadius: 4,
9
9
  borderLeftWidth: 8,
10
10
  padding: 16,
11
+ overflow: 'hidden',
11
12
  },
12
13
  'alert--absolute': {
13
14
  position: 'absolute',
@@ -22,24 +23,24 @@ export const getStyleAlerts = (theme: ITheme) =>
22
23
  width: '100%',
23
24
  },
24
25
  'alert--info': {
25
- backgroundColor: theme.colors.background_alert,
26
- borderLeftColor: theme.colors.info,
26
+ borderLeftColor: theme.colors.freezed,
27
27
  borderRadius: 16,
28
+ overflow: 'hidden',
28
29
  },
29
30
  'alert--warning': {
30
- backgroundColor: theme.colors.background_alert,
31
- borderLeftColor: theme.colors.warning,
31
+ borderLeftColor: theme.colors.orange_400,
32
32
  borderRadius: 16,
33
+ overflow: 'hidden',
33
34
  },
34
35
  'alert--success': {
35
- backgroundColor: theme.colors.background_alert,
36
36
  borderLeftColor: theme.colors.success,
37
37
  borderRadius: 16,
38
+ overflow: 'hidden',
38
39
  },
39
40
  'alert--error': {
40
- backgroundColor: theme.colors.background_alert,
41
41
  borderLeftColor: theme.colors.error,
42
42
  borderRadius: 16,
43
+ overflow: 'hidden',
43
44
  },
44
45
  'alert-container-text': {
45
46
  flexDirection: 'row',
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "ikualo-ui-kit-mobile",
3
- "version": "1.9.4",
3
+ "version": "1.9.6",
4
4
  "main": "src/index.ts",
5
5
  "scripts": {
6
6
  "start": "expo start",
@@ -16,6 +16,7 @@
16
16
  "@react-navigation/stack": "^6.3.29",
17
17
  "expo": "~52.0.20",
18
18
  "expo-application": "~6.0.1",
19
+ "expo-blur": "~14.0.3",
19
20
  "expo-linear-gradient": "~14.0.1",
20
21
  "expo-updates": "~0.26.10",
21
22
  "react": "^18.3.1",
package/src/elements/alerts/Alert.tsx CHANGED
@@ -7,6 +7,7 @@ import { IFAlertInfo } from '../../models';
7
7
  import { InfoIcon, SuccessIcon, WarningIcon } from '../../../assets/icons/svgs';
8
8
  import { Text } from '../../';
9
9
  import MaterialIcons from '@expo/vector-icons/MaterialIcons';
10
+ import { BlurView } from 'expo-blur';
10
11
 
11
12
  export const Alert = (props: IFAlertInfo) => {
12
13
  const { text, title, type, onClose, miliSeconds, customStyles, position = 'absolute' } = props;
@@ -30,7 +31,10 @@ export const Alert = (props: IFAlertInfo) => {
30
31
  <>
31
32
  {position === 'absolute' ? (
32
33
  <Portal>
33
- <Animated.View
34
+ <BlurView
35
+ intensity={80}
36
+ tint={theme.dark ? 'light' : 'dark'}
37
+ experimentalBlurMethod="dimezisBlurView"
34
38
  style={[
35
39
  styleAlerts['alert'],
36
40
  styleAlerts['alert--absolute'],
@@ -45,13 +49,16 @@ export const Alert = (props: IFAlertInfo) => {
45
49
  </Text>
46
50
  </View>
47
51
  {text && <View style={styleAlerts['alert-body']}>{text}</View>}
48
- </Animated.View>
52
+ </BlurView>
49
53
  </Portal>
50
54
  ) : (
51
- <Animated.View
55
+ <BlurView
56
+ intensity={80}
57
+ tint={theme.dark ? 'light' : 'dark'}
58
+ experimentalBlurMethod="dimezisBlurView"
52
59
  style={[
53
60
  styleAlerts['alert'],
54
- styleAlerts['alert--relative'],
61
+ styleAlerts['alert--absolute'],
55
62
  styleAlerts[`alert--${type}`],
56
63
  customStyles,
57
64
  ]}
@@ -63,7 +70,7 @@ export const Alert = (props: IFAlertInfo) => {
63
70
  </Text>
64
71
  </View>
65
72
  {text && <View style={styleAlerts['alert-body']}>{text}</View>}
66
- </Animated.View>
73
+ </BlurView>
67
74
  )}
68
75
  </>
69
76
  );