analytica-frontend-lib 1.0.68 → 1.0.70

package/dist/index.mjs

@@ -5030,8 +5030,314 @@ var SkeletonTable = forwardRef13(
     ] });
   }
 );
+
+// src/components/Auth/Auth.tsx
+import {
+  createContext,
+  useContext,
+  useEffect as useEffect6,
+  useState as useState9,
+  useCallback,
+  useMemo as useMemo3
+} from "react";
+import { useLocation, Navigate } from "react-router-dom";
+import { Fragment as Fragment6, jsx as jsx28 } from "react/jsx-runtime";
+var AuthContext = createContext(void 0);
+var AuthProvider = ({
+  children,
+  checkAuthFn,
+  signOutFn,
+  initialAuthState = {},
+  getUserFn,
+  getSessionFn,
+  getTokensFn
+}) => {
+  const [authState, setAuthState] = useState9({
+    isAuthenticated: false,
+    isLoading: true,
+    ...initialAuthState
+  });
+  const checkAuth = useCallback(async () => {
+    try {
+      setAuthState((prev) => ({ ...prev, isLoading: true }));
+      if (!checkAuthFn) {
+        setAuthState((prev) => ({
+          ...prev,
+          isAuthenticated: false,
+          isLoading: false
+        }));
+        return false;
+      }
+      const isAuth = await checkAuthFn();
+      setAuthState((prev) => ({
+        ...prev,
+        isAuthenticated: isAuth,
+        isLoading: false,
+        user: getUserFn ? getUserFn() : prev.user,
+        sessionInfo: getSessionFn ? getSessionFn() : prev.sessionInfo,
+        tokens: getTokensFn ? getTokensFn() : prev.tokens
+      }));
+      return isAuth;
+    } catch (error) {
+      console.error("Erro ao verificar autentica\xE7\xE3o:", error);
+      setAuthState((prev) => ({
+        ...prev,
+        isAuthenticated: false,
+        isLoading: false
+      }));
+      return false;
+    }
+  }, [checkAuthFn, getUserFn, getSessionFn, getTokensFn]);
+  const signOut = useCallback(() => {
+    if (signOutFn) {
+      signOutFn();
+    }
+    setAuthState((prev) => ({
+      ...prev,
+      isAuthenticated: false,
+      user: void 0,
+      sessionInfo: void 0,
+      tokens: void 0
+    }));
+  }, [signOutFn]);
+  useEffect6(() => {
+    checkAuth();
+  }, [checkAuth]);
+  const contextValue = useMemo3(
+    () => ({
+      ...authState,
+      checkAuth,
+      signOut
+    }),
+    [authState, checkAuth, signOut]
+  );
+  return /* @__PURE__ */ jsx28(AuthContext.Provider, { value: contextValue, children });
+};
+var useAuth = () => {
+  const context = useContext(AuthContext);
+  if (context === void 0) {
+    throw new Error("useAuth deve ser usado dentro de um AuthProvider");
+  }
+  return context;
+};
+var ProtectedRoute = ({
+  children,
+  redirectTo = "/",
+  loadingComponent,
+  additionalCheck
+}) => {
+  const { isAuthenticated, isLoading, ...authState } = useAuth();
+  const defaultLoadingComponent = /* @__PURE__ */ jsx28("div", { className: "flex items-center justify-center min-h-screen", children: /* @__PURE__ */ jsx28("div", { className: "text-text-950 text-lg", children: "Carregando..." }) });
+  if (isLoading) {
+    return /* @__PURE__ */ jsx28(Fragment6, { children: loadingComponent || defaultLoadingComponent });
+  }
+  if (!isAuthenticated) {
+    return /* @__PURE__ */ jsx28(Navigate, { to: redirectTo, replace: true });
+  }
+  if (additionalCheck && !additionalCheck({ isAuthenticated, isLoading, ...authState })) {
+    return /* @__PURE__ */ jsx28(Navigate, { to: redirectTo, replace: true });
+  }
+  return /* @__PURE__ */ jsx28(Fragment6, { children });
+};
+var PublicRoute = ({
+  children,
+  redirectTo = "/painel",
+  redirectIfAuthenticated = false,
+  checkAuthBeforeRender = false
+}) => {
+  const { isAuthenticated, isLoading } = useAuth();
+  if (checkAuthBeforeRender && isLoading) {
+    return /* @__PURE__ */ jsx28("div", { className: "flex items-center justify-center min-h-screen", children: /* @__PURE__ */ jsx28("div", { className: "text-text-950 text-lg", children: "Carregando..." }) });
+  }
+  if (isAuthenticated && redirectIfAuthenticated) {
+    return /* @__PURE__ */ jsx28(Navigate, { to: redirectTo, replace: true });
+  }
+  return /* @__PURE__ */ jsx28(Fragment6, { children });
+};
+var withAuth = (Component, options = {}) => {
+  return (props) => /* @__PURE__ */ jsx28(ProtectedRoute, { ...options, children: /* @__PURE__ */ jsx28(Component, { ...props }) });
+};
+var useAuthGuard = (options = {}) => {
+  const authState = useAuth();
+  const { requireAuth = true, customCheck } = options;
+  const canAccess = !authState.isLoading && (requireAuth ? authState.isAuthenticated && (!customCheck || customCheck(authState)) : !authState.isAuthenticated || !customCheck || customCheck(authState));
+  return {
+    canAccess,
+    isLoading: authState.isLoading,
+    authState
+  };
+};
+var useRouteAuth = (fallbackPath = "/") => {
+  const { isAuthenticated, isLoading } = useAuth();
+  const location = useLocation();
+  const redirectToLogin = () => /* @__PURE__ */ jsx28(Navigate, { to: fallbackPath, state: { from: location }, replace: true });
+  return {
+    isAuthenticated,
+    isLoading,
+    redirectToLogin
+  };
+};
+
+// src/components/Tab/Tab.tsx
+import { forwardRef as forwardRef14 } from "react";
+import { Fragment as Fragment7, jsx as jsx29, jsxs as jsxs23 } from "react/jsx-runtime";
+var TAB_SIZE_CLASSES = {
+  small: {
+    container: "h-10 gap-1",
+    tab: "px-3 py-2 text-sm",
+    indicator: "h-0.5"
+  },
+  medium: {
+    container: "h-12 gap-2",
+    tab: "px-4 py-4 text-sm",
+    indicator: "h-1"
+  },
+  large: {
+    container: "h-14 gap-2",
+    tab: "px-6 py-4 text-base",
+    indicator: "h-1"
+  }
+};
+var RESPONSIVE_WIDTH_CLASSES = {
+  twoTabs: "w-[115px] sm:w-[204px]",
+  threeTabs: "w-[100px] sm:w-[160px]",
+  fourTabs: "w-[80px] sm:w-[140px]",
+  fiveTabs: "w-[70px] sm:w-[120px]",
+  default: "flex-1"
+};
+var Tab = forwardRef14(
+  ({
+    tabs,
+    activeTab,
+    onTabChange,
+    size = "medium",
+    responsive = true,
+    className = "",
+    ...props
+  }, ref) => {
+    const sizeClasses = TAB_SIZE_CLASSES[size];
+    const getResponsiveWidthClass = (tabCount) => {
+      if (!responsive) return RESPONSIVE_WIDTH_CLASSES.default;
+      switch (tabCount) {
+        case 2:
+          return RESPONSIVE_WIDTH_CLASSES.twoTabs;
+        case 3:
+          return RESPONSIVE_WIDTH_CLASSES.threeTabs;
+        case 4:
+          return RESPONSIVE_WIDTH_CLASSES.fourTabs;
+        case 5:
+          return RESPONSIVE_WIDTH_CLASSES.fiveTabs;
+        default:
+          return RESPONSIVE_WIDTH_CLASSES.default;
+      }
+    };
+    const handleTabClick = (tabId) => {
+      const tab = tabs.find((t) => t.id === tabId);
+      if (tab && !tab.disabled) {
+        onTabChange(tabId);
+      }
+    };
+    const wrapAroundIndex = (index, maxLength) => {
+      if (index < 0) return maxLength - 1;
+      if (index >= maxLength) return 0;
+      return index;
+    };
+    const findNextValidTab = (startIndex, direction) => {
+      let nextIndex = wrapAroundIndex(startIndex + direction, tabs.length);
+      let attempts = 0;
+      while (tabs[nextIndex]?.disabled && attempts < tabs.length) {
+        nextIndex = wrapAroundIndex(nextIndex + direction, tabs.length);
+        attempts++;
+      }
+      return nextIndex;
+    };
+    const handleArrowNavigation = (direction) => {
+      const currentIndex = tabs.findIndex((tab) => tab.id === activeTab);
+      const nextIndex = findNextValidTab(currentIndex, direction);
+      if (!tabs[nextIndex]?.disabled && nextIndex !== currentIndex) {
+        handleTabClick(tabs[nextIndex].id);
+      }
+    };
+    const handleKeyDown = (event, tabId) => {
+      if (event.key === "Enter" || event.key === " ") {
+        event.preventDefault();
+        handleTabClick(tabId);
+        return;
+      }
+      if (event.key === "ArrowLeft" || event.key === "ArrowRight") {
+        event.preventDefault();
+        const direction = event.key === "ArrowLeft" ? -1 : 1;
+        handleArrowNavigation(direction);
+      }
+    };
+    const getTabClassNames = (isDisabled, isActive) => {
+      if (isDisabled) {
+        return "text-text-400 cursor-not-allowed opacity-50";
+      }
+      if (isActive) {
+        return "text-text-950";
+      }
+      return "text-text-700 hover:text-text-800";
+    };
+    const tabWidthClass = getResponsiveWidthClass(tabs.length);
+    const containerWidth = responsive && tabs.length <= 2 ? "w-[240px] sm:w-[416px]" : "w-full";
+    return /* @__PURE__ */ jsx29(
+      "div",
+      {
+        ref,
+        className: `flex flex-row items-start ${sizeClasses.container} ${containerWidth} ${className}`,
+        role: "tablist",
+        ...props,
+        children: tabs.map((tab) => {
+          const isActive = tab.id === activeTab;
+          const isDisabled = Boolean(tab.disabled);
+          const tabClassNames = getTabClassNames(isDisabled, isActive);
+          return /* @__PURE__ */ jsxs23(
+            "button",
+            {
+              type: "button",
+              role: "tab",
+              "aria-selected": isActive,
+              "aria-disabled": isDisabled,
+              tabIndex: isActive ? 0 : -1,
+              className: `
+                relative flex flex-row justify-center items-center gap-2 rounded transition-colors isolate
+                ${sizeClasses.tab}
+                ${tabWidthClass}
+                ${tabClassNames}
+                ${!isDisabled && !isActive ? "hover:bg-background-50" : ""}
+                focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary-500 focus-visible:ring-offset-2
+              `,
+              onClick: () => handleTabClick(tab.id),
+              onKeyDown: (e) => handleKeyDown(e, tab.id),
+              disabled: isDisabled,
+              "data-testid": `tab-${tab.id}`,
+              children: [
+                /* @__PURE__ */ jsx29("span", { className: "font-bold leading-4 tracking-[0.2px] truncate", children: responsive && tab.mobileLabel ? /* @__PURE__ */ jsxs23(Fragment7, { children: [
+                  /* @__PURE__ */ jsx29("span", { className: "sm:hidden", children: tab.mobileLabel }),
+                  /* @__PURE__ */ jsx29("span", { className: "hidden sm:inline", children: tab.label })
+                ] }) : tab.label }),
+                isActive && /* @__PURE__ */ jsx29(
+                  "div",
+                  {
+                    className: `absolute bottom-0 left-2 right-2 bg-primary-700 rounded-lg z-[2] ${sizeClasses.indicator}`,
+                    "data-testid": "active-indicator"
+                  }
+                )
+              ]
+            },
+            tab.id
+          );
+        })
+      }
+    );
+  }
+);
+Tab.displayName = "Tab";
+var Tab_default = Tab;
 export {
   Alert_default as Alert,
+  AuthProvider,
   Badge_default as Badge,
   Button_default as Button,
   Calendar_default as Calendar,
@@ -5067,6 +5373,8 @@ export {
   ProfileMenuTrigger,
   ProgressBar_default as ProgressBar,
   ProgressCircle_default as ProgressCircle,
+  ProtectedRoute,
+  PublicRoute,
   Radio_default as Radio,
   Select_default as Select,
   SelectContent,
@@ -5083,11 +5391,16 @@ export {
   SkeletonTable,
   SkeletonText,
   Stepper_default as Stepper,
+  Tab_default as Tab,
   Table_default as Table,
   Text_default as Text,
   TextArea_default as TextArea,
   Toast_default as Toast,
   Toaster_default as Toaster,
-  ToastStore_default as useToastStore
+  useAuth,
+  useAuthGuard,
+  useRouteAuth,
+  ToastStore_default as useToastStore,
+  withAuth
 };
 //# sourceMappingURL=index.mjs.map