@progress/kendo-angular-dropdowns
Version:
A wide variety of native Angular dropdown components including AutoComplete, ComboBox, DropDownList, DropDownTree, MultiColumnComboBox, MultiSelect, and MultiSelectTree
117 lines (116 loc) • 4.62 kB
JavaScript
/**-----------------------------------------------------------------------------------------
* Copyright © 2025 Progress Software Corporation. All rights reserved.
* Licensed under commercial license. See LICENSE.md in the project root for more information
*-------------------------------------------------------------------------------------------*/
import { Component, ContentChild, Input } from '@angular/core';
import { ColumnCellTemplateDirective } from './column-cell-template.directive';
import { ColumnHeaderTemplateDirective } from './column-header-template.directive';
import * as i0 from "@angular/core";
/**
* Represents the column definition for the MultiColumnComboBox component.
*
* Use this component to define columns inside the MultiColumnComboBox.
* [See example]({% slug columns_multicolumncombobox %}).
*
* @example
* ```html
* <kendo-multicolumncombobox ...>
* <kendo-combobox-column field="name" title="Name" width="200"></kendo-combobox-column>
* <kendo-multicolumncombobox ...>
* ```
*/
export class ComboBoxColumnComponent {
/**
* @hidden
*/
cellTemplate;
/**
* @hidden
*/
headerTemplate;
/**
* Sets the field to which the column is bound.
*
* > The `field` property can be set to point to a nested property value - e.g. `category.name`.
*/
field;
/**
* Sets the title of the column.
*/
title;
/**
* Sets the width of the column (in pixels).
*/
width;
/**
* Controls the visibility of the column. When `true`, hides the column from view.
* @default false
*/
hidden = false;
/**
* Sets custom styles for the table cells of the column (except for the header cells).
*
* The `style` property uses the NgStyle directive to apply styles.
*/
style;
/**
* Sets custom styles for the header cell of the column.
*
* The `headerStyle` property uses the NgStyle directive to apply styles.
*/
headerStyle;
/**
* Sets custom CSS classes for the column cells.
*
* The `class` property uses the NgClass directive to apply classes.
*/
class;
/**
* Sets custom CSS classes for the column header cell.
*
* The `headerClass` property uses the NgClass directive to apply classes.
*/
headerClass;
/**
* Sets the condition that needs to be satisfied for a column to remain visible. If you set the [`hidden`]({% slug api_dropdowns_comboboxcolumncomponent %}#toc-hidden) property, the behavior of media is overridden.
*/
media;
/**
* @hidden
*/
matchesMedia = true;
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ComboBoxColumnComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ComboBoxColumnComponent, isStandalone: true, selector: "kendo-combobox-column", inputs: { field: "field", title: "title", width: "width", hidden: "hidden", style: "style", headerStyle: "headerStyle", class: "class", headerClass: "headerClass", media: "media" }, queries: [{ propertyName: "cellTemplate", first: true, predicate: ColumnCellTemplateDirective, descendants: true }, { propertyName: "headerTemplate", first: true, predicate: ColumnHeaderTemplateDirective, descendants: true }], ngImport: i0, template: '', isInline: true });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ComboBoxColumnComponent, decorators: [{
type: Component,
args: [{
selector: 'kendo-combobox-column',
template: '',
standalone: true
}]
}], propDecorators: { cellTemplate: [{
type: ContentChild,
args: [ColumnCellTemplateDirective, { static: false }]
}], headerTemplate: [{
type: ContentChild,
args: [ColumnHeaderTemplateDirective, { static: false }]
}], field: [{
type: Input
}], title: [{
type: Input
}], width: [{
type: Input
}], hidden: [{
type: Input
}], style: [{
type: Input
}], headerStyle: [{
type: Input
}], class: [{
type: Input
}], headerClass: [{
type: Input
}], media: [{
type: Input
}] } });