@progress/kendo-react-layout 13.3.0-develop.9 → 13.4.0-develop.1

package/card/interfaces/CardActionsProps.d.ts

@@ -0,0 +1,76 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+import { cardActionsLayout, cardOrientation } from './Enums.js';
+export interface CardActionsProps {
+    /**
+     * Sets the CardActions children elements.
+     *
+     * @example
+     * ```jsx
+     * <CardActions>
+     *   <Button>Action 1</Button>
+     *   <Button>Action 2</Button>
+     * </CardActions>
+     * ```
+     */
+    children?: React.ReactNode;
+    /**
+     * Sets additional CSS styles to the CardActions.
+     *
+     * @example
+     * ```jsx
+     * <CardActions style={{ justifyContent: 'center' }}>
+     *   <Button>Action</Button>
+     * </CardActions>
+     * ```
+     */
+    style?: React.CSSProperties;
+    /**
+     * Sets additional classes to the CardActions.
+     *
+     * @example
+     * ```jsx
+     * <CardActions className="custom-class">
+     *   <Button>Action</Button>
+     * </CardActions>
+     * ```
+     */
+    className?: string;
+    /**
+     * Sets the layout of the actions.
+     *
+     * The supported values are:
+     * * (Default) `start`
+     * * `center`
+     * * `end`
+     * * `stretched`
+     *
+     * @example
+     * ```jsx
+     * <CardActions layout="center">
+     *   <Button>Action</Button>
+     * </CardActions>
+     * ```
+     */
+    layout?: cardActionsLayout | string;
+    /**
+     * Specifies the orientation of the Card action buttons.
+     *
+     * The possible values are:
+     * * (Default) `horizontal`
+     * * `vertical`
+     *
+     * @example
+     * ```jsx
+     * <CardActions orientation="vertical">
+     *   <Button>Action</Button>
+     * </CardActions>
+     * ```
+     */
+    orientation?: cardOrientation | string;
+}

package/card/interfaces/CardBodyProps.d.ts

@@ -0,0 +1,36 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+export interface CardBodyProps {
+    /**
+     * Sets the CardBody children elements.
+     *
+     * @example
+     * ```jsx
+     * <CardBody>Body Content</CardBody>
+     * ```
+     */
+    children?: React.ReactNode;
+    /**
+     * Sets additional CSS styles to the CardBody.
+     *
+     * @example
+     * ```jsx
+     * <CardBody style={{ padding: '20px' }}>Body Content</CardBody>
+     * ```
+     */
+    style?: React.CSSProperties;
+    /**
+     * Sets additional classes to the CardBody.
+     *
+     * @example
+     * ```jsx
+     * <CardBody className="custom-class">Body Content</CardBody>
+     * ```
+     */
+    className?: string;
+}

package/card/interfaces/CardFooterProps.d.ts

@@ -0,0 +1,36 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+export interface CardFooterProps {
+    /**
+     * Sets the CardFooter children elements.
+     *
+     * @example
+     * ```jsx
+     * <CardFooter>Footer Content</CardFooter>
+     * ```
+     */
+    children?: React.ReactNode;
+    /**
+     * Sets additional CSS styles to the CardFooter.
+     *
+     * @example
+     * ```jsx
+     * <CardFooter style={{ textAlign: 'center' }}>Footer Content</CardFooter>
+     * ```
+     */
+    style?: React.CSSProperties;
+    /**
+     * Sets additional classes to the CardFooter.
+     *
+     * @example
+     * ```jsx
+     * <CardFooter className="custom-class">Footer Content</CardFooter>
+     * ```
+     */
+    className?: string;
+}

package/card/interfaces/CardHandle.d.ts

@@ -0,0 +1,21 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+import { CardProps } from './CardProps.js';
+/**
+ * Represents the target(element and props) of the Card component.
+ */
+export interface CardHandle {
+    /**
+     * The current element or `null` if there is no one.
+     */
+    element: HTMLDivElement | null;
+    /**
+     * The props values of the Card.
+     */
+    props: CardProps;
+}

package/card/interfaces/CardHeaderProps.d.ts

@@ -0,0 +1,36 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+export interface CardHeaderProps {
+    /**
+     * Sets the CardHeader children elements.
+     *
+     * @example
+     * ```jsx
+     * <CardHeader>Header Content</CardHeader>
+     * ```
+     */
+    children?: React.ReactNode;
+    /**
+     * Sets additional CSS styles to the CardHeader.
+     *
+     * @example
+     * ```jsx
+     * <CardHeader style={{ fontWeight: 'bold' }}>Header Content</CardHeader>
+     * ```
+     */
+    style?: React.CSSProperties;
+    /**
+     * Sets additional classes to the CardHeader.
+     *
+     * @example
+     * ```jsx
+     * <CardHeader className="custom-class">Header Content</CardHeader>
+     * ```
+     */
+    className?: string;
+}

package/card/interfaces/CardImageProps.d.ts

@@ -0,0 +1,45 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+export interface CardImageProps {
+    /**
+     * Sets additional CSS styles to the CardImageProps.
+     *
+     * @example
+     * ```jsx
+     * <CardImage style={{ borderRadius: '50%' }} src="image.jpg" />
+     * ```
+     */
+    style?: React.CSSProperties;
+    /**
+     * Sets additional classes to the CardImageProps.
+     *
+     * @example
+     * ```jsx
+     * <CardImage className="custom-class" src="image.jpg" />
+     * ```
+     */
+    className?: string;
+    /**
+     * Sets the source of the image.
+     *
+     * @example
+     * ```jsx
+     * <CardImage src="image.jpg" />
+     * ```
+     */
+    src?: string;
+    /**
+     * Specifies an alternate text for the image.
+     *
+     * @example
+     * ```jsx
+     * <CardImage src="image.jpg" alt="Description of the image" />
+     * ```
+     */
+    alt?: string;
+}

package/card/interfaces/CardProps.d.ts

@@ -0,0 +1,91 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+import { cardType, cardOrientation } from './Enums.js';
+export interface CardProps {
+    /**
+     * Sets the Card child elements.
+     *
+     * @example
+     * ```jsx
+     * <Card>
+     *   <CardBody>Content</CardBody>
+     * </Card>
+     * ```
+     */
+    children?: React.ReactNode;
+    /**
+     * Sets the [dir](https://www.w3schools.com/tags/att_global_dir.asp) of the Card.
+     *
+     * @example
+     * ```jsx
+     * <Card dir="rtl">Content</Card>
+     * ```
+     */
+    dir?: string;
+    /**
+     * Sets additional CSS styles to the Card.
+     *
+     * @example
+     * ```jsx
+     * <Card style={{ backgroundColor: 'blue' }}>Content</Card>
+     * ```
+     */
+    style?: React.CSSProperties;
+    /**
+     * Sets additional classes to the Card.
+     *
+     * @example
+     * ```jsx
+     * <Card className="custom-class">Content</Card>
+     * ```
+     */
+    className?: string;
+    /**
+     * Sets the Card type.
+     *
+     * The supported values are:
+     * * `default`
+     * * `primary`
+     * * `info`
+     * * `success`
+     * * `warning`
+     * * `error`
+     *
+     * @default default
+     *
+     * @example
+     * ```jsx
+     * <Card type="primary">Content</Card>
+     * ```
+     */
+    type?: cardType | string;
+    /**
+     * Sets the Card orientation.
+     *
+     * The supported values are:
+     * * `horizontal` - Default
+     * * `vertical`
+     *
+     * @default horizontal
+     *
+     * @example
+     * ```jsx
+     * <Card orientation="vertical">Content</Card>
+     * ```
+     */
+    orientation?: cardOrientation | string;
+    /**
+     * Sets a custom property to the component DOM element.
+     *
+     * @example
+     * ```jsx
+     * <Card data-custom="value">Content</Card>
+     * ```
+     */
+    [customProp: string]: any;
+}

package/card/interfaces/CardSubtitleProps.d.ts

@@ -0,0 +1,36 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+export interface CardSubtitleProps {
+    /**
+     * Sets the CardSubtitle children elements.
+     *
+     * @example
+     * ```jsx
+     * <CardSubtitle>Subtitle Text</CardSubtitle>
+     * ```
+     */
+    children?: React.ReactNode;
+    /**
+     * Sets additional CSS styles to the CardSubtitle.
+     *
+     * @example
+     * ```jsx
+     * <CardSubtitle style={{ color: 'red' }}>Subtitle Text</CardSubtitle>
+     * ```
+     */
+    style?: React.CSSProperties;
+    /**
+     * Sets additional classes to the CardSubtitle.
+     *
+     * @example
+     * ```jsx
+     * <CardSubtitle className="custom-class">Subtitle Text</CardSubtitle>
+     * ```
+     */
+    className?: string;
+}

package/card/interfaces/CardTitleProps.d.ts

@@ -0,0 +1,21 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+export interface CardTitleProps {
+    /**
+     * Sets the CardTitle children elements.
+     */
+    children?: React.ReactNode;
+    /**
+     * Sets additional CSS styles to the CardTitle.
+     */
+    style?: React.CSSProperties;
+    /**
+     * Add additional classes to the CardTitle.
+     */
+    className?: string;
+}

package/card/interfaces/Enums.d.ts

@@ -0,0 +1,30 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+export declare enum avatarType {
+    TEXT = "text",
+    IMAGE = "image",
+    ICON = "icon"
+}
+export declare enum cardOrientation {
+    HORIZONTAL = "horizontal",
+    VERTICAL = "vertical"
+}
+export declare enum cardType {
+    DEFAULT = "default",
+    primary = "primary",
+    INFO = "info",
+    SUCCESS = "success",
+    WARNING = "warning",
+    ERROR = "error"
+}
+export declare enum cardActionsLayout {
+    START = "start",
+    CENTER = "center",
+    END = "end",
+    STRETCHED = "stretched"
+}

package/contextmenu/ContextMenu.d.ts

@@ -0,0 +1,50 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+import { Offset } from '@progress/kendo-react-popup';
+import { MenuProps } from '../menu/MenuProps.js';
+import { MenuCloseEvent } from '../menu/events.js';
+import * as React from 'react';
+/**
+ * The props of the [KendoReact ContextMenu component](https://www.telerik.com/kendo-react-ui/components/layout/contextmenu).
+ */
+export interface ContextMenuProps extends Omit<MenuProps, 'onClose' | 'openOnClick' | 'hoverOpenDelay' | 'hoverCloseDelay'> {
+    /**
+     * Controls the Popup visibility of the ContextMenu.
+     *
+     * Example:
+     * ```jsx
+     * <ContextMenu show={true} />
+     * ```
+     */
+    show: boolean;
+    /**
+     * Specifies the absolute position of the ContextMenu. The Popover opens next to that point.
+     *
+     * Example:
+     * ```jsx
+     * <ContextMenu offset={{ left: 100, top: 200 }} />
+     * ```
+     */
+    offset: Offset;
+    /**
+     * Triggers when the ContextMenu needs to hide.
+     *
+     * Example:
+     * ```jsx
+     * <ContextMenu onClose={(e) => setShow(false)} />
+     * ```
+     */
+    onClose: (event: MenuCloseEvent) => void;
+}
+/**
+ * Represents the [KendoReact ContextMenu component](https://www.telerik.com/kendo-react-ui/components/layout/contextmenu).
+ */
+export declare const ContextMenu: {
+    (props: ContextMenuProps): React.JSX.Element;
+    displayName: string;
+};