react-native-exp-fig 0.1.44 → 2.0.0

package/src/stories/modal-activity-reason/modal-activity-reason.stories.tsx

@@ -1,192 +0,0 @@
-/**
- * IMPORTS
- */
-import React, { useState } from "react";
-import type { Meta, StoryObj } from "@storybook/react";
-import { View, Text, Button } from "react-native";
-
-// components
-import ModalActivityReason from "../../components/modals/modal-activity-reason";
-
-/**
- * META
- */
-const meta: Meta<typeof ModalActivityReason> = {
-  title: "componente/ModalActivityReason",
-  component: ModalActivityReason as React.FC,
-  tags: ["autodocs"],
-  args: {
-    visible: false,
-    textTitle: undefined,
-  },
-  argTypes: {
-    visible: {
-      control: { type: "boolean" },
-      description: "Controla a visibilidade do modal.",
-      table: { category: "Comportamento" },
-    },
-    textTitle: {
-      control: { type: "text" },
-      description:
-        "Título exibido no cabeçalho do modal. Se não informado, usa 'Motivo da exclusão'.",
-      table: { category: "Aparência" },
-    },
-    onClose: {
-      action: "onClose",
-      description:
-        "Chamado ao fechar/cancelar o modal. Deve alternar `visible` para `false` no uso controlado.",
-      table: { category: "Eventos" },
-    },
-    modalConfirm: {
-      action: "modalConfirm",
-      description:
-        "Chamado ao confirmar a ação. Por padrão, o componente chama `modalConfirm(true)` e em seguida `onClose()`.",
-      table: { category: "Eventos" },
-    },
-  },
-  parameters: {
-    controls: { expanded: true },
-    layout: "centered",
-    docs: {
-      description: {
-        component: `
-### ModalActivityReason
-
-Modal para solicitar **motivo/justificativa** antes de executar uma ação crítica (ex.: excluir atividade).
-
-#### Recursos
-- Título personalizável via \`textTitle\`
-- Campo de texto (interno) para descrição do motivo
-- Botões **CANCELAR** e **CONFIRMAR**
-- Dispara \`onClose\` e \`modalConfirm\` conforme interação do usuário
-
-#### Props
-- \`visible: boolean\` — controla abertura/fechamento do modal
-- \`onClose: () => void\` — chamado ao cancelar/fechar
-- \`modalConfirm: (ok?: boolean) => void\` — chamado ao confirmar; o componente invoca \`modalConfirm(true)\` e depois \`onClose()\`
-- \`textTitle?: string\` — título opcional do cabeçalho
-
-> Caso \`textTitle\` não seja informado, o título padrão é **"Motivo da exclusão"**.
-
-#### Padrão de Uso (controlado)
-No consumo real, gerencie o estado \`visible\` fora do componente e passe callbacks:
-\`\`\`tsx
-const [open, setOpen] = useState(false);
-
-<ModalActivityReason
-  visible={open}
-  onClose={() => setOpen(false)}
-  modalConfirm={() => {
-    // enviar justificativa para API (se o componente expuser)
-    setOpen(false);
-  }}
-  textTitle="Motivo da exclusão"
-/>
-\`\`\`
-
-#### Testes (ideias)
-- Renderiza com \`visible=true\`
-- Exibe título padrão e título customizado
-- Dispara \`onClose\` ao cancelar
-- Dispara \`modalConfirm\` ao confirmar (e fecha em seguida)
-`,
-      },
-    },
-  },
-  decorators: [
-    (Story) => (
-      <View
-        style={{
-          width: 360,
-          padding: 16,
-          backgroundColor: "#F7F7F7",
-          borderRadius: 12,
-        }}
-      >
-        <Story />
-      </View>
-    ),
-  ],
-};
-
-export default meta;
-
-type Story = StoryObj<typeof meta>;
-
-/**
- * STORIES
- */
-
-// 1) Aberto (básico)
-export const AbertoBasico: Story = {
-  name: "aberto-basico",
-  args: {
-    visible: true,
-  },
-};
-
-// 2) Fechado (estado inicial comum)
-export const Fechado: Story = {
-  name: "fechado",
-  args: {
-    visible: false,
-  },
-};
-
-// 3) Com título personalizado
-export const TituloPersonalizado: Story = {
-  name: "titulo-personalizado",
-  args: {
-    visible: true,
-    textTitle: "Justifique a alteração da atividade",
-  },
-};
-
-// 4) Interativo (controlado) — demonstra fluxo completo
-export const ControladoInterativo: Story = {
-  name: "controlado-interativo",
-  render: (args) => {
-    const Wrapper = () => {
-      const [open, setOpen] = useState(false);
-
-      return (
-        <View>
-          <Button title="Abrir modal" onPress={() => setOpen(true)} />
-          <Text style={{ marginTop: 12, fontSize: 12, color: "#666" }}>
-            Clique para abrir e testar CANCELAR/CONFIRMAR.
-          </Text>
-
-          <ModalActivityReason
-            {...args}
-            visible={open}
-            onClose={() => {
-              // aciona painel de ações do Storybook
-              // @ts-ignore
-              args?.onClose?.();
-              setOpen(false);
-            }}
-            modalConfirm={(value?: string) => {
-              // @ts-ignore
-              args?.modalConfirm?.(value);
-              setOpen(false);
-            }}
-            textTitle={args.textTitle ?? "Motivo da exclusão"}
-          />
-        </View>
-      );
-    };
-
-    return <Wrapper />;
-  },
-  args: {
-    visible: false,
-  },
-  parameters: {
-    docs: {
-      description: {
-        story:
-          "Exemplo **controlado**: o estado `visible` é gerenciado no Story para simular uso real.",
-      },
-    },
-  },
-};

package/src/stories/modal-change-activity/modal-change-activity.stories.tsx

@@ -1,49 +0,0 @@
-/**
- * IMPORTS
- */
-
-import type { Meta, StoryObj } from "@storybook/react";
-
-// component
-import { ModalChangeActivity } from "../../components/modals/modal-change-activity";
-
-const meta: Meta<typeof ModalChangeActivity> = {
-  title: "Componente/ModalChangeActivity",
-  component: ModalChangeActivity,
-  args: {
-    visible: true,
-    descricao: "Repouso Noturno",
-    onClose: () => {},
-    modalConfirm: () => {},
-  },
-  parameters: {
-    docs: {
-      description: {
-        component: `
-# ModalChangeActivity
-
-Componente de modal para alterar a atividade do usuário.
-
-## Uso
-\`\`\`tsx
-<ModalChangeActivity
-  visible
-  dataRegistro="07/03/2024"
-  descricao="Repouso Noturno"
-  modalConfirm={(data) => console.log(data)}
-  onClose={() => console.log("fechar modal")}
-/>
-\`\`\`
-        `,
-      },
-    },
-  },
-};
-
-export default meta;
-
-type Story = StoryObj<typeof meta>;
-
-export const Default: Story = {
-  name: "Modal - Alterar Descanso",
-};

package/src/stories/modal-create-activitie/modal-create-activitie.stories.tsx

@@ -1,90 +0,0 @@
-/* eslint-disable no-undef */
-/**
- * IMPORTS
- */
-import React from "react";
-import type { Meta, StoryObj } from "@storybook/react";
-
-// component
-import ModalCreteActivitie from "../../components/modal-create-activitie";
-
-// utils / types
-type Props = React.ComponentProps<typeof ModalCreteActivitie>;
-
-const meta: Meta<typeof ModalCreteActivitie> = {
-  title: "Componente/ModalCreteActivitie",
-  component: ModalCreteActivitie,
-  args: {
-    visible: false,
-    textTitle: "Incluir atividade",
-  },
-  argTypes: {
-    onClose: { action: "onClose" },
-    onPressConfirm: { action: "onPressConfirm" },
-    textTitle: {
-      control: "text",
-      description: "Título exibido no cabeçalho do modal",
-    },
-    visible: {
-      control: "boolean",
-      description: "Controla a visibilidade do modal",
-    },
-  },
-  parameters: {
-    docs: {
-      description: {
-        component: `
-### ModalCreteActivitie
-Modal para incluir uma atividade com motivo, data e hora.
-
-#### Uso
-\`\`\`tsx
-<ModalCreteActivitie
-  visible={visible}
-  onClose={() => {}}
-  onPressConfirm={(payload) => {}}
-  textTitle="Incluir atividade"
-/>
-\`\`\`
-
-- \`visible\`: abre/fecha o modal
-- \`onClose\`: chamado ao cancelar/fechar
-- \`onPressConfirm\`: retorna { reasonValue, label, dateAndHours }
-- \`textTitle\`: título opcional
-        `,
-      },
-    },
-  },
-} as Meta<typeof ModalCreteActivitie>;
-
-export default meta;
-
-type Story = StoryObj<typeof ModalCreteActivitie>;
-
-/**
- * Apenas controla via Controls (visible true/false no painel do Storybook).
- * Evita Template com "args: any" e mantém tipagem estrita.
- */
-export const Playground: Story = {
-  render: (args: Props) => <ModalCreteActivitie {...args} />,
-};
-
-export const Fechado: Story = {
-  args: {
-    visible: false,
-  },
-};
-
-export const Aberto: Story = {
-  args: {
-    visible: true,
-    textTitle: "Incluir atividade",
-    optionSelected: {
-      value: 22,
-      label: "Em operação - Carregamento",
-    },
-    onPressConfirm: (payload) => {
-      console.log("payload", payload);
-    },
-  },
-};

package/src/stories/modal-journey-rectification/modal-journey-rectification.stories.tsx

@@ -1,170 +0,0 @@
-/**
- * IMPORTS (Storybook)
- */
-import type { Meta, StoryObj } from "@storybook/react";
-import React from "react";
-import { View } from "react-native";
-import { action } from "@storybook/addon-actions";
-
-/**
- * IMPORTS (Componente)
- * Ajuste o caminho conforme sua estrutura (ex.: "../index" ou "./index").
- */
-import ModalJourneyRectification from "../../components/modal-create-activitie";
-
-/**
- * DECORATORS
- * Envolve o story para garantir área de visualização e evitar "modal perdido".
- */
-const WithViewport: React.FC<React.PropsWithChildren> = ({ children }) => {
-  return (
-    <View
-      style={{
-        flex: 1,
-        minHeight: 600,
-        alignItems: "center",
-        justifyContent: "center",
-        backgroundColor: "#F3F4F6", // neutro claro p/ destacar o modal
-      }}
-    >
-      {children}
-    </View>
-  );
-};
-
-/**
- * META
- */
-const meta: Meta<typeof ModalJourneyRectification> = {
-  title: "Componente/ModalJourneyRectification",
-  component: ModalJourneyRectification,
-  args: {
-    visible: false,
-    textTitle: "Editar atividade",
-    onClose: action("onClose"), // ação capturada no painel "Actions"
-    onPressConfirm: action("onPressConfirm"), // idem
-  },
-  argTypes: {
-    visible: {
-      control: { type: "boolean" },
-      description: "Define a visibilidade do modal.",
-      table: { category: "Controle" },
-    },
-    textTitle: {
-      control: { type: "text" },
-      description: "Título exibido no cabeçalho do modal.",
-      table: { category: "Conteúdo" },
-    },
-    onClose: {
-      description: "Callback ao cancelar/fechar o modal.",
-      table: { category: "Eventos" },
-    },
-    onPressConfirm: {
-      description: "Callback ao confirmar. Recebe { reasonValue, label, dateAndHours }.",
-      table: { category: "Eventos" },
-    },
-  },
-  parameters: {
-    layout: "fullscreen",
-    docs: {
-      description: {
-        component: `
-### ModalJourneyRectification
-Modal para **Editar uma atividade** (motivo + data e hora) seguindo o design do sistema.
-
-#### Uso básico
-\`\`\`tsx
-import ModalJourneyRectification from "caminho/do/componente";
-
-<ModalJourneyRectification
-  visible={true}
-  textTitle="Edutar atividade"
-  onClose={() => {/* fechar */}}
-  onPressConfirm={(payload) => {
-    // payload: { reasonValue, label, dateAndHours: { date, hours } }
-  }}
-/>
-\`\`\`
-
-- Ao confirmar, o componente dispara o \`onPressConfirm\` com os dados selecionados e **fecha** em seguida.
-- O clique no overlay ou o botão "CANCELAR" disparam \`onClose\`.
-        `,
-      },
-    },
-  },
-  decorators: [(Story) => <WithViewport>{Story()}</WithViewport>],
-};
-export default meta;
-
-/**
- * STORIES
- */
-type Story = StoryObj<typeof ModalJourneyRectification>;
-
-/**
- * Estado padrão (fechado).
- */
-export const Default: Story = {};
-
-/**
- * Modal visível para inspeção visual.
- */
-export const Opened: Story = {
-  args: {
-    visible: true,
-    optionSelected: {
-      value: 22,
-      label: "Em operação - Carregamento",
-    },
-  },
-  parameters: {
-    docs: {
-      description: {
-        story: "Exibe o modal aberto para validar layout, overlay e botões de ação.",
-      },
-    },
-  },
-};
-
-/**
- * Título customizado (ex.: para variações de copy).
- */
-export const WithCustomTitle: Story = {
-  args: {
-    visible: true,
-    textTitle: "Editar atividade",
-    optionSelected: {
-      value: 22,
-      label: "Em operação - Carregamento",
-    },
-  },
-  parameters: {
-    docs: {
-      description: {
-        story: "Permite validar a troca do título e o encaixe no cabeçalho do modal.",
-      },
-    },
-  },
-};
-
-/**
- * Playground — ajuste livre via Controls.
- */
-export const Playground: Story = {
-  args: {
-    visible: false,
-    textTitle: "Editar atividade",
-    optionSelected: {
-      value: 22,
-      label: "Em operação - Carregamento",
-    },
-  },
-  parameters: {
-    docs: {
-      description: {
-        story:
-          "Use os **Controls** para alternar `visible` e personalizar `textTitle`. As ações aparecem no painel *Actions*.",
-      },
-    },
-  },
-};

package/src/utils/format-date/index.ts

@@ -1,58 +0,0 @@
-/**
- * Formata uma data do tipo Date para o formato DD/MM/YYYY
- * @param date Objeto Date a ser formatado
- * @returns String no formato DD/MM/YYYY
- */
-const formatDate = (date: Date): string => {
-  const day = String(date.getDate()).padStart(2, "0");
-  const month = String(date.getMonth() + 1).padStart(2, "0"); // Mês começa em 0
-  const year = date.getFullYear();
-
-  return `${day}/${month}/${year}`;
-};
-
-export { formatDate };
-
-/**
- * Formata uma data do tipo Date para o formato DD/MM/YYYY
- * @param date Objeto Date a ser formatado
- * @returns String no formato DD/MM/YYYY
- */
-const formHoursMinute = (segundos: string): string => {
-  const totalSegundos = parseInt(segundos, 10);
-  const horas = Math.floor(totalSegundos / 3600);
-  const minutos = Math.floor((totalSegundos % 3600) / 60);
-
-  const horasFormatadas = String(horas).padStart(2, "0");
-  const minutosFormatados = String(minutos).padStart(2, "0");
-
-  return `${horasFormatadas}:${minutosFormatados}`;
-};
-
-export { formHoursMinute };
-
-/**
- * Retorna as sete últimas datas do dias
- * @returns Array<{ date: number, dayName: string, fullDate: Date }>
- */
-
-const getLastSevenDays = () => {
-  const today = new Date();
-  const days = [];
-  const dayNames = ["Domingo", "Segunda", "Terça", "Quarta", "Quinta", "Sexta", "Sábado"];
-
-  for (let i = 7; i >= 0; i--) {
-    const date = new Date(today);
-    date.setDate(today.getDate() - i);
-
-    days.push({
-      date: date.getDate(),
-      dayName: dayNames[date.getDay()],
-      fullDate: date,
-    });
-  }
-
-  return days;
-};
-
-export { getLastSevenDays };

package/src/utils/options-activity/index.ts

@@ -1,15 +0,0 @@
-/**
- * IMPORTS
- */
-const OPTIONS = [
-  { label: "Disp com veículo parado", value: "option1" },
-  { label: "Em Operação de Carregamento", value: "option2" },
-  { label: "Em Carga", value: "option3" },
-  { label: "Em Descarga", value: "option4" },
-  { label: "Tempo à disposição", value: "option5" },
-] as const;
-
-/**
- * EXPORTS
- */
-export { OPTIONS };

package/src/utils/text-limit/index.ts

@@ -1,28 +0,0 @@
-/**
- * IMPORTS
- */
-
-interface ILimitProps {
-  text: string;
-  limit: number;
-}
-const handleLimitTextdisplayByAmount = ({ text, limit }: ILimitProps) => {
-  if (text?.length > limit) {
-    return `${text.substring(0, limit)}...`;
-  } else {
-    return text;
-  }
-};
-
-const handleLimitTextDate = ({ text, limit }: ILimitProps) => {
-  if (text?.length > limit) {
-    return `${text.substring(0, limit)}`;
-  } else {
-    return text;
-  }
-};
-
-/**
- * EXPORTS
- */
-export { handleLimitTextdisplayByAmount, handleLimitTextDate };