react-native-exp-fig 0.1.16 → 0.1.18

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/image-capture-with-remove/index.tsx

@@ -1,92 +1,92 @@
-/**
- * IMPORTS
- */
-import React from "react";
-import { Image, TouchableOpacity } from "react-native";
-
-// components
-import { Box } from "../box";
-
-// comons / icons
-import { Icons } from "../../common/icons-svg";
-
-// typings
-import { IImageCaptureWithRemoveProps } from "./interface";
-
-// styles
-import { theme } from "../../styles/theme/theme";
-
-// utils
-import { getBorderColor } from "../../utils/status-color/return-color";
-
-/**
- *
- * Componente ImageCaptureWithRemove para a interação do usuário com ui.
- */
-const ImageCaptureWithRemove: React.FC<IImageCaptureWithRemoveProps> = ({
-  width = 50,
-  height = 50,
-  foto = null,
-  useRemove = true,
-  status,
-  handleTakePhoto,
-  onRemove,
-}: IImageCaptureWithRemoveProps) => {
-  const statusColor = status === "Cancelado" || status === "Pendente";
-
-  return (
-    <TouchableOpacity
-      testID="image-capture-touchable"
-      activeOpacity={0.7}
-      style={{ position: "relative" }}
-      onPress={handleTakePhoto}
-      disabled={!!foto}
-    >
-      <Box
-        width={width}
-        height={height}
-        flexStyle={{ flexDirection: "row", alignItems: "center", justifyContent: "center" }}
-        testID="plus-icon-box"
-        borderStyled={{
-          borderWidth: statusColor ? theme.borderWidths.thick : theme.borderWidths.thin,
-          borderRadius: theme.fontSizes.md,
-          borderColor: statusColor ? getBorderColor(status) : theme.colors.blue[400],
-        }}
-      >
-        {foto ? (
-          <>
-            <Image
-              testID="captured-image"
-              style={{
-                width: "100%",
-                height: "100%",
-                borderRadius: theme.fontSizes.md,
-                resizeMode: "cover",
-              }}
-              source={{
-                uri: foto,
-              }}
-            />
-
-            {useRemove && (
-              <TouchableOpacity
-                testID="remove-button"
-                style={{ position: "absolute", top: 2, right: 4 }}
-                onPress={onRemove}
-              >
-                <Icons icon="X_CIRCLE" color={theme.colors.red[400]} size={18} />
-              </TouchableOpacity>
-            )}
-          </>
-        ) : (
-          <Icons icon="PLUS" color={theme.colors.blue[400]} />
-        )}
-      </Box>
-    </TouchableOpacity>
-  );
-};
-
-/**
- * EXPORTS
- */
-export { ImageCaptureWithRemove };
+/**
+ * IMPORTS
+ */
+import React from "react";
+import { Image, TouchableOpacity } from "react-native";
+
+// components
+import { Box } from "../box";
+
+// comons / icons
+import { Icons } from "../../common/icons-svg";
+
+// typings
+import { IImageCaptureWithRemoveProps } from "./interface";
+
+// styles
+import { theme } from "../../styles/theme/theme";
+
+// utils
+import { getBorderColor } from "../../utils/status-color/return-color";
+
+/**
+ *
+ * Componente ImageCaptureWithRemove para a interação do usuário com ui.
+ */
+const ImageCaptureWithRemove: React.FC<IImageCaptureWithRemoveProps> = ({
+  width = 50,
+  height = 50,
+  foto = null,
+  useRemove = true,
+  status,
+  handleTakePhoto,
+  onRemove,
+}: IImageCaptureWithRemoveProps) => {
+  const statusColor = status === "Cancelado" || status === "Pendente";
+
+  return (
+    <TouchableOpacity
+      testID="image-capture-touchable"
+      activeOpacity={0.7}
+      style={{ position: "relative" }}
+      onPress={handleTakePhoto}
+      disabled={!!foto}
+    >
+      <Box
+        width={width}
+        height={height}
+        flexStyle={{ flexDirection: "row", alignItems: "center", justifyContent: "center" }}
+        testID="plus-icon-box"
+        borderStyled={{
+          borderWidth: statusColor ? theme.borderWidths.thick : theme.borderWidths.thin,
+          borderRadius: theme.fontSizes.md,
+          borderColor: statusColor ? getBorderColor(status) : theme.colors.blue[400],
+        }}
+      >
+        {foto ? (
+          <>
+            <Image
+              testID="captured-image"
+              style={{
+                width: "100%",
+                height: "100%",
+                borderRadius: theme.fontSizes.md,
+                resizeMode: "cover",
+              }}
+              source={{
+                uri: foto,
+              }}
+            />
+
+            {useRemove && (
+              <TouchableOpacity
+                testID="remove-button"
+                style={{ position: "absolute", top: 2, right: 4 }}
+                onPress={onRemove}
+              >
+                <Icons icon="X_CIRCLE" color={theme.colors.red[400]} size={18} />
+              </TouchableOpacity>
+            )}
+          </>
+        ) : (
+          <Icons icon="PLUS" color={theme.colors.blue[400]} />
+        )}
+      </Box>
+    </TouchableOpacity>
+  );
+};
+
+/**
+ * EXPORTS
+ */
+export { ImageCaptureWithRemove };

package/src/components/image-capture-with-remove/interface.d.ts

@@ -1,28 +1,28 @@
-/**
- * IMPORTS
- */
-type IImageCaptureWithRemoveProps = {
-  /**define o tamanho */
-  width?: number;
-  /**define o altura */
-  height?: number;
-  /**Imagem capturada */
-  foto?: string | null;
-
-  /**Define o status das fotos */
-  status?: "Pendente" | "Concluido" | "Cancelado" | "Andamento";
-
-  /**propiedade que define se e para utilizar o metódo de remover */
-  useRemove?: boolean;
-
-  /**Remove a imagem capturada */
-  onRemove: () => void;
-
-  /**Captura a imagem */
-  handleTakePhoto: () => void;
-};
-
-/**
- * EXPORTS
- */
-export { IImageCaptureWithRemoveProps };
+/**
+ * IMPORTS
+ */
+type IImageCaptureWithRemoveProps = {
+  /**define o tamanho */
+  width?: number;
+  /**define o altura */
+  height?: number;
+  /**Imagem capturada */
+  foto?: string | null;
+
+  /**Define o status das fotos */
+  status?: "Pendente" | "Concluido" | "Cancelado" | "Andamento";
+
+  /**propiedade que define se e para utilizar o metódo de remover */
+  useRemove?: boolean;
+
+  /**Remove a imagem capturada */
+  onRemove: () => void;
+
+  /**Captura a imagem */
+  handleTakePhoto: () => void;
+};
+
+/**
+ * EXPORTS
+ */
+export { IImageCaptureWithRemoveProps };

package/src/components/loading-progress/index.tsx

@@ -1,93 +1,93 @@
-/**
- * IMPORTS
- */
-import React from "react";
-
-// component
-import { Box } from "../box";
-import { Typography } from "../typography";
-import { Button } from "../button";
-
-// typings
-import { ILoadingProgress } from "./interface";
-
-// styles
-import { theme } from "../../styles/theme/theme";
-
-/**
- *
- * Componente LoadingProgress para a interação do usuário com ui.
- */
-const LoadingProgress: React.FC<ILoadingProgress> = ({
-  textLoading,
-  handleClick,
-  backgroundColor,
-}: ILoadingProgress) => {
-  const truncatedText =
-    textLoading.length > 15 ? textLoading.substring(0, 13) + "..." : textLoading;
-  return (
-    <Box>
-      <Typography
-        text="Carregamento em Andamento"
-        size={theme.fontSizes.lg}
-        fontFamily={theme.fonts.inter_medium_500}
-        color={theme.colors.gray[800]}
-      />
-      <Box
-        paddingStyle={{ padding: theme.paddings["2xs"] }}
-        backgroundColor={backgroundColor ?? theme.colors.neutral[25]}
-        borderStyled={{
-          borderWidth: theme.borderWidths.thin,
-          borderRadius: theme.borderWidths.thick_large,
-          borderStyle: "dashed",
-          borderColor: theme.colors.neutral[200],
-        }}
-        marginStyle={{ marginTop: theme.margins["2xs"], marginBottom: theme.margins["2xs"] }}
-      >
-        <Box flexStyle={{ flexDirection: "row", textAlign: "center" }}>
-          <Typography
-            text={"N° Carregamento: "}
-            size={theme.fontSizes.md}
-            fontFamily={theme.fonts.inter_bold_700}
-            color={theme.colors.blue[400]}
-          />
-
-          <Typography
-            text={truncatedText}
-            size={theme.fontSizes.md}
-            fontFamily={theme.fonts.inter_medium_500}
-            color={theme.colors.gray[800]}
-            letterSpacing={"regular"}
-          />
-        </Box>
-        <Box
-          flexStyle={{ alignItems: "center", justifyContent: "center", flexDirection: "row" }}
-          marginStyle={{ marginTop: theme.margins["2xs"] }}
-        >
-          <Button
-            title={"Visualizar"}
-            onPress={handleClick}
-            backgroundColor={theme.colors.blue[400]}
-            isLoading={false}
-            height={32}
-            width={"75%"}
-            buttonTextStyle={{
-              color: theme.colors.neutral[25],
-              fontFamily: theme.fonts.inter_medium_500,
-              fontSize: theme.fontSizes.lg,
-            }}
-            flexStyle={{ alignItems: "center", justifyContent: "center", flexDirection: "row" }}
-            borderStyled={{
-              borderRadius: theme.borderWidths.thick_medium,
-            }}
-          />
-        </Box>
-      </Box>
-    </Box>
-  );
-};
-
-/**
- * EXPORTS
- */
-export { LoadingProgress };
+/**
+ * IMPORTS
+ */
+import React from "react";
+
+// component
+import { Box } from "../box";
+import { Typography } from "../typography";
+import { Button } from "../button";
+
+// typings
+import { ILoadingProgress } from "./interface";
+
+// styles
+import { theme } from "../../styles/theme/theme";
+
+/**
+ *
+ * Componente LoadingProgress para a interação do usuário com ui.
+ */
+const LoadingProgress: React.FC<ILoadingProgress> = ({
+  textLoading,
+  handleClick,
+  backgroundColor,
+}: ILoadingProgress) => {
+  const truncatedText =
+    textLoading.length > 15 ? textLoading.substring(0, 13) + "..." : textLoading;
+  return (
+    <Box>
+      <Typography
+        text="Carregamento em Andamento"
+        size={theme.fontSizes.lg}
+        fontFamily={theme.fonts.inter_medium_500}
+        color={theme.colors.gray[800]}
+      />
+      <Box
+        paddingStyle={{ padding: theme.paddings["2xs"] }}
+        backgroundColor={backgroundColor ?? theme.colors.neutral[25]}
+        borderStyled={{
+          borderWidth: theme.borderWidths.thin,
+          borderRadius: theme.borderWidths.thick_large,
+          borderStyle: "dashed",
+          borderColor: theme.colors.neutral[200],
+        }}
+        marginStyle={{ marginTop: theme.margins["2xs"], marginBottom: theme.margins["2xs"] }}
+      >
+        <Box flexStyle={{ flexDirection: "row", textAlign: "center" }}>
+          <Typography
+            text={"N° Carregamento: "}
+            size={theme.fontSizes.md}
+            fontFamily={theme.fonts.inter_bold_700}
+            color={theme.colors.blue[400]}
+          />
+
+          <Typography
+            text={truncatedText}
+            size={theme.fontSizes.md}
+            fontFamily={theme.fonts.inter_medium_500}
+            color={theme.colors.gray[800]}
+            letterSpacing={"regular"}
+          />
+        </Box>
+        <Box
+          flexStyle={{ alignItems: "center", justifyContent: "center", flexDirection: "row" }}
+          marginStyle={{ marginTop: theme.margins["2xs"] }}
+        >
+          <Button
+            title={"Visualizar"}
+            onPress={handleClick}
+            backgroundColor={theme.colors.blue[400]}
+            isLoading={false}
+            height={32}
+            width={"75%"}
+            buttonTextStyle={{
+              color: theme.colors.neutral[25],
+              fontFamily: theme.fonts.inter_medium_500,
+              fontSize: theme.fontSizes.lg,
+            }}
+            flexStyle={{ alignItems: "center", justifyContent: "center", flexDirection: "row" }}
+            borderStyled={{
+              borderRadius: theme.borderWidths.thick_medium,
+            }}
+          />
+        </Box>
+      </Box>
+    </Box>
+  );
+};
+
+/**
+ * EXPORTS
+ */
+export { LoadingProgress };

package/src/components/menu-item/interface.d.ts

@@ -10,7 +10,7 @@ interface IMenuItem extends ViewProps, IGlobalCss {
   title?: string;
   handleNavigation: () => void;
   selected: boolean;
-  typeSelected: "LOADING" | "COIL" | "HISTORY";
+  typeSelected: "LOADING" | "ACTIVITY" | "HISTORY";
 }
 
 /**