cax-design-system 2.4.1 → 2.5.0

package/resources/components/autocomplete/autocomplete.scss

@@ -108,6 +108,78 @@
         cursor: pointer;
         margin-left: 9px;
     }  
- 
+    .cax-autocomplete-sm {
+        height: 32px;
+        .cax-inputtext{
+            font-size: 16px !important;
+        }
+        .cax-autocomplete-clear-icon {
+            width: 16px !important;
+            height: 16px !important;
+        }
+        .cax-autocomplete-search-icon{
+            width: 16px !important;
+            height: 16px !important;
+        }
+
+       
+      }
+      
+      .cax-autocomplete-md {
+        height: 40px;
+        .cax-inputtext{
+            font-size: 20px !important;
+        }
+        .cax-autocomplete-clear-icon {
+            width: 20px !important;
+            height: 20px !important;
+            margin-top: -0.6rem;
+
+        }
+        .cax-autocomplete-search-icon{
+            width: 20px !important;
+            height: 20px !important;
+            margin-top: -0.6rem;
+        }
+        .cax-inputtext {
+            padding-left: 2rem !important;
+            padding-right: 2rem !important;
+          }
+          .cax-autocomplete-loader{
+            width: 20px !important;
+            height: 20px !important;
+            margin-top: -0.6rem;
+          }
+
+      }
+      
+      .cax-autocomplete-lg {
+        height: 48px;
+        .cax-inputtext{
+            font-size: 24px !important;
+        }
+        .cax-autocomplete-clear-icon {
+            width: 24px !important;
+            height: 24px !important;
+            margin-top: -0.7rem;
+        }
+        .cax-autocomplete-search-icon{
+            width: 24px !important;
+            height: 24px !important;
+            margin-top: -0.7rem;
+        }
+        .cax-autocomplete-loader{
+            width: 24px !important;
+            height: 24px !important;
+            margin-top: -0.7rem;
+          }
+        
+       .cax-inputtext {
+          padding-left: 2.4rem !important;
+          padding-right: 2.4rem !important;
+        }
+
+        
+      }
 }
 

package/resources/components/tabview/tabview.scss

@@ -2,7 +2,25 @@
     .cax-tabview-nav-container {
         position: relative;
     }
-
+    .cax-tabview-nav-container.block-mode {
+        display: block;
+    }
+    .cax-tabview-nav-container.flex-mode {
+        display: flex;
+    }
+    .cax-tabview-action-buttons {
+        display: flex;
+        align-items: center;
+        margin-left: auto;
+    }
+    
+    .cax-tabview-separator {
+        width: 2px;
+        height: 35px;
+        display: inline-block;
+        vertical-align: middle;
+        margin-right: 8px;
+    }
     .cax-tabview-scrollable .cax-tabview-nav-container {
         overflow: hidden;
         white-space: nowrap;

package/resources/components/timeline/timeline.scss

@@ -54,19 +54,14 @@
     .cax-timeline-event:last-child {
         min-height: 0;
     }
-
-    .cax-timeline-event-opposite {
-        flex: 1;
-        padding: 0 1rem;
-        min-width: 100px;
-    }
-
     .cax-timeline-event-content {
-        flex: 1;
         padding: 0 1rem;
         min-width: 100px;
         border-radius: 8px;
-        //margin-left: 8px;
+    }
+    
+    .cax-timeline-event-opposite:empty {
+        display: none;
     }
     .cax-timeline-event-separator {
         flex: 0;

package/selectbutton/public_api.d.ts

@@ -1,2 +1,3 @@
 export * from './selectbutton';
 export * from './selectbutton.interface';
+export * from './selectbutton.module';

package/selectbutton/selectbutton.d.ts

@@ -4,10 +4,6 @@ import { CaxTemplate } from 'cax-design-system/api';
 import { Nullable } from 'cax-design-system/ts-helpers';
 import { SelectButtonChangeEvent, SelectButtonOptionClickEvent } from './selectbutton.interface';
 import * as i0 from "@angular/core";
-import * as i1 from "@angular/common";
-import * as i2 from "cax-design-system/ripple";
-import * as i3 from "cax-design-system/api";
-import * as i4 from "cax-design-system/autofocus";
 export declare const SELECTBUTTON_VALUE_ACCESSOR: any;
 /**
  * SelectButton is used to choose single or multiple items from a list using buttons.
@@ -35,6 +31,7 @@ export declare class SelectButton implements ControlValueAccessor {
      * @group Props
      */
     optionDisabled: string | undefined;
+    invalid: boolean;
     /**
      * Whether selection can be cleared.
      * @group Props
@@ -121,7 +118,7 @@ export declare class SelectButton implements ControlValueAccessor {
     removeOption(option: any): void;
     isSelected(option: any): boolean;
     static ɵfac: i0.ɵɵFactoryDeclaration<SelectButton, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<SelectButton, "p-selectButton", never, { "options": { "alias": "options"; "required": false; }; "optionLabel": { "alias": "optionLabel"; "required": false; }; "optionValue": { "alias": "optionValue"; "required": false; }; "optionDisabled": { "alias": "optionDisabled"; "required": false; }; "unselectable": { "alias": "unselectable"; "required": false; }; "tabindex": { "alias": "tabindex"; "required": false; }; "multiple": { "alias": "multiple"; "required": false; }; "allowEmpty": { "alias": "allowEmpty"; "required": false; }; "style": { "alias": "style"; "required": false; }; "styleClass": { "alias": "styleClass"; "required": false; }; "ariaLabelledBy": { "alias": "ariaLabelledBy"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "dataKey": { "alias": "dataKey"; "required": false; }; "autofocus": { "alias": "autofocus"; "required": false; }; }, { "onOptionClick": "onOptionClick"; "onChange": "onChange"; }, ["itemTemplate"], never, false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SelectButton, "cax-selectButton", never, { "options": { "alias": "options"; "required": false; }; "optionLabel": { "alias": "optionLabel"; "required": false; }; "optionValue": { "alias": "optionValue"; "required": false; }; "optionDisabled": { "alias": "optionDisabled"; "required": false; }; "invalid": { "alias": "invalid"; "required": false; }; "unselectable": { "alias": "unselectable"; "required": false; }; "tabindex": { "alias": "tabindex"; "required": false; }; "multiple": { "alias": "multiple"; "required": false; }; "allowEmpty": { "alias": "allowEmpty"; "required": false; }; "style": { "alias": "style"; "required": false; }; "styleClass": { "alias": "styleClass"; "required": false; }; "ariaLabelledBy": { "alias": "ariaLabelledBy"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "dataKey": { "alias": "dataKey"; "required": false; }; "autofocus": { "alias": "autofocus"; "required": false; }; }, { "onOptionClick": "onOptionClick"; "onChange": "onChange"; }, ["itemTemplate"], never, false, never>;
     static ngAcceptInputType_unselectable: unknown;
     static ngAcceptInputType_tabindex: unknown;
     static ngAcceptInputType_multiple: unknown;
@@ -129,8 +126,3 @@ export declare class SelectButton implements ControlValueAccessor {
     static ngAcceptInputType_disabled: unknown;
     static ngAcceptInputType_autofocus: unknown;
 }
-export declare class SelectButtonModule {
-    static ɵfac: i0.ɵɵFactoryDeclaration<SelectButtonModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<SelectButtonModule, [typeof SelectButton], [typeof i1.CommonModule, typeof i2.RippleModule, typeof i3.SharedModule, typeof i4.AutoFocusModule], [typeof SelectButton, typeof i3.SharedModule]>;
-    static ɵinj: i0.ɵɵInjectorDeclaration<SelectButtonModule>;
-}

package/selectbutton/selectbutton.module.d.ts

@@ -0,0 +1,11 @@
+import * as i0 from "@angular/core";
+import * as i1 from "./selectbutton";
+import * as i2 from "@angular/common";
+import * as i3 from "cax-design-system/ripple";
+import * as i4 from "cax-design-system/api";
+import * as i5 from "cax-design-system/autofocus";
+export declare class SelectButtonModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<SelectButtonModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<SelectButtonModule, [typeof i1.SelectButton], [typeof i2.CommonModule, typeof i3.RippleModule, typeof i4.SharedModule, typeof i5.AutoFocusModule], [typeof i1.SelectButton, typeof i4.SharedModule]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<SelectButtonModule>;
+}

package/splitbutton/splitbutton.d.ts

@@ -43,7 +43,7 @@ export declare class SplitButton {
      * Defines the size of the button.
      * @group Props
      */
-    size: 'small' | 'large' | undefined | null;
+    size: 'small' | 'medium' | 'large' | undefined | null;
     /**
      * Add a plain textual class to the button without a background initially.
      * @group Props
@@ -196,7 +196,7 @@ export declare class SplitButton {
     ngOnInit(): void;
     ngAfterContentInit(): void;
     get containerClass(): {
-        [x: string]: boolean | "small" | "large";
+        [x: string]: boolean | "small" | "medium" | "large";
         'cax-splitbutton cax-component': boolean;
         'cax-button-raised': boolean;
         'cax-button-rounded': boolean;

package/tabview/tabview.d.ts

@@ -191,6 +191,15 @@ export declare class TabView implements AfterContentInit, AfterViewChecked, OnDe
      * @group Props
      */
     tabindex: number;
+    actionButton: any;
+    actionButtonSeverity: 'success' | 'info' | 'warning' | 'danger' | 'help' | 'primary' | 'secondary' | 'contrast';
+    actionButtonSize: 'small' | 'large' | null;
+    actionButtonOutlined: boolean;
+    actionButtonRounded: boolean;
+    actionButtonIcon: string | undefined;
+    actionButtonLoading: boolean;
+    actionButtonLink: boolean;
+    actionButtonDisabled: boolean;
     /**
      * Callback to invoke on tab change.
      * @param {TabViewChangeEvent} event - Custom tab change event
@@ -275,7 +284,7 @@ export declare class TabView implements AfterContentInit, AfterViewChecked, OnDe
     navBackward(): void;
     navForward(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<TabView, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<TabView, "cax-tabView", never, { "fullMode": { "alias": "fullMode"; "required": false; }; "style": { "alias": "style"; "required": false; }; "styleClass": { "alias": "styleClass"; "required": false; }; "controlClose": { "alias": "controlClose"; "required": false; }; "scrollable": { "alias": "scrollable"; "required": false; }; "activeIndex": { "alias": "activeIndex"; "required": false; }; "selectOnFocus": { "alias": "selectOnFocus"; "required": false; }; "nextButtonAriaLabel": { "alias": "nextButtonAriaLabel"; "required": false; }; "prevButtonAriaLabel": { "alias": "prevButtonAriaLabel"; "required": false; }; "autoHideButtons": { "alias": "autoHideButtons"; "required": false; }; "tabindex": { "alias": "tabindex"; "required": false; }; "mode": { "alias": "mode"; "required": false; }; "pinnedIndexes": { "alias": "pinnedIndexes"; "required": false; }; }, { "onChange": "onChange"; "onClose": "onClose"; "activeIndexChange": "activeIndexChange"; }, ["tabPanels", "templates"], ["*"], false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<TabView, "cax-tabView", never, { "fullMode": { "alias": "fullMode"; "required": false; }; "style": { "alias": "style"; "required": false; }; "styleClass": { "alias": "styleClass"; "required": false; }; "controlClose": { "alias": "controlClose"; "required": false; }; "scrollable": { "alias": "scrollable"; "required": false; }; "activeIndex": { "alias": "activeIndex"; "required": false; }; "selectOnFocus": { "alias": "selectOnFocus"; "required": false; }; "nextButtonAriaLabel": { "alias": "nextButtonAriaLabel"; "required": false; }; "prevButtonAriaLabel": { "alias": "prevButtonAriaLabel"; "required": false; }; "autoHideButtons": { "alias": "autoHideButtons"; "required": false; }; "tabindex": { "alias": "tabindex"; "required": false; }; "actionButton": { "alias": "actionButton"; "required": false; }; "actionButtonSeverity": { "alias": "actionButtonSeverity"; "required": false; }; "actionButtonSize": { "alias": "actionButtonSize"; "required": false; }; "actionButtonOutlined": { "alias": "actionButtonOutlined"; "required": false; }; "actionButtonRounded": { "alias": "actionButtonRounded"; "required": false; }; "actionButtonIcon": { "alias": "actionButtonIcon"; "required": false; }; "actionButtonLoading": { "alias": "actionButtonLoading"; "required": false; }; "actionButtonLink": { "alias": "actionButtonLink"; "required": false; }; "actionButtonDisabled": { "alias": "actionButtonDisabled"; "required": false; }; "mode": { "alias": "mode"; "required": false; }; "pinnedIndexes": { "alias": "pinnedIndexes"; "required": false; }; }, { "onChange": "onChange"; "onClose": "onClose"; "activeIndexChange": "activeIndexChange"; }, ["tabPanels", "templates"], ["*"], false, never>;
     static ngAcceptInputType_controlClose: unknown;
     static ngAcceptInputType_scrollable: unknown;
     static ngAcceptInputType_selectOnFocus: unknown;

package/tabview/tabview.module.d.ts

@@ -7,8 +7,9 @@ import * as i5 from "cax-design-system/ripple";
 import * as i6 from "cax-design-system/icons/times";
 import * as i7 from "cax-design-system/icons/chevronleft";
 import * as i8 from "cax-design-system/icons/chevronright";
+import * as i9 from "cax-design-system/button";
 export declare class TabViewModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<TabViewModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<TabViewModule, [typeof i1.TabView, typeof i1.TabPanel], [typeof i2.CommonModule, typeof i3.SharedModule, typeof i4.TooltipModule, typeof i5.RippleModule, typeof i6.TimesIcon, typeof i7.ChevronLeftIcon, typeof i8.ChevronRightIcon], [typeof i1.TabView, typeof i1.TabPanel, typeof i3.SharedModule]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<TabViewModule, [typeof i1.TabView, typeof i1.TabPanel], [typeof i2.CommonModule, typeof i3.SharedModule, typeof i4.TooltipModule, typeof i5.RippleModule, typeof i6.TimesIcon, typeof i7.ChevronLeftIcon, typeof i8.ChevronRightIcon, typeof i9.ButtonModule], [typeof i1.TabView, typeof i1.TabPanel, typeof i3.SharedModule]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<TabViewModule>;
 }