@progress/kendo-angular-buttons 7.0.0-next.202111120840 → 7.0.2-dev.202201201235

package/dist/es/splitbutton/splitbutton.module.js

@@ -0,0 +1,34 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2021 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+import * as tslib_1 from "tslib";
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { PopupModule } from '@progress/kendo-angular-popup';
+import { ButtonModule } from './../button/button.module';
+import { ListModule } from './../listbutton/list.module';
+import { SplitButtonComponent } from './splitbutton.component';
+import { LocalizedSplitButtonMessagesDirective } from './localization/localized-messages.directive';
+import { SplitButtonCustomMessagesComponent } from './localization/custom-messages.component';
+/**
+ * @hidden
+ *
+ * The exported package module.
+ *
+ * The package exports:
+ * - `SplitButtonComponent`—The SplitButtonComponent component class.
+ */
+var SplitButtonModule = /** @class */ (function () {
+    function SplitButtonModule() {
+    }
+    SplitButtonModule = tslib_1.__decorate([
+        NgModule({
+            declarations: [SplitButtonComponent, LocalizedSplitButtonMessagesDirective, SplitButtonCustomMessagesComponent],
+            exports: [SplitButtonComponent, ListModule, LocalizedSplitButtonMessagesDirective, SplitButtonCustomMessagesComponent],
+            imports: [CommonModule, PopupModule, ButtonModule, ListModule]
+        })
+    ], SplitButtonModule);
+    return SplitButtonModule;
+}());
+export { SplitButtonModule };

package/dist/es/util.js

@@ -0,0 +1,97 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2021 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+/* tslint:disable:no-null-keyword */
+/* tslint:disable:no-bitwise */
+var resolvedPromise = Promise.resolve(null);
+/**
+ * @hidden
+ */
+export var isPresent = function (value) { return value !== null && value !== undefined; };
+/**
+ * @hidden
+ */
+export var tick = function (f) { return (resolvedPromise.then(f)); };
+/**
+ * @hidden
+ */
+function isDocumentNode(container) {
+    return container.nodeType === 9;
+}
+/**
+ * @hidden
+ */
+export function closest(element, selector) {
+    if (element.closest) {
+        return element.closest(selector);
+    }
+    var matches = Element.prototype.matches ?
+        function (el, sel) { return el.matches(sel); }
+        : function (el, sel) { return el.msMatchesSelector(sel); };
+    var node = element;
+    while (node && !isDocumentNode(node)) {
+        if (matches(node, selector)) {
+            return node;
+        }
+        node = node.parentNode;
+    }
+}
+/**
+ * @hidden
+ */
+export var replaceMessagePlaceholder = function (message, name, value) {
+    return message.replace(new RegExp("{\\s*" + name + "\\s*}", 'g'), value);
+};
+/**
+ * @hidden
+ */
+export var SIZES = {
+    small: 'sm',
+    medium: 'md',
+    large: 'lg'
+};
+var ROUNDNESS = {
+    small: 'sm',
+    medium: 'md',
+    large: 'lg',
+    full: 'full'
+};
+/**
+ * @hidden
+ *
+ * Returns the styling classes to be added and removed
+ */
+export var getStylingClasses = function (componentType, stylingOption, previousValue, newValue) {
+    switch (stylingOption) {
+        case 'size':
+            return {
+                toRemove: "k-" + componentType + "-" + SIZES[previousValue],
+                toAdd: newValue ? "k-" + componentType + "-" + SIZES[newValue] : null
+            };
+        case 'rounded':
+            return {
+                toRemove: "k-rounded-" + ROUNDNESS[previousValue],
+                toAdd: newValue ? "k-rounded-" + ROUNDNESS[newValue] : null
+            };
+        case 'fillMode':
+        case 'shape':
+            return {
+                toRemove: "k-" + componentType + "-" + previousValue,
+                toAdd: newValue ? "k-" + componentType + "-" + newValue : null
+            };
+        default:
+            break;
+    }
+};
+/**
+ * @hidden
+ *
+ * Returns the themeColor classes to be added and removed
+ */
+export var getThemeColorClasses = function (componentType, prevFillMode, fillMode, previousValue, newValue) {
+    return {
+        toRemove: "k-" + componentType + "-" + prevFillMode + "-" + previousValue,
+        toAdd: newValue ? "k-" + componentType + "-" + fillMode + "-" + newValue : null
+    };
+};

package/{button → dist/es2015/button}/button.directive.d.ts

@@ -2,15 +2,14 @@
 * Copyright © 2021 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
-import { SimpleChanges, ElementRef, EventEmitter, Renderer2 as Renderer, OnDestroy, NgZone } from '@angular/core';
+import { SimpleChanges, ElementRef, EventEmitter, Renderer2 as Renderer, OnDestroy, NgZone, AfterViewInit } from '@angular/core';
 import { KendoButtonService } from './button.service';
-import { ButtonLook } from '../button-look';
 import { LocalizationService } from '@progress/kendo-angular-l10n';
-import * as i0 from "@angular/core";
+import { ButtonFillMode, ButtonRounded, ButtonShape, ButtonSize, ButtonThemeColor } from '../common/models';
 /**
  * Represents the Kendo UI Button component for Angular.
  */
-export declare class ButtonDirective implements OnDestroy {
+export declare class ButtonDirective implements OnDestroy, AfterViewInit {
     private service;
     private ngZone;
     /**
@@ -23,54 +22,101 @@ export declare class ButtonDirective implements OnDestroy {
      *
      * @hidden
      */
-    get togglable(): boolean;
     /**
-     * @hidden
-     */
-    set togglable(value: boolean);
-    /**
-     * Adds visual weight to the Button and makes it primary.
-     */
-    primary: boolean;
-    /**
-     * Changes the visual appearance by using alternative styling options
-     * ([more information and examples]({% slug appearance_button %})).
-     *
-     * The available values are:
-     * * [`ButtonLook`]({% slug api_buttons_buttonlook %}) = `flat` | `outline`
-     * * `clear`
-     */
-    look: ButtonLook | 'clear';
+    * @hidden
+    */
+    togglable: boolean;
     /**
      * Sets the selected state of the Button.
      */
-    get selected(): boolean;
-    set selected(value: boolean);
+    selected: boolean;
     /**
      * @hidden
      */
-    set tabIndex(index: number);
-    get tabIndex(): number;
+    tabIndex: number;
     /**
      * Defines the name for an existing icon in a Kendo UI theme.
      * The icon is rendered inside the Button by a `span.k-icon` element.
      */
-    set icon(icon: string);
+    icon: string;
     /**
      * Defines a CSS class—or multiple classes separated by spaces—
      * which are applied to a `span` element inside the Button. Allows the usage of custom icons.
      */
-    set iconClass(iconClassName: string);
+    iconClass: string;
     /**
      * Defines a URL which is used for an `img` element inside the Button.
      * The URL can be relative or absolute. If relative, it is evaluated with relation to the web page URL.
      */
-    set imageUrl(imageUrl: string);
+    imageUrl: string;
     /**
      * If set to `true`, it disables the Button.
      */
-    set disabled(disabled: boolean);
-    get disabled(): boolean;
+    disabled: boolean;
+    /**
+     * The size property specifies the padding of the Button
+     * ([see example]({% slug appearance_button %}#toc-size)).
+     *
+     * The possible values are:
+     * * `'small'`
+     * * `'medium'` (default)
+     * * `'large'`
+     * * `null`
+     */
+    size: ButtonSize;
+    /**
+     * The rounded property specifies the border radius of the Button
+     * ([see example]({% slug appearance_button %}#toc-rounded)).
+     *
+     * The possible values are:
+     * * `'small'`
+     * * `'medium'` (default)
+     * * `'large'`
+     * * `'full'`
+     * * `null`
+     */
+    rounded: ButtonRounded;
+    /**
+     * The fillMode property specifies the background and border styles of the Button
+     * ([see example]({% slug appearance_button %}#toc-fillMode)).
+     *
+     * The possible values are:
+     * * `'flat'`
+     * * `'solid'` (default)
+     * * `'outline'`
+     * * `'clear'`
+     * * `'link'`
+     * * `null`
+     */
+    fillMode: ButtonFillMode;
+    /**
+     * The Button allows you to specify predefined theme colors.
+     * The theme color will be applied as a background and border color while also amending the text color accordingly
+     * ([see example]({% slug appearance_button %}#toc-themeColor)).
+     *
+     * The possible values are:
+     * * `'base'` (default)
+     * * `'primary'`
+     * * `'secondary'`
+     * * `'tertiary'`
+     * * `'info'`
+     * * `'success'`
+     * * `'warning'`
+     * * `'error'`
+     * * `'dark'`
+     * * `'light`'
+     * * `'inverse'`
+     */
+    themeColor: ButtonThemeColor;
+    /**
+     * The shape property specifies if the Button will form a rectangle or square.
+     * ([see example]({% slug appearance_button %}#toc-shape)).
+     *
+     * The possible values are:
+     * * `'square'`
+     * * `'rectangle'` (default)
+     */
+    shape: ButtonShape;
     /**
      * @hidden
      */
@@ -92,26 +138,25 @@ export declare class ButtonDirective implements OnDestroy {
     isIconClass: boolean;
     imageNode: HTMLImageElement;
     iconNode: HTMLElement;
+    iconSpanNode: HTMLElement;
+    private _size;
+    private _rounded;
+    private _shape;
+    private _fillMode;
+    private _themeColor;
     private localizationChangeSubscription;
-    private buttonLookChangeSubscription;
     private _focused;
     private direction;
     private _selected;
     private deferTimeout;
     private domEvents;
-    set isFocused(isFocused: boolean);
-    get isFocused(): boolean;
-    get classButton(): boolean;
-    get classPrimary(): boolean;
-    get isToggleable(): boolean;
-    get isFlat(): boolean;
-    get isBare(): boolean;
-    get isOutline(): boolean;
-    get isClear(): boolean;
-    get roleSetter(): string;
-    get classDisabled(): boolean;
-    get classActive(): boolean;
-    get getDirection(): string;
+    isFocused: boolean;
+    readonly classButton: boolean;
+    readonly isToggleable: boolean;
+    readonly roleSetter: string;
+    readonly classDisabled: boolean;
+    readonly classActive: boolean;
+    readonly getDirection: string;
     /**
      * @hidden
      */
@@ -120,9 +165,18 @@ export declare class ButtonDirective implements OnDestroy {
      * @hidden
      */
     onBlur(): void;
+    /**
+     * @hidden
+     */
+    primary: boolean;
+    /**
+     * @hidden
+     */
+    look: 'flat' | 'outline' | 'clear' | 'default';
     constructor(element: ElementRef, renderer: Renderer, service: KendoButtonService, localization: LocalizationService, ngZone: NgZone);
     ngOnInit(): void;
     ngOnChanges(change: SimpleChanges): void;
+    ngAfterViewInit(): void;
     ngAfterViewChecked(): void;
     ngOnDestroy(): void;
     /**
@@ -151,6 +205,7 @@ export declare class ButtonDirective implements OnDestroy {
     private hasText;
     private addImgIcon;
     private addIcon;
+    private addTextSpan;
     private prependChild;
     private defer;
     private iconSetter;
@@ -160,6 +215,6 @@ export declare class ButtonDirective implements OnDestroy {
     private setIconTextClasses;
     private toggleClass;
     private _onButtonClick;
-    static ɵfac: i0.ɵɵFactoryDeclaration<ButtonDirective, [null, null, { optional: true; }, null, null]>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<ButtonDirective, "button[kendoButton], span[kendoButton]", ["kendoButton"], { "toggleable": "toggleable"; "togglable": "togglable"; "primary": "primary"; "look": "look"; "selected": "selected"; "tabIndex": "tabIndex"; "icon": "icon"; "iconClass": "iconClass"; "imageUrl": "imageUrl"; "disabled": "disabled"; "role": "role"; }, { "selectedChange": "selectedChange"; "click": "click"; }, never>;
+    private handleClasses;
+    private handleThemeColor;
 }