cax-design-system 3.0.0 → 3.0.2

package/paginator/index.d.ts

@@ -1,5 +1,251 @@
+import * as i0 from '@angular/core';
+import { TemplateRef, OnInit, AfterContentInit, OnChanges, ElementRef, EventEmitter, QueryList, ChangeDetectorRef, SimpleChanges } from '@angular/core';
+import * as i6 from 'cax-design-system/api';
+import { SelectItem, caxConfig, Aria } from 'cax-design-system/api';
+import * as i3 from 'cax-design-system/dropdown';
+import { DropdownChangeEvent } from 'cax-design-system/dropdown';
+import { Nullable } from 'cax-design-system/ts-helpers';
+import * as i2 from '@angular/common';
+import * as i4 from 'cax-design-system/inputnumber';
+import * as i5 from '@angular/forms';
+import * as i7 from 'cax-design-system/ripple';
+import * as i8 from 'cax-design-system/icons/angledoubleleft';
+import * as i9 from 'cax-design-system/icons/angledoubleright';
+import * as i10 from 'cax-design-system/icons/angleleft';
+import * as i11 from 'cax-design-system/icons/angleright';
+
 /**
- * Generated bundle index. Do not edit.
+ * Paginator state.
+ * @group Interface
  */
-/// <amd-module name="cax-design-system/paginator" />
-export * from './public_api';
+interface PaginatorState {
+    page?: number;
+    first?: number;
+    rows?: number;
+    pageCount?: number;
+}
+/**
+ * Defines valid templates in PaginatorTemplates.
+ * @group Templates
+ */
+interface PaginatorTemplates {
+    /**
+     * Custom dropdown trigger icon template.
+     */
+    dropdownicon(): TemplateRef<any>;
+    /**
+     * Custom first page link icon template.
+     */
+    firstpagelinkicon(): TemplateRef<any>;
+    /**
+     * Custom previous page link icon template.
+     */
+    previouspagelinkicon(): TemplateRef<any>;
+    /**
+     * Custom last page link icon template.
+     */
+    lastpagelinkicon(): TemplateRef<any>;
+    /**
+     * Custom next page link icon template.
+     */
+    nextpagelinkicon(): TemplateRef<any>;
+}
+
+/**
+ * Paginator is a generic component to display content in paged format.
+ * @group Components
+ */
+declare class Paginator implements OnInit, AfterContentInit, OnChanges {
+    private cd;
+    private config;
+    /**
+     * Number of page links to display.
+     * @group Props
+     */
+    pageLinkSize: number;
+    /**
+     * Inline style of the component.
+     * @group Props
+     */
+    style: {
+        [klass: string]: any;
+    } | null | undefined;
+    /**
+     * Style class of the component.
+     * @group Props
+     */
+    styleClass: string | undefined;
+    /**
+     * Whether to show it even there is only one page.
+     * @group Props
+     */
+    alwaysShow: boolean;
+    /**
+     * Target element to attach the dropdown overlay, valid values are "body" or a local ng-template variable of another element.
+     * @group Props
+     */
+    dropdownAppendTo: HTMLElement | ElementRef | TemplateRef<any> | string | null | undefined | any;
+    /**
+     * Template instance to inject into the left side of the paginator.
+     * @param {PaginatorState} context - Paginator state.
+     * @group Props
+     */
+    templateLeft: TemplateRef<PaginatorState> | undefined;
+    /**
+     * Template instance to inject into the right side of the paginator.
+     * @param {PaginatorState} context - Paginator state.
+     * @group Props
+     */
+    templateRight: TemplateRef<PaginatorState> | undefined;
+    /**
+     * Target element to attach the dropdown overlay
+     * @group Props
+     */
+    appendTo: HTMLElement | ElementRef | TemplateRef<any> | string | null | undefined | any;
+    /**
+     * Dropdown height of the viewport in pixels
+     * @group Props
+     */
+    dropdownScrollHeight: string;
+    /**
+     * Template of the current page report element. Available placeholders are {currentPage},{totalPages},{rows},{first},{last} and {totalRecords}
+     * @group Props
+     */
+    currentPageReportTemplate: string;
+    /**
+     * Whether to display current page report.
+     * @group Props
+     */
+    showCurrentPageReport: boolean | undefined;
+    /**
+     * When enabled, icons are displayed on paginator to go first and last page.
+     * @group Props
+     */
+    showFirstLastIcon: boolean;
+    /**
+     * Number of total records.
+     * @group Props
+     */
+    totalRecords: number;
+    /**
+     * Data count to display per page.
+     * @group Props
+     */
+    rows: number;
+    /**
+     * Array of integer/object values to display inside rows per page dropdown.
+     * @group Props
+     */
+    rowsPerPageOptions: any[] | undefined;
+    /**
+     * Whether to display a dropdown to navigate to any page.
+     * @group Props
+     */
+    showJumpToPageDropdown: boolean | undefined;
+    /**
+     * Whether to display an input to navigate to any page.
+     * @group Props
+     */
+    showJumpToPageInput: boolean | undefined;
+    /**
+     * Template instance to inject into the jump to page dropdown item.
+     * @param {Object} context - item instance.
+     * @group Props
+     */
+    jumpToPageItemTemplate: TemplateRef<{
+        $implicit: any;
+    }> | undefined;
+    /**
+     * Whether to show page links.
+     * @group Props
+     */
+    showPageLinks: boolean;
+    /**
+     * Locale to be used in formatting.
+     * @group Props
+     */
+    locale: string | undefined;
+    /**
+     * Template instance to inject into the rows per page dropdown item.
+     * @param {Object} context - item instance.
+     * @group Props
+     */
+    dropdownItemTemplate: TemplateRef<{
+        $implicit: any;
+    }> | undefined;
+    /**
+     * Zero-relative number of the first row to be displayed.
+     * @group Props
+     */
+    get first(): number;
+    set first(val: number);
+    /**
+     * Callback to invoke when page changes, the event object contains information about the new state.
+     * @param {PaginatorState} event - Paginator state.
+     * @group Emits
+     */
+    onPageChange: EventEmitter<PaginatorState>;
+    templates: Nullable<QueryList<any>>;
+    dropdownIconTemplate: Nullable<TemplateRef<any>>;
+    firstPageLinkIconTemplate: Nullable<TemplateRef<any>>;
+    previousPageLinkIconTemplate: Nullable<TemplateRef<any>>;
+    lastPageLinkIconTemplate: Nullable<TemplateRef<any>>;
+    nextPageLinkIconTemplate: Nullable<TemplateRef<any>>;
+    pageLinks: number[] | undefined;
+    pageItems: SelectItem[] | undefined;
+    rowsPerPageItems: SelectItem[] | undefined;
+    paginatorState: any;
+    _first: number;
+    _page: number;
+    constructor(cd: ChangeDetectorRef, config: caxConfig);
+    ngOnInit(): void;
+    getAriaLabel(labelType: keyof Aria): string | undefined;
+    getPageAriaLabel(value: number): string | undefined;
+    getLocalization(digit: number): string;
+    ngAfterContentInit(): void;
+    ngOnChanges(simpleChange: SimpleChanges): void;
+    updateRowsPerPageOptions(): void;
+    isFirstPage(): boolean;
+    isLastPage(): boolean;
+    getPageCount(): number;
+    calculatePageLinkBoundaries(): [number, number];
+    updatePageLinks(): void;
+    changePage(p: number): void;
+    updateFirst(): void;
+    getPage(): number;
+    changePageToFirst(event: Event): void;
+    changePageToPrev(event: Event): void;
+    changePageToNext(event: Event): void;
+    changePageToLast(event: Event): void;
+    onPageLinkClick(event: Event, page: number): void;
+    onRppChange(event: Event): void;
+    onPageDropdownChange(event: DropdownChangeEvent): void;
+    updatePaginatorState(): void;
+    empty(): boolean;
+    currentPage(): number;
+    get currentPageReport(): string;
+    rightAligned: boolean;
+    isSinglePage(): boolean;
+    getPositionClass(): string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<Paginator, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<Paginator, "cax-paginator", never, { "pageLinkSize": { "alias": "pageLinkSize"; "required": false; }; "style": { "alias": "style"; "required": false; }; "styleClass": { "alias": "styleClass"; "required": false; }; "alwaysShow": { "alias": "alwaysShow"; "required": false; }; "dropdownAppendTo": { "alias": "dropdownAppendTo"; "required": false; }; "templateLeft": { "alias": "templateLeft"; "required": false; }; "templateRight": { "alias": "templateRight"; "required": false; }; "appendTo": { "alias": "appendTo"; "required": false; }; "dropdownScrollHeight": { "alias": "dropdownScrollHeight"; "required": false; }; "currentPageReportTemplate": { "alias": "currentPageReportTemplate"; "required": false; }; "showCurrentPageReport": { "alias": "showCurrentPageReport"; "required": false; }; "showFirstLastIcon": { "alias": "showFirstLastIcon"; "required": false; }; "totalRecords": { "alias": "totalRecords"; "required": false; }; "rows": { "alias": "rows"; "required": false; }; "rowsPerPageOptions": { "alias": "rowsPerPageOptions"; "required": false; }; "showJumpToPageDropdown": { "alias": "showJumpToPageDropdown"; "required": false; }; "showJumpToPageInput": { "alias": "showJumpToPageInput"; "required": false; }; "jumpToPageItemTemplate": { "alias": "jumpToPageItemTemplate"; "required": false; }; "showPageLinks": { "alias": "showPageLinks"; "required": false; }; "locale": { "alias": "locale"; "required": false; }; "dropdownItemTemplate": { "alias": "dropdownItemTemplate"; "required": false; }; "first": { "alias": "first"; "required": false; }; "rightAligned": { "alias": "rightAligned"; "required": false; }; }, { "onPageChange": "onPageChange"; }, ["templates"], never, false, never>;
+    static ngAcceptInputType_pageLinkSize: unknown;
+    static ngAcceptInputType_alwaysShow: unknown;
+    static ngAcceptInputType_showCurrentPageReport: unknown;
+    static ngAcceptInputType_showFirstLastIcon: unknown;
+    static ngAcceptInputType_totalRecords: unknown;
+    static ngAcceptInputType_rows: unknown;
+    static ngAcceptInputType_showJumpToPageDropdown: unknown;
+    static ngAcceptInputType_showJumpToPageInput: unknown;
+    static ngAcceptInputType_showPageLinks: unknown;
+    static ngAcceptInputType_rightAligned: unknown;
+}
+
+declare class PaginatorModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<PaginatorModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<PaginatorModule, [typeof Paginator], [typeof i2.CommonModule, typeof i3.DropdownModule, typeof i4.InputNumberModule, typeof i5.FormsModule, typeof i6.SharedModule, typeof i7.RippleModule, typeof i8.AngleDoubleLeftIcon, typeof i9.AngleDoubleRightIcon, typeof i10.AngleLeftIcon, typeof i11.AngleRightIcon], [typeof Paginator, typeof i3.DropdownModule, typeof i4.InputNumberModule, typeof i5.FormsModule, typeof i6.SharedModule]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<PaginatorModule>;
+}
+
+export { Paginator, PaginatorModule };
+export type { PaginatorState, PaginatorTemplates };

package/panel/index.d.ts

@@ -1,5 +1,187 @@
+import * as i0 from '@angular/core';
+import { TemplateRef, AfterContentInit, EventEmitter, QueryList, ElementRef, ChangeDetectorRef } from '@angular/core';
+import * as i2 from 'cax-design-system/api';
+import { BlockableUI, CaxTemplate } from 'cax-design-system/api';
+import { Nullable } from 'cax-design-system/ts-helpers';
+import * as i1 from '@angular/common';
+import * as i3 from 'cax-design-system/ripple';
+import * as i4 from 'cax-design-system/icons/plus';
+import * as i5 from 'cax-design-system/icons/minus';
+
 /**
- * Generated bundle index. Do not edit.
+ * Custom panel toggle event, emits before panel toggle.
+ * @see {@link Panel.onBeforeToggle}
+ * @group Events
  */
-/// <amd-module name="cax-design-system/panel" />
-export * from './public_api';
+interface PanelBeforeToggleEvent {
+    /**
+     * Browser event.
+     */
+    originalEvent: Event;
+    /**
+     * Collapsed state of the panel.
+     */
+    collapsed: boolean | undefined;
+}
+/**
+ * Custom panel toggle event, emits after panel toggle.
+ * @see {@link Panel.onAfterToggle}
+ * @extends {PanelBeforeToggleEvent}
+ * @group Events
+ */
+interface PanelAfterToggleEvent extends PanelBeforeToggleEvent {
+}
+/**
+ * Defines valid templates in Panel.
+ * @group Templates
+ */
+interface PanelTemplates {
+    /**
+     * Custom header template.
+     */
+    header(): TemplateRef<any>;
+    /**
+     * Custom content template.
+     */
+    content(): TemplateRef<any>;
+    /**
+     * Custom footer template.
+     */
+    footer(): TemplateRef<any>;
+    /**
+     * Custom icons template of the panel toggler.
+     * @param {Object} context - header icon data.
+     */
+    headericons(context: {
+        /**
+         * Collapsed state as a boolean
+         */
+        $implicit: boolean;
+    }): TemplateRef<{
+        $implicit: boolean;
+    }>;
+    /**
+     * Custom icons template of the panel header.
+     */
+    icons(): TemplateRef<any>;
+}
+
+/**
+ * Panel is a container with the optional content toggle feature.
+ * @group Components
+ */
+declare class Panel implements AfterContentInit, BlockableUI {
+    private el;
+    private cd;
+    /**
+     * Defines if content of panel can be expanded and collapsed.
+     * @group Props
+     */
+    toggleable: boolean | undefined;
+    /**
+     * Header text of the panel.
+     * @group Props
+     */
+    header: string | undefined;
+    /**
+     * Defines the initial state of panel content, supports one or two-way binding as well.
+     * @group Props
+     */
+    collapsed: boolean | undefined;
+    /**
+     * Inline style of the component.
+     * @group Props
+     */
+    style: {
+        [klass: string]: any;
+    } | null | undefined;
+    /**
+     * Style class of the component.
+     * @group Props
+     */
+    styleClass: string | undefined;
+    /**
+     * Position of the icons.
+     * @group Props
+     */
+    iconPos: 'start' | 'end' | 'center';
+    /**
+     * Expand icon of the toggle button.
+     * @group Props
+     * @deprecated since v15.4.2, use `headericons` template instead.
+     */
+    expandIcon: string | undefined;
+    /**
+     * Collapse icon of the toggle button.
+     * @group Props
+     * @deprecated since v15.4.2, use `headericons` template instead.
+     */
+    collapseIcon: string | undefined;
+    /**
+     * Specifies if header of panel cannot be displayed.
+     * @group Props
+     * @deprecated since v15.4.2, use `headericons` template instead.
+     */
+    showHeader: boolean;
+    /**
+     * Specifies the toggler element to toggle the panel content.
+     * @group Props
+     */
+    toggler: 'icon' | 'header';
+    /**
+     * Transition options of the animation.
+     * @group Props
+     */
+    transitionOptions: string;
+    /**
+     * Emitted when the collapsed changes.
+     * @param {boolean} value - New Value.
+     * @group Emits
+     */
+    collapsedChange: EventEmitter<boolean>;
+    /**
+     * Callback to invoke before panel toggle.
+     * @param {PanelBeforeToggleEvent} event - Custom panel toggle event
+     * @group Emits
+     */
+    onBeforeToggle: EventEmitter<PanelBeforeToggleEvent>;
+    /**
+     * Callback to invoke after panel toggle.
+     * @param {PanelAfterToggleEvent} event - Custom panel toggle event
+     * @group Emits
+     */
+    onAfterToggle: EventEmitter<PanelAfterToggleEvent>;
+    footerFacet: Nullable<TemplateRef<any>>;
+    templates: Nullable<QueryList<CaxTemplate>>;
+    iconTemplate: Nullable<TemplateRef<any>>;
+    animating: Nullable<boolean>;
+    headerTemplate: Nullable<TemplateRef<any>>;
+    contentTemplate: Nullable<TemplateRef<any>>;
+    footerTemplate: Nullable<TemplateRef<any>>;
+    headerIconTemplate: Nullable<TemplateRef<any>>;
+    readonly id: string;
+    get buttonAriaLabel(): string;
+    constructor(el: ElementRef, cd: ChangeDetectorRef);
+    ngAfterContentInit(): void;
+    onHeaderClick(event: MouseEvent): void;
+    onIconClick(event: MouseEvent): void;
+    toggle(event: MouseEvent): boolean;
+    expand(): void;
+    collapse(): void;
+    getBlockableElement(): HTMLElement;
+    onKeyDown(event: any): void;
+    onToggleDone(event: Event): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<Panel, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<Panel, "p-panel", never, { "toggleable": { "alias": "toggleable"; "required": false; }; "header": { "alias": "header"; "required": false; }; "collapsed": { "alias": "collapsed"; "required": false; }; "style": { "alias": "style"; "required": false; }; "styleClass": { "alias": "styleClass"; "required": false; }; "iconPos": { "alias": "iconPos"; "required": false; }; "expandIcon": { "alias": "expandIcon"; "required": false; }; "collapseIcon": { "alias": "collapseIcon"; "required": false; }; "showHeader": { "alias": "showHeader"; "required": false; }; "toggler": { "alias": "toggler"; "required": false; }; "transitionOptions": { "alias": "transitionOptions"; "required": false; }; }, { "collapsedChange": "collapsedChange"; "onBeforeToggle": "onBeforeToggle"; "onAfterToggle": "onAfterToggle"; }, ["footerFacet", "templates"], ["cax-header", "*", "cax-footer"], false, never>;
+    static ngAcceptInputType_toggleable: unknown;
+    static ngAcceptInputType_collapsed: unknown;
+    static ngAcceptInputType_showHeader: unknown;
+}
+declare class PanelModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<PanelModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<PanelModule, [typeof Panel], [typeof i1.CommonModule, typeof i2.SharedModule, typeof i3.RippleModule, typeof i4.PlusIcon, typeof i5.MinusIcon], [typeof Panel, typeof i2.SharedModule]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<PanelModule>;
+}
+
+export { Panel, PanelModule };
+export type { PanelAfterToggleEvent, PanelBeforeToggleEvent, PanelTemplates };