@carefirst/library 6.2.8 → 6.3.1

package/index.d.ts

@@ -1,12 +1,12 @@
 import * as i0 from '@angular/core';
 import { OnChanges, EventEmitter, SimpleChanges, TemplateRef, Renderer2, ViewContainerRef, ElementRef, OnInit } from '@angular/core';
 import { IonContentCustomEvent, ScrollDetail } from '@ionic/core';
-import * as i22 from '@ionic/angular';
+import * as i23 from '@ionic/angular';
 import { IonPopover, IonInput, InputCustomEvent } from '@ionic/angular';
-import * as i24 from '@angular/forms';
+import * as i25 from '@angular/forms';
 import { ValidatorFn, FormGroup, FormControl } from '@angular/forms';
 import { BehaviorSubject, Subscription } from 'rxjs';
-import * as i23 from '@angular/common';
+import * as i24 from '@angular/common';
 
 declare class PageComponent implements OnChanges {
     centerH?: boolean | string | undefined;
@@ -42,9 +42,9 @@ declare class PageComponent implements OnChanges {
 
 /**==============================================
  * @interface     IconsT
- * @description   Short description
+ * @description   List of all the available icons
  */
-declare const iconsC: readonly ["home", "cog", "profile", "scan", "person", "appointment", "clock", "calendar", "email", "phone", "sign-out", "sign-in", "close", "check-mark", "rating-star-blank", "rating-star-filled", "back-arrow", "diagonal-up-arrow", "copy", "bell", "lock", "show-password", "hide-password", "circle-check", "circle-alert", "circle-close", "direction-switch", "direction-switch-flat", "direction-switch-block", "chat-bubbles", "phone-down", "mic", "no-mic", "button-forward-arrow", "button-check-box", "social-media-whatsapp", "social-media-facebook", "social-media-linkedin", "social-media-instagram", "social-media-google-mail", "instant-video-service", "instant-telephonic-service", "scheduled-video-service", "scheduled-telephonic-service", "vital-scan-service", "skin-scan-service", "acne-scan-service", "open-back-arrow", "open-forward-arrow", "open-up-arrow", "open-down-arrow", "single-document", "lightning", "microsoft-365", "user-dependent", "plus", "minus", "close-box", "speech-bubble", "camera-switch", "retry", "download", "upload", "upload-document", "print", "search", "flame", "bank-cards", "bank-card", "swipe-bank-card", "coin", "sign-out-curved", "sign-in-curved", "calendar-blank", "wallet", "info", "three-dot-colon", "adjustment", "triangle-alert", "party-popper", "trophy", "shield-check", "basic-phone", "google", "facebook", "m365", "send"];
+declare const iconsC: readonly ["home", "cog", "profile", "scan", "person", "appointment", "clock", "calendar", "email", "phone", "sign-out", "sign-in", "close", "check-mark", "rating-star-blank", "rating-star-filled", "back-arrow", "diagonal-up-arrow", "copy", "bell", "lock", "show-password", "hide-password", "circle-check", "circle-alert", "circle-close", "direction-switch", "direction-switch-flat", "direction-switch-block", "chat-bubbles", "phone-down", "mic", "no-mic", "button-forward-arrow", "button-check-box", "social-media-whatsapp", "social-media-facebook", "social-media-linkedin", "social-media-instagram", "social-media-google-mail", "instant-video-service", "instant-telephonic-service", "scheduled-video-service", "scheduled-telephonic-service", "vital-scan-service", "skin-scan-service", "acne-scan-service", "open-back-arrow", "open-forward-arrow", "open-up-arrow", "open-down-arrow", "single-document", "lightning", "user-dependent", "plus", "minus", "close-box", "speech-bubble", "camera-switch", "retry", "download", "upload", "upload-document", "print", "search", "bank-cards", "bank-card", "swipe-bank-card", "coin", "sign-out-curved", "sign-in-curved", "calendar-blank", "wallet", "info", "three-dot-colon", "adjustment", "triangle-alert", "shield-check", "basic-phone", "send"];
 type IconsT = (typeof iconsC)[number];
 /**==============================================
  * @interface     IconColorT
@@ -157,6 +157,36 @@ declare class IconComponent implements OnChanges {
     static ɵcmp: i0.ɵɵComponentDeclaration<IconComponent, "cf-icon", never, { "icon": { "alias": "icon"; "required": false; }; "height": { "alias": "height"; "required": false; }; "heightMobile": { "alias": "heightMobile"; "required": false; }; "heightDesktop": { "alias": "heightDesktop"; "required": false; }; "iconColor": { "alias": "iconColor"; "required": false; }; "iconColorCustom": { "alias": "iconColorCustom"; "required": false; }; }, {}, never, never, false, never>;
 }
 
+/**==============================================
+ * @interface     EmojisT
+ * @description   List of all the available emojis
+ */
+declare const emojisC: readonly ["google", "facebook", "m365", "microsoft-365", "trophy", "party-popper", "flame", "black-circle", "white-circle", "red-circle", "high-voltage", "red-heart", "collision", "cherry-blossom", "pill", "yellow-heart", "microscope", "drop-of-blood", "man-health-worker", "check-mark-button"];
+type EmojisT = (typeof emojisC)[number];
+
+type emoji_interface_d_EmojisT = EmojisT;
+declare const emoji_interface_d_emojisC: typeof emojisC;
+declare namespace emoji_interface_d {
+  export { emoji_interface_d_emojisC as emojisC };
+  export type { emoji_interface_d_EmojisT as EmojisT };
+}
+
+declare class EmojiComponent implements OnChanges {
+    emoji: EmojisT;
+    height?: number;
+    heightMobile?: number;
+    heightDesktop?: number;
+    inputEmoji: typeof this.emoji | undefined;
+    /**----------------------------------------------------------------
+     * @name          ngOnChanges
+     * @description   Update various values on input changes
+     * @returns       {void}
+     */
+    ngOnChanges(changes: SimpleChanges): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<EmojiComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<EmojiComponent, "cf-emoji", never, { "emoji": { "alias": "emoji"; "required": false; }; "height": { "alias": "height"; "required": false; }; "heightMobile": { "alias": "heightMobile"; "required": false; }; "heightDesktop": { "alias": "heightDesktop"; "required": false; }; }, {}, never, never, false, never>;
+}
+
 /**
  * Button Loader Directive
  *
@@ -761,6 +791,7 @@ declare namespace badge_interface_d {
  * @usage         <cf-badge
  *                  type="BadgeTypeT"
  *                  %icon%="IconsT"
+ *                  %emoji%="EmojisT"
  *                  %small%
  *                  %large%
  *                  style="
@@ -776,11 +807,13 @@ declare namespace badge_interface_d {
 declare class BadgeComponent implements OnChanges {
     type: BadgeTypeT;
     icon?: IconsT | undefined;
+    emoji?: EmojisT | undefined;
     small?: boolean | string | undefined;
     large?: boolean | string | undefined;
     stretch?: boolean | string | undefined;
     inputType: typeof this.type;
     inputIcon: typeof this.icon | undefined;
+    inputEmoji: typeof this.emoji | undefined;
     fontsize: number;
     inputSmall: boolean;
     inputLarge: boolean;
@@ -792,7 +825,7 @@ declare class BadgeComponent implements OnChanges {
      */
     ngOnChanges(changes: SimpleChanges): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<BadgeComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<BadgeComponent, "cf-badge", never, { "type": { "alias": "type"; "required": false; }; "icon": { "alias": "icon"; "required": false; }; "small": { "alias": "small"; "required": false; }; "large": { "alias": "large"; "required": false; }; "stretch": { "alias": "stretch"; "required": false; }; }, {}, never, ["*"], false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<BadgeComponent, "cf-badge", never, { "type": { "alias": "type"; "required": false; }; "icon": { "alias": "icon"; "required": false; }; "emoji": { "alias": "emoji"; "required": false; }; "small": { "alias": "small"; "required": false; }; "large": { "alias": "large"; "required": false; }; "stretch": { "alias": "stretch"; "required": false; }; }, {}, never, ["*"], false, never>;
 }
 
 declare class SpinnerComponent implements OnChanges {
@@ -959,7 +992,7 @@ declare class MixPComponent implements OnInit, OnChanges {
 
 declare class CareFirstLibraryModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<CareFirstLibraryModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<CareFirstLibraryModule, [typeof PageComponent, typeof ButtonComponent, typeof SpacerComponent, typeof IconComponent, typeof ButtonLoaderDirective, typeof NotificationComponent, typeof AlertComponent, typeof LogoComponent, typeof CalendarComponent, typeof FormValidationComponent, typeof FormInputComponent, typeof FormInputCurrencyComponent, typeof FormInputSelectComponent, typeof FormInputStringDateComponent, typeof FormInputTextAreaComponent, typeof FormInputSearchComponent, typeof ChatBubbleComponent, typeof BadgeComponent, typeof SpinnerComponent, typeof VerificationCodeComponent, typeof MixPComponent], [typeof i22.IonicModule, typeof i23.CommonModule, typeof i24.ReactiveFormsModule], [typeof PageComponent, typeof ButtonComponent, typeof SpacerComponent, typeof IconComponent, typeof ButtonLoaderDirective, typeof NotificationComponent, typeof AlertComponent, typeof LogoComponent, typeof CalendarComponent, typeof FormValidationComponent, typeof FormInputComponent, typeof FormInputCurrencyComponent, typeof FormInputSelectComponent, typeof FormInputStringDateComponent, typeof FormInputTextAreaComponent, typeof FormInputSearchComponent, typeof ChatBubbleComponent, typeof BadgeComponent, typeof SpinnerComponent, typeof VerificationCodeComponent, typeof MixPComponent]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<CareFirstLibraryModule, [typeof PageComponent, typeof ButtonComponent, typeof SpacerComponent, typeof IconComponent, typeof EmojiComponent, typeof ButtonLoaderDirective, typeof NotificationComponent, typeof AlertComponent, typeof LogoComponent, typeof CalendarComponent, typeof FormValidationComponent, typeof FormInputComponent, typeof FormInputCurrencyComponent, typeof FormInputSelectComponent, typeof FormInputStringDateComponent, typeof FormInputTextAreaComponent, typeof FormInputSearchComponent, typeof ChatBubbleComponent, typeof BadgeComponent, typeof SpinnerComponent, typeof VerificationCodeComponent, typeof MixPComponent], [typeof i23.IonicModule, typeof i24.CommonModule, typeof i25.ReactiveFormsModule], [typeof PageComponent, typeof ButtonComponent, typeof SpacerComponent, typeof IconComponent, typeof EmojiComponent, typeof ButtonLoaderDirective, typeof NotificationComponent, typeof AlertComponent, typeof LogoComponent, typeof CalendarComponent, typeof FormValidationComponent, typeof FormInputComponent, typeof FormInputCurrencyComponent, typeof FormInputSelectComponent, typeof FormInputStringDateComponent, typeof FormInputTextAreaComponent, typeof FormInputSearchComponent, typeof ChatBubbleComponent, typeof BadgeComponent, typeof SpinnerComponent, typeof VerificationCodeComponent, typeof MixPComponent]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<CareFirstLibraryModule>;
 }
 
@@ -1032,4 +1065,4 @@ declare class CFPFormValidators {
     static isValidCellNumber(dialCodes?: string[]): ValidatorFn;
 }
 
-export { AlertComponent, BadgeComponent, ButtonComponent, ButtonLoaderDirective, alert_interface_d as CFAlertI, badge_interface_d as CFBadgeI, verificationCode_interface_d as CFCodeInputI, icon_interface_d as CFIconI, input_interface_d as CFInputI, notification_interface_d as CFNotificationI, CFPFormValidators, spacer_interface_d as CFSpacerI, CalendarComponent, CareFirstLibraryModule, ChatBubbleComponent, FormInputComponent, FormInputCurrencyComponent, FormInputSearchComponent, FormInputSelectComponent, FormInputStringDateComponent, FormInputTextAreaComponent, FormValidationComponent, IconComponent, LogoComponent, MixPComponent, NotificationComponent, PageComponent, SpacerComponent, SpinnerComponent, VerificationCodeComponent };
+export { AlertComponent, BadgeComponent, ButtonComponent, ButtonLoaderDirective, alert_interface_d as CFAlertI, badge_interface_d as CFBadgeI, verificationCode_interface_d as CFCodeInputI, emoji_interface_d as CFEmojiI, icon_interface_d as CFIconI, input_interface_d as CFInputI, notification_interface_d as CFNotificationI, CFPFormValidators, spacer_interface_d as CFSpacerI, CalendarComponent, CareFirstLibraryModule, ChatBubbleComponent, EmojiComponent, FormInputComponent, FormInputCurrencyComponent, FormInputSearchComponent, FormInputSelectComponent, FormInputStringDateComponent, FormInputTextAreaComponent, FormValidationComponent, IconComponent, LogoComponent, MixPComponent, NotificationComponent, PageComponent, SpacerComponent, SpinnerComponent, VerificationCodeComponent };

package/package.json

@@ -1,14 +1,9 @@
 {
   "name": "@carefirst/library",
-  "version": "6.2.8",
+  "version": "6.3.1",
   "author": "FCS Dev Team",
   "private": false,
   "peerDependencies": {
-    "@angular/common": "^20.3.9",
-    "@angular/core": "^20.3.9",
-    "@angular/forms": "^20.3.9",
-    "@angular/router": "^20.3.9",
-    "@ionic/angular": "^8.7.5",
     "dayjs": "^1.11.18",
     "password-validator": "^5.3.0"
   },

package/public/styles/app.scss

@@ -147,16 +147,15 @@ cf-badge:has(div.stretch) {
 /*===============================================
 ============== Opacity Background  ==============
 ===============================================*/
+@mixin opacity($percentage) {
+  background-color: color-mix(in srgb, var(--cf-app-color-accent) $percentage, var(--cf-app-background-light)) !important;
+  border: 1px solid var(--cf-app-color-accent) !important;
+}
 
 .accent-background-opacity-25 {
-  background-color: var(--cf-app-color-accent-25) !important;
+  @include opacity(25%);
 }
 
 .accent-background-opacity-50 {
-  background-color: var(--cf-app-color-accent-50) !important;
-}
-
-//--- Add .accent-border to add a border to the element with the accent color opacity background
-[class^='accent-background-opacity-'].accent-border {
-  border: 1px solid var(--cf-app-color-accent) !important;
+  @include opacity(50%);
 }

package/public/styles/colors.scss

@@ -11,11 +11,11 @@
   --cf-app-color-accent-25: color-mix(in srgb, var(--cf-app-color-accent) 25%, #fff);
   --cf-app-color-accent-50: color-mix(in srgb, var(--cf-app-color-accent) 50%, #fff);
   //--- System Colors
-  --cf-app-system-color-success-100: #61C453;
+  --cf-app-system-color-success-100: #61c453;
   --cf-app-system-color-success-50: #c1f4bb;
   --cf-app-system-color-success-25: #e6ffe3;
   --cf-app-system-color-error-100: #ff3a69;
-  --cf-app-system-color-error-50: #ffc4D2;
+  --cf-app-system-color-error-50: #ffc4d2;
   --cf-app-system-color-error-25: #ffd8e1;
   --cf-app-system-color-warning-100: #ffc71f;
   --cf-app-system-color-warning-50: #fde18c;
@@ -25,3 +25,22 @@
   --cf-app-system-color-grey-outline: #bdbdbd;
   --cf-app-system-color-grey-disabled: #d9d9d9de;
 }
+
+/*===============================================
+============== Opacity Background  ==============
+===============================================*/
+
+//---<>
+
+// .accent-background-opacity-25 {
+//   background-color: var(--cf-app-color-accent-25) !important;
+// }
+
+// .accent-background-opacity-50 {
+//   background-color: var(--cf-app-color-accent-50) !important;
+// }
+
+// //--- Add .accent-border to add a border to the element with the accent color opacity background
+// [class^='accent-background-opacity-'].accent-border {
+//   border: 1px solid var(--cf-app-color-accent) !important;
+// }