@widergy/mobile-ui 1.13.2 → 1.13.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 (10) hide show
  1. package/CHANGELOG.md +7 -0
  2. package/lib/components/Icon/{assets → components/CustomIcon/assets}/eye-off.svg +1 -1
  3. package/lib/components/Icon/{assets → components/CustomIcon/assets}/eye.svg +1 -1
  4. package/lib/components/Icon/components/CustomIcon/constants.js +9 -0
  5. package/lib/components/Icon/components/CustomIcon/index.js +25 -0
  6. package/lib/components/Icon/constants.js +3 -5
  7. package/lib/components/Icon/index.js +2 -1
  8. package/lib/components/UTTextInput/versions/V0/components/BaseInput/index.js +7 -3
  9. package/lib/components/UTTextInput/versions/V1/components/TextInputField/index.js +3 -0
  10. package/package.json +1 -1
package/CHANGELOG.md CHANGED
@@ -1,3 +1,10 @@
1
+ ## [1.13.3](https://github.com/widergy/mobile-ui/compare/v1.13.2...v1.13.3) (2024-07-17)
2
+
3
+
4
+ ### Bug Fixes
5
+
6
+ * some fixes in icon ([#311](https://github.com/widergy/mobile-ui/issues/311)) ([9d57432](https://github.com/widergy/mobile-ui/commit/9d57432197c15b3200a6b1dafe982dc37c54cb5c))
7
+
1
8
  ## [1.13.2](https://github.com/widergy/mobile-ui/compare/v1.13.1...v1.13.2) (2024-07-15)
2
9
 
3
10
 
package/lib/components/Icon/{assets → components/CustomIcon/assets}/eye-off.svg RENAMED
@@ -1,5 +1,5 @@
1
1
  <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
2
2
  <g id="eye-off">
3
- <path id="Vector (Stroke)" fill-rule="evenodd" clip-rule="evenodd" d="M1.91078 1.91058C2.23622 1.58514 2.76386 1.58514 3.0893 1.91058L14.9861 13.8074C15.0321 13.8444 15.0748 13.8867 15.113 13.9343L18.0893 16.9106C18.4147 17.236 18.4147 17.7637 18.0893 18.0891C17.7639 18.4145 17.2362 18.4145 16.9108 18.0891L14.3384 15.5167C13.0039 16.2804 11.5544 16.6665 10 16.6665C6.2667 16.6665 3.25604 14.4606 0.943181 10.4133C0.796755 10.1571 0.796773 9.8425 0.943227 9.58629C1.92481 7.86906 3.03083 6.48078 4.27262 5.45092L1.91078 3.08909C1.58535 2.76366 1.58535 2.23602 1.91078 1.91058ZM5.45722 6.63553C4.45474 7.43811 3.5102 8.55088 2.63331 9.99993C4.71491 13.442 7.17738 14.9998 10 14.9998C11.1045 14.9998 12.1366 14.763 13.1068 14.2851L11.0783 12.2566C10.744 12.4166 10.3751 12.502 9.99748 12.5018C9.33435 12.5016 8.69848 12.2379 8.22974 11.7689C7.761 11.2998 7.4978 10.6637 7.49803 10.0006C7.49816 9.62354 7.58346 9.25529 7.74327 8.92157L5.45722 6.63553ZM9.3635 10.5418C9.37784 10.5587 9.39291 10.575 9.40867 10.5908C9.42457 10.6067 9.44104 10.6219 9.45805 10.6364L9.3635 10.5418ZM9.99709 4.99983C9.33243 4.99748 8.67077 5.08906 8.03173 5.27186C7.58925 5.39845 7.12792 5.14235 7.00134 4.69986C6.87476 4.25738 7.13086 3.79605 7.57335 3.66947C8.36287 3.44362 9.18033 3.3304 10.0015 3.33317C13.7342 3.33375 16.7443 5.53961 19.0569 9.58637C19.2033 9.84261 19.2033 10.1572 19.0568 10.4134C18.3832 11.5918 17.6523 12.6144 16.8595 13.4721C16.5471 13.8101 16.0199 13.8309 15.6819 13.5185C15.3439 13.2061 15.3232 12.6789 15.6356 12.3409C16.2384 11.6886 16.8161 10.9099 17.3668 9.99975C15.2852 6.55771 12.8227 4.99984 10 4.99984L9.99709 4.99983Z" fill="#677489"/>
3
+ <path id="Vector (Stroke)" fill-rule="evenodd" clip-rule="evenodd" d="M1.91078 1.91058C2.23622 1.58514 2.76386 1.58514 3.0893 1.91058L14.9861 13.8074C15.0321 13.8444 15.0748 13.8867 15.113 13.9343L18.0893 16.9106C18.4147 17.236 18.4147 17.7637 18.0893 18.0891C17.7639 18.4145 17.2362 18.4145 16.9108 18.0891L14.3384 15.5167C13.0039 16.2804 11.5544 16.6665 10 16.6665C6.2667 16.6665 3.25604 14.4606 0.943181 10.4133C0.796755 10.1571 0.796773 9.8425 0.943227 9.58629C1.92481 7.86906 3.03083 6.48078 4.27262 5.45092L1.91078 3.08909C1.58535 2.76366 1.58535 2.23602 1.91078 1.91058ZM5.45722 6.63553C4.45474 7.43811 3.5102 8.55088 2.63331 9.99993C4.71491 13.442 7.17738 14.9998 10 14.9998C11.1045 14.9998 12.1366 14.763 13.1068 14.2851L11.0783 12.2566C10.744 12.4166 10.3751 12.502 9.99748 12.5018C9.33435 12.5016 8.69848 12.2379 8.22974 11.7689C7.761 11.2998 7.4978 10.6637 7.49803 10.0006C7.49816 9.62354 7.58346 9.25529 7.74327 8.92157L5.45722 6.63553ZM9.3635 10.5418C9.37784 10.5587 9.39291 10.575 9.40867 10.5908C9.42457 10.6067 9.44104 10.6219 9.45805 10.6364L9.3635 10.5418ZM9.99709 4.99983C9.33243 4.99748 8.67077 5.08906 8.03173 5.27186C7.58925 5.39845 7.12792 5.14235 7.00134 4.69986C6.87476 4.25738 7.13086 3.79605 7.57335 3.66947C8.36287 3.44362 9.18033 3.3304 10.0015 3.33317C13.7342 3.33375 16.7443 5.53961 19.0569 9.58637C19.2033 9.84261 19.2033 10.1572 19.0568 10.4134C18.3832 11.5918 17.6523 12.6144 16.8595 13.4721C16.5471 13.8101 16.0199 13.8309 15.6819 13.5185C15.3439 13.2061 15.3232 12.6789 15.6356 12.3409C16.2384 11.6886 16.8161 10.9099 17.3668 9.99975C15.2852 6.55771 12.8227 4.99984 10 4.99984L9.99709 4.99983Z" />
4
4
  </g>
5
5
  </svg>
package/lib/components/Icon/{assets → components/CustomIcon/assets}/eye.svg RENAMED
@@ -1,3 +1,3 @@
1
1
  <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
2
- <path fill-rule="evenodd" clip-rule="evenodd" d="M3.15986 12C5.65779 16.1305 8.61278 18 12 18C15.3872 18 18.3422 16.1305 20.8401 12C18.3422 7.86948 15.3872 6 12 6C8.61278 6 5.65779 7.86948 3.15986 12ZM1.13177 11.5038C3.9072 6.64709 7.51999 4 12 4C16.48 4 20.0928 6.64709 22.8682 11.5038C23.0439 11.8113 23.0439 12.1887 22.8682 12.4962C20.0928 17.3529 16.48 20 12 20C7.51999 20 3.9072 17.3529 1.13177 12.4962C0.956077 12.1887 0.956077 11.8113 1.13177 11.5038ZM12 11C11.4477 11 11 11.4477 11 12C11 12.5523 11.4477 13 12 13C12.5523 13 13 12.5523 13 12C13 11.4477 12.5523 11 12 11ZM9 12C9 10.3431 10.3431 9 12 9C13.6569 9 15 10.3431 15 12C15 13.6569 13.6569 15 12 15C10.3431 15 9 13.6569 9 12Z" fill="#677489"/>
2
+ <path fill-rule="evenodd" clip-rule="evenodd" d="M3.15986 12C5.65779 16.1305 8.61278 18 12 18C15.3872 18 18.3422 16.1305 20.8401 12C18.3422 7.86948 15.3872 6 12 6C8.61278 6 5.65779 7.86948 3.15986 12ZM1.13177 11.5038C3.9072 6.64709 7.51999 4 12 4C16.48 4 20.0928 6.64709 22.8682 11.5038C23.0439 11.8113 23.0439 12.1887 22.8682 12.4962C20.0928 17.3529 16.48 20 12 20C7.51999 20 3.9072 17.3529 1.13177 12.4962C0.956077 12.1887 0.956077 11.8113 1.13177 11.5038ZM12 11C11.4477 11 11 11.4477 11 12C11 12.5523 11.4477 13 12 13C12.5523 13 13 12.5523 13 12C13 11.4477 12.5523 11 12 11ZM9 12C9 10.3431 10.3431 9 12 9C13.6569 9 15 10.3431 15 12C15 13.6569 13.6569 15 12 15C10.3431 15 9 13.6569 9 12Z" />
3
3
  </svg>
package/lib/components/Icon/components/CustomIcon/constants.js ADDED
@@ -0,0 +1,9 @@
1
+ import VisibilityOff from './assets/eye-off.svg';
2
+ import Visibility from './assets/eye.svg';
3
+
4
+ export const DEFAULT_ICON_SIZE = 20;
5
+
6
+ export const CUSTOM_ICONS = {
7
+ visibility: Visibility,
8
+ 'visibility-off': VisibilityOff
9
+ };
package/lib/components/Icon/components/CustomIcon/index.js ADDED
@@ -0,0 +1,25 @@
1
+ import { string, number } from 'prop-types';
2
+ import React from 'react';
3
+
4
+ import { CUSTOM_ICONS, DEFAULT_ICON_SIZE } from './constants';
5
+
6
+ const CustomIcon = ({ height, name, size, width, fill = '#677489' }) => {
7
+ const CustomIconComponent = CUSTOM_ICONS[name];
8
+ return (
9
+ <CustomIconComponent
10
+ height={size || height || DEFAULT_ICON_SIZE}
11
+ width={size || width || DEFAULT_ICON_SIZE}
12
+ fill={fill}
13
+ />
14
+ );
15
+ };
16
+
17
+ CustomIcon.propTypes = {
18
+ height: number,
19
+ name: string,
20
+ size: number,
21
+ width: number,
22
+ fill: string
23
+ };
24
+
25
+ export default CustomIcon;
package/lib/components/Icon/constants.js CHANGED
@@ -11,8 +11,7 @@ import SimpleLineIcon from 'react-native-vector-icons/SimpleLineIcons';
11
11
  import FeatherIcon from 'react-native-vector-icons/Feather';
12
12
  import AntIcon from 'react-native-vector-icons/AntDesign';
13
13
 
14
- import VisibilityOff from './assets/eye-off.svg';
15
- import Visibility from './assets/eye.svg';
14
+ import CustomIcon from './components/CustomIcon';
16
15
 
17
16
  const DEFAULT_ICON_COMPONENT = MaterialIcon;
18
17
  export const DEFAULT_ICON_TYPE = 'material';
@@ -29,9 +28,8 @@ const ICON_TYPES = {
29
28
  'material-community': MaterialCommunityIcon,
30
29
  octicon: OcticonIcon,
31
30
  'simple-line-icon': SimpleLineIcon,
32
- visibility: Visibility,
33
- 'visibility-off': VisibilityOff,
34
- zocial: ZocialIcon
31
+ zocial: ZocialIcon,
32
+ custom: CustomIcon
35
33
  };
36
34
 
37
35
  export const getIconComponent = type => ICON_TYPES[type] || DEFAULT_ICON_COMPONENT;
package/lib/components/Icon/index.js CHANGED
@@ -3,7 +3,7 @@ import React from 'react';
3
3
  import propTypes from './propTypes';
4
4
  import { getIconComponent, DEFAULT_ICON_TYPE, DEFAULT_ICON_SIZE } from './constants';
5
5
 
6
- const Icon = ({ color, height, name, size, style, type, width }) => {
6
+ const Icon = ({ color, height, name, size, style, type, width, fill }) => {
7
7
  const IconComponent = getIconComponent(type);
8
8
  return (
9
9
  <IconComponent
@@ -14,6 +14,7 @@ const Icon = ({ color, height, name, size, style, type, width }) => {
14
14
  style={style}
15
15
  type={type}
16
16
  width={size || width || DEFAULT_ICON_SIZE}
17
+ fill={fill}
17
18
  />
18
19
  );
19
20
  };
package/lib/components/UTTextInput/versions/V0/components/BaseInput/index.js CHANGED
@@ -9,7 +9,7 @@ import Icon from '../../../../../Icon';
9
9
  import Touchable from '../../../../../Touchable';
10
10
 
11
11
  import { DEBOUNCE_DELAY, DEBOUNCE_CONFIG, VISIBILITY, VISIBILITY_OFF } from './constants';
12
- import styles from './styles';
12
+ import styles, { ICON_SIZE } from './styles';
13
13
 
14
14
  const BaseInput = forwardRef(
15
15
  (
@@ -62,7 +62,9 @@ const BaseInput = forwardRef(
62
62
 
63
63
  const hiddenInputProps = hiddenInput
64
64
  ? {
65
- type: showInput ? VISIBILITY : VISIBILITY_OFF,
65
+ name: showInput ? VISIBILITY : VISIBILITY_OFF,
66
+ size: ICON_SIZE,
67
+ color: theme.UTTextInput?.passwordEyeColor || theme.colors.primary,
66
68
  ...(RightIcon || {})
67
69
  }
68
70
  : {};
@@ -85,8 +87,9 @@ const BaseInput = forwardRef(
85
87
  select && { color: theme.fonts?.fontColor },
86
88
  select && disabled && { color: theme.fonts?.fontDisabledColor }
87
89
  ]}
90
+ id={props?.id ? `${props.id}` : undefined}
88
91
  />
89
- {RightIcon && (
92
+ {(RightIcon || hiddenInput) && (
90
93
  <Touchable
91
94
  borderless
92
95
  onPress={hiddenInput ? toggleShowInput : onRightIconPress}
@@ -118,6 +121,7 @@ BaseInput.propTypes = {
118
121
  onChange: func.isRequired,
119
122
  disabled: bool,
120
123
  value: string,
124
+ id: string,
121
125
  RightIcon: oneOf([shape({ name: string, type: string, color: string }), elementType]),
122
126
  hiddenInput: bool,
123
127
  onRightIconPress: func,
package/lib/components/UTTextInput/versions/V1/components/TextInputField/index.js CHANGED
@@ -28,6 +28,7 @@ const TextInputField = forwardRef(
28
28
  alwaysShowPlaceholder,
29
29
  disabled,
30
30
  error,
31
+ id,
31
32
  inputSize,
32
33
  LeftIcon,
33
34
  maxCount,
@@ -145,6 +146,7 @@ const TextInputField = forwardRef(
145
146
  autoCapitalize={autoCapitalize}
146
147
  autoCorrect={false}
147
148
  editable={!disabled && !readOnly}
149
+ id={id ? `${id}` : undefined}
148
150
  keyboardType={keyboardType}
149
151
  maxLength={maxCount}
150
152
  multiline={multiline}
@@ -206,6 +208,7 @@ TextInputField.propTypes = {
206
208
  alwaysShowPlaceholder: bool,
207
209
  disabled: bool,
208
210
  error: string,
211
+ id: string,
209
212
  inputSize: string,
210
213
  LeftIcon: elementType,
211
214
  maxCount: number,
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.13.2",
5
+ "version": "1.13.3",
6
6
  "repository": "https://github.com/widergy/mobile-ui.git",
7
7
  "main": "lib/index.js",
8
8
  "files": [