react-native-exp-fig 0.1.43 → 2.0.0

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

@@ -1,207 +1,204 @@
-/**
- * IMPORTS
- */
-import React from "react";
-import { Image, TouchableOpacity } from "react-native";
-
-// components
-import Box from "../box";
-import { Typography } from "../typography";
-
-// comons / constants
-import { IMAGES } from "../../common/constants";
-
-// typings
-import { IUserProfile } from "./interface";
-
-// styles
-import { theme } from "../../styles/theme/theme";
-
-/**
- * Componente Header para a interação do usuário com ui.
- */
-const UserProfile: React.FC<IUserProfile> = ({
-  nome,
-  avatar,
-  cpf,
-  placa_cavalo,
-  bluetoothIsConnected,
-  situacao = "carregador",
-  app_version,
-  color,
-  width,
-  height,
-  handleProfileView,
-  testID,
-}: IUserProfile) => {
-  return (
-    <Box
-      testID={testID}
-      width={width ?? "100%"}
-      height={height}
-      backgroundColor={theme.colors.blue[525]}
-      paddingStyle={{
-        paddingLeft: theme.paddings.md,
-        paddingRight: theme.paddings.md,
-        paddingBottom: theme.paddings["2xs"],
-      }}
-    >
-      <Box
-        width={"100%"}
-        flexStyle={{ flexDirection: "row", alignItems: "center", justifyContent: "center" }}
-        marginStyle={{ marginTop: theme.margins.md }}
-      >
-        <TouchableOpacity activeOpacity={0.7} onPress={handleProfileView}>
-          <Image
-            testID="user-profile-avatar"
-            source={{
-              uri: avatar || IMAGES.IMAGE_ANONIMA,
-            }}
-            style={{
-              width: 120,
-              height: 120,
-              borderRadius: 60,
-              borderWidth: theme.borderWidths.thin_medium,
-              borderColor: theme.colors.green[400],
-            }}
-          />
-        </TouchableOpacity>
-      </Box>
-
-      <Box
-        width={"100%"}
-        flexStyle={{ flexDirection: "column", alignItems: "center", justifyContent: "center" }}
-      >
-        <Box
-          width={"100%"}
-          flexStyle={{
-            flexDirection: "row",
-            alignItems: "center",
-            justifyContent: "flex-start",
-            textAlign: "center",
-          }}
-          paddingStyle={{ paddingTop: theme.paddings["2xs"] }}
-        >
-          <Typography
-            text={"Olá, "}
-            color={color?.colorText ?? theme.colors.neutral[25]}
-            size={theme.fontSizes.md}
-            fontFamily={theme.fonts.inter_regular_400}
-            fontWeight="400"
-            lineHeight={theme.fontSizes.lg ?? 18}
-            letterSpacing={"regular"}
-          />
-          <Box width={"89%"}>
-            <Typography
-              text={nome}
-              color={color?.colorText ?? theme.colors.neutral[25]}
-              size={theme.fontSizes.sm}
-              fontFamily="inter_medium_500"
-              fontWeight="500"
-              ellipsizeMode="tail"
-              numberOfLines={1}
-              lineHeight={theme.fontSizes.lg ?? 18}
-              letterSpacing={"regular"}
-            />
-          </Box>
-        </Box>
-        <Box
-          width={"100%"}
-          flexStyle={{
-            flexDirection: "row",
-            alignItems: "center",
-            justifyContent: "flex-start",
-            textAlign: "center",
-          }}
-          paddingStyle={{ paddingTop: 5 }}
-        >
-          <Typography
-            text={"CPF: "}
-            color={color?.colorText ?? theme.colors.neutral[25]}
-            size={theme.fontSizes.md}
-            fontFamily={theme.fonts.inter_regular_400}
-            lineHeight={theme.fontSizes.lg ?? 18}
-            letterSpacing={"regular"}
-          />
-
-          <Typography
-            text={cpf}
-            color={color?.colorText ?? theme.colors.neutral[25]}
-            size={theme.fontSizes.sm}
-            fontFamily={theme.fonts.inter_semi_bold_600}
-            fontWeight="600"
-            lineHeight={theme.fontSizes.lg ?? 18}
-            letterSpacing={"regular"}
-          />
-        </Box>
-        {situacao !== "carregador" && (
-          <Box
-            width={"100%"}
-            flexStyle={{
-              flexDirection: "row",
-              alignItems: "center",
-              justifyContent: "flex-start",
-              textAlign: "center",
-            }}
-            paddingStyle={{ paddingTop: 5 }}
-          >
-            <Typography
-              text={"CONECTADO: "}
-              color={color?.colorText ?? theme.colors.neutral[25]}
-              size={theme.fontSizes.sm}
-              fontFamily={theme.fonts.inter_medium_500}
-              fontWeight="500"
-              lineHeight={theme.fontSizes.lg ?? 18}
-              letterSpacing={"regular"}
-            />
-
-            <Typography
-              text={bluetoothIsConnected ? placa_cavalo : ""}
-              color={theme.colors.green[400]}
-              size={theme.fontSizes.sm}
-              fontFamily={theme.fonts.inter_bold_700}
-              fontWeight="700"
-              lineHeight={theme.fontSizes.lg ?? 18}
-              letterSpacing={"regular"}
-            />
-          </Box>
-        )}
-      </Box>
-
-      <Box
-        width={"100%"}
-        flexStyle={{
-          flexDirection: "row",
-          alignItems: "center",
-          justifyContent: "flex-end",
-        }}
-        marginStyle={{ marginTop: theme.margins.md }}
-      >
-        <Typography
-          text={"Versão: "}
-          color={color?.colorText ?? theme.colors.neutral[25]}
-          size={theme.fontSizes.md}
-          fontFamily={theme.fonts.inter_regular_400}
-          fontWeight="400"
-          lineHeight={theme.fontSizes.lg ?? 18}
-          letterSpacing={"regular"}
-        />
-
-        <Typography
-          text={app_version}
-          color={color?.colorText ?? theme.colors.neutral[25]}
-          size={theme.fontSizes.sm}
-          fontWeight="300"
-          fontFamily={theme.fonts.inter_light_300}
-          lineHeight={theme.fontSizes.lg ?? 18}
-          letterSpacing={"regular"}
-        />
-      </Box>
-    </Box>
-  );
-};
-
-/**
- * EXPORTS
- */
-export { UserProfile };
+/**
+ * IMPORTS
+ */
+import React from "react";
+import { Image, TouchableOpacity } from "react-native";
+
+// components
+import { Box } from "../box";
+import { Typography } from "../typography";
+
+// comons / constants
+import { IMAGES } from "../../common/constants";
+
+// typings
+import { IUserProfile } from "./interface";
+
+// styles
+import { theme } from "../../styles/theme/theme";
+
+/**
+ * Componente Header para a interação do usuário com ui.
+ */
+const UserProfile: React.FC<IUserProfile> = ({
+  nome,
+  avatar,
+  cpf,
+  placa_cavalo,
+  bluetoothIsConnected,
+  app_version,
+  color,
+  width,
+  height,
+  handleProfileView,
+  testID,
+}: IUserProfile) => {
+  return (
+    <Box
+      testID={testID}
+      width={width ?? "100%"}
+      height={height}
+      backgroundColor={theme.colors.blue[525]}
+      paddingStyle={{
+        paddingLeft: theme.paddings.md,
+        paddingRight: theme.paddings.md,
+        paddingBottom: theme.paddings["2xs"],
+      }}
+    >
+      <Box
+        width={"100%"}
+        flexStyle={{ flexDirection: "row", alignItems: "center", justifyContent: "center" }}
+        marginStyle={{ marginTop: theme.margins.md }}
+      >
+        <TouchableOpacity activeOpacity={0.7} onPress={handleProfileView}>
+          <Image
+            testID="user-profile-avatar"
+            source={{
+              uri: avatar || IMAGES.IMAGE_ANONIMA,
+            }}
+            style={{
+              width: 120,
+              height: 120,
+              borderRadius: 60,
+              borderWidth: theme.borderWidths.thin_medium,
+              borderColor: theme.colors.green[400],
+            }}
+          />
+        </TouchableOpacity>
+      </Box>
+
+      <Box
+        width={"100%"}
+        flexStyle={{ flexDirection: "column", alignItems: "center", justifyContent: "center" }}
+      >
+        <Box
+          width={"100%"}
+          flexStyle={{
+            flexDirection: "row",
+            alignItems: "center",
+            justifyContent: "flex-start",
+            textAlign: "center",
+          }}
+          paddingStyle={{ paddingTop: theme.paddings["2xs"] }}
+        >
+          <Typography
+            text={"Olá, "}
+            color={color?.colorText ?? theme.colors.neutral[25]}
+            size={theme.fontSizes.md}
+            fontFamily={theme.fonts.inter_regular_400}
+            fontWeight="400"
+            lineHeight={theme.fontSizes.lg ?? 18}
+            letterSpacing={"regular"}
+          />
+          <Box width={"89%"}>
+            <Typography
+              text={nome}
+              color={color?.colorText ?? theme.colors.neutral[25]}
+              size={theme.fontSizes.sm}
+              fontFamily="inter_medium_500"
+              fontWeight="500"
+              ellipsizeMode="tail"
+              numberOfLines={1}
+              lineHeight={theme.fontSizes.lg ?? 18}
+              letterSpacing={"regular"}
+            />
+          </Box>
+        </Box>
+        <Box
+          width={"100%"}
+          flexStyle={{
+            flexDirection: "row",
+            alignItems: "center",
+            justifyContent: "flex-start",
+            textAlign: "center",
+          }}
+          paddingStyle={{ paddingTop: 5 }}
+        >
+          <Typography
+            text={"CPF: "}
+            color={color?.colorText ?? theme.colors.neutral[25]}
+            size={theme.fontSizes.md}
+            fontFamily={theme.fonts.inter_regular_400}
+            lineHeight={theme.fontSizes.lg ?? 18}
+            letterSpacing={"regular"}
+          />
+
+          <Typography
+            text={cpf}
+            color={color?.colorText ?? theme.colors.neutral[25]}
+            size={theme.fontSizes.sm}
+            fontFamily={theme.fonts.inter_semi_bold_600}
+            fontWeight="600"
+            lineHeight={theme.fontSizes.lg ?? 18}
+            letterSpacing={"regular"}
+          />
+        </Box>
+        <Box
+          width={"100%"}
+          flexStyle={{
+            flexDirection: "row",
+            alignItems: "center",
+            justifyContent: "flex-start",
+            textAlign: "center",
+          }}
+          paddingStyle={{ paddingTop: 5 }}
+        >
+          <Typography
+            text={"CONECTADO: "}
+            color={color?.colorText ?? theme.colors.neutral[25]}
+            size={theme.fontSizes.sm}
+            fontFamily={theme.fonts.inter_medium_500}
+            fontWeight="500"
+            lineHeight={theme.fontSizes.lg ?? 18}
+            letterSpacing={"regular"}
+          />
+
+          <Typography
+            text={bluetoothIsConnected ? placa_cavalo : ""}
+            color={theme.colors.green[400]}
+            size={theme.fontSizes.sm}
+            fontFamily={theme.fonts.inter_bold_700}
+            fontWeight="700"
+            lineHeight={theme.fontSizes.lg ?? 18}
+            letterSpacing={"regular"}
+          />
+        </Box>
+      </Box>
+
+      <Box
+        width={"100%"}
+        flexStyle={{
+          flexDirection: "row",
+          alignItems: "center",
+          justifyContent: "flex-end",
+        }}
+        marginStyle={{ marginTop: theme.margins.md }}
+      >
+        <Typography
+          text={"Versão: "}
+          color={color?.colorText ?? theme.colors.neutral[25]}
+          size={theme.fontSizes.md}
+          fontFamily={theme.fonts.inter_regular_400}
+          fontWeight="400"
+          lineHeight={theme.fontSizes.lg ?? 18}
+          letterSpacing={"regular"}
+        />
+
+        <Typography
+          text={app_version}
+          color={color?.colorText ?? theme.colors.neutral[25]}
+          size={theme.fontSizes.sm}
+          fontWeight="300"
+          fontFamily={theme.fonts.inter_light_300}
+          lineHeight={theme.fontSizes.lg ?? 18}
+          letterSpacing={"regular"}
+        />
+      </Box>
+    </Box>
+  );
+};
+
+/**
+ * EXPORTS
+ */
+export { UserProfile };

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

@@ -1,23 +1,22 @@
-/**
- * IMPORTS
- */
-import { ViewProps } from "react-native";
-
-// typing
-import { IGlobalCss } from "../../styles/global/interface";
-
-interface IUserProfile extends ViewProps, IGlobalCss {
-  nome: string;
-  avatar: string;
-  cpf: string;
-  placa_cavalo: string;
-  bluetoothIsConnected: boolean;
-  situacao?: string;
-  app_version: string;
-  handleProfileView: () => void;
-}
-
-/**
- * EXPORTS
- */
-export { IUserProfile };
+/**
+ * IMPORTS
+ */
+import { ViewProps } from "react-native";
+
+// typing
+import { IGlobalCss } from "../../styles/global/interface";
+
+interface IUserProfile extends ViewProps, IGlobalCss {
+  nome: string;
+  avatar: string;
+  cpf: string;
+  placa_cavalo: string;
+  bluetoothIsConnected: boolean;
+  app_version: string;
+  handleProfileView: () => void;
+}
+
+/**
+ * EXPORTS
+ */
+export { IUserProfile };

package/src/index.ts

@@ -1,56 +1,48 @@
-/**
- * EXPORTS
- */
-
-// Components
-export { default as Box } from "./components/box";
-export { Button } from "./components/button";
-export { default as StepIndicator } from "./components/step-indicator";
-export { Typography } from "./components/typography";
-export { Input } from "./components/input";
-export { CapturePhoto } from "./components/capture-photo";
-export { CardHours } from "./components/card-hours";
-export { default as SelectOption } from "./components/selects/select-option";
-export { Header } from "./components/header-profile";
-export { ScheduledJourneyIndicators } from "./components/scheduled-journey-indicators";
-export { CardScheduledJourney } from "./components/card-scheduled-journey";
-export { UserProfile } from "./components/user-profile";
-export { MenuItem } from "./components/menu-item";
-export { CardLoading } from "./components/card-loading";
-export { CardWorkSession } from "./components/card-work-session";
-export { LoadingProgress } from "./components/loading-progress";
-export { NoData } from "./components/no-data";
-export { FilterJourney } from "./components/filter-journey";
-export { Coil } from "./components/coil";
-export { FilterDateSelector } from "./components/filter-date-selector";
-export { CardHistory } from "./components/card-history";
-export { NotificationLoading } from "./components/notification-loading";
-export { CheckBox } from "./components/check-box";
-export { ImageCaptureWithRemove } from "./components/image-capture-with-remove";
-export { LoadingDetails } from "./components/loading-details";
-export { AvatarProfile } from "./components/avatar-profile";
-export { HistoryDetails } from "./components/history-details";
-export { ActivitiesDaily } from "./components/activities-daily";
-export { ActivitiesProgress } from "./components/activities-progress";
-export { ProfileMenuOption } from "./components/profile-menu-option";
-export { ModalActivities } from "./components/modals/modal-activities";
-export { HistoryActivitiesCard } from "./components/history-activities-card";
-export { ModalChangeActivity } from "./components/modals/modal-change-activity";
-export { ActiveLoadingsSummary } from "./components/active-loadings-summary";
-export { default as ModalActivityReason } from "./components/modals/modal-activity-reason";
-export { default as InputTextCounter } from "./components/input-text-counter";
-export { default as ModalCreteActivitie } from "./components/modal-create-activitie";
-export { default as ModalJourneyRectification } from "./components/modal-journey-rectification";
-export { default as ActivityTimeline } from "./components/activity-timeline";
-export { default as CardAvailableLoad } from "./components/card-available-load";
-export { default as CardDriverData } from "./components/card-driver-data";
-export { default as DriverJourneyInfo } from "./components/driver-journey-info";
-export { default as DocumentCargaInfo } from "./components/document-carga-info";
-export { default as AlertCriticalLoad } from "./components/alert-critical-load";
-
-// Utilities
-export { multiply } from "./utils/mutiply";
-export { formatDate, getLastSevenDays, formHoursMinute } from "./utils/format-data";
-
-// Styles
-export { theme } from "./styles/theme/theme";
+/**
+ * EXPORTS
+ */
+
+// Components
+export { Box } from "./components/box";
+export { Button } from "./components/button";
+export { StepIndicator } from "./components/step-indicator";
+export { Typography } from "./components/typography";
+export { Input } from "./components/input";
+export { CapturePhoto } from "./components/capture-photo";
+export { CardHours } from "./components/card-hours";
+export { SelectOption } from "./components/selects/select-option";
+export { Header } from "./components/header-profile";
+export { ScheduledJourneyIndicators } from "./components/scheduled-journey-indicators";
+export { CardScheduledJourney } from "./components/card-scheduled-journey";
+export { UserProfile } from "./components/user-profile";
+export { MenuItem } from "./components/menu-item";
+export { CardLoading } from "./components/card-loading";
+export { CardWorkSession } from "./components/card-work-session";
+export { LoadingProgress } from "./components/loading-progress";
+export { NoData } from "./components/no-data";
+export { FilterJourney } from "./components/filter-journey";
+export { Coil } from "./components/coil";
+export { FilterDateSelector } from "./components/filter-date-selector";
+export { CardHistory } from "./components/card-history";
+export { NotificationLoading } from "./components/notification-loading";
+export { CheckBox } from "./components/check-box";
+export { ImageCaptureWithRemove } from "./components/image-capture-with-remove";
+export { LoadingDetails } from "./components/loading-details";
+export { AvatarProfile } from "./components/avatar-profile";
+export { HistoryDetails } from "./components/history-details";
+export { ActivitiesDaily } from "./components/activities-daily";
+export { ActivitiesProgress } from "./components/activities-progress";
+export { ProfileMenuOption } from "./components/profile-menu-option";
+export { ModalActivities } from "./components/modal-activities";
+export { default as CardReport } from "./components/card-report";
+export { default as Loading } from "./components/loading";
+export { default as NotificationCard } from "./components/notification-card";
+export { default as LoadMoreDataFlatList } from "./components/load-more-data";
+export { default as AppList } from "./components/app-list";
+
+// Utilities
+export { multiply } from "./utils/mutiply";
+export { formatDate, getLastSevenDays, formHoursMinute } from "./utils/format-data";
+
+// Styles
+export { theme } from "./styles/theme/theme";

package/src/stories/activities-daily/activities-daily.stories.tsx

@@ -1,5 +1,9 @@
+/**
+ * IMPORTS
+ */
 import type { StoryObj, Meta } from "@storybook/react";
 
+// components
 import { ActivitiesDaily } from "../../components/activities-daily";
 
 const meta: Meta<typeof ActivitiesDaily> = {
@@ -33,8 +37,8 @@ export const ActivitiesDailySimples: Story = {
   name: "activities-daily",
   args: {
     handleActivity: (typeActivity: any) => {
-      /* global alert */
-      alert(typeActivity);
+      /* global console */
+      console.log(typeActivity);
     },
   },
 };

package/src/stories/avatar-profile/avatar-profile.stories.tsx

@@ -1,32 +1,32 @@
-import { Meta, StoryObj } from "@storybook/react";
-import { AvatarProfile } from "../../components/avatar-profile";
-
-const meta: Meta<typeof AvatarProfile> = {
-  title: "Componente/AvatarProfile",
-  component: AvatarProfile,
-  args: {
-    name: "Everton",
-    avatar: "https://randomuser.me/api/portraits/men/1.jpg",
-    email: "teste@gmail.com",
-    isEdit: false,
-    handleTakePicker: () => {},
-  },
-  parameters: {
-    notes: ` AvatarProfile Componente de avatar de perfil com edição opcional.`,
-  },
-};
-
-export default meta;
-
-type Story = StoryObj<typeof meta>;
-
-export const Default: Story = {
-  name: "default",
-};
-
-export const Editable: Story = {
-  name: "editable",
-  args: {
-    isEdit: true,
-  },
-};
+import { Meta, StoryObj } from "@storybook/react";
+import { AvatarProfile } from "../../components/avatar-profile";
+
+const meta: Meta<typeof AvatarProfile> = {
+  title: "Componente/AvatarProfile",
+  component: AvatarProfile,
+  args: {
+    name: "Everton",
+    avatar: "https://randomuser.me/api/portraits/men/1.jpg",
+    email: "teste@gmail.com",
+    isEdit: false,
+    handleTakePicker: () => {},
+  },
+  parameters: {
+    notes: ` AvatarProfile Componente de avatar de perfil com edição opcional.`,
+  },
+};
+
+export default meta;
+
+type Story = StoryObj<typeof meta>;
+
+export const Default: Story = {
+  name: "default",
+};
+
+export const Editable: Story = {
+  name: "editable",
+  args: {
+    isEdit: true,
+  },
+};