sapo-components-ui-rn 1.1.49 → 1.1.50
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/components/TextInput/TextInput.d.ts +1 -0
- package/dist/components/TextInput/TextInputDefault.d.ts +1 -1
- package/dist/components/TextInput/TextInputFlat.d.ts +1 -1
- package/dist/components/TextInput/types.d.ts +1 -0
- package/dist/index.esm.js +5 -5
- package/dist/index.esm.js.map +1 -1
- package/dist/index.js +5 -5
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
- package/src/components/TextInput/TextInput.tsx +1 -0
- package/src/components/TextInput/TextInputDefault.tsx +7 -1
- package/src/components/TextInput/TextInputFlat.tsx +2 -0
- package/src/components/TextInput/types.tsx +1 -0
|
@@ -17,6 +17,7 @@ export type Props = React.ComponentPropsWithRef<typeof NativeTextInput> & {
|
|
|
17
17
|
required?: boolean;
|
|
18
18
|
labelScaleValue?: number;
|
|
19
19
|
labelStyle?: StyleProp<TextStyle>;
|
|
20
|
+
textErrorStyle?: StyleProp<TextStyle>;
|
|
20
21
|
/**
|
|
21
22
|
* If true, user won't be able to interact with the component.
|
|
22
23
|
*/
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
2
|
import type { ChildTextInputProps } from "./types";
|
|
3
|
-
declare const TextInputDefault: ({ disabled, editable, label, error, selectionColor: customSelectionColor, cursorColor, outlineColor: customOutlineColor, activeOutlineColor, outlineStyle, textColor, dense, style, theme, render, multiline, parentState, innerRef, onFocus, forceFocus, onBlur, onChangeText, onLayout, left, right, prefix, suffix, placeholderTextColor, clearButton, contentStyle, labelStyle, value, textError, required, ...rest }: ChildTextInputProps) => React.JSX.Element;
|
|
3
|
+
declare const TextInputDefault: ({ disabled, editable, label, error, selectionColor: customSelectionColor, cursorColor, outlineColor: customOutlineColor, activeOutlineColor, outlineStyle, textColor, dense, style, theme, render, multiline, parentState, innerRef, onFocus, forceFocus, onBlur, onChangeText, onLayout, left, right, prefix, suffix, placeholderTextColor, clearButton, contentStyle, labelStyle, value, textError, required, textErrorStyle, ...rest }: ChildTextInputProps) => React.JSX.Element;
|
|
4
4
|
export default TextInputDefault;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
2
|
import type { ChildTextInputProps } from "./types";
|
|
3
|
-
declare const TextInputFlat: ({ disabled, editable, label, error, selectionColor: customSelectionColor, cursorColor, underlineColor, underlineStyle, activeUnderlineColor, textColor, dense, style, theme, render, multiline, parentState, innerRef, onFocus, forceFocus, onBlur, onChangeText, onLayoutAnimatedText, onLabelTextLayout, onLeftAffixLayoutChange, onRightAffixLayoutChange, onInputLayout, left, right, prefix, suffix, placeholderTextColor, clearButton, contentStyle, scaledLabel, outlineStyle, outlineColor, value, textError, required, labelScaleValue, ...rest }: ChildTextInputProps) => React.JSX.Element;
|
|
3
|
+
declare const TextInputFlat: ({ disabled, editable, label, error, selectionColor: customSelectionColor, cursorColor, underlineColor, underlineStyle, activeUnderlineColor, textColor, dense, style, theme, render, multiline, parentState, innerRef, onFocus, forceFocus, onBlur, onChangeText, onLayoutAnimatedText, onLabelTextLayout, onLeftAffixLayoutChange, onRightAffixLayoutChange, onInputLayout, left, right, prefix, suffix, placeholderTextColor, clearButton, contentStyle, scaledLabel, outlineStyle, outlineColor, value, textError, required, labelScaleValue, textErrorStyle, ...rest }: ChildTextInputProps) => React.JSX.Element;
|
|
4
4
|
export default TextInputFlat;
|
|
@@ -100,6 +100,7 @@ export type ChildTextInputProps = {
|
|
|
100
100
|
required?: boolean;
|
|
101
101
|
labelStyle?: StyleProp<TextStyle>;
|
|
102
102
|
labelScaleValue?: number;
|
|
103
|
+
textErrorStyle?: StyleProp<TextStyle>;
|
|
103
104
|
} & $Omit<TextInputTypesWithoutMode, "theme"> & {
|
|
104
105
|
theme: InternalTheme;
|
|
105
106
|
};
|
package/dist/index.esm.js
CHANGED
|
@@ -5084,7 +5084,7 @@ var SvgIcon = function (_a) {
|
|
|
5084
5084
|
};
|
|
5085
5085
|
|
|
5086
5086
|
var TextInputFlat = function (_a) {
|
|
5087
|
-
var _b = _a.disabled, disabled = _b === void 0 ? false : _b, _c = _a.editable, editable = _c === void 0 ? true : _c, label = _a.label, _d = _a.error, error = _d === void 0 ? false : _d, customSelectionColor = _a.selectionColor, cursorColor = _a.cursorColor, underlineColor = _a.underlineColor; _a.underlineStyle; var activeUnderlineColor = _a.activeUnderlineColor, textColor = _a.textColor, dense = _a.dense, style = _a.style, theme = _a.theme, _e = _a.render, render = _e === void 0 ? function (props) { return React$3.createElement(TextInput$1, __assign({}, props)); } : _e, _f = _a.multiline, multiline = _f === void 0 ? false : _f, parentState = _a.parentState, innerRef = _a.innerRef, onFocus = _a.onFocus; _a.forceFocus; var onBlur = _a.onBlur, onChangeText = _a.onChangeText, onLayoutAnimatedText = _a.onLayoutAnimatedText, onLabelTextLayout = _a.onLabelTextLayout; _a.onLeftAffixLayoutChange; _a.onRightAffixLayoutChange; var onInputLayout = _a.onInputLayout, left = _a.left, right = _a.right, prefix = _a.prefix, suffix = _a.suffix, placeholderTextColor = _a.placeholderTextColor, clearButton = _a.clearButton, contentStyle = _a.contentStyle, scaledLabel = _a.scaledLabel, outlineStyle = _a.outlineStyle, outlineColor = _a.outlineColor, value = _a.value, textError = _a.textError, required = _a.required, _g = _a.labelScaleValue, labelScaleValue = _g === void 0 ? MINIMIZED_LABEL_FONT_SIZE : _g, rest = __rest(_a, ["disabled", "editable", "label", "error", "selectionColor", "cursorColor", "underlineColor", "underlineStyle", "activeUnderlineColor", "textColor", "dense", "style", "theme", "render", "multiline", "parentState", "innerRef", "onFocus", "forceFocus", "onBlur", "onChangeText", "onLayoutAnimatedText", "onLabelTextLayout", "onLeftAffixLayoutChange", "onRightAffixLayoutChange", "onInputLayout", "left", "right", "prefix", "suffix", "placeholderTextColor", "clearButton", "contentStyle", "scaledLabel", "outlineStyle", "outlineColor", "value", "textError", "required", "labelScaleValue"]);
|
|
5087
|
+
var _b = _a.disabled, disabled = _b === void 0 ? false : _b, _c = _a.editable, editable = _c === void 0 ? true : _c, label = _a.label, _d = _a.error, error = _d === void 0 ? false : _d, customSelectionColor = _a.selectionColor, cursorColor = _a.cursorColor, underlineColor = _a.underlineColor; _a.underlineStyle; var activeUnderlineColor = _a.activeUnderlineColor, textColor = _a.textColor, dense = _a.dense, style = _a.style, theme = _a.theme, _e = _a.render, render = _e === void 0 ? function (props) { return React$3.createElement(TextInput$1, __assign({}, props)); } : _e, _f = _a.multiline, multiline = _f === void 0 ? false : _f, parentState = _a.parentState, innerRef = _a.innerRef, onFocus = _a.onFocus; _a.forceFocus; var onBlur = _a.onBlur, onChangeText = _a.onChangeText, onLayoutAnimatedText = _a.onLayoutAnimatedText, onLabelTextLayout = _a.onLabelTextLayout; _a.onLeftAffixLayoutChange; _a.onRightAffixLayoutChange; var onInputLayout = _a.onInputLayout, left = _a.left, right = _a.right, prefix = _a.prefix, suffix = _a.suffix, placeholderTextColor = _a.placeholderTextColor, clearButton = _a.clearButton, contentStyle = _a.contentStyle, scaledLabel = _a.scaledLabel, outlineStyle = _a.outlineStyle, outlineColor = _a.outlineColor, value = _a.value, textError = _a.textError, required = _a.required, _g = _a.labelScaleValue, labelScaleValue = _g === void 0 ? MINIMIZED_LABEL_FONT_SIZE : _g, textErrorStyle = _a.textErrorStyle, rest = __rest(_a, ["disabled", "editable", "label", "error", "selectionColor", "cursorColor", "underlineColor", "underlineStyle", "activeUnderlineColor", "textColor", "dense", "style", "theme", "render", "multiline", "parentState", "innerRef", "onFocus", "forceFocus", "onBlur", "onChangeText", "onLayoutAnimatedText", "onLabelTextLayout", "onLeftAffixLayoutChange", "onRightAffixLayoutChange", "onInputLayout", "left", "right", "prefix", "suffix", "placeholderTextColor", "clearButton", "contentStyle", "scaledLabel", "outlineStyle", "outlineColor", "value", "textError", "required", "labelScaleValue", "textErrorStyle"]);
|
|
5088
5088
|
var _h = React$3.useState(value || ""), inputValue = _h[0], setInputValue = _h[1];
|
|
5089
5089
|
React$3.useEffect(function () {
|
|
5090
5090
|
if (value === undefined) {
|
|
@@ -5352,7 +5352,7 @@ var TextInputFlat = function (_a) {
|
|
|
5352
5352
|
paddingRight: SPACE_12,
|
|
5353
5353
|
} }, right)))),
|
|
5354
5354
|
error && (textError === null || textError === void 0 ? void 0 : textError.toString()) !== "" && (React$3.createElement(View$1, { style: styles$e.vError },
|
|
5355
|
-
React$3.createElement(Text$1, { size: 12, numberOfLines: 1, color: theme.colors.textErrorDefault }, textError)))));
|
|
5355
|
+
React$3.createElement(Text$1, { size: 12, numberOfLines: 1, color: theme.colors.textErrorDefault, style: [textErrorStyle] }, textError)))));
|
|
5356
5356
|
};
|
|
5357
5357
|
var styles$e = StyleSheet.create({
|
|
5358
5358
|
placeholder: {
|
|
@@ -5396,7 +5396,7 @@ var styles$e = StyleSheet.create({
|
|
|
5396
5396
|
|
|
5397
5397
|
var TextInputDefault = function (_a) {
|
|
5398
5398
|
var _b, _c;
|
|
5399
|
-
var _d = _a.disabled, disabled = _d === void 0 ? false : _d, _e = _a.editable, editable = _e === void 0 ? true : _e, label = _a.label, _f = _a.error, error = _f === void 0 ? false : _f, customSelectionColor = _a.selectionColor, cursorColor = _a.cursorColor, customOutlineColor = _a.outlineColor, activeOutlineColor = _a.activeOutlineColor; _a.outlineStyle; var textColor = _a.textColor; _a.dense; var style = _a.style, theme = _a.theme, _g = _a.render, render = _g === void 0 ? function (props) { return React$3.createElement(TextInput$1, __assign({}, props)); } : _g, _h = _a.multiline, multiline = _h === void 0 ? false : _h, parentState = _a.parentState, innerRef = _a.innerRef, onFocus = _a.onFocus; _a.forceFocus; var onBlur = _a.onBlur, onChangeText = _a.onChangeText; _a.onLayout; var left = _a.left, right = _a.right, prefix = _a.prefix, suffix = _a.suffix, placeholderTextColor = _a.placeholderTextColor, _j = _a.clearButton, clearButton = _j === void 0 ? false : _j, contentStyle = _a.contentStyle, labelStyle = _a.labelStyle, _k = _a.value, value = _k === void 0 ? "" : _k, textError = _a.textError, required = _a.required, rest = __rest(_a, ["disabled", "editable", "label", "error", "selectionColor", "cursorColor", "outlineColor", "activeOutlineColor", "outlineStyle", "textColor", "dense", "style", "theme", "render", "multiline", "parentState", "innerRef", "onFocus", "forceFocus", "onBlur", "onChangeText", "onLayout", "left", "right", "prefix", "suffix", "placeholderTextColor", "clearButton", "contentStyle", "labelStyle", "value", "textError", "required"]);
|
|
5399
|
+
var _d = _a.disabled, disabled = _d === void 0 ? false : _d, _e = _a.editable, editable = _e === void 0 ? true : _e, label = _a.label, _f = _a.error, error = _f === void 0 ? false : _f, customSelectionColor = _a.selectionColor, cursorColor = _a.cursorColor, customOutlineColor = _a.outlineColor, activeOutlineColor = _a.activeOutlineColor; _a.outlineStyle; var textColor = _a.textColor; _a.dense; var style = _a.style, theme = _a.theme, _g = _a.render, render = _g === void 0 ? function (props) { return React$3.createElement(TextInput$1, __assign({}, props)); } : _g, _h = _a.multiline, multiline = _h === void 0 ? false : _h, parentState = _a.parentState, innerRef = _a.innerRef, onFocus = _a.onFocus; _a.forceFocus; var onBlur = _a.onBlur, onChangeText = _a.onChangeText; _a.onLayout; var left = _a.left, right = _a.right, prefix = _a.prefix, suffix = _a.suffix, placeholderTextColor = _a.placeholderTextColor, _j = _a.clearButton, clearButton = _j === void 0 ? false : _j, contentStyle = _a.contentStyle, labelStyle = _a.labelStyle, _k = _a.value, value = _k === void 0 ? "" : _k, textError = _a.textError, required = _a.required, textErrorStyle = _a.textErrorStyle, rest = __rest(_a, ["disabled", "editable", "label", "error", "selectionColor", "cursorColor", "outlineColor", "activeOutlineColor", "outlineStyle", "textColor", "dense", "style", "theme", "render", "multiline", "parentState", "innerRef", "onFocus", "forceFocus", "onBlur", "onChangeText", "onLayout", "left", "right", "prefix", "suffix", "placeholderTextColor", "clearButton", "contentStyle", "labelStyle", "value", "textError", "required", "textErrorStyle"]);
|
|
5400
5400
|
var colors = theme.colors;
|
|
5401
5401
|
var font = theme.fonts.bodyLarge;
|
|
5402
5402
|
var _l = (StyleSheet.flatten(style) || {}), fontSizeStyle = _l.fontSize, fontWeight = _l.fontWeight, lineHeightStyle = _l.lineHeight, height = _l.height, _m = _l.backgroundColor; _m === void 0 ? colors === null || colors === void 0 ? void 0 : colors.backgroundPrimary : _m; var textAlign = _l.textAlign; _l.minHeight; var viewStyle = __rest(_l, ["fontSize", "fontWeight", "lineHeight", "height", "backgroundColor", "textAlign", "minHeight"]);
|
|
@@ -5466,7 +5466,7 @@ var TextInputDefault = function (_a) {
|
|
|
5466
5466
|
if (parentState.focused ||
|
|
5467
5467
|
(parentState.value !== undefined && ((_a = parentState.value) === null || _a === void 0 ? void 0 : _a.toString()) !== "")) {
|
|
5468
5468
|
return (React$3.createElement(View, { paddingTop: CONSTANTS.SPACE_6 },
|
|
5469
|
-
React$3.createElement(Text$1, { color: getLabelColor(), size: MINIMIZED_LABEL_FONT_SIZE },
|
|
5469
|
+
React$3.createElement(Text$1, { color: getLabelColor(), size: MINIMIZED_LABEL_FONT_SIZE, style: [labelStyle] },
|
|
5470
5470
|
label,
|
|
5471
5471
|
required && React$3.createElement(Text$1, { color: theme.colors.textErrorDefault }, " *"))));
|
|
5472
5472
|
}
|
|
@@ -5608,7 +5608,7 @@ var TextInputDefault = function (_a) {
|
|
|
5608
5608
|
paddingTop: multiline ? CONSTANTS.SPACE_12 : 0,
|
|
5609
5609
|
} }, right))),
|
|
5610
5610
|
error && (textError === null || textError === void 0 ? void 0 : textError.toString()) !== "" && (React$3.createElement(View, { style: styles$d.vError },
|
|
5611
|
-
React$3.createElement(Text$1, { size: 12, numberOfLines: 1, color: theme.colors.textErrorDefault }, textError)))));
|
|
5611
|
+
React$3.createElement(Text$1, { size: 12, numberOfLines: 1, color: theme.colors.textErrorDefault, style: [textErrorStyle] }, textError)))));
|
|
5612
5612
|
};
|
|
5613
5613
|
var styles$d = StyleSheet.create({
|
|
5614
5614
|
input: {
|