sapo-components-ui-rn 1.0.33 → 1.0.35

package/dist/components/Tag/index.d.ts

@@ -13,6 +13,7 @@ interface TagProps {
     ellipsizeMode?: "head" | "middle" | "tail" | "clip";
     numberOfLines?: number;
     hideRightIcon?: boolean;
+    height?: number;
 }
-declare const Tag: ({ style, borderRadius, title, textStyle, onPress, disabled, leftIcon, rightIcon, isActive, ellipsizeMode, numberOfLines, hideRightIcon, }: TagProps) => React.JSX.Element;
+declare const Tag: ({ style, borderRadius, title, textStyle, onPress, disabled, leftIcon, rightIcon, isActive, ellipsizeMode, numberOfLines, hideRightIcon, height, }: TagProps) => React.JSX.Element;
 export default Tag;

package/dist/index.esm.js

@@ -5621,6 +5621,7 @@ var TextInputDefault = function (_a) {
                         ? theme.colors.surfacePrimaryDisabled
                         : theme.colors.surfacePrimaryDefault,
                 },
+                contentStyle,
             ] },
             React$3.createElement(View, { paddingLeft: CONSTANTS.SPACE_12 }, left),
             left && React$3.createElement(Spacer, { width: CONSTANTS.SPACE_8 }),
@@ -6802,21 +6803,28 @@ var index = React__default.memo(SelectionField);
 
 var SearchInput = function (_a) {
     var _b = _a.value, value = _b === void 0 ? "" : _b, _c = _a.disabled, disabled = _c === void 0 ? false : _c, rightIcon = _a.rightIcon, _d = _a.clearButton, clearButton = _d === void 0 ? false : _d, _e = _a.placeholder, placeholder = _e === void 0 ? "Tìm kiếm" : _e, onFocus = _a.onFocus, onBlur = _a.onBlur, onChangeText = _a.onChangeText, style = _a.style, height = _a.height;
+    var theme = useInternalTheme();
+    var colors = theme.colors;
     return (React__default.createElement(TextInput, { left: React__default.createElement(View, { center: true },
             React__default.createElement(Icon$1, { name: "IconSearch", type: "Svg", size: 18 })), disabled: disabled, value: value, clearButton: clearButton, mode: "default", label: placeholder, placeholder: placeholder, right: rightIcon, onFocus: onFocus, onBlur: onBlur, allowFontScaling: false, onChangeText: onChangeText, style: [
             {
                 height: height || 40,
             },
             style,
+        ], contentStyle: [
+            {
+                backgroundColor: colors.surfaceSecondaryDefault,
+            },
+            style,
         ] }));
 };
 StyleSheet.create(__assign({}, containerStyles));
 
 var Tag = function (_a) {
-    var style = _a.style, _b = _a.borderRadius, borderRadius = _b === void 0 ? CONSTANTS.BORDER_RADIUS_ROUNDED : _b, _c = _a.title, title = _c === void 0 ? "content" : _c, textStyle = _a.textStyle, onPress = _a.onPress, _d = _a.disabled, disabled = _d === void 0 ? false : _d, leftIcon = _a.leftIcon, rightIcon = _a.rightIcon, _e = _a.isActive, isActive = _e === void 0 ? false : _e, _f = _a.ellipsizeMode, ellipsizeMode = _f === void 0 ? "tail" : _f, _g = _a.numberOfLines, numberOfLines = _g === void 0 ? 1 : _g, _h = _a.hideRightIcon, hideRightIcon = _h === void 0 ? false : _h;
+    var style = _a.style, _b = _a.borderRadius, borderRadius = _b === void 0 ? CONSTANTS.BORDER_RADIUS_ROUNDED : _b, _c = _a.title, title = _c === void 0 ? "content" : _c, textStyle = _a.textStyle, onPress = _a.onPress, _d = _a.disabled, disabled = _d === void 0 ? false : _d, leftIcon = _a.leftIcon, rightIcon = _a.rightIcon, _e = _a.isActive, isActive = _e === void 0 ? false : _e, _f = _a.ellipsizeMode, ellipsizeMode = _f === void 0 ? "tail" : _f, _g = _a.numberOfLines, numberOfLines = _g === void 0 ? 1 : _g, _h = _a.hideRightIcon, hideRightIcon = _h === void 0 ? false : _h, _j = _a.height, height = _j === void 0 ? 32 : _j;
     var theme = useInternalTheme();
     var colors = theme.colors;
-    var _j = useState(isActive), active = _j[0], setActive = _j[1];
+    var _k = useState(isActive), active = _k[0], setActive = _k[1];
     var handlePressTag = useCallback(function () {
         setActive(!active);
         onPress === null || onPress === void 0 ? void 0 : onPress();
@@ -6825,7 +6833,7 @@ var Tag = function (_a) {
         setActive(isActive);
     }, [isActive]);
     return (React__default.createElement(View, { row: true },
-        React__default.createElement(View, { row: true, disabled: disabled, paddingHorizontal: CONSTANTS.SPACE_12, paddingVertical: CONSTANTS.SPACE_8, borderRadius: borderRadius, alignCenter: true, style: [
+        React__default.createElement(View, { row: true, height: height, disabled: disabled, paddingHorizontal: CONSTANTS.SPACE_12, paddingVertical: CONSTANTS.SPACE_8, borderRadius: borderRadius, alignCenter: true, style: [
                 disabled && {
                     backgroundColor: colors.surfaceSecondaryDefault,
                     borderColor: colors.surfaceSecondaryDefault,
@@ -6836,8 +6844,7 @@ var Tag = function (_a) {
                 : colors.surfaceBrandInverseDefault },
             leftIcon && React__default.createElement(View, { paddingRight: CONSTANTS.SPACE_4 }, leftIcon),
             React__default.createElement(View, null,
-                React__default.createElement(Text$1, { numberOfLines: numberOfLines, ellipsizeMode: ellipsizeMode, style: [
-                        styles.text14,
+                React__default.createElement(Text$1, { size: 14, numberOfLines: numberOfLines, ellipsizeMode: ellipsizeMode, style: [
                         styles.textMedium,
                         disabled && {
                             color: colors.textSecondary,
@@ -6845,14 +6852,9 @@ var Tag = function (_a) {
                         textStyle,
                     ] }, title)),
             rightIcon ? (React__default.createElement(View, { paddingLeft: CONSTANTS.SPACE_4 }, rightIcon)) : hideRightIcon ? (React__default.createElement(View, null)) : (React__default.createElement(View, { paddingLeft: CONSTANTS.SPACE_4 },
-                React__default.createElement(Icon$1, { name: "IconClose", type: "Svg", size: 24, color: colors.iconBrandDefault }))))));
+                React__default.createElement(SvgIcon, { name: "IconClose" }))))));
 };
-var styles = StyleSheet.create(__assign(__assign({}, containerStyles), { badgeContainer: {
-        position: "absolute",
-        right: 0,
-        top: -4,
-        zIndex: 999,
-    } }));
+var styles = StyleSheet.create(__assign({}, containerStyles));
 
 var toastRef = React__default.createRef();
 var showToast = function (_a) {