@janiscommerce/ui-native 1.15.3 → 1.16.2

package/dist/components/atoms/Collapsible/index.js

@@ -3,16 +3,16 @@ import React, { useState } from 'react';
 import { StyleSheet, View, Pressable } from 'react-native';
 import Animated, { useAnimatedStyle, useSharedValue, withTiming } from 'react-native-reanimated';
 const Collapsible = ({ header: Header, content: Content, data = [], onPressCallback = null, pressableComponent: PressableComponent = Pressable, duration = 500, wrapperStyle = {}, }) => {
-    const isOpen = useSharedValue(false);
+    const [isOpen, setIsOpen] = useState(false);
     const [measuredHeight, setMeasuredHeight] = useState(0);
     const contentHeight = useSharedValue(0);
     const hasHeightBeenMeasured = !!measuredHeight;
     const handleOpen = () => {
         // istanbul ignore next
-        if (!isOpen.value && measuredHeight > 0) {
+        if (!isOpen && measuredHeight > 0) {
             contentHeight.value = measuredHeight;
         }
-        isOpen.value = !isOpen.value;
+        setIsOpen(!isOpen);
         if (onPressCallback) {
             onPressCallback();
         }
@@ -27,14 +27,11 @@ const Collapsible = ({ header: Header, content: Content, data = [], onPressCallb
     };
     // istanbul ignore next
     const bodyStyle = useAnimatedStyle(() => ({
-        maxHeight: withTiming(isOpen.value ? contentHeight.value : 0, { duration }),
+        maxHeight: withTiming(isOpen ? contentHeight.value : 0, { duration }),
         overflow: 'hidden',
     }));
     const styles = StyleSheet.create({
-        wrapperView: {
-            flex: 1,
-            width: '100%',
-        },
+        wrapperView: { flex: 1, width: '100%' },
         animatedView: {
             overflow: 'hidden',
             width: '100%',
@@ -50,7 +47,7 @@ const Collapsible = ({ header: Header, content: Content, data = [], onPressCallb
     };
     return (<View style={[wrapperStyle, styles.wrapperView]}>
 			<PressableComponent onPress={handleOpen}>
-				<Header isOpen={isOpen.value}/>
+				<Header isOpen={isOpen}/>
 			</PressableComponent>
 			{!hasHeightBeenMeasured && (<View style={styles.contentWrapper} onLayout={handleContentLayout}>
 					<List data={data} renderComponent={renderContent} keyExtractor={(_, index) => String(index)} showsVerticalScrollIndicator={false}/>

package/dist/components/molecules/Input/index.d.ts

@@ -7,7 +7,6 @@ interface BaseInputPropsExtended extends BaseInputProps {
     variant?: InputVariant;
     onChangeText?: (text: string) => void;
     totalValue?: number;
-    placeholder?: string;
 }
 type AmountTotalProps = BaseInputPropsExtended & {
     variant: 'amountTotal';

package/dist/components/molecules/Input/index.js

@@ -1,11 +1,11 @@
 import React, { forwardRef, useState, useRef } from 'react';
-import { StyleSheet, View, TouchableWithoutFeedback, Keyboard, Platform, } from 'react-native';
+import { StyleSheet, View, TouchableWithoutFeedback, Keyboard } from 'react-native';
 import BaseInput from '../../atoms/BaseInput';
 import { palette } from '../../../theme/palette';
 import { moderateScale, scaledForDevice } from '../../../scale';
 import handleChangeText from './utils/handleChangeText';
 import Typography from '../../atoms/Typography';
-const isWeb = Platform.OS === 'web';
+import typography from '../../../theme/typography';
 var InputType;
 (function (InputType) {
     InputType["currency"] = "numeric";
@@ -18,9 +18,8 @@ var InputType;
     InputType["amountTotal"] = "numeric";
     InputType["numeric"] = "numeric";
 })(InputType || (InputType = {}));
-const Input = forwardRef(({ style, type, variant = 'default', totalValue, placeholder, onChangeText, ...props }, ref) => {
+const Input = forwardRef(({ style, type, variant = 'default', totalValue, onChangeText, ...props }, ref) => {
     const [value, setValue] = useState('');
-    const isPlaceholderBeingShown = !value;
     const isAmountTotalVariant = variant === 'amountTotal';
     const internalRef = useRef(null);
     const inputRef = ref ?? internalRef;
@@ -42,24 +41,24 @@ const Input = forwardRef(({ style, type, variant = 'default', totalValue, placeh
             width: '100%',
         },
         input: {
+            ...typography.display.medium,
             color: palette.black.main,
-            fontSize: scaledForDevice(42, moderateScale),
             height: '100%',
             textAlign: 'center',
             textAlignVertical: 'center',
             includeFontPadding: false,
             paddingVertical: 0,
-            ...(isPlaceholderBeingShown && { marginLeft: scaledForDevice(-12, moderateScale) }),
-            ...(isWeb && { flex: 1, maxWidth: isPlaceholderBeingShown ? '1%' : undefined }),
         },
         totalValue: {
             color: palette.primary.main,
         },
-        placeholder: {
-            color: '#A8AAAC',
-            marginLeft: scaledForDevice(-12, moderateScale),
-        },
     });
+    const getTextAlignment = () => {
+        if (value) {
+            return isAmountTotalVariant ? 'right' : 'center';
+        }
+        return 'left';
+    };
     const changeTextCb = (text) => {
         const transformedText = handleChangeText(text, variant);
         setValue(transformedText);
@@ -83,18 +82,9 @@ const Input = forwardRef(({ style, type, variant = 'default', totalValue, placeh
         }
         return InputType.default;
     })();
-    const renderPlaceholder = () => {
-        if (value.length > 0) {
-            return null;
-        }
-        return (<Typography type="display" style={styles.placeholder}>
-					{placeholder}
-				</Typography>);
-    };
     return (<TouchableWithoutFeedback onPress={handlePress}>
 				<View style={[styles.container, style]}>
-					<BaseInput testID="input" style={styles.input} ref={inputRef} value={value} keyboardType={resolvedKeyboardType} onChangeText={changeTextCb} {...props}/>
-					{renderPlaceholder()}
+					<BaseInput testID="input" style={styles.input} textAlign={getTextAlignment()} ref={inputRef} value={value} keyboardType={resolvedKeyboardType} onChangeText={changeTextCb} {...props}/>
 					{isAmountTotalVariant && (<Typography style={styles.totalValue} type="display">
 							{`/${totalValue?.toString()}`}
 						</Typography>)}

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@janiscommerce/ui-native",
-	"version": "1.15.3",
+	"version": "1.16.2",
 	"description": "components library for Janis app",
 	"main": "dist/index.js",
 	"typings": "dist/index.d.ts",
@@ -25,7 +25,8 @@
 		"update-stories": "sb-rn-get-stories --config-path .ondevice",
 		"storybook-web": "node scripts/set-app-mode.js web && npm run storybook-web-build && start-storybook -p 6006 --config-dir ./.storybook",
 		"storybook-web-build": "node scripts/set-app-mode.js web && build-storybook --config-dir ./.storybook --output-dir ./.storybook_static",
-		"storybook-web-docs": "build-storybook --config-dir ./.storybook --output-dir ./docs"
+		"storybook-web-docs": "build-storybook --config-dir ./.storybook --output-dir ./docs",
+		"preversion": "npm run test:coverage"
 	},
 	"repository": {
 		"type": "git",