analytica-frontend-lib 1.0.71 → 1.0.73

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "analytica-frontend-lib",
-  "version": "1.0.71",
+  "version": "1.0.73",
   "description": "Repositório público dos componentes utilizados nas plataformas da Analytica Ensino",
   "main": "dist/index.cjs",
   "module": "./dist/index.js",
@@ -46,7 +46,6 @@
     "./selection-button": "./dist/SelectionButton/index.js",
     "./skeleton": "./dist/Skeleton/index.js",
     "./stepper": "./dist/Stepper/index.js",
-    "./tab": "./dist/Tab/index.js",
     "./table": "./dist/Table/index.js",
     "./text": "./dist/Text/index.js",
     "./text-area": "./dist/TextArea/index.js",

package/dist/Tab/index.d.mts

@@ -1,37 +0,0 @@
-import * as react from 'react';
-import { HTMLAttributes } from 'react';
-
-/**
- * Individual tab item interface
- */
-interface TabItem {
-    /** Unique identifier for the tab */
-    id: string;
-    /** Label text for the tab */
-    label: string;
-    /** Alternative label for mobile (optional) */
-    mobileLabel?: string;
-    /** Whether the tab is disabled */
-    disabled?: boolean;
-}
-/**
- * Tab component props interface
- */
-interface TabProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onChange'> {
-    /** Array of tab items */
-    tabs: TabItem[];
-    /** Currently active tab ID */
-    activeTab: string;
-    /** Callback when tab changes */
-    onTabChange: (tabId: string) => void;
-    /** Size variant of the tabs */
-    size?: 'small' | 'medium' | 'large';
-    /** Whether to enable responsive behavior */
-    responsive?: boolean;
-}
-/**
- * Tab component following the established architecture patterns
- */
-declare const Tab: react.ForwardRefExoticComponent<TabProps & react.RefAttributes<HTMLDivElement>>;
-
-export { type TabItem, type TabProps, Tab as default };

package/dist/Tab/index.d.ts

@@ -1,37 +0,0 @@
-import * as react from 'react';
-import { HTMLAttributes } from 'react';
-
-/**
- * Individual tab item interface
- */
-interface TabItem {
-    /** Unique identifier for the tab */
-    id: string;
-    /** Label text for the tab */
-    label: string;
-    /** Alternative label for mobile (optional) */
-    mobileLabel?: string;
-    /** Whether the tab is disabled */
-    disabled?: boolean;
-}
-/**
- * Tab component props interface
- */
-interface TabProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onChange'> {
-    /** Array of tab items */
-    tabs: TabItem[];
-    /** Currently active tab ID */
-    activeTab: string;
-    /** Callback when tab changes */
-    onTabChange: (tabId: string) => void;
-    /** Size variant of the tabs */
-    size?: 'small' | 'medium' | 'large';
-    /** Whether to enable responsive behavior */
-    responsive?: boolean;
-}
-/**
- * Tab component following the established architecture patterns
- */
-declare const Tab: react.ForwardRefExoticComponent<TabProps & react.RefAttributes<HTMLDivElement>>;
-
-export { type TabItem, type TabProps, Tab as default };

package/dist/Tab/index.js

@@ -1,182 +0,0 @@
-"use strict";
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// src/components/Tab/Tab.tsx
-var Tab_exports = {};
-__export(Tab_exports, {
-  default: () => Tab_default
-});
-module.exports = __toCommonJS(Tab_exports);
-var import_react = require("react");
-var import_jsx_runtime = 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_react.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_runtime.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_runtime.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_runtime.jsx)("span", { className: "font-bold leading-4 tracking-[0.2px] truncate", children: responsive && tab.mobileLabel ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "sm:hidden", children: tab.mobileLabel }),
-                  /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "hidden sm:inline", children: tab.label })
-                ] }) : tab.label }),
-                isActive && /* @__PURE__ */ (0, import_jsx_runtime.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;
-//# sourceMappingURL=index.js.map

package/dist/Tab/index.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/components/Tab/Tab.tsx"],"sourcesContent":["import { forwardRef, HTMLAttributes, KeyboardEvent } from 'react';\n\n/**\n * Individual tab item interface\n */\nexport interface TabItem {\n  /** Unique identifier for the tab */\n  id: string;\n  /** Label text for the tab */\n  label: string;\n  /** Alternative label for mobile (optional) */\n  mobileLabel?: string;\n  /** Whether the tab is disabled */\n  disabled?: boolean;\n}\n\n/**\n * Tab component props interface\n */\nexport interface TabProps\n  extends Omit<HTMLAttributes<HTMLDivElement>, 'onChange'> {\n  /** Array of tab items */\n  tabs: TabItem[];\n  /** Currently active tab ID */\n  activeTab: string;\n  /** Callback when tab changes */\n  onTabChange: (tabId: string) => void;\n  /** Size variant of the tabs */\n  size?: 'small' | 'medium' | 'large';\n  /** Whether to enable responsive behavior */\n  responsive?: boolean;\n}\n\n/**\n * Size configuration lookup table\n */\nconst TAB_SIZE_CLASSES = {\n  small: {\n    container: 'h-10 gap-1',\n    tab: 'px-3 py-2 text-sm',\n    indicator: 'h-0.5',\n  },\n  medium: {\n    container: 'h-12 gap-2',\n    tab: 'px-4 py-4 text-sm',\n    indicator: 'h-1',\n  },\n  large: {\n    container: 'h-14 gap-2',\n    tab: 'px-6 py-4 text-base',\n    indicator: 'h-1',\n  },\n} as const;\n\n/**\n * Responsive width classes for tabs\n */\nconst RESPONSIVE_WIDTH_CLASSES = {\n  twoTabs: 'w-[115px] sm:w-[204px]',\n  threeTabs: 'w-[100px] sm:w-[160px]',\n  fourTabs: 'w-[80px] sm:w-[140px]',\n  fiveTabs: 'w-[70px] sm:w-[120px]',\n  default: 'flex-1',\n} as const;\n\n/**\n * Tab component following the established architecture patterns\n */\nconst Tab = forwardRef<HTMLDivElement, TabProps>(\n  (\n    {\n      tabs,\n      activeTab,\n      onTabChange,\n      size = 'medium',\n      responsive = true,\n      className = '',\n      ...props\n    },\n    ref\n  ) => {\n    const sizeClasses = TAB_SIZE_CLASSES[size];\n\n    /**\n     * Get responsive width class based on number of tabs\n     */\n    const getResponsiveWidthClass = (tabCount: number): string => {\n      if (!responsive) return RESPONSIVE_WIDTH_CLASSES.default;\n\n      switch (tabCount) {\n        case 2:\n          return RESPONSIVE_WIDTH_CLASSES.twoTabs;\n        case 3:\n          return RESPONSIVE_WIDTH_CLASSES.threeTabs;\n        case 4:\n          return RESPONSIVE_WIDTH_CLASSES.fourTabs;\n        case 5:\n          return RESPONSIVE_WIDTH_CLASSES.fiveTabs;\n        default:\n          return RESPONSIVE_WIDTH_CLASSES.default;\n      }\n    };\n\n    /**\n     * Handle tab click\n     */\n    const handleTabClick = (tabId: string) => {\n      const tab = tabs.find((t) => t.id === tabId);\n      if (tab && !tab.disabled) {\n        onTabChange(tabId);\n      }\n    };\n\n    /**\n     * Wrap index around array bounds\n     */\n    const wrapAroundIndex = (index: number, maxLength: number): number => {\n      if (index < 0) return maxLength - 1;\n      if (index >= maxLength) return 0;\n      return index;\n    };\n\n    /**\n     * Find next valid (non-disabled) tab index\n     */\n    const findNextValidTab = (\n      startIndex: number,\n      direction: number\n    ): number => {\n      let nextIndex = wrapAroundIndex(startIndex + direction, tabs.length);\n      let attempts = 0;\n\n      while (tabs[nextIndex]?.disabled && attempts < tabs.length) {\n        nextIndex = wrapAroundIndex(nextIndex + direction, tabs.length);\n        attempts++;\n      }\n\n      return nextIndex;\n    };\n\n    /**\n     * Handle arrow key navigation\n     */\n    const handleArrowNavigation = (direction: number): void => {\n      const currentIndex = tabs.findIndex((tab) => tab.id === activeTab);\n      const nextIndex = findNextValidTab(currentIndex, direction);\n\n      if (!tabs[nextIndex]?.disabled && nextIndex !== currentIndex) {\n        handleTabClick(tabs[nextIndex].id);\n      }\n    };\n\n    /**\n     * Handle keyboard navigation\n     */\n    const handleKeyDown = (\n      event: KeyboardEvent<HTMLButtonElement>,\n      tabId: string\n    ) => {\n      if (event.key === 'Enter' || event.key === ' ') {\n        event.preventDefault();\n        handleTabClick(tabId);\n        return;\n      }\n\n      if (event.key === 'ArrowLeft' || event.key === 'ArrowRight') {\n        event.preventDefault();\n        const direction = event.key === 'ArrowLeft' ? -1 : 1;\n        handleArrowNavigation(direction);\n      }\n    };\n\n    /**\n     * Get tab text and interaction classes based on state\n     */\n    const getTabClassNames = (\n      isDisabled: boolean,\n      isActive: boolean\n    ): string => {\n      if (isDisabled) {\n        return 'text-text-400 cursor-not-allowed opacity-50';\n      }\n\n      if (isActive) {\n        return 'text-text-950';\n      }\n\n      return 'text-text-700 hover:text-text-800';\n    };\n\n    const tabWidthClass = getResponsiveWidthClass(tabs.length);\n    const containerWidth =\n      responsive && tabs.length <= 2 ? 'w-[240px] sm:w-[416px]' : 'w-full';\n\n    return (\n      <div\n        ref={ref}\n        className={`flex flex-row items-start ${sizeClasses.container} ${containerWidth} ${className}`}\n        role=\"tablist\"\n        {...props}\n      >\n        {tabs.map((tab) => {\n          const isActive = tab.id === activeTab;\n          const isDisabled = Boolean(tab.disabled);\n          const tabClassNames = getTabClassNames(isDisabled, isActive);\n\n          return (\n            <button\n              key={tab.id}\n              type=\"button\"\n              role=\"tab\"\n              aria-selected={isActive}\n              aria-disabled={isDisabled}\n              tabIndex={isActive ? 0 : -1}\n              className={`\n                relative flex flex-row justify-center items-center gap-2 rounded transition-colors isolate\n                ${sizeClasses.tab}\n                ${tabWidthClass}\n                ${tabClassNames}\n                ${!isDisabled && !isActive ? 'hover:bg-background-50' : ''}\n                focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary-500 focus-visible:ring-offset-2\n              `}\n              onClick={() => handleTabClick(tab.id)}\n              onKeyDown={(e) => handleKeyDown(e, tab.id)}\n              disabled={isDisabled}\n              data-testid={`tab-${tab.id}`}\n            >\n              <span className=\"font-bold leading-4 tracking-[0.2px] truncate\">\n                {responsive && tab.mobileLabel ? (\n                  <>\n                    <span className=\"sm:hidden\">{tab.mobileLabel}</span>\n                    <span className=\"hidden sm:inline\">{tab.label}</span>\n                  </>\n                ) : (\n                  tab.label\n                )}\n              </span>\n              {isActive && (\n                <div\n                  className={`absolute bottom-0 left-2 right-2 bg-primary-700 rounded-lg z-[2] ${sizeClasses.indicator}`}\n                  data-testid=\"active-indicator\"\n                />\n              )}\n            </button>\n          );\n        })}\n      </div>\n    );\n  }\n);\n\nTab.displayName = 'Tab';\n\nexport default Tab;\n"],"mappings":"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","names":[]}

package/dist/Tab/index.mjs

@@ -1,161 +0,0 @@
-// src/components/Tab/Tab.tsx
-import { forwardRef } from "react";
-import { Fragment, jsx, jsxs } 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 = 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__ */ 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__ */ 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__ */ jsx("span", { className: "font-bold leading-4 tracking-[0.2px] truncate", children: responsive && tab.mobileLabel ? /* @__PURE__ */ jsxs(Fragment, { children: [
-                  /* @__PURE__ */ jsx("span", { className: "sm:hidden", children: tab.mobileLabel }),
-                  /* @__PURE__ */ jsx("span", { className: "hidden sm:inline", children: tab.label })
-                ] }) : tab.label }),
-                isActive && /* @__PURE__ */ 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;
-export {
-  Tab_default as default
-};
-//# sourceMappingURL=index.mjs.map

package/dist/Tab/index.mjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/components/Tab/Tab.tsx"],"sourcesContent":["import { forwardRef, HTMLAttributes, KeyboardEvent } from 'react';\n\n/**\n * Individual tab item interface\n */\nexport interface TabItem {\n  /** Unique identifier for the tab */\n  id: string;\n  /** Label text for the tab */\n  label: string;\n  /** Alternative label for mobile (optional) */\n  mobileLabel?: string;\n  /** Whether the tab is disabled */\n  disabled?: boolean;\n}\n\n/**\n * Tab component props interface\n */\nexport interface TabProps\n  extends Omit<HTMLAttributes<HTMLDivElement>, 'onChange'> {\n  /** Array of tab items */\n  tabs: TabItem[];\n  /** Currently active tab ID */\n  activeTab: string;\n  /** Callback when tab changes */\n  onTabChange: (tabId: string) => void;\n  /** Size variant of the tabs */\n  size?: 'small' | 'medium' | 'large';\n  /** Whether to enable responsive behavior */\n  responsive?: boolean;\n}\n\n/**\n * Size configuration lookup table\n */\nconst TAB_SIZE_CLASSES = {\n  small: {\n    container: 'h-10 gap-1',\n    tab: 'px-3 py-2 text-sm',\n    indicator: 'h-0.5',\n  },\n  medium: {\n    container: 'h-12 gap-2',\n    tab: 'px-4 py-4 text-sm',\n    indicator: 'h-1',\n  },\n  large: {\n    container: 'h-14 gap-2',\n    tab: 'px-6 py-4 text-base',\n    indicator: 'h-1',\n  },\n} as const;\n\n/**\n * Responsive width classes for tabs\n */\nconst RESPONSIVE_WIDTH_CLASSES = {\n  twoTabs: 'w-[115px] sm:w-[204px]',\n  threeTabs: 'w-[100px] sm:w-[160px]',\n  fourTabs: 'w-[80px] sm:w-[140px]',\n  fiveTabs: 'w-[70px] sm:w-[120px]',\n  default: 'flex-1',\n} as const;\n\n/**\n * Tab component following the established architecture patterns\n */\nconst Tab = forwardRef<HTMLDivElement, TabProps>(\n  (\n    {\n      tabs,\n      activeTab,\n      onTabChange,\n      size = 'medium',\n      responsive = true,\n      className = '',\n      ...props\n    },\n    ref\n  ) => {\n    const sizeClasses = TAB_SIZE_CLASSES[size];\n\n    /**\n     * Get responsive width class based on number of tabs\n     */\n    const getResponsiveWidthClass = (tabCount: number): string => {\n      if (!responsive) return RESPONSIVE_WIDTH_CLASSES.default;\n\n      switch (tabCount) {\n        case 2:\n          return RESPONSIVE_WIDTH_CLASSES.twoTabs;\n        case 3:\n          return RESPONSIVE_WIDTH_CLASSES.threeTabs;\n        case 4:\n          return RESPONSIVE_WIDTH_CLASSES.fourTabs;\n        case 5:\n          return RESPONSIVE_WIDTH_CLASSES.fiveTabs;\n        default:\n          return RESPONSIVE_WIDTH_CLASSES.default;\n      }\n    };\n\n    /**\n     * Handle tab click\n     */\n    const handleTabClick = (tabId: string) => {\n      const tab = tabs.find((t) => t.id === tabId);\n      if (tab && !tab.disabled) {\n        onTabChange(tabId);\n      }\n    };\n\n    /**\n     * Wrap index around array bounds\n     */\n    const wrapAroundIndex = (index: number, maxLength: number): number => {\n      if (index < 0) return maxLength - 1;\n      if (index >= maxLength) return 0;\n      return index;\n    };\n\n    /**\n     * Find next valid (non-disabled) tab index\n     */\n    const findNextValidTab = (\n      startIndex: number,\n      direction: number\n    ): number => {\n      let nextIndex = wrapAroundIndex(startIndex + direction, tabs.length);\n      let attempts = 0;\n\n      while (tabs[nextIndex]?.disabled && attempts < tabs.length) {\n        nextIndex = wrapAroundIndex(nextIndex + direction, tabs.length);\n        attempts++;\n      }\n\n      return nextIndex;\n    };\n\n    /**\n     * Handle arrow key navigation\n     */\n    const handleArrowNavigation = (direction: number): void => {\n      const currentIndex = tabs.findIndex((tab) => tab.id === activeTab);\n      const nextIndex = findNextValidTab(currentIndex, direction);\n\n      if (!tabs[nextIndex]?.disabled && nextIndex !== currentIndex) {\n        handleTabClick(tabs[nextIndex].id);\n      }\n    };\n\n    /**\n     * Handle keyboard navigation\n     */\n    const handleKeyDown = (\n      event: KeyboardEvent<HTMLButtonElement>,\n      tabId: string\n    ) => {\n      if (event.key === 'Enter' || event.key === ' ') {\n        event.preventDefault();\n        handleTabClick(tabId);\n        return;\n      }\n\n      if (event.key === 'ArrowLeft' || event.key === 'ArrowRight') {\n        event.preventDefault();\n        const direction = event.key === 'ArrowLeft' ? -1 : 1;\n        handleArrowNavigation(direction);\n      }\n    };\n\n    /**\n     * Get tab text and interaction classes based on state\n     */\n    const getTabClassNames = (\n      isDisabled: boolean,\n      isActive: boolean\n    ): string => {\n      if (isDisabled) {\n        return 'text-text-400 cursor-not-allowed opacity-50';\n      }\n\n      if (isActive) {\n        return 'text-text-950';\n      }\n\n      return 'text-text-700 hover:text-text-800';\n    };\n\n    const tabWidthClass = getResponsiveWidthClass(tabs.length);\n    const containerWidth =\n      responsive && tabs.length <= 2 ? 'w-[240px] sm:w-[416px]' : 'w-full';\n\n    return (\n      <div\n        ref={ref}\n        className={`flex flex-row items-start ${sizeClasses.container} ${containerWidth} ${className}`}\n        role=\"tablist\"\n        {...props}\n      >\n        {tabs.map((tab) => {\n          const isActive = tab.id === activeTab;\n          const isDisabled = Boolean(tab.disabled);\n          const tabClassNames = getTabClassNames(isDisabled, isActive);\n\n          return (\n            <button\n              key={tab.id}\n              type=\"button\"\n              role=\"tab\"\n              aria-selected={isActive}\n              aria-disabled={isDisabled}\n              tabIndex={isActive ? 0 : -1}\n              className={`\n                relative flex flex-row justify-center items-center gap-2 rounded transition-colors isolate\n                ${sizeClasses.tab}\n                ${tabWidthClass}\n                ${tabClassNames}\n                ${!isDisabled && !isActive ? 'hover:bg-background-50' : ''}\n                focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary-500 focus-visible:ring-offset-2\n              `}\n              onClick={() => handleTabClick(tab.id)}\n              onKeyDown={(e) => handleKeyDown(e, tab.id)}\n              disabled={isDisabled}\n              data-testid={`tab-${tab.id}`}\n            >\n              <span className=\"font-bold leading-4 tracking-[0.2px] truncate\">\n                {responsive && tab.mobileLabel ? (\n                  <>\n                    <span className=\"sm:hidden\">{tab.mobileLabel}</span>\n                    <span className=\"hidden sm:inline\">{tab.label}</span>\n                  </>\n                ) : (\n                  tab.label\n                )}\n              </span>\n              {isActive && (\n                <div\n                  className={`absolute bottom-0 left-2 right-2 bg-primary-700 rounded-lg z-[2] ${sizeClasses.indicator}`}\n                  data-testid=\"active-indicator\"\n                />\n              )}\n            </button>\n          );\n        })}\n      </div>\n    );\n  }\n);\n\nTab.displayName = 'Tab';\n\nexport default Tab;\n"],"mappings":"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","names":[]}