@allsorter/ui-components 0.0.404 → 0.0.406

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (7) hide show
  1. package/fesm2022/allsorter-ui-components.mjs +21 -7
  2. package/fesm2022/allsorter-ui-components.mjs.map +1 -1
  3. package/lib/input/input.component.d.ts +3 -2
  4. package/lib/newresumeheader/newresumeheader.component.d.ts +2 -1
  5. package/package.json +1 -1
  6. package/src/lib/input/input.component.html +12 -5
  7. package/src/lib/newresumeheader/newresumeheader.component.html +4 -4
package/lib/input/input.component.d.ts CHANGED
@@ -24,12 +24,13 @@ export declare class InputComponent implements ControlValueAccessor, OnInit, OnC
24
24
  searchfilter: boolean;
25
25
  multipleSelect: boolean;
26
26
  options: string[];
27
+ showDropdownFooter: boolean;
27
28
  /** Dropdown footer option configuration */
28
29
  dropdownFooterOption: {
29
30
  label: string;
30
31
  value: string;
31
32
  icon?: string;
32
- showFooter?: boolean;
33
+ iconName?: string;
33
34
  onClick?: () => void;
34
35
  dataTestId?: string;
35
36
  } | undefined;
@@ -93,5 +94,5 @@ export declare class InputComponent implements ControlValueAccessor, OnInit, OnC
93
94
  getSizeClass(): string;
94
95
  getCategoryClass(): string;
95
96
  static ɵfac: i0.ɵɵFactoryDeclaration<InputComponent, never>;
96
- static ɵcmp: i0.ɵɵComponentDeclaration<InputComponent, "al-input", never, { "labelText": { "alias": "labelText"; "required": false; }; "label": { "alias": "label"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "value": { "alias": "value"; "required": false; }; "formControlName": { "alias": "formControlName"; "required": false; }; "dataTestId": { "alias": "dataTestId"; "required": false; }; "type": { "alias": "type"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "helperText": { "alias": "helperText"; "required": false; }; "error": { "alias": "error"; "required": false; }; "errorMessage": { "alias": "errorMessage"; "required": false; }; "leftIcon": { "alias": "leftIcon"; "required": false; }; "rightIcon": { "alias": "rightIcon"; "required": false; }; "hasDropDown": { "alias": "hasDropDown"; "required": false; }; "dropDown": { "alias": "dropDown"; "required": false; }; "searchfilter": { "alias": "searchfilter"; "required": false; }; "multipleSelect": { "alias": "multipleSelect"; "required": false; }; "options": { "alias": "options"; "required": false; }; "dropdownFooterOption": { "alias": "dropdownFooterOption"; "required": false; }; "size": { "alias": "size"; "required": false; }; "types": { "alias": "types"; "required": false; }; "tooltip": { "alias": "tooltip"; "required": false; }; "tooltipPosition": { "alias": "tooltipPosition"; "required": false; }; "matDatepicker": { "alias": "matDatepicker"; "required": false; }; "dateType": { "alias": "dateType"; "required": false; }; }, { "change": "change"; "valueChange": "valueChange"; "onColorChange": "onColorChange"; "monthSelected": "monthSelected"; "yearSelected": "yearSelected"; "footerOptionClick": "footerOptionClick"; }, never, never, true, never>;
97
+ static ɵcmp: i0.ɵɵComponentDeclaration<InputComponent, "al-input", never, { "labelText": { "alias": "labelText"; "required": false; }; "label": { "alias": "label"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "value": { "alias": "value"; "required": false; }; "formControlName": { "alias": "formControlName"; "required": false; }; "dataTestId": { "alias": "dataTestId"; "required": false; }; "type": { "alias": "type"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "helperText": { "alias": "helperText"; "required": false; }; "error": { "alias": "error"; "required": false; }; "errorMessage": { "alias": "errorMessage"; "required": false; }; "leftIcon": { "alias": "leftIcon"; "required": false; }; "rightIcon": { "alias": "rightIcon"; "required": false; }; "hasDropDown": { "alias": "hasDropDown"; "required": false; }; "dropDown": { "alias": "dropDown"; "required": false; }; "searchfilter": { "alias": "searchfilter"; "required": false; }; "multipleSelect": { "alias": "multipleSelect"; "required": false; }; "options": { "alias": "options"; "required": false; }; "showDropdownFooter": { "alias": "showDropdownFooter"; "required": false; }; "dropdownFooterOption": { "alias": "dropdownFooterOption"; "required": false; }; "size": { "alias": "size"; "required": false; }; "types": { "alias": "types"; "required": false; }; "tooltip": { "alias": "tooltip"; "required": false; }; "tooltipPosition": { "alias": "tooltipPosition"; "required": false; }; "matDatepicker": { "alias": "matDatepicker"; "required": false; }; "dateType": { "alias": "dateType"; "required": false; }; }, { "change": "change"; "valueChange": "valueChange"; "onColorChange": "onColorChange"; "monthSelected": "monthSelected"; "yearSelected": "yearSelected"; "footerOptionClick": "footerOptionClick"; }, never, never, true, never>;
97
98
  }
package/lib/newresumeheader/newresumeheader.component.d.ts CHANGED
@@ -9,6 +9,7 @@ export declare class NewResumeHeaderComponent implements OnInit, OnDestroy, Afte
9
9
  private iconRegistry;
10
10
  title: string;
11
11
  showHeaderCheckbox: boolean;
12
+ showEyeIcon: boolean;
12
13
  headerCheckboxChecked: boolean;
13
14
  configEyeToggle: EyeIconConfig[];
14
15
  hiddenSection: {
@@ -162,5 +163,5 @@ export declare class NewResumeHeaderComponent implements OnInit, OnDestroy, Afte
162
163
  ngAfterViewInit(): void;
163
164
  ngOnDestroy(): void;
164
165
  static ɵfac: i0.ɵɵFactoryDeclaration<NewResumeHeaderComponent, never>;
165
- static ɵcmp: i0.ɵɵComponentDeclaration<NewResumeHeaderComponent, "al-newresumeheader", never, { "title": { "alias": "title"; "required": false; }; "showHeaderCheckbox": { "alias": "showHeaderCheckbox"; "required": false; }; "headerCheckboxChecked": { "alias": "headerCheckboxChecked"; "required": false; }; "configEyeToggle": { "alias": "configEyeToggle"; "required": false; }; "hiddenSection": { "alias": "hiddenSection"; "required": false; }; "buttonConfig": { "alias": "buttonConfig"; "required": false; }; "isLargeScreen": { "alias": "isLargeScreen"; "required": false; }; "popOutButtonLabel": { "alias": "popOutButtonLabel"; "required": false; }; "popOutButtonIcon": { "alias": "popOutButtonIcon"; "required": false; }; "popOutButtonTooltip": { "alias": "popOutButtonTooltip"; "required": false; }; "popOutButtonTooltipPosition": { "alias": "popOutButtonTooltipPosition"; "required": false; }; "showPopOutPanel": { "alias": "showPopOutPanel"; "required": false; }; "popOutMessage": { "alias": "popOutMessage"; "required": false; }; "dataTestId": { "alias": "dataTestId"; "required": false; }; "fieldVisibility": { "alias": "fieldVisibility"; "required": false; }; "index": { "alias": "index"; "required": false; }; "showBottomBorder": { "alias": "showBottomBorder"; "required": false; }; "borderColor": { "alias": "borderColor"; "required": false; }; }, { "titleChange": "titleChange"; "sectionToggled": "sectionToggled"; "headerCheckboxChange": "headerCheckboxChange"; "showHideToggleSection": "showHideToggleSection"; "buttonClicked": "buttonClicked"; "popOutButtonClick": "popOutButtonClick"; }, never, ["[header-left]", "[header-center-left]", "[header-center-center]", "[header-center-right]", "[header-right]", "[header-left]", "[header-center-right]", "[header-right]", "*"], true, never>;
166
+ static ɵcmp: i0.ɵɵComponentDeclaration<NewResumeHeaderComponent, "al-newresumeheader", never, { "title": { "alias": "title"; "required": false; }; "showHeaderCheckbox": { "alias": "showHeaderCheckbox"; "required": false; }; "showEyeIcon": { "alias": "showEyeIcon"; "required": false; }; "headerCheckboxChecked": { "alias": "headerCheckboxChecked"; "required": false; }; "configEyeToggle": { "alias": "configEyeToggle"; "required": false; }; "hiddenSection": { "alias": "hiddenSection"; "required": false; }; "buttonConfig": { "alias": "buttonConfig"; "required": false; }; "isLargeScreen": { "alias": "isLargeScreen"; "required": false; }; "popOutButtonLabel": { "alias": "popOutButtonLabel"; "required": false; }; "popOutButtonIcon": { "alias": "popOutButtonIcon"; "required": false; }; "popOutButtonTooltip": { "alias": "popOutButtonTooltip"; "required": false; }; "popOutButtonTooltipPosition": { "alias": "popOutButtonTooltipPosition"; "required": false; }; "showPopOutPanel": { "alias": "showPopOutPanel"; "required": false; }; "popOutMessage": { "alias": "popOutMessage"; "required": false; }; "dataTestId": { "alias": "dataTestId"; "required": false; }; "fieldVisibility": { "alias": "fieldVisibility"; "required": false; }; "index": { "alias": "index"; "required": false; }; "showBottomBorder": { "alias": "showBottomBorder"; "required": false; }; "borderColor": { "alias": "borderColor"; "required": false; }; }, { "titleChange": "titleChange"; "sectionToggled": "sectionToggled"; "headerCheckboxChange": "headerCheckboxChange"; "showHideToggleSection": "showHideToggleSection"; "buttonClicked": "buttonClicked"; "popOutButtonClick": "popOutButtonClick"; }, never, ["[header-left]", "[header-center-left]", "[header-center-center]", "[header-center-right]", "[header-right]", "[header-left]", "[header-center-right]", "[header-right]", "*"], true, never>;
166
167
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@allsorter/ui-components",
3
- "version": "0.0.404",
3
+ "version": "0.0.406",
4
4
  "peerDependencies": {
5
5
  "@angular/common": "^18.0.0",
6
6
  "@angular/core": "^18.0.0",
package/src/lib/input/input.component.html CHANGED
@@ -44,15 +44,22 @@
44
44
  <mat-option *ngFor="let option of options" [value]="option">{{ option }}</mat-option>
45
45
 
46
46
  <!-- Footer option -->
47
- <span *ngIf="dropdownFooterOption?.showFooter">
47
+ <span *ngIf="showDropdownFooter">
48
48
  <hr class="dropdown-footer-separator m-0">
49
49
  <mat-option [value]="dropdownFooterOption.value" (click)="onFooterOptionClick($event)"
50
50
  (keydown)="onFooterOptionClick($event)"
51
- [attr.data-test-id]="dropdownFooterOption.dataTestId || 'option-dropdown-footer'">
51
+ [attr.data-test-id]="dropdownFooterOption.dataTestId || 'option-dropdown-footer'"
52
+ class="dropdown-footer-option">
52
53
  <span style="display: flex; align-items: center; gap: 8px;">
53
- <img *ngIf="dropdownFooterOption.icon" [src]="dropdownFooterOption.icon"
54
+ <!-- Image icon -->
55
+ <img *ngIf="dropdownFooterOption.icon && !dropdownFooterOption.iconName" [src]="dropdownFooterOption.icon"
54
56
  style="width: 20px; height: 20px;" [alt]="dropdownFooterOption.label" />
55
- <span>{{ dropdownFooterOption.label }}</span>
57
+ <!-- Material icon -->
58
+ <mat-icon *ngIf="dropdownFooterOption.iconName"
59
+ style="font-size: 20px; width: 20px; height: 20px; color: #5473E8; margin-right: 0;">
60
+ {{ dropdownFooterOption.iconName }}
61
+ </mat-icon>
62
+ <span style="color: #5473E8;">{{ dropdownFooterOption.label }}</span>
56
63
  </span>
57
64
  </mat-option>
58
65
  </span>
@@ -97,4 +104,4 @@
97
104
 
98
105
  <mat-error *ngIf="false && helperText">{{ helperText }}</mat-error>
99
106
  <mat-hint *ngIf="helperText">{{ helperText }}</mat-hint>
100
- </mat-form-field>
107
+ </mat-form-field>
package/src/lib/newresumeheader/newresumeheader.component.html CHANGED
@@ -61,8 +61,8 @@
61
61
  </div>
62
62
  </div>
63
63
  <div right><ng-content select="[header-center-right]"></ng-content>
64
- <!-- Eye icon - uses actual isHidden value from config, always visible --><ng-container
65
- *ngIf="configEyeToggle && configEyeToggle.length > 0"><ng-container
64
+ <!-- Eye icon - uses actual isHidden value from config, visibility controlled by showEyeIcon --><ng-container
65
+ *ngIf="showEyeIcon && configEyeToggle && configEyeToggle.length > 0"><ng-container
66
66
  *ngFor="let eyeConfig of configEyeToggle"><ng-container *ngIf="eyeConfig"><ng-container
67
67
  *ngTemplateOutlet="eyeIconTemplate; context: { isHidden: eyeConfig.isHidden === true, accordionItem: accordionItem, configEyeToggle: eyeConfig }"></ng-container></ng-container></ng-container></ng-container>
68
68
  </div>
@@ -90,8 +90,8 @@
90
90
  <div class="hidden-write-sb" [ngClass]="{ 'hidden-write-white-sb': fieldVisibility?.isVisible === false }">Section hidden</div>
91
91
  </div>
92
92
  <div right><ng-content select="[header-center-right]"></ng-content>
93
- <!-- Eye icon - uses actual isHidden value from config, always visible --><ng-container
94
- *ngIf="configEyeToggle && configEyeToggle.length > 0"><ng-container
93
+ <!-- Eye icon - uses actual isHidden value from config, visibility controlled by showEyeIcon --><ng-container
94
+ *ngIf="showEyeIcon && configEyeToggle && configEyeToggle.length > 0"><ng-container
95
95
  *ngFor="let eyeConfig of configEyeToggle"><ng-container *ngIf="eyeConfig"><ng-container
96
96
  *ngTemplateOutlet="eyeIconTemplate; context: { isHidden: eyeConfig.isHidden === true, accordionItem: accordionItem, configEyeToggle: eyeConfig }"></ng-container></ng-container></ng-container></ng-container>
97
97
  </div>