@syncfusion/ej2-ribbon 30.2.4 → 31.1.17

package/dist/ts/ribbon/models/ribbon-combobox-settings.ts

@@ -0,0 +1,313 @@
+import { ChildProperty, Event, EmitType, Property, Complex } from '@syncfusion/ej2-base';
+import { BeforeOpenEventArgs, ChangeEventArgs, FieldSettings, FieldSettingsModel, FilteringEventArgs, FilterType, PopupEventArgs } from '@syncfusion/ej2-dropdowns';
+import { SelectEventArgs, SortOrder } from '@syncfusion/ej2-lists';
+
+/**
+ * Defines the ribbon combobox item.
+ */
+export class RibbonComboBoxSettings extends ChildProperty<RibbonComboBoxSettings>{
+
+    /**
+     * Specifies whether to show the filter bar (search box) of the combobox.
+     * The filter action retrieves matched items through the filtering event based on the characters typed in the search TextBox.
+     * If no match is found, the value of the noRecordsTemplate property will be displayed.
+     *
+     * @default false
+     */
+    @Property(false)
+    public allowFiltering: boolean;
+
+    /**
+     * Specifies whether to suggest a first matched item in input when searching.
+     * No action happens when no matches found.
+     *
+     * @default true
+     */
+    @Property(true)
+    public autofill: boolean;
+
+    /**
+     * Defines the CSS class to customize the appearance of the combobox.
+     *
+     * @default ''
+     */
+    @Property('')
+    public cssClass: string;
+
+    /**
+     * Specifies the label text for the overflow item.
+     *
+     * @default ''
+     */
+    @Property('')
+    public label: string;
+
+    /**
+     * Defines the list of items to shown in the combobox.
+     *
+     * @default []
+     */
+    @Property([])
+    public dataSource: { [key: string]: Object }[] | string[] | number[] | boolean[];
+
+    /**
+     * Specifies the mapping for the columns of the data table bind to the combobox.
+     * * text - Maps the text column from data table for each list item.
+     * * value - Maps the value column from data table for each list item.
+     * * iconCss - Maps the icon class column from data table for each list item.
+     * * groupBy - Group the list items with it's related items by mapping groupBy field.
+     *
+     * @default {text: null, value: null, iconCss: null, groupBy: null}
+     */
+    @Complex<FieldSettingsModel>({ text: null, value: null, iconCss: null, groupBy: null }, FieldSettings)
+    public fields: FieldSettingsModel;
+
+    /**
+     * Specifies filter type to be considered on search action.
+     * The `FilterType` and its supported data types are
+     *
+     * <table>
+     * <tr>
+     * <td colSpan=1 rowSpan=1>
+     * FilterType<br/></td><td colSpan=1 rowSpan=1>
+     * Description<br/></td><td colSpan=1 rowSpan=1>
+     * Supported Types<br/></td></tr>
+     * <tr>
+     * <td colSpan=1 rowSpan=1>
+     * StartsWith<br/></td><td colSpan=1 rowSpan=1>
+     * Checks whether a value begins with the specified value.<br/></td><td colSpan=1 rowSpan=1>
+     * String<br/></td></tr>
+     * <tr>
+     * <td colSpan=1 rowSpan=1>
+     * EndsWith<br/></td><td colSpan=1 rowSpan=1>
+     * Checks whether a value ends with specified value.<br/><br/></td><td colSpan=1 rowSpan=1>
+     * <br/>String<br/></td></tr>
+     * <tr>
+     * <td colSpan=1 rowSpan=1>
+     * Contains<br/></td><td colSpan=1 rowSpan=1>
+     * Checks whether a value contains with specified value.<br/><br/></td><td colSpan=1 rowSpan=1>
+     * <br/>String<br/></td></tr>
+     * </table>
+     *
+     * @default Contains
+     */
+    @Property('Contains')
+    public filterType: FilterType;
+
+    /**
+     * Specifies the template content for the footer container of the popup list.
+     *
+     * @default null
+     * @angularType string | object
+     * @reactType string | function | JSX.Element
+     * @vueType string | function
+     * @aspType string
+     */
+    @Property(null)
+    public footerTemplate: string | Function;
+
+    /**
+     * Specifies the template content for the group headers present in the popup list.
+     *
+     * @default null
+     * @angularType string | object
+     * @reactType string | function | JSX.Element
+     * @vueType string | function
+     * @aspType string
+     */
+    @Property(null)
+    public groupTemplate: string | Function;
+
+    /**
+     * Specifies the template content for the header container of the popup list.
+     *
+     * @default null
+     * @angularType string | object
+     * @reactType string | function | JSX.Element
+     * @vueType string | function
+     * @aspType string
+     */
+    @Property(null)
+    public headerTemplate: string | Function;
+
+    /**
+     * Specifies the index of the selected item in the combobox.
+     *
+     * @default null
+     */
+    @Property(null)
+    public index: number;
+
+    /**
+     * Specifies the template content for each list item present in the popup.
+     *
+     * @default null
+     * @angularType string | object
+     * @reactType string | function | JSX.Element
+     * @vueType string | function
+     * @aspType string
+     */
+    @Property(null)
+    public itemTemplate: string | Function;
+    /**
+     * Specifies the template content for the popup list of combobox when no data is available.
+     *
+     * @default 'No records found'
+     * @angularType string | object
+     * @reactType string | function | JSX.Element
+     * @vueType string | function
+     * @aspType string
+     */
+    @Property('No records found')
+    public noRecordsTemplate: string | Function;
+
+    /**
+     * Specifies a short hint that describes the expected value of the combobox.
+     *
+     * @default null
+     */
+    @Property(null)
+    public placeholder: string;
+
+    /**
+     * Specifies the height of the popup list.
+     *
+     * @default '300px'
+     * @aspType string
+     */
+    @Property('300px')
+    public popupHeight: string | number;
+
+    /**
+     * Specifies the width of the popup list.
+     * By default, the popup width sets based on the width of the combobox.
+     *
+     * @default '100%'
+     * @aspType string
+     */
+    @Property('100%')
+    public popupWidth: string | number;
+
+    /**
+     * Specifies whether to show or hide the clear button.
+     * When the clear button is clicked, `value`, `text`, and `index` properties are reset to null.
+     *
+     * @default true
+     */
+    @Property(true)
+    public showClearButton: boolean;
+    /**
+     * Specifies the order in which the data source needs to be sorted. The available type of sort orders are
+     * * `None` - The data source is not sorted.
+     * * `Ascending` - The data source is sorted in ascending order.
+     * * `Descending` - The data source is sorted in descending order.
+     *
+     * @default null
+     * @asptype object
+     * @aspjsonconverterignore
+     */
+    @Property<SortOrder>('None')
+    public sortOrder: SortOrder;
+
+    /**
+     * Defines the display text of the selected item in the combobox.
+     *
+     * @default null
+     *
+     */
+    @Property(null)
+    public text: string;
+
+    /**
+     * Defines the value of the selected item in the combobox.
+     *
+     * @default null
+     * @isGenericType true
+     */
+    @Property(null)
+    public value: number | string | boolean;
+
+    /**
+     * Specifies the width of the combobox.
+     * By default, the combobox width sets based on the width of its parent container.
+     *
+     * @default '150px'
+     * @aspType string
+     */
+    @Property('150px')
+    public width: string | number;
+
+    /**
+     * Specifies additional HTML attributes to be applied to the combobox.
+     *
+     * @default {}
+     */
+    @Property({})
+    public htmlAttributes: { [key: string]: string };
+
+    /**
+     * Event triggers before opening the popup.
+     *
+     * @event beforeOpen
+     */
+    @Event()
+    public beforeOpen: EmitType<BeforeOpenEventArgs>;
+
+    /**
+     * Event triggers when an item in a popup is selected or when the model value is changed by user.
+     *
+     * @event change
+     */
+    @Event()
+    public change: EmitType<ChangeEventArgs>;
+
+    /**
+     * Event triggers when the popup is closed.
+     *
+     * @event close
+     */
+    @Event()
+    public close: EmitType<PopupEventArgs>;
+
+    /**
+     * Event triggers once the combobox is created.
+     *
+     * @event created
+     */
+    @Event()
+    public created: EmitType<Event>;
+
+    /**
+     * Event triggers on typing a character in the combobox.
+     *
+     * @event filtering
+     */
+    @Event()
+    public filtering: EmitType<FilteringEventArgs>;
+
+    /**
+     * Event triggers when the popup is opened
+     *
+     * @event open
+     */
+    @Event()
+    public open: EmitType<PopupEventArgs>;
+
+    /**
+     * Event triggers when an item in the popup is selected.
+     *
+     * @event select
+     */
+    @Event()
+    public select: EmitType<SelectEventArgs>;
+
+    /**
+     * @param {Object} prop - Gets the property of combobox.
+     * @param {boolean} muteOnChange - Gets the boolean value of muteOnChange.
+     * @returns {void}
+     * @private
+     */
+    public setProperties(prop: Object, muteOnChange: boolean): void {
+        super.setProperties(prop, muteOnChange);
+    }
+}

package/dist/ts/ribbon/models/ribbon-contextual-tab-settings-model.d.ts

@@ -0,0 +1,30 @@
+import { ChildProperty, Property, Collection } from '@syncfusion/ej2-base';import { RibbonTab } from './ribbon-tab';import { RibbonTabModel } from './ribbon-tab-model';
+
+/**
+ * Interface for a class RibbonContextualTabSettings
+ */
+export interface RibbonContextualTabSettingsModel {
+
+    /**
+     * Specifies whether the contextual tab is visible.
+     *
+     * @default false
+     */
+    visible?: boolean;
+
+    /**
+     * Specifies whether the contextual tab is selected.
+     *
+     * @default false
+     */
+    isSelected?: boolean;
+
+    /**
+     * Defines the tab groups to be rendered in ribbon.
+     *
+     * @default []
+     * @aspType List<RibbonTab>
+     */
+    tabs?: RibbonTabModel[];
+
+}

package/dist/ts/ribbon/models/ribbon-contextual-tab-settings.d.ts

@@ -0,0 +1,33 @@
+import { ChildProperty } from '@syncfusion/ej2-base';
+import { RibbonTabModel } from './ribbon-tab-model';
+/**
+ * Defines the ribbon contextual tab.
+ */
+export declare class RibbonContextualTabSettings extends ChildProperty<RibbonContextualTabSettings> {
+    /**
+     * Specifies whether the contextual tab is visible.
+     *
+     * @default false
+     */
+    visible: boolean;
+    /**
+     * Specifies whether the contextual tab is selected.
+     *
+     * @default false
+     */
+    isSelected: boolean;
+    /**
+     * Defines the tab groups to be rendered in ribbon.
+     *
+     * @default []
+     * @aspType List<RibbonTab>
+     */
+    tabs: RibbonTabModel[];
+    /**
+     * @param {Object} prop - Gets the property of contextual tab.
+     * @param {boolean} muteOnChange - Gets the boolean value of muteOnChange.
+     * @returns {void}
+     * @private
+     */
+    setProperties(prop: Object, muteOnChange: boolean): void;
+}

package/dist/ts/ribbon/models/ribbon-contextual-tab-settings.ts

@@ -0,0 +1,44 @@
+import { ChildProperty, Property, Collection } from '@syncfusion/ej2-base';
+import { RibbonTab } from './ribbon-tab';
+import { RibbonTabModel } from './ribbon-tab-model';
+
+/**
+ * Defines the ribbon contextual tab.
+ */
+export class RibbonContextualTabSettings extends ChildProperty<RibbonContextualTabSettings>  {
+
+    /**
+     * Specifies whether the contextual tab is visible.
+     *
+     * @default false
+     */
+    @Property(false)
+    public visible: boolean;
+
+    /**
+     * Specifies whether the contextual tab is selected.
+     *
+     * @default false
+     */
+    @Property(false)
+    public isSelected: boolean;
+
+    /**
+     * Defines the tab groups to be rendered in ribbon.
+     *
+     * @default []
+     * @aspType List<RibbonTab>
+     */
+    @Collection<RibbonTabModel>([], RibbonTab)
+    public tabs: RibbonTabModel[];
+
+    /**
+     * @param {Object} prop - Gets the property of contextual tab.
+     * @param {boolean} muteOnChange - Gets the boolean value of muteOnChange.
+     * @returns {void}
+     * @private
+     */
+    public setProperties(prop: Object, muteOnChange: boolean): void {
+        super.setProperties(prop, muteOnChange);
+    }
+}

package/dist/ts/ribbon/models/ribbon-dropdown-settings-model.d.ts

@@ -0,0 +1,114 @@
+import { ChildProperty, Collection, Event, EmitType, Property } from '@syncfusion/ej2-base';import { ItemModel, Item, BeforeOpenCloseMenuEventArgs, MenuEventArgs, OpenCloseMenuEventArgs } from '@syncfusion/ej2-splitbuttons';
+
+/**
+ * Interface for a class RibbonDropDownSettings
+ */
+export interface RibbonDropDownSettingsModel {
+
+    /**
+     * Specifies the event to close the DropDownButton popup.
+     *
+     * @default ''
+     */
+    closeActionEvents?: string;
+
+    /**
+     * Specifies the content of the DropDownButton.
+     *
+     * @default ''
+     */
+    content?: string;
+
+    /**
+     * Defines one or more CSS classes to customize the appearance of DropDownButton.
+     *
+     * @default ''
+     */
+    cssClass?: string;
+
+    /**
+     * Defines the CSS class for the icons to be shown in the DropDownButton.
+     *
+     * @default ''
+     */
+    iconCss?: string;
+
+    /**
+     * Defines the list of items for the DropDownButton popup.
+     *
+     * @default []
+     */
+    items?: ItemModel[];
+
+    /**
+     * Specifies the selector for the element to be shown in the DropDownButton popup.
+     *
+     * @default ''
+     * @aspType string
+     */
+    target?: string | HTMLElement;
+
+    /**
+     * Specifies whether to create popup element on open.
+     *
+     * @default false
+     */
+    createPopupOnClick?: boolean;
+
+    /**
+     * Specifies additional HTML attributes to be applied to the DropDownButton.
+     *
+     * @default {}
+     */
+    htmlAttributes?: { [key: string]: string };
+
+    /**
+     * Triggers before closing the DropDownButton popup.
+     *
+     * @event beforeClose
+     */
+    beforeClose?: EmitType<BeforeOpenCloseMenuEventArgs>;
+
+    /**
+     * Triggers while rendering each Popup item of DropDownButton.
+     *
+     * @event beforeItemRender
+     */
+    beforeItemRender?: EmitType<MenuEventArgs>;
+
+    /**
+     * Triggers before opening the DropDownButton popup.
+     *
+     * @event beforeOpen
+     */
+    beforeOpen?: EmitType<BeforeOpenCloseMenuEventArgs>;
+
+    /**
+     * Triggers while closing the DropDownButton popup.
+     *
+     * @event close
+     */
+    close?: EmitType<OpenCloseMenuEventArgs>;
+
+    /**
+     * Event triggers once the DropDownButton is created.
+     *
+     * @event created
+     */
+    created?: EmitType<Event>;
+
+    /**
+     * Triggers while opening the DropDownButton popup.
+     *
+     * @event open
+     */
+    open?: EmitType<OpenCloseMenuEventArgs>;
+
+    /**
+     * Triggers while selecting an action item in DropDownButton popup.
+     *
+     * @event select
+     */
+    select?: EmitType<MenuEventArgs>;
+
+}

package/dist/ts/ribbon/models/ribbon-dropdown-settings.d.ts

@@ -0,0 +1,107 @@
+import { ChildProperty, EmitType } from '@syncfusion/ej2-base';
+import { ItemModel, BeforeOpenCloseMenuEventArgs, MenuEventArgs, OpenCloseMenuEventArgs } from '@syncfusion/ej2-splitbuttons';
+/**
+ * Defines the ribbon DropDownButton item.
+ */
+export declare class RibbonDropDownSettings extends ChildProperty<RibbonDropDownSettings> {
+    /**
+     * Specifies the event to close the DropDownButton popup.
+     *
+     * @default ''
+     */
+    closeActionEvents: string;
+    /**
+     * Specifies the content of the DropDownButton.
+     *
+     * @default ''
+     */
+    content: string;
+    /**
+     * Defines one or more CSS classes to customize the appearance of DropDownButton.
+     *
+     * @default ''
+     */
+    cssClass: string;
+    /**
+     * Defines the CSS class for the icons to be shown in the DropDownButton.
+     *
+     * @default ''
+     */
+    iconCss: string;
+    /**
+     * Defines the list of items for the DropDownButton popup.
+     *
+     * @default []
+     */
+    items: ItemModel[];
+    /**
+     * Specifies the selector for the element to be shown in the DropDownButton popup.
+     *
+     * @default ''
+     * @aspType string
+     */
+    target: string | HTMLElement;
+    /**
+     * Specifies whether to create popup element on open.
+     *
+     * @default false
+     */
+    createPopupOnClick: boolean;
+    /**
+     * Specifies additional HTML attributes to be applied to the DropDownButton.
+     *
+     * @default {}
+     */
+    htmlAttributes: {
+        [key: string]: string;
+    };
+    /**
+     * Triggers before closing the DropDownButton popup.
+     *
+     * @event beforeClose
+     */
+    beforeClose: EmitType<BeforeOpenCloseMenuEventArgs>;
+    /**
+     * Triggers while rendering each Popup item of DropDownButton.
+     *
+     * @event beforeItemRender
+     */
+    beforeItemRender: EmitType<MenuEventArgs>;
+    /**
+     * Triggers before opening the DropDownButton popup.
+     *
+     * @event beforeOpen
+     */
+    beforeOpen: EmitType<BeforeOpenCloseMenuEventArgs>;
+    /**
+     * Triggers while closing the DropDownButton popup.
+     *
+     * @event close
+     */
+    close: EmitType<OpenCloseMenuEventArgs>;
+    /**
+     * Event triggers once the DropDownButton is created.
+     *
+     * @event created
+     */
+    created: EmitType<Event>;
+    /**
+     * Triggers while opening the DropDownButton popup.
+     *
+     * @event open
+     */
+    open: EmitType<OpenCloseMenuEventArgs>;
+    /**
+     * Triggers while selecting an action item in DropDownButton popup.
+     *
+     * @event select
+     */
+    select: EmitType<MenuEventArgs>;
+    /**
+     * @param {Object} prop - Gets the property of DropDown.
+     * @param {boolean} muteOnChange - Gets the boolean value of muteOnChange.
+     * @returns {void}
+     * @private
+     */
+    setProperties(prop: Object, muteOnChange: boolean): void;
+}