analytica-frontend-lib 1.0.71 → 1.0.73

package/dist/index.d.mts

@@ -30,7 +30,6 @@ export { default as Menu, MenuContent, MenuItem, MenuOverflow } from './Menu/ind
 export { CardActivitiesResults, CardPerformance, CardProgress, CardQuestions, CardResults, CardSimulado, CardStatus, CardTopic } from './Card/index.mjs';
 export { Skeleton, SkeletonCard, SkeletonCircle, SkeletonList, SkeletonRectangle, SkeletonRounded, SkeletonTable, SkeletonText } from './Skeleton/index.mjs';
 export { AuthProvider, ProtectedRoute, PublicRoute, useAuth, useAuthGuard, useRouteAuth, withAuth } from './Auth/index.mjs';
-export { default as Tab } from './Tab/index.mjs';
 import 'react/jsx-runtime';
 import 'react';
 import 'zustand';

package/dist/index.d.ts

@@ -30,7 +30,6 @@ export { default as Menu, MenuContent, MenuItem, MenuOverflow } from './Menu/ind
 export { CardActivitiesResults, CardPerformance, CardProgress, CardQuestions, CardResults, CardSimulado, CardStatus, CardTopic } from './Card/index.js';
 export { Skeleton, SkeletonCard, SkeletonCircle, SkeletonList, SkeletonRectangle, SkeletonRounded, SkeletonTable, SkeletonText } from './Skeleton/index.js';
 export { AuthProvider, ProtectedRoute, PublicRoute, useAuth, useAuthGuard, useRouteAuth, withAuth } from './Auth/index.js';
-export { default as Tab } from './Tab/index.js';
 import 'react/jsx-runtime';
 import 'react';
 import 'zustand';

package/dist/index.js

@@ -80,7 +80,6 @@ __export(src_exports, {
   SkeletonTable: () => SkeletonTable,
   SkeletonText: () => SkeletonText,
   Stepper: () => Stepper_default,
-  Tab: () => Tab_default,
   Table: () => Table_default,
   Text: () => Text_default,
   TextArea: () => TextArea_default,
@@ -4091,6 +4090,125 @@ var CardSimulado = (0, import_react11.forwardRef)(
     );
   }
 );
+var CardTest = (0, import_react11.forwardRef)(
+  ({
+    title,
+    duration,
+    questionsCount,
+    additionalInfo,
+    selected = false,
+    onSelect,
+    className = "",
+    ...props
+  }, ref) => {
+    const handleClick = () => {
+      if (onSelect) {
+        onSelect(!selected);
+      }
+    };
+    const handleKeyDown = (event) => {
+      if ((event.key === "Enter" || event.key === " ") && onSelect) {
+        event.preventDefault();
+        onSelect(!selected);
+      }
+    };
+    const isSelectable = !!onSelect;
+    const getQuestionsText = (count) => {
+      const singular = count === 1 ? "quest\xE3o" : "quest\xF5es";
+      return `${count} ${singular}`;
+    };
+    const displayInfo = questionsCount ? getQuestionsText(questionsCount) : additionalInfo || "";
+    const baseClasses = "flex flex-row items-center p-4 gap-2 w-full max-w-full bg-background shadow-soft-shadow-1 rounded-xl isolate border-0 text-left";
+    const interactiveClasses = isSelectable ? "cursor-pointer focus:outline-none focus:ring-2 focus:ring-primary-950 focus:ring-offset-2" : "";
+    const selectedClasses = selected ? "ring-2 ring-primary-950 ring-offset-2" : "";
+    if (isSelectable) {
+      return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+        "button",
+        {
+          ref,
+          type: "button",
+          className: `${baseClasses} ${interactiveClasses} ${selectedClasses} ${className}`.trim(),
+          onClick: handleClick,
+          onKeyDown: handleKeyDown,
+          "aria-pressed": selected,
+          ...props,
+          children: /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "flex flex-col justify-between gap-[27px] flex-grow min-h-[67px] w-full min-w-0", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+              Text_default,
+              {
+                size: "md",
+                weight: "bold",
+                className: "text-text-950 tracking-[0.2px] leading-[19px] truncate",
+                children: title
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "flex flex-row justify-start items-end gap-4 w-full", children: [
+              duration && /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "flex flex-row items-center gap-1 flex-shrink-0", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_phosphor_react10.Clock, { size: 16, className: "text-text-700" }),
+                /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+                  Text_default,
+                  {
+                    size: "sm",
+                    className: "text-text-700 leading-[21px] whitespace-nowrap",
+                    children: duration
+                  }
+                )
+              ] }),
+              /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+                Text_default,
+                {
+                  size: "sm",
+                  className: "text-text-700 leading-[21px] flex-grow truncate",
+                  children: displayInfo
+                }
+              )
+            ] })
+          ] })
+        }
+      );
+    }
+    return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+      "div",
+      {
+        ref,
+        className: `${baseClasses} ${className}`.trim(),
+        ...props,
+        children: /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "flex flex-col justify-between gap-[27px] flex-grow min-h-[67px] w-full min-w-0", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+            Text_default,
+            {
+              size: "md",
+              weight: "bold",
+              className: "text-text-950 tracking-[0.2px] leading-[19px] truncate",
+              children: title
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "flex flex-row justify-start items-end gap-4 w-full", children: [
+            duration && /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "flex flex-row items-center gap-1 flex-shrink-0", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_phosphor_react10.Clock, { size: 16, className: "text-text-700" }),
+              /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+                Text_default,
+                {
+                  size: "sm",
+                  className: "text-text-700 leading-[21px] whitespace-nowrap",
+                  children: duration
+                }
+              )
+            ] }),
+            /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+              Text_default,
+              {
+                size: "sm",
+                className: "text-text-700 leading-[21px] flex-grow truncate min-w-0",
+                children: displayInfo
+              }
+            )
+          ] })
+        ] })
+      }
+    );
+  }
+);
 
 // src/components/Accordation/Accordation.tsx
 var import_phosphor_react11 = require("phosphor-react");
@@ -5799,164 +5917,6 @@ var useRouteAuth = (fallbackPath = "/") => {
     redirectToLogin
   };
 };
-
-// src/components/Tab/Tab.tsx
-var import_react20 = require("react");
-var import_jsx_runtime32 = require("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 = (0, import_react20.forwardRef)(
-  ({
-    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__ */ (0, import_jsx_runtime32.jsx)(
-      "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__ */ (0, import_jsx_runtime32.jsxs)(
-            "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__ */ (0, import_jsx_runtime32.jsx)("span", { className: "font-bold leading-4 tracking-[0.2px] truncate", children: responsive && tab.mobileLabel ? /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(import_jsx_runtime32.Fragment, { children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("span", { className: "sm:hidden", children: tab.mobileLabel }),
-                  /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("span", { className: "hidden sm:inline", children: tab.label })
-                ] }) : tab.label }),
-                isActive && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
-                  "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;
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   Alert,
@@ -6019,7 +5979,6 @@ var Tab_default = Tab;
   SkeletonTable,
   SkeletonText,
   Stepper,
-  Tab,
   Table,
   Text,
   TextArea,