cats-ui-lib 2.2.3 → 2.2.5

package/index.d.ts

@@ -171,6 +171,7 @@ declare class SingleSelectComponent implements OnInit, OnChanges, ControlValueAc
     singleSelectConfig: SingleSelectConfig;
     selectedOption: any;
     onSelection: EventEmitter<any>;
+    returnType: 'object' | 'text';
     showDropdown: boolean;
     searchText: string;
     inValid: boolean;
@@ -178,6 +179,7 @@ declare class SingleSelectComponent implements OnInit, OnChanges, ControlValueAc
     disableControl: boolean;
     onScroll: any;
     parentNativeElement: any;
+    selectedObj: any;
     selectedData: TemplateRef<any>;
     constructor(cd: ChangeDetectorRef, el: ElementRef);
     ngOnInit(): void;
@@ -245,7 +247,7 @@ declare class SingleSelectComponent implements OnInit, OnChanges, ControlValueAc
     onDivScroll(event: any): void;
     get filteredOptionsValue(): any[];
     static ɵfac: i0.ɵɵFactoryDeclaration<SingleSelectComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<SingleSelectComponent, "cats-ui-single-select", never, { "optionList": { "alias": "optionList"; "required": false; }; "singleSelectConfig": { "alias": "singleSelectConfig"; "required": false; }; "selectedOption": { "alias": "selectedOption"; "required": false; }; "parentNativeElement": { "alias": "parentNativeElement"; "required": false; }; }, { "onSelection": "onSelection"; "onScroll": "onScroll"; }, ["selectedData"], never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SingleSelectComponent, "cats-ui-single-select", never, { "optionList": { "alias": "optionList"; "required": false; }; "singleSelectConfig": { "alias": "singleSelectConfig"; "required": false; }; "selectedOption": { "alias": "selectedOption"; "required": false; }; "returnType": { "alias": "returnType"; "required": false; }; "parentNativeElement": { "alias": "parentNativeElement"; "required": false; }; }, { "onSelection": "onSelection"; "onScroll": "onScroll"; }, ["selectedData"], never, true, never>;
 }
 
 declare const MULTI_SELECT_CONTROL_VALUE_ACCESSOR: any;
@@ -1159,12 +1161,13 @@ declare class SidebarComponent {
     collapsedOpenFeature: string | null;
     activeItem: {
         moduleIndex: number;
-        featureIndex: number;
-        attrIndex: number;
+        featureIndex?: number;
+        attrIndex?: number;
     } | null;
     constructor(router: Router);
     /** A feature is expandable if it has at least one attribute */
     isExpandable(feature: SidebarFeature): boolean;
+    ngOnChanges(_changes: SimpleChanges): void;
     ngOnInit(): void;
     toggleCollapse(): void;
     expandedModules: Set<number>;
@@ -1172,8 +1175,8 @@ declare class SidebarComponent {
     isModuleExpanded(moduleIndex: number): boolean;
     toggleFeature(moduleIndex: number, featureIndex: number): void;
     isFeatureExpanded(moduleIndex: number, featureIndex: number): boolean;
-    setActiveItem(moduleIndex: number, featureIndex: number, attrIndex: number): void;
-    onFeatureClick(moduleIndex: number, featureIndex: number, feature: SidebarFeature): void;
+    setActiveItem(moduleIndex: number, featureIndex: number, attrIndex: number, navigate?: boolean): void;
+    onFeatureClick(moduleIndex: number, featureIndex: number, feature: SidebarFeature, navigate?: boolean): void;
     isActiveItem(moduleIndex: number, featureIndex?: number, attrIndex?: number): boolean;
     collapsedModuleIndex: number | null;
     collapsedFeatureIndex: number | null;
@@ -1185,7 +1188,7 @@ declare class SidebarComponent {
     navigateToItem(module: SidebarModule, feature?: SidebarFeature, attribute?: SidebarAttribute): void;
     handleOutsideClick(event: Event): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<SidebarComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<SidebarComponent, "cats-ui-sidebar", never, { "appMenus": { "alias": "appMenus"; "required": false; }; "sidebarConfig": { "alias": "sidebarConfig"; "required": false; }; }, { "activeSidebar": "activeSidebar"; }, never, never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SidebarComponent, "cats-ui-sidebar", never, { "appMenus": { "alias": "appMenus"; "required": false; }; "sidebarConfig": { "alias": "sidebarConfig"; "required": false; }; "activeItem": { "alias": "activeItem"; "required": false; }; }, { "activeSidebar": "activeSidebar"; }, never, never, true, never>;
 }
 
 export { AccordionComponent, AccordionItemComponent, AutoCompleteMultiSelectComponent, AutoCompleteMultiSelectConfig, AutoCompleteSingleSelectComponent, AutoCompleteSingleSelectConfig, CatsUiService, CatsUiTooltipDirective, CheckBoxConfig, CheckBoxSubtask, CheckboxButtonComponent, CustomDatePickerComponent, DROPDOWN_CONTROL_VALUE_ACCESSOR, DROPDOWN_CONTROL_VALUE_VALIDATOR, DialogBoxComponent, DialogBoxService, FileUploadComponent, HeaderComponent, InputComponent, InputConfig, MULTI_SELECT_CONTROL_VALUE_ACCESSOR, MULTI_SELECT_CONTROL_VALUE_VALIDATOR, MultiSelectComponent, MultiSelectConfig, OutsideClickDirective, RadioButtonComponent, SINGLE_SELECT_CONTROL_VALUE_ACCESSOR, SINGLE_SELECT_CONTROL_VALUE_VALIDATOR, SearchBoxComponent, SearchConfig, SidebarComponent, SingleSelectComponent, SingleSelectConfig, TabContentComponent, TabsetComponent, TimestampFilterComponent, ToggleConfig, ToogleButtonComponent, WizardComponent, WizardService, WizardStepDirective };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "cats-ui-lib",
-  "version": "2.2.3",
+  "version": "2.2.5",
   "peerDependencies": {
     "@angular/core": ">=18 <22",
     "@angular/common": ">=18 <22"

package/styles/_fonts.scss

@@ -1,82 +1,82 @@
-// @use url("https://fonts.googleapis.com/css2?family=Rethink+Sans:ital,wght@0,400..800;1,400..800&display=swap");
-
-@use "mixins" as *;
-
-:root {
-  --fs-6: 6px;
-  --fs-8: 8px;
-  --fs-10: 10px;
-  --fs-12: 12px;
-  --fs-14: 14px;
-  --fs-16: 16px;
-  --fs-18: 18px;
-  --fs-20: 20px;
-  --fs-24: 24px;
-  --fs-28: 28px;
-  --fs-30: 30px;
-  --fs-32: 32px;
-  --fs-42: 42px;
-  --fs-48: 48px;
-  --img-w: 28px;
-  --scale: 1;
-}
-
-@include width-range($tablet, $mediumDesktop) {
-  :root {
-    --scale: 1.5;
-    --fs-6: calc(6px / var(--scale));
-    --fs-8: calc(8px / var(--scale));
-    --fs-10: calc(10px / var(--scale));
-    --fs-12: calc(12px / var(--scale));
-    --fs-14: calc(14px / var(--scale));
-    --fs-16: calc(16px / var(--scale));
-    --fs-18: calc(18px / var(--scale));
-    --fs-20: calc(20px / var(--scale));
-    --fs-24: calc(24px / var(--scale));
-    --fs-28: calc(28px / var(--scale));
-    --fs-30: calc(30px / var(--scale));
-    --fs-32: calc(32px / var(--scale));
-    --fs-42: calc(42px / var(--scale));
-    --fs-48: calc(48px / var(--scale));
-  }
-}
-
-@include width-range($largeDesktop, $extraLargeDesktop) {
-  :root {
-    --scale: 1.33;
-    --fs-6: calc(6px / var(--scale));
-    --fs-8: calc(8px / var(--scale));
-    --fs-10: calc(10px / var(--scale));
-    --fs-12: calc(12px / var(--scale));
-    --fs-14: calc(14px / var(--scale));
-    --fs-16: calc(16px / var(--scale));
-    --fs-18: calc(18px / var(--scale));
-    --fs-20: calc(20px / var(--scale));
-    --fs-24: calc(24px / var(--scale));
-    --fs-28: calc(28px / var(--scale));
-    --fs-30: calc(30px / var(--scale));
-    --fs-32: calc(32px / var(--scale));
-    --fs-42: calc(42px / var(--scale));
-    --fs-48: calc(48px / var(--scale));
-  }
-}
-
-@include width-range($xxlargeDesktop, $ultraWideDesktop) {
-  :root {
-    --scale: 1.25;
-    --fs-6: calc(6px / var(--scale));
-    --fs-8: calc(8px / var(--scale));
-    --fs-10: calc(10px / var(--scale));
-    --fs-12: calc(12px / var(--scale));
-    --fs-14: calc(14px / var(--scale));
-    --fs-16: calc(16px / var(--scale));
-    --fs-18: calc(18px / var(--scale));
-    --fs-20: calc(20px / var(--scale));
-    --fs-24: calc(24px / var(--scale));
-    --fs-28: calc(28px / var(--scale));
-    --fs-30: calc(30px / var(--scale));
-    --fs-32: calc(32px / var(--scale));
-    --fs-42: calc(42px / var(--scale));
-    --fs-48: calc(48px / var(--scale));
-  }
-}
+// @use url("https://fonts.googleapis.com/css2?family=Rethink+Sans:ital,wght@0,400..800;1,400..800&display=swap");
+
+@use "mixins" as *;
+
+:root {
+  --fs-6: 6px;
+  --fs-8: 8px;
+  --fs-10: 10px;
+  --fs-12: 12px;
+  --fs-14: 14px;
+  --fs-16: 16px;
+  --fs-18: 18px;
+  --fs-20: 20px;
+  --fs-24: 24px;
+  --fs-28: 28px;
+  --fs-30: 30px;
+  --fs-32: 32px;
+  --fs-42: 42px;
+  --fs-48: 48px;
+  --img-w: 28px;
+  --scale: 1;
+}
+
+@include width-range($tablet, $mediumDesktop) {
+  :root {
+    --scale: 1.5;
+    --fs-6: calc(6px / var(--scale));
+    --fs-8: calc(8px / var(--scale));
+    --fs-10: calc(10px / var(--scale));
+    --fs-12: calc(12px / var(--scale));
+    --fs-14: calc(14px / var(--scale));
+    --fs-16: calc(16px / var(--scale));
+    --fs-18: calc(18px / var(--scale));
+    --fs-20: calc(20px / var(--scale));
+    --fs-24: calc(24px / var(--scale));
+    --fs-28: calc(28px / var(--scale));
+    --fs-30: calc(30px / var(--scale));
+    --fs-32: calc(32px / var(--scale));
+    --fs-42: calc(42px / var(--scale));
+    --fs-48: calc(48px / var(--scale));
+  }
+}
+
+@include width-range($largeDesktop, $extraLargeDesktop) {
+  :root {
+    --scale: 1.33;
+    --fs-6: calc(6px / var(--scale));
+    --fs-8: calc(8px / var(--scale));
+    --fs-10: calc(10px / var(--scale));
+    --fs-12: calc(12px / var(--scale));
+    --fs-14: calc(14px / var(--scale));
+    --fs-16: calc(16px / var(--scale));
+    --fs-18: calc(18px / var(--scale));
+    --fs-20: calc(20px / var(--scale));
+    --fs-24: calc(24px / var(--scale));
+    --fs-28: calc(28px / var(--scale));
+    --fs-30: calc(30px / var(--scale));
+    --fs-32: calc(32px / var(--scale));
+    --fs-42: calc(42px / var(--scale));
+    --fs-48: calc(48px / var(--scale));
+  }
+}
+
+@include width-range($xxlargeDesktop, $ultraWideDesktop) {
+  :root {
+    --scale: 1.25;
+    --fs-6: calc(6px / var(--scale));
+    --fs-8: calc(8px / var(--scale));
+    --fs-10: calc(10px / var(--scale));
+    --fs-12: calc(12px / var(--scale));
+    --fs-14: calc(14px / var(--scale));
+    --fs-16: calc(16px / var(--scale));
+    --fs-18: calc(18px / var(--scale));
+    --fs-20: calc(20px / var(--scale));
+    --fs-24: calc(24px / var(--scale));
+    --fs-28: calc(28px / var(--scale));
+    --fs-30: calc(30px / var(--scale));
+    --fs-32: calc(32px / var(--scale));
+    --fs-42: calc(42px / var(--scale));
+    --fs-48: calc(48px / var(--scale));
+  }
+}

package/styles/_functions.scss

@@ -1,10 +1,10 @@
-@use "sass:math";
-$font-size: 12px;
-html {
-  font-size: $font-size;
-}
-@function rem($pxValue) {
-  // @return calc(math.div($pxValue, $font-size) * 1rem / var(--scale));
-  $val: calc($pxValue/$font-size);
-  @return calc($val * 1rem / var(--scale));
-}
+@use "sass:math";
+$font-size: 12px;
+html {
+  font-size: $font-size;
+}
+@function rem($pxValue) {
+  // @return calc(math.div($pxValue, $font-size) * 1rem / var(--scale));
+  $val: calc($pxValue/$font-size);
+  @return calc($val * 1rem / var(--scale));
+}

package/styles/_index.scss

@@ -1,6 +1,6 @@
-@forward "variables";
-@forward "mixins";
-@forward "functions";
-@forward "utilities";
-@forward "fonts";
-@forward "reset";
+@forward "variables";
+@forward "mixins";
+@forward "functions";
+@forward "utilities";
+@forward "fonts";
+@forward "reset";

package/styles/_mixins.scss

@@ -1,65 +1,65 @@
-@use "variables" as *;
-@use "functions" as *;
-
-$tablet: 1024px;
-$mediumDesktop: 1280px;
-$largeDesktop: 1360px;
-$extraLargeDesktop: 1440px;
-$xxlargeDesktop: 1536px;
-$ultraWideDesktop: 1919px;
-
-// --------------- MEDIA QUERY ------------------------
-@mixin width-range($min, $max) {
-  @media only screen and (min-width: $min) and (max-width: $max) {
-    @content;
-  }
-}
-
-// -------------- BOX HEIGHT AND WIDTH -------
-@mixin box($width, $height: 100%) {
-  width: $width;
-  height: $height;
-}
-
-// ------------- FONT STYLE
-@mixin fontStyle($fontSize, $lineHeight, $fontWeight: 400) {
-  font-size: $fontSize;
-  line-height: $lineHeight;
-  font-weight: $fontWeight;
-}
-
-// -------------  FLEX PROPERTY ---------------------
-@mixin flex(
-  $justify: flex-start,
-  $align: stretch,
-  $gap: 0,
-  $direction: row,
-  $wrap: nowrap
-) {
-  display: flex;
-  flex-direction: $direction;
-  justify-content: $justify;
-  align-items: $align;
-  flex-wrap: $wrap;
-  gap: $gap;
-}
-
-// USE CASE: IF YOU WANT ONLY 2 PROP. THEN OTHER PROP WILL APPLY AS DEFAULT PROP.
-// @include flex(center, stretch,row, wrap, 10px);
-
-// -------------  Border PROPERTY with width,color and radius ---------------------
-@mixin border(
-  $width: rem(1px),
-  $style: solid,
-  $color: var(--border-core-default),
-  $radius: rem(4px)
-) {
-  border: $width $style $color;
-  border-radius: $radius;
-}
-
-// Positioning element
-@mixin position($top, $left) {
-  top: $top;
-  left: $left;
-}
+@use "variables" as *;
+@use "functions" as *;
+
+$tablet: 1024px;
+$mediumDesktop: 1280px;
+$largeDesktop: 1360px;
+$extraLargeDesktop: 1440px;
+$xxlargeDesktop: 1536px;
+$ultraWideDesktop: 1919px;
+
+// --------------- MEDIA QUERY ------------------------
+@mixin width-range($min, $max) {
+  @media only screen and (min-width: $min) and (max-width: $max) {
+    @content;
+  }
+}
+
+// -------------- BOX HEIGHT AND WIDTH -------
+@mixin box($width, $height: 100%) {
+  width: $width;
+  height: $height;
+}
+
+// ------------- FONT STYLE
+@mixin fontStyle($fontSize, $lineHeight, $fontWeight: 400) {
+  font-size: $fontSize;
+  line-height: $lineHeight;
+  font-weight: $fontWeight;
+}
+
+// -------------  FLEX PROPERTY ---------------------
+@mixin flex(
+  $justify: flex-start,
+  $align: stretch,
+  $gap: 0,
+  $direction: row,
+  $wrap: nowrap
+) {
+  display: flex;
+  flex-direction: $direction;
+  justify-content: $justify;
+  align-items: $align;
+  flex-wrap: $wrap;
+  gap: $gap;
+}
+
+// USE CASE: IF YOU WANT ONLY 2 PROP. THEN OTHER PROP WILL APPLY AS DEFAULT PROP.
+// @include flex(center, stretch,row, wrap, 10px);
+
+// -------------  Border PROPERTY with width,color and radius ---------------------
+@mixin border(
+  $width: rem(1px),
+  $style: solid,
+  $color: var(--border-core-default),
+  $radius: rem(4px)
+) {
+  border: $width $style $color;
+  border-radius: $radius;
+}
+
+// Positioning element
+@mixin position($top, $left) {
+  top: $top;
+  left: $left;
+}

package/styles/_reset.scss

@@ -1,69 +1,69 @@
-// Box Sizing
-*,
-*::before,
-*::after {
-  box-sizing: border-box;
-  margin: 0;
-  padding: 0;
-  font-family: "Open Sans", sans-serif;
-}
-
-body {
-  font-size: 100%;
-}
-
-// Font-inflation
-html {
-  -moz-text-size-adjust: none;
-  -webkit-text-size-adjust: none;
-  -ms-text-size-adjust: none;
-  text-size-adjust: none;
-}
-
-// Remove default margin and padding
-h1,
-h2,
-h3,
-h4,
-h5,
-h6,
-ul,
-ol p {
-  margin: 0;
-  padding: 0;
-  text-wrap: pretty;
-}
-
-// Remove list styles on ul, ol elements
-ul[role="list"],
-ol[role="list"] {
-  list-style: none;
-}
-
-ul {
-  list-style: none;
-}
-
-// images
-img,
-picture {
-  max-width: 100%;
-  display: block;
-}
-
-::-webkit-scrollbar {
-  width: 8px;
-  height: 8px;
-}
-
-::-webkit-scrollbar-thumb {
-  background: var(--neutral-200);
-  border-radius: 8px;
-}
-
-input,
-select,
-textarea {
-  outline: none;
-  box-shadow: none;
-}
+// Box Sizing
+*,
+*::before,
+*::after {
+  box-sizing: border-box;
+  margin: 0;
+  padding: 0;
+  font-family: "Open Sans", sans-serif;
+}
+
+body {
+  font-size: 100%;
+}
+
+// Font-inflation
+html {
+  -moz-text-size-adjust: none;
+  -webkit-text-size-adjust: none;
+  -ms-text-size-adjust: none;
+  text-size-adjust: none;
+}
+
+// Remove default margin and padding
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+ul,
+ol p {
+  margin: 0;
+  padding: 0;
+  text-wrap: pretty;
+}
+
+// Remove list styles on ul, ol elements
+ul[role="list"],
+ol[role="list"] {
+  list-style: none;
+}
+
+ul {
+  list-style: none;
+}
+
+// images
+img,
+picture {
+  max-width: 100%;
+  display: block;
+}
+
+::-webkit-scrollbar {
+  width: 8px;
+  height: 8px;
+}
+
+::-webkit-scrollbar-thumb {
+  background: var(--border-core-default);
+  border-radius: 8px;
+}
+
+input,
+select,
+textarea {
+  outline: none;
+  box-shadow: none;
+}