sapo-components-ui-rn 1.1.19 → 1.1.21
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.
- package/dist/assets/icon-radio-active.svg +5 -0
- package/dist/assets/icon-radio.svg +4 -0
- package/dist/assets/index.ts +13 -0
- package/dist/assets/svg/icon-radio-active.svg +5 -0
- package/dist/assets/svg/icon-radio.svg +4 -0
- package/dist/assets/svg/index.d.ts +7 -0
- package/dist/assets/svg/index.ts +13 -0
- package/dist/components/Icon/index.d.ts +0 -2
- package/dist/components/TextInput/constants.d.ts +2 -2
- package/dist/index.esm.js +55 -63
- package/dist/index.esm.js.map +1 -1
- package/dist/index.js +68 -74
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
- package/src/.DS_Store +0 -0
- package/src/assets/svg/icon-radio-active.svg +5 -0
- package/src/assets/svg/icon-radio.svg +4 -0
- package/src/assets/svg/index.ts +13 -0
- package/src/components/Checkbox/index.tsx +0 -1
- package/src/components/Icon/index.tsx +5 -47
- package/src/components/IconSvg/index.tsx +6 -7
- package/src/components/NumberKeyboard/index.tsx +1 -2
- package/src/components/RadioButton/index.tsx +1 -2
- package/src/components/SearchInput/index.tsx +2 -3
- package/src/components/SelectionField/index.tsx +1 -1
- package/src/components/Tag/index.tsx +0 -1
- package/src/components/Text/index.tsx +2 -2
- package/src/components/TextInput/TextInputDefault.tsx +1 -1
- package/src/components/TextInput/TextInputFlat.tsx +1 -1
- package/src/components/TextInput/TextInputNumber.tsx +2 -3
- package/src/components/TextInput/constants.tsx +2 -2
- package/src/components/Toast/index.tsx +1 -1
- package/src/icons/IconRadio.tsx +2 -9
- package/src/icons/IconRadioActive.tsx +3 -9
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
2
|
+
<path d="M4 12C4 7.58172 7.58172 4 12 4C16.4183 4 20 7.58172 20 12C20 16.4183 16.4183 20 12 20C7.58172 20 4 16.4183 4 12Z" fill="#0088FF"/>
|
|
3
|
+
<circle cx="12" cy="12" r="6" fill="white"/>
|
|
4
|
+
<circle cx="12" cy="12" r="4" fill="#0088FF"/>
|
|
5
|
+
</svg>
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
2
|
+
<path d="M4 12C4 7.58172 7.58172 4 12 4C16.4183 4 20 7.58172 20 12C20 16.4183 16.4183 20 12 20C7.58172 20 4 16.4183 4 12Z" fill="#A3A8AF"/>
|
|
3
|
+
<path d="M6 12C6 8.68629 8.68629 6 12 6C15.3137 6 18 8.68629 18 12C18 15.3137 15.3137 18 12 18C8.68629 18 6 15.3137 6 12Z" fill="white"/>
|
|
4
|
+
</svg>
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import IconClose from "./icon-close.svg";
|
|
2
|
+
import IconCheckbox from "./icon-checkbox.svg";
|
|
3
|
+
import IconCheckboxActive from "./icon-checkbox-active.svg";
|
|
4
|
+
import IconRadio from "./icon-radio.svg";
|
|
5
|
+
import IconRadioActive from "./icon-radio-active.svg";
|
|
6
|
+
|
|
7
|
+
export const Svg = {
|
|
8
|
+
IconClose,
|
|
9
|
+
IconCheckbox,
|
|
10
|
+
IconCheckboxActive,
|
|
11
|
+
IconRadio,
|
|
12
|
+
IconRadioActive,
|
|
13
|
+
};
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
2
|
+
<path d="M4 12C4 7.58172 7.58172 4 12 4C16.4183 4 20 7.58172 20 12C20 16.4183 16.4183 20 12 20C7.58172 20 4 16.4183 4 12Z" fill="#0088FF"/>
|
|
3
|
+
<circle cx="12" cy="12" r="6" fill="white"/>
|
|
4
|
+
<circle cx="12" cy="12" r="4" fill="#0088FF"/>
|
|
5
|
+
</svg>
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
2
|
+
<path d="M4 12C4 7.58172 7.58172 4 12 4C16.4183 4 20 7.58172 20 12C20 16.4183 16.4183 20 12 20C7.58172 20 4 16.4183 4 12Z" fill="#A3A8AF"/>
|
|
3
|
+
<path d="M6 12C6 8.68629 8.68629 6 12 6C15.3137 6 18 8.68629 18 12C18 15.3137 15.3137 18 12 18C8.68629 18 6 15.3137 6 12Z" fill="white"/>
|
|
4
|
+
</svg>
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
export declare const Svg: {
|
|
2
|
+
IconClose: import("react").FC<import("react-native-svg").SvgProps>;
|
|
3
|
+
IconCheckbox: import("react").FC<import("react-native-svg").SvgProps>;
|
|
4
|
+
IconCheckboxActive: import("react").FC<import("react-native-svg").SvgProps>;
|
|
5
|
+
IconRadio: import("react").FC<import("react-native-svg").SvgProps>;
|
|
6
|
+
IconRadioActive: import("react").FC<import("react-native-svg").SvgProps>;
|
|
7
|
+
};
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import IconClose from "./icon-close.svg";
|
|
2
|
+
import IconCheckbox from "./icon-checkbox.svg";
|
|
3
|
+
import IconCheckboxActive from "./icon-checkbox-active.svg";
|
|
4
|
+
import IconRadio from "./icon-radio.svg";
|
|
5
|
+
import IconRadioActive from "./icon-radio-active.svg";
|
|
6
|
+
|
|
7
|
+
export const Svg = {
|
|
8
|
+
IconClose,
|
|
9
|
+
IconCheckbox,
|
|
10
|
+
IconCheckboxActive,
|
|
11
|
+
IconRadio,
|
|
12
|
+
IconRadioActive,
|
|
13
|
+
};
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
import React from "react";
|
|
2
2
|
import { StyleProp, TextStyle } from "react-native";
|
|
3
|
-
export type IconType = "FontAwesome" | "Image" | "MaterialIcons" | "Feather" | "MaterialCommunityIcons" | "Svg";
|
|
4
3
|
export interface IconProps {
|
|
5
4
|
name: "IconCheckboxActive" | "IconCheckbox" | "IconRadio" | "IconRadioActive" | "IconRadioDisable" | "IconArrowDown" | "IconClearText" | "IconSearch" | "IconClose" | "IconSuccess" | "IconError" | "IconInfo" | "IconWarning" | "IconDelNumber";
|
|
6
5
|
backgroundColor?: string;
|
|
@@ -9,7 +8,6 @@ export interface IconProps {
|
|
|
9
8
|
style?: StyleProp<TextStyle>;
|
|
10
9
|
showBackground?: boolean;
|
|
11
10
|
onPress?: () => void;
|
|
12
|
-
type?: IconType;
|
|
13
11
|
tintColor?: string;
|
|
14
12
|
animatedProps?: Record<string, unknown>;
|
|
15
13
|
}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
export declare const MAXIMIZED_LABEL_FONT_SIZE =
|
|
2
|
-
export declare const MINIMIZED_LABEL_FONT_SIZE =
|
|
1
|
+
export declare const MAXIMIZED_LABEL_FONT_SIZE = 14;
|
|
2
|
+
export declare const MINIMIZED_LABEL_FONT_SIZE = 12;
|
|
3
3
|
export declare const LABEL_WIGGLE_X_OFFSET = 4;
|
|
4
4
|
export declare const ADORNMENT_SIZE = 24;
|
|
5
5
|
export declare const MIN_WIDTH = 100;
|
package/dist/index.esm.js
CHANGED
|
@@ -1,13 +1,15 @@
|
|
|
1
1
|
import { Dimensions, Platform, StyleSheet, useColorScheme, TouchableOpacity, View as View$1, Text as Text$2, Animated as Animated$1, Pressable, I18nManager, useWindowDimensions, TextInput as TextInput$1, Modal, Keyboard, ActivityIndicator, ImageBackground, Image as Image$2 } from 'react-native';
|
|
2
2
|
import * as React$3 from 'react';
|
|
3
|
-
import React__default, { memo, useCallback, forwardRef as forwardRef$1,
|
|
3
|
+
import React__default, { memo, useCallback, forwardRef as forwardRef$1, useState, useEffect, useMemo, useRef, useImperativeHandle } from 'react';
|
|
4
4
|
import require$$1 from 'deepmerge';
|
|
5
5
|
import Animated, { useSharedValue, withSequence, withTiming, withSpring, useAnimatedStyle, interpolateColor, useAnimatedReaction } from 'react-native-reanimated';
|
|
6
6
|
import color from 'color';
|
|
7
|
-
import
|
|
8
|
-
import
|
|
9
|
-
import
|
|
10
|
-
import
|
|
7
|
+
import IconClose$1 from './assets/svg/icon-close.svg';
|
|
8
|
+
import IconCheckbox$1 from './assets/svg/icon-checkbox.svg';
|
|
9
|
+
import IconCheckboxActive$1 from './assets/svg/icon-checkbox-active.svg';
|
|
10
|
+
import IconRadio$1 from './assets/svg/icon-radio.svg';
|
|
11
|
+
import IconRadioActive$1 from './assets/svg/icon-radio-active.svg';
|
|
12
|
+
import Svg$1, { Rect, Path, Circle } from 'react-native-svg';
|
|
11
13
|
import { useSafeAreaInsets, SafeAreaProvider } from 'react-native-safe-area-context';
|
|
12
14
|
import { useDebouncedCallback } from 'use-debounce';
|
|
13
15
|
|
|
@@ -1888,8 +1890,8 @@ function getTextColor(_a) {
|
|
|
1888
1890
|
return theme.colors.textDefault;
|
|
1889
1891
|
}
|
|
1890
1892
|
|
|
1891
|
-
var MAXIMIZED_LABEL_FONT_SIZE =
|
|
1892
|
-
var MINIMIZED_LABEL_FONT_SIZE =
|
|
1893
|
+
var MAXIMIZED_LABEL_FONT_SIZE = 14;
|
|
1894
|
+
var MINIMIZED_LABEL_FONT_SIZE = 12;
|
|
1893
1895
|
var LABEL_WIGGLE_X_OFFSET = 4;
|
|
1894
1896
|
var ADORNMENT_SIZE = 24;
|
|
1895
1897
|
var MIN_WIDTH = 100;
|
|
@@ -4775,10 +4777,10 @@ var Text = function (props) {
|
|
|
4775
4777
|
fontWeight: "normal",
|
|
4776
4778
|
color: colors.textDefault,
|
|
4777
4779
|
fontFamily: "Inter-Regular",
|
|
4778
|
-
fontSize:
|
|
4780
|
+
fontSize: 14,
|
|
4779
4781
|
lineHeight: 20,
|
|
4780
4782
|
};
|
|
4781
|
-
var _a = props.size, size = _a === void 0 ?
|
|
4783
|
+
var _a = props.size, size = _a === void 0 ? 14 : _a, lineHeight = props.lineHeight, center = props.center, color = props.color, bold = props.bold, medium = props.medium, semibold = props.semibold;
|
|
4782
4784
|
style.color = theme.colors.textDefault || "black";
|
|
4783
4785
|
if (size) {
|
|
4784
4786
|
style.fontSize = size;
|
|
@@ -5013,87 +5015,80 @@ var colors = {
|
|
|
5013
5015
|
icon: icon,
|
|
5014
5016
|
};
|
|
5015
5017
|
|
|
5018
|
+
var Svg = {
|
|
5019
|
+
IconClose: IconClose$1,
|
|
5020
|
+
IconCheckbox: IconCheckbox$1,
|
|
5021
|
+
IconCheckboxActive: IconCheckboxActive$1,
|
|
5022
|
+
IconRadio: IconRadio$1,
|
|
5023
|
+
IconRadioActive: IconRadioActive$1,
|
|
5024
|
+
};
|
|
5025
|
+
|
|
5016
5026
|
var SvgIcon = function (_a) {
|
|
5017
5027
|
var name = _a.name, _b = _a.width, width = _b === void 0 ? 24 : _b, _c = _a.height, height = _c === void 0 ? 24 : _c, _d = _a.color, color = _d === void 0 ? colors.ink.INK40 : _d, style = _a.style, onPress = _a.onPress, _e = _a.disabled, disabled = _e === void 0 ? false : _e;
|
|
5018
|
-
|
|
5019
|
-
if (!
|
|
5020
|
-
console.warn("Icon
|
|
5021
|
-
return
|
|
5028
|
+
var IconComponent = Svg[name];
|
|
5029
|
+
if (!IconComponent) {
|
|
5030
|
+
console.warn("Icon \"".concat(name, "\" kh\u00F4ng t\u1ED3n t\u1EA1i trong Svg."));
|
|
5031
|
+
return null;
|
|
5022
5032
|
}
|
|
5023
|
-
var IconComponent = name;
|
|
5024
5033
|
return (React__default.createElement(IconComponent, { width: width, height: height, color: disabled ? colors.ink.INK20 : color, style: style, onPress: disabled ? undefined : onPress }));
|
|
5025
5034
|
};
|
|
5026
5035
|
|
|
5027
|
-
var IconCheckboxActive = function (props) { return (React$3.createElement(Svg, __assign({ width: 24, height: 24, viewBox: "0 0 24 24", fill: "none" }, props),
|
|
5036
|
+
var IconCheckboxActive = function (props) { return (React$3.createElement(Svg$1, __assign({ width: 24, height: 24, viewBox: "0 0 24 24", fill: "none" }, props),
|
|
5028
5037
|
React$3.createElement(Rect, { x: 2, y: 2, width: 20, height: 20, rx: 6, fill: "currentColor" }),
|
|
5029
5038
|
React$3.createElement(Path, { d: "M17.7745 8.32544L10.4245 15.6751L6.74951 12.0004", stroke: "white", strokeWidth: 2, strokeLinecap: "round", strokeLinejoin: "round" }))); };
|
|
5030
5039
|
|
|
5031
|
-
var IconCheckbox = function (props) { return (React$3.createElement(Svg, __assign({ width: 24, height: 24, viewBox: "0 0 24 24", fill: "none" }, props),
|
|
5040
|
+
var IconCheckbox = function (props) { return (React$3.createElement(Svg$1, __assign({ width: 24, height: 24, viewBox: "0 0 24 24", fill: "none" }, props),
|
|
5032
5041
|
React$3.createElement(Rect, { x: 2.75, y: 2.75, width: 18.5, height: 18.5, rx: 5.25, fill: "currentColor", stroke: "#A1A5AB", strokeWidth: 1.5 }))); };
|
|
5033
5042
|
|
|
5034
|
-
var IconRadio = function (props) { return (React$3.createElement(Svg, __assign({ width: 24, height: 24, viewBox: "0 0 24 24", fill: "none" }, props),
|
|
5035
|
-
React$3.createElement(
|
|
5036
|
-
React$3.createElement(Path, { d: "M6 12C6 8.68629 8.68629 6 12 6C15.3137 6 18 8.68629 18 12C18 15.3137 15.3137 18 12 18C8.68629 18 6 15.3137 6 12Z", fill: "white" }))); };
|
|
5043
|
+
var IconRadio = function (props) { return (React$3.createElement(Svg$1, __assign({ width: 24, height: 24, viewBox: "0 0 24 24", fill: "none" }, props),
|
|
5044
|
+
React$3.createElement(Circle, { cx: 12, cy: 12, r: 9.25, stroke: "#A1A5AB", strokeWidth: 1.5 }))); };
|
|
5037
5045
|
|
|
5038
|
-
var IconRadioActive = function (props) { return (React$3.createElement(Svg, __assign({ width: 24, height: 24, viewBox: "0 0 24 24", fill: "none" }, props),
|
|
5039
|
-
React$3.createElement(
|
|
5040
|
-
React$3.createElement(Circle, { cx:
|
|
5041
|
-
React$3.createElement(Circle, { cx: "12", cy: "12", r: "4", fill: "#0071ED" }))); };
|
|
5046
|
+
var IconRadioActive = function (props) { return (React$3.createElement(Svg$1, __assign({ width: 24, height: 24, viewBox: "0 0 24 24", fill: "none" }, props),
|
|
5047
|
+
React$3.createElement(Circle, { cx: 12, cy: 12, r: 9.25, stroke: "currentColor", strokeWidth: 1.5 }),
|
|
5048
|
+
React$3.createElement(Circle, { cx: 12, cy: 12, r: 6, fill: "currentColor" }))); };
|
|
5042
5049
|
|
|
5043
|
-
var IconRadioDisable = function (props) { return (React$3.createElement(Svg, __assign({ width: 24, height: 24, viewBox: "0 0 24 24", fill: "none" }, props),
|
|
5050
|
+
var IconRadioDisable = function (props) { return (React$3.createElement(Svg$1, __assign({ width: 24, height: 24, viewBox: "0 0 24 24", fill: "none" }, props),
|
|
5044
5051
|
React$3.createElement(Circle, { cx: 12, cy: 12, r: 9.25, stroke: "#E5E7EB", strokeWidth: 1.5 }),
|
|
5045
5052
|
React$3.createElement(Circle, { cx: 12, cy: 12, r: 6, fill: "#F3F4F6" }))); };
|
|
5046
5053
|
|
|
5047
|
-
var IconArrowDown = function (props) { return (React$3.createElement(Svg, __assign({ width: 24, height: 24, viewBox: "0 0 24 24", fill: "none" }, props),
|
|
5054
|
+
var IconArrowDown = function (props) { return (React$3.createElement(Svg$1, __assign({ width: 24, height: 24, viewBox: "0 0 24 24", fill: "none" }, props),
|
|
5048
5055
|
React$3.createElement(Path, { d: "M18.0107 9.70166L12 15.7124L5.98926 9.70166L7.40332 8.2876L12 12.8843L16.5967 8.2876L18.0107 9.70166Z", fill: "currentColor" }))); };
|
|
5049
5056
|
|
|
5050
|
-
var IconClearText = function (props) { return (React$3.createElement(Svg, __assign({ width: 24, height: 24, viewBox: "0 0 24 24", fill: "none" }, props),
|
|
5057
|
+
var IconClearText = function (props) { return (React$3.createElement(Svg$1, __assign({ width: 24, height: 24, viewBox: "0 0 24 24", fill: "none" }, props),
|
|
5051
5058
|
React$3.createElement(Path, { d: "M12 2.00043C17.53 2.00043 22 6.47046 22 12.0004C21.9997 17.5302 17.5298 22.0004 12 22.0004C6.47016 22.0004 2.00026 17.5302 2 12.0004C2.00004 6.47046 6.47003 2.00043 12 2.00043ZM12 10.5903L9.41016 8.00043L8 9.40961L10.5898 12.0004L8 14.5903L9.41016 16.0004L12 13.4096L14.5898 16.0004L16 14.5903L13.4102 12.0004L16 9.40961L14.5898 8.00043L12 10.5903Z", fill: "currentColor" }))); };
|
|
5052
5059
|
|
|
5053
|
-
var IconSearch = function (props) { return (React$3.createElement(Svg, __assign({ width: 16, height: 16, viewBox: "0 0 16 16", fill: "none" }, props),
|
|
5060
|
+
var IconSearch = function (props) { return (React$3.createElement(Svg$1, __assign({ width: 16, height: 16, viewBox: "0 0 16 16", fill: "none" }, props),
|
|
5054
5061
|
React$3.createElement(Path, { d: "M15.7 14.3L11.5 10.1C11.3 9.9 11 9.8 10.7 9.8C11.5 8.8 12 7.4 12 6C12 2.7 9.3 0 6 0C2.7 0 0 2.7 0 6C0 9.3 2.7 12 6 12C7.4 12 8.8 11.5 9.8 10.6C9.8 10.9 9.8 11.2 10.1 11.4L14.3 15.6C14.5 15.8 14.8 15.9 15 15.9C15.2 15.9 15.5 15.8 15.7 15.6C16.1 15.3 16.1 14.7 15.7 14.3ZM6 10.5C3.5 10.5 1.5 8.5 1.5 6C1.5 3.5 3.5 1.5 6 1.5C8.5 1.5 10.5 3.5 10.5 6C10.5 8.5 8.5 10.5 6 10.5Z", fill: "currentColor" }))); };
|
|
5055
5062
|
|
|
5056
|
-
var IconClose = function (props) { return (React$3.createElement(Svg, __assign({ width: 24, height: 24, viewBox: "0 0 24 24", fill: "none" }, props),
|
|
5063
|
+
var IconClose = function (props) { return (React$3.createElement(Svg$1, __assign({ width: 24, height: 24, viewBox: "0 0 24 24", fill: "none" }, props),
|
|
5057
5064
|
React$3.createElement(Path, { d: "M19 6.40958L13.4102 12.0004L19 17.5902L17.5898 19.0004L12 13.4096L6.41016 19.0004L5 17.5902L10.5898 12.0004L5 6.40958L6.41016 5.0004L12 10.5902L17.5898 5.0004L19 6.40958Z", fill: "currentColor" }))); };
|
|
5058
5065
|
|
|
5059
|
-
var IconSuccess = function (props) { return (React__default.createElement(Svg, __assign({ width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, props),
|
|
5066
|
+
var IconSuccess = function (props) { return (React__default.createElement(Svg$1, __assign({ width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, props),
|
|
5060
5067
|
React__default.createElement(Path, { fillRule: "evenodd", clipRule: "evenodd", d: "M10 2.5C5.85786 2.5 2.5 5.85786 2.5 10C2.5 14.1421 5.85786 17.5 10 17.5C14.1421 17.5 17.5 14.1421 17.5 10C17.5 5.85786 14.1421 2.5 10 2.5ZM3.86364 10C3.86364 6.61098 6.61098 3.86364 10 3.86364C13.389 3.86364 16.1364 6.61098 16.1364 10C16.1364 13.389 13.389 16.1364 10 16.1364C6.61098 16.1364 3.86364 13.389 3.86364 10Z", fill: "white" }),
|
|
5061
5068
|
React__default.createElement(Path, { fillRule: "evenodd", clipRule: "evenodd", d: "M8.875 10.9242L12.8447 6.9545L13.9053 8.01516L8.875 13.0455L6.09467 10.2652L7.15533 9.2045L8.875 10.9242Z", fill: "white" }))); };
|
|
5062
5069
|
|
|
5063
|
-
var IconError = function (props) { return (React__default.createElement(Svg, __assign({ width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, props),
|
|
5070
|
+
var IconError = function (props) { return (React__default.createElement(Svg$1, __assign({ width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, props),
|
|
5064
5071
|
React__default.createElement(Path, { fillRule: "evenodd", clipRule: "evenodd", d: "M10 2.5C5.85786 2.5 2.5 5.85786 2.5 10C2.5 14.1421 5.85786 17.5 10 17.5C14.1421 17.5 17.5 14.1421 17.5 10C17.5 5.85786 14.1421 2.5 10 2.5ZM3.86364 10C3.86364 6.61098 6.61098 3.86364 10 3.86364C13.389 3.86364 16.1364 6.61098 16.1364 10C16.1364 13.389 13.389 16.1364 10 16.1364C6.61098 16.1364 3.86364 13.389 3.86364 10Z", fill: "white" }),
|
|
5065
5072
|
React__default.createElement(Path, { fillRule: "evenodd", clipRule: "evenodd", d: "M13.3333 6.66667L10 10L6.66667 6.66667L5.83333 7.5L9.16667 10.8333L5.83333 14.1667L6.66667 15L10 11.6667L13.3333 15L14.1667 14.1667L10.8333 10.8333L14.1667 7.5L13.3333 6.66667Z", fill: "white" }))); };
|
|
5066
5073
|
|
|
5067
|
-
var IconInfo = function (props) { return (React__default.createElement(Svg, __assign({ width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, props),
|
|
5074
|
+
var IconInfo = function (props) { return (React__default.createElement(Svg$1, __assign({ width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, props),
|
|
5068
5075
|
React__default.createElement(Path, { fillRule: "evenodd", clipRule: "evenodd", d: "M10 2.5C5.85786 2.5 2.5 5.85786 2.5 10C2.5 14.1421 5.85786 17.5 10 17.5C14.1421 17.5 17.5 14.1421 17.5 10C17.5 5.85786 14.1421 2.5 10 2.5ZM3.86364 10C3.86364 6.61098 6.61098 3.86364 10 3.86364C13.389 3.86364 16.1364 6.61098 16.1364 10C16.1364 13.389 13.389 16.1364 10 16.1364C6.61098 16.1364 3.86364 13.389 3.86364 10Z", fill: "white" }),
|
|
5069
5076
|
React__default.createElement(Path, { fillRule: "evenodd", clipRule: "evenodd", d: "M10 6.66667C10.4602 6.66667 10.8333 7.03976 10.8333 7.5V10.8333C10.8333 11.2936 10.4602 11.6667 10 11.6667C9.53976 11.6667 9.16667 11.2936 9.16667 10.8333V7.5C9.16667 7.03976 9.53976 6.66667 10 6.66667Z", fill: "white" }),
|
|
5070
5077
|
React__default.createElement(Path, { fillRule: "evenodd", clipRule: "evenodd", d: "M10 12.5C10.4602 12.5 10.8333 12.8731 10.8333 13.3333C10.8333 13.7936 10.4602 14.1667 10 14.1667C9.53976 14.1667 9.16667 13.7936 9.16667 13.3333C9.16667 12.8731 9.53976 12.5 10 12.5Z", fill: "white" }))); };
|
|
5071
5078
|
|
|
5072
|
-
var IconWarning = function (props) { return (React__default.createElement(Svg, __assign({ width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, props),
|
|
5079
|
+
var IconWarning = function (props) { return (React__default.createElement(Svg$1, __assign({ width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, props),
|
|
5073
5080
|
React__default.createElement(Path, { fillRule: "evenodd", clipRule: "evenodd", d: "M10 2.5L17.5 17.5H2.5L10 2.5ZM10 5.83333L4.16667 15.8333H15.8333L10 5.83333Z", fill: "white" }),
|
|
5074
5081
|
React__default.createElement(Path, { fillRule: "evenodd", clipRule: "evenodd", d: "M10 7.5C10.4602 7.5 10.8333 7.8731 10.8333 8.33333V11.6667C10.8333 12.1269 10.4602 12.5 10 12.5C9.53976 12.5 9.16667 12.1269 9.16667 11.6667V8.33333C9.16667 7.8731 9.53976 7.5 10 7.5Z", fill: "white" }),
|
|
5075
5082
|
React__default.createElement(Path, { fillRule: "evenodd", clipRule: "evenodd", d: "M10 13.3333C10.4602 13.3333 10.8333 13.7064 10.8333 14.1667C10.8333 14.6269 10.4602 15 10 15C9.53976 15 9.16667 14.6269 9.16667 14.1667C9.16667 13.7064 9.53976 13.3333 10 13.3333Z", fill: "white" }))); };
|
|
5076
5083
|
|
|
5077
|
-
var IconDelNumber = function (props) { return (React$3.createElement(Svg, __assign({ width: 28, height: 20, viewBox: "0 0 28 20", fill: "none" }, props),
|
|
5084
|
+
var IconDelNumber = function (props) { return (React$3.createElement(Svg$1, __assign({ width: 28, height: 20, viewBox: "0 0 28 20", fill: "none" }, props),
|
|
5078
5085
|
React$3.createElement(Path, { d: "M25.1705 0H11.5404C10.9189 0.000239015 10.3202 0.240624 9.8659 0.6725L1.0149 9.08617C0.766199 9.32258 0.625 9.65352 0.625 10C0.625 10.3465 0.766199 10.6774 1.0149 10.9138L9.86599 19.3276C10.3203 19.7595 10.9189 19.9998 11.5404 20H25.1705C25.8214 20 26.4458 19.7366 26.9061 19.2678C27.3664 18.7989 27.625 18.163 27.625 17.5V2.5C27.625 1.83696 27.3664 1.20108 26.9061 0.732233C26.4458 0.263392 25.8214 0 25.1705 0Z", fill: "currentColor" }),
|
|
5079
5086
|
React$3.createElement(Path, { fillRule: "evenodd", clipRule: "evenodd", d: "M13.8326 5.95343C14.2267 5.5665 14.8598 5.57231 15.2468 5.9664L17.8059 8.57296L20.3651 5.9664C20.752 5.57231 21.3852 5.5665 21.7792 5.95343C22.1733 6.34035 22.1791 6.97349 21.7922 7.36758L19.2073 10.0003L21.7922 12.6331C22.1791 13.0272 22.1733 13.6603 21.7792 14.0472C21.3852 14.4341 20.752 14.4283 20.3651 14.0342L17.8059 11.4277L15.2468 14.0342C14.8598 14.4283 14.2267 14.4341 13.8326 14.0472C13.4385 13.6603 13.4327 13.0272 13.8196 12.6331L16.4045 10.0003L13.8196 7.36758C13.4327 6.97349 13.4385 6.34035 13.8326 5.95343Z", fill: "white" }))); };
|
|
5080
5087
|
|
|
5081
|
-
var getIconComponent = function (type) {
|
|
5082
|
-
switch (type) {
|
|
5083
|
-
case "MaterialIcons":
|
|
5084
|
-
return MaterialIcons;
|
|
5085
|
-
case "MaterialCommunityIcons":
|
|
5086
|
-
return MaterialCommunityIcons;
|
|
5087
|
-
case "FontAwesome":
|
|
5088
|
-
default:
|
|
5089
|
-
return FontAwesome;
|
|
5090
|
-
}
|
|
5091
|
-
};
|
|
5092
5088
|
var Icon = function (_a) {
|
|
5093
|
-
var name = _a.name, _b = _a.size, size = _b === void 0 ? 14 : _b, color = _a.color, style = _a.style
|
|
5089
|
+
var name = _a.name, _b = _a.size, size = _b === void 0 ? 14 : _b, color = _a.color, style = _a.style, onPress = _a.onPress;
|
|
5094
5090
|
var theme = useInternalTheme();
|
|
5095
5091
|
var colors = theme.colors;
|
|
5096
|
-
var IconComponent = useMemo(function () { return getIconComponent(type); }, [type]);
|
|
5097
5092
|
var renderName = function () {
|
|
5098
5093
|
switch (name) {
|
|
5099
5094
|
case "IconCheckboxActive":
|
|
@@ -5129,10 +5124,7 @@ var Icon = function (_a) {
|
|
|
5129
5124
|
}
|
|
5130
5125
|
};
|
|
5131
5126
|
var renderIcon = function () {
|
|
5132
|
-
|
|
5133
|
-
return (React__default.createElement(SvgIcon, { name: renderName(), width: size, height: size, color: color || colors.iconPrimaryDefault }));
|
|
5134
|
-
}
|
|
5135
|
-
return (React__default.createElement(IconComponent, __assign({ name: name, size: size, color: color || colors.iconPrimaryDefault }, rest)));
|
|
5127
|
+
return (React__default.createElement(SvgIcon, { name: renderName(), width: size, height: size, color: color || colors.iconPrimaryDefault }));
|
|
5136
5128
|
};
|
|
5137
5129
|
return (React__default.createElement(TouchableOpacity, { disabled: !onPress, onPress: onPress },
|
|
5138
5130
|
React__default.createElement(View$1, { style: [
|
|
@@ -5396,7 +5388,7 @@ var TextInputFlat = function (_a) {
|
|
|
5396
5388
|
] })),
|
|
5397
5389
|
renderSuffix())),
|
|
5398
5390
|
parentState.focused && !disabled && clearButton && inputValue ? (React$3.createElement(TouchableOpacity, { onPress: handleClear, style: styles$e.clearButton },
|
|
5399
|
-
React$3.createElement(Icon$1, { name: "IconClearText",
|
|
5391
|
+
React$3.createElement(Icon$1, { name: "IconClearText", size: 24 }))) : (React$3.createElement(Spacer, { width: SPACE_12 })),
|
|
5400
5392
|
checkLineRightAction() && (React$3.createElement(Spacer, { width: 1, height: 24, backgroundColor: theme.colors.borderPrimaryDefault, style: {
|
|
5401
5393
|
marginRight: SPACE_8,
|
|
5402
5394
|
} })),
|
|
@@ -5646,7 +5638,7 @@ var TextInputDefault = function (_a) {
|
|
|
5646
5638
|
] })),
|
|
5647
5639
|
!multiline && renderSuffix()))),
|
|
5648
5640
|
parentState.focused && !disabled && clearButton && inputValue ? (React$3.createElement(TouchableOpacity, { onPress: handleClear, style: multiline ? styles$d.clearButtonMultiline : styles$d.clearButton },
|
|
5649
|
-
React$3.createElement(Icon$1, { name: "IconClearText",
|
|
5641
|
+
React$3.createElement(Icon$1, { name: "IconClearText", size: 24 }))) : (React$3.createElement(Spacer, { width: CONSTANTS.SPACE_12 })),
|
|
5650
5642
|
checkLineRightAction() && (React$3.createElement(Spacer, { width: 1, height: 24, backgroundColor: colors.borderPrimaryDefault, style: {
|
|
5651
5643
|
marginRight: CONSTANTS.SPACE_8,
|
|
5652
5644
|
} })),
|
|
@@ -5918,7 +5910,7 @@ var TextInputNumber = function (_a) {
|
|
|
5918
5910
|
!checkValueEmpty() && suffix.toString() !== "" && (React__default.createElement(Text$1, { numberOfLines: 1, color: colors.textSecondary, style: [disabled && disabledTextStyle] }, " ",
|
|
5919
5911
|
suffix)))),
|
|
5920
5912
|
clearButton && !checkValueEmpty() && (React__default.createElement(TouchableOpacity, { activeOpacity: 0.8, onPress: handleClearInput },
|
|
5921
|
-
React__default.createElement(Icon$1, { name: "IconClearText",
|
|
5913
|
+
React__default.createElement(Icon$1, { name: "IconClearText", size: 24 }))),
|
|
5922
5914
|
right && numberValue && (React__default.createElement(Spacer, { width: 1, height: 24, backgroundColor: theme.colors.borderPrimaryDefault, style: {
|
|
5923
5915
|
marginLeft: SPACE_4,
|
|
5924
5916
|
} })),
|
|
@@ -5934,7 +5926,7 @@ var TextInputNumber = function (_a) {
|
|
|
5934
5926
|
React__default.createElement(View, { paddingHorizontal: SPACE_40 },
|
|
5935
5927
|
React__default.createElement(Text$1, { numberOfLines: 1, style: [styles$c.text30, styles$c.valueText] }, formatNumberInput$1(inputValue, formatDecimal) || "0")),
|
|
5936
5928
|
React__default.createElement(TouchableOpacity, { onPress: handleClear, style: styles$c.clearButton },
|
|
5937
|
-
React__default.createElement(Icon$1, { name: "IconClearText",
|
|
5929
|
+
React__default.createElement(Icon$1, { name: "IconClearText", size: 24, color: colors.textSecondary }))),
|
|
5938
5930
|
React__default.createElement(View, { style: styles$c.keyboardGrid }, [
|
|
5939
5931
|
["1", "2", "3"],
|
|
5940
5932
|
["4", "5", "6"],
|
|
@@ -5947,7 +5939,7 @@ var TextInputNumber = function (_a) {
|
|
|
5947
5939
|
inputValue.includes(".") &&
|
|
5948
5940
|
styles$c.disabledKey,
|
|
5949
5941
|
], onPress: function () { return handleKeyPress(key); }, disabled: (key === "000" && type === "float") ||
|
|
5950
|
-
(key === "." && inputValue.includes(".")) }, key === "del" ? (React__default.createElement(Icon$1, { name: "IconDelNumber",
|
|
5942
|
+
(key === "." && inputValue.includes(".")) }, key === "del" ? (React__default.createElement(Icon$1, { name: "IconDelNumber", size: 24 })) : (React__default.createElement(Text$1, { style: [
|
|
5951
5943
|
styles$c.keyText,
|
|
5952
5944
|
styles$c.text22,
|
|
5953
5945
|
key === "000" &&
|
|
@@ -6717,7 +6709,7 @@ var Toast = memoWithRef(function (_props, ref) {
|
|
|
6717
6709
|
] },
|
|
6718
6710
|
React__default.createElement(View, { row: true, style: { alignItems: "flex-start" } },
|
|
6719
6711
|
React__default.createElement(View, null,
|
|
6720
|
-
React__default.createElement(Icon$1, { name: getSourceIcon(),
|
|
6712
|
+
React__default.createElement(Icon$1, { name: getSourceIcon(), size: 20 })),
|
|
6721
6713
|
React__default.createElement(View, { full: true, paddingLeft: CONSTANTS.SPACE_8 },
|
|
6722
6714
|
React__default.createElement(Text$1, { bold: true, color: colors.textOnFillDefault }, options.title),
|
|
6723
6715
|
message.toString().length > 0 && (React__default.createElement(Text$1, { color: colors.textOnFillDefault, numberOfLines: 4, style: !options.title && styles$9.wrapMess }, message)))))));
|
|
@@ -7097,7 +7089,7 @@ var Checkbox = function (_a) {
|
|
|
7097
7089
|
}, [checked]);
|
|
7098
7090
|
return (React__default.createElement(View, { row: true, disabled: disabled, alignCenter: true, style: [style], onPress: handlePress },
|
|
7099
7091
|
leftIcon ? (React__default.createElement(View, { paddingRight: CONSTANTS.SPACE_8 }, leftIcon)) : (React__default.createElement(View, { paddingRight: CONSTANTS.SPACE_8 },
|
|
7100
|
-
React__default.createElement(Icon$1, { name: isActive ? "IconCheckboxActive" : "IconCheckbox",
|
|
7092
|
+
React__default.createElement(Icon$1, { name: isActive ? "IconCheckboxActive" : "IconCheckbox", size: iconSize, color: checkboxColor }))),
|
|
7101
7093
|
React__default.createElement(View, null,
|
|
7102
7094
|
React__default.createElement(Text$1, { color: colors.textDefault, style: [
|
|
7103
7095
|
styles$5.text14,
|
|
@@ -7134,7 +7126,7 @@ var RadioButton = function (_a) {
|
|
|
7134
7126
|
? "IconRadioDisable"
|
|
7135
7127
|
: checked
|
|
7136
7128
|
? "IconRadioActive"
|
|
7137
|
-
: "IconRadio",
|
|
7129
|
+
: "IconRadio", size: 24, color: getColorCheckbox }))),
|
|
7138
7130
|
React__default.createElement(View, null,
|
|
7139
7131
|
React__default.createElement(Text$1, { color: colors.textDefault, style: [
|
|
7140
7132
|
styles$4.text14,
|
|
@@ -7240,7 +7232,7 @@ var SelectionField = function (_a) {
|
|
|
7240
7232
|
React__default.createElement(Text$1, __assign({ numberOfLines: 1, color: getColor(), style: [disabled && disabledTextStyle, textStyle] }, textProps),
|
|
7241
7233
|
content.toString() === "" ? label : content,
|
|
7242
7234
|
required && content.toString() === "" && (React__default.createElement(Text$1, { color: colors.textErrorDefault }, " *")))),
|
|
7243
|
-
right || React__default.createElement(Icon$1, { name: "IconArrowDown",
|
|
7235
|
+
right || React__default.createElement(Icon$1, { name: "IconArrowDown", size: 24 }),
|
|
7244
7236
|
React__default.createElement(Spacer, { width: SPACE_12 }))),
|
|
7245
7237
|
error.length > 0 && (React__default.createElement(View, { paddingHorizontal: SPACE_12, paddingVertical: SPACE_4 },
|
|
7246
7238
|
React__default.createElement(Text$1, { style: styles$2.text12, color: colors.textErrorDefault }, error)))));
|
|
@@ -7266,7 +7258,7 @@ var SearchInput = function (_a) {
|
|
|
7266
7258
|
onChangeText === null || onChangeText === void 0 ? void 0 : onChangeText(text);
|
|
7267
7259
|
}, debounceTime);
|
|
7268
7260
|
return (React__default.createElement(TextInput, { left: React__default.createElement(View, null,
|
|
7269
|
-
React__default.createElement(Icon$1, { name: "IconSearch",
|
|
7261
|
+
React__default.createElement(Icon$1, { name: "IconSearch", size: 18 })), disabled: disabled, value: value, clearButton: clearButton, mode: "default", label: placeholder, placeholder: placeholder, placeholderTextColor: colors.textPlaceholder, right: rightIcon, onFocus: onFocus, autoFocus: autoFocus, onBlur: onBlur, allowFontScaling: false, onChangeText: debouncedOnChangeText, style: [
|
|
7270
7262
|
{
|
|
7271
7263
|
height: height || 36,
|
|
7272
7264
|
},
|
|
@@ -7310,7 +7302,7 @@ var Tag = function (_a) {
|
|
|
7310
7302
|
textStyle,
|
|
7311
7303
|
] }, title)),
|
|
7312
7304
|
rightIcon ? (React__default.createElement(View, { paddingLeft: CONSTANTS.SPACE_4 }, rightIcon)) : hideRightIcon ? (React__default.createElement(View, null)) : (React__default.createElement(View, { paddingLeft: CONSTANTS.SPACE_4 },
|
|
7313
|
-
React__default.createElement(Icon$1, { name: "IconClose",
|
|
7305
|
+
React__default.createElement(Icon$1, { name: "IconClose", size: 20, color: colors.iconBrandDefault }))))));
|
|
7314
7306
|
};
|
|
7315
7307
|
var styles$1 = StyleSheet.create(__assign({}, containerStyles));
|
|
7316
7308
|
|
|
@@ -7449,7 +7441,7 @@ var NumberKeyboard = function (_a) {
|
|
|
7449
7441
|
React__default.createElement(View, { paddingHorizontal: SPACE_40 },
|
|
7450
7442
|
React__default.createElement(Text$1, { numberOfLines: 1, style: [styles.text30, styles.valueText] }, formatNumberInput(inputValue, formatDecimal) || "0")),
|
|
7451
7443
|
React__default.createElement(TouchableOpacity, { onPress: handleClear, style: styles.clearButton },
|
|
7452
|
-
React__default.createElement(Icon$1, { name: "IconClearText",
|
|
7444
|
+
React__default.createElement(Icon$1, { name: "IconClearText", size: 24, color: colors.textSecondary }))),
|
|
7453
7445
|
React__default.createElement(View, { style: styles.keyboardGrid }, [
|
|
7454
7446
|
["1", "2", "3"],
|
|
7455
7447
|
["4", "5", "6"],
|
|
@@ -7462,7 +7454,7 @@ var NumberKeyboard = function (_a) {
|
|
|
7462
7454
|
inputValue.includes(".") &&
|
|
7463
7455
|
styles.disabledKey,
|
|
7464
7456
|
], onPress: function () { return handleKeyPress(key); }, disabled: (key === "000" && type === "float") ||
|
|
7465
|
-
(key === "." && inputValue.includes(".")) }, key === "del" ? (React__default.createElement(Icon$1, { name: "IconDelNumber",
|
|
7457
|
+
(key === "." && inputValue.includes(".")) }, key === "del" ? (React__default.createElement(Icon$1, { name: "IconDelNumber", size: 24 })) : (React__default.createElement(Text$1, { style: [
|
|
7466
7458
|
styles.keyText,
|
|
7467
7459
|
styles.text22,
|
|
7468
7460
|
key === "000" &&
|