flikkui 0.1.0-beta.9 → 0.2.0-beta.1

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

@@ -0,0 +1,29 @@
+import React from "react";
+import type { CommandPaletteProps } from "./CommandPalette.types";
+/**
+ * CommandPalette Component
+ *
+ * A ⌘K style command palette for quick navigation and actions.
+ *
+ * @example
+ * ```tsx
+ * const [isOpen, setIsOpen] = useState(false);
+ *
+ * const commands = [
+ *   {
+ *     id: 'new-file',
+ *     label: 'New File',
+ *     contentStart: <DocumentPlusIcon />,
+ *     shortcut: ['⌘', 'N'],
+ *     onSelect: () => console.log('New file'),
+ *   },
+ * ];
+ *
+ * <CommandPalette
+ *   isOpen={isOpen}
+ *   onClose={() => setIsOpen(false)}
+ *   commands={commands}
+ * />
+ * ```
+ */
+export declare const CommandPalette: React.FC<CommandPaletteProps>;

package/dist/components/core/CommandPalette/CommandPalette.js

@@ -0,0 +1,220 @@
+import React__default, { useState, useRef, useMemo, useEffect } from 'react';
+import { commandPaletteTheme } from './CommandPalette.theme.js';
+import { containerAnimations, overlayAnimations } from './CommandPalette.animations.js';
+import { cn } from '../../../utils/cn.js';
+import { MagnifyingGlassIcon } from '@heroicons/react/24/outline';
+import { CommandItem } from './CommandItem.js';
+import { Overlay } from '../../effects/Overlay/Overlay.js';
+
+/**
+ * Default filter function for commands
+ */
+const defaultFilterFunction = (command, searchValue) => {
+    var _a, _b;
+    const search = searchValue.toLowerCase();
+    const labelMatch = command.label.toLowerCase().includes(search);
+    const descriptionMatch = (_a = command.description) === null || _a === void 0 ? void 0 : _a.toLowerCase().includes(search);
+    const keywordsMatch = (_b = command.keywords) === null || _b === void 0 ? void 0 : _b.some((keyword) => keyword.toLowerCase().includes(search));
+    return labelMatch || descriptionMatch || keywordsMatch || false;
+};
+/**
+ * Check if commands array is grouped
+ */
+const isGroupedCommands = (commands) => {
+    return commands.length > 0 && "commands" in commands[0];
+};
+/**
+ * Flatten grouped commands into a single array
+ */
+const flattenCommands = (commands) => {
+    if (isGroupedCommands(commands)) {
+        return commands.flatMap((group) => group.commands);
+    }
+    return commands;
+};
+/**
+ * Group commands by their group property
+ */
+const groupCommandsByCategory = (commands) => {
+    const grouped = {};
+    commands.forEach((command) => {
+        const groupKey = command.group || "Other";
+        if (!grouped[groupKey]) {
+            grouped[groupKey] = [];
+        }
+        grouped[groupKey].push(command);
+    });
+    return Object.entries(grouped).map(([label, groupCommands]) => ({
+        id: label.toLowerCase().replace(/\s+/g, "-"),
+        label,
+        commands: groupCommands,
+    }));
+};
+/**
+ * CommandPalette Component
+ *
+ * A ⌘K style command palette for quick navigation and actions.
+ *
+ * @example
+ * ```tsx
+ * const [isOpen, setIsOpen] = useState(false);
+ *
+ * const commands = [
+ *   {
+ *     id: 'new-file',
+ *     label: 'New File',
+ *     contentStart: <DocumentPlusIcon />,
+ *     shortcut: ['⌘', 'N'],
+ *     onSelect: () => console.log('New file'),
+ *   },
+ * ];
+ *
+ * <CommandPalette
+ *   isOpen={isOpen}
+ *   onClose={() => setIsOpen(false)}
+ *   commands={commands}
+ * />
+ * ```
+ */
+const CommandPalette = ({ isOpen, onClose, commands = [], placeholder = "Type a command or search...", emptyMessage = "No results found.", maxHeight = "400px", className = "", overlayClassName = "", theme: themeOverrides, grouped = false, onSearchChange, filterFunction = defaultFilterFunction, closeOnOverlayClick = true, closeOnEsc = true, }) => {
+    // Merge theme with overrides
+    const theme = { ...commandPaletteTheme, ...(themeOverrides || {}) };
+    // State
+    const [searchValue, setSearchValue] = useState("");
+    const [highlightedIndex, setHighlightedIndex] = useState(0);
+    // Refs
+    const searchInputRef = useRef(null);
+    const listContainerRef = useRef(null);
+    // Flatten all commands for filtering
+    const allCommands = useMemo(() => flattenCommands(commands), [commands]);
+    // Filter commands based on search
+    const filteredCommands = useMemo(() => {
+        if (!searchValue.trim()) {
+            return allCommands;
+        }
+        return allCommands.filter((command) => filterFunction(command, searchValue));
+    }, [allCommands, searchValue, filterFunction]);
+    // Group filtered commands if needed
+    const displayCommands = useMemo(() => {
+        if (grouped || isGroupedCommands(commands)) {
+            return groupCommandsByCategory(filteredCommands);
+        }
+        return filteredCommands;
+    }, [grouped, commands, filteredCommands]);
+    // Get flat list of filtered commands for keyboard navigation
+    const flatFilteredCommands = useMemo(() => {
+        if (isGroupedCommands(displayCommands)) {
+            return displayCommands.flatMap((group) => group.commands);
+        }
+        return displayCommands;
+    }, [displayCommands]);
+    // Reset highlighted index when search changes
+    useEffect(() => {
+        setHighlightedIndex(0);
+    }, [searchValue]);
+    // Focus search input when opened
+    // Focus search input when opened
+    useEffect(() => {
+        if (isOpen && searchInputRef.current) {
+            // Delay focus slightly to allow animation to start smoothly
+            // This prevents layout thrashing during the initial composite frame
+            const timer = setTimeout(() => {
+                var _a;
+                (_a = searchInputRef.current) === null || _a === void 0 ? void 0 : _a.focus();
+            }, 50);
+            return () => clearTimeout(timer);
+        }
+    }, [isOpen]);
+    // Reset search when closed
+    useEffect(() => {
+        if (!isOpen) {
+            setSearchValue("");
+            setHighlightedIndex(0);
+        }
+    }, [isOpen]);
+    // Handle search change
+    const handleSearchChange = (e) => {
+        const value = e.target.value;
+        setSearchValue(value);
+        onSearchChange === null || onSearchChange === void 0 ? void 0 : onSearchChange(value);
+    };
+    // Handle command selection
+    const handleSelectCommand = (command) => {
+        if (command.disabled)
+            return;
+        command.onSelect();
+        onClose();
+    };
+    // Handle keyboard navigation (Arrow keys and Enter)
+    // Note: Escape key is handled by Overlay component
+    useEffect(() => {
+        if (!isOpen)
+            return;
+        const handleKeyDown = (event) => {
+            // Arrow keys navigation
+            if (event.key === "ArrowDown") {
+                event.preventDefault();
+                setHighlightedIndex((prev) => prev >= flatFilteredCommands.length - 1 ? 0 : prev + 1);
+            }
+            else if (event.key === "ArrowUp") {
+                event.preventDefault();
+                setHighlightedIndex((prev) => prev <= 0 ? flatFilteredCommands.length - 1 : prev - 1);
+            }
+            else if (event.key === "Enter") {
+                event.preventDefault();
+                const highlightedCommand = flatFilteredCommands[highlightedIndex];
+                if (highlightedCommand) {
+                    handleSelectCommand(highlightedCommand);
+                }
+            }
+        };
+        document.addEventListener("keydown", handleKeyDown);
+        return () => {
+            document.removeEventListener("keydown", handleKeyDown);
+        };
+    }, [isOpen, highlightedIndex, flatFilteredCommands]);
+    // Scroll highlighted command into view
+    useEffect(() => {
+        if (listContainerRef.current) {
+            const highlightedElement = listContainerRef.current.querySelector(`[data-command-index="${highlightedIndex}"]`);
+            if (highlightedElement) {
+                highlightedElement.scrollIntoView({
+                    block: "nearest",
+                    behavior: "smooth",
+                });
+            }
+        }
+    }, [highlightedIndex]);
+    // Render commands list
+    const renderCommandsList = () => {
+        if (flatFilteredCommands.length === 0) {
+            return React__default.createElement("div", { className: theme.emptyState }, emptyMessage);
+        }
+        // If grouped, render with group labels
+        if (isGroupedCommands(displayCommands)) {
+            let commandIndex = 0;
+            return displayCommands.map((group) => (React__default.createElement("div", { key: group.id, className: "py-2" },
+                React__default.createElement("div", { className: theme.groupLabel }, group.label),
+                group.commands.map((command) => {
+                    const element = (React__default.createElement(CommandItem, { key: command.id, command: command, index: commandIndex, isHighlighted: commandIndex === highlightedIndex, onSelect: handleSelectCommand, onMouseEnter: setHighlightedIndex, theme: theme }));
+                    commandIndex++;
+                    return element;
+                }))));
+        }
+        // Otherwise render flat list
+        return displayCommands.map((command, index) => (React__default.createElement(CommandItem, { key: command.id, command: command, index: index, isHighlighted: index === highlightedIndex, onSelect: handleSelectCommand, onMouseEnter: setHighlightedIndex, theme: theme })));
+    };
+    return (React__default.createElement(Overlay, { isOpen: isOpen, onClose: onClose, closeOnOverlayClick: closeOnOverlayClick, closeOnEsc: closeOnEsc, position: "top", overlayClassName: overlayClassName, contentClassName: cn(theme.container, className), animations: {
+            overlay: overlayAnimations,
+            content: containerAnimations,
+        } },
+        React__default.createElement("div", { className: theme.searchWrapper },
+            React__default.createElement("div", { className: "flex items-center gap-3" },
+                React__default.createElement(MagnifyingGlassIcon, { className: "w-5 h-5 text-[var(--color-text-muted)]", strokeWidth: 2 }),
+                React__default.createElement("input", { ref: searchInputRef, type: "text", className: theme.searchInput, placeholder: placeholder, value: searchValue, onChange: handleSearchChange, autoComplete: "off", autoCorrect: "off", spellCheck: false }))),
+        React__default.createElement("div", { ref: listContainerRef, className: "overflow-y-auto overscroll-contain px-1", style: {
+                maxHeight: typeof maxHeight === "number" ? `${maxHeight}px` : maxHeight,
+            } }, renderCommandsList())));
+};
+
+export { CommandPalette };

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

@@ -0,0 +1,2 @@
+import type { CommandPaletteThemeOverrides } from "./CommandPalette.types";
+export declare const commandPaletteTheme: Required<CommandPaletteThemeOverrides>;

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

@@ -0,0 +1,30 @@
+const commandPaletteTheme = {
+    overlay: "fixed inset-0 bg-[var(--overlay-bg)] backdrop-blur-[var(--overlay-blur)] z-50 " +
+        "flex items-start justify-center pt-[10vh] px-4",
+    container: "relative w-full max-h-[calc(100vh-2rem)] w-full max-w-lg " +
+        "bg-[var(--color-background)] rounded-[var(--modal-rounded)] shadow-2xl shadow-black/30 " +
+        "border border-[var(--color-border)] ring-4 ring-[var(--color-background)]/20 " +
+        "flex flex-col my-4 min-h-0 overflow-hidden " +
+        // Dark mode
+        "dark:ring-black/30",
+    searchWrapper: "border-b border-[var(--color-border)] px-4 py-3 " + "",
+    searchInput: "w-full px-0 py-0 text-sm bg-transparent border-none outline-none " +
+        "text-[var(--color-text-primary)] placeholder:text-[var(--color-text-placeholder)] " +
+        "focus:outline-none focus:ring-0 " +
+        // Dark mode
+        "dark:text-[var(--color-neutral-200)] dark:placeholder:text-[var(--color-neutral-500)]",
+    groupLabel: "px-4 py-1 text-xs font-semibold text-[var(--color-text-muted)]/50 uppercase " +
+        "dark:text-[var(--color-neutral-500)]",
+    commandItem: "flex items-center gap-3 px-4 py-2 rounded-lg cursor-pointer transition-colors " +
+        "hover:bg-[var(--color-primary)] " +
+        "data-[highlighted=true]:bg-[var(--color-primary)] data-[highlighted=true]:hover:bg-[var(--color-primary)] " +
+        "data-[highlighted=true]:text-white " +
+        "data-[disabled=true]:opacity-50 data-[disabled=true]:cursor-not-allowed data-[disabled=true]:hover:bg-transparent " +
+        // Dark mode - adjust hover state
+        "dark:text-[var(--color-neutral-200)] dark:hover:bg-[var(--color-primary-600)] " +
+        "dark:data-[highlighted=true]:bg-[var(--color-primary-600)]",
+    emptyState: "px-4 py-12 text-center text-sm text-[var(--color-text-muted)] " +
+        "dark:text-[var(--color-neutral-500)]",
+};
+
+export { commandPaletteTheme };

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

@@ -0,0 +1,89 @@
+import React from 'react';
+/**
+ * Command item type
+ */
+export interface CommandItem {
+    /** Unique identifier for the command */
+    id: string;
+    /** Display label for the command */
+    label: string;
+    /** Description or subtitle for the command */
+    description?: string;
+    /** Content to display at the start (icon, avatar, etc.) */
+    contentStart?: React.ReactNode;
+    /** Content to display at the end (keyboard shortcuts, badges, etc.) */
+    contentEnd?: React.ReactNode;
+    /** Keyboard shortcut to display (convenience prop - renders as Kbd component in contentEnd) */
+    shortcut?: string | string[];
+    /** Category/group for the command */
+    group?: string;
+    /** Action to execute when command is selected */
+    onSelect: () => void;
+    /** Keywords for search matching */
+    keywords?: string[];
+    /** Whether the command is disabled */
+    disabled?: boolean;
+}
+/**
+ * Command group type
+ */
+export interface CommandGroup {
+    /** Unique identifier for the group */
+    id: string;
+    /** Display label for the group */
+    label: string;
+    /** Commands in this group */
+    commands: CommandItem[];
+}
+/**
+ * CommandPalette component props
+ */
+export interface CommandPaletteProps {
+    /** Whether the command palette is open */
+    isOpen: boolean;
+    /** Called when the palette should close */
+    onClose: () => void;
+    /** Array of commands or command groups */
+    commands: CommandItem[] | CommandGroup[];
+    /** Placeholder text for search input */
+    placeholder?: string;
+    /** Custom empty state message */
+    emptyMessage?: string;
+    /** Maximum height of the command list */
+    maxHeight?: string | number;
+    /** Additional class name for the container */
+    className?: string;
+    /** Additional class name for the overlay */
+    overlayClassName?: string;
+    /** Component-level theme overrides */
+    theme?: CommandPaletteThemeOverrides;
+    /** Whether to group commands by category */
+    grouped?: boolean;
+    /** Called when search value changes */
+    onSearchChange?: (value: string) => void;
+    /** Custom filter function */
+    filterFunction?: (command: CommandItem, searchValue: string) => boolean;
+    /** Whether clicking the overlay should close the palette (default: true) */
+    closeOnOverlayClick?: boolean;
+    /** Whether pressing Escape should close the palette (default: true) */
+    closeOnEsc?: boolean;
+}
+/**
+ * Theme overrides for the CommandPalette component
+ */
+export interface CommandPaletteThemeOverrides {
+    /** Style for the overlay backdrop */
+    overlay?: string;
+    /** Style for the modal container */
+    container?: string;
+    /** Style for the search input wrapper */
+    searchWrapper?: string;
+    /** Style for the search input */
+    searchInput?: string;
+    /** Style for group labels */
+    groupLabel?: string;
+    /** Style for command items (uses data-[highlighted] and data-[disabled] selectors) */
+    commandItem?: string;
+    /** Style for empty state */
+    emptyState?: string;
+}

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

@@ -0,0 +1,3 @@
+export { CommandPalette } from './CommandPalette';
+export type { CommandPaletteProps, CommandItem, CommandGroup, CommandPaletteThemeOverrides, } from './CommandPalette.types';
+export { commandPaletteTheme } from './CommandPalette.theme';

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

@@ -0,0 +1,15 @@
+import React from "react";
+import { ContextMenuProps } from "./ContextMenu.types";
+export declare const ContextMenu: {
+    ({ children, className, onOpenChange, theme: themeOverrides, ...props }: ContextMenuProps): React.JSX.Element;
+    displayName: string;
+} & {
+    Trigger: React.ForwardRefExoticComponent<import("./ContextMenu.types").ContextMenuTriggerProps & React.RefAttributes<HTMLElement>>;
+    Content: React.ForwardRefExoticComponent<import("./ContextMenu.types").ContextMenuContentProps & React.RefAttributes<HTMLDivElement>>;
+    Item: React.ForwardRefExoticComponent<import("./ContextMenu.types").ContextMenuItemProps & React.RefAttributes<HTMLDivElement>>;
+    Sub: React.FC<import("./ContextMenu.types").ContextMenuSubProps>;
+    SubTrigger: React.ForwardRefExoticComponent<import("./ContextMenu.types").ContextMenuSubTriggerProps & React.RefAttributes<HTMLDivElement>>;
+    SubContent: React.ForwardRefExoticComponent<import("./ContextMenu.types").ContextMenuSubContentProps & React.RefAttributes<HTMLDivElement>>;
+    Separator: React.ForwardRefExoticComponent<import("./ContextMenu.types").ContextMenuSeparatorProps & React.RefAttributes<HTMLDivElement>>;
+    Label: React.ForwardRefExoticComponent<import("./ContextMenu.types").ContextMenuLabelProps & React.RefAttributes<HTMLDivElement>>;
+};

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

@@ -0,0 +1,11 @@
+import { DropdownTheme } from "../Dropdown/Dropdown.theme";
+export interface ContextMenuTheme extends DropdownTheme {
+    contentStyle: string;
+    itemStyle: string;
+    itemCheckedStyle: string;
+    subTriggerStyle: string;
+    subContentStyle: string;
+    separatorStyle: string;
+    labelStyle: string;
+}
+export declare const contextMenuTheme: ContextMenuTheme;

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

@@ -0,0 +1,86 @@
+import React, { ReactNode } from "react";
+import { ContextMenuTheme } from "./ContextMenu.theme";
+export interface ContextMenuContextValue {
+    isOpen: boolean;
+    onOpenChange: (isOpen: boolean) => void;
+    cursorPosition: {
+        x: number;
+        y: number;
+    } | null;
+    contentRef: React.RefObject<HTMLDivElement | null>;
+    triggerRef: React.RefObject<HTMLElement | null>;
+    theme: ContextMenuTheme;
+}
+export interface SubMenuContextValue {
+    isOpen: boolean;
+    onOpenChange: (isOpen: boolean) => void;
+    triggerRef: React.RefObject<HTMLDivElement | null>;
+}
+export interface ContextMenuProps extends React.HTMLAttributes<HTMLDivElement> {
+    children: ReactNode;
+    onOpenChange?: (isOpen: boolean) => void;
+    theme?: Partial<ContextMenuTheme>;
+}
+export interface ContextMenuTriggerProps {
+    children: React.ReactElement;
+    className?: string;
+    disabled?: boolean;
+}
+export interface ContextMenuContentProps extends React.HTMLAttributes<HTMLDivElement> {
+    children: ReactNode;
+    className?: string;
+    animation?: boolean;
+    "aria-label"?: string;
+}
+export interface ContextMenuItemProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "onSelect"> {
+    children: ReactNode;
+    className?: string;
+    checked?: boolean;
+    disabled?: boolean;
+    isDanger?: boolean;
+    shortcut?: ReactNode;
+    onSelect?: () => void;
+    startContent?: ReactNode;
+    endContent?: ReactNode;
+    description?: string;
+}
+export interface ContextMenuSubProps {
+    children: ReactNode;
+    className?: string;
+}
+export interface ContextMenuSubTriggerProps extends React.HTMLAttributes<HTMLDivElement> {
+    children: ReactNode;
+    className?: string;
+    disabled?: boolean;
+}
+export interface ContextMenuSubContentProps extends React.HTMLAttributes<HTMLDivElement> {
+    children: ReactNode;
+    className?: string;
+    animation?: boolean;
+}
+export interface ContextMenuSeparatorProps extends React.HTMLAttributes<HTMLDivElement> {
+    className?: string;
+}
+export interface ContextMenuLabelProps extends React.HTMLAttributes<HTMLDivElement> {
+    children: ReactNode;
+    className?: string;
+}
+/**
+ * Theme overrides for the ContextMenu component
+ */
+export interface ContextMenuThemeOverrides {
+    /** Content container style */
+    contentStyle?: string;
+    /** Item base style */
+    itemStyle?: string;
+    /** Checked item style (for tick icon positioning) */
+    itemCheckedStyle?: string;
+    /** Sub trigger style */
+    subTriggerStyle?: string;
+    /** Sub content style */
+    subContentStyle?: string;
+    /** Separator style */
+    separatorStyle?: string;
+    /** Label style */
+    labelStyle?: string;
+}

package/dist/components/core/ContextMenu/ContextMenuContent.d.ts

@@ -0,0 +1,6 @@
+import React from "react";
+import { ContextMenuContentProps } from "./ContextMenu.types";
+/**
+ * ContextMenuContent - Renders the menu at cursor position with keyboard navigation
+ */
+export declare const ContextMenuContent: React.ForwardRefExoticComponent<ContextMenuContentProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components/core/ContextMenu/ContextMenuContext.d.ts

@@ -0,0 +1,5 @@
+import { ContextMenuContextValue, SubMenuContextValue } from "./ContextMenu.types";
+export declare const ContextMenuContext: import("react").Context<ContextMenuContextValue | null>;
+export declare const useContextMenuContext: () => ContextMenuContextValue;
+export declare const SubMenuContext: import("react").Context<SubMenuContextValue | null>;
+export declare const useSubMenuContext: () => SubMenuContextValue;

package/dist/components/core/ContextMenu/ContextMenuItem.d.ts

@@ -0,0 +1,7 @@
+import React from "react";
+import { ContextMenuItemProps } from "./ContextMenu.types";
+/**
+ * ContextMenuItem - Individual menu item with optional check indicator
+ * Refactored to match DropdownItem API pattern
+ */
+export declare const ContextMenuItem: React.ForwardRefExoticComponent<ContextMenuItemProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components/core/ContextMenu/ContextMenuLabel.d.ts

@@ -0,0 +1,6 @@
+import React from "react";
+import { ContextMenuLabelProps } from "./ContextMenu.types";
+/**
+ * ContextMenuLabel - Non-interactive section header
+ */
+export declare const ContextMenuLabel: React.ForwardRefExoticComponent<ContextMenuLabelProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components/core/ContextMenu/ContextMenuSeparator.d.ts

@@ -0,0 +1,6 @@
+import React from "react";
+import { ContextMenuSeparatorProps } from "./ContextMenu.types";
+/**
+ * ContextMenuSeparator - Visual divider between menu items
+ */
+export declare const ContextMenuSeparator: React.ForwardRefExoticComponent<ContextMenuSeparatorProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components/core/ContextMenu/ContextMenuSub.d.ts

@@ -0,0 +1,6 @@
+import React from "react";
+import { ContextMenuSubProps } from "./ContextMenu.types";
+/**
+ * ContextMenuSub - Wrapper for nested submenu with hover logic
+ */
+export declare const ContextMenuSub: React.FC<ContextMenuSubProps>;

package/dist/components/core/ContextMenu/ContextMenuSubContent.d.ts

@@ -0,0 +1,6 @@
+import React from "react";
+import { ContextMenuSubContentProps } from "./ContextMenu.types";
+/**
+ * ContextMenuSubContent - Submenu content positioned to the right of trigger
+ */
+export declare const ContextMenuSubContent: React.ForwardRefExoticComponent<ContextMenuSubContentProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components/core/ContextMenu/ContextMenuSubTrigger.d.ts

@@ -0,0 +1,6 @@
+import React from "react";
+import { ContextMenuSubTriggerProps } from "./ContextMenu.types";
+/**
+ * ContextMenuSubTrigger - Trigger for nested submenu with chevron indicator
+ */
+export declare const ContextMenuSubTrigger: React.ForwardRefExoticComponent<ContextMenuSubTriggerProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components/core/ContextMenu/ContextMenuTrigger.d.ts

@@ -0,0 +1,6 @@
+import React from "react";
+import { ContextMenuTriggerProps } from "./ContextMenu.types";
+/**
+ * ContextMenuTrigger - Area that triggers the context menu on right-click
+ */
+export declare const ContextMenuTrigger: React.ForwardRefExoticComponent<ContextMenuTriggerProps & React.RefAttributes<HTMLElement>>;

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

@@ -0,0 +1,4 @@
+export { ContextMenu } from "./ContextMenu";
+export type { ContextMenuProps, ContextMenuTriggerProps, ContextMenuContentProps, ContextMenuItemProps, ContextMenuSubProps, ContextMenuSubTriggerProps, ContextMenuSubContentProps, ContextMenuSeparatorProps, ContextMenuLabelProps, ContextMenuThemeOverrides, } from "./ContextMenu.types";
+export type { ContextMenuTheme } from "./ContextMenu.theme";
+export { contextMenuTheme } from "./ContextMenu.theme";

package/dist/components/core/Divider/Divider.js

@@ -1,20 +1,28 @@
-import { __rest, __assign } from '../../../node_modules/tslib/tslib.es6.js';
 import React__default from 'react';
 import { cn } from '../../../utils/cn.js';
 import { dividerTheme } from './Divider.theme.js';
 
-var Divider = React__default.forwardRef(function (_a, ref) {
-    var _b, _c;
-    var _d = _a.vertical, vertical = _d === void 0 ? false : _d, _e = _a.margin, margin = _e === void 0 ? 'md' : _e, className = _a.className, _f = _a.theme, customTheme = _f === void 0 ? {} : _f, props = __rest(_a, ["vertical", "margin", "className", "theme"]);
-    var theme = __assign(__assign(__assign({}, dividerTheme), customTheme), { margins: {
-            horizontal: __assign(__assign({}, dividerTheme.margins.horizontal), (_b = customTheme.margins) === null || _b === void 0 ? void 0 : _b.horizontal),
-            vertical: __assign(__assign({}, dividerTheme.margins.vertical), (_c = customTheme.margins) === null || _c === void 0 ? void 0 : _c.vertical),
-        } });
-    var marginStyle = vertical
+const Divider = React__default.forwardRef(({ vertical = false, margin = 'md', className, theme: customTheme = {}, ...props }, ref) => {
+    var _a, _b;
+    const theme = {
+        ...dividerTheme,
+        ...customTheme,
+        margins: {
+            horizontal: {
+                ...dividerTheme.margins.horizontal,
+                ...(_a = customTheme.margins) === null || _a === void 0 ? void 0 : _a.horizontal,
+            },
+            vertical: {
+                ...dividerTheme.margins.vertical,
+                ...(_b = customTheme.margins) === null || _b === void 0 ? void 0 : _b.vertical,
+            },
+        },
+    };
+    const marginStyle = vertical
         ? theme.margins.vertical[margin] || ''
         : theme.margins.horizontal[margin] || '';
-    var orientationStyle = vertical ? theme.vertical : theme.horizontal;
-    return (React__default.createElement("div", __assign({ ref: ref, className: cn(theme.baseStyle, orientationStyle, marginStyle, className), role: "separator", "aria-orientation": vertical ? 'vertical' : 'horizontal' }, props)));
+    const orientationStyle = vertical ? theme.vertical : theme.horizontal;
+    return (React__default.createElement("div", { ref: ref, className: cn(theme.baseStyle, orientationStyle, marginStyle, className), role: "separator", "aria-orientation": vertical ? 'vertical' : 'horizontal', ...props }));
 });
 Divider.displayName = 'Divider';
 

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

@@ -1,4 +1,4 @@
-var dividerTheme = {
+const dividerTheme = {
     baseStyle: 'bg-[var(--color-border)] border-0',
     horizontal: 'w-full h-px',
     vertical: 'h-full w-px',

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

@@ -0,0 +1,9 @@
+import React from 'react';
+import { AnimatePresence } from 'motion/react';
+import { DraggableProps, DroppableProps } from './DragDrop.types';
+export { AnimatePresence };
+export declare const DragDropProvider: React.FC<{
+    children: React.ReactNode;
+}>;
+export declare const Draggable: React.ForwardRefExoticComponent<DraggableProps & React.RefAttributes<HTMLDivElement>>;
+export declare const Droppable: React.ForwardRefExoticComponent<DroppableProps & React.RefAttributes<HTMLDivElement>>;