DropdownMenuCheckboxItem

El componente, montado

Cargando el chunk del paquete instalado…

De dónde se importa

import { DropdownMenuCheckboxItem } from '@solu30/ui-kit/feedback'

Props

Ejemplo del paquete

<Popover open={isOpen} onOpenChange={setIsOpen}>
<PopoverContent anchorEl={buttonRef.current} side="bottom">
{content}
</PopoverContent>
</Popover>
/
anchorEl?: HTMLElement | null;
/** Disable CSS entry/exit animation (e.g. for snapshot tests) */
disableAnimation?: boolean;
/** Position side — alias for the root-level `position` prop when using anchorEl */
side?: PopoverPosition;
}
declare const PopoverContent: React__default.ForwardRefExoticComponent<PopoverContentProps & React__default.RefAttributes<HTMLDivElement>>;
/** Tooltip position relative to trigger */
type TooltipPosition = "top" | "right" | "bottom" | "left";
/** Props for the Tooltip component */
interface TooltipProps {
/** Content to display in the tooltip */
content: React__default.ReactNode;
/** Position relative to the trigger element */
position?: TooltipPosition;
/** Delay before showing tooltip (ms) */
delay?: number;
/** Additional CSS class for the tooltip bubble */
tooltipClassName?: string;
/** Additional CSS class for the wrapper */
className?: string;
/** Trigger element */
children: React__default.ReactElement;
}
declare const Tooltip: React__default.ForwardRefExoticComponent<TooltipProps & React__default.RefAttributes<HTMLDivElement>>;
declare function TooltipProvider({ children, delayDuration: _delayDuration, }: {
children: ReactNode;
/** Radix-compatible prop — accepted but handled via TooltipRoot's delay prop */
delayDuration?: number;
}): React__default.ReactElement;
interface TooltipRootProps {
children: ReactNode;
side?: "top" | "bottom" | "left" | "right";
sideOffset?: number;
delay?: number;
}
declare function TooltipRoot({ children, side, sideOffset, delay, }: TooltipRootProps): React__default.ReactElement;
interface TooltipTriggerProps extends ComponentProps<"span"> {
asChild?: boolean;
}
declare const TooltipTrigger: React__default.ForwardRefExoticComponent<Omit<TooltipTriggerProps, "ref"> & React__default.RefAttributes<HTMLSpanElement>>;
interface TooltipContentProps extends ComponentProps<"div"> {
side?: "top" | "bottom" | "left" | "right";
sideOffset?: number;
}
declare const TooltipContent: React__default.ForwardRefExoticComponent<Omit<TooltipContentProps, "ref"> & React__default.RefAttributes<HTMLDivElement>>;
type InfoTooltipProps = {
content: React__default.ReactNode;
position?: "top" | "bottom" | "left" | "right";
className?: string;
};
declare const InfoTooltip: React__default.FC<InfoTooltipProps>;
interface DropdownMenuProps {
open?: boolean;
onOpenChange?: (open: boolean) => void;
/** Pass modal={false} when nested inside a Sheet/Dialog to avoid double scroll-lock. */
modal?: boolean;
children: ReactNode;
}
declare function DropdownMenu({ open, onOpenChange, modal, children, }: DropdownMenuProps): react_jsx_runtime.JSX.Element;
interface DropdownMenuTriggerProps {
asChild?: boolean;
children: ReactNode;
className?: string;
}
declare function DropdownMenuTrigger({ asChild, children, className, }: DropdownMenuTriggerProps): react_jsx_runtime.JSX.Element;
interface DropdownMenuContentProps {
children: ReactNode;
className?: string;
align?: "start" | "end";
}
declare function DropdownMenuContent({ children, className, align, }: DropdownMenuContentProps): react_jsx_runtime.JSX.Element;
interface DropdownMenuItemProps {
children: ReactNode;
/** Called when the item is selected. Mapped to Radix onSelect internally. */
onClick?: () => void;
className?: string;
disabled?: boolean;
}
declare function DropdownMenuItem({ children, onClick, className, disabled, }: DropdownMenuItemProps): react_jsx_runtime.JSX.Element;
interface DropdownMenuSeparatorProps {
className?: string;
}
declare function DropdownMenuSeparator({ className }: DropdownMenuSeparatorProps): react_jsx_runtime.JSX.Element;
interface DropdownMenuLabelProps {
children: ReactNode;
className?: string;
}
declare function DropdownMenuLabel({ children, className }: DropdownMenuLabelProps): react_jsx_runtime.JSX.Element;
interface DropdownMenuGroupProps {
children: ReactNode;
className?: string;
}
declare function DropdownMenuGroup({ children, className }: DropdownMenuGroupProps): react_jsx_runtime.JSX.Element;
interface DropdownMenuCheckboxItemProps {
checked: boolean;
onCheckedChange: (checked: boolean) => void;
children: ReactNode;
icon?: ReactNode;
disabled?: boolean;
/**
When true the menu closes after toggling (default Radix behaviour).
Default: false — keeps the menu open for multi-select workflows.
/
closeOnSelect?: boolean;
className?: string;
}
/**
A toggleable menu item that keeps the menu open on selection (multi-select).
Built on RadixDropdownMenu.CheckboxItem — Radix sets role="menuitemcheckbox"
and aria-checked automatically; do not override those attributes.
The checked indicator renders as a switch-style track+thumb (visual only).
Layout: [icon?] [label flex-1] [switch-indicator]
const [showStock, setShowStock] = useState(false)
<DropdownMenuCheckboxItem
checked={showStock}
onCheckedChange={setShowStock}
icon={<PackageIcon size={14} />}
>
Mostrar stock
</DropdownMenuCheckboxItem>

Del @example del JSDoc de @solu30/ui-kit, sin editar. Cuatro de los 69 ejemplos del paquete traen pegada la firma cruda del .d.ts —el mismo defecto del extractor que se come las descripciones—, y por eso la caja tiene tope de alto: el ejemplo de verdad suele estar al final.