@moduix/react-tailwind 1.0.0

package/dist/components/select/Select.js

@@ -0,0 +1,239 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { ark } from "@ark-ui/react/factory";
+import { Select, useSelect, useSelectContext, useSelectItemContext } from "@ark-ui/react/select";
+import { forwardRef } from "react";
+import { cn } from "../../internal/cn.js";
+import { CheckIcon, ChevronUpDownIcon } from "../../internal/icons/ui/index.js";
+import { OverlayPortal, OverlayPortalProvider } from "../../internal/overlayPortal.js";
+import { CloseButton } from "../close-button/index.js";
+const Select_SelectRoot = /*#__PURE__*/ forwardRef(function({ asChild, children, className, lazyMount = true, portalled, portalRef, unmountOnExit = true, ...props }, ref) {
+    return /*#__PURE__*/ jsx(OverlayPortalProvider, {
+        portalled: portalled,
+        portalRef: portalRef,
+        children: /*#__PURE__*/ jsx(Select.Root, {
+            ref: ref,
+            "data-slot": "select-root",
+            className: cn('flex w-56 max-w-full min-w-0 flex-col gap-1.5 text-foreground', className),
+            asChild: asChild,
+            lazyMount: lazyMount,
+            unmountOnExit: unmountOnExit,
+            ...props,
+            children: children
+        })
+    });
+});
+const Select_SelectRootProvider = /*#__PURE__*/ forwardRef(function({ asChild, children, className, lazyMount = true, portalled, portalRef, unmountOnExit = true, ...props }, ref) {
+    return /*#__PURE__*/ jsx(OverlayPortalProvider, {
+        portalled: portalled,
+        portalRef: portalRef,
+        children: /*#__PURE__*/ jsx(Select.RootProvider, {
+            ref: ref,
+            "data-slot": "select-root-provider",
+            className: cn('flex w-56 max-w-full min-w-0 flex-col gap-1.5 text-foreground', className),
+            asChild: asChild,
+            lazyMount: lazyMount,
+            unmountOnExit: unmountOnExit,
+            ...props,
+            children: children
+        })
+    });
+});
+const Select_SelectLabel = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
+    return /*#__PURE__*/ jsx(Select.Label, {
+        ref: ref,
+        "data-slot": "select-label",
+        className: cn('inline-flex items-center text-sm font-medium text-foreground select-none data-disabled:opacity-50', className),
+        ...props
+    });
+});
+const Select_SelectControl = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
+    return /*#__PURE__*/ jsx(Select.Control, {
+        ref: ref,
+        "data-slot": "select-control",
+        className: cn('group/select-control relative flex w-full min-w-0 items-center text-foreground data-disabled:opacity-50', className),
+        ...props
+    });
+});
+const Select_SelectTrigger = /*#__PURE__*/ forwardRef(function({ asChild, className, ...props }, ref) {
+    return /*#__PURE__*/ jsx(Select.Trigger, {
+        ref: ref,
+        "data-slot": "select-trigger",
+        asChild: asChild,
+        className: cn(!asChild && 'peer/select-trigger relative inline-flex h-control-md w-full min-w-0 cursor-pointer items-center justify-start rounded-md border border-border bg-background px-3.5 pe-[2.875rem] text-start text-inherit outline-1 -outline-offset-1 outline-transparent transition-[background-color,border-color,outline-color] duration-200 ease-in-out select-none [font:inherit] group-has-[>[data-slot=select-clear-trigger]:not([hidden])]/select-control:pe-[4.25rem] group-data-invalid/select-control:border-destructive group-data-invalid/select-control:outline-destructive focus-visible:border-ring focus-visible:outline-ring disabled:cursor-default data-disabled:cursor-default data-placeholder-shown:text-muted-foreground data-[state=open]:border-ring data-[state=open]:outline-ring motion-reduce:transition-none', className),
+        ...props
+    });
+});
+const Select_SelectValueText = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
+    return /*#__PURE__*/ jsx(Select.ValueText, {
+        ref: ref,
+        "data-slot": "select-value-text",
+        className: cn('min-w-0 flex-1 overflow-hidden text-ellipsis whitespace-nowrap', className),
+        ...props
+    });
+});
+const Select_SelectClearTrigger = /*#__PURE__*/ forwardRef(function({ asChild, className, children, 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy, ...props }, ref) {
+    return /*#__PURE__*/ jsx(Select.ClearTrigger, {
+        ref: ref,
+        asChild: true,
+        "data-slot": "select-clear-trigger",
+        className: cn('pointer-events-auto absolute inset-y-0 end-[2.125rem] my-auto size-control-xs transition-[background-color,color,opacity] duration-200 ease-in-out focus-visible:outline-1 focus-visible:outline-offset-1 motion-reduce:transition-none [&>svg]:size-4', className),
+        "aria-label": asChild ? ariaLabel : void 0,
+        "aria-labelledby": asChild ? ariaLabelledBy : void 0,
+        ...props,
+        children: asChild ? children : /*#__PURE__*/ jsx(CloseButton.Root, {
+            "aria-label": ariaLabel ?? (null == ariaLabelledBy ? 'Clear selection' : void 0),
+            "aria-labelledby": ariaLabelledBy,
+            children: children
+        })
+    });
+});
+const Select_SelectIndicator = /*#__PURE__*/ forwardRef(function({ className, children, ...props }, ref) {
+    return /*#__PURE__*/ jsx(Select.Indicator, {
+        ref: ref,
+        "data-slot": "select-indicator",
+        className: cn('pointer-events-none inline-flex size-control-xs shrink-0 items-center justify-center rounded-sm bg-transparent leading-none text-muted-foreground transition-[background-color,color,opacity] duration-200 ease-in-out peer-[:not([disabled]):not([data-disabled]):hover]/select-trigger:bg-muted peer-[:not([disabled]):not([data-disabled]):hover]/select-trigger:text-foreground motion-reduce:transition-none [&>svg]:block [&>svg]:size-4', className),
+        ...props,
+        children: children ?? /*#__PURE__*/ jsx(ChevronUpDownIcon, {})
+    });
+});
+const Select_SelectField = /*#__PURE__*/ forwardRef(function({ clearLabel, indicator, placeholder, ...props }, ref) {
+    return /*#__PURE__*/ jsxs(Select_SelectControl, {
+        ref: ref,
+        ...props,
+        children: [
+            /*#__PURE__*/ jsx(Select_SelectTrigger, {
+                children: /*#__PURE__*/ jsx(Select_SelectValueText, {
+                    placeholder: placeholder
+                })
+            }),
+            clearLabel && /*#__PURE__*/ jsx(Select_SelectClearTrigger, {
+                "aria-label": clearLabel
+            }),
+            /*#__PURE__*/ jsx(Select_SelectIndicator, {
+                className: "absolute end-2 top-1/2 -translate-y-1/2",
+                children: indicator
+            })
+        ]
+    });
+});
+const Select_SelectPositioner = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
+    return /*#__PURE__*/ jsx(OverlayPortal, {
+        children: /*#__PURE__*/ jsx(Select.Positioner, {
+            ref: ref,
+            "data-slot": "select-positioner",
+            className: cn('z-[var(--z-index)] outline-0', className),
+            ...props
+        })
+    });
+});
+const Select_SelectContent = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
+    return /*#__PURE__*/ jsx(Select.Content, {
+        ref: ref,
+        "data-slot": "select-content",
+        className: cn('z-[calc(60+var(--layer-index,0))] flex max-h-[min(24rem,var(--available-height))] max-w-[var(--available-width)] min-w-[var(--reference-width)] origin-[var(--transform-origin)] scroll-py-1 flex-col overflow-auto overscroll-contain rounded-md border border-border bg-popover py-1 text-popover-foreground shadow-lg outline-0 data-[state=closed]:pointer-events-none data-[state=closed]:animate-moduix-menu-closed data-[state=open]:animate-moduix-menu-open motion-reduce:animate-none', className),
+        ...props
+    });
+});
+const Select_SelectList = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
+    return /*#__PURE__*/ jsx(Select.List, {
+        ref: ref,
+        "data-slot": "select-list",
+        className: cn('flex min-h-0 scroll-py-1 flex-col overflow-y-auto overscroll-contain outline-0', className),
+        ...props
+    });
+});
+const Select_SelectItemGroup = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
+    return /*#__PURE__*/ jsx(Select.ItemGroup, {
+        ref: ref,
+        "data-slot": "select-item-group",
+        className: cn('flex flex-col [&+&]:mt-2', className),
+        ...props
+    });
+});
+const Select_SelectItemGroupLabel = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
+    return /*#__PURE__*/ jsx(Select.ItemGroupLabel, {
+        ref: ref,
+        "data-slot": "select-item-group-label",
+        className: cn('px-2.5 py-1 text-xs font-normal text-muted-foreground', className),
+        ...props
+    });
+});
+const Select_SelectItem = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
+    return /*#__PURE__*/ jsx(Select.Item, {
+        ref: ref,
+        "data-slot": "select-item",
+        className: cn('relative mx-1 flex min-h-control-sm w-[calc(100%-0.5rem)] cursor-default items-center justify-between gap-2 rounded-sm bg-transparent px-3 py-1 text-sm text-popover-foreground outline-0 select-none data-disabled:pointer-events-none data-disabled:text-muted-foreground data-disabled:opacity-50 data-highlighted:bg-accent data-highlighted:text-accent-foreground', className),
+        ...props
+    });
+});
+const Select_SelectItemText = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
+    return /*#__PURE__*/ jsx(Select.ItemText, {
+        ref: ref,
+        "data-slot": "select-item-text",
+        className: cn('min-w-0 flex-1 overflow-hidden text-ellipsis whitespace-nowrap', className),
+        ...props
+    });
+});
+const Select_SelectItemIndicator = /*#__PURE__*/ forwardRef(function({ className, children, ...props }, ref) {
+    return /*#__PURE__*/ jsx(Select.ItemIndicator, {
+        ref: ref,
+        "data-slot": "select-item-indicator",
+        className: cn('inline-flex size-3.5 shrink-0 items-center justify-center [&>svg]:size-3', className),
+        ...props,
+        children: children ?? /*#__PURE__*/ jsx(CheckIcon, {})
+    });
+});
+const Select_SelectItemTextContent = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
+    return /*#__PURE__*/ jsx(ark.span, {
+        ref: ref,
+        "data-slot": "select-item-text-content",
+        className: cn('inline-flex max-w-full min-w-0 items-center gap-2 align-top', className),
+        ...props
+    });
+});
+const Select_SelectItemTextIcon = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
+    return /*#__PURE__*/ jsx(ark.span, {
+        ref: ref,
+        "data-slot": "select-item-text-icon",
+        className: cn('inline-flex size-4 shrink-0 items-center justify-center', className),
+        ...props
+    });
+});
+const Select_SelectItemTextLabel = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
+    return /*#__PURE__*/ jsx(ark.span, {
+        ref: ref,
+        "data-slot": "select-item-text-label",
+        className: cn('min-w-0 overflow-hidden text-ellipsis whitespace-nowrap', className),
+        ...props
+    });
+});
+const Select_Select = Object.assign(Select_SelectRoot, {
+    Root: Select_SelectRoot,
+    RootProvider: Select_SelectRootProvider,
+    Context: Select.Context,
+    HiddenSelect: Select.HiddenSelect,
+    ItemContext: Select.ItemContext,
+    useSelect: useSelect,
+    useSelectContext: useSelectContext,
+    useSelectItemContext: useSelectItemContext,
+    Label: Select_SelectLabel,
+    Control: Select_SelectControl,
+    Field: Select_SelectField,
+    Trigger: Select_SelectTrigger,
+    ValueText: Select_SelectValueText,
+    ClearTrigger: Select_SelectClearTrigger,
+    Indicator: Select_SelectIndicator,
+    Positioner: Select_SelectPositioner,
+    Content: Select_SelectContent,
+    List: Select_SelectList,
+    ItemGroup: Select_SelectItemGroup,
+    ItemGroupLabel: Select_SelectItemGroupLabel,
+    Item: Select_SelectItem,
+    ItemText: Select_SelectItemText,
+    ItemIndicator: Select_SelectItemIndicator,
+    ItemTextContent: Select_SelectItemTextContent,
+    ItemTextIcon: Select_SelectItemTextIcon,
+    ItemTextLabel: Select_SelectItemTextLabel
+});
+export { Select_Select as Select, useSelect, useSelectContext, useSelectItemContext };

package/dist/components/select/index.d.ts

@@ -0,0 +1 @@
+export * from './Select.js';

package/dist/components/select/index.js

@@ -0,0 +1 @@
+export * from "./Select.js";

package/dist/components/separator/Separator.d.ts

@@ -0,0 +1,12 @@
+declare const Separator: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & import("@ark-ui/react/factory").PolymorphicProps & {
+    orientation?: 'horizontal' | 'vertical';
+    size?: 'xs' | 'sm' | 'md' | 'lg';
+    variant?: 'solid' | 'dashed' | 'dotted';
+} & import("react").RefAttributes<HTMLSpanElement>> & {
+    Root: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & import("@ark-ui/react/factory").PolymorphicProps & {
+        orientation?: 'horizontal' | 'vertical';
+        size?: 'xs' | 'sm' | 'md' | 'lg';
+        variant?: 'solid' | 'dashed' | 'dotted';
+    } & import("react").RefAttributes<HTMLSpanElement>>;
+};
+export { Separator };

package/dist/components/separator/Separator.js

@@ -0,0 +1,96 @@
+import { jsx } from "react/jsx-runtime";
+import { ark } from "@ark-ui/react/factory";
+import { cva } from "class-variance-authority";
+import { forwardRef } from "react";
+import { cn } from "../../internal/cn.js";
+const separatorVariants = cva('block shrink-0 border-border', {
+    variants: {
+        orientation: {
+            horizontal: 'h-0 w-full',
+            vertical: 'h-[1em] w-0'
+        },
+        size: {
+            xs: '',
+            sm: '',
+            md: '',
+            lg: ''
+        },
+        variant: {
+            solid: 'border-solid',
+            dashed: 'border-dashed',
+            dotted: 'border-dotted'
+        }
+    },
+    compoundVariants: [
+        {
+            orientation: 'horizontal',
+            size: 'xs',
+            class: 'border-t-[0.5px]'
+        },
+        {
+            orientation: 'horizontal',
+            size: 'sm',
+            class: 'border-t'
+        },
+        {
+            orientation: 'horizontal',
+            size: 'md',
+            class: 'border-t-2'
+        },
+        {
+            orientation: 'horizontal',
+            size: 'lg',
+            class: 'border-t-[3px]'
+        },
+        {
+            orientation: 'vertical',
+            size: 'xs',
+            class: 'border-s-[0.5px]'
+        },
+        {
+            orientation: 'vertical',
+            size: 'sm',
+            class: 'border-s'
+        },
+        {
+            orientation: 'vertical',
+            size: 'md',
+            class: 'border-s-2'
+        },
+        {
+            orientation: 'vertical',
+            size: 'lg',
+            class: 'border-s-[3px]'
+        }
+    ],
+    defaultVariants: {
+        orientation: 'horizontal',
+        size: 'sm',
+        variant: 'solid'
+    }
+});
+const Separator_SeparatorRoot = /*#__PURE__*/ forwardRef(function({ asChild, className, orientation = 'horizontal', role, size = 'sm', variant = 'solid', 'aria-orientation': _ariaOrientation, ...props }, ref) {
+    const resolvedRole = role ?? 'separator';
+    return /*#__PURE__*/ jsx(ark.span, {
+        ...props,
+        ref: ref,
+        asChild: asChild,
+        role: resolvedRole,
+        "aria-orientation": 'separator' === resolvedRole ? orientation : void 0,
+        "data-scope": "separator",
+        "data-part": "root",
+        "data-slot": "separator-root",
+        "data-orientation": orientation,
+        "data-size": size,
+        "data-variant": variant,
+        className: cn(separatorVariants({
+            orientation,
+            size,
+            variant
+        }), className)
+    });
+});
+const Separator = Object.assign(Separator_SeparatorRoot, {
+    Root: Separator_SeparatorRoot
+});
+export { Separator };

package/dist/components/separator/index.d.ts

@@ -0,0 +1 @@
+export { Separator } from './Separator.js';

package/dist/components/separator/index.js

@@ -0,0 +1 @@
+export { Separator } from "./Separator.js";

package/dist/components/sidebar/Sidebar.d.ts

@@ -0,0 +1,61 @@
+import type { ComponentProps } from 'react';
+import { Splitter } from '../splitter/index.js';
+import { Tooltip } from '../tooltip/index.js';
+type SidebarSide = 'left' | 'right';
+type SidebarRootProps = Omit<ComponentProps<typeof Splitter.Root>, 'orientation' | 'panels'> & {
+    panelId?: string;
+    side?: SidebarSide;
+};
+type SidebarPanelProps = Omit<ComponentProps<typeof Splitter.Panel>, 'id'>;
+type SidebarResizeTriggerProps = Omit<ComponentProps<typeof Splitter.ResizeTrigger>, 'id'>;
+declare function useSidebar(): {
+    collapsed: boolean;
+    side: SidebarSide;
+    state: string;
+    toggleSidebar: () => void;
+};
+declare const SidebarTooltip: ({ children, content, openDelay, closeDelay, positioning, ...props }: Omit<ComponentProps<typeof Tooltip>, 'children' | 'disabled' | 'positioning'> & {
+    children: ComponentProps<typeof Tooltip.Trigger>['children'];
+    content: ComponentProps<typeof Tooltip.Content>['children'];
+    positioning?: ComponentProps<typeof Tooltip>['positioning'];
+}) => import("react").JSX.Element;
+declare const Sidebar: import("react").ForwardRefExoticComponent<Omit<SidebarRootProps, "ref"> & import("react").RefAttributes<HTMLDivElement>> & {
+    Root: import("react").ForwardRefExoticComponent<Omit<SidebarRootProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    Panel: import("react").ForwardRefExoticComponent<Omit<SidebarPanelProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    Inset: import("react").ForwardRefExoticComponent<Omit<SidebarPanelProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    ResizeTrigger: import("react").ForwardRefExoticComponent<Omit<SidebarResizeTriggerProps, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
+    Trigger: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & import("@ark-ui/react/factory").PolymorphicProps & import("react").RefAttributes<HTMLButtonElement>>;
+    Label: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & import("@ark-ui/react/factory").PolymorphicProps & import("react").RefAttributes<HTMLSpanElement>>;
+    Input: import("react").ForwardRefExoticComponent<Omit<Omit<Omit<import("@ark-ui/react/field").FieldInputProps & import("react").RefAttributes<HTMLInputElement>, "size"> & {
+        size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+        htmlSize?: ComponentProps<'input'>['size'];
+    }, "ref"> & import("react").RefAttributes<HTMLInputElement>, "ref"> & import("react").RefAttributes<HTMLInputElement>>;
+    Header: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, "ref"> & import("@ark-ui/react/factory").PolymorphicProps & import("react").RefAttributes<HTMLElement>>;
+    Content: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("@ark-ui/react/factory").PolymorphicProps & import("react").RefAttributes<HTMLDivElement>>;
+    ExpandedContent: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("@ark-ui/react/factory").PolymorphicProps & import("react").RefAttributes<HTMLDivElement>>;
+    CollapsedContent: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("@ark-ui/react/factory").PolymorphicProps & import("react").RefAttributes<HTMLDivElement>>;
+    Footer: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, "ref"> & import("@ark-ui/react/factory").PolymorphicProps & import("react").RefAttributes<HTMLElement>>;
+    Separator: import("react").ForwardRefExoticComponent<Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & import("@ark-ui/react/factory").PolymorphicProps & {
+        orientation?: 'horizontal' | 'vertical';
+        size?: 'xs' | 'sm' | 'md' | 'lg';
+        variant?: 'solid' | 'dashed' | 'dotted';
+    } & import("react").RefAttributes<HTMLSpanElement>, "ref"> & import("react").RefAttributes<HTMLSpanElement>>;
+    Group: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, "ref"> & import("@ark-ui/react/factory").PolymorphicProps & import("react").RefAttributes<HTMLElement>>;
+    GroupHeader: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("@ark-ui/react/factory").PolymorphicProps & import("react").RefAttributes<HTMLDivElement>>;
+    GroupLabel: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, "ref"> & import("@ark-ui/react/factory").PolymorphicProps & import("react").RefAttributes<HTMLHeadingElement>>;
+    GroupAction: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & import("@ark-ui/react/factory").PolymorphicProps & import("react").RefAttributes<HTMLButtonElement>>;
+    NavigationList: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLUListElement>, HTMLUListElement>, "ref"> & import("@ark-ui/react/factory").PolymorphicProps & import("react").RefAttributes<HTMLUListElement>>;
+    NavigationItem: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, "ref"> & import("@ark-ui/react/factory").PolymorphicProps & import("react").RefAttributes<HTMLLIElement>>;
+    Tooltip: typeof SidebarTooltip;
+    NavigationButton: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & import("@ark-ui/react/factory").PolymorphicProps & {
+        active?: boolean;
+        size?: 'sm' | 'md' | 'lg';
+    } & import("react").RefAttributes<HTMLButtonElement>>;
+    NavigationBadge: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & import("@ark-ui/react/factory").PolymorphicProps & import("react").RefAttributes<HTMLSpanElement>>;
+    NavigationSubList: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLUListElement>, HTMLUListElement>, "ref"> & import("@ark-ui/react/factory").PolymorphicProps & import("react").RefAttributes<HTMLUListElement>>;
+    NavigationSubItem: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, "ref"> & import("@ark-ui/react/factory").PolymorphicProps & import("react").RefAttributes<HTMLLIElement>>;
+    NavigationSubButton: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, "ref"> & import("@ark-ui/react/factory").PolymorphicProps & {
+        active?: boolean;
+    } & import("react").RefAttributes<HTMLAnchorElement>>;
+};
+export { Sidebar, useSidebar };