flikkui 0.1.0-beta.2 → 0.1.0-beta.4

package/dist/components/core/Popover/Popover.animations.js

@@ -0,0 +1,19 @@
+/**
+ * Animation variants for Popover component
+ */
+var popoverContentVariants = {
+    hidden: { opacity: 0, scale: 0.95 },
+    visible: { opacity: 1, scale: 1 },
+    exit: { opacity: 0, scale: 0.95 }
+};
+var popoverBackdropVariants = {
+    hidden: { opacity: 0 },
+    visible: { opacity: 1 },
+    exit: { opacity: 0 }
+};
+var popoverTransitions = {
+    content: { duration: 0.2 },
+    backdrop: { duration: 0.15 }
+};
+
+export { popoverBackdropVariants, popoverContentVariants, popoverTransitions };

package/dist/components/core/Popover/Popover.theme.js

@@ -5,9 +5,9 @@ var popoverTheme = {
     // Base styles for the popover
     baseStyle: "z-50 outline-none",
     // Content styles
-    contentStyle: "bg-white border border-gray-200 rounded-md shadow-lg p-3 max-w-sm",
+    contentStyle: "bg-white border border-border rounded-[var(--popover-rounded)] shadow-[var(--popover-shadow)] p-[var(--popover-padding-md)] max-w-[var(--popover-max-width-md)]",
     // Backdrop styles
-    backdropStyle: "fixed inset-0 bg-black/30",
+    backdropStyle: "fixed inset-0 bg-black/50",
 };
 
 export { popoverTheme };

package/dist/components/core/Popover/PopoverContent.js

@@ -4,6 +4,8 @@ import { createPortal } from 'react-dom';
 import { cn } from '../../../utils/cn.js';
 import { usePopoverContext } from './PopoverContext.js';
 import { useClickOutside } from '../../../utils/useClickOutside.js';
+import { popoverTransitions, popoverBackdropVariants, popoverContentVariants } from './Popover.animations.js';
+import { useReducedMotion } from '../../../node_modules/framer-motion/dist/es/utils/reduced-motion/use-reduced-motion.js';
 import { motion } from '../../../node_modules/framer-motion/dist/es/render/components/motion/proxy.js';
 import { AnimatePresence } from '../../../node_modules/framer-motion/dist/es/components/AnimatePresence/index.js';
 
@@ -13,6 +15,7 @@ import { AnimatePresence } from '../../../node_modules/framer-motion/dist/es/com
 var PopoverContent = React__default.forwardRef(function (_a, ref) {
     var children = _a.children, className = _a.className; _a.animation; var _c = _a.portal, portal = _c === void 0 ? false : _c, props = __rest(_a, ["children", "className", "animation", "portal"]);
     var _d = usePopoverContext(), isOpen = _d.isOpen, onOpenChange = _d.onOpenChange, triggerRef = _d.triggerRef, contentRef = _d.contentRef, placement = _d.placement, offset = _d.offset, triggerType = _d.triggerType, closeOnClickOutside = _d.closeOnClickOutside, closeOnEsc = _d.closeOnEsc, preventClose = _d.preventClose, hasBackdrop = _d.hasBackdrop, theme = _d.theme;
+    var shouldReduceMotion = useReducedMotion();
     var localRef = useRef(null);
     var _e = useState({
         top: 0,
@@ -151,24 +154,12 @@ var PopoverContent = React__default.forwardRef(function (_a, ref) {
             contentRef.current = el;
         }
     }, [ref, contentRef]);
-    // Animation variants
-    var contentVariants = {
-        hidden: { opacity: 0, scale: 0.95 },
-        visible: { opacity: 1, scale: 1 },
-        exit: { opacity: 0, scale: 0.95 }
-    };
-    // Backdrop variants
-    var backdropVariants = {
-        hidden: { opacity: 0 },
-        visible: { opacity: 1 },
-        exit: { opacity: 0 }
-    };
     // Extract DOM props to avoid type conflicts
     // HTML event props that conflict with Framer Motion
     props.onDrag; props.onDragStart; props.onDragEnd; props.onAnimationStart; props.onAnimationEnd; var domProps = __rest(props, ["onDrag", "onDragStart", "onDragEnd", "onAnimationStart", "onAnimationEnd"]);
     // Create a backdrop portal
     var renderBackdrop = hasBackdrop && isOpen && typeof document !== 'undefined';
-    var backdrop = renderBackdrop ? (createPortal(React__default.createElement(motion.div, { key: "backdrop", variants: backdropVariants, initial: "hidden", animate: "visible", exit: "exit", transition: { duration: 0.15 }, className: cn("fixed inset-0 bg-black/50 z-40", theme.backdropStyle), onClick: function (e) {
+    var backdrop = renderBackdrop ? (createPortal(React__default.createElement(motion.div, { key: "backdrop", variants: shouldReduceMotion ? {} : popoverBackdropVariants, initial: shouldReduceMotion ? undefined : "hidden", animate: shouldReduceMotion ? undefined : "visible", exit: shouldReduceMotion ? undefined : "exit", transition: shouldReduceMotion ? { duration: 0 } : popoverTransitions.backdrop, className: cn("fixed inset-0 z-[9998]", theme.backdropStyle), onClick: function (e) {
             e.stopPropagation();
             if (!preventClose) {
                 onOpenChange(false);
@@ -179,7 +170,7 @@ var PopoverContent = React__default.forwardRef(function (_a, ref) {
         React__default.createElement(motion.div, __assign({ ref: handleRef, className: cn("fixed z-50", theme.baseStyle, theme.contentStyle, "popover-content", className), style: {
                 top: "".concat(position.top, "px"),
                 left: "".concat(position.left, "px"),
-            }, role: "dialog", "aria-modal": "true", variants: contentVariants, initial: "hidden", animate: "visible", exit: "exit", transition: { duration: 0.2 }, "data-state": isOpen ? "open" : "closed", "data-placement": placement, "data-trigger": triggerType, "data-backdrop": hasBackdrop ? "true" : "false", onClick: function (e) { return e.stopPropagation(); } }, domProps), children)))));
+            }, role: "dialog", "aria-modal": "true", variants: shouldReduceMotion ? {} : popoverContentVariants, initial: shouldReduceMotion ? undefined : "hidden", animate: shouldReduceMotion ? undefined : "visible", exit: shouldReduceMotion ? undefined : "exit", transition: shouldReduceMotion ? { duration: 0 } : popoverTransitions.content, "data-state": isOpen ? "open" : "closed", "data-placement": placement, "data-trigger": triggerType, "data-backdrop": hasBackdrop ? "true" : "false", onClick: function (e) { return e.stopPropagation(); } }, domProps), children)))));
     // Use portal if specified
     return portal && typeof document !== 'undefined'
         ? createPortal(popoverContent, document.body)

package/dist/components/core/Segmented/Segmented.types.d.ts

@@ -3,6 +3,21 @@ import React from "react";
  * Size options for the Segmented component
  */
 export type SegmentedSize = "sm" | "md" | "lg";
+/**
+ * Theme overrides for Segmented component
+ */
+export interface SegmentedThemeOverrides {
+    /** Base styles for the container */
+    baseStyle?: string;
+    /** Size-specific styles */
+    sizes?: Partial<Record<SegmentedSize, string>>;
+    /** Block/full-width styles */
+    blockStyle?: string;
+    /** Disabled state styles */
+    disabledStyle?: string;
+    /** Sliding background styles */
+    slidingBackgroundStyle?: string;
+}
 /**
  * Segmented component props
  */
@@ -21,6 +36,8 @@ export interface SegmentedProps extends Omit<React.HTMLAttributes<HTMLDivElement
     children?: React.ReactNode;
     /** Custom className for the sliding background */
     slidingBackgroundClassName?: string;
+    /** Theme overrides for advanced customization */
+    theme?: SegmentedThemeOverrides;
 }
 /**
  * SegmentedItem component props

package/dist/components/core/Tabs/Tabs.js

@@ -12,7 +12,7 @@ import { TabsContent } from './TabsContent.js';
  * Uses compound component pattern with Tabs.List, Tabs.Trigger, and Tabs.Content
  */
 var TabsComponent = React__default.forwardRef(function (_a, ref) {
-    var value = _a.value, defaultValue = _a.defaultValue, onValueChange = _a.onValueChange, _b = _a.orientation, orientation = _b === void 0 ? "horizontal" : _b, _c = _a.size, size = _c === void 0 ? "md" : _c, _d = _a.disabled, disabled = _d === void 0 ? false : _d, children = _a.children, className = _a.className, theme = _a.theme, props = __rest(_a, ["value", "defaultValue", "onValueChange", "orientation", "size", "disabled", "children", "className", "theme"]);
+    var value = _a.value, defaultValue = _a.defaultValue, onValueChange = _a.onValueChange, _b = _a.orientation, orientation = _b === void 0 ? "horizontal" : _b, _c = _a.size, size = _c === void 0 ? "md" : _c, _d = _a.disabled, disabled = _d === void 0 ? false : _d, children = _a.children, className = _a.className, props = __rest(_a, ["value", "defaultValue", "onValueChange", "orientation", "size", "disabled", "children", "className"]);
     var _e = useState(value || defaultValue || ""), currentValue = _e[0], setCurrentValue = _e[1];
     // Handle controlled vs uncontrolled
     var isControlled = value !== undefined;
@@ -30,14 +30,8 @@ var TabsComponent = React__default.forwardRef(function (_a, ref) {
         size: size,
         disabled: disabled,
     };
-    // Merge theme overrides
-    var mergedTheme = {
-        baseStyle: (theme === null || theme === void 0 ? void 0 : theme.baseStyle) || tabsTheme.baseStyle,
-        orientations: __assign(__assign({}, tabsTheme.orientations), theme === null || theme === void 0 ? void 0 : theme.orientations),
-        disabledStyle: (theme === null || theme === void 0 ? void 0 : theme.disabledStyle) || tabsTheme.disabledStyle,
-    };
     return (React__default.createElement(TabsContext.Provider, { value: contextValue },
-        React__default.createElement("div", __assign({ ref: ref, className: cn(mergedTheme.baseStyle, mergedTheme.orientations[orientation], disabled && mergedTheme.disabledStyle, className // User overrides take precedence
+        React__default.createElement("div", __assign({ ref: ref, className: cn(tabsTheme.baseStyle, disabled && "opacity-50 cursor-not-allowed pointer-events-none", className // User overrides take precedence
             ), "data-orientation": orientation, "data-size": size, "data-disabled": disabled }, props), children)));
 });
 // Set display name for dev tools and Storybook

package/dist/components/core/Tabs/Tabs.theme.d.ts

@@ -1,52 +1,15 @@
-import { TabsSize, TabsOrientation } from './Tabs.types';
+import { TabsSize } from './Tabs.types';
 /**
- * Internal theme structure for the Tabs component
+ * Clean theme structure for Tabs components
  */
-interface TabsTheme {
+export interface TabsTheme {
     baseStyle: string;
-    orientations: Record<TabsOrientation, string>;
-    disabledStyle: string;
+    listStyle: string;
+    triggerStyle: string;
+    triggerSizes: Record<TabsSize, string>;
+    contentStyle: string;
 }
 /**
- * Internal theme structure for the TabsList component
- */
-interface TabsListTheme {
-    baseStyle: string;
-    orientations: Record<TabsOrientation, string>;
-    sizes: Record<TabsSize, string>;
-}
-/**
- * Internal theme structure for the TabsTrigger component
- */
-interface TabsTriggerTheme {
-    baseStyle: string;
-    orientations: Record<TabsOrientation, string>;
-    sizes: Record<TabsSize, string>;
-    selectedStyle: string;
-    unselectedStyle: string;
-    disabledStyle: string;
-}
-/**
- * Internal theme structure for the TabsContent component
- */
-interface TabsContentTheme {
-    baseStyle: string;
-    orientations: Record<TabsOrientation, string>;
-}
-/**
- * Default theme for the Tabs component
+ * Default theme for Tabs components - simplified and organized
  */
 export declare const tabsTheme: TabsTheme;
-/**
- * Default theme for the TabsList component
- */
-export declare const tabsListTheme: TabsListTheme;
-/**
- * Default theme for the TabsTrigger component
- */
-export declare const tabsTriggerTheme: TabsTriggerTheme;
-/**
- * Default theme for the TabsContent component
- */
-export declare const tabsContentTheme: TabsContentTheme;
-export {};

package/dist/components/core/Tabs/Tabs.theme.js

@@ -1,70 +1,20 @@
 /**
- * Default theme for the Tabs component
+ * Default theme for Tabs components - simplified and organized
  */
 var tabsTheme = {
-    // Base styles for the tabs container
-    baseStyle: "flex",
-    // Orientation variants
-    orientations: {
-        horizontal: "flex-col",
-        vertical: "flex-row",
-    },
-    // Disabled style
-    disabledStyle: "opacity-50 cursor-not-allowed pointer-events-none",
-};
-/**
- * Default theme for the TabsList component
- */
-var tabsListTheme = {
-    // Base styles for the tabs list
-    baseStyle: "relative inline-flex items-center justify-center",
-    // Orientation variants
-    orientations: {
-        horizontal: "flex-row border-b border-neutral-200",
-        vertical: "flex-col border-r border-neutral-200 justify-start items-end",
-    },
-    // Size variants using CSS variables
-    sizes: {
-        sm: "gap-1",
-        md: "gap-2",
-        lg: "gap-3",
-    },
-};
-/**
- * Default theme for the TabsTrigger component
- */
-var tabsTriggerTheme = {
-    // Base styles for the tab trigger
-    baseStyle: "relative inline-flex items-center justify-center whitespace-nowrap font-semibold transition-all duration-200 cursor-pointer focus:outline-none focus-visible:ring-2 focus-visible:ring-primary-500 focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
-    // Orientation variants
-    orientations: {
-        horizontal: "border-b-2 border-transparent hover:border-neutral-300 data-[state=active]:border-primary-600 data-[state=active]:text-primary-600",
-        vertical: "border-r-2 border-transparent hover:border-neutral-300 data-[state=active]:border-primary-600 data-[state=active]:text-primary-600",
-    },
-    // Size variants
-    sizes: {
-        sm: "px-2 py-1.5 text-sm",
-        md: "px-2 py-2 text-sm",
-        lg: "px-2 py-3 text-base",
-    },
-    // Selected state
-    selectedStyle: "text-primary-600",
-    // Unselected state
-    unselectedStyle: "text-neutral-500 hover:text-neutral-900",
-    // Disabled state
-    disabledStyle: "opacity-50 cursor-not-allowed pointer-events-none",
-};
-/**
- * Default theme for the TabsContent component
- */
-var tabsContentTheme = {
-    // Base styles for the tab content
-    baseStyle: "focus:outline-none focus-visible:ring-2 focus-visible:ring-primary-500 focus-visible:ring-offset-2",
-    // Orientation variants
-    orientations: {
-        horizontal: "mt-4",
-        vertical: "ml-4",
+    // Container styles
+    baseStyle: "flex flex-col",
+    // TabsList styles
+    listStyle: "relative inline-flex items-center  flex-row border-b border-border gap-2",
+    // TabsTrigger base styles with data-attribute state handling
+    triggerStyle: "relative inline-flex items-center justify-center whitespace-nowrap font-medium transition-all duration-300 cursor-pointer focus:outline-none focus-visible:ring-2 focus-visible:ring-primary-base focus-visible:ring-offset-2 border-b-2 border-transparent hover:border-neutral-300 disabled:cursor-not-allowed disabled:opacity-50 text-text-muted hover:text-text-primary data-[state=active]:border-primary-base data-[state=active]:text-primary-base",
+    // TabsTrigger size variants
+    triggerSizes: {
+        sm: "px-2 py-1.5 text-sm gap-1",
+        md: "px-2 py-2 text-sm gap-2",
     },
+    // TabsContent styles  
+    contentStyle: "focus:outline-none focus-visible:ring-2 focus-visible:ring-primary-base focus-visible:ring-offset-2",
 };
 
-export { tabsContentTheme, tabsListTheme, tabsTheme, tabsTriggerTheme };
+export { tabsTheme };

package/dist/components/core/Tabs/Tabs.types.d.ts

@@ -2,36 +2,12 @@ import React from "react";
 /**
  * Size options for the Tabs component
  */
-export type TabsSize = "sm" | "md" | "lg";
+export type TabsSize = "sm" | "md";
 /**
  * Orientation options for the Tabs component
+ * Note: Only horizontal orientation is supported
  */
-export type TabsOrientation = "horizontal" | "vertical";
-/**
- * Theme overrides for Tabs components
- */
-export interface TabsThemeOverrides {
-    baseStyle?: string;
-    orientations?: Partial<Record<TabsOrientation, string>>;
-    disabledStyle?: string;
-}
-export interface TabsListThemeOverrides {
-    baseStyle?: string;
-    orientations?: Partial<Record<TabsOrientation, string>>;
-    sizes?: Partial<Record<TabsSize, string>>;
-}
-export interface TabsTriggerThemeOverrides {
-    baseStyle?: string;
-    orientations?: Partial<Record<TabsOrientation, string>>;
-    sizes?: Partial<Record<TabsSize, string>>;
-    selectedStyle?: string;
-    unselectedStyle?: string;
-    disabledStyle?: string;
-}
-export interface TabsContentThemeOverrides {
-    baseStyle?: string;
-    orientations?: Partial<Record<TabsOrientation, string>>;
-}
+export type TabsOrientation = "horizontal";
 /**
  * Tabs component props
  */
@@ -42,7 +18,7 @@ export interface TabsProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'o
     defaultValue?: string;
     /** Function called when selection changes */
     onValueChange?: (value: string) => void;
-    /** Orientation of the tabs */
+    /** Orientation of the tabs (always horizontal) */
     orientation?: TabsOrientation;
     /** Size of the tabs */
     size?: TabsSize;
@@ -50,8 +26,6 @@ export interface TabsProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'o
     disabled?: boolean;
     /** Children components (TabsList, TabsContent) */
     children?: React.ReactNode;
-    /** Theme overrides */
-    theme?: TabsThemeOverrides;
 }
 /**
  * TabsList component props
@@ -59,8 +33,6 @@ export interface TabsProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'o
 export interface TabsListProps extends React.HTMLAttributes<HTMLDivElement> {
     /** Children TabsTrigger components */
     children?: React.ReactNode;
-    /** Theme overrides */
-    theme?: TabsListThemeOverrides;
 }
 /**
  * TabsTrigger component props
@@ -72,8 +44,6 @@ export interface TabsTriggerProps extends React.HTMLAttributes<HTMLButtonElement
     disabled?: boolean;
     /** Children content */
     children?: React.ReactNode;
-    /** Theme overrides */
-    theme?: TabsTriggerThemeOverrides;
 }
 /**
  * TabsContent component props
@@ -85,8 +55,6 @@ export interface TabsContentProps extends React.HTMLAttributes<HTMLDivElement> {
     forceMount?: boolean;
     /** Children content */
     children?: React.ReactNode;
-    /** Theme overrides */
-    theme?: TabsContentThemeOverrides;
 }
 /**
  * Context value for Tabs compound components

package/dist/components/core/Tabs/TabsContent.js

@@ -1,26 +1,21 @@
 import { __rest, __assign } from '../../../node_modules/tslib/tslib.es6.js';
 import React__default from 'react';
 import { cn } from '../../../utils/cn.js';
-import { tabsContentTheme } from './Tabs.theme.js';
+import { tabsTheme } from './Tabs.theme.js';
 import { useTabsContext } from './TabsContext.js';
 
 /**
  * TabsContent component displays content panels for tabs
  */
 var TabsContent = React__default.forwardRef(function (_a, ref) {
-    var value = _a.value, _b = _a.forceMount, forceMount = _b === void 0 ? false : _b, children = _a.children, className = _a.className, theme = _a.theme, props = __rest(_a, ["value", "forceMount", "children", "className", "theme"]);
+    var value = _a.value, _b = _a.forceMount, forceMount = _b === void 0 ? false : _b, children = _a.children, className = _a.className, props = __rest(_a, ["value", "forceMount", "children", "className"]);
     var _c = useTabsContext(), selectedValue = _c.value, orientation = _c.orientation;
     var isSelected = value === selectedValue;
     var shouldRender = forceMount || isSelected;
-    // Merge theme overrides
-    var mergedTheme = {
-        baseStyle: (theme === null || theme === void 0 ? void 0 : theme.baseStyle) || tabsContentTheme.baseStyle,
-        orientations: __assign(__assign({}, tabsContentTheme.orientations), theme === null || theme === void 0 ? void 0 : theme.orientations),
-    };
     if (!shouldRender) {
         return null;
     }
-    return (React__default.createElement("div", __assign({ ref: ref, role: "tabpanel", "aria-labelledby": "".concat(value, "-tab"), id: "".concat(value, "-content"), tabIndex: 0, hidden: !isSelected && !forceMount, className: cn(mergedTheme.baseStyle, mergedTheme.orientations[orientation], !isSelected && forceMount && "hidden", // Hide when not selected but force mounted
+    return (React__default.createElement("div", __assign({ ref: ref, role: "tabpanel", "aria-labelledby": "".concat(value, "-tab"), id: "".concat(value, "-content"), tabIndex: 0, hidden: !isSelected && !forceMount, className: cn(tabsTheme.contentStyle, !isSelected && forceMount && "hidden", // Hide when not selected but force mounted
         className // User overrides take precedence
         ), "data-state": isSelected ? "active" : "inactive", "data-orientation": orientation }, props), children));
 });

package/dist/components/core/Tabs/TabsList.js

@@ -1,23 +1,16 @@
 import { __rest, __assign } from '../../../node_modules/tslib/tslib.es6.js';
 import React__default from 'react';
 import { cn } from '../../../utils/cn.js';
-import { tabsListTheme } from './Tabs.theme.js';
+import { tabsTheme } from './Tabs.theme.js';
 import { useTabsContext } from './TabsContext.js';
 
 /**
  * TabsList component displays the tab headers container
  */
 var TabsList = React__default.forwardRef(function (_a, ref) {
-    var children = _a.children, className = _a.className, theme = _a.theme, props = __rest(_a, ["children", "className", "theme"]);
+    var children = _a.children, className = _a.className, props = __rest(_a, ["children", "className"]);
     var _b = useTabsContext(), orientation = _b.orientation, size = _b.size;
-    // Merge theme overrides
-    var mergedTheme = {
-        baseStyle: (theme === null || theme === void 0 ? void 0 : theme.baseStyle) || tabsListTheme.baseStyle,
-        orientations: __assign(__assign({}, tabsListTheme.orientations), theme === null || theme === void 0 ? void 0 : theme.orientations),
-        sizes: __assign(__assign({}, tabsListTheme.sizes), theme === null || theme === void 0 ? void 0 : theme.sizes),
-    };
-    return (React__default.createElement("div", __assign({ ref: ref, role: "tablist", "aria-orientation": orientation, className: cn(mergedTheme.baseStyle, mergedTheme.orientations[orientation], mergedTheme.sizes[size], className // User overrides take precedence
-        ), "data-orientation": orientation, "data-size": size }, props), children));
+    return (React__default.createElement("div", __assign({ ref: ref, role: "tablist", "aria-orientation": orientation, className: cn(tabsTheme.listStyle, className), "data-orientation": orientation, "data-size": size }, props), children));
 });
 TabsList.displayName = "TabsList";
 

package/dist/components/core/Tabs/TabsTrigger.js

@@ -1,14 +1,14 @@
 import { __rest, __assign } from '../../../node_modules/tslib/tslib.es6.js';
 import React__default from 'react';
 import { cn } from '../../../utils/cn.js';
-import { tabsTriggerTheme } from './Tabs.theme.js';
+import { tabsTheme } from './Tabs.theme.js';
 import { useTabsContext } from './TabsContext.js';
 
 /**
  * TabsTrigger component displays individual tab headers
  */
 var TabsTrigger = React__default.forwardRef(function (_a, ref) {
-    var value = _a.value, _b = _a.disabled, disabled = _b === void 0 ? false : _b, children = _a.children, className = _a.className, theme = _a.theme, onClick = _a.onClick, onKeyDown = _a.onKeyDown, props = __rest(_a, ["value", "disabled", "children", "className", "theme", "onClick", "onKeyDown"]);
+    var value = _a.value, _b = _a.disabled, disabled = _b === void 0 ? false : _b, children = _a.children, className = _a.className, onClick = _a.onClick, onKeyDown = _a.onKeyDown, props = __rest(_a, ["value", "disabled", "children", "className", "onClick", "onKeyDown"]);
     var _c = useTabsContext(), selectedValue = _c.value, onValueChange = _c.onValueChange, orientation = _c.orientation, size = _c.size, contextDisabled = _c.disabled;
     var isSelected = value === selectedValue;
     var isDisabled = disabled || contextDisabled;
@@ -65,19 +65,7 @@ var TabsTrigger = React__default.forwardRef(function (_a, ref) {
         }
         onKeyDown === null || onKeyDown === void 0 ? void 0 : onKeyDown(event);
     };
-    // Merge theme overrides
-    var mergedTheme = {
-        baseStyle: (theme === null || theme === void 0 ? void 0 : theme.baseStyle) || tabsTriggerTheme.baseStyle,
-        orientations: __assign(__assign({}, tabsTriggerTheme.orientations), theme === null || theme === void 0 ? void 0 : theme.orientations),
-        sizes: __assign(__assign({}, tabsTriggerTheme.sizes), theme === null || theme === void 0 ? void 0 : theme.sizes),
-        selectedStyle: (theme === null || theme === void 0 ? void 0 : theme.selectedStyle) || tabsTriggerTheme.selectedStyle,
-        unselectedStyle: (theme === null || theme === void 0 ? void 0 : theme.unselectedStyle) || tabsTriggerTheme.unselectedStyle,
-        disabledStyle: (theme === null || theme === void 0 ? void 0 : theme.disabledStyle) || tabsTriggerTheme.disabledStyle,
-    };
-    return (React__default.createElement("button", __assign({ ref: ref, type: "button", role: "tab", "aria-selected": isSelected, "aria-controls": "".concat(value, "-content"), id: "".concat(value, "-tab"), tabIndex: isSelected ? 0 : -1, disabled: isDisabled, className: cn(mergedTheme.baseStyle, mergedTheme.orientations[orientation], mergedTheme.sizes[size], isSelected
-            ? mergedTheme.selectedStyle
-            : mergedTheme.unselectedStyle, isDisabled && mergedTheme.disabledStyle, className // User overrides take precedence
-        ), onClick: handleClick, onKeyDown: handleKeyDown, "data-value": value, "data-state": isSelected ? "active" : "inactive", "data-disabled": isDisabled, "data-orientation": orientation }, props), children));
+    return (React__default.createElement("button", __assign({ ref: ref, type: "button", role: "tab", "aria-selected": isSelected, "aria-controls": "".concat(value, "-content"), id: "".concat(value, "-tab"), tabIndex: isSelected ? 0 : -1, disabled: isDisabled, className: cn(tabsTheme.triggerStyle, tabsTheme.triggerSizes[size], className), onClick: handleClick, onKeyDown: handleKeyDown, "data-value": value, "data-state": isSelected ? "active" : "inactive", "data-disabled": isDisabled, "data-orientation": orientation }, props), children));
 });
 TabsTrigger.displayName = "TabsTrigger";
 

package/dist/components/core/Tabs/index.d.ts

@@ -5,5 +5,5 @@ export { TabsList } from './TabsList';
 export { TabsTrigger } from './TabsTrigger';
 export { TabsContent } from './TabsContent';
 export { TabsContext, useTabsContext };
-export type { TabsProps, TabsListProps, TabsTriggerProps, TabsContentProps, TabsSize, TabsOrientation, TabsContextValue, TabsThemeOverrides, TabsListThemeOverrides, TabsTriggerThemeOverrides, TabsContentThemeOverrides } from './Tabs.types';
+export type { TabsProps, TabsListProps, TabsTriggerProps, TabsContentProps, TabsSize, TabsOrientation, TabsContextValue } from './Tabs.types';
 export default Tabs;

package/dist/components/core/Tooltip/Tooltip.animations.d.ts

@@ -1,7 +1,7 @@
 import { Variants } from 'motion/react';
 import { TooltipPlacement } from './Tooltip.types';
 /**
- * Base animation variants for the tooltip
+ * Base animation variants for the tooltip - optimized for smooth positioning
  */
 export declare const baseTooltipVariants: Variants;
 /**

package/dist/components/core/Tooltip/Tooltip.d.ts

@@ -1,7 +1,7 @@
 import React from "react";
 import { TooltipProps } from "./Tooltip.types";
 declare const Tooltip: {
-    ({ content, children, placement, delay, disabled, className, maxWidth, minWidth, showArrow, showOnFocus, wrapText, id, theme: themeOverrides, }: TooltipProps): React.JSX.Element;
+    ({ content, children, placement, delay, disabled, className, maxWidth, minWidth, showOnFocus, wrapText, id, theme: themeOverrides, "aria-label": ariaLabel, role, }: TooltipProps): React.JSX.Element;
     displayName: string;
 };
 export default Tooltip;

package/dist/components/core/Tooltip/Tooltip.theme.d.ts

@@ -1,6 +1,5 @@
 export declare const tooltipTheme: {
     baseStyle: string;
-    arrow: string;
     top: string;
     right: string;
     bottom: string;

package/dist/components/core/Tooltip/Tooltip.types.d.ts

@@ -5,10 +5,6 @@ export interface TooltipThemeOverrides {
      * Base style for the tooltip container
      */
     baseStyle?: string;
-    /**
-     * Style for the tooltip arrow
-     */
-    arrow?: string;
     /**
      * Placement styles
      */
@@ -47,21 +43,16 @@ export interface TooltipProps {
     className?: string;
     /**
      * Max width for the tooltip content
-     * @default "320px"
+     * @default "360px"
      */
     maxWidth?: string;
     /**
      * Min width for the tooltip content
-     * @default "250px"
-     */
-    minWidth?: string;
-    /**
-     * Whether to show an arrow pointing to the trigger element
-     * @default true
+     * @default "fit-content"
      */
-    showArrow?: boolean;
+    minWidth?: string | 'fit-content';
     /**
-     * Whether the tooltip should be shown on focus
+     * Whether the tooltip should be shown on focus (improves keyboard accessibility)
      * @default true
      */
     showOnFocus?: boolean;
@@ -71,11 +62,20 @@ export interface TooltipProps {
      */
     wrapText?: boolean;
     /**
-     * ID to be applied to the tooltip element
+     * ID to be applied to the tooltip element (important for ARIA)
      */
     id?: string;
     /**
-     * Theme overrides
+     * Theme overrides following shadcn patterns
      */
     theme?: TooltipThemeOverrides;
+    /**
+     * Custom ARIA label for the tooltip (enhances screen reader support)
+     */
+    'aria-label'?: string;
+    /**
+     * Role override for specific accessibility contexts
+     * @default "tooltip"
+     */
+    role?: 'tooltip' | 'dialog' | 'region';
 }

package/dist/components/core/Tooltip/useTooltipPositioning.d.ts

@@ -0,0 +1,12 @@
+type Placement = 'top' | 'right' | 'bottom' | 'left';
+interface UseTooltipPositioningProps {
+    tooltipRef: React.RefObject<HTMLDivElement | null>;
+    triggerRef: React.RefObject<HTMLDivElement | null>;
+    placement: Placement;
+    isVisible: boolean;
+}
+export declare const useTooltipPositioning: ({ tooltipRef, triggerRef, placement, isVisible, }: UseTooltipPositioningProps) => {
+    positionTooltip: () => void;
+    debouncedPositioning: () => void;
+};
+export {};