@lindle/linoardo 1.0.39 → 1.0.41

package/dist/index.d.cts

@@ -10,6 +10,8 @@ export { default as ToolTip, ToolTipPlacement, ToolTipProps } from './tooltip.cj
 export { default as Card, CardMediaProps, CardOverflow, CardProps, CardSectionProps, CardTextProps } from './card.cjs';
 export { default as Block, BlockBlur, BlockProps } from './block.cjs';
 export { default as Masonry, MasonryProps, MasonryRenderItem } from './masonry.cjs';
+import * as react from 'react';
+import { P as PropIcon, G as GlobalSize, a as Palette } from './global.types-gx9A7mUe.cjs';
 export { default as AppBar, AppBarNavItem, AppBarProps } from './app-bar.cjs';
 export { default as Hero, HeroProps } from './hero.cjs';
 export { Avatar, default as ProfileCard, ProfileCardLayout, ProfileCardProps, SocialLink } from './profileCard.cjs';
@@ -22,15 +24,68 @@ export { default as Icon } from './icon.cjs';
 import { NotificationArgs } from './notification.cjs';
 export { default as Notification, NotificationPlacement, NotificationProps, NotificationType, NotificationVariant } from './notification.cjs';
 export { default as Progress, ProgressProps, ProgressStatus, ProgressType } from './progress.cjs';
-export { E as ExpansionPanelDensity, a as ExpansionPanelItem, b as ExpansionPanelItemProps, c as ExpansionPanelProps, d as ExpansionPanelRounded, e as ExpansionPanelValue, f as ExpansionPanelVariant } from './ExpansionPanelItem-ufS2RIZf.cjs';
-export { L as ListDensity, a as ListItem, b as ListItemProps, c as ListLines, d as ListRounded, e as ListVariant } from './index-B7xZzSwm.cjs';
-import 'react';
-import './global.types-D-o85tuX.cjs';
-import './types-DqPSePni.cjs';
+export { default as TimeLine, TimeLineAlign, TimeLineDensity, TimeLineDotSize, TimeLineDotVariant, TimeLineItem, TimeLineItemProps, TimeLineProps, TimeLineSide } from './timeline.cjs';
+export { E as ExpansionPanelDensity, a as ExpansionPanelItem, b as ExpansionPanelItemProps, c as ExpansionPanelProps, d as ExpansionPanelRounded, e as ExpansionPanelValue, f as ExpansionPanelVariant } from './ExpansionPanelItem-CEhDj2Uw.cjs';
+export { L as ListDensity, a as ListItem, b as ListItemProps, c as ListLines, d as ListRounded, e as ListVariant } from './index-BDrBOeFI.cjs';
+import './types-CJ0zqPXF.cjs';
+
+type TabsValue = string | number;
+type TabsVariant = 'line' | 'card' | 'pill';
+type TabsSize = GlobalSize;
+type TabsExtraContent = react.ReactNode | {
+    left?: react.ReactNode;
+    right?: react.ReactNode;
+};
+interface TabsProps extends Omit<react.HTMLAttributes<HTMLDivElement>, 'onChange'> {
+    activeKey?: TabsValue;
+    defaultActiveKey?: TabsValue;
+    onChange?: (activeKey: TabsValue) => void;
+    variant?: TabsVariant;
+    size?: TabsSize;
+    color?: Palette;
+    align?: 'start' | 'center' | 'end';
+    tabBarGutter?: number;
+    tabBarExtraContent?: TabsExtraContent;
+    tabBarClassName?: string;
+    destroyInactiveTabPane?: boolean;
+    keepMounted?: boolean;
+}
+interface TabProps extends react.HTMLAttributes<HTMLDivElement> {
+    label: react.ReactNode;
+    value?: TabsValue;
+    disabled?: boolean;
+    icon?: PropIcon;
+    badge?: react.ReactNode;
+    forceRender?: boolean;
+    tabClassName?: string;
+    panelClassName?: string;
+}
+interface TabsContextValue {
+    activeKey?: TabsValue;
+    onChange?: (activeKey: TabsValue) => void;
+    variant: TabsVariant;
+    size: TabsSize;
+    color: Palette;
+    destroyInactiveTabPane: boolean;
+    keepMounted: boolean;
+}
+interface TabsInternalProps {
+    __tabsContext?: TabsContextValue;
+    __tabsValue?: TabsValue;
+    __tabsIndex?: number;
+    __tabsTabId?: string;
+    __tabsPanelId?: string;
+}
+
+/**
+ * Tabbed container inspired by Ant Design with line, card, and pill styles.
+ */
+declare const Tabs: react.ForwardRefExoticComponent<TabsProps & react.RefAttributes<HTMLDivElement>>;
+declare const Tab: react.ForwardRefExoticComponent<TabProps & TabsInternalProps & react.RefAttributes<HTMLDivElement>>;
 
 declare const useNotification: (defaultMessage?: NotificationArgs) => {
     messages: NotificationArgs[];
     showNotification: (notification: NotificationArgs) => void;
 };
 
-export { NotificationArgs, useNotification };
+export { NotificationArgs, Tab, type TabProps, Tabs, type TabsProps, type TabsSize, type TabsValue, type TabsVariant, useNotification };

package/dist/index.d.ts

@@ -10,6 +10,8 @@ export { default as ToolTip, ToolTipPlacement, ToolTipProps } from './tooltip.js
 export { default as Card, CardMediaProps, CardOverflow, CardProps, CardSectionProps, CardTextProps } from './card.js';
 export { default as Block, BlockBlur, BlockProps } from './block.js';
 export { default as Masonry, MasonryProps, MasonryRenderItem } from './masonry.js';
+import * as react from 'react';
+import { P as PropIcon, G as GlobalSize, a as Palette } from './global.types-gx9A7mUe.js';
 export { default as AppBar, AppBarNavItem, AppBarProps } from './app-bar.js';
 export { default as Hero, HeroProps } from './hero.js';
 export { Avatar, default as ProfileCard, ProfileCardLayout, ProfileCardProps, SocialLink } from './profileCard.js';
@@ -22,15 +24,68 @@ export { default as Icon } from './icon.js';
 import { NotificationArgs } from './notification.js';
 export { default as Notification, NotificationPlacement, NotificationProps, NotificationType, NotificationVariant } from './notification.js';
 export { default as Progress, ProgressProps, ProgressStatus, ProgressType } from './progress.js';
-export { E as ExpansionPanelDensity, a as ExpansionPanelItem, b as ExpansionPanelItemProps, c as ExpansionPanelProps, d as ExpansionPanelRounded, e as ExpansionPanelValue, f as ExpansionPanelVariant } from './ExpansionPanelItem-CFm8a8R_.js';
-export { L as ListDensity, a as ListItem, b as ListItemProps, c as ListLines, d as ListRounded, e as ListVariant } from './index-BhfThlf0.js';
-import 'react';
-import './global.types-D-o85tuX.js';
-import './types-CbQEphC3.js';
+export { default as TimeLine, TimeLineAlign, TimeLineDensity, TimeLineDotSize, TimeLineDotVariant, TimeLineItem, TimeLineItemProps, TimeLineProps, TimeLineSide } from './timeline.js';
+export { E as ExpansionPanelDensity, a as ExpansionPanelItem, b as ExpansionPanelItemProps, c as ExpansionPanelProps, d as ExpansionPanelRounded, e as ExpansionPanelValue, f as ExpansionPanelVariant } from './ExpansionPanelItem-C4-2nlhq.js';
+export { L as ListDensity, a as ListItem, b as ListItemProps, c as ListLines, d as ListRounded, e as ListVariant } from './index-CNwl6vmH.js';
+import './types-DaTHYIPO.js';
+
+type TabsValue = string | number;
+type TabsVariant = 'line' | 'card' | 'pill';
+type TabsSize = GlobalSize;
+type TabsExtraContent = react.ReactNode | {
+    left?: react.ReactNode;
+    right?: react.ReactNode;
+};
+interface TabsProps extends Omit<react.HTMLAttributes<HTMLDivElement>, 'onChange'> {
+    activeKey?: TabsValue;
+    defaultActiveKey?: TabsValue;
+    onChange?: (activeKey: TabsValue) => void;
+    variant?: TabsVariant;
+    size?: TabsSize;
+    color?: Palette;
+    align?: 'start' | 'center' | 'end';
+    tabBarGutter?: number;
+    tabBarExtraContent?: TabsExtraContent;
+    tabBarClassName?: string;
+    destroyInactiveTabPane?: boolean;
+    keepMounted?: boolean;
+}
+interface TabProps extends react.HTMLAttributes<HTMLDivElement> {
+    label: react.ReactNode;
+    value?: TabsValue;
+    disabled?: boolean;
+    icon?: PropIcon;
+    badge?: react.ReactNode;
+    forceRender?: boolean;
+    tabClassName?: string;
+    panelClassName?: string;
+}
+interface TabsContextValue {
+    activeKey?: TabsValue;
+    onChange?: (activeKey: TabsValue) => void;
+    variant: TabsVariant;
+    size: TabsSize;
+    color: Palette;
+    destroyInactiveTabPane: boolean;
+    keepMounted: boolean;
+}
+interface TabsInternalProps {
+    __tabsContext?: TabsContextValue;
+    __tabsValue?: TabsValue;
+    __tabsIndex?: number;
+    __tabsTabId?: string;
+    __tabsPanelId?: string;
+}
+
+/**
+ * Tabbed container inspired by Ant Design with line, card, and pill styles.
+ */
+declare const Tabs: react.ForwardRefExoticComponent<TabsProps & react.RefAttributes<HTMLDivElement>>;
+declare const Tab: react.ForwardRefExoticComponent<TabProps & TabsInternalProps & react.RefAttributes<HTMLDivElement>>;
 
 declare const useNotification: (defaultMessage?: NotificationArgs) => {
     messages: NotificationArgs[];
     showNotification: (notification: NotificationArgs) => void;
 };
 
-export { NotificationArgs, useNotification };
+export { NotificationArgs, Tab, type TabProps, Tabs, type TabsProps, type TabsSize, type TabsValue, type TabsVariant, useNotification };

package/dist/index.js

@@ -1,10 +1,11 @@
 export { Notification_default as Notification } from './chunk-S7VLFCLP.js';
 export { Progress_default as Progress } from './chunk-Z5A2OIDI.js';
-export { Input_default as Input } from './chunk-P3ESW6KM.js';
+export { TimeLine_default as TimeLine, TimeLineItem } from './chunk-4J3SRVOS.js';
+export { Input_default as Input } from './chunk-OBGYXMZ3.js';
 export { TextArea_default as TextArea } from './chunk-SCJMH5VE.js';
 export { Slider_default as Slider } from './chunk-GMDNSU26.js';
 export { Switch_default as Switch } from './chunk-5LWU5T2C.js';
-export { Select_default as Select } from './chunk-BDN4EDJQ.js';
+export { Select_default as Select } from './chunk-LULQOD2K.js';
 import './chunk-6SKW43XI.js';
 export { Icon_default as Icon } from './chunk-HEXJCQRO.js';
 export { Hero_default as Hero } from './chunk-VPF7M2PB.js';
@@ -18,15 +19,418 @@ export { Block_default as Block } from './chunk-5GT6L4BE.js';
 export { AppBar_default as AppBar } from './chunk-67BAO35I.js';
 export { Masonry_default as Masonry } from './chunk-HAXGOTZO.js';
 export { Button_default as Button } from './chunk-DIWGVTWO.js';
-export { Chip_default as Chip } from './chunk-HJFHZNOV.js';
+export { Chip_default as Chip } from './chunk-HT5XBHWN.js';
+import { resolveIconClassName } from './chunk-PSMGRUU5.js';
 import './chunk-IEILIKS2.js';
 export { Badge_default as Badge } from './chunk-HIRPMCQJ.js';
 export { Alert_default as Alert } from './chunk-KQOR3C7E.js';
 export { List_default as List } from './chunk-NADLY6LM.js';
 export { Item_default as ListItem } from './chunk-L4UUC4EF.js';
 export { Menu_default as Menu } from './chunk-ZTP2JSQ6.js';
-import { useState } from 'react';
+import * as React from 'react';
+import { isValidElement, useState } from 'react';
+import { twMerge } from 'tailwind-merge';
+import { jsxs, jsx } from 'react/jsx-runtime';
 
+var TABS_TAB_MARKER = "__isTabsTab";
+var hasMarker = (type) => {
+  if (!type || typeof type !== "function" && typeof type !== "object") {
+    return false;
+  }
+  if (type[TABS_TAB_MARKER]) {
+    return true;
+  }
+  const innerType = type.type;
+  if (innerType && innerType !== type) {
+    return hasMarker(innerType);
+  }
+  return false;
+};
+var isTabsTabElement = (element) => {
+  if (!isValidElement(element)) {
+    return false;
+  }
+  return hasMarker(element.type);
+};
+var markTabsTab = (component) => {
+  if (typeof component !== "function" && (typeof component !== "object" || component === null)) {
+    return;
+  }
+  component[TABS_TAB_MARKER] = true;
+};
+var sizeClasses = {
+  "x-small": { tab: "h-7 px-2 text-xs", icon: "text-sm" },
+  small: { tab: "h-8 px-2.5 text-sm", icon: "text-base" },
+  medium: { tab: "h-9 px-3 text-sm", icon: "text-base" },
+  large: { tab: "h-10 px-3.5 text-base", icon: "text-lg" },
+  "x-large": { tab: "h-11 px-4 text-base", icon: "text-lg" }
+};
+var variantListClasses = {
+  line: "border-b border-gray-200",
+  card: "rounded-xl bg-gray-100 p-1",
+  pill: "rounded-full bg-gray-100/80 p-1"
+};
+var variantTabBaseClasses = {
+  line: "border-b-2 border-transparent -mb-px",
+  card: "rounded-lg border border-transparent bg-white/70",
+  pill: "rounded-full"
+};
+var paletteClasses = {
+  primary: {
+    text: "text-primary",
+    border: "border-primary",
+    bg: "bg-primary/10",
+    ring: "ring-primary/30",
+    ink: "bg-primary"
+  },
+  neutral: {
+    text: "text-gray-900",
+    border: "border-gray-900",
+    bg: "bg-gray-100",
+    ring: "ring-gray-900/20",
+    ink: "bg-gray-900"
+  },
+  info: {
+    text: "text-sky-600",
+    border: "border-sky-500",
+    bg: "bg-sky-50",
+    ring: "ring-sky-500/20",
+    ink: "bg-sky-500"
+  },
+  success: {
+    text: "text-emerald-600",
+    border: "border-emerald-500",
+    bg: "bg-emerald-50",
+    ring: "ring-emerald-500/20",
+    ink: "bg-emerald-500"
+  },
+  warning: {
+    text: "text-amber-600",
+    border: "border-amber-500",
+    bg: "bg-amber-50",
+    ring: "ring-amber-500/20",
+    ink: "bg-amber-500"
+  },
+  danger: {
+    text: "text-red-600",
+    border: "border-red-500",
+    bg: "bg-red-50",
+    ring: "ring-red-500/20",
+    ink: "bg-red-500"
+  },
+  surface: {
+    text: "text-gray-900",
+    border: "border-gray-300",
+    bg: "bg-white",
+    ring: "ring-gray-300/30",
+    ink: "bg-gray-400"
+  },
+  bw: {
+    text: "text-black",
+    border: "border-black",
+    bg: "bg-black/10",
+    ring: "ring-black/20",
+    ink: "bg-black"
+  }
+};
+var panelVariantClasses = {
+  line: "pt-4",
+  card: "mt-3 rounded-xl border border-gray-200 bg-white p-4 shadow-sm",
+  pill: "mt-3 rounded-2xl border border-gray-200 bg-white/90 p-4"
+};
+var isExtraContentObject = (value) => {
+  return !!value && typeof value === "object" && !React.isValidElement(value) && ("left" in value || "right" in value);
+};
+var resolveFirstEnabledTab = (tabs) => tabs.find((tab) => !tab.disabled)?.value;
+var clampActive = (value, tabs) => {
+  if (value === void 0) {
+    return resolveFirstEnabledTab(tabs);
+  }
+  const match = tabs.find((tab) => tab.value === value);
+  if (!match || match.disabled) {
+    return resolveFirstEnabledTab(tabs);
+  }
+  return value;
+};
+var resolveIconNode = (icon, size) => {
+  if (!icon) return null;
+  const iconClass = resolveIconClassName(icon);
+  return iconClass ? /* @__PURE__ */ jsx("i", { className: twMerge(iconClass, size ? sizeClasses[size].icon : void 0), "aria-hidden": true }) : null;
+};
+var collectTabs = (children, tabsId) => {
+  const tabs = [];
+  let index = 0;
+  const walk = (node) => {
+    if (Array.isArray(node)) {
+      node.forEach(walk);
+      return;
+    }
+    if (!isTabsTabElement(node)) {
+      if (React.isValidElement(node)) {
+        const props = node.props;
+        if (props && Object.prototype.hasOwnProperty.call(props, "children")) {
+          walk(props.children);
+        }
+      }
+      return;
+    }
+    const tabIndex = index++;
+    const value = node.props.value ?? tabIndex;
+    const tabId = `${tabsId}-tab-${tabIndex}`;
+    const panelId = `${tabsId}-panel-${tabIndex}`;
+    tabs.push({
+      element: node,
+      index: tabIndex,
+      value,
+      label: node.props.label,
+      disabled: node.props.disabled,
+      icon: node.props.icon,
+      badge: node.props.badge,
+      tabClassName: node.props.tabClassName,
+      panelClassName: node.props.panelClassName,
+      tabId,
+      panelId,
+      forceRender: node.props.forceRender
+    });
+  };
+  walk(children);
+  return tabs;
+};
+var injectTabs = (children, context, tabs) => {
+  let index = 0;
+  const walk = (node) => {
+    if (Array.isArray(node)) {
+      let changed = false;
+      const next = node.map((child) => {
+        const mapped = walk(child);
+        if (mapped !== child) {
+          changed = true;
+        }
+        return mapped;
+      });
+      return changed ? next : node;
+    }
+    if (!React.isValidElement(node)) {
+      return node;
+    }
+    if (isTabsTabElement(node)) {
+      const tab = tabs[index++];
+      if (!tab) {
+        return node;
+      }
+      const injectedProps = {
+        value: tab.value,
+        __tabsContext: context,
+        __tabsValue: tab.value,
+        __tabsIndex: tab.index,
+        __tabsTabId: tab.tabId,
+        __tabsPanelId: tab.panelId
+      };
+      return React.cloneElement(node, injectedProps);
+    }
+    if (node.props) {
+      const props = node.props;
+      if (props && Object.prototype.hasOwnProperty.call(props, "children")) {
+        const mappedChildren = walk(props.children);
+        if (mappedChildren !== props.children) {
+          return React.cloneElement(node, void 0, mappedChildren);
+        }
+      }
+    }
+    return node;
+  };
+  return walk(children);
+};
+var handleTabListKeyDown = (event) => {
+  const { key } = event;
+  if (!["ArrowLeft", "ArrowRight", "Home", "End"].includes(key)) {
+    return;
+  }
+  const tabs = Array.from(event.currentTarget.querySelectorAll('[role="tab"]')).filter((tab) => !tab.disabled);
+  if (!tabs.length) {
+    return;
+  }
+  const currentIndex = tabs.findIndex((tab) => tab === document.activeElement);
+  let nextIndex = currentIndex;
+  if (key === "ArrowRight") {
+    nextIndex = currentIndex === -1 ? 0 : (currentIndex + 1) % tabs.length;
+  }
+  if (key === "ArrowLeft") {
+    nextIndex = currentIndex === -1 ? tabs.length - 1 : (currentIndex - 1 + tabs.length) % tabs.length;
+  }
+  if (key === "Home") {
+    nextIndex = 0;
+  }
+  if (key === "End") {
+    nextIndex = tabs.length - 1;
+  }
+  tabs[nextIndex]?.focus();
+  event.preventDefault();
+};
+var Tabs = React.forwardRef((props, ref) => {
+  const {
+    activeKey,
+    defaultActiveKey,
+    onChange,
+    variant = "line",
+    size = "medium",
+    color = "primary",
+    align = "start",
+    tabBarGutter = 8,
+    tabBarExtraContent,
+    tabBarClassName,
+    destroyInactiveTabPane = false,
+    keepMounted = false,
+    className,
+    children,
+    id,
+    ...rest
+  } = props;
+  const tabsId = typeof id === "string" && id.trim().length ? id : "tabs";
+  const tabs = collectTabs(children, tabsId);
+  const resolvedActive = clampActive(activeKey ?? defaultActiveKey, tabs);
+  const handleActivate = (value) => {
+    onChange?.(value);
+  };
+  const extraContent = tabBarExtraContent;
+  const extraLeft = isExtraContentObject(extraContent) ? extraContent.left : null;
+  const extraRight = isExtraContentObject(extraContent) ? extraContent.right : extraContent;
+  const palette = paletteClasses[color] ?? paletteClasses.primary;
+  const context = {
+    activeKey: resolvedActive,
+    onChange: handleActivate,
+    variant,
+    size,
+    color,
+    destroyInactiveTabPane,
+    keepMounted
+  };
+  const enhancedChildren = injectTabs(children, context, tabs);
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      ...rest,
+      id,
+      ref,
+      className: twMerge("tabs flex w-full flex-col text-gray-900", className),
+      children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
+          extraLeft ? /* @__PURE__ */ jsx("div", { className: "flex items-center", children: extraLeft }) : null,
+          /* @__PURE__ */ jsx(
+            "div",
+            {
+              role: "tablist",
+              "aria-orientation": "horizontal",
+              onKeyDown: handleTabListKeyDown,
+              className: twMerge(
+                "flex min-w-0 flex-1 items-center gap-2 overflow-x-auto",
+                align === "center" ? "justify-center" : align === "end" ? "justify-end" : void 0,
+                variantListClasses[variant],
+                tabBarClassName
+              ),
+              style: { gap: tabBarGutter },
+              children: tabs.map((tab) => {
+                const isActive = tab.value === resolvedActive;
+                const sizeClass = sizeClasses[size] ?? sizeClasses.medium;
+                const iconNode = resolveIconNode(tab.icon, size);
+                const badgeNode = tab.badge ? /* @__PURE__ */ jsx("span", { className: "rounded-full bg-gray-200 px-1.5 py-0.5 text-[0.6rem] font-semibold text-gray-700", children: tab.badge }) : null;
+                const activeText = isActive ? palette.text : "text-gray-600";
+                const activeBorder = isActive ? palette.border : "border-transparent";
+                const activeBg = isActive ? palette.bg : void 0;
+                const activeRing = isActive ? palette.ring : void 0;
+                const variantClasses = {
+                  line: twMerge(activeText, activeBorder),
+                  card: twMerge(activeText, activeBg, activeBorder, isActive ? "shadow-sm" : void 0),
+                  pill: twMerge(activeText, activeBg)
+                };
+                return /* @__PURE__ */ jsxs(
+                  "button",
+                  {
+                    type: "button",
+                    role: "tab",
+                    id: tab.tabId,
+                    "aria-selected": isActive,
+                    "aria-controls": tab.panelId,
+                    "aria-disabled": tab.disabled || void 0,
+                    disabled: tab.disabled,
+                    tabIndex: isActive ? 0 : -1,
+                    onClick: () => {
+                      if (!tab.disabled) {
+                        handleActivate(tab.value);
+                      }
+                    },
+                    className: twMerge(
+                      "inline-flex items-center gap-2 whitespace-nowrap font-medium transition-all duration-150 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/40 focus-visible:ring-offset-2",
+                      sizeClass.tab,
+                      variantTabBaseClasses[variant],
+                      variantClasses[variant],
+                      activeRing ? `ring-1 ${activeRing}` : void 0,
+                      tab.disabled ? "cursor-not-allowed text-gray-400 opacity-60" : "hover:text-gray-900",
+                      tab.tabClassName
+                    ),
+                    "data-state": isActive ? "active" : "inactive",
+                    children: [
+                      iconNode,
+                      /* @__PURE__ */ jsx("span", { className: "truncate", children: tab.label }),
+                      badgeNode
+                    ]
+                  },
+                  tab.value
+                );
+              })
+            }
+          ),
+          extraRight ? /* @__PURE__ */ jsx("div", { className: "flex items-center", children: extraRight }) : null
+        ] }),
+        /* @__PURE__ */ jsx("div", { className: twMerge("min-h-0", panelVariantClasses[variant]), children: enhancedChildren })
+      ]
+    }
+  );
+});
+Tabs.displayName = "Tabs";
+var Tab = React.forwardRef((props, ref) => {
+  const {
+    label: _label,
+    value,
+    disabled,
+    forceRender,
+    tabClassName: _tabClassName,
+    panelClassName,
+    className,
+    children,
+    __tabsContext,
+    __tabsValue,
+    __tabsTabId,
+    __tabsPanelId,
+    ...rest
+  } = props;
+  const context = __tabsContext;
+  const resolvedValue = value ?? __tabsValue;
+  const isActive = context ? context.activeKey === resolvedValue : true;
+  const shouldRender = !context || isActive || context.keepMounted || !context.destroyInactiveTabPane || forceRender;
+  if (!shouldRender) {
+    return null;
+  }
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      ...rest,
+      ref,
+      role: "tabpanel",
+      id: __tabsPanelId,
+      "aria-labelledby": __tabsTabId,
+      "aria-hidden": context ? !isActive : void 0,
+      hidden: context ? !isActive : void 0,
+      className: twMerge("tabs-panel text-gray-900", className, panelClassName),
+      "data-state": isActive ? "active" : "inactive",
+      "data-disabled": disabled || void 0,
+      children
+    }
+  );
+});
+Tab.displayName = "Tab";
+markTabsTab(Tab);
+var Tabs_default = Tabs;
 var useNotification = (defaultMessage) => {
   const [messages, setMessages] = useState([]);
   const clearNotifications = (key) => {
@@ -49,6 +453,6 @@ var useNotification = (defaultMessage) => {
 };
 var useNotification_default = useNotification;
 
-export { useNotification_default as useNotification };
+export { Tab, Tabs_default as Tabs, useNotification_default as useNotification };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map