sapo-components-ui-rn 1.0.42 → 1.0.44

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.
@@ -14,11 +14,11 @@ export type Props = React.ComponentPropsWithRef<typeof NativeTextInput> & {
14
14
  /**
15
15
  * The text or component to use for the floating label.
16
16
  */
17
- label?: TextInputLabelProp;
17
+ label: TextInputLabelProp;
18
18
  /**
19
19
  * Placeholder for the input.
20
20
  */
21
- placeholder?: string;
21
+ placeholder: string;
22
22
  /**
23
23
  * Whether to style the TextInput with error style.
24
24
  */
@@ -141,7 +141,6 @@ export type Props = React.ComponentPropsWithRef<typeof NativeTextInput> & {
141
141
  * Example: `borderRadius`, `borderColor`
142
142
  */
143
143
  underlineStyle?: StyleProp<ViewStyle>;
144
- minHeight?: number;
145
144
  clearButton?: boolean;
146
145
  textStyle?: StyleProp<TextStyle>;
147
146
  };
@@ -23,6 +23,10 @@ interface ViewProps {
23
23
  paddingLeft?: number;
24
24
  paddingRight?: number;
25
25
  paddingTop?: number;
26
+ marginTop?: number;
27
+ marginBottom?: number;
28
+ marginLeft?: number;
29
+ marginRight?: number;
26
30
  style?: StyleProp<ViewStyle>;
27
31
  children?: React.ReactNode;
28
32
  alignEnd?: boolean;
@@ -33,5 +37,5 @@ interface ViewProps {
33
37
  borderWidth?: number;
34
38
  borderColor?: string;
35
39
  }
36
- declare const _default: React.MemoExoticComponent<({ row, full, justifyCenter, justifyBetween, alignCenter, center, color, backgroundColor, width, height, padding, paddingHorizontal, paddingVertical, marginHorizontal, marginVertical, paddingLeft, paddingRight, paddingTop, alignEnd, wrap, borderBottomWidth, borderBottomColor, borderRadius, borderWidth, borderColor, style, onPress, activeOpacity, children, disabled, }: ViewProps) => React.JSX.Element>;
40
+ declare const _default: React.MemoExoticComponent<({ row, full, justifyCenter, justifyBetween, alignCenter, center, color, backgroundColor, width, height, padding, paddingHorizontal, paddingVertical, marginHorizontal, marginVertical, paddingLeft, paddingRight, paddingTop, alignEnd, wrap, borderBottomWidth, borderBottomColor, borderRadius, borderWidth, borderColor, style, onPress, activeOpacity, children, disabled, paddingBottom, marginTop, marginBottom, marginLeft, marginRight, }: ViewProps) => React.JSX.Element>;
37
41
  export default _default;
package/dist/index.esm.js CHANGED
@@ -1920,7 +1920,7 @@ var styles$h = StyleSheet.create({
1920
1920
  });
1921
1921
 
1922
1922
  var ViewCustom = function (_a) {
1923
- var row = _a.row, full = _a.full, justifyCenter = _a.justifyCenter, justifyBetween = _a.justifyBetween, alignCenter = _a.alignCenter, center = _a.center, color = _a.color, backgroundColor = _a.backgroundColor, width = _a.width, height = _a.height, padding = _a.padding, paddingHorizontal = _a.paddingHorizontal, paddingVertical = _a.paddingVertical, marginHorizontal = _a.marginHorizontal, marginVertical = _a.marginVertical, paddingLeft = _a.paddingLeft, paddingRight = _a.paddingRight, paddingTop = _a.paddingTop, alignEnd = _a.alignEnd, wrap = _a.wrap, borderBottomWidth = _a.borderBottomWidth, borderBottomColor = _a.borderBottomColor, borderRadius = _a.borderRadius, borderWidth = _a.borderWidth, borderColor = _a.borderColor, style = _a.style, onPress = _a.onPress, _b = _a.activeOpacity, activeOpacity = _b === void 0 ? 0.8 : _b, children = _a.children, disabled = _a.disabled;
1923
+ var row = _a.row, full = _a.full, justifyCenter = _a.justifyCenter, justifyBetween = _a.justifyBetween, alignCenter = _a.alignCenter, center = _a.center, color = _a.color, backgroundColor = _a.backgroundColor, width = _a.width, height = _a.height, padding = _a.padding, paddingHorizontal = _a.paddingHorizontal, paddingVertical = _a.paddingVertical, marginHorizontal = _a.marginHorizontal, marginVertical = _a.marginVertical, paddingLeft = _a.paddingLeft, paddingRight = _a.paddingRight, paddingTop = _a.paddingTop, alignEnd = _a.alignEnd, wrap = _a.wrap, borderBottomWidth = _a.borderBottomWidth, borderBottomColor = _a.borderBottomColor, borderRadius = _a.borderRadius, borderWidth = _a.borderWidth, borderColor = _a.borderColor, style = _a.style, onPress = _a.onPress, _b = _a.activeOpacity, activeOpacity = _b === void 0 ? 0.8 : _b, children = _a.children, disabled = _a.disabled, paddingBottom = _a.paddingBottom, marginTop = _a.marginTop, marginBottom = _a.marginBottom, marginLeft = _a.marginLeft, marginRight = _a.marginRight;
1924
1924
  var getStyle = function () {
1925
1925
  var styleCustom = {};
1926
1926
  if (row) {
@@ -1975,6 +1975,21 @@ var ViewCustom = function (_a) {
1975
1975
  if (paddingTop) {
1976
1976
  styleCustom.paddingTop = paddingTop;
1977
1977
  }
1978
+ if (paddingBottom) {
1979
+ styleCustom.paddingBottom = paddingBottom;
1980
+ }
1981
+ if (marginLeft) {
1982
+ styleCustom.marginLeft = marginLeft;
1983
+ }
1984
+ if (marginRight) {
1985
+ styleCustom.marginRight = marginRight;
1986
+ }
1987
+ if (marginTop) {
1988
+ styleCustom.marginTop = marginTop;
1989
+ }
1990
+ if (marginBottom) {
1991
+ styleCustom.marginBottom = marginBottom;
1992
+ }
1978
1993
  if (paddingRight) {
1979
1994
  styleCustom.paddingRight = paddingRight;
1980
1995
  }
@@ -5551,7 +5566,7 @@ var TextInputDefault = function (_a) {
5551
5566
  var _c = _a.disabled, disabled = _c === void 0 ? false : _c, _d = _a.editable, editable = _d === void 0 ? true : _d, label = _a.label, _e = _a.error, error = _e === void 0 ? false : _e, 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, _f = _a.render, render = _f === void 0 ? function (props) { return React$3.createElement(TextInput$1, __assign({}, props)); } : _f, _g = _a.multiline, multiline = _g === void 0 ? false : _g, 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, placeholderTextColor = _a.placeholderTextColor, _h = _a.clearButton, clearButton = _h === void 0 ? false : _h, contentStyle = _a.contentStyle, _j = _a.value, value = _j === void 0 ? "" : _j, 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", "placeholderTextColor", "clearButton", "contentStyle", "value"]);
5552
5567
  var colors = theme.colors;
5553
5568
  var font = theme.fonts.bodyLarge;
5554
- var _k = (StyleSheet.flatten(style) || {}), fontSizeStyle = _k.fontSize, fontWeight = _k.fontWeight, lineHeightStyle = _k.lineHeight, height = _k.height, _l = _k.backgroundColor; _l === void 0 ? colors === null || colors === void 0 ? void 0 : colors.backgroundPrimary : _l; var textAlign = _k.textAlign, viewStyle = __rest(_k, ["fontSize", "fontWeight", "lineHeight", "height", "backgroundColor", "textAlign"]);
5569
+ var _k = (StyleSheet.flatten(style) || {}), fontSizeStyle = _k.fontSize, fontWeight = _k.fontWeight, lineHeightStyle = _k.lineHeight, height = _k.height, _l = _k.backgroundColor; _l === void 0 ? colors === null || colors === void 0 ? void 0 : colors.backgroundPrimary : _l; var textAlign = _k.textAlign; _k.minHeight; var viewStyle = __rest(_k, ["fontSize", "fontWeight", "lineHeight", "height", "backgroundColor", "textAlign", "minHeight"]);
5555
5570
  var fontSize = fontSizeStyle || MAXIMIZED_LABEL_FONT_SIZE;
5556
5571
  var lineHeight = lineHeightStyle || (Platform.OS === "web" ? fontSize * 1.2 : undefined);
5557
5572
  var _m = getOutlinedInputColors({
@@ -5611,7 +5626,10 @@ var TextInputDefault = function (_a) {
5611
5626
  return React$3.createElement(View, null);
5612
5627
  };
5613
5628
  return (React$3.createElement(View, { style: viewStyle },
5614
- React$3.createElement(View, { row: true, alignCenter: true, justifyCenter: true, style: [
5629
+ React$3.createElement(View, { row: true,
5630
+ // full
5631
+ // alignCenter
5632
+ justifyCenter: true, style: [
5615
5633
  {
5616
5634
  borderRadius: CONSTANTS.BORDER_RADIUS_6,
5617
5635
  borderWidth: 1,
@@ -5623,11 +5641,14 @@ var TextInputDefault = function (_a) {
5623
5641
  },
5624
5642
  contentStyle,
5625
5643
  ] },
5626
- React$3.createElement(View, { paddingLeft: CONSTANTS.SPACE_12 }, left),
5644
+ React$3.createElement(View, { center: true, paddingLeft: CONSTANTS.SPACE_12 }, left),
5627
5645
  left && React$3.createElement(Spacer, { width: CONSTANTS.SPACE_8 }),
5628
- React$3.createElement(View, { full: true, style: {
5629
- height: height || 48,
5630
- } },
5646
+ React$3.createElement(View, { full: true, style: [
5647
+ {
5648
+ height: height || 48,
5649
+ minHeight: height || 48,
5650
+ },
5651
+ ] },
5631
5652
  multiline && renderLabel(), render === null || render === void 0 ? void 0 :
5632
5653
  render(__assign(__assign({}, rest), { ref: innerRef, onChangeText: handleChangeText, value: inputValue, placeholder: ((_b = parentState.value) === null || _b === void 0 ? void 0 : _b.toString()) == ""
5633
5654
  ? parentState.focused
@@ -5643,13 +5664,13 @@ var TextInputDefault = function (_a) {
5643
5664
  ? multiline
5644
5665
  ? CONSTANTS.SPACE_2
5645
5666
  : CONSTANTS.SPACE_8
5646
- : CONSTANTS.SPACE_4 }),
5667
+ : CONSTANTS.SPACE_4, paddingBottom: multiline ? CONSTANTS.SPACE_4 : 0 }),
5647
5668
  contentStyle,
5648
5669
  ] }))),
5649
5670
  !disabled && clearButton && inputValue ? (React$3.createElement(TouchableOpacity, { onPress: handleClear, style: multiline ? styles$b.clearButtonMultiline : styles$b.clearButton },
5650
5671
  React$3.createElement(Icon$1, { name: "IconClearText", type: "Svg", size: 24 }))) : (React$3.createElement(Spacer, { width: CONSTANTS.SPACE_12 })),
5651
5672
  right && React$3.createElement(Spacer, { width: CONSTANTS.SPACE_8 }),
5652
- right && React$3.createElement(View, { paddingRight: CONSTANTS.SPACE_12 }, right))));
5673
+ right && (React$3.createElement(View, { center: true, paddingRight: CONSTANTS.SPACE_12 }, right)))));
5653
5674
  };
5654
5675
  var styles$b = StyleSheet.create({
5655
5676
  input: {
@@ -6055,7 +6076,7 @@ var index$2 = memoDeepEqual(ButtonIcon);
6055
6076
  var FloatingButton = function (_a) {
6056
6077
  var isLoading = _a.isLoading, disabled = _a.disabled, onPress = _a.onPress, style = _a.style, _b = _a.hiddenBackground, hiddenBackground = _b === void 0 ? false : _b, _c = _a.size, size = _c === void 0 ? BUTTON_HEIGHT : _c, children = _a.children, backgroundColor = _a.backgroundColor, props = _a.props, _d = _a.top, top = _d === void 0 ? 0 : _d, _e = _a.right, right = _e === void 0 ? 0 : _e, _f = _a.left, left = _f === void 0 ? 0 : _f, _g = _a.bottom, bottom = _g === void 0 ? 0 : _g;
6057
6078
  var colors = useInternalTheme().colors;
6058
- return (React__default.createElement(ScaleButton$1, __assign({ activeOpacity: 0.8, onPress: onPress }, props, { disabled: disabled || isLoading, style: [
6079
+ return (React__default.createElement(TouchableOpacity, __assign({ activeOpacity: 0.8, onPress: onPress }, props, { disabled: disabled || isLoading, style: [
6059
6080
  styles$8.btn,
6060
6081
  top > 0 && { top: top },
6061
6082
  right > 0 && { right: right },
@@ -6642,7 +6663,7 @@ var Checkbox = function (_a) {
6642
6663
  var _f = useState(checked), isActive = _f[0], setActive = _f[1];
6643
6664
  var checkboxColor = useCheckboxColor(isActive, disabled);
6644
6665
  var handlePressChipBar = useCallback(function () {
6645
- setActive(!isActive);
6666
+ // setActive(!isActive);
6646
6667
  onPress === null || onPress === void 0 ? void 0 : onPress();
6647
6668
  }, [isActive, onPress]);
6648
6669
  useEffect(function () {