sapo-components-ui-rn 1.0.28 → 1.0.30

package/dist/components/TextInput/TextInput.d.ts

@@ -134,6 +134,12 @@ export type Props = React.ComponentPropsWithRef<typeof NativeTextInput> & {
      * Overrides style when mode is set to `outlined`
      * Example: `borderRadius`, `borderColor`
      */
+    outlineStyle?: StyleProp<ViewStyle>;
+    /**
+     * Pass style to override the default style of underlined wrapper.
+     * Overrides style when mode is set to `flat`
+     * Example: `borderRadius`, `borderColor`
+     */
     underlineStyle?: StyleProp<ViewStyle>;
     minHeight?: number;
     clearButton?: boolean;

package/dist/index.esm.js

@@ -2993,7 +2993,7 @@ var TextInputFlat = function (_a) {
             label ? (React$3.createElement(InputLabel$1, __assign({ labeled: parentState.labeled, error: parentState.error, focused: parentState.focused, scaledLabel: scaledLabel, wiggle: Boolean(parentState.value && labelProps.labelError), labelLayoutMeasured: parentState.labelLayout.measured, labelLayoutWidth: parentState.labelLayout.width, labelLayoutHeight: parentState.labelLayout.height }, labelProps))) : null, render === null || render === void 0 ? void 0 :
             render(__assign(__assign({}, rest), { ref: innerRef, onChangeText: handleChangeText, value: inputValue, placeholder: rest.placeholder, editable: !disabled && editable, selectionColor: selectionColor, cursorColor: typeof cursorColor === "undefined" ? activeColor : cursorColor, placeholderTextColor: placeholderTextColorBasedOnState, onFocus: onFocus, onBlur: onBlur, underlineColorAndroid: "transparent", multiline: multiline, style: [
                     styles$c.input,
-                    __assign(__assign({ paddingLeft: paddingLeft, paddingRight: paddingRight, paddingTop: parentState.focused || parentState.value ? SPACE_12 : 0 }, font), { fontSize: fontSize, lineHeight: lineHeight, fontWeight: fontWeight, color: inputTextColor, textAlignVertical: multiline ? "top" : "center", textAlign: textAlign
+                    __assign(__assign({ paddingLeft: paddingLeft, paddingRight: paddingRight, paddingTop: SPACE_12 }, font), { fontSize: fontSize, lineHeight: lineHeight, fontWeight: fontWeight, color: inputTextColor, textAlignVertical: multiline ? "top" : "center", textAlign: textAlign
                             ? textAlign
                             : I18nManager.getConstants().isRTL
                                 ? "right"
@@ -5642,7 +5642,7 @@ var TextInputDefault = function (_a) {
                                 ? multiline
                                     ? CONSTANTS.SPACE_2
                                     : CONSTANTS.SPACE_8
-                                : 0 }),
+                                : CONSTANTS.SPACE_4 }),
                         contentStyle,
                     ] }))),
             !disabled && clearButton && inputValue ? (React$3.createElement(TouchableOpacity, { onPress: handleClear, style: multiline ? styles$b.clearButtonMultiline : styles$b.clearButton },
@@ -5702,7 +5702,7 @@ var DefaultRenderer = function (props) { return React__default.createElement(Tex
  * @extends TextInput props https://reactnative.dev/docs/textinput#props
  */
 var TextInput = forwardRef(function (_a, ref) {
-    var _b = _a.mode, mode = _b === void 0 ? "default" : _b, _c = _a.dense, dense = _c === void 0 ? false : _c, _d = _a.disabled, disabled = _d === void 0 ? false : _d, _e = _a.error, errorProp = _e === void 0 ? false : _e, _f = _a.multiline, multiline = _f === void 0 ? false : _f, _g = _a.editable, editable = _g === void 0 ? true : _g, contentStyle = _a.contentStyle, _h = _a.render, render = _h === void 0 ? DefaultRenderer : _h; _a.theme; var placeholderTextColor = _a.placeholderTextColor, clearButton = _a.clearButton, rest = __rest(_a, ["mode", "dense", "disabled", "error", "multiline", "editable", "contentStyle", "render", "theme", "placeholderTextColor", "clearButton"]);
+    var _b = _a.mode, mode = _b === void 0 ? "flat" : _b, _c = _a.dense, dense = _c === void 0 ? false : _c, _d = _a.disabled, disabled = _d === void 0 ? false : _d, _e = _a.error, errorProp = _e === void 0 ? false : _e, _f = _a.multiline, multiline = _f === void 0 ? false : _f, _g = _a.editable, editable = _g === void 0 ? true : _g, contentStyle = _a.contentStyle, _h = _a.render, render = _h === void 0 ? DefaultRenderer : _h; _a.theme; var placeholderTextColor = _a.placeholderTextColor, clearButton = _a.clearButton, rest = __rest(_a, ["mode", "dense", "disabled", "error", "multiline", "editable", "contentStyle", "render", "theme", "placeholderTextColor", "clearButton"]);
     var theme = useInternalTheme();
     var isControlled = rest.value !== undefined;
     var validInputValue = isControlled ? rest.value : rest.defaultValue;
@@ -5903,7 +5903,7 @@ var TextInput = forwardRef(function (_a, ref) {
                 root.current = ref;
             }, onFocus: handleFocus, forceFocus: forceFocus, onBlur: handleBlur, allowFontScaling: false, onChangeText: handleChangeText, onLayoutAnimatedText: handleLayoutAnimatedText, onInputLayout: handleInputContainerLayout, onLabelTextLayout: handleLabelTextLayout, onLeftAffixLayoutChange: onLeftAffixLayoutChange, onRightAffixLayoutChange: onRightAffixLayoutChange, maxFontSizeMultiplier: maxFontSizeMultiplier, contentStyle: contentStyle, scaledLabel: scaledLabel })));
     }
-    return (React__default.createElement(TextInputFlat, __assign({ dense: dense, disabled: disabled, error: errorProp, multiline: false, editable: editable, clearButton: clearButton, render: render }, rest, { theme: theme, value: value, parentState: {
+    return (React__default.createElement(TextInputFlat, __assign({ dense: dense, disabled: disabled, error: errorProp, editable: editable, clearButton: clearButton, render: render }, rest, { theme: theme, value: value, parentState: {
             labeled: labeled,
             error: error,
             focused: focused,
@@ -6817,15 +6817,14 @@ 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;
-    return (React__default.createElement(TextInput, { left: React__default.createElement(View, { paddingRight: SPACE_8 },
-            React__default.createElement(Icon$1, { name: "IconSearch", type: "Svg", size: 24 })), disabled: disabled, value: value, clearButton: clearButton, mode: "default", label: placeholder, placeholder: placeholder, right: rightIcon, onFocus: onFocus, onBlur: onBlur, allowFontScaling: false, onChangeText: onChangeText, style: [
+    return (React__default.createElement(TextInput, { left: React__default.createElement(View, null,
+            React__default.createElement(Icon$1, { name: "IconSearch", type: "Svg", size: 20 })), 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,
         ] }));
 };
-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;