react-native-exp-fig 0.1.44 → 2.0.1

package/src/components/header-profile/index.tsx

@@ -1,132 +1,132 @@
-/**
- * IMPORTS
- */
-import React from "react";
-import { Dimensions, TouchableOpacity } from "react-native";
-
-// components
-import Box from "../box";
-import { Typography } from "../typography";
-
-// typings
-import { IHeaderProps } from "./interface";
-
-// commons
-import { Icons } from "../../common/icons-svg";
-
-// styles
-import { theme } from "../../styles/theme/theme";
-
-/**
- * Componente Header para a interação do usuário com ui.
- */
-const Header: React.FC<IHeaderProps> = ({
-  title,
-  color,
-  testID,
-  arrow,
-  // propsNav,
-  permission,
-  bluetoothIsConnected,
-  isInternetReachable,
-  handleNavigation,
-  backgroundColor,
-  isBluetooth = false,
-}) => {
-  const { width: widthScreen } = Dimensions.get("window");
-  const isMobile = widthScreen < 768;
-
-  return (
-    <Box
-      testID={testID}
-      width={"100%"}
-      height={45}
-      backgroundColor={backgroundColor ?? theme.colors.blue[400]}
-      flexStyle={{ flexDirection: "row", justifyContent: "space-between", alignItems: "center" }}
-    >
-      <Box
-        width={"10%"}
-        height={45}
-        flexStyle={{ flexDirection: "column", justifyContent: "center", alignItems: "flex-start" }}
-        paddingStyle={{ paddingLeft: theme.paddings.md }}
-      >
-        {arrow && title !== "Login" && (
-          <TouchableOpacity
-            disabled={!arrow}
-            onPress={handleNavigation}
-            style={{
-              width: 50,
-              height: 45,
-              flexDirection: "column",
-              alignItems: "flex-start",
-              justifyContent: "center",
-            }}
-          >
-            {title === "Controle de Jornada" || title === "Controle de Carregamento" ? (
-              <>
-                <Icons icon="LIST" color="#fff" />
-                <Box marginStyle={{ marginBottom: 8 }} />
-              </>
-            ) : (
-              arrow && <Icons icon="ARROW_LEFT" />
-            )}
-          </TouchableOpacity>
-        )}
-      </Box>
-
-      <Box
-        height={45}
-        flexStyle={{
-          flexDirection: "row",
-          justifyContent: "center",
-          alignItems: "center",
-          flex: 0.9,
-        }}
-      >
-        <Typography
-          text={title ? title : "Login"}
-          size={15.4}
-          fontFamily={theme.fonts.inter_bold_700}
-          color={color?.colorText ?? theme.colors.neutral[25]}
-          fontWeight="700"
-          align="center"
-          lineHeight={theme.fontSizes.lg}
-          letterSpacing={"regular"}
-          marginLeft={theme.margins["2xl"]}
-        />
-      </Box>
-
-      <Box
-        marginStyle={{ marginRight: isMobile ? 10 : 60 }}
-        borderStyled={{ borderRadius: 10 }}
-        width={50}
-        height={24}
-      >
-        {permission ? (
-          <Box marginStyle={{ marginTop: 2 }} />
-        ) : (
-          <Box
-            marginStyle={{ marginTop: 2 }}
-            flexStyle={{ flexDirection: "row", justifyContent: "flex-end" }}
-          >
-            {isBluetooth && (
-              <Icons
-                icon={bluetoothIsConnected ? "BLUETOOTH_CONNECTED" : "BLUETOOTH"}
-                color={bluetoothIsConnected ? theme.colors.green[400] : theme.colors.red[900]}
-              />
-            )}
-            <Icons
-              icon={isInternetReachable ? "WIFI_HIGH" : "WIFI_X"}
-              color={isInternetReachable ? theme.colors.green[400] : theme.colors.red[800]}
-            />
-          </Box>
-        )}
-      </Box>
-    </Box>
-  );
-};
-
-/**
- * EXPORTS
- */
-export { Header };
+/**
+ * IMPORTS
+ */
+import React from "react";
+import { Dimensions, TouchableOpacity } from "react-native";
+
+// components
+import { Box } from "../box";
+import { Typography } from "../typography";
+
+// typings
+import { IHeaderProps } from "./interface";
+
+// commons
+import { Icons } from "../../common/icons-svg";
+
+// styles
+import { theme } from "../../styles/theme/theme";
+
+/**
+ * Componente Header para a interação do usuário com ui.
+ */
+const Header: React.FC<IHeaderProps> = ({
+  title,
+  color,
+  testID,
+  arrow,
+  // propsNav,
+  permission,
+  bluetoothIsConnected,
+  isInternetReachable,
+  handleNavigation,
+  backgroundColor,
+  isBluetooth = false,
+}) => {
+  const { width: widthScreen } = Dimensions.get("window");
+  const isMobile = widthScreen < 768;
+
+  return (
+    <Box
+      testID={testID}
+      width={"100%"}
+      height={45}
+      backgroundColor={backgroundColor ?? theme.colors.blue[400]}
+      flexStyle={{ flexDirection: "row", justifyContent: "space-between", alignItems: "center" }}
+    >
+      <Box
+        width={"10%"}
+        height={45}
+        flexStyle={{ flexDirection: "column", justifyContent: "center", alignItems: "flex-start" }}
+        paddingStyle={{ paddingLeft: theme.paddings.md }}
+      >
+        {arrow && title !== "Login" && (
+          <TouchableOpacity
+            disabled={!arrow}
+            onPress={handleNavigation}
+            style={{
+              width: 50,
+              height: 45,
+              flexDirection: "column",
+              alignItems: "flex-start",
+              justifyContent: "center",
+            }}
+          >
+            {title === "Controle de Jornada" || title === "Controle de Carregamento" ? (
+              <>
+                <Icons icon="LIST" color="#fff" />
+                <Box marginStyle={{ marginBottom: 8 }} />
+              </>
+            ) : (
+              arrow && <Icons icon="ARROW_LEFT" />
+            )}
+          </TouchableOpacity>
+        )}
+      </Box>
+
+      <Box
+        height={45}
+        flexStyle={{
+          flexDirection: "row",
+          justifyContent: "center",
+          alignItems: "center",
+          flex: 0.9,
+        }}
+      >
+        <Typography
+          text={title ? title : "Login"}
+          size={15.4}
+          fontFamily={theme.fonts.inter_bold_700}
+          color={color?.colorText ?? theme.colors.neutral[25]}
+          fontWeight="700"
+          align="center"
+          lineHeight={theme.fontSizes.lg}
+          letterSpacing={"regular"}
+          marginLeft={theme.margins["2xl"]}
+        />
+      </Box>
+
+      <Box
+        marginStyle={{ marginRight: isMobile ? 10 : 60 }}
+        borderStyled={{ borderRadius: 10 }}
+        width={50}
+        height={24}
+      >
+        {permission ? (
+          <Box marginStyle={{ marginTop: 2 }} />
+        ) : (
+          <Box
+            marginStyle={{ marginTop: 2 }}
+            flexStyle={{ flexDirection: "row", justifyContent: "flex-end" }}
+          >
+            {isBluetooth && (
+              <Icons
+                icon={bluetoothIsConnected ? "BLUETOOTH_CONNECTED" : "BLUETOOTH"}
+                color={bluetoothIsConnected ? theme.colors.green[400] : theme.colors.red[900]}
+              />
+            )}
+            <Icons
+              icon={isInternetReachable ? "WIFI_HIGH" : "WIFI_X"}
+              color={isInternetReachable ? theme.colors.orange[150] : theme.colors.red[800]}
+            />
+          </Box>
+        )}
+      </Box>
+    </Box>
+  );
+};
+
+/**
+ * EXPORTS
+ */
+export { Header };

package/src/components/header-profile/interface.d.ts

@@ -1,57 +1,57 @@
-/**
- * IMPORTS
- */
-import { ViewProps } from "react-native";
-
-// typing
-import { IGlobalCss } from "../../styles/global/interface";
-
-interface IHeaderProps extends ViewProps, IGlobalCss {
-  title: string;
-
-  /**
-   * TestID para testes automático e identificação
-   */
-  testID?: string;
-
-  /**
-   * prop de navegação
-   */
-  propsNav?: any;
-
-  /**
-   * arrow para coloca o ícone da flecha ou lista
-   */
-  arrow: boolean;
-
-  /**
-   * permission boolean
-   */
-  permission: boolean;
-
-  /**
-   * isInternetReachable boolean que consta se está conectado a internet
-   */
-  isInternetReachable: boolean;
-
-  /**
-   * verifica se o bluetooth esta conectado
-   */
-  bluetoothIsConnected: boolean;
-
-  /**
-   * direciona para navegação correspondente
-   */
-  // eslint-disable-next-line no-unused-vars
-  handleNavigation: (propsNav: any) => void;
-
-  /**
-   * verifica se precisa do bluetooth na aplicação
-   */
-  isBluetooth: boolean;
-}
-
-/**
- * EXPORTS
- */
-export type { IHeaderProps };
+/**
+ * IMPORTS
+ */
+import { ViewProps } from "react-native";
+
+// typing
+import { IGlobalCss } from "../../styles/global/interface";
+
+interface IHeaderProps extends ViewProps, IGlobalCss {
+  title: string;
+
+  /**
+   * TestID para testes automático e identificação
+   */
+  testID?: string;
+
+  /**
+   * prop de navegação
+   */
+  propsNav?: any;
+
+  /**
+   * arrow para coloca o ícone da flecha ou lista
+   */
+  arrow: boolean;
+
+  /**
+   * permission boolean
+   */
+  permission: boolean;
+
+  /**
+   * isInternetReachable boolean que consta se está conectado a internet
+   */
+  isInternetReachable: boolean;
+
+  /**
+   * verifica se o bluetooth esta conectado
+   */
+  bluetoothIsConnected: boolean;
+
+  /**
+   * direciona para navegação correspondente
+   */
+  // eslint-disable-next-line no-unused-vars
+  handleNavigation: (propsNav: any) => void;
+
+  /**
+   * verifica se precisa do bluetooth na aplicação
+   */
+  isBluetooth: boolean;
+}
+
+/**
+ * EXPORTS
+ */
+export type { IHeaderProps };

package/src/components/history-details/index.tsx

@@ -1,99 +1,99 @@
-/**
- * IMPORTS
- */
-import React from "react";
-
-// components
-import Box from "../box";
-import { Typography } from "../typography";
-
-// typings
-import { IHistoryDetails } from "./interface";
-
-// styles
-import { theme } from "../../styles/theme/theme";
-
-const HistoryDetails: React.FC<IHistoryDetails> = ({
-  numero = "01020304050607",
-  local = "Doca 1, Pátio 02 - Usimais (Ipatinga)",
-  date = "24/03/2025",
-  duracao = "00:30",
-}) => {
-  return (
-    <Box width="100%" borderStyled={{ borderRadius: 8 }} backgroundColor={theme.colors.blue[400]}>
-      <Box
-        flexStyle={{
-          flexDirection: "column",
-          justifyContent: "flex-start",
-          alignItems: "flex-start",
-        }}
-        paddingStyle={{ padding: theme.paddings.xs }}
-      >
-        <Typography
-          text={`Carregamento - #${numero}`}
-          size={theme.fontSizes.sm}
-          fontFamily={theme.fonts.inter_semi_bold_600}
-          fontWeight="600"
-          color={theme.colors.neutral[25]}
-          lineHeight={theme.fontSizes.xl}
-          letterSpacing={"regular"}
-        />
-
-        <Typography
-          text={local}
-          color={theme.colors.neutral[25]}
-          size={theme.fontSizes.xs}
-          lineHeight={theme.fontSizes.lg}
-          fontFamily={theme.fonts.inter_regular_400}
-          letterSpacing={"regular"}
-          numberOfLines={1}
-        />
-        <Typography
-          text={`Data carregamento: ${date}`}
-          color={theme.colors.neutral[25]}
-          size={theme.fontSizes.xs}
-          fontFamily={theme.fonts.inter_regular_400}
-          lineHeight={theme.fontSizes.lg}
-          letterSpacing={"regular"}
-          numberOfLines={1}
-        />
-      </Box>
-
-      <Box height={1} backgroundColor={theme.colors.gray[950]} />
-
-      <Box
-        flexStyle={{
-          flexDirection: "row",
-          justifyContent: "space-between",
-          alignItems: "center",
-        }}
-        paddingStyle={{ padding: theme.paddings.xs }}
-      >
-        <Typography
-          text={"DURAÇÃO:"}
-          color={theme.colors.neutral[25]}
-          size={24}
-          fontFamily={theme.fonts.inter_regular_400}
-          fontWeight="400"
-          lineHeight={theme.fontSizes["3xl"]}
-          letterSpacing={"regular"}
-        />
-        <Typography
-          text={duracao}
-          color={theme.colors.neutral[25]}
-          size={26}
-          align="left"
-          fontFamily={theme.fonts.inter_medium_500}
-          fontWeight="500"
-          lineHeight={theme.fontSizes["3xl"]}
-          letterSpacing={"regular"}
-        />
-      </Box>
-    </Box>
-  );
-};
-
-/**
- * EXPORTS
- */
-export { HistoryDetails };
+/**
+ * IMPORTS
+ */
+import React from "react";
+
+// components
+import { Box } from "../box";
+import { Typography } from "../typography";
+
+// typings
+import { IHistoryDetails } from "./interface";
+
+// styles
+import { theme } from "../../styles/theme/theme";
+
+const HistoryDetails: React.FC<IHistoryDetails> = ({
+  numero = "01020304050607",
+  local = "Doca 1, Pátio 02 - Usimais (Ipatinga)",
+  date = "24/03/2025",
+  duracao = "00:30",
+}) => {
+  return (
+    <Box width="100%" borderStyled={{ borderRadius: 8 }} backgroundColor={theme.colors.blue[400]}>
+      <Box
+        flexStyle={{
+          flexDirection: "column",
+          justifyContent: "flex-start",
+          alignItems: "flex-start",
+        }}
+        paddingStyle={{ padding: theme.paddings.xs }}
+      >
+        <Typography
+          text={`Carregamento - #${numero}`}
+          size={theme.fontSizes.sm}
+          fontFamily={theme.fonts.inter_semi_bold_600}
+          fontWeight="600"
+          color={theme.colors.neutral[25]}
+          lineHeight={theme.fontSizes.xl}
+          letterSpacing={"regular"}
+        />
+
+        <Typography
+          text={local}
+          color={theme.colors.neutral[25]}
+          size={theme.fontSizes.xs}
+          lineHeight={theme.fontSizes.lg}
+          fontFamily={theme.fonts.inter_regular_400}
+          letterSpacing={"regular"}
+          numberOfLines={1}
+        />
+        <Typography
+          text={`Data carregamento: ${date}`}
+          color={theme.colors.neutral[25]}
+          size={theme.fontSizes.xs}
+          fontFamily={theme.fonts.inter_regular_400}
+          lineHeight={theme.fontSizes.lg}
+          letterSpacing={"regular"}
+          numberOfLines={1}
+        />
+      </Box>
+
+      <Box height={1} backgroundColor={theme.colors.gray[950]} />
+
+      <Box
+        flexStyle={{
+          flexDirection: "row",
+          justifyContent: "space-between",
+          alignItems: "center",
+        }}
+        paddingStyle={{ padding: theme.paddings.xs }}
+      >
+        <Typography
+          text={"DURAÇÃO:"}
+          color={theme.colors.neutral[25]}
+          size={24}
+          fontFamily={theme.fonts.inter_regular_400}
+          fontWeight="400"
+          lineHeight={theme.fontSizes["3xl"]}
+          letterSpacing={"regular"}
+        />
+        <Typography
+          text={duracao}
+          color={theme.colors.neutral[25]}
+          size={26}
+          align="left"
+          fontFamily={theme.fonts.inter_medium_500}
+          fontWeight="500"
+          lineHeight={theme.fontSizes["3xl"]}
+          letterSpacing={"regular"}
+        />
+      </Box>
+    </Box>
+  );
+};
+
+/**
+ * EXPORTS
+ */
+export { HistoryDetails };

package/src/components/history-details/interface.d.ts

@@ -1,18 +1,18 @@
-/**
- * IMPORTS
- */
-type IHistoryDetails = {
-  /**número do carregamento */
-  numero: string;
-  /**local onde vai ser o carregamento */
-  local: string;
-  /**data de quando o carregamento vai ser realizado */
-  date: string;
-  /**duração para o carregamento */
-  duracao: string;
-};
-
-/**
- * EXPORTS
- */
-export { IHistoryDetails };
+/**
+ * IMPORTS
+ */
+type IHistoryDetails = {
+  /**número do carregamento */
+  numero: string;
+  /**local onde vai ser o carregamento */
+  local: string;
+  /**data de quando o carregamento vai ser realizado */
+  date: string;
+  /**duração para o carregamento */
+  duracao: string;
+};
+
+/**
+ * EXPORTS
+ */
+export { IHistoryDetails };