@progress/kendo-react-layout/panelbar/interfaces/PanelBarItemProps.d.ts

React Layout components enable you to create a perceptive and intuitive layout of web projects. KendoReact Layout package

/**
 * @license
 *-------------------------------------------------------------------------------------------
 * Copyright © 2026 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the package root for more information
 *-------------------------------------------------------------------------------------------
 */
import { SVGIcon } from '@progress/kendo-react-common';
/**
 * Represents the props of the PanelBarItem component.
 */
export interface PanelBarItemProps {
    /**
     * Allows individual animation control over the child ([see example](https://www.telerik.com/kendo-react-ui/components/layout/panelbar/animations)). By default, it is controlled by the PanelBar component.
     */
    animation?: boolean;
    /**
     * Can be any of PanelBar items, an array of PanelBar items, or a custom component.
     */
    children?: any;
    /**
     * The class name that is set to the PanelBarItem component.
     */
    className?: string;
    /**
     * The class name that is set to the PanelBarItem header.
     */
    headerClassName?: string;
    /**
     * Sets the initial expanded state of the PanelBarItem
     * ([see example](https://www.telerik.com/kendo-react-ui/components/layout/panelbar/items/states#toc-expanded-items)). Controlled by the PanelBar component.
     *
     * @default false
     */
    expanded?: boolean;
    /**
     * Sets the disabled state of the PanelBarItem
     * ([see example](https://www.telerik.com/kendo-react-ui/components/layout/panelbar/items/states#toc-disabled-items)).
     *
     * @default false
     */
    disabled?: boolean;
    /**
     * @hidden
     */
    onSelect?: Function;
    /**
     * @hidden
     */
    level?: number;
    /**
     * Defines an icon that will be rendered next to the title
     * ([see example](https://www.telerik.com/kendo-react-ui/components/layout/panelbar/items/titles#toc-adding-icons)).
     */
    icon?: string;
    /**
     * Defines an SVG icon that will be rendered next to the title
     * ([see example](https://www.telerik.com/kendo-react-ui/components/layout/panelbar/items/titles#toc-adding-icons)).
     */
    svgIcon?: SVGIcon;
    /**
     * Defines an icon with a custom CSS class that will be rendered next to the title
     * ([see example](https://www.telerik.com/kendo-react-ui/components/layout/panelbar/items/titles#toc-adding-icons)).
     */
    iconClass?: string;
    /**
     * Defines the location of the image that will be displayed next to the title
     * ([see example](https://www.telerik.com/kendo-react-ui/components/layout/panelbar/items/titles#toc-adding-images)).
     */
    imageUrl?: string;
    /**
     * Sets the initial selected state of the PanelBarItem. Controlled by the PanelBarItem component
     * ([see example](https://www.telerik.com/kendo-react-ui/components/layout/panelbar/items/states#toc-selected-items)).
     *
     * @default false
     */
    selected?: boolean;
    /**
     * Sets the title of the PanelBar item
     * ([see example](https://www.telerik.com/kendo-react-ui/components/layout/panelbar/items/titles#toc-getting-started)).
     */
    title?: React.ReactNode;
    /**
     * Allows the component to set the `id` property to each item. If not set, a default `id` is applied.
     */
    id?: string;
    /**
     * Sets the initial focused state of the PanelBarItem. Controlled by the PanelBar component.
     */
    focused?: boolean;
    /**
     * @hidden
     */
    parentExpanded?: boolean;
    /**
     * @hidden
     */
    content?: any;
    /**
     * Used to identify the PanelBarItems inside the PanelBar
     * ([see example](https://www.telerik.com/kendo-react-ui/components/layout/panelbar/controlling-state)). Does not depend on the state of the PanelBarItem.
     */
    uniquePrivateKey?: string;
    /**
     * @hidden
     */
    parentUniquePrivateKey?: string[];
    /**
     * @hidden
     */
    keepItemsMounted?: boolean;
    /**
     * Sets a custom property. Contained in the PanelBarItem props that are returned from the `onSelect` PanelBar event.
     */
    [customProp: string]: any;
}