/** * This module includes a form row UI control, a container component that can be used to * display form controls on one row. * * To be able to use these controls the CanKingDataProvider component must be present in the * component tree above your component. Normally the CanKingDataProvider is added * at the root of the component tree. * * @example * In this example, YourComponent1 and YourComponent2 will have the same width, which will be the maximum width of the two components. * * ```tsx * function YourComponent() { * const columnItem1 = useColumnItem(); * const columnItem2 = useColumnItem(); * const width = useColumnItems(columnItem1, columnItem2); * return ( *
* * * * * * *
* ); * } * * @packageDocumentation */ import React, { JSX } from 'react'; import { type ColumnItem } from './ColumnItems'; /** * Properties for the ColumnItemControl component. */ export interface ColumnItemControlProps { /** * The ColumnItem associated with this control. The ColumnItem contains a resizeRef callback that will * be called with the DOM element of this control, allowing the ColumnItem to manage the width of this * control and any other controls that share the same ColumnItem. */ columnItem: ColumnItem; /** * The width of the control. If not provided, the control will use the width managed by the ColumnItem. */ width?: number; /** * The child elements to be rendered inside the control. */ children?: React.ReactNode; } /** * A react component to be used when different components should share the same width. * @param props - Component properties. * @returns The ColumnItemControl React component. */ declare function ColumnItemControl({ columnItem, width, children, }: ColumnItemControlProps): JSX.Element; export default ColumnItemControl;