@servesall/atoms 1.0.55 → 1.0.57

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@servesall/atoms",
-  "version": "1.0.55",
+  "version": "1.0.57",
   "description": "Atoms for react-native",
   "main": "dist/bundle.cjs.js",
   "module": "dist/bundle.esm.js",

package/src/Icons/Assets/index.js

@@ -72,6 +72,8 @@ import sportsResources from "./sportsResources.json";
 import toursResources from "./toursResources.json";
 import plus from "./plus.json";
 import minus from "./minus.json";
+import visible from "./visible.json";
+import nonVisible from "./non-visible.json";
 
 const allCategories = {
   restaurants,
@@ -147,6 +149,8 @@ const allCategories = {
   toursResources,
   plus,
   minus,
+  visible,
+  nonVisible,
 };
 
 export default allCategories;

package/src/Icons/Assets/non-visible.json

@@ -0,0 +1 @@
+{"ip":0,"fr":60,"v":"5.1.20","assets":[],"layers":[{"ty":4,"nm":"not-visible","ip":0,"st":0,"ind":1,"hix":1,"ks":{"o":{"a":0,"k":100},"or":{"a":0,"k":[0,0,0]},"a":{"a":0,"k":[11,11,0]},"p":{"s":true,"x":{"a":0,"k":49.99999870020041},"y":{"a":0,"k":49.99999870020041}},"rx":{"a":0,"k":0},"ry":{"a":0,"k":0},"rz":{"a":0,"k":0},"s":{"a":0,"k":[459.70000000000005,459.70000000000005]}},"shapes":[{"ty":"gr","nm":"not-visible shape group","it":[{"ty":"sh","ks":{"a":0,"k":{"c":false,"v":[[11.3699694,4.71196842],[10.0009689,4.61196876],[1.5779686,9.94596863],[3.33296847,12.4649687]],"i":[[0,0],[0.46499999999999986,0],[1.4989999500000002,-3.1510000199999997],[-0.7139999800000001,-0.7330000000000005]],"o":[[-0.44700000000000095,-0.06599999999999984],[-3.7209999200000006,0],[0.4449999900000001,0.935999970000001],[0,0]]}}},{"ty":"sh","ks":{"a":0,"k":{"c":false,"v":[[8.6669693,15.184968],[10.0009689,15.2799692],[18.4239693,9.94596863],[16.6679688,7.42596817]],"i":[[0,0],[-0.4529999799999995,0],[-1.4989999999999988,3.1510000700000003],[0.7149998999999987,0.7329999799999998]],"o":[[0.4350000000000005,0.062000000000001165],[3.721,0],[-0.4450000000000003,-0.9359999899999991],[0,0]]}}},{"ty":"sh","ks":{"a":0,"k":{"c":false,"v":[[7.38896847,9.40796852],[9.45996857,7.33396816]],"i":[[0,0],[-1.0399999599999994,0.21399999999999952]],"o":[[0.21300000000000008,-1.0399999600000012],[0,0]]}}},{"ty":"sh","ks":{"a":0,"k":{"c":false,"v":[[19.3329697,0.66796875],[0.66796875,19.3329697]],"i":[[0,0],[0,0]],"o":[[0,0],[0,0]]}}},{"ty":"st","o":{"a":0,"k":100},"c":{"a":0,"k":[0,0,0,1]},"lc":2,"lj":2,"ml":1,"w":{"a":0,"k":1.5},"d":[{"n":"d","v":{"a":0,"k":0},"nm":"0"},{"n":"g","v":{"a":0,"k":0},"nm":"1"}]},{"ty":"fl","o":{"a":0,"k":0},"c":{"a":0,"k":[0,0,0,0]},"r":1},{"ty":"tr","o":{"a":0,"k":100},"a":{"a":0,"k":[0,0]},"s":{"a":0,"k":[100,100]},"p":{"a":0,"k":[1,1]},"r":{"a":0,"k":0}}]}],"op":1}],"op":1,"w":100,"h":100}

package/src/Icons/Assets/visible.json

@@ -0,0 +1 @@
+{"ip":0,"fr":60,"v":"5.1.20","assets":[],"layers":[{"ty":4,"nm":"visible","ip":0,"st":0,"ind":1,"hix":1,"ks":{"o":{"a":0,"k":100},"or":{"a":0,"k":[0,0,0]},"a":{"a":0,"k":[9,6.5,0]},"p":{"s":true,"x":{"a":0,"k":49.999999524764874},"y":{"a":0,"k":50.00049965677462}},"rx":{"a":0,"k":0},"ry":{"a":0,"k":0},"rz":{"a":0,"k":0},"s":{"a":0,"k":[499.09999999999997,499.09999999999997]}},"shapes":[{"ty":"gr","nm":"visible shape group","it":[{"ty":"sh","ks":{"a":0,"k":{"c":false,"v":[[11.6667023,5.9460001],[8.99970245,8.61299992],[6.33270264,5.9460001],[8.99970245,3.27900028]],"i":[[0,0],[1.4730000500000013,0],[0,1.4730000499999996],[-1.4730000499999996,0]],"o":[[0,1.4730000499999996],[-1.4730000499999996,0],[0,-1.4730000500000004],[0,0]]}}},{"ty":"sh","ks":{"a":0,"k":{"c":true,"v":[[8.99970245,0.61328125],[17.2494068,5.94653273],[8.99970245,11.2797823],[0.75,5.94653273]],"i":[[-3.6723422999999995,0],[-1.4162720999999987,-3.1443119100000003],[3.672342350000001,0],[1.41627145,3.14431142]],"o":[[3.672342350000001,0],[-1.4162720999999987,3.14431142],[-3.6723422999999995,0],[1.41627145,-3.1443119100000003]]}}},{"ty":"st","o":{"a":0,"k":100},"c":{"a":0,"k":[0,0,0,1]},"lc":2,"lj":2,"ml":1,"w":{"a":0,"k":1.5},"d":[{"n":"d","v":{"a":0,"k":0},"nm":"0"},{"n":"g","v":{"a":0,"k":0},"nm":"1"}]},{"ty":"fl","o":{"a":0,"k":0},"c":{"a":0,"k":[0,0,0,0]},"r":1},{"ty":"tr","o":{"a":0,"k":100},"a":{"a":0,"k":[0,0]},"s":{"a":0,"k":[100,100]},"p":{"a":0,"k":[0,1]},"r":{"a":0,"k":0}}]}],"op":1}],"op":1,"w":100,"h":100}

package/src/Inputs/Animated/Animated.style.js

@@ -1,4 +1,4 @@
-import styled from 'styled-components/native';
+import styled from "styled-components/native";
 
 export const InputWrapper = styled.Pressable`
   min-height: 80px;
@@ -7,8 +7,9 @@ export const InputWrapper = styled.Pressable`
 export const InputElement = styled.TextInput`
   margin-top: 26px;
   min-height: 50px;
-  font-family: ${props => props.theme.fontFamily2};
-  font-size: ${props => props.theme.small};
+  font-family: ${(props) => props.theme.fontFamily2};
+  font-size: ${(props) => props.theme.small};
+  color: ${(props) => props.theme.color2};
 `;
 export const BorderWrapper = styled.View`
   height: 4px;

package/src/Inputs/Animated/index.js

@@ -1,80 +1,84 @@
-import React, {useEffect, useState, useRef} from 'react';
-import {H3} from '../../Text';
-import {KeyboardAvoidingView, Platform} from 'react-native';
-import {InputWrapper, InputElement, BorderWrapper} from './Animated.style';
-import LineAnimation from './LineAnimation';
-import Placeholder from './Placeholder';
+import React, { useEffect, useState, useRef } from "react";
+import { H3 } from "../../Text";
+import { KeyboardAvoidingView, Platform } from "react-native";
+import { InputWrapper, InputElement, BorderWrapper } from "./Animated.style";
+import LineAnimation from "./LineAnimation";
+import Placeholder from "./Placeholder";
 
 const Input = ({
-                   children,
-                   style,
-                   borderColorIdle,
-                   borderColorActive,
-                    borderColorError,
-                   textChange = () => {},
-                   value,
-                   multiline = false,
-                   numberOfLines = 1,
-                   maxLength = 1000,
-                   autoFocus = false,
-                   keyboardType,
-                   editable = true,
-                   keyboardVerticalOffset = 0,
-                   hasError = false,
-                   error,
-               }) => {
-    const [isFocused, setIsFocused] = useState(false);
-    const [textValue, setTextValue] = useState(value);
-    const inputRef = useRef();
+  children,
+  style,
+  borderColorIdle,
+  borderColorActive,
+  borderColorError,
+  textChange = () => {},
+  value,
+  multiline = false,
+  numberOfLines = 1,
+  maxLength = 1000,
+  autoFocus = false,
+  keyboardType,
+  editable = true,
+  keyboardVerticalOffset = 0,
+  hasError = false,
+  error,
+}) => {
+  const [isFocused, setIsFocused] = useState(false);
+  const [textValue, setTextValue] = useState(value);
+  const inputRef = useRef();
 
-    useEffect(() => {
-        textChange(textValue);
-    }, [textValue]);
+  useEffect(() => {
+    textChange(textValue);
+  }, [textValue]);
 
-    useEffect(() => {
-        autoFocus && inputRef.current?.focus();
-    }, [autoFocus]);
+  useEffect(() => {
+    autoFocus && inputRef.current?.focus();
+  }, [autoFocus]);
 
-    return (
-        <KeyboardAvoidingView
-            behavior={Platform.OS === 'ios' ? 'padding' : 'height'}
-            keyboardVerticalOffset={keyboardVerticalOffset}>
-            <InputWrapper
-                onPress={() => {
-                    setIsFocused(true);
-                    inputRef.current?.focus();
-                }}>
-                <Placeholder active={isFocused || (textValue && textValue.length > 0)}>
-                    {!hasError ? children : (
-                        <H3 color={borderColorError}>{error || hasError}</H3>
-                    )}
-                </Placeholder>
-                <InputElement
-                    ref={inputRef}
-                    onFocus={() => setIsFocused(true)}
-                    onBlur={() => setIsFocused(false)}
-                    onChangeText={(text) => setTextValue(text)}
-                    value={value}
-                    multiline={multiline}
-                    numberOfLines={numberOfLines}
-                    maxLength={maxLength}
-                    autoFocus={autoFocus}
-                    keyboardType={keyboardType}
-                    editable={editable}
-                    style={style}
-                />
-                <BorderWrapper>
-                    <LineAnimation
-                        active={isFocused}
-                        borderColorActive={borderColorActive}
-                        borderColorIdle={borderColorIdle}
-                        borderColorError={borderColorError}
-                        hasError={hasError}
-                    />
-                </BorderWrapper>
-            </InputWrapper>
-        </KeyboardAvoidingView>
-    );
+  return (
+    <KeyboardAvoidingView
+      behavior={Platform.OS === "ios" ? "padding" : "height"}
+      keyboardVerticalOffset={keyboardVerticalOffset}
+    >
+      <InputWrapper
+        onPress={() => {
+          setIsFocused(true);
+          inputRef.current?.focus();
+        }}
+      >
+        <Placeholder active={isFocused || (textValue && textValue.length > 0)}>
+          {!hasError ? (
+            children
+          ) : (
+            <H3 color={borderColorError}>{error || hasError}</H3>
+          )}
+        </Placeholder>
+        <InputElement
+          ref={inputRef}
+          onFocus={() => setIsFocused(true)}
+          onBlur={() => setIsFocused(false)}
+          onChangeText={(text) => setTextValue(text)}
+          value={value}
+          multiline={multiline}
+          numberOfLines={numberOfLines}
+          maxLength={maxLength}
+          autoFocus={autoFocus}
+          keyboardType={keyboardType}
+          editable={editable}
+          style={style}
+        />
+        <BorderWrapper>
+          <LineAnimation
+            active={isFocused}
+            borderColorActive={borderColorActive}
+            borderColorIdle={borderColorIdle}
+            borderColorError={borderColorError}
+            hasError={hasError}
+          />
+        </BorderWrapper>
+      </InputWrapper>
+    </KeyboardAvoidingView>
+  );
 };
 
 export default Input;

package/src/Switch/index.js

@@ -46,6 +46,7 @@ export default function Switch({
   value = false,
   onValueChange = () => {},
   micro = false,
+  style,
 }) {
   const [isEnabled, setIsEnabled] = useState(value);
   const toggleSwitch = () => {
@@ -66,6 +67,7 @@ export default function Switch({
         borderWidth: 1,
         borderColor: isEnabled ? colors.color15 : colors.color10,
         opacity: enabled ? 1 : 0.6,
+        ...style,
       }}
       color={colors.color1}
       onClick={toggleSwitch}

package/src/Theme/definitions/colors.js

@@ -26,5 +26,6 @@ const colors = {
   color15: "#00cec9",
   color16: "#636e72",
   color17: "#6c5ce7",
+  color18: "#81ecec",
 };
 export default colors;