@icure/cardinal-prescription-be-angular
Version:
This is a Belgian-specific Angular application for healthcare professionals to manage electronic prescriptions with SAM. Created by iCure.
3,797 lines • 469 kB
JavaScript
import * as i0 from '@angular/core';
import { Input, ChangeDetectionStrategy, Component, Injectable, ViewChild, EventEmitter, Output, HostListener, ViewChildren, forwardRef } from '@angular/core';
import * as i1$1 from '@angular/common';
import { NgIf, NgTemplateOutlet, NgClass, NgForOf, CommonModule } from '@angular/common';
import * as i1 from '@angular/forms';
import { FormControl, ReactiveFormsModule, FormsModule, NG_VALUE_ACCESSOR, Validators } from '@angular/forms';
import { BehaviorSubject, Subject, debounceTime, takeUntil } from 'rxjs';
import { Medication, Code, PrescriptionRequest, fhcStsApi, fhcRecipeApi, Duration, Medicinalproduct, Substanceproduct } from '@icure/be-fhc-lite-api';
import { AmpStatus, DmppCodeType } from '@icure/cardinal-be-sam-sdk';
import { makeParser } from '@icure/medication-sdk';
import { v4 } from 'uuid';
import JsBarcode from 'jsbarcode';
class SearchIcnComponent {
color = 'currentColor';
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: SearchIcnComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: SearchIcnComponent, isStandalone: true, selector: "cardinal-search-icn", inputs: { color: "color" }, ngImport: i0, template: "<svg\n width=\"20px\"\n height=\"20px\"\n viewBox=\"0 0 20 20\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <g mask=\"url(#mask0_16_247)\">\n <path\n d=\"M16.3333 17.5L11.0833 12.25C10.6667 12.5833 10.1875 12.8472 9.64583 13.0417C9.10417 13.2361 8.52778 13.3333 7.91667 13.3333C6.40278 13.3333 5.12153 12.809 4.07292 11.7604C3.02431 10.7118 2.5 9.43056 2.5 7.91667C2.5 6.40278 3.02431 5.12153 4.07292 4.07292C5.12153 3.02431 6.40278 2.5 7.91667 2.5C9.43056 2.5 10.7118 3.02431 11.7604 4.07292C12.809 5.12153 13.3333 6.40278 13.3333 7.91667C13.3333 8.52778 13.2361 9.10417 13.0417 9.64583C12.8472 10.1875 12.5833 10.6667 12.25 11.0833L17.5 16.3333L16.3333 17.5ZM7.91667 11.6667C8.95833 11.6667 9.84375 11.3021 10.5729 10.5729C11.3021 9.84375 11.6667 8.95833 11.6667 7.91667C11.6667 6.875 11.3021 5.98958 10.5729 5.26042C9.84375 4.53125 8.95833 4.16667 7.91667 4.16667C6.875 4.16667 5.98958 4.53125 5.26042 5.26042C4.53125 5.98958 4.16667 6.875 4.16667 7.91667C4.16667 8.95833 4.53125 9.84375 5.26042 10.5729C5.98958 11.3021 6.875 11.6667 7.91667 11.6667Z\"\n [attr.fill]=\"color\" />\n </g>\n</svg>\n", styles: [""], changeDetection: i0.ChangeDetectionStrategy.OnPush });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: SearchIcnComponent, decorators: [{
type: Component,
args: [{ selector: 'cardinal-search-icn', imports: [], changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, template: "<svg\n width=\"20px\"\n height=\"20px\"\n viewBox=\"0 0 20 20\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <g mask=\"url(#mask0_16_247)\">\n <path\n d=\"M16.3333 17.5L11.0833 12.25C10.6667 12.5833 10.1875 12.8472 9.64583 13.0417C9.10417 13.2361 8.52778 13.3333 7.91667 13.3333C6.40278 13.3333 5.12153 12.809 4.07292 11.7604C3.02431 10.7118 2.5 9.43056 2.5 7.91667C2.5 6.40278 3.02431 5.12153 4.07292 4.07292C5.12153 3.02431 6.40278 2.5 7.91667 2.5C9.43056 2.5 10.7118 3.02431 11.7604 4.07292C12.809 5.12153 13.3333 6.40278 13.3333 7.91667C13.3333 8.52778 13.2361 9.10417 13.0417 9.64583C12.8472 10.1875 12.5833 10.6667 12.25 11.0833L17.5 16.3333L16.3333 17.5ZM7.91667 11.6667C8.95833 11.6667 9.84375 11.3021 10.5729 10.5729C11.3021 9.84375 11.6667 8.95833 11.6667 7.91667C11.6667 6.875 11.3021 5.98958 10.5729 5.26042C9.84375 4.53125 8.95833 4.16667 7.91667 4.16667C6.875 4.16667 5.98958 4.53125 5.26042 5.26042C4.53125 5.98958 4.16667 6.875 4.16667 7.91667C4.16667 8.95833 4.53125 9.84375 5.26042 10.5729C5.98958 11.3021 6.875 11.6667 7.91667 11.6667Z\"\n [attr.fill]=\"color\" />\n </g>\n</svg>\n" }]
}], propDecorators: { color: [{
type: Input,
args: [{ required: true }]
}] } });
const convertYyyyMmDdNumberToIsoDate = (dateNumber) => {
const year = Math.floor(dateNumber / 10000);
const month = Math.floor((dateNumber % 10000) / 100)
.toString()
.padStart(2, '0');
const day = (dateNumber % 100).toString().padStart(2, '0');
return `${year}-${month}-${day}`;
};
const getTreatmentStartDate = (prescribedMedication) => {
if (prescribedMedication?.medication.beginMoment) {
return convertYyyyMmDdNumberToIsoDate(prescribedMedication?.medication.beginMoment);
}
else {
return new Date().toISOString().split('T')[0];
}
};
const getExecutableUntilDate = (prescribedMedication) => {
if (prescribedMedication?.medication.endMoment) {
return convertYyyyMmDdNumberToIsoDate(prescribedMedication.medication.endMoment);
}
else {
const startDay = new Date();
const nextYear = new Date(startDay);
nextYear.setFullYear(startDay.getFullYear() + 1);
return nextYear.toISOString().split('T')[0];
}
};
const formatToDayMonthYear = (timestamp) => {
if (!timestamp) {
return undefined;
}
else {
const date = new Date(timestamp);
const day = String(date.getDate()).padStart(2, '0');
const month = String(date.getMonth() + 1).padStart(2, '0'); // Months are zero-based
const year = date.getFullYear();
return `${day}-${month}-${year}`;
}
};
function dateDecode(date) {
return date > 99990000
? new Date(date / 10000000000, ((date / 100000000) % 100) - 1, (date / 1000000) % 100)
: new Date(date / 10000, ((date / 100) % 100) - 1, date % 100);
}
function dateEncode(date) {
return (date.getFullYear() * 10000 + (date.getMonth() + 1) * 100 + date.getDate());
}
function offsetDate(date, offsetInDays) {
const result = new Date(dateDecode(date)); // Decode the date
result.setDate(result.getDate() + offsetInDays); // Add or subtract the offset in days
return dateEncode(result); // Encode it back to the required format
}
class TooltipContextService {
dropdownRectSubject = new BehaviorSubject(null);
dropdownRect$ = this.dropdownRectSubject.asObservable();
setDropdownRect(rect) {
this.dropdownRectSubject.next(rect);
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: TooltipContextService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: TooltipContextService, providedIn: 'root' });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: TooltipContextService, decorators: [{
type: Injectable,
args: [{
providedIn: 'root',
}]
}] });
class TooltipComponent {
tooltipContext;
cdr;
content;
contentSnippet;
iconSnippet;
orientation;
tooltipRef;
constructor(tooltipContext, cdr) {
this.tooltipContext = tooltipContext;
this.cdr = cdr;
}
active = false;
tooltipOrientation = this.orientation ?? 'bl';
rectSub;
hasViewInitialized = false;
latestRect = null;
ngOnInit() {
// Subscribe to reactive rect updates
this.rectSub = this.tooltipContext.dropdownRect$.subscribe(rect => {
this.latestRect = rect;
if (rect && this.hasViewInitialized) {
this.repositionTooltip(rect);
}
});
}
ngAfterViewInit() {
this.hasViewInitialized = true;
// Tooltip view now ready — safe to reposition if we already got the rect
if (this.latestRect) {
this.repositionTooltip(this.latestRect);
}
}
repositionTooltip(rect) {
const tooltipElement = this.tooltipRef?.nativeElement;
if (!tooltipElement || !rect)
return;
const tooltipRect = this.tooltipRef?.nativeElement?.getBoundingClientRect();
const widthOfTooltipPopUp = 300;
// By default, we don't set up top origination, bcs it's not unfriendly
if (rect.right - tooltipRect.right > widthOfTooltipPopUp) {
this.tooltipOrientation = 'bl';
}
else if (rect.right - tooltipRect.right < widthOfTooltipPopUp ||
rect.right - tooltipRect.right === widthOfTooltipPopUp) {
this.tooltipOrientation = 'br';
}
this.cdr.markForCheck();
}
ngOnDestroy() {
this.rectSub?.unsubscribe();
}
handleMouseEnter() {
this.active = true;
this.cdr.markForCheck();
}
handleMouseLeave() {
this.active = false;
this.cdr.markForCheck();
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: TooltipComponent, deps: [{ token: TooltipContextService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: TooltipComponent, isStandalone: true, selector: "cardinal-tooltip", inputs: { content: "content", contentSnippet: "contentSnippet", iconSnippet: "iconSnippet", orientation: "orientation" }, viewQueries: [{ propertyName: "tooltipRef", first: true, predicate: ["tooltipRef"], descendants: true }], ngImport: i0, template: "<div\n #tooltipRef\n class=\"tooltip\"\n [class.active]=\"active\"\n (mouseenter)=\"handleMouseEnter()\"\n (mouseleave)=\"handleMouseLeave()\"\n [ngClass]=\"tooltipOrientation\">\n <div class=\"icon\">\n <ng-container *ngIf=\"iconSnippet\">\n <ng-container *ngTemplateOutlet=\"iconSnippet\"></ng-container>\n </ng-container>\n </div>\n <div class=\"chevron\"></div>\n <div class=\"popup\">\n <div class=\"popup__iconWrap\">\n <div class=\"popup__icon\">\n <ng-container *ngIf=\"iconSnippet\">\n <ng-container *ngTemplateOutlet=\"iconSnippet\"></ng-container>\n </ng-container>\n </div>\n </div>\n <p *ngIf=\"content\">{{ content }}</p>\n <ng-container *ngIf=\"contentSnippet\">\n <ng-container *ngTemplateOutlet=\"contentSnippet\"></ng-container>\n </ng-container>\n </div>\n</div>\n", styles: ["*{margin:0;padding:0;font-size:100%;box-sizing:border-box;font-family:Inter Variable,sans-serif}a{text-decoration:none}a:active,a:hover{outline:0}ul,li{list-style-type:none;margin:0;padding:0}h1,h2,h3,h4,h5,h6{font-size:100%}html,body{box-sizing:border-box;font-size:16px;background-color:#fbfdff}*,*:before,*:after{box-sizing:border-box}:focus{outline:0}img,audio,video{max-width:100%;height:auto}iframe{border:0}textarea{resize:none;overflow:auto;vertical-align:top;box-shadow:none;-webkit-box-shadow:none;-moz-box-shadow:none}input,textarea,select,button{outline:none;border:none;font-size:100%;margin:0}button,input{line-height:normal}input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,textarea:-webkit-autofill,textarea:-webkit-autofill:hover,textarea:-webkit-autofill:focus,select:-webkit-autofill,select:-webkit-autofill:hover,select:-webkit-autofill:focus{-webkit-text-fill-color:rgb(0,0,0);transition:background-color 5000s ease-in-out 0s}table{border-collapse:collapse;border-spacing:0}td,th{padding:0;text-align:left}.tooltip{display:flex;align-items:center;justify-content:center;position:relative;width:min-content;cursor:pointer}.tooltip.tr .chevron,.tooltip.tl .chevron{display:none;content:\"\";width:0;height:0;border-left:7px solid transparent;border-right:7px solid transparent;border-top:7px solid #3d87c5;position:absolute;bottom:23px;left:50%;transform:translate(-50%)}.tooltip.br .chevron,.tooltip.bl .chevron{display:none;content:\"\";width:0;height:0;border-left:7px solid transparent;border-right:7px solid transparent;border-bottom:7px solid #3d87c5;position:absolute;bottom:-8px;left:50%;transform:translate(-50%)}.tooltip.tr .chevron,.tooltip.br .chevron{right:50%}.tooltip.tr:hover .chevron,.tooltip.tl:hover .chevron,.tooltip.br:hover .chevron,.tooltip.bl:hover .chevron{display:flex}.tooltip .icon{height:22px;display:flex;align-items:center;z-index:10}.tooltip .popup{display:none;position:absolute;z-index:15;min-height:32px;min-width:300px;padding:8px;flex-direction:column;justify-content:center;align-items:flex-start;gap:6px;align-self:stretch;border-radius:6px;border:1px solid #3d87c5;background:#fff}.tooltip .popup__iconWrap{width:100%;display:flex;align-items:flex-start;justify-content:flex-start;border-bottom:1px solid #3d87c5;padding-bottom:6px}.tooltip .popup__icon{display:flex;min-width:22px;height:22px;justify-content:center;align-items:center;border-radius:16px}.tooltip .popup p{color:#1d2235;font-size:14px;font-style:normal;font-weight:400;line-height:normal}.tooltip.tr .popup,.tooltip.tl .popup{bottom:28px}.tooltip.br .popup,.tooltip.bl .popup{top:30px}.tooltip.tl .popup,.tooltip.bl .popup{left:-7px}.tooltip.tr .popup,.tooltip.br .popup{right:-7px}.tooltip.active .popup{display:flex}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: TooltipComponent, decorators: [{
type: Component,
args: [{ selector: 'cardinal-tooltip', standalone: true, imports: [NgIf, NgTemplateOutlet, NgClass], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n #tooltipRef\n class=\"tooltip\"\n [class.active]=\"active\"\n (mouseenter)=\"handleMouseEnter()\"\n (mouseleave)=\"handleMouseLeave()\"\n [ngClass]=\"tooltipOrientation\">\n <div class=\"icon\">\n <ng-container *ngIf=\"iconSnippet\">\n <ng-container *ngTemplateOutlet=\"iconSnippet\"></ng-container>\n </ng-container>\n </div>\n <div class=\"chevron\"></div>\n <div class=\"popup\">\n <div class=\"popup__iconWrap\">\n <div class=\"popup__icon\">\n <ng-container *ngIf=\"iconSnippet\">\n <ng-container *ngTemplateOutlet=\"iconSnippet\"></ng-container>\n </ng-container>\n </div>\n </div>\n <p *ngIf=\"content\">{{ content }}</p>\n <ng-container *ngIf=\"contentSnippet\">\n <ng-container *ngTemplateOutlet=\"contentSnippet\"></ng-container>\n </ng-container>\n </div>\n</div>\n", styles: ["*{margin:0;padding:0;font-size:100%;box-sizing:border-box;font-family:Inter Variable,sans-serif}a{text-decoration:none}a:active,a:hover{outline:0}ul,li{list-style-type:none;margin:0;padding:0}h1,h2,h3,h4,h5,h6{font-size:100%}html,body{box-sizing:border-box;font-size:16px;background-color:#fbfdff}*,*:before,*:after{box-sizing:border-box}:focus{outline:0}img,audio,video{max-width:100%;height:auto}iframe{border:0}textarea{resize:none;overflow:auto;vertical-align:top;box-shadow:none;-webkit-box-shadow:none;-moz-box-shadow:none}input,textarea,select,button{outline:none;border:none;font-size:100%;margin:0}button,input{line-height:normal}input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,textarea:-webkit-autofill,textarea:-webkit-autofill:hover,textarea:-webkit-autofill:focus,select:-webkit-autofill,select:-webkit-autofill:hover,select:-webkit-autofill:focus{-webkit-text-fill-color:rgb(0,0,0);transition:background-color 5000s ease-in-out 0s}table{border-collapse:collapse;border-spacing:0}td,th{padding:0;text-align:left}.tooltip{display:flex;align-items:center;justify-content:center;position:relative;width:min-content;cursor:pointer}.tooltip.tr .chevron,.tooltip.tl .chevron{display:none;content:\"\";width:0;height:0;border-left:7px solid transparent;border-right:7px solid transparent;border-top:7px solid #3d87c5;position:absolute;bottom:23px;left:50%;transform:translate(-50%)}.tooltip.br .chevron,.tooltip.bl .chevron{display:none;content:\"\";width:0;height:0;border-left:7px solid transparent;border-right:7px solid transparent;border-bottom:7px solid #3d87c5;position:absolute;bottom:-8px;left:50%;transform:translate(-50%)}.tooltip.tr .chevron,.tooltip.br .chevron{right:50%}.tooltip.tr:hover .chevron,.tooltip.tl:hover .chevron,.tooltip.br:hover .chevron,.tooltip.bl:hover .chevron{display:flex}.tooltip .icon{height:22px;display:flex;align-items:center;z-index:10}.tooltip .popup{display:none;position:absolute;z-index:15;min-height:32px;min-width:300px;padding:8px;flex-direction:column;justify-content:center;align-items:flex-start;gap:6px;align-self:stretch;border-radius:6px;border:1px solid #3d87c5;background:#fff}.tooltip .popup__iconWrap{width:100%;display:flex;align-items:flex-start;justify-content:flex-start;border-bottom:1px solid #3d87c5;padding-bottom:6px}.tooltip .popup__icon{display:flex;min-width:22px;height:22px;justify-content:center;align-items:center;border-radius:16px}.tooltip .popup p{color:#1d2235;font-size:14px;font-style:normal;font-weight:400;line-height:normal}.tooltip.tr .popup,.tooltip.tl .popup{bottom:28px}.tooltip.br .popup,.tooltip.bl .popup{top:30px}.tooltip.tl .popup,.tooltip.bl .popup{left:-7px}.tooltip.tr .popup,.tooltip.br .popup{right:-7px}.tooltip.active .popup{display:flex}\n"] }]
}], ctorParameters: () => [{ type: TooltipContextService }, { type: i0.ChangeDetectorRef }], propDecorators: { content: [{
type: Input
}], contentSnippet: [{
type: Input
}], iconSnippet: [{
type: Input
}], orientation: [{
type: Input
}], tooltipRef: [{
type: ViewChild,
args: ['tooltipRef']
}] } });
class SolidPillIcnComponent {
color = 'currentColor';
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: SolidPillIcnComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: SolidPillIcnComponent, isStandalone: true, selector: "cardinal-solid-pill-icn", inputs: { color: "color" }, ngImport: i0, template: "<svg\n width=\"14\"\n height=\"14\"\n viewBox=\"0 0 14 14\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <g clip-path=\"url(#clip0_618_3928)\">\n <path\n d=\"M12.5957 9.11825C12.1339 8.62182 11.5084 8.31967 10.8342 8.26742L10.8168 8.26608L3.19964 8.25861C1.71537 8.25861 0.507812 9.46617 0.507812 10.9505C0.507812 12.4347 1.71537 13.6423 3.19964 13.6423H3.20011L10.7994 13.6348L10.8342 13.6335C11.5083 13.5812 12.1339 13.2791 12.5957 12.7827C13.0601 12.2834 13.3159 11.6327 13.3159 10.9505C13.3159 10.2682 13.0601 9.61754 12.5957 9.11825ZM6.98957 12.7251L3.19931 12.7288C2.21893 12.7286 1.42131 11.9309 1.42131 10.9505C1.42131 9.96992 2.21907 9.17214 3.19918 9.17214L6.98957 9.17586V12.7251ZM1.69844 7.39865C2.15702 7.73348 2.72102 7.91788 3.28648 7.91794H3.28659C3.48032 7.91794 3.67493 7.89669 3.86497 7.85477L3.882 7.85103L11.1737 5.64824C12.5941 5.21763 13.3994 3.71168 12.9688 2.2912C12.7979 1.72734 12.4566 1.24606 11.9819 0.899316C11.5232 0.564246 10.9591 0.37973 10.3935 0.37973C10.1285 0.379872 9.86494 0.419123 9.61137 0.496215L2.34107 2.70811L2.30812 2.71951C1.67812 2.96508 1.16713 3.43572 0.869242 4.04475C0.569637 4.65728 0.513664 5.35421 0.711578 6.00713C0.882531 6.5709 1.22378 7.05207 1.69844 7.39865ZM9.87685 1.37031C10.0443 1.31935 10.2185 1.29337 10.3935 1.29323C11.1697 1.29323 11.8691 1.8126 12.0946 2.55621C12.379 3.49462 11.847 4.48952 10.9091 4.77387L7.28069 5.86997L6.25098 2.47344L9.87685 1.37031Z\"\n [attr.fill]=\"color\" />\n </g>\n <defs>\n <clipPath id=\"clip0_618_3928\">\n <rect width=\"14\" height=\"14\" fill=\"white\" />\n </clipPath>\n </defs>\n</svg>\n", styles: [""], changeDetection: i0.ChangeDetectionStrategy.OnPush });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: SolidPillIcnComponent, decorators: [{
type: Component,
args: [{ selector: 'cardinal-solid-pill-icn', imports: [], changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, template: "<svg\n width=\"14\"\n height=\"14\"\n viewBox=\"0 0 14 14\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <g clip-path=\"url(#clip0_618_3928)\">\n <path\n d=\"M12.5957 9.11825C12.1339 8.62182 11.5084 8.31967 10.8342 8.26742L10.8168 8.26608L3.19964 8.25861C1.71537 8.25861 0.507812 9.46617 0.507812 10.9505C0.507812 12.4347 1.71537 13.6423 3.19964 13.6423H3.20011L10.7994 13.6348L10.8342 13.6335C11.5083 13.5812 12.1339 13.2791 12.5957 12.7827C13.0601 12.2834 13.3159 11.6327 13.3159 10.9505C13.3159 10.2682 13.0601 9.61754 12.5957 9.11825ZM6.98957 12.7251L3.19931 12.7288C2.21893 12.7286 1.42131 11.9309 1.42131 10.9505C1.42131 9.96992 2.21907 9.17214 3.19918 9.17214L6.98957 9.17586V12.7251ZM1.69844 7.39865C2.15702 7.73348 2.72102 7.91788 3.28648 7.91794H3.28659C3.48032 7.91794 3.67493 7.89669 3.86497 7.85477L3.882 7.85103L11.1737 5.64824C12.5941 5.21763 13.3994 3.71168 12.9688 2.2912C12.7979 1.72734 12.4566 1.24606 11.9819 0.899316C11.5232 0.564246 10.9591 0.37973 10.3935 0.37973C10.1285 0.379872 9.86494 0.419123 9.61137 0.496215L2.34107 2.70811L2.30812 2.71951C1.67812 2.96508 1.16713 3.43572 0.869242 4.04475C0.569637 4.65728 0.513664 5.35421 0.711578 6.00713C0.882531 6.5709 1.22378 7.05207 1.69844 7.39865ZM9.87685 1.37031C10.0443 1.31935 10.2185 1.29337 10.3935 1.29323C11.1697 1.29323 11.8691 1.8126 12.0946 2.55621C12.379 3.49462 11.847 4.48952 10.9091 4.77387L7.28069 5.86997L6.25098 2.47344L9.87685 1.37031Z\"\n [attr.fill]=\"color\" />\n </g>\n <defs>\n <clipPath id=\"clip0_618_3928\">\n <rect width=\"14\" height=\"14\" fill=\"white\" />\n </clipPath>\n </defs>\n</svg>\n" }]
}], propDecorators: { color: [{
type: Input,
args: [{ required: true }]
}] } });
class MoleculeIcnComponent {
color = 'currentColor';
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: MoleculeIcnComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: MoleculeIcnComponent, isStandalone: true, selector: "cardinal-molecule-icn", inputs: { color: "color" }, ngImport: i0, template: "<svg\n width=\"14\"\n height=\"14\"\n viewBox=\"0 0 14 14\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <g clip-path=\"url(#clip0_618_936)\">\n <mask\n id=\"mask0_618_936\"\n style=\"mask-type: luminance\"\n maskUnits=\"userSpaceOnUse\"\n x=\"0\"\n y=\"0\"\n width=\"14\"\n height=\"14\">\n <path d=\"M14 0H0V14H14V0Z\" fill=\"white\" />\n </mask>\n <g mask=\"url(#mask0_618_936)\">\n <path\n d=\"M10.1245 5.15595V2.10851C10.1245 1.90286 10.016 1.71436 9.84181 1.60869L7.29986 0.0835404C7.11421 -0.0278468 6.88572 -0.0278468 6.70008 0.0835404L4.15531 1.60869C3.97824 1.71436 3.87256 1.90286 3.87256 2.10851V5.15595C3.87256 5.36159 3.98109 5.55009 4.15531 5.65576L6.70008 7.18091C6.96856 7.33514 7.19133 7.25231 7.29986 7.18091L9.84181 5.65576C10.016 5.55009 10.1245 5.36159 10.1245 5.15595Z\"\n [attr.fill]=\"color\" />\n <path\n d=\"M5.96922 8.3405L3.4273 6.81532C3.24165 6.70393 3.01317 6.70393 2.82753 6.81532L0.282753 8.3405C0.105675 8.44612 0 8.63465 0 8.8403V11.8877C0 12.0934 0.108531 12.2819 0.282753 12.3875L2.82753 13.9127C3.096 14.0669 3.31877 13.9841 3.4273 13.9127L5.96922 12.3875C6.1463 12.2819 6.25197 12.0934 6.25197 11.8877V8.8403C6.25197 8.63465 6.1463 8.44612 5.96922 8.3405Z\"\n [attr.fill]=\"color\" />\n <path\n d=\"M13.7119 8.33763L11.17 6.81248C10.9843 6.7011 10.7559 6.7011 10.5702 6.81248L8.02541 8.33763C7.84831 8.44333 7.74268 8.63178 7.74268 8.83743V11.8849C7.74268 12.0906 7.85119 12.279 8.02541 12.3847L10.5673 13.9099C10.8358 14.0641 11.0586 13.9813 11.1671 13.9099L13.709 12.3847C13.8861 12.279 13.9918 12.0906 13.9918 11.8849V8.83743C13.9946 8.63178 13.8861 8.44333 13.7119 8.33763Z\"\n [attr.fill]=\"color\" />\n </g>\n </g>\n <defs>\n <clipPath id=\"clip0_618_936\">\n <rect width=\"14\" height=\"14\" fill=\"white\" />\n </clipPath>\n </defs>\n</svg>\n", styles: [""], changeDetection: i0.ChangeDetectionStrategy.OnPush });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: MoleculeIcnComponent, decorators: [{
type: Component,
args: [{ selector: 'cardinal-molecule-icn', imports: [], changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, template: "<svg\n width=\"14\"\n height=\"14\"\n viewBox=\"0 0 14 14\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <g clip-path=\"url(#clip0_618_936)\">\n <mask\n id=\"mask0_618_936\"\n style=\"mask-type: luminance\"\n maskUnits=\"userSpaceOnUse\"\n x=\"0\"\n y=\"0\"\n width=\"14\"\n height=\"14\">\n <path d=\"M14 0H0V14H14V0Z\" fill=\"white\" />\n </mask>\n <g mask=\"url(#mask0_618_936)\">\n <path\n d=\"M10.1245 5.15595V2.10851C10.1245 1.90286 10.016 1.71436 9.84181 1.60869L7.29986 0.0835404C7.11421 -0.0278468 6.88572 -0.0278468 6.70008 0.0835404L4.15531 1.60869C3.97824 1.71436 3.87256 1.90286 3.87256 2.10851V5.15595C3.87256 5.36159 3.98109 5.55009 4.15531 5.65576L6.70008 7.18091C6.96856 7.33514 7.19133 7.25231 7.29986 7.18091L9.84181 5.65576C10.016 5.55009 10.1245 5.36159 10.1245 5.15595Z\"\n [attr.fill]=\"color\" />\n <path\n d=\"M5.96922 8.3405L3.4273 6.81532C3.24165 6.70393 3.01317 6.70393 2.82753 6.81532L0.282753 8.3405C0.105675 8.44612 0 8.63465 0 8.8403V11.8877C0 12.0934 0.108531 12.2819 0.282753 12.3875L2.82753 13.9127C3.096 14.0669 3.31877 13.9841 3.4273 13.9127L5.96922 12.3875C6.1463 12.2819 6.25197 12.0934 6.25197 11.8877V8.8403C6.25197 8.63465 6.1463 8.44612 5.96922 8.3405Z\"\n [attr.fill]=\"color\" />\n <path\n d=\"M13.7119 8.33763L11.17 6.81248C10.9843 6.7011 10.7559 6.7011 10.5702 6.81248L8.02541 8.33763C7.84831 8.44333 7.74268 8.63178 7.74268 8.83743V11.8849C7.74268 12.0906 7.85119 12.279 8.02541 12.3847L10.5673 13.9099C10.8358 14.0641 11.0586 13.9813 11.1671 13.9099L13.709 12.3847C13.8861 12.279 13.9918 12.0906 13.9918 11.8849V8.83743C13.9946 8.63178 13.8861 8.44333 13.7119 8.33763Z\"\n [attr.fill]=\"color\" />\n </g>\n </g>\n <defs>\n <clipPath id=\"clip0_618_936\">\n <rect width=\"14\" height=\"14\" fill=\"white\" />\n </clipPath>\n </defs>\n</svg>\n" }]
}], propDecorators: { color: [{
type: Input,
args: [{ required: true }]
}] } });
class LeafIcnComponent {
color = 'currentColor';
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: LeafIcnComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: LeafIcnComponent, isStandalone: true, selector: "cardinal-leaf-icn", inputs: { color: "color" }, ngImport: i0, template: "<svg\n width=\"14\"\n height=\"14\"\n viewBox=\"0 0 14 14\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <g clip-path=\"url(#clip0_618_2370)\">\n <mask\n id=\"mask0_618_2370\"\n style=\"mask-type: luminance\"\n maskUnits=\"userSpaceOnUse\"\n x=\"0\"\n y=\"0\"\n width=\"14\"\n height=\"14\">\n <path d=\"M14 0H0V14H14V0Z\" fill=\"white\" />\n </mask>\n <g mask=\"url(#mask0_618_2370)\">\n <path\n d=\"M7.87489 0C4.49192 0 1.74989 2.74203 1.74989 6.125V11.0128L0.256266 12.5064C-0.085422 12.8481 -0.085422 13.4019 0.256266 13.7436C0.42711 13.9145 0.65111 14 0.874891 14C1.09867 14 1.32267 13.9145 1.49352 13.7436L2.98714 12.25H7.87489C11.2579 12.25 13.9999 9.50797 13.9999 6.125V0H7.87489ZM11.1185 4.11862L8.23627 7.00088H9.62489C10.1085 7.00088 10.4999 7.39222 10.4999 7.87588C10.4999 8.35953 10.1085 8.75088 9.62489 8.75088H6.48627L5.86852 9.36862C5.69767 9.53947 5.47367 9.625 5.24989 9.625C5.02611 9.625 4.80211 9.53947 4.63127 9.36862C4.28958 9.02694 4.28958 8.47306 4.63127 8.13138L5.24989 7.51275V4.375C5.24989 3.89134 5.64124 3.5 6.12489 3.5C6.60855 3.5 6.99989 3.89134 6.99989 4.375V5.76275L9.88127 2.88137C10.223 2.53969 10.7768 2.53969 11.1185 2.88137C11.4602 3.22306 11.4604 3.77694 11.1185 4.11862Z\"\n [attr.fill]=\"color\" />\n </g>\n </g>\n <defs>\n <clipPath id=\"clip0_618_2370\">\n <rect width=\"14\" height=\"14\" fill=\"white\" />\n </clipPath>\n </defs>\n</svg>\n", styles: [""], changeDetection: i0.ChangeDetectionStrategy.OnPush });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: LeafIcnComponent, decorators: [{
type: Component,
args: [{ selector: 'cardinal-leaf-icn', imports: [], changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, template: "<svg\n width=\"14\"\n height=\"14\"\n viewBox=\"0 0 14 14\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <g clip-path=\"url(#clip0_618_2370)\">\n <mask\n id=\"mask0_618_2370\"\n style=\"mask-type: luminance\"\n maskUnits=\"userSpaceOnUse\"\n x=\"0\"\n y=\"0\"\n width=\"14\"\n height=\"14\">\n <path d=\"M14 0H0V14H14V0Z\" fill=\"white\" />\n </mask>\n <g mask=\"url(#mask0_618_2370)\">\n <path\n d=\"M7.87489 0C4.49192 0 1.74989 2.74203 1.74989 6.125V11.0128L0.256266 12.5064C-0.085422 12.8481 -0.085422 13.4019 0.256266 13.7436C0.42711 13.9145 0.65111 14 0.874891 14C1.09867 14 1.32267 13.9145 1.49352 13.7436L2.98714 12.25H7.87489C11.2579 12.25 13.9999 9.50797 13.9999 6.125V0H7.87489ZM11.1185 4.11862L8.23627 7.00088H9.62489C10.1085 7.00088 10.4999 7.39222 10.4999 7.87588C10.4999 8.35953 10.1085 8.75088 9.62489 8.75088H6.48627L5.86852 9.36862C5.69767 9.53947 5.47367 9.625 5.24989 9.625C5.02611 9.625 4.80211 9.53947 4.63127 9.36862C4.28958 9.02694 4.28958 8.47306 4.63127 8.13138L5.24989 7.51275V4.375C5.24989 3.89134 5.64124 3.5 6.12489 3.5C6.60855 3.5 6.99989 3.89134 6.99989 4.375V5.76275L9.88127 2.88137C10.223 2.53969 10.7768 2.53969 11.1185 2.88137C11.4602 3.22306 11.4604 3.77694 11.1185 4.11862Z\"\n [attr.fill]=\"color\" />\n </g>\n </g>\n <defs>\n <clipPath id=\"clip0_618_2370\">\n <rect width=\"14\" height=\"14\" fill=\"white\" />\n </clipPath>\n </defs>\n</svg>\n" }]
}], propDecorators: { color: [{
type: Input,
args: [{ required: true }]
}] } });
class TriangleIcnComponent {
color = 'currentColor';
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: TriangleIcnComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: TriangleIcnComponent, isStandalone: true, selector: "cardinal-triangle-icn", inputs: { color: "color" }, ngImport: i0, template: "<svg\n width=\"12px\"\n height=\"12px\"\n viewBox=\"0 0 10 10\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M5.37602 8.49475C5.49353 8.4276 5.59093 8.33021 5.65808 8.21269L8.9 2.53934C9.1077 2.17586 8.98142 1.71282 8.61793 1.50511C8.5034 1.43966 8.37377 1.40524 8.24185 1.40524H1.75802C1.33938 1.40524 1 1.74461 1 2.16326C1 2.29517 1.03443 2.4248 1.09987 2.53934L4.34179 8.21269C4.54949 8.57617 5.01253 8.70246 5.37602 8.49475Z\"\n [attr.fill]=\"color\" />\n</svg>\n", styles: [""], changeDetection: i0.ChangeDetectionStrategy.OnPush });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: TriangleIcnComponent, decorators: [{
type: Component,
args: [{ selector: 'cardinal-triangle-icn', imports: [], changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, template: "<svg\n width=\"12px\"\n height=\"12px\"\n viewBox=\"0 0 10 10\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M5.37602 8.49475C5.49353 8.4276 5.59093 8.33021 5.65808 8.21269L8.9 2.53934C9.1077 2.17586 8.98142 1.71282 8.61793 1.50511C8.5034 1.43966 8.37377 1.40524 8.24185 1.40524H1.75802C1.33938 1.40524 1 1.74461 1 2.16326C1 2.29517 1.03443 2.4248 1.09987 2.53934L4.34179 8.21269C4.54949 8.57617 5.01253 8.70246 5.37602 8.49475Z\"\n [attr.fill]=\"color\" />\n</svg>\n" }]
}], propDecorators: { color: [{
type: Input,
args: [{ required: true }]
}] } });
class PillsBottleIcnComponent {
color = 'currentColor';
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: PillsBottleIcnComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: PillsBottleIcnComponent, isStandalone: true, selector: "cardinal-pills-bottle-icn", inputs: { color: "color" }, ngImport: i0, template: "<svg\n width=\"12px\"\n height=\"12px\"\n viewBox=\"0 0 10 10\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <g clip-path=\"url(#clip0_165_1782)\">\n <path\n d=\"M7.8751 4.34052C7.86877 4.11591 7.75782 3.91751 7.58907 3.79252C7.40655 3.62106 7.2094 3.46818 7.01846 3.26338C6.98683 3.22948 6.96046 3.19954 6.93778 3.17205C6.93517 3.16894 6.93256 3.1658 6.92996 3.16263C6.92681 3.1587 6.92397 3.155 6.92093 3.15118L6.91757 3.14688C6.82224 3.02447 6.81289 2.95561 6.81289 2.83826C6.81289 2.77897 6.81289 2.65316 6.81289 2.52272H6.9662C7.18556 2.52272 7.3634 2.36418 7.3634 2.16861V1.35413C7.3634 1.15854 7.18557 1 6.9662 1H3.03366C2.81429 1 2.63645 1.15854 2.63645 1.35413V2.16859C2.63645 2.36416 2.81429 2.5227 3.03366 2.5227H3.18697C3.18697 2.65314 3.18697 2.77896 3.18697 2.83824C3.18697 2.95559 3.17762 3.02446 3.08227 3.14687L3.07893 3.15116C3.07589 3.15498 3.07308 3.1587 3.06991 3.16261C3.06734 3.16578 3.06474 3.16891 3.06208 3.17203C3.0394 3.19952 3.01303 3.22948 2.98144 3.26336C2.79046 3.46817 2.59332 3.62099 2.41079 3.79246C2.24204 3.91746 2.13109 4.11591 2.12476 4.34051C2.12476 4.34635 2.12427 4.35356 2.12427 4.36032C2.12427 4.86656 2.12427 7.86047 2.12427 8.24009C2.12427 8.62504 2.40714 9 2.88414 9C3.12245 9 3.82162 9 4.98483 9C4.98483 9 4.9887 9 4.99588 9H4.99991H5.00395C5.01113 9 5.015 9 5.015 9C6.17819 9 6.87738 9 7.11569 9C7.59269 9 7.87556 8.62504 7.87556 8.24009C7.87556 7.86047 7.87556 4.8673 7.87556 4.36108C7.87556 4.35432 7.8751 4.34637 7.8751 4.34052ZM7.08025 6.21274C7.08025 6.43213 6.90241 6.60997 6.68304 6.60997H4.99995H3.31686C3.0975 6.60997 2.91965 6.43213 2.91965 6.21274V5.5681C2.91965 5.34872 3.0975 5.17088 3.31686 5.17088H6.68304C6.90241 5.17088 7.08025 5.34874 7.08025 5.5681V6.21274Z\"\n [attr.fill]=\"color\" />\n </g>\n <defs>\n <clipPath id=\"clip0_165_1782\">\n <rect width=\"8\" height=\"8\" fill=\"white\" transform=\"translate(1 1)\" />\n </clipPath>\n </defs>\n</svg>\n", styles: [""], changeDetection: i0.ChangeDetectionStrategy.OnPush });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: PillsBottleIcnComponent, decorators: [{
type: Component,
args: [{ selector: 'cardinal-pills-bottle-icn', imports: [], changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, template: "<svg\n width=\"12px\"\n height=\"12px\"\n viewBox=\"0 0 10 10\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <g clip-path=\"url(#clip0_165_1782)\">\n <path\n d=\"M7.8751 4.34052C7.86877 4.11591 7.75782 3.91751 7.58907 3.79252C7.40655 3.62106 7.2094 3.46818 7.01846 3.26338C6.98683 3.22948 6.96046 3.19954 6.93778 3.17205C6.93517 3.16894 6.93256 3.1658 6.92996 3.16263C6.92681 3.1587 6.92397 3.155 6.92093 3.15118L6.91757 3.14688C6.82224 3.02447 6.81289 2.95561 6.81289 2.83826C6.81289 2.77897 6.81289 2.65316 6.81289 2.52272H6.9662C7.18556 2.52272 7.3634 2.36418 7.3634 2.16861V1.35413C7.3634 1.15854 7.18557 1 6.9662 1H3.03366C2.81429 1 2.63645 1.15854 2.63645 1.35413V2.16859C2.63645 2.36416 2.81429 2.5227 3.03366 2.5227H3.18697C3.18697 2.65314 3.18697 2.77896 3.18697 2.83824C3.18697 2.95559 3.17762 3.02446 3.08227 3.14687L3.07893 3.15116C3.07589 3.15498 3.07308 3.1587 3.06991 3.16261C3.06734 3.16578 3.06474 3.16891 3.06208 3.17203C3.0394 3.19952 3.01303 3.22948 2.98144 3.26336C2.79046 3.46817 2.59332 3.62099 2.41079 3.79246C2.24204 3.91746 2.13109 4.11591 2.12476 4.34051C2.12476 4.34635 2.12427 4.35356 2.12427 4.36032C2.12427 4.86656 2.12427 7.86047 2.12427 8.24009C2.12427 8.62504 2.40714 9 2.88414 9C3.12245 9 3.82162 9 4.98483 9C4.98483 9 4.9887 9 4.99588 9H4.99991H5.00395C5.01113 9 5.015 9 5.015 9C6.17819 9 6.87738 9 7.11569 9C7.59269 9 7.87556 8.62504 7.87556 8.24009C7.87556 7.86047 7.87556 4.8673 7.87556 4.36108C7.87556 4.35432 7.8751 4.34637 7.8751 4.34052ZM7.08025 6.21274C7.08025 6.43213 6.90241 6.60997 6.68304 6.60997H4.99995H3.31686C3.0975 6.60997 2.91965 6.43213 2.91965 6.21274V5.5681C2.91965 5.34872 3.0975 5.17088 3.31686 5.17088H6.68304C6.90241 5.17088 7.08025 5.34874 7.08025 5.5681V6.21274Z\"\n [attr.fill]=\"color\" />\n </g>\n <defs>\n <clipPath id=\"clip0_165_1782\">\n <rect width=\"8\" height=\"8\" fill=\"white\" transform=\"translate(1 1)\" />\n </clipPath>\n </defs>\n</svg>\n" }]
}], propDecorators: { color: [{
type: Input,
args: [{ required: true }]
}] } });
class PrescriptionIcnComponent {
color = 'currentColor';
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: PrescriptionIcnComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: PrescriptionIcnComponent, isStandalone: true, selector: "cardinal-prescription-icn", inputs: { color: "color" }, ngImport: i0, template: "<!--<svg-->\n<!-- width=\"12px\"-->\n<!-- height=\"12px\"-->\n<!-- viewBox=\"0 0 12 12\"-->\n<!-- fill=\"none\"-->\n<!-- xmlns=\"http://www.w3.org/2000/svg\">-->\n<!-- <path-->\n<!-- d=\"M7.29275 4.90649C7.3391 4.88707 7.37877 4.85455 7.40691 4.81291C7.43504 4.77127 7.45041 4.72233 7.45113 4.67208V1.00699C7.45113 0.804093 7.37053 0.609509 7.22707 0.466041C7.0836 0.322573 6.88902 0.241974 6.68612 0.241974H1.76185C1.66159 0.242182 1.56236 0.262134 1.46982 0.300692C1.37727 0.33925 1.29323 0.395658 1.22248 0.466697C1.15174 0.537735 1.09568 0.622011 1.05751 0.714714C1.01933 0.807417 0.999793 0.906732 1 1.00699V7.43278C0.999793 7.53316 1.01939 7.63261 1.05766 7.72541C1.09593 7.81822 1.15213 7.90257 1.22304 7.97363C1.29396 8.04468 1.37819 8.10106 1.47091 8.13952C1.56364 8.17799 1.66304 8.19779 1.76343 8.19779H4.26596C4.31409 8.19765 4.3612 8.18389 4.40184 8.1581C4.44248 8.13232 4.47499 8.09556 4.49562 8.05207C4.56793 7.92463 4.6563 7.80699 4.75854 7.70203L6.65919 5.44501C6.82535 5.21842 7.04235 5.03397 7.29275 4.90649ZM1.8252 2.42297C1.8252 2.39136 1.83143 2.36005 1.84353 2.33084C1.85563 2.30163 1.87336 2.27509 1.89572 2.25274C1.91807 2.23038 1.94461 2.21265 1.97382 2.20055C2.00303 2.18845 2.03434 2.18222 2.06595 2.18222H2.54903V1.70706C2.55069 1.64431 2.57678 1.58469 2.62175 1.54091C2.66672 1.49712 2.72701 1.47262 2.78978 1.47265H3.03053C3.09453 1.47306 3.15576 1.49878 3.20086 1.54418C3.24597 1.58958 3.27128 1.65098 3.27128 1.71498V2.18222H3.74644C3.81046 2.18304 3.87162 2.20884 3.91689 2.25411C3.96216 2.29938 3.98796 2.36054 3.98878 2.42456V2.66531C3.98756 2.7292 3.96164 2.79013 3.91645 2.83531C3.87127 2.8805 3.81033 2.90642 3.74644 2.90764H3.27128V3.39389C3.27128 3.45774 3.24592 3.51898 3.20077 3.56412C3.15562 3.60927 3.09438 3.63464 3.03053 3.63464H2.7882C2.72462 3.63422 2.66379 3.60867 2.61899 3.56357C2.57418 3.51846 2.54903 3.45747 2.54903 3.39389V2.91873H2.06595C2.03434 2.91873 2.00303 2.9125 1.97382 2.9004C1.94461 2.8883 1.91807 2.87057 1.89572 2.84821C1.87336 2.82586 1.85563 2.79932 1.84353 2.77011C1.83143 2.7409 1.8252 2.70959 1.8252 2.67798V2.42297ZM4.85199 6.30506C4.85199 6.37269 4.82512 6.43755 4.7773 6.48537C4.72948 6.53319 4.66462 6.56006 4.59699 6.56006H2.08021C2.01257 6.56006 1.94771 6.53319 1.89989 6.48537C1.85207 6.43755 1.8252 6.37269 1.8252 6.30506V6.02471C1.82562 5.95735 1.85267 5.8929 1.90045 5.84542C1.94823 5.79794 2.01285 5.77129 2.08021 5.77129H4.59699C4.66434 5.77129 4.72897 5.79794 4.77674 5.84542C4.82452 5.8929 4.85157 5.95735 4.85199 6.02471V6.30506ZM6.13493 4.75127C6.13535 4.78502 6.12906 4.81853 6.11644 4.84983C6.10381 4.88114 6.08509 4.90962 6.06137 4.93364C6.03765 4.95765 6.0094 4.97672 5.97825 4.98973C5.9471 5.00275 5.91368 5.00945 5.87993 5.00944H2.07862C2.01099 5.00944 1.94613 4.98258 1.89831 4.93475C1.85048 4.88693 1.82362 4.82207 1.82362 4.75444V4.47568C1.8232 4.44179 1.82953 4.40816 1.84226 4.37675C1.85498 4.34534 1.87384 4.31678 1.89773 4.29274C1.92162 4.26871 1.95006 4.24967 1.98139 4.23676C2.01273 4.22384 2.04632 4.21729 2.08021 4.21751H5.88151C5.94914 4.21751 6.014 4.24437 6.06183 4.29219C6.10965 4.34002 6.13652 4.40488 6.13652 4.47251L6.13493 4.75127Z\"-->\n<!-- [attr.fill]=\"color\" />-->\n<!-- <path-->\n<!-- d=\"M8.66256 5.60659C8.45267 5.42295 8.17908 5.32902 7.90065 5.34502C7.62222 5.36101 7.36119 5.48565 7.17371 5.69212C7.1623 5.70461 7.15171 5.71783 7.14204 5.73171L6.3501 6.66303L7.93397 8.01091L8.72591 7.07959C8.91253 6.87571 9.01067 6.60613 8.99879 6.32999C8.98692 6.05385 8.866 5.79369 8.66256 5.60659Z\"-->\n<!-- [attr.fill]=\"color\" />-->\n<!-- <path-->\n<!-- d=\"M6.01441 7.08432L5.22247 8.01564C5.03848 8.22421 4.94488 8.49732 4.96226 8.7749C4.97963 9.05248 5.10656 9.31178 5.31513 9.49577C5.52369 9.67976 5.79681 9.77337 6.07439 9.75599C6.35197 9.73861 6.61127 9.61168 6.79526 9.40312L6.82852 9.36352L7.62046 8.4322L6.03659 7.08432H6.01441Z\"-->\n<!-- [attr.fill]=\"color\" />-->\n<!--</svg>-->\n<svg\n width=\"12\"\n height=\"12\"\n viewBox=\"0 0 12 12\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M8.56078 8.25L10.3903 6.42047C10.5368 6.27398 10.5368 6.03656 10.3903 5.89008L9.85992 5.35969C9.71344 5.2132 9.47602 5.2132 9.32953 5.35969L7.5 7.18922L5.53219 5.22141C6.64008 5.08125 7.5 4.14586 7.5 3C7.5 1.75734 6.49266 0.75 5.25 0.75H1.875C1.66781 0.75 1.5 0.917813 1.5 1.125V7.125C1.5 7.33219 1.66781 7.5 1.875 7.5H2.625C2.83219 7.5 3 7.33219 3 7.125V5.25H3.43945L6.43945 8.25L4.60992 10.0795C4.46344 10.226 4.46344 10.4634 4.60992 10.6099L5.14031 11.1403C5.2868 11.2868 5.52422 11.2868 5.6707 11.1403L7.5 9.31055L9.32953 11.1401C9.47602 11.2866 9.71344 11.2866 9.85992 11.1401L10.3903 10.6097C10.5368 10.4632 10.5368 10.2258 10.3903 10.0793L8.56078 8.25ZM3 2.25H5.25C5.66344 2.25 6 2.58656 6 3C6 3.41344 5.66344 3.75 5.25 3.75H3V2.25Z\"\n [attr.fill]=\"color\" />\n</svg>\n", styles: [""], changeDetection: i0.ChangeDetectionStrategy.OnPush });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: PrescriptionIcnComponent, decorators: [{
type: Component,
args: [{ selector: 'cardinal-prescription-icn', imports: [], changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, template: "<!--<svg-->\n<!-- width=\"12px\"-->\n<!-- height=\"12px\"-->\n<!-- viewBox=\"0 0 12 12\"-->\n<!-- fill=\"none\"-->\n<!-- xmlns=\"http://www.w3.org/2000/svg\">-->\n<!-- <path-->\n<!-- d=\"M7.29275 4.90649C7.3391 4.88707 7.37877 4.85455 7.40691 4.81291C7.43504 4.77127 7.45041 4.72233 7.45113 4.67208V1.00699C7.45113 0.804093 7.37053 0.609509 7.22707 0.466041C7.0836 0.322573 6.88902 0.241974 6.68612 0.241974H1.76185C1.66159 0.242182 1.56236 0.262134 1.46982 0.300692C1.37727 0.33925 1.29323 0.395658 1.22248 0.466697C1.15174 0.537735 1.09568 0.622011 1.05751 0.714714C1.01933 0.807417 0.999793 0.906732 1 1.00699V7.43278C0.999793 7.53316 1.01939 7.63261 1.05766 7.72541C1.09593 7.81822 1.15213 7.90257 1.22304 7.97363C1.29396 8.04468 1.37819 8.10106 1.47091 8.13952C1.56364 8.17799 1.66304 8.19779 1.76343 8.19779H4.26596C4.31409 8.19765 4.3612 8.18389 4.40184 8.1581C4.44248 8.13232 4.47499 8.09556 4.49562 8.05207C4.56793 7.92463 4.6563 7.80699 4.75854 7.70203L6.65919 5.44501C6.82535 5.21842 7.04235 5.03397 7.29275 4.90649ZM1.8252 2.42297C1.8252 2.39136 1.83143 2.36005 1.84353 2.33084C1.85563 2.30163 1.87336 2.27509 1.89572 2.25274C1.91807 2.23038 1.94461 2.21265 1.97382 2.20055C2.00303 2.18845 2.03434 2.18222 2.06595 2.18222H2.54903V1.70706C2.55069 1.64431 2.57678 1.58469 2.62175 1.54091C2.66672 1.49712 2.72701 1.47262 2.78978 1.47265H3.03053C3.09453 1.47306 3.15576 1.49878 3.20086 1.54418C3.24597 1.58958 3.27128 1.65098 3.27128 1.71498V2.18222H3.74644C3.81046 2.18304 3.87162 2.20884 3.91689 2.25411C3.96216 2.29938 3.98796 2.36054 3.98878 2.42456V2.66531C3.98756 2.7292 3.96164 2.79013 3.91645 2.83531C3.87127 2.8805 3.81033 2.90642 3.74644 2.90764H3.27128V3.39389C3.27128 3.45774 3.24592 3.51898 3.20077 3.56412C3.15562 3.60927 3.09438 3.63464 3.03053 3.63464H2.7882C2.72462 3.63422 2.66379 3.60867 2.61899 3.56357C2.57418 3.51846 2.54903 3.45747 2.54903 3.39389V2.91873H2.06595C2.03434 2.91873 2.00303 2.9125 1.97382 2.9004C1.94461 2.8883 1.91807 2.87057 1.89572 2.84821C1.87336 2.82586 1.85563 2.79932 1.84353 2.77011C1.83143 2.7409 1.8252 2.70959 1.8252 2.67798V2.42297ZM4.85199 6.30506C4.85199 6.37269 4.82512 6.43755 4.7773 6.48537C4.72948 6.53319 4.66462 6.56006 4.59699 6.56006H2.08021C2.01257 6.56006 1.94771 6.53319 1.89989 6.48537C1.85207 6.43755 1.8252 6.37269 1.8252 6.30506V6.02471C1.82562 5.95735 1.85267 5.8929 1.90045 5.84542C1.94823 5.79794 2.01285 5.77129 2.08021 5.77129H4.59699C4.66434 5.77129 4.72897 5.79794 4.77674 5.84542C4.82452 5.8929 4.85157 5.95735 4.85199 6.02471V6.30506ZM6.13493 4.75127C6.13535 4.78502 6.12906 4.81853 6.11644 4.84983C6.10381 4.88114 6.08509 4.90962 6.06137 4.93364C6.03765 4.95765 6.0094 4.97672 5.97825 4.98973C5.9471 5.00275 5.91368 5.00945 5.87993 5.00944H2.07862C2.01099 5.00944 1.94613 4.98258 1.89831 4.93475C1.85048 4.88693 1.82362 4.82207 1.82362 4.75444V4.47568C1.8232 4.44179 1.82953 4.40816 1.84226 4.37675C1.85498 4.34534 1.87384 4.31678 1.89773 4.29274C1.92162 4.26871 1.95006 4.24967 1.98139 4.23676C2.01273 4.22384 2.04632 4.21729 2.08021 4.21751H5.88151C5.94914 4.21751 6.014 4.24437 6.06183 4.29219C6.10965 4.34002 6.13652 4.40488 6.13652 4.47251L6.13493 4.75127Z\"-->\n<!-- [attr.fill]=\"color\" />-->\n<!-- <path-->\n<!-- d=\"M8.66256 5.60659C8.45267 5.42295 8.17908 5.32902 7.90065 5.34502C7.62222 5.36101 7.36119 5.48565 7.17371 5.69212C7.1623 5.70461 7.15171 5.71783 7.14204 5.73171L6.3501 6.66303L7.93397 8.01091L8.72591 7.07959C8.91253 6.87571 9.01067 6.60613 8.99879 6.32999C8.98692 6.05385 8.866 5.79369 8.66256 5.60659Z\"-->\n<!-- [attr.fill]=\"color\" />-->\n<!-- <path-->\n<!-- d=\"M6.01441 7.08432L5.22247 8.01564C5.03848 8.22421 4.94488 8.49732 4.96226 8.7749C4.97963 9.05248 5.10656 9.31178 5.31513 9.49577C5.52369 9.67976 5.79681 9.77337 6.07439 9.75599C6.35197 9.73861 6.61127 9.61168 6.79526 9.40312L6.82852 9.36352L7.62046 8.4322L6.03659 7.08432H6.01441Z\"-->\n<!-- [attr.fill]=\"color\" />-->\n<!--</svg>-->\n<svg\n width=\"12\"\n height=\"12\"\n viewBox=\"0 0 12 12\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M8.56078 8.25L10.3903 6.42047C10.5368 6.27398 10.5368 6.03656 10.3903 5.89008L9.85992 5.35969C9.71344 5.2132 9.47602 5.2132 9.32953 5.35969L7.5 7.18922L5.53219 5.22141C6.64008 5.08125 7.5 4.14586 7.5 3C7.5 1.75734 6.49266 0.75 5.25 0.75H1.875C1.66781 0.75 1.5 0.917813 1.5 1.125V7.125C1.5 7.33219 1.66781 7.5 1.875 7.5H2.625C2.83219 7.5 3 7.33219 3 7.125V5.25H3.43945L6.43945 8.25L4.60992 10.0795C4.46344 10.226 4.46344 10.4634 4.60992 10.6099L5.14031 11.1403C5.2868 11.2868 5.52422 11.2868 5.6707 11.1403L7.5 9.31055L9.32953 11.1401C9.47602 11.2866 9.71344 11.2866 9.85992 11.1401L10.3903 10.6097C10.5368 10.4632 10.5368 10.2258 10.3903 10.0793L8.56078 8.25ZM3 2.25H5.25C5.66344 2.25 6 2.58656 6 3C6 3.41344 5.66344 3.75 5.25 3.75H3V2.25Z\"\n [attr.fill]=\"color\" />\n</svg>\n" }]
}], propDecorators: { color: [{
type: Input,
args: [{ required: true }]
}] } });
class SupplyIcnComponent {
color = 'currentColor';
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: SupplyIcnComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: SupplyIcnComponent, isStandalone: true, selector: "cardinal-supply-icn", inputs: { color: "color" }, ngImport: i0, template: "<svg\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <g clip-path=\"url(#clip0_329_708)\">\n <path\n d=\"M5.18757 9.96101C4.45959 9.96101 3.86963 10.5508 3.86963 11.2788C3.86963 12.0069 4.45959 12.5966 5.18757 12.5966C5.91581 12.5966 6.50562 12.0069 6.50562 11.2788C6.50562 10.5508 5.91581 9.96101 5.18757 9.96101ZM5.18757 11.8517C4.87111 11.8517 4.61468 11.5953 4.61468 11.2788C4.61468 10.9622 4.87111 10.7059 5.18757 10.7059C5.50406 10.7059 5.76067 10.9622 5.76067 11.2788C5.76067 11.5953 5.50406 11.8517 5.18757 11.8517Z\"\n [attr.fill]=\"color\" />\n <path\n d=\"M12.1372 9.96101C11.4093 9.96101 10.8193 10.5508 10.8193 11.2788C10.8193 12.0069 11.4093 12.5966 12.1372 12.5966C12.8655 12.5966 13.4553 12.0069 13.4553 11.2788C13.4553 10.5508 12.8655 9.96101 12.1372 9.96101ZM12.1372 11.8517C11.8208 11.8517 11.5644 11.5953 11.5644 11.2788C11.5644 10.9622 11.8208 10.7059 12.1372 10.7059C12.4538 10.7059 12.7104 10.9622 12.7104 11.2788C12.7104 11.5953 12.4538 11.8517 12.1372 11.8517Z\"\n [attr.fill]=\"color\" />\n <path\n d=\"M6.6703 5.9117C6.6703 6.09636 6.51918 6.24744 6.33455 6.24744H1.70143C1.51676 6.24744 1.36572 6.09636 1.36572 5.9117V5.71025C1.36572 5.52562 1.5168 5.37454 1.70143 5.37454H6.33455C6.51922 5.37454 6.6703 5.52562 6.6703 5.71025V5.9117Z\"\n [attr.fill]=\"color\" />\n <path\n d=\"M14.7198 7.87737C14.2365 7.75174 13.96 7.67276 13.7703 7.30629L13.1358 6.02162C12.9459 5.65516 12.4529 5.35529 12.0403 5.35529H11.1725C11.1725 5.35529 11.0557 5.35773 11.0557 5.24024C11.0557 4.97087 11.0557 4.1628 11.0557 4.1628C11.0557 3.74512 10.8194 3.40337 10.3166 3.40337H3.24371C2.52388 3.40337 2.18213 3.74516 2.18213 4.1628V4.83801C2.18213 4.83801 2.18213 5.03883 2.3765 5.03883C3.36599 5.03883 6.33452 5.03883 6.33452 5.03883C6.70477 5.03883 7.006 5.34003 7.006 5.71028V5.91173C7.006 6.28199 6.70477 6.58318 6.33452 6.58318H2.3765C2.3765 6.58318 2.18213 6.56703 2.18213 6.77685C2.18213 6.88106 2.18213 6.95101 2.18213 7.00905C2.18213 7.19372 2.43524 7.19361 2.43524 7.19361H5.09958C5.46984 7.19361 5.77107 7.49483 5.77107 7.86506V8.0665C5.77107 8.43676 5.46984 8.73795 5.09958 8.73795H2.47727C2.47727 8.73795 2.18213 8.7325 2.18213 8.9675C2.18213 9.37541 2.18213 10.5991 2.18213 10.5991C2.18213 11.0167 2.52388 11.3585 2.94156 11.3585C2.94156 11.3585 3.25618 11.3585 3.36105 11.3585C3.45619 11.3585 3.4702 11.3055 3.4702 11.2789C3.4702 10.332 4.24066 9.5617 5.1876 9.5617C6.13462 9.5617 6.90504 10.332 6.90504 11.2789C6.90504 11.3056 6.89744 11.3585 6.9702 11.3585C7.80172 11.3585 10.3555 11.3585 10.3555 11.3585C10.4226 11.3585 10.4199 11.3019 10.4199 11.2789C10.4199 10.332 11.1903 9.5617 12.1373 9.5617C13.0843 9.5617 13.8547 10.332 13.8547 11.2789C13.8547 11.3056 13.854 11.3585 13.896 11.3585C14.2773 11.3585 14.7495 11.3585 14.7495 11.3585C15.1624 11.3585 15.5 11.0208 15.5 10.6081V9.18233C15.5001 7.98165 15.1209 7.98165 14.7198 7.87737ZM13.2917 7.81059C13.2917 7.81059 11.6981 7.81059 11.1557 7.81059C11.0674 7.81059 11.0557 7.72468 11.0557 7.72468V5.94529C11.0557 5.94529 11.0507 5.87696 11.164 5.87696C11.3164 5.87696 11.7735 5.87696 11.7735 5.87696C12.1408 5.87696 12.5794 6.14378 12.7483 6.46987L13.3129 7.61298C13.3367 7.659 13.3621 7.69986 13.3893 7.73647C13.4094 7.76332 13.3757 7.81059 13.2917 7.81059Z\"\n [attr.fill]=\"color\" />\n <path\n d=\"M5.43524 8.06651C5.43524 8.25118 5.28416 8.40226 5.09953 8.40226H0.835707C0.651039 8.40226 0.5 8.25118 0.5 8.06651V7.86506C0.5 7.68043 0.651076 7.52936 0.835707 7.52936H5.09953C5.2842 7.52936 5.43524 7.68043 5.43524 7.86506V8.06651Z\"\n [attr.fill]=\"color\" />\n </g>\n <defs>\n <clipPath id=\"clip0_329_708\">\n <rect\n width=\"15\"\n height=\"15\"\n fill=\"white\"\n transform=\"translate(0.5 0.5)\" />\n </clipPath>\n </defs>\n</svg>\n", styles: [""], changeDetection: i0.ChangeDetectionStrategy.OnPush });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: SupplyIcnComponent, decorators: [{
type: Component,
args: [{ selector: 'cardinal-supply-icn', imports: [], changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, template: "<svg\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <g clip-path=\"url(#clip0_329_708)\">\n <path\n d=\"M5.18757 9.96101C4.45959 9.96101 3.86963 10.5508 3.86963 11.2788C3.86963 12.0069 4.45959 12.5966 5.18757 12.5966C5.91581 12.5966 6.50562 12.0069 6.50562 11.2788C6.50562 10.5508 5.91581 9.96101 5.18757 9.96101ZM5.18757 11.8517C4.87111 11.8517 4.61468 11.5953 4.61468 11.2788C4.61468 10.9622 4.87111 10.7059 5.18757 10.7059C5.50406 10.7059 5.76067 10.9622 5.76067 11.2788C5.76067 11.5953 5.50406 11.8517 5.18757 11.8517Z\"\n [attr.fill]=\"color\" />\n <path\n d=\"M12.1372 9.96101C11.4093 9.96101 10.8193 10.5508 10.8193 11.2788C10.8193 12.0069 11.4093 12.5966 12.1372 12.5966C12.8655 12.5966 13.4553 12.0069 13.4553 11.2788C13.4553 10.5508 12.8655 9.96101 12.1372 9.96101ZM12.1372 11.8517C11.8208 11.8517 11.5644 11.5953 11.5644 11.2788C11.5644 10.9622 11.8208 10.7059 12.1372 10.7059C12.4538 10.7059 12.7104 10.9622 12.7104 11.2788C12.7104 11.5953 12.4538 11.8517 12.1372 11.8517Z\"\n [attr.fill]=\"color\" />\n <path\n d=\"M6.6703 5.9117C6.6703 6.09636 6.51918 6.24744 6.33455 6.24744H1.70143C1.51676 6.24744 1.36572 6.09636 1.36572 5.9117V5.71025C1.36572 5.52562 1.5168 5.37454 1.70143 5.37454H6.33455C6.51922 5.37454 6.6703 5.52562 6.6703 5.71025V5.9117Z\"\n [attr.fill]=\"color\" />\n <path\n d=\"M14.7198 7.87737C14.2365 7.75174 13.96 7.67276 13.7703 7.30629L13.1358 6.02162C12.9459 5.65516 12.4529 5.35529 12.0403 5.35529H11.1725C11.1725 5.35529 11.0557 5.35773 11.0557 5.24024C11.0557 4.97087 11.0557 4.1628 11.0557 4.1628C11.0557 3.74512 10.8194 3.40337 10.3166 3.40337H3.24371C2.52388 3.40337 2.18213 3.74516 2.18213 4.1628V4.83801C2.18213 4.83801 2.18213 5.03883 2.3765 5.03883C3.36599 5.03883 6.33452 5.03883 6.33452 5.03883C6.70477 5.03883 7.006 5.34003 7.006 5.71028V5.91173C7.006 6.28199 6.70477 6.58318 6.33452 6.58318H2.3765C2.3765 6.58318 2.18213 6.56703 2.18213 6.77685C2.18213 6.88106 2.18213 6.95101 2.18213 7.00905C2.18213 7.19372 2.43524 7.19361 2.43524 7.19361H5.09958C5.46984 7.19361 5.77107 7.49483 5.77107 7.86506V8.0665C5.77107 8.43676 5.46984 8.73795 5.09958 8.73795H2.47727C2.47727 8.73795 2.18213 8.7325 2.18213 8.9675C2.18213 9.37541 2.18213 10.5991 2.18213 10.5991C2.18213 11.0167 2.52388 11.3585 2.94156 11.3585C2.94156 11.3585 3.25618 11.3585 3.36105 11.3585C3.45619 11.3585 3.4702 11.3055 3.4702 11.2789C3.4702 10.332 4.24066 9.5617 5.1876 9.5617C6.13462 9.5617 6.90504 10.332 6.90504 11.2789C6.90504 11.3056 6.89744 11.3585 6.9702 11.3585C7.80172 11.3585 10.3555 11.3585 10.3555 11.3585C10.4226 11.3585 10.4199 11.3019 10.4199 11.2789C10.4199 10.332 11.1903 9.5617 12.1373 9.5617C13.0843 9.5617 13.8547 10.332 13.8547 11.2789C13.8547 11.3056 13.854 11.3585 13.896 11.3585C14.2773 11.3585 14.7495 11.3585 14.7495 11.3585C15.1624 11.3585 15.5 11.0208 15.5 10.6081V9.18233C15.5001 7.98165 15.1209 7.98165 14.7198 7.87737ZM13.2917 7.81059C13.2917 7.81059 11.6981 7.81059 11.1557 7.81059C11.0674 7.81059 11.0557 7.72468 11.0557 7.72468V5.94529C11.0557 5.94529 11.0507 5.87696 11.164 5.87696C11.3164 5.87696 11.7735 5.87696 11.7735 5.87696C12.1408 5.87696 12.5794 6.14378 12.7483 6.46987L13.3129 7.61298C13.3367 7.659 13.3621 7.69986 13.3893 7.73647C13.4094 7.76332 13.3757 7.81059 13.2917 7.81059Z\"\n [attr.fill]=\"color\" />\n <path\n d=\"M5.43524 8.06651C5.43524 8.25118 5.28416 8.40226 5.09953 8.40226H0.835707C0.651039 8.40226 0.5 8.25118 0.5 8.06651V7.86506C0.5 7.68043 0.651076 7.52936 0.835707 7.52936H5.09953C5.2842 7.52936 5.43524 7.68043 5.43524 7.86506V8.06651Z\"\n [attr.fill]=\"color\" />\n </g>\n <defs>\n <clipPath id=\"clip0_329_708\">\n <rect\n width=\"15\"\n height=\"15\"\n fill=\"white\"\n transform=\"translate(0.5 0.5)\" />\n </clipPath>\n </defs>\n</svg>\n" }]
}], propDecorators: { color: [{
type: Input,
args: [{ required: true }]
}] } });
class EndOfCommercialisationIcnComponent {
color = 'currentColor';
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: EndOfCommercialisationIcnComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: EndOfCommercialisationIcnComponent, isStandalone: true, selector: "cardinal-end-of-commercialisation-icn", inputs: { color: "color" }, ngImport: i0, template: "<svg\n width=\"12\"\n height=\"12\"\n viewBox=\"0 0 12 12\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <g clip-path=\"url(#clip0_330_2250)\">\n <path\n d=\"M4.65801 10.3098C4.52446 10.2195 4.36185 10.1662 4.18897 10.1664C4.07385 10.1664 3.96278 10.1899 3.86218 10.2325C3.71139 10.2963 3.58384 10.4023 3.49335 10.5362C3.40283 10.6698 3.34991 10.8324 3.3501 11.0052C3.34991 11.1204 3.37335 11.2314 3.416 11.3318C3.47997 11.4828 3.58579 11.6104 3.71952 11.7007C3.85328 11.7914 4.01608 11.8443 4.18897 11.8443C4.3041 11.8443 4.41496 11.8208 4.51536 11.7782C4.66635 11.7144 4.79408 11.6082 4.88439 11.4745C4.97472 11.3409 5.0278 11.1781 5.0278 11.0052C5.0278 10.8901 5.00415 10.7793 4.96171 10.6787C4.89793 10.5277 4.79174 10.4002 4.65801 10.3098ZM4.50062 11.1368C4.47503 11.1973 4.43181 11.2495 4.37772 11.2859C4.32346 11.3224 4.2599 11.3435 4.18895 11.3437C4.14147 11.3435 4.09745 11.3342 4.05735 11.3169C3.99707 11.2917 3.94473 11.2483 3.90829 11.1944C3.87184 11.1399 3.85091 11.0762 3.85054 11.0052C3.85072 10.9579 3.86022 10.9141 3.87728 10.8736C3.90247 10.8134 3.9459 10.7612 3.99995 10.7246C4.05423 10.6882 4.11798 10.6672 4.18893 10.667C4.23622 10.667 4.28003 10.6766 4.32032 10.6936C4.38079 10.719 4.43272 10.7622 4.46938 10.8165C4.50583 10.8708 4.52694 10.9343 4.52694 11.0053C4.52699 11.0527 4.51766 11.0966 4.50062 11.1368Z\"\n [attr.fill]=\"color\" />\n <path\n d=\"M3.95443 9.20724C3.86373 9.20724 3.77884 9.189 3.70093 9.15623C3.58466 9.10702 3.48425 9.02405 3.41408 8.91977C3.34663 8.81956 3.30671 8.70155 3.3036 8.57208C3.30709 8.4176 3.35633 8.28349 3.44277 8.17629C3.48756 8.12107 3.54278 8.0726 3.60983 8.03248C3.67611 7.99294 3.75423 7.96156 3.84592 7.94177L9.57245 7.00971C9.9467 6.94866 10.2442 6.6626 10.3198 6.29102L11.0203 2.84747V2.84709C11.0284 2.80716 11.0323 2.76645 11.0323 2.72616C11.0323 2.58698 10.9846 2.45093 10.895 2.34122C10.7797 2.20013 10.6068 2.11814 10.4243 2.11814H2.495L2.22481 1.18997V1.19016C2.10078 0.775195 1.76042 0.460828 1.33714 0.370125L0.367674 0.162539C0.203705 0.127266 0.0420336 0.231938 0.00678359 0.396094C-0.0283023 0.56025 0.0761586 0.721899 0.240526 0.756985L1.20962 0.964758C1.41601 1.00894 1.58192 1.16205 1.64221 1.36441L3.41371 7.44949C3.37379 7.4681 3.33521 7.48826 3.29821 7.51055C3.1071 7.62434 2.95398 7.78404 2.85125 7.97049C2.753 8.14763 2.70085 8.34844 2.696 8.55563H2.69502V8.5872H2.69579C2.69968 8.74906 2.73418 8.90431 2.79406 9.04599C2.89002 9.27256 3.04932 9.46425 3.25011 9.59991C3.4509 9.73575 3.69472 9.81541 3.95443 9.81523H7.17163C7.17064 9.7852 7.16717 9.75593 7.16717 9.7257C7.16717 9.54834 7.18538 9.37526 7.21815 9.20724H3.95443ZM8.28413 3.16263C8.45488 3.11302 8.63356 3.2107 8.68318 3.38145L9.33556 5.61441C9.38518 5.78517 9.28728 5.96367 9.11656 6.01366C8.94599 6.06349 8.7673 5.96562 8.71749 5.79485L8.06527 3.56187C8.01549 3.39134 8.11337 3.21265 8.28413 3.16263ZM6.87643 3.16845C7.04699 3.11843 7.2257 3.21631 7.27548 3.38707L7.99009 5.83418C8.0401 6.00476 7.94202 6.18363 7.77146 6.23346C7.60091 6.28324 7.4222 6.18539 7.37218 6.01463L6.65757 3.56747C6.60781 3.39696 6.70567 3.21806 6.87643 3.16845ZM5.46835 3.17348C5.6391 3.12387 5.81781 3.22174 5.8674 3.39248L6.64074 6.04022C6.69074 6.21099 6.59267 6.38967 6.42212 6.43948C6.25159 6.48931 6.07288 6.39143 6.02286 6.22066L5.24952 3.57274C5.19971 3.40219 5.29759 3.22348 5.46835 3.17348ZM4.06046 3.17911C4.23123 3.12928 4.40992 3.22718 4.45972 3.39795L5.29332 6.25249C5.34334 6.42324 5.24525 6.60213 5.0747 6.65175C4.90414 6.70174 4.72543 6.60368 4.67542 6.43313L3.84163 3.5782C3.79203 3.40763 3.88972 3.22891 4.06046 3.17911Z\"\n [attr.fill]=\"color\" />\n <path\n d=\"M9.88112 7.60687C8.71086 7.60687 7.7627 8.55541 7.7627 9.72569C7.7627 10.8958 8.71086 11.8443 9.88112 11.8443C11.0514 11.8443 11.9999 10.8958 11.9999 9.72569C11.9999 8.55541 11.0514 7.60687 9.88112 7.60687ZM11.0917 10.0788H8.67055V9.37235H11.0917V10.0788Z\"\n [attr.fill]=\"color\" />\n </g>\n <defs>\n <clipPath id=\"clip0_330_2250\">\n <rect width=\"12\" height=\"12\" fill=\"white\" />\n </clipPath>\n </defs>\n</svg>\n", styles: [""], changeDetection: i0.ChangeDetectionStrategy.OnPush });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: EndOfCommercialisationIcnComponent, decorators: [{
type: Component,
args: [{ selector: 'cardinal-end-of-commercialisation-icn', imports: [], changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, template: "<svg\n width=\"12\"\n height=\"12\"\n viewBox=\"0 0 12 12\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <g clip-path=\"url(#clip0_330_2250)\">\n <path\n d=\"M4.65801 10.3098C4.52446 10.2195 4.36185 10.1662 4.18897 10.1664C4.07385 10.1664 3.96278 10.1899 3.86218 10.2325C3.71139 10.2963 3.58384 10.4023 3.49335 10.5362C3.40283 10.6698 3.34991 10.8324 3.3501 11.0052C3.34991 11.1204 3.37335 11.2314 3.416 11.3318C3.47997 11.4828 3.58579 11.6104 3.71952 11.7007C3.85328 11.7914 4.01608 11.8443 4.18897 11.8443C4.3041 11.8443 4.41496 11.8208 4.51536 11.7782C4.66635 11.7144 4.79408 11.6082 4.88439 11.4745C4.97472 11.3409 5.0278 11.1781 5.0278 11.0052C5.0278 10.8901 5.00415 10.7793 4.96171 10.6787C4.89793 10.5277 4.79174 10.4002 4.65801 10.3098ZM4.50062 11.1368C4.47503 11.1973 4.43181 11.2495 4.37772 11.2859C4.32346 11.3224 4.2599 11.3435 4.18895 11.3437C4.14147 11.3435 4.09745 11.3342 4.05735 11.3169C3.99707 11.2917 3.94473 11.2483 3.90829 11.1944C3.87184 11.1399 3.85091 11.0762 3.85054 11.0052C3.85072 10.9579 3.86022 10.9141 3.87728 10.8736C3.90247 10.8134 3.9459 10.7612 3.99995 10.7246C4.05423 10.6882 4.11798 10.6672 4.18893 10.667C4.23622 10.667 4.28003 10.6766 4.32032 10.6936C4.38079 10.719 4.43272 10.7622 4.46938 10.8165C4.50583 10.8708 4.52694 10.9343 4.52694 11.0053C4.52699 11.0527 4.51766 11.0966 4.50062 11.1368Z\"\n [attr.fill]=\"color\" />\n <path\n d=\"M3.95443 9.20724C3.86373 9.20724 3.77884 9.189 3.70093 9.15623C3.58466 9.10702 3.48425 9.02405 3.41408 8.91977C3.34663 8.81956 3.30671 8.70155 3.3036 8.57208C3.30709 8.4176 3.35633 8.28349 3.44277 8.17629C3.48756 8.12107 3.54278 8.0726 3.60983 8.03248C3.67611 7.99294 3.75423 7.96156 3.84592 7.94177L9.57245 7.00971C9.9467 6.94866 10.2442 6.6626 10.3198 6.29102L11.0203 2.84747V2.84709C11.0284 2.80716 11.0323 2.76645 11.0323 2.72616C11.0323 2.58698 10.9846 2.45093 10.895 2.34122C10.7797 2.20013 10.6068 2.11814 10.4243 2.11814H2.495L2.22481 1.18997V1.19016C2.10078 0.775195 1.76042 0.460828 1.33714 0.370125L0.367674 0.162539C0.203705 0.127266 0.0420336 0.231938 0.00678359 0.396094C-0.0283023 0.56025 0.0761586 0.721899 0.240526 0.756985L1.20962 0.964758C1.41601 1.00894 1.58192 1.16205 1.64221 1.36441L3.41371 7.44949C3.37379 7.4681 3.33521 7.48826 3.29821 7.51055C3.1071 7.62434 2.95398 7.78404 2.85125 7.97049C2.753 8.14763 2.70085 8.34844 2.696 8.55563H2.69502V8.5872H2.69579C2.69968 8.74906 2.73418 8.90431 2.79406 9.04599C2.89002 9.27256 3.04932 9.46425 3.25011 9.59991C3.4509 9.73575 3.69472 9.81541 3.95443 9.81523H7.17163C7.17064 9.7852 7.16717 9.75593 7.16717 9.7257C7.16717 9.54834 7.18538 9.37526 7.21815 9.20724H3.95443ZM8.28413 3.16263C8.45488 3.11302 8.63356 3.2107 8.68318 3.38145L9.33556 5.61441C9.38518 5.78517 9.28728 5.96367 9.11656 6.01366C8.94599 6.06349 8.7673 5.96562 8.71749 5.79485L8.06527 3.56187C8.01549 3.39134 8.11337 3.21265 8.28413 3.16263ZM6.87643 3.16845C7.04699 3.11843 7.2257 3.21631 7.27548 3.38707L7.99009 5.83418C8.0401 6.00476 7.94202 6.18363 7.77146 6.23346C7.60091 6.28324 7.4222 6.18539 7.37218 6.01463L6.65757 3.56747C6.60781 3.39696 6.70567 3.21806 6.87643 3.16845ZM5.46835 3.17348C5.6391 3.12387 5.81781 3.22174 5.8674 3.39248L6.64074 6.04022C6.69074 6.21099 6.59267 6.38967 6.42212 6.43948C6.25159 6.48931 6.07288 6.39143 6.02286 6.22066L5.24952 3.57274C5.19971 3.40219 5.29759 3.22348 5.46835 3.17348ZM4.06046 3.17911C4.23123 3.12928 4.40992 3.22718 4.45972 3.39795L5.29332 6.25249C5.34334 6.42324 5.24525 6.60213 5.0747 6.65175C4.90414 6.70174 4.72543 6.60368 4.67542 6.43313L3.84163 3.5782C3.79203 3.40763 3.88972 3.22891 4.06046 3.17911Z\"\n [attr.fill]=\"color\" />\n <path\n d=\"M9.88112 7.60687C8.71086 7.60687 7.7627 8.55541 7.7627 9.72569C7.7627 10.8958 8.71086 11.8443 9.88112 11.8443C11.0514 11.8443 11.9999 10.8958 11.9999 9.72569C11.9999 8.55541 11.0514 7.60687 9.88112 7.60687ZM11.0917 10.0788H8.67055V9.37235H11.0917V10.0788Z\"\n [attr.fill]=\"color\" />\n </g>\n <defs>\n <clipPath id=\"clip0_330_2250\">\n <rect width=\"12\" height=\"12\" fill=\"white\" />\n </clipPath>\n </defs>\n</svg>\n" }]
}], propDecorators: { color: [{
type: Input,
args: [{ required: true }]
}] } });
class StartOfCommercialisationIcnComponent {
color = 'currentColor';
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: StartOfCommercialisationIcnComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: StartOfCommercialisationIcnComponent, isStandalone: true, selector: "cardinal-start-of-commercialisation-icn", inputs: { color: "color" }, ngImport: i0, template: "<svg\n width=\"12\"\n height=\"12\"\n viewBox=\"0 0 12 12\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <g clip-path=\"url(#clip0_330_2383)\">\n <path\n d=\"M4.65803 10.3099C4.52448 10.2196 4.36187 10.1663 4.18897 10.1665C4.07385 10.1665 3.96278 10.1899 3.86218 10.2326C3.71139 10.2964 3.58384 10.4024 3.49335 10.5363C3.40283 10.6698 3.34991 10.8325 3.3501 11.0054C3.34991 11.1205 3.37337 11.2316 3.41601 11.3319C3.47997 11.4829 3.58579 11.6105 3.71952 11.7008C3.85326 11.7915 4.01608 11.8444 4.18897 11.8444C4.3041 11.8444 4.41496 11.8209 4.51536 11.7783C4.66635 11.7145 4.79408 11.6083 4.88441 11.4746C4.97474 11.341 5.02783 11.1782 5.02783 11.0053C5.02783 10.8902 5.00418 10.7793 4.96173 10.6788C4.89796 10.5278 4.79176 10.4002 4.65803 10.3099ZM4.50062 11.1369C4.47503 11.1974 4.43181 11.2496 4.37772 11.286C4.32346 11.3224 4.25987 11.3436 4.18895 11.3437C4.14147 11.3436 4.09745 11.3343 4.05735 11.317C3.99707 11.2918 3.94473 11.2484 3.90829 11.1945C3.87184 11.14 3.85091 11.0763 3.85054 11.0053C3.85075 10.958 3.86024 10.9142 3.8773 10.8737C3.9025 10.8134 3.94593 10.7613 3.99997 10.7247C4.05426 10.6882 4.11803 10.6673 4.18895 10.6671C4.23625 10.6671 4.28005 10.6766 4.32036 10.6937C4.38083 10.719 4.43277 10.7623 4.46943 10.8165C4.50587 10.8708 4.52699 10.9344 4.52699 11.0053C4.52699 11.0528 4.51768 11.0966 4.50062 11.1369Z\"\n [attr.fill]=\"color\" />\n <path\n d=\"M3.9545 9.20728C3.8638 9.20728 3.77891 9.18907 3.701 9.15631C3.58471 9.10709 3.4843 9.02412 3.41415 8.91985C3.3467 8.81965 3.30676 8.7016 3.30367 8.57215C3.30716 8.41765 3.3564 8.28354 3.44284 8.17636C3.4876 8.12112 3.54285 8.07267 3.6099 8.03255C3.67618 7.99301 3.75428 7.96163 3.84599 7.94185L9.57261 7.00976C9.94686 6.94871 10.2444 6.66263 10.32 6.29107L11.0205 2.84745V2.84707C11.0286 2.80714 11.0325 2.76645 11.0325 2.72614C11.0325 2.58696 10.9848 2.45091 10.8952 2.3412C10.7799 2.2001 10.607 2.11812 10.4245 2.11812H2.49505L2.22486 1.1899V1.19009C2.10081 0.775128 1.76045 0.460738 1.33714 0.370035L0.367674 0.162449C0.203705 0.127175 0.0420336 0.231824 0.00678359 0.396003C-0.0283023 0.56016 0.0761586 0.721808 0.240526 0.756894L1.20964 0.964667C1.41606 1.00885 1.58195 1.16196 1.64223 1.36432L3.41375 7.44949C3.37384 7.4681 3.33526 7.48826 3.29825 7.51055C3.10714 7.62434 2.95403 7.78404 2.8513 7.97049C2.75305 8.14765 2.7009 8.34844 2.69605 8.55565H2.69506V8.58722H2.69584C2.69973 8.74908 2.73423 8.90433 2.79411 9.04601C2.89006 9.27258 3.04937 9.46428 3.25016 9.59993C3.45095 9.73577 3.69477 9.81546 3.9545 9.81525H7.17174C7.17076 9.78523 7.16729 9.75595 7.16729 9.72572C7.16729 9.54837 7.1855 9.37528 7.21827 9.20724H3.9545V9.20728ZM8.28428 3.16259C8.45502 3.11297 8.63373 3.21066 8.68335 3.3814L9.33575 5.61441C9.38537 5.78517 9.28749 5.96368 9.11675 6.01367C8.94617 6.0635 8.76749 5.96562 8.71768 5.79485L8.06546 3.56185C8.01561 3.39129 8.11351 3.2126 8.28428 3.16259ZM6.87655 3.1684C7.04713 3.11839 7.22581 3.21626 7.27562 3.38703L7.99023 5.83418C8.04024 6.00476 7.94216 6.18366 7.7716 6.23346C7.60103 6.28327 7.42234 6.18539 7.37232 6.01463L6.65771 3.56745C6.60791 3.39694 6.70578 3.21802 6.87655 3.1684ZM5.46845 3.17344C5.63919 3.12382 5.8179 3.2217 5.86752 3.39244L6.64086 6.04022C6.69085 6.21099 6.59279 6.3897 6.42224 6.43948C6.25168 6.48931 6.07297 6.39143 6.02296 6.22067L5.24961 3.5727C5.19978 3.40214 5.29768 3.22346 5.46845 3.17344ZM4.06053 3.17907C4.2313 3.12924 4.41001 3.22714 4.45982 3.3979L5.29344 6.25249C5.34346 6.42324 5.24537 6.60214 5.07481 6.65178C4.90424 6.70177 4.72555 6.60371 4.67553 6.43315L3.84172 3.57818C3.79208 3.40758 3.88977 3.22889 4.06053 3.17907Z\"\n [attr.fill]=\"color\" />\n <path\n d=\"M9.88135 7.6069C8.71107 7.6069 7.7627 8.55547 7.7627 9.72575C7.7627 10.8958 8.71107 11.8444 9.88135 11.8444C11.0514 11.8444 12 10.8958 12 9.72575C12 8.55547 11.0514 7.6069 9.88135 7.6069ZM9.76121 10.7154L8.74831 9.90502L9.13266 9.42455L9.6583 9.84514L10.5439 8.70664L11.0298 9.0844L9.76121 10.7154Z\"\n [attr.fill]=\"color\" />\n </g>\n <defs>\n <clipPath id=\"clip0_330_2383\">\n <rect width=\"12\" height=\"12\" fill=\"white\" />\n </clipPath>\n </defs>\n</svg>\n", styles: [""], changeDetection: i0.ChangeDetectionStrategy.OnPush });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: StartOfCommercialisationIcnComponent, decorators: [{
type: Component,
args: [{ selector: 'cardinal-start-of-commercialisation-icn', imports: [], changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, template: "<svg\n width=\"12\"\n height=\"12\"\n viewBox=\"0 0 12 12\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <g clip-path=\"url(#clip0_330_2383)\">\n <path\n d=\"M4.65803 10.3099C4.52448 10.2196 4.36187 10.1663 4.18897 10.1665C4.07385 10.1665 3.96278 10.1899 3.86218 10.2326C3.71139 10.2964 3.58384 10.4024 3.49335 10.5363C3.40283 10.6698 3.34991 10.8325 3.3501 11.0054C3.34991 11.1205 3.37337 11.2316 3.41601 11.3319C3.47997 11.4829 3.58579 11.6105 3.71952 11.7008C3.85326 11.7915 4.01608 11.8444 4.18897 11.8444C4.3041 11.8444 4.41496 11.8209 4.51536 11.7783C4.66635 11.7145 4.79408 11.6083 4.88441 11.4746C4.97474 11.341 5.02783 11.1782 5.02783 11.0053C5.02783 10.8902 5.00418 10.7793 4.96173 10.6788C4.89796 10.5278 4.79176 10.4002 4.65803 10.3099ZM4.50062 11.1369C4.47503 11.1974 4.43181 11.2496 4.37772 11.286C4.32346 11.3224 4.25987 11.3436 4.18895 11.3437C4.14147 11.3436 4.09745 11.3343 4.05735 11.317C3.99707 11.2918 3.94473 11.2484 3.90829 11.1945C3.87184 11.14 3.85091 11.0763 3.85054 11.0053C3.85075 10.958 3.86024 10.9142 3.8773 10.8737C3.9025 10.8134 3.94593 10.7613 3.99997 10.7247C4.05426 10.6882 4.11803 10.6673 4.18895 10.6671C4.23625 10.6671 4.28005 10.6766 4.32036 10.6937C4.38083 10.719 4.43277 10.7623 4.46943 10.8165C4.50587 10.8708 4.52699 10.9344 4.52699 11.0053C4.52699 11.0528 4.51768 11.0966 4.50062 11.1369Z\"\n [attr.fill]=\"color\" />\n <path\n d=\"M3.9545 9.20728C3.8638 9.20728 3.77891 9.18907 3.701 9.15631C3.58471 9.10709 3.4843 9.02412 3.41415 8.91985C3.3467 8.81965 3.30676 8.7016 3.30367 8.57215C3.30716 8.41765 3.3564 8.28354 3.44284 8.17636C3.4876 8.12112 3.54285 8.07267 3.6099 8.03255C3.67618 7.99301 3.75428 7.96163 3.84599 7.94185L9.57261 7.00976C9.94686 6.94871 10.2444 6.66263 10.32 6.29107L11.0205 2.84745V2.84707C11.0286 2.80714 11.0325 2.76645 11.0325 2.72614C11.0325 2.58696 10.9848 2.45091 10.8952 2.3412C10.7799 2.2001 10.607 2.11812 10.4245 2.11812H2.49505L2.22486 1.1899V1.19009C2.10081 0.775128 1.76045 0.460738 1.33714 0.370035L0.367674 0.162449C0.203705 0.127175 0.0420336 0.231824 0.00678359 0.396003C-0.0283023 0.56016 0.0761586 0.721808 0.240526 0.756894L1.20964 0.964667C1.41606 1.00885 1.58195 1.16196 1.64223 1.36432L3.41375 7.44949C3.37384 7.4681 3.33526 7.48826 3.29825 7.51055C3.10714 7.62434 2.95403 7.78404 2.8513 7.97049C2.75305 8.14765 2.7009 8.34844 2.69605 8.55565H2.69506V8.58722H2.69584C2.69973 8.74908 2.73423 8.90433 2.79411 9.04601C2.89006 9.27258 3.04937 9.46428 3.25016 9.59993C3.45095 9.73577 3.69477 9.81546 3.9545 9.81525H7.17174C7.17076 9.78523 7.16729 9.75595 7.16729 9.72572C7.16729 9.54837 7.1855 9.37528 7.21827 9.20724H3.9545V9.20728ZM8.28428 3.16259C8.45502 3.11297 8.63373 3.21066 8.68335 3.3814L9.33575 5.61441C9.38537 5.78517 9.28749 5.96368 9.11675 6.01367C8.94617 6.0635 8.76749 5.96562 8.71768 5.79485L8.06546 3.56185C8.01561 3.39129 8.11351 3.2126 8.28428 3.16259ZM6.87655 3.1684C7.04713 3.11839 7.22581 3.21626 7.27562 3.38703L7.99023 5.83418C8.04024 6.00476 7.94216 6.18366 7.7716 6.23346C7.60103 6.28327 7.42234 6.18539 7.37232 6.01463L6.65771 3.56745C6.60791 3.39694 6.70578 3.21802 6.87655 3.1684ZM5.46845 3.17344C5.63919 3.12382 5.8179 3.2217 5.86752 3.39244L6.64086 6.04022C6.69085 6.21099 6.59279 6.3897 6.42224 6.43948C6.25168 6.48931 6.07297 6.39143 6.02296 6.22067L5.24961 3.5727C5.19978 3.40214 5.29768 3.22346 5.46845 3.17344ZM4.06053 3.17907C4.2313 3.12924 4.41001 3.22714 4.45982 3.3979L5.29344 6.25249C5.34346 6.42324 5.24537 6.60214 5.07481 6.65178C4.90424 6.70177 4.72555 6.60371 4.67553 6.43315L3.84172 3.57818C3.79208 3.40758 3.88977 3.22889 4.06053 3.17907Z\"\n [attr.fill]=\"color\" />\n <path\n d=\"M9.88135 7.6069C8.71107 7.6069 7.7627 8.55547 7.7627 9.72575C7.7627 10.8958 8.71107 11.8444 9.88135 11.8444C11.0514 11.8444 12 10.8958 12 9.72575C12 8.55547 11.0514 7.6069 9.88135 7.6069ZM9.76121 10.7154L8.74831 9.90502L9.13266 9.42455L9.6583 9.84514L10.5439 8.70664L11.0298 9.0844L9.76121 10.7154Z\"\n [attr.fill]=\"color\" />\n </g>\n <defs>\n <clipPath id=\"clip0_330_2383\">\n <rect width=\"12\" height=\"12\" fill=\"white\" />\n </clipPath>\n </defs>\n</svg>\n" }]
}], propDecorators: { color: [{
type: Input,
args: [{ required: true }]
}] } });
class ChevronIcnComponent {
color = 'currentColor';
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ChevronIcnComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: ChevronIcnComponent, isStandalone: true, selector: "cardinal-chevron-icn", inputs: { color: "color" }, ngImport: i0, template: "<svg\n width=\"12px\"\n height=\"12px\"\n viewBox=\"0 0 12 12\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <g clip-path=\"url(#clip0_153_633)\">\n <path\n d=\"M2.57153 1.018L2.57153 2.02247C2.57153 2.09077 2.60502 2.15505 2.65993 2.19523L7.90457 6.00014L2.65993 9.80506C2.60502 9.84523 2.57153 9.90952 2.57153 9.97782L2.57153 10.9823C2.57153 11.0693 2.67064 11.1202 2.74162 11.0693L9.25189 6.34702C9.4876 6.17559 9.4876 5.8247 9.25189 5.65461L2.74162 0.932286C2.67064 0.880054 2.57153 0.930947 2.57153 1.018Z\"\n [attr.fill]=\"color\" />\n </g>\n <defs>\n <clipPath id=\"clip0_153_633\">\n <rect\n width=\"12px\"\n height=\"12px\"\n fill=\"white\"\n transform=\"matrix(0 -1 1 0 0 12)\" />\n </clipPath>\n </defs>\n</svg>\n", styles: [""], changeDetection: i0.ChangeDetectionStrategy.OnPush });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ChevronIcnComponent, decorators: [{
type: Component,
args: [{ selector: 'cardinal-chevron-icn', imports: [], changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, template: "<svg\n width=\"12px\"\n height=\"12px\"\n viewBox=\"0 0 12 12\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <g clip-path=\"url(#clip0_153_633)\">\n <path\n d=\"M2.57153 1.018L2.57153 2.02247C2.57153 2.09077 2.60502 2.15505 2.65993 2.19523L7.90457 6.00014L2.65993 9.80506C2.60502 9.84523 2.57153 9.90952 2.57153 9.97782L2.57153 10.9823C2.57153 11.0693 2.67064 11.1202 2.74162 11.0693L9.25189 6.34702C9.4876 6.17559 9.4876 5.8247 9.25189 5.65461L2.74162 0.932286C2.67064 0.880054 2.57153 0.930947 2.57153 1.018Z\"\n [attr.fill]=\"color\" />\n </g>\n <defs>\n <clipPath id=\"clip0_153_633\">\n <rect\n width=\"12px\"\n height=\"12px\"\n fill=\"white\"\n transform=\"matrix(0 -1 1 0 0 12)\" />\n </clipPath>\n </defs>\n</svg>\n" }]
}], propDecorators: { color: [{
type: Input,
args: [{ required: true }]
}] } });
const getReimbursementOptions = (t) => [
{
value: null,
label: t('reimbursementHelper.practitionerSelectionOptions.none'),
},
{
value: Medication.InstructionsForReimbursementEnum.PAYINGTHIRDPARTY,
label: t('reimbursementHelper.practitionerSelectionOptions.PAYINGTHIRDPARTY'),
},
{
value: Medication.InstructionsForReimbursementEnum.FIRSTDOSE,
label: t('reimbursementHelper.practitionerSelectionOptions.FIRSTDOSE'),
},
{
value: Medication.InstructionsForReimbursementEnum.SECONDDOSE,
label: t('reimbursementHelper.practitionerSelectionOptions.SECONDDOSE'),
},
{
value: Medication.InstructionsForReimbursementEnum.THIRDDOSE,
label: t('reimbursementHelper.practitionerSelectionOptions.THIRDDOSE'),
},
{
value: Medication.InstructionsForReimbursementEnum.CHRONICKINDEYDISEASE,
label: t('reimbursementHelper.practitionerSelectionOptions.CHRONICKINDEYDISEASE'),
},
{
value: Medication.InstructionsForReimbursementEnum.DIABETESTREATMENT,
label: t('reimbursementHelper.practitionerSelectionOptions.DIABETESTREATMENT'),
},
{
value: Medication.InstructionsForReimbursementEnum.DIABETESCONVENTION,
label: t('reimbursementHelper.practitionerSelectionOptions.DIABETESCONVENTION'),
},
{
value: Medication.InstructionsForReimbursementEnum.NOTREIMBURSABLE,
label: t('reimbursementHelper.practitionerSelectionOptions.NOTREIMBURSABLE'),
},
{
value: Medication.InstructionsForReimbursementEnum.EXPLAINMEDICATION,
label: t('reimbursementHelper.practitionerSelectionOptions.EXPLAINMEDICATION'),
},
{
value: Medication.InstructionsForReimbursementEnum.DIABETESSTARTPATH,
label: t('reimbursementHelper.practitionerSelectionOptions.DIABETESSTARTPATH'),
},
];
function getCategoryLabelForReimbursement(code, translate) {
if (!code)
return '';
return translate(`reimbursementHelper.categoryOptions.${code}`) || code;
}
const homeTranslations = {
fr: {
samVersionLabel: 'Version Sam :',
},
en: {
samVersionLabel: 'Sam version:',
},
nl: {
samVersionLabel: 'Sam-versie:',
},
de: {
samVersionLabel: 'Sam-version:',
},
};
const prescriptionTranslations = {
fr: {
createTitle: 'Créer la prescription',
modifyTitle: 'Modifier la prescription',
pdf: {
title: 'PREUVE DE PRESCRIPTION ELECTRONIQUE',
instructions: 'Veuillez présenter ce document à votre pharmacien pour scanner le code-barres et vous délivrer les médicaments prescrits.',
options: {
title: 'De quelles options disposez-vous pour vous rendre à la pharmacie si vous avez perdu ce document ?',
option1: 'Via Masanté.be - MyHealthViewer - App MesMédicaments ou toute autre App, vous pouvez montrer votre prescription au pharmacien, qui lira le code-barres.',
option2: 'Vous pouvez également aller chercher les produits prescrits avec votre eID (ou votre numéro de registre national si votre eID a été lue par le pharmacien qui vous délivre les produits dans les 15 mois précédents).',
},
prescriber: 'Prescripteur',
patient: 'Bénéficiaire',
electronicContent: 'Contenu de la prescription électronique:',
product: 'Produit:',
dosage: 'Posologie:',
date: 'Date:',
validUntil: "Date de fin pour l'exécution:",
},
list: {
sentTitle: 'Ordonnances envoyées:',
pendingTitle: 'Ordonnances en attente:',
print: 'Imprimer',
send: 'Envoyer',
sendAndPrint: 'Envoyer et imprimer',
},
form: {
medicationTitle: 'Nom du groupe DCI',
dosage: 'Posologie',
duration: 'Durée (nombre d’unités)',
durationTimeUnit: 'Unité de temps',
treatmentStartDate: 'Date début du traitement',
executableUntil: 'Exécutable jusqu`au',
prescriptionsNumber: 'Nombre de prescriptions',
periodicityTimeUnit: 'Périodicité',
periodicityDaysNumber: 'Nombre de jours',
substitutionAllowed: 'Substitution autorisée',
substitutionYes: 'Oui',
substitutionNo: 'Non',
toggleExtraFields: 'Afficher plus',
patientInstructions: 'Instructions pour le patient',
reimbursementInstructions: 'Instructions remboursement',
prescriberVisibility: 'Visibilité prescripteur',
pharmacistVisibility: 'Visibilité officine',
cancel: 'Annuler',
submit: 'Soumettre',
fieldRequired: 'Ce champ est requis',
fieldInvalid: 'Champ invalide',
instructionLabelNone: 'Aucun',
},
},
en: {
createTitle: 'Create prescription',
modifyTitle: 'Modify prescription',
pdf: {
title: 'PROOF OF ELECTRONIC PRESCRIPTION',
instructions: 'Please present this document to your pharmacist to scan the barcode and dispense the prescribed medication.',
options: {
title: 'What are your options if you lost this document?',
option1: 'Via Masanté.be - MyHealthViewer - MyMeds App or any other app, you can show your prescription to the pharmacist who will scan the barcode.',
option2: 'You can also collect the prescribed products with your eID (or your national register number if your eID was read by the pharmacist who dispenses the products within the last 15 months).',
},
prescriber: 'Prescriber',
patient: 'Beneficiary',
electronicContent: 'Electronic prescription content:',
product: 'Product:',
dosage: 'Dosage:',
date: 'Date:',
validUntil: 'Valid until:',
},
list: {
sentTitle: 'Sent prescriptions:',
pendingTitle: 'Pending prescriptions:',
print: 'Print',
send: 'Send',
sendAndPrint: 'Send and print',
},
form: {
medicationTitle: 'DCI group name',
dosage: 'Dosage',
duration: 'Duration (number of units)',
durationTimeUnit: 'Time unit',
treatmentStartDate: 'Start date of treatment',
executableUntil: 'Executable until',
prescriptionsNumber: 'Number of prescriptions',
periodicityTimeUnit: 'Periodicity',
periodicityDaysNumber: 'Number of days',
substitutionAllowed: 'Substitution allowed',
substitutionYes: 'Yes',
substitutionNo: 'No',
toggleExtraFields: 'Show more',
patientInstructions: 'Instructions for the patient',
reimbursementInstructions: 'Reimbursement instructions',
prescriberVisibility: 'Prescriber visibility',
pharmacistVisibility: 'Pharmacist visibility',
cancel: 'Cancel',
submit: 'Submit',
fieldRequired: 'This field is required',
fieldInvalid: 'Invalid field',
instructionLabelNone: 'None',
},
},
nl: {
createTitle: 'Voorschrift aanmaken',
modifyTitle: 'Voorschrift bewerken',
pdf: {
title: 'BEWIJS VAN ELEKTRONISCH VOORSCHRIFT',
instructions: 'Gelieve dit document aan uw apotheker te tonen zodat hij/zij de barcode kan scannen en de voorgeschreven geneesmiddelen kan afleveren.',
options: {
title: 'Welke opties hebt u om naar de apotheek te gaan als u dit document bent verloren?',
option1: 'Via Masanté.be - MyHealthViewer - MijnGeneesmiddelen-app of een andere app, kunt u uw voorschrift tonen aan de apotheker, die de barcode zal scannen.',
option2: 'U kunt de voorgeschreven producten ook afhalen met uw eID (of uw rijksregisternummer als uw eID werd uitgelezen door de apotheker die de producten aflevert binnen de laatste 15 maanden).',
},
prescriber: 'Voorschrijver',
patient: 'Begunstigde',
electronicContent: 'Inhoud van het elektronisch voorschrift:',
product: 'Product:',
dosage: 'Dosering:',
date: 'Datum:',
validUntil: 'Uitvoerbaar tot:',
},
list: {
sentTitle: 'Verzonden voorschriften:',
pendingTitle: 'Voorschriften in afwachting:',
print: 'Afdrukken',
send: 'Verzenden',
sendAndPrint: 'Verzenden en afdrukken',
},
form: {
medicationTitle: 'Naam van DCI-groep',
dosage: 'Dosering',
duration: 'Duur (aantal eenheden)',
durationTimeUnit: 'Tijdseenheid',
treatmentStartDate: 'Startdatum van behandeling',
executableUntil: 'Uitvoerbaar tot',
prescriptionsNumber: 'Aantal voorschriften',
periodicityTimeUnit: 'Periodiciteit',
periodicityDaysNumber: 'Aantal dagen',
substitutionAllowed: 'Vervanging toegestaan',
substitutionYes: 'Ja',
substitutionNo: 'Nee',
toggleExtraFields: 'Meer weergeven',
patientInstructions: 'Instructies voor de patiënt',
reimbursementInstructions: 'Instructies voor terugbetaling',
prescriberVisibility: 'Zichtbaarheid voor de voorschrijver',
pharmacistVisibility: 'Zichtbaarheid voor de apotheker',
cancel: 'Annuleren',
submit: 'Indienen',
fieldRequired: 'Dit veld is verplicht',
fieldInvalid: 'Ongeldig veld',
instructionLabelNone: 'Geen',
},
},
de: {
createTitle: 'Rezept erstellen',
modifyTitle: 'Rezept bearbeiten',
pdf: {
title: 'NACHWEIS DES ELEKTRONISCHEN REZEPTS',
instructions: 'Bitte legen Sie dieses Dokument Ihrem Apotheker vor, damit er den Barcode scannen und die verschriebenen Medikamente abgeben kann.',
options: {
title: 'Welche Möglichkeiten haben Sie, wenn Sie dieses Dokument verloren haben?',
option1: 'Über Masanté.be – MyHealthViewer – MeineMedikamente-App oder eine andere App können Sie Ihr Rezept dem Apotheker zeigen, der den Barcode scannt.',
option2: 'Sie können die verschriebenen Produkte auch mit Ihrem eID (oder Ihrer nationalen Registernummer, falls Ihre eID vom Apotheker, der Ihnen in den letzten 15 Monaten Produkte ausgehändigt hat, gelesen wurde) abholen.',
},
prescriber: 'Verschreiber',
patient: 'Empfänger',
electronicContent: 'Inhalt des elektronischen Rezepts:',
product: 'Produkt:',
dosage: 'Dosierung:',
date: 'Datum:',
validUntil: 'Gültig bis:',
},
list: {
sentTitle: 'Versendete Rezepte:',
pendingTitle: 'Ausstehende Rezepte:',
print: 'Drucken',
send: 'Senden',
sendAndPrint: 'Senden und drucken',
},
form: {
medicationTitle: 'Name der DCI-Gruppe',
dosage: 'Dosierung',
duration: 'Dauer (Anzahl der Einheiten)',
durationTimeUnit: 'Zeiteinheit',
treatmentStartDate: 'Behandlungsbeginn',
executableUntil: 'Ausführbar bis',
prescriptionsNumber: 'Anzahl der Rezepte',
periodicityTimeUnit: 'Periodizität',
periodicityDaysNumber: 'Anzahl der Tage',
substitutionAllowed: 'Substitution erlaubt',
substitutionYes: 'Ja',
substitutionNo: 'Nein',
toggleExtraFields: 'Mehr anzeigen',
patientInstructions: 'Anweisungen für den Patienten',
reimbursementInstructions: 'Anweisungen zur Erstattung',
prescriberVisibility: 'Sichtbarkeit für den Verschreiber',
pharmacistVisibility: 'Sichtbarkeit für den Apotheker',
cancel: 'Abbrechen',
submit: 'Absenden',
fieldRequired: 'Dieses Feld ist erforderlich',
fieldInvalid: 'Ungültiges Feld',
instructionLabelNone: 'Keine',
},
},
};
const medicationTranslations = {
fr: {
drugType: {
medication: 'Médicament',
molecule: 'Molécule',
homologation: 'Homologation',
},
drugInfographic: {
blackTriangle: 'Pharmacovigilance renforcée (Triangle noir)',
rma: 'Activités additionnelles de minimisation des risques ou additional RMA (Risk Minimisation Activities) (Source: AFMPS)',
genericPrescriptionRequired: 'Ordonnance générique requise',
},
drugSpecialRegulation: {
noNarcoticRegulation: 'Aucun stupéfiant, médicament soumis à réglementation particulière',
narcoticRegulation: 'Stupéfiant, médicament soumis à réglementation particulière',
noSpecialRegulation: 'Aucune réglementation particulière',
},
supply: {
issueTitle: "Problème d'approvisionnement temporaire :",
startDate: 'Disponibilité limitée depuis :',
expectedEndDate: 'Date de fin présumée :',
reason: 'Raison :',
impact: 'Impact :',
prescriberNote: 'Déclaration du prescripteur :',
downloadPdf: 'Télécharger le document en .pdf',
extraInfo: 'Informations complémentaires :',
},
commercialization: {
end: 'Fin de commercialisation :',
limitedAvailabilityFrom: 'Disponibilité limitée à partir de :',
unavailableFrom: 'Indisponible à partir de :',
endReason: 'Raison :',
endImpact: 'Impact :',
endAdditionalInformation: 'Informations complémentaires :',
start: 'Début de commercialisation :',
startAvailableFrom: 'Disponible depuis :',
},
reimbursement: {
title: 'Remboursement :',
category: 'Catégorie de remboursement :',
categoryLabel: 'Spécification de la catégorie de remboursement :',
copay: 'Ticket modérateur type',
copayPreferential: ' Préférentiel :',
copayActive: ' Actif :',
temporary: 'Remboursement temporaire (art. 111) :',
chapter: 'Chapitre :',
noneTitle: 'Conditions de prescription',
notApplicable: 'Non applicable',
non: 'Non',
},
delivery: {
title: 'Conditions de livraison :',
code: 'Code de livraison :',
modus: 'Mode de livraison :',
specification: 'Spécification de livraison :',
notApplicable: 'Non applicable',
},
prescription: {
title: 'Conditions de prescription :',
code: 'Code de prescription :',
specification: 'Spécification de prescription :',
free: 'Libre de prescription',
},
vmp: {
label: 'VMP :',
groupLabel: 'Groupe VMP :',
},
links: {
cbip: 'Répertoire commenté des médicaments (CBIP)',
leaflet: 'Notice pour le patient',
rma: 'Activités de réduction des risques (RMA)',
spc: 'Résumé des caractéristiques du produit (RCP)',
dhpc: 'Communication directe aux professionnels de santé (DHPC)',
},
ui: {
price: 'Prix :',
},
search: {
label: 'Trouver un médicament',
errorMessage: ' Entrez au moins 3 lettres du nom du médicament',
},
},
en: {
drugType: {
medication: 'Medication',
molecule: 'Molecule',
homologation: 'Homologation',
},
drugInfographic: {
blackTriangle: 'Enhanced pharmacovigilance (Black triangle)',
rma: 'Additional risk minimisation activities or additional RMA (Risk Minimisation Activities) (Source: FAMHP)',
genericPrescriptionRequired: 'Generic prescription required',
},
drugSpecialRegulation: {
noNarcoticRegulation: 'No narcotic, specially regulated drug',
narcoticRegulation: 'Narcotic, specially regulated drug',
noSpecialRegulation: 'No special regulation',
},
supply: {
issueTitle: 'Temporary supply problem:',
startDate: 'Limited availability since:',
expectedEndDate: 'Presumed end date:',
reason: 'Reason:',
impact: 'Impact:',
prescriberNote: 'Prescriber declaration:',
downloadPdf: 'Download the document (.pdf)',
extraInfo: 'Additional information:',
},
commercialization: {
end: 'End of commercialisation:',
limitedAvailabilityFrom: 'Limited availability from:',
unavailableFrom: 'Unavailable from:',
endReason: 'Reason:',
endImpact: 'Impact:',
endAdditionalInformation: 'Additional information:',
start: 'Start of commercialisation:',
startAvailableFrom: 'Available from:',
},
reimbursement: {
title: 'Reimbursement:',
category: 'Reimbursement category:',
categoryLabel: 'Reimbursement category specification:',
copay: 'Co-payment type',
copayPreferential: 'Preferential:',
copayActive: 'Active:',
temporary: 'Temporary reimbursement (art. 111):',
chapter: 'Chapter:',
noneTitle: 'Prescription conditions',
notApplicable: 'Not applicable',
non: 'No',
},
delivery: {
title: 'Delivery conditions:',
code: 'Delivery code:',
modus: 'Delivery method:',
specification: 'Delivery specification:',
notApplicable: 'Not applicable',
},
prescription: {
title: 'Prescription conditions:',
code: 'Prescription code:',
specification: 'Prescription specification:',
free: 'Free of prescription',
},
vmp: {
label: 'VMP:',
groupLabel: 'VMP-group:',
},
links: {
cbip: 'Commented Medicines Directory (CBIP)',
leaflet: 'Patient information leaflet',
rma: 'Risk Minimisation Activities (RMA)',
spc: 'Summary of Product Characteristics (SPC)',
dhpc: 'Direct Healthcare Professional Communication (DHPC)',
},
ui: {
price: 'Price:',
},
search: {
label: 'Find a medication',
errorMessage: 'Enter at least 3 letters of the medication name',
},
},
nl: {
drugType: {
medication: 'Geneesmiddel',
molecule: 'Molecule',
homologation: 'Homologatie',
},
drugInfographic: {
blackTriangle: 'Verhoogde waakzaamheid (Zwarte driehoek)',
rma: 'Aanvullende risicobeperkende maatregelen (RMA) (Bron: FAGG)',
genericPrescriptionRequired: 'Generiek voorschrift vereist',
},
drugSpecialRegulation: {
noNarcoticRegulation: 'Geen verdovend middel, geneesmiddel onderworpen aan specifieke regelgeving',
narcoticRegulation: 'Verdovend middel, geneesmiddel onderworpen aan specifieke regelgeving',
noSpecialRegulation: 'Geen specifieke regelgeving',
},
supply: {
issueTitle: 'Tijdelijk bevoorradingsprobleem:',
startDate: 'Beperkte beschikbaarheid sinds:',
expectedEndDate: 'Verwachte einddatum:',
reason: 'Reden:',
impact: 'Impact:',
prescriberNote: 'Verklaring van de voorschrijver:',
downloadPdf: 'Download het document (.pdf)',
extraInfo: 'Aanvullende informatie:',
},
commercialization: {
end: 'Einde van commercialisering:',
limitedAvailabilityFrom: 'Beperkte beschikbaarheid vanaf:',
unavailableFrom: 'Niet beschikbaar vanaf:',
endReason: 'Reden:',
endImpact: 'Impact:',
endAdditionalInformation: 'Aanvullende informatie:',
start: 'Start van commercialisering:',
startAvailableFrom: 'Beschikbaar sinds:',
},
reimbursement: {
title: 'Terugbetaling:',
category: 'Terugbetalingscategorie:',
categoryLabel: 'Specificatie van de terugbetalingscategorie:',
copay: 'Soort remgeld',
copayPreferential: 'Voorkeurtarief:',
copayActive: 'Actief:',
temporary: 'Tijdelijke terugbetaling (art. 111):',
chapter: 'Hoofdstuk:',
noneTitle: 'Voorschrijfvoorwaarden',
notApplicable: 'Niet van toepassing',
non: 'Nee',
},
delivery: {
title: 'Aflevervoorwaarden:',
code: 'Aflevercode:',
modus: 'Afleverwijze:',
specification: 'Specificatie van aflevering:',
notApplicable: 'Niet van toepassing',
},
prescription: {
title: 'Voorschrijfvoorwaarden:',
code: 'Voorschrijfcode:',
specification: 'Specificatie van voorschrift:',
free: 'Vrij voorschrijfbaar',
},
vmp: {
label: 'VMP:',
groupLabel: 'VMP-groep:',
},
links: {
cbip: 'Gecommentarieerde geneesmiddelenrepertorium (CBIP)',
leaflet: 'Bijsluiter voor de patiënt',
rma: 'Maatregelen voor risicobeperking (RMA)',
spc: 'Samenvatting van de productkenmerken (SKP)',
dhpc: 'Rechtstreekse communicatie naar zorgverleners (DHPC)',
},
ui: {
price: 'Prijs:',
},
search: {
label: 'Zoek een geneesmiddel',
errorMessage: 'Voer minstens 3 letters van de naam in',
},
},
de: {
drugType: {
medication: 'Arzneimittel',
molecule: 'Molekül',
homologation: 'Zulassung',
},
drugInfographic: {
blackTriangle: 'Verstärkte Pharmakovigilanz (Schwarzes Dreieck)',
rma: 'Zusätzliche Maßnahmen zur Risikominimierung (RMA) (Quelle: BfArM)',
genericPrescriptionRequired: 'Generisches Rezept erforderlich',
},
drugSpecialRegulation: {
noNarcoticRegulation: 'Kein Betäubungsmittel, Arzneimittel mit besonderer Regelung',
narcoticRegulation: 'Betäubungsmittel, Arzneimittel mit besonderer Regelung',
noSpecialRegulation: 'Keine besondere Regelung',
},
supply: {
issueTitle: 'Vorübergehendes Lieferproblem :',
startDate: 'Eingeschränkte Verfügbarkeit seit :',
expectedEndDate: 'Voraussichtliches Enddatum :',
reason: 'Grund :',
impact: 'Auswirkung :',
prescriberNote: 'Erklärung des Verschreibers :',
downloadPdf: 'Dokument als .pdf herunterladen',
extraInfo: 'Zusätzliche Informationen :',
},
commercialization: {
end: 'Ende der Vermarktung :',
limitedAvailabilityFrom: 'Eingeschränkte Verfügbarkeit ab :',
unavailableFrom: 'Nicht verfügbar ab :',
endReason: 'Grund :',
endImpact: 'Auswirkung :',
endAdditionalInformation: 'Zusätzliche Informationen :',
start: 'Beginn der Vermarktung :',
startAvailableFrom: 'Verfügbar seit :',
},
reimbursement: {
title: 'Erstattung :',
category: 'Erstattungskategorie :',
categoryLabel: 'Spezifikation der Erstattungskategorie :',
copay: 'Zuzahlungstyp',
copayPreferential: ' Bevorzugt :',
copayActive: ' Aktiv :',
temporary: 'Vorübergehende Erstattung (Art. 111) :',
chapter: 'Kapitel :',
noneTitle: 'Verordnungsbedingungen',
notApplicable: 'Nicht zutreffend',
non: 'Nein',
},
delivery: {
title: 'Lieferbedingungen :',
code: 'Liefercode :',
modus: 'Liefermethode :',
specification: 'Lieferdetails :',
notApplicable: 'Nicht zutreffend',
},
prescription: {
title: 'Verordnungsbedingungen :',
code: 'Verordnungscode :',
specification: 'Verordnungsdetails :',
free: 'Frei verschreibbar',
},
vmp: {
label: 'VMP :',
groupLabel: 'VMP-Gruppe :',
},
links: {
cbip: 'Kommentiertes Arzneimittelverzeichnis (CBIP)',
leaflet: 'Packungsbeilage für Patienten',
rma: 'Maßnahmen zur Risikominimierung (RMA)',
spc: 'Fachinformation (SPC)',
dhpc: 'Direkte Kommunikation an medizinisches Fachpersonal (DHPC)',
},
ui: {
price: 'Preis :',
},
search: {
label: 'Arzneimittel suchen',
errorMessage: 'Geben Sie mindestens 3 Buchstaben des Arzneimittelnamens ein',
},
},
};
const practitionerTranslations = {
fr: {
certificateUpload: {
titleUpload: 'Télécharger le certificat',
titlePassword: 'Entrez le mot de passe du certificat',
fileLabel: 'Certificat du praticien',
passwordLabel: 'Mot de passe du certificat',
submitButtonUpload: 'Crypter et télécharger',
submitButtonPassword: 'Soumettre',
resetButton: 'Télécharger un autre certificat',
errorRequired: 'Ce champ est requis',
errorInvalid: 'Champ invalide',
passwordMissingTitle: 'Mot de passe manquant',
passwordMissingDescription: 'Veuillez saisir le mot de passe associé au certificat afin de pouvoir le déchiffrer. Ce mot de passe est requis pour poursuivre la vérification.',
},
certificateFeedback: {
successTitle: 'Téléchargement du certificat réussi',
successDescription: 'Le certificat du praticien a été téléchargé avec succès et le mot de passe a été enregistré en toute sécurité. Vous pouvez maintenant poursuivre les prochaines étapes.',
failureTitle: 'Échec du téléchargement du certificat',
failureDescription: "Une erreur est survenue lors du téléchargement du certificat du praticien ou de l'enregistrement du mot de passe. Veuillez vous assurer que le certificat est valide et réessayez. Si le problème persiste, contactez le support.",
verificationErrorTitle: 'Erreur de vérification du certificat',
},
printModal: {
title: 'Imprimer la prescription',
close: 'Fermer',
print: 'Imprimer',
},
},
en: {
certificateUpload: {
titleUpload: 'Upload certificate',
titlePassword: 'Enter certificate password',
fileLabel: 'Practitioner certificate',
passwordLabel: 'Certificate password',
submitButtonUpload: 'Encrypt and upload',
submitButtonPassword: 'Submit',
resetButton: 'Upload another certificate',
errorRequired: 'This field is required',
errorInvalid: 'Invalid field',
passwordMissingTitle: 'Missing password',
passwordMissingDescription: 'Please enter the password associated with the certificate to decrypt it. This password is required to continue verification.',
},
certificateFeedback: {
successTitle: 'Certificate upload successful',
successDescription: 'The certificate’s certificate was uploaded successfully and the password has been securely saved. You may proceed with the next steps.',
failureTitle: 'Certificate upload failed',
failureDescription: 'An error occurred while uploading the certificate or saving the password. Please ensure the certificate is valid and try again. If the problem persists, contact support.',
verificationErrorTitle: 'Certificate verification error',
},
printModal: {
title: 'Print prescription',
close: 'Close',
print: 'Print',
},
},
nl: {
certificateUpload: {
titleUpload: 'Certificaat uploaden',
titlePassword: 'Voer het certificaatwachtwoord in',
fileLabel: 'Certificaat van de zorgverlener',
passwordLabel: 'Wachtwoord van het certificaat',
submitButtonUpload: 'Versleutelen en uploaden',
submitButtonPassword: 'Verzenden',
resetButton: 'Ander certificaat uploaden',
errorRequired: 'Dit veld is verplicht',
errorInvalid: 'Ongeldig veld',
passwordMissingTitle: 'Wachtwoord ontbreekt',
passwordMissingDescription: 'Voer het wachtwoord in dat aan het certificaat is gekoppeld om het te ontsleutelen. Dit wachtwoord is vereist om de verificatie voort te zetten.',
},
certificateFeedback: {
successTitle: 'Certificaat succesvol geüpload',
successDescription: 'Het certificaat van de zorgverlener is succesvol geüpload en het wachtwoord is veilig opgeslagen. U kunt nu doorgaan met de volgende stappen.',
failureTitle: 'Uploaden van certificaat mislukt',
failureDescription: 'Er is een fout opgetreden bij het uploaden van het certificaat of het opslaan van het wachtwoord. Zorg ervoor dat het certificaat geldig is en probeer het opnieuw. Neem contact op met de ondersteuning als het probleem aanhoudt.',
verificationErrorTitle: 'Fout bij verificatie van certificaat',
},
printModal: {
title: 'Voorschrift afdrukken',
close: 'Sluiten',
print: 'Afdrukken',
},
},
de: {
certificateUpload: {
titleUpload: 'Zertifikat hochladen',
titlePassword: 'Zertifikat-Passwort eingeben',
fileLabel: 'Zertifikat des Arztes',
passwordLabel: 'Passwort des Zertifikats',
submitButtonUpload: 'Verschlüsseln und hochladen',
submitButtonPassword: 'Absenden',
resetButton: 'Anderes Zertifikat hochladen',
errorRequired: 'Dieses Feld ist erforderlich',
errorInvalid: 'Ungültiges Feld',
passwordMissingTitle: 'Passwort fehlt',
passwordMissingDescription: 'Bitte geben Sie das Passwort ein, das mit dem Zertifikat verknüpft ist, um es zu entschlüsseln. Dieses Passwort ist für die weitere Überprüfung erforderlich.',
},
certificateFeedback: {
successTitle: 'Zertifikat erfolgreich hochgeladen',
successDescription: 'Das Zertifikat des Arztes wurde erfolgreich hochgeladen und das Passwort wurde sicher gespeichert. Sie können nun mit den nächsten Schritten fortfahren.',
failureTitle: 'Zertifikat-Upload fehlgeschlagen',
failureDescription: 'Beim Hochladen des Zertifikats oder beim Speichern des Passworts ist ein Fehler aufgetreten. Bitte stellen Sie sicher, dass das Zertifikat gültig ist, und versuchen Sie es erneut. Wenn das Problem weiterhin besteht, wenden Sie sich an den Support.',
verificationErrorTitle: 'Fehler bei der Zertifikatsprüfung',
},
printModal: {
title: 'Rezept drucken',
close: 'Schließen',
print: 'Drucken',
},
},
};
const prescriptionVisibilityTranslations = {
fr: {
practitionerVisibility: {
open: 'Visible pour tous les prescripteurs',
locked: 'Visible uniquement pour moi-même',
gmd_prescriber: 'Visible uniquement pour le titulaire du DMG',
},
pharmacistVisibility: {
null: 'Le médicament est visible par tous les pharmaciens',
locked: 'Le médicament n`est pas visible par tous les pharmaciens',
},
},
en: {
practitionerVisibility: {
open: 'Visible to all prescribers',
locked: 'Visible only to myself',
gmd_prescriber: 'Visible only to the GMD holder',
},
pharmacistVisibility: {
null: 'The medication is visible to all pharmacists',
locked: 'The medication is not visible to all pharmacists',
},
},
nl: {
practitionerVisibility: {
open: 'Zichtbaar voor alle voorschrijvers',
locked: 'Alleen zichtbaar voor mezelf',
gmd_prescriber: 'Alleen zichtbaar voor de GMD-houder',
},
pharmacistVisibility: {
null: 'Het geneesmiddel is zichtbaar voor alle apothekers',
locked: 'Het geneesmiddel is niet zichtbaar voor alle apothekers',
},
},
de: {
practitionerVisibility: {
open: 'Sichtbar für alle verschreiber',
locked: 'Nur für mich sichtbar',
gmd_prescriber: 'Nur für den GMD-inhaber sichtbar',
},
pharmacistVisibility: {
null: 'Das medikament ist für alle apotheker sichtbar',
locked: 'Das medikament ist nicht für alle apotheker sichtbar',
},
},
};
const reimbursementTranslations = {
fr: {
practitionerSelectionOptions: {
none: 'Aucun',
PAYINGTHIRDPARTY: 'Tiers Payant',
FIRSTDOSE: 'Première Dose',
SECONDDOSE: 'Deuxième Dose',
THIRDDOSE: 'Troisième Dose',
CHRONICKINDEYDISEASE: 'Maladie Rénale Chronique',
DIABETESTREATMENT: 'Traitement du Diabète',
DIABETESCONVENTION: 'Convention Diabète',
NOTREIMBURSABLE: 'Non Remboursable',
EXPLAINMEDICATION: 'Explication du Médicament',
DIABETESSTARTPATH: 'Parcours Initial Diabète',
},
categoryOptions: {
A: 'Médicaments vitaux',
B: 'Médicaments thérapeutiquement importants',
C: 'Médicaments pour traitement symptomatique',
Cs: 'Ex. vaccins, médicaments antiallergiques',
Cx: 'Ex. contraceptifs',
Fa: 'Médicaments vitaux remboursés sur une base fixe',
Fb: 'Médicaments thérapeutiquement importants remboursés sur une base fixe',
},
},
en: {
practitionerSelectionOptions: {
none: 'None',
PAYINGTHIRDPARTY: 'Third-party payment',
FIRSTDOSE: 'First dose',
SECONDDOSE: 'Second dose',
THIRDDOSE: 'Third dose',
CHRONICKINDEYDISEASE: 'Chronic kidney disease',
DIABETESTREATMENT: 'Diabetes treatment',
DIABETESCONVENTION: 'Diabetes convention',
NOTREIMBURSABLE: 'Not reimbursable',
EXPLAINMEDICATION: 'Medication explanation',
DIABETESSTARTPATH: 'Diabetes initial care path',
},
categoryOptions: {
A: 'Life-saving medicines',
B: 'Therapeutically important medicines',
C: 'Medicines for symptomatic treatment',
Cs: 'e.g. vaccines, allergy medicines',
Cx: 'e.g. contraceptives',
Fa: 'Life-saving medicines with reimbursement based on a fixed amount',
Fb: 'Therapeutically important medicines with reimbursement based on a fixed amount',
},
},
nl: {
practitionerSelectionOptions: {
none: 'Geen',
PAYINGTHIRDPARTY: 'Derdebetaler',
FIRSTDOSE: 'Eerste Dosis',
SECONDDOSE: 'Tweede Dosis',
THIRDDOSE: 'Derde Dosis',
CHRONICKINDEYDISEASE: 'Chronische Nierziekte',
DIABETESTREATMENT: 'Diabetesbehandeling',
DIABETESCONVENTION: 'Diabetesconventie',
NOTREIMBURSABLE: 'Niet Terugbetaalbaar',
EXPLAINMEDICATION: 'Uitleg over het Geneesmiddel',
DIABETESSTARTPATH: 'Opstarttraject Diabetes',
},
categoryOptions: {
A: 'Levensreddende geneesmiddelen',
B: 'Therapeutisch belangrijke geneesmiddelen',
C: 'Geneesmiddelen voor symptomatische behandeling',
Cs: 'bv. vaccins, allergiemedicatie',
Cx: 'bv. anticonceptiva',
Fa: 'Levensreddende geneesmiddelen met terugbetaling op basis van een vast bedrag',
Fb: 'Therapeutisch belangrijke geneesmiddelen met terugbetaling op basis van een vast bedrag',
},
},
de: {
practitionerSelectionOptions: {
none: 'Keine',
PAYINGTHIRDPARTY: 'Drittzahlerregelung',
FIRSTDOSE: 'Erste Dosis',
SECONDDOSE: 'Zweite Dosis',
THIRDDOSE: 'Dritte Dosis',
CHRONICKINDEYDISEASE: 'Chronische Nierenerkrankung',
DIABETESTREATMENT: 'Diabetesbehandlung',
DIABETESCONVENTION: 'Diabetesvereinbarung',
NOTREIMBURSABLE: 'Nicht Erstattungsfähig',
EXPLAINMEDICATION: 'Erläuterung zum Medikament',
DIABETESSTARTPATH: 'Einstiegspfad Diabetes',
},
categoryOptions: {
A: 'Lebensrettende Medikamente',
B: 'Therapeutisch wichtige Medikamente',
C: 'Medikamente zur symptomatischen Behandlung',
Cs: 'z. B. Impfstoffe, Allergiemedikamente',
Cx: 'z. B. Verhütungsmittel',
Fa: 'Lebensrettende Medikamente mit Erstattung auf Basis eines Festbetrags',
Fb: 'Therapeutisch wichtige Medikamente mit Erstattung auf Basis eines Festbetrags',
},
},
};
const prescriptionDurationTranslations = {
fr: {
durationUnits: {
day: 'jour',
week: 'semaine',
},
periodicityUnits: {
none: 'aucune',
week: 'semaine',
twoWeeks: '2 semaines',
threeWeeks: '3 semaines',
numberOfDays: 'x nombre de jours',
},
},
en: {
durationUnits: {
day: 'day',
week: 'week',
},
periodicityUnits: {
none: 'none',
week: 'week',
twoWeeks: '2 weeks',
threeWeeks: '3 weeks',
numberOfDays: 'x number of days',
},
},
nl: {
durationUnits: {
day: 'dag',
week: 'week',
},
periodicityUnits: {
none: 'geen',
week: 'week',
twoWeeks: '2 weken',
threeWeeks: '3 weken',
numberOfDays: 'x aantal dagen',
},
},
de: {
durationUnits: {
day: 'tag',
week: 'woche',
},
periodicityUnits: {
none: 'keine',
week: 'woche',
twoWeeks: '2 wochen',
threeWeeks: '3 wochen',
numberOfDays: 'x anzahl der tage',
},
},
};
const deliveryModusTranslations = {
fr: {
specifications: {
Sp: 'Prescription par un médecin-spécialiste',
Sp1: 'Première prescription par un médecin-spécialiste, prescription de suivi par un médecin généraliste',
'Sp/S': 'Prescription par un médecin-spécialiste',
'Sp1/S': 'Première prescription par un médecin-spécialiste, prescription de suivi par un médecin généraliste',
'IMP/Sp': 'Prescription par un médecin-spécialiste',
'IMP/Sp1': 'Première prescription par un médecin-spécialiste, prescription de suivi par un médecin généraliste',
},
},
en: {
specifications: {
Sp: 'Prescription by specialist',
Sp1: 'First prescription by specialist, follow-up prescription by general certificate',
'Sp/S': 'Prescription by specialist',
'Sp1/S': 'First prescription by specialist, follow-up prescription by general certificate',
'IMP/Sp': 'Prescription by specialist',
'IMP/Sp1': 'First prescription by specialist, follow-up prescription by general certificate',
},
},
nl: {
specifications: {
Sp: 'Voorschrift door een geneesheer-specialist',
Sp1: 'Eerste voorschrift door een geneesheer-specialist, vervolgoorschrift door huisarts',
'Sp/S': 'Voorschrift door een geneesheer-specialist',
'Sp1/S': 'Eerste voorschrift door een geneesheer-specialist, vervolgoorschrift door huisarts',
'IMP/Sp': 'Voorschrift door een geneesheer-specialist',
'IMP/Sp1': 'Eerste voorschrift door een geneesheer-specialist, vervolgoorschrift door huisarts',
},
},
de: {
specifications: {
Sp: 'Verschreibung von einem Facharzt',
Sp1: 'Erste Verschreibung von einem Facharzt, Folgeverordnung vom Hausarzt',
'Sp/S': 'Verschreibung von einem Facharzt',
'Sp1/S': 'Erste Verschreibung von einem Facharzt, Folgeverordnung vom Hausarzt',
'IMP/Sp': 'Verschreibung von einem Facharzt',
'IMP/Sp1': 'Erste Verschreibung von einem Facharzt, Folgeverordnung vom Hausarzt',
},
},
};
const appTranslations = {
fr: {
home: homeTranslations.fr,
prescription: prescriptionTranslations.fr,
medication: medicationTranslations.fr,
practitioner: practitionerTranslations.fr,
prescriptionVisibilityHelper: prescriptionVisibilityTranslations.fr,
reimbursementHelper: reimbursementTranslations.fr,
prescriptionDurationHelper: prescriptionDurationTranslations.fr,
deliveryModusHelper: deliveryModusTranslations.fr,
},
en: {
home: homeTranslations.en,
prescription: prescriptionTranslations.en,
medication: medicationTranslations.en,
practitioner: practitionerTranslations.en,
prescriptionVisibilityHelper: prescriptionVisibilityTranslations.en,
reimbursementHelper: reimbursementTranslations.en,
prescriptionDurationHelper: prescriptionDurationTranslations.en,
deliveryModusHelper: deliveryModusTranslations.en,
},
nl: {
home: homeTranslations.nl,
prescription: prescriptionTranslations.nl,
medication: medicationTranslations.nl,
practitioner: practitionerTranslations.nl,
prescriptionVisibilityHelper: prescriptionVisibilityTranslations.nl,
reimbursementHelper: reimbursementTranslations.nl,
prescriptionDurationHelper: prescriptionDurationTranslations.nl,
deliveryModusHelper: deliveryModusTranslations.nl,
},
de: {
home: homeTranslations.de,
prescription: prescriptionTranslations.de,
medication: medicationTranslations.de,
practitioner: practitionerTranslations.de,
prescriptionVisibilityHelper: prescriptionVisibilityTranslations.de,
reimbursementHelper: reimbursementTranslations.de,
prescriptionDurationHelper: prescriptionDurationTranslations.de,
deliveryModusHelper: deliveryModusTranslations.de,
},
};
// translation.service.ts
class TranslationService {
currentLang = 'fr';
setLanguage(lang) {
this.currentLang = lang;
}
getCurrentLanguage() {
return this.currentLang;
}
translate(path) {
const keys = path.split('.');
let value = appTranslations[this.currentLang];
for (const key of keys) {
value = value?.[key];
if (value === undefined)
return `[${path}]`;
}
return value;
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: TranslationService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: TranslationService, providedIn: 'root' });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: TranslationService, decorators: [{
type: Injectable,
args: [{ providedIn: 'root' }]
}] });
class MedicationCardComponent {
translationService;
cdr;
medication;
index;
focused = false;
addPrescription = new EventEmitter();
constructor(translationService, cdr) {
this.translationService = translationService;
this.cdr = cdr;
}
language = 'fr';
isExpanded = false;
t = (key) => this.translationService.translate(key);
commercialization;
supplyProblem;
reimbursement;
commercializationExtraInfo;
commercializationEnd;
commercializationReason;
commercializationImpact;
supplyProblemExtraInfo;
supplyProblemReason;
supplyProblemImpact;
reimbursementCriterion;
vmpName;
vmpGroupName;
handleMedicationClick() {
this.addPrescription.emit(this.medication); // emit the card's medication
}
ngOnInit() {
this.language = this.translationService.getCurrentLanguage();
this.commercialization = this.medication.commercializations?.[0];
this.supplyProblem = this.medication.supplyProblems?.[0];
this.reimbursement = this.medication.reimbursements;
this.commercializationExtraInfo = this.getTranslatedText(this.commercialization?.additionalInformation)?.split('\n');
this.commercializationEnd = this.getTranslatedText(this.commercialization?.endOfComercialization);
this.commercializationReason = this.getTranslatedText(this.commercialization?.reason);
this.commercializationImpact = this.getTranslatedText(this.commercialization?.impact);
this.supplyProblemExtraInfo = this.getTranslatedText(this.supplyProblem?.additionalInformation)?.split('\n');
this.supplyProblemReason = this.getTranslatedText(this.supplyProblem?.reason);
this.supplyProblemImpact = this.getTranslatedText(this.supplyProblem?.impact);
this.reimbursementCriterion = this.getTranslatedText(this.reimbursement?.reimbursementCriterion?.description);
this.vmpName = this.getTranslatedText(this.medication?.vmp?.name);
this.vmpGroupName = this.getTranslatedText(this.medication?.vmp?.vmpGroup?.name);
}
toggleMedicationDetails() {
this.isExpanded = !this.isExpanded;
this.cdr.markForCheck();
}
get showLinks() {
const m = this.medication;
return !!(m.crmLink ||
m.patientInformationLeafletLink ||
m.rmaProfessionalLink ||
m.spcLink ||
m.dhpcLink);
}
getSpecialRegulation(code) {
switch (code) {
case 1:
return this.t('medication.drugSpecialRegulation.noNarcoticRegulation');
case 2:
return this.t('medication.drugSpecialRegulation.narcoticRegulation');
default:
return this.t('medication.drugSpecialRegulation.noSpecialRegulation');
}
}
formatTimestamp(timestamp) {
return formatToDayMonthYear(timestamp);
}
getCategoryLabelForReimbursement(code) {
return getCategoryLabelForReimbursement(code, this.t);
}
computeFeeAmount(fee) {
return Math.round(+fee * 100) / 100 + '€';
}
getTranslatedText(text, lang = this.language, fallback = 'fr') {
return text?.[lang] ?? text?.[fallback];
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: MedicationCardComponent, deps: [{ token: TranslationService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: MedicationCardComponent, isStandalone: true, selector: "cardinal-medication-card", inputs: { medication: "medication", index: "index", focused: "focused" }, outputs: { addPrescription: "addPrescription" }, ngImport: i0, template: "<div\n [class.focused]=\"focused\"\n [class.isExpanded]=\"isExpanded\"\n [id]=\"index\"\n class=\"medicationRow\">\n <div class=\"header\">\n <div\n class=\"header__medication\"\n (click)=\"handleMedicationClick()\"\n tabindex=\"0\">\n <div class=\"header__medication__content\">\n <div class=\"header__medication__content__heading\">\n <div class=\"header__medication__content__heading__title\">\n <!-- Choose the appropriate icon based on the drug type: medications,molecules, non-medicinal products -->\n <ng-container *ngIf=\"!!medication.ampId; else checkVmpGroup\">\n <cardinal-tooltip\n [iconSnippet]=\"medicationIcn\"\n content=\"{{ t('medication.drugType.medication') }}\" />\n </ng-container>\n\n <ng-template #checkVmpGroup>\n <ng-container *ngIf=\"!!medication.vmpGroupId; else checkNmp\">\n <cardinal-tooltip\n [iconSnippet]=\"moleculeIcn\"\n content=\"{{ t('medication.drugType.molecule') }}\" />\n </ng-container>\n </ng-template>\n\n <ng-template #checkNmp>\n <ng-container *ngIf=\"!!medication.nmpId\">\n <cardinal-tooltip\n [iconSnippet]=\"naturalIcn\"\n content=\"{{ t('medication.drugType.homologation') }}\" />\n </ng-container>\n </ng-template>\n\n <!-- Templates for icons -->\n <ng-template #medicationIcn>\n <cardinal-solid-pill-icn [color]=\"'#3D87C5'\" />\n </ng-template>\n\n <ng-template #moleculeIcn>\n <cardinal-molecule-icn [color]=\"'#EFAC2F'\" />\n </ng-template>\n\n <ng-template #naturalIcn>\n <cardinal-leaf-icn [color]=\"'#197437'\" />\n </ng-template>\n\n <h3>{{ medication.title }}</h3>\n <div class=\"header__medication__content__heading__infographics\">\n <div class=\"medicationInfographics\">\n <div\n class=\"medicationInfographics__item\"\n *ngIf=\"!!medication.blackTriangle\">\n <ng-template #blackTriangleIcn>\n <cardinal-triangle-icn [color]=\"'#000000'\" />\n </ng-template>\n <cardinal-tooltip\n [iconSnippet]=\"blackTriangleIcn\"\n content=\"{{\n t('medication.drugInfographic.blackTriangle')\n }}\" />\n </div>\n <div\n class=\"medicationInfographics__item\"\n *ngIf=\"!!medication.rmaProfessionalLink\">\n <ng-template #rmaContent>\n <p *ngIf=\"medication?.rmakeyMessages\">\n {{ medication.rmakeyMessages }}\n </p>\n <a\n class=\"snippetLink\"\n [href]=\"medication.rmaProfessionalLink\"\n target=\"_blank\">\n {{ t('medication.drugInfographic.rma') }}\n </a>\n </ng-template>\n <ng-template #orangeTriangleIcn>\n <cardinal-triangle-icn [color]=\"'#FF5E00'\" />\n </ng-template>\n <cardinal-tooltip\n [iconSnippet]=\"orangeTriangleIcn\"\n [contentSnippet]=\"rmaContent\" />\n </div>\n <div\n class=\"medicationInfographics__item\"\n *ngIf=\"!!medication.speciallyRegulated\">\n <ng-template #specialRegulationsIcn>\n <cardinal-pills-bottle-icn [color]=\"'#000000'\" />\n </ng-template>\n <cardinal-tooltip\n [content]=\"\n getSpecialRegulation(medication.speciallyRegulated)\n \"\n [iconSnippet]=\"specialRegulationsIcn\" />\n </div>\n <div\n class=\"medicationInfographics__item\"\n *ngIf=\"!!medication.genericPrescriptionRequired\">\n <ng-template #prescriptionIcn>\n <cardinal-prescription-icn [color]=\"'#000000'\" />\n </ng-template>\n <cardinal-tooltip\n content=\"{{\n t(\n 'medication.drugInfographic.genericPrescriptionRequired'\n )\n }}\"\n [iconSnippet]=\"prescriptionIcn\" />\n </div>\n </div>\n <div class=\"medicationAvailabilityInfographics\">\n <ng-template #supplyProblemsContent>\n <div class=\"supplyProblemsTooltip\" *ngIf=\"!!supplyProblem\">\n <p\n class=\"supplyProblemsTooltip__title supplyProblemsTooltip__title--orange\">\n {{ t('medication.supply.issueTitle') }}\n </p>\n\n <div class=\"supplyProblemsTooltip__content\">\n <div *ngIf=\"supplyProblem.from\">\n <span>\n {{ t('medication.supply.startDate') }}\n </span>\n <p>\n {{ formatTimestamp(supplyProblem.from) }}\n </p>\n </div>\n <div *ngIf=\"supplyProblem.expectedEndOn\">\n <span>\n {{ t('medication.supply.expectedEndDate') }}\n </span>\n <p>\n {{ formatTimestamp(supplyProblem.expectedEndOn) }}\n </p>\n </div>\n <div *ngIf=\"supplyProblemReason\">\n <span>{{ t('medication.supply.reason') }}</span>\n <p>\n {{ supplyProblemReason }}\n </p>\n </div>\n <div *ngIf=\"supplyProblemImpact\">\n <span>{{ t('medication.supply.impact') }}</span>\n <p>{{ supplyProblemImpact }}</p>\n </div>\n\n <div\n *ngIf=\"\n supplyProblem.impact?.fr ===\n 'Importation possible par le pharmacien'\n \">\n <span>{{ t('medication.supply.prescriberNote') }}</span>\n <a\n target=\"_blank\"\n href=\"https://www.afmps.be/sites/default/files/content/INSP/NARC/declaration-medecin.pdf\"\n >{{ t('medication.supply.downloadPdf') }}</a\n >\n </div>\n\n <div *ngIf=\"supplyProblemExtraInfo?.length !== 0\">\n <span>{{ t('medication.supply.extraInfo') }}</span>\n <p *ngFor=\"let problem of supplyProblemExtraInfo\">\n {{ problem }}\n </p>\n </div>\n </div>\n </div>\n </ng-template>\n <div\n class=\"medicationAvailabilityInfographics__item medicationAvailabilityInfographics__item--orange\"\n *ngIf=\"!!medication.supplyProblems\">\n <ng-template #supplyIcn>\n <cardinal-supply-icn [color]=\"'#FF5E00'\" />\n </ng-template>\n <cardinal-tooltip\n [iconSnippet]=\"supplyIcn\"\n [contentSnippet]=\"supplyProblemsContent\" />\n </div>\n <ng-template #endOfCommercialisationContent>\n <div\n class=\"supplyProblemsTooltip\"\n *ngIf=\"!!commercialization\">\n <p\n class=\"supplyProblemsTooltip__title supplyProblemsTooltip__title--red\">\n {{ t('medication.commercialization.end') }}\n </p>\n <div class=\"supplyProblemsTooltip__content\">\n <div *ngIf=\"commercialization.from\">\n <span>\n {{\n t(\n 'medication.commercialization.limitedAvailabilityFrom'\n )\n }}</span\n >\n <p>\n {{ formatTimestamp(commercialization.from) }}\n </p>\n </div>\n <div *ngIf=\"commercialization.to\">\n <span>{{\n t('medication.commercialization.unavailableFrom')\n }}</span>\n <p>\n {{ formatTimestamp(commercialization.to) }}\n </p>\n </div>\n\n <div *ngIf=\"commercializationEnd\">\n <span>{{ t('medication.commercialization.end') }}</span>\n <p>\n {{ commercializationEnd }}\n </p>\n </div>\n\n <div *ngIf=\"commercializationReason\">\n <span>{{\n t('medication.commercialization.endReason')\n }}</span>\n <p>{{ commercializationReason }}</p>\n </div>\n\n <div *ngIf=\"commercializationImpact\">\n <span>{{\n t('medication.commercialization.endImpact')\n }}</span>\n <p>{{ commercializationImpact }}</p>\n </div>\n\n <div *ngIf=\"commercializationExtraInfo?.length !== 0\">\n <span>{{\n t(\n 'medication.commercialization.endAdditionalInformation'\n )\n }}</span>\n\n <p *ngFor=\"let line of commercializationExtraInfo\">\n {{ line }}\n </p>\n </div>\n </div>\n </div>\n </ng-template>\n <div\n class=\"medicationAvailabilityInfographics__item medicationAvailabilityInfographics__item--red\"\n *ngIf=\"commercialization?.endOfComercialization\">\n <ng-template #endOfCommercialisationIcn>\n <cardinal-end-of-commercialisation-icn\n [color]=\"'#EE1313'\" />\n </ng-template>\n <cardinal-tooltip\n [iconSnippet]=\"endOfCommercialisationIcn\"\n [contentSnippet]=\"endOfCommercialisationContent\" />\n </div>\n <ng-template #startOfCommercialisationContent>\n <div\n class=\"supplyProblemsTooltip\"\n *ngIf=\"!!commercialization\">\n <p\n class=\"supplyProblemsTooltip__title supplyProblemsTooltip__title--green\">\n {{ t('medication.commercialization.start') }}\n </p>\n <div class=\"supplyProblemsTooltip__content\">\n <div *ngIf=\"commercialization.from\">\n <span>{{\n t('medication.commercialization.startAvailableFrom')\n }}</span>\n <p>\n {{ formatTimestamp(commercialization.from) }}\n </p>\n </div>\n </div>\n </div>\n </ng-template>\n <div\n class=\"medicationAvailabilityInfographics__item medicationAvailabilityInfographics__item--green\"\n *ngIf=\"\n commercialization &&\n !commercialization?.endOfComercialization\n \">\n <ng-template #startOfCommercialisationIcn>\n <cardinal-start-of-commercialisation-icn\n [color]=\"'#09853D'\" />\n </ng-template>\n <cardinal-tooltip\n [iconSnippet]=\"startOfCommercialisationIcn\"\n [contentSnippet]=\"startOfCommercialisationContent\" />\n </div>\n </div>\n <div class=\"deliveryPrescriptionConditions\">\n <ng-template #reimbursementsIcn>\n <div class=\"textToIcon textToIcon--green\">\n <p>\n {{ reimbursement?.reimbursementCriterion?.category }}\n </p>\n </div>\n </ng-template>\n <ng-template #reimbursementsContent>\n <div *ngIf=\"reimbursement; else noReimbursement\">\n <div class=\"supplyProblemsTooltip\">\n <p\n class=\"supplyProblemsTooltip__title supplyProblemsTooltip__title--green\">\n {{ t('medication.reimbursement.title') }}\n </p>\n <div class=\"supplyProblemsTooltip__content\">\n <div\n *ngIf=\"\n reimbursement.reimbursementCriterion?.category\n \">\n <span>\n {{ t('medication.reimbursement.category') }}\n </span>\n <p>\n {{ reimbursement.reimbursementCriterion?.category }}\n </p>\n </div>\n <div\n *ngIf=\"\n reimbursement.reimbursementCriterion?.category\n \">\n <span>\n {{ t('medication.reimbursement.categoryLabel') }}\n </span>\n <p>\n {{\n getCategoryLabelForReimbursement(\n reimbursement.reimbursementCriterion?.category\n )\n }}\n </p>\n </div>\n\n <div *ngIf=\"reimbursement.copayments\">\n <div *ngFor=\"let el of reimbursement.copayments\">\n <div *ngIf=\"el.regimeType === 1\">\n <span>\n {{ t('medication.reimbursement.copay') }}\n <strong>\n {{\n t(\n 'medication.reimbursement.copayPreferential'\n )\n }}\n </strong>\n </span>\n </div>\n <div *ngIf=\"el.regimeType === 2\">\n <span>\n {{ t('medication.reimbursement.copay') }}\n <strong>\n {{\n t('medication.reimbursement.copayActive')\n }}\n </strong>\n </span>\n </div>\n <div *ngIf=\"el.feeAmount\">\n <p class=\"feeAmount\">\n {{ computeFeeAmount(el.feeAmount) }}\n </p>\n </div>\n </div>\n </div>\n\n <div *ngIf=\"reimbursement.temporary\">\n <span>\n {{ t('medication.reimbursement.temporary') }}\n </span>\n <p class=\"textRed\">\n {{ reimbursement.temporary }}\n </p>\n </div>\n\n <div *ngIf=\"reimbursementCriterion\">\n <span>\n {{ t('medication.reimbursement.chapter') }}\n </span>\n <p>\n {{ reimbursementCriterion }}\n </p>\n </div>\n </div>\n </div>\n </div>\n\n <ng-template #noReimbursement>\n <div class=\"supplyProblemsTooltip\">\n <p\n class=\"supplyProblemsTooltip__title supplyProblemsTooltip__title--green\">\n {{ t('medication.reimbursement.noneTitle') }}\n </p>\n <div class=\"supplyProblemsTooltip__content\">\n <div>\n <p>\n {{ t('medication.reimbursement.notApplicable') }}\n </p>\n </div>\n </div>\n </div>\n </ng-template>\n </ng-template>\n <cardinal-tooltip\n *ngIf=\"reimbursement\"\n [iconSnippet]=\"reimbursementsIcn\"\n [contentSnippet]=\"reimbursementsContent\" />\n\n <ng-template #deliveryConditionsIcn>\n <div class=\"textToIcon textToIcon--orange\">\n <p>{{ medication.deliveryModusCode }}</p>\n </div>\n </ng-template>\n <ng-template #deliveryConditionsContent>\n <div\n *ngIf=\"medication.deliveryModusCode; else noDeliveryModus\">\n <div class=\"supplyProblemsTooltip\">\n <p\n class=\"supplyProblemsTooltip__title supplyProblemsTooltip__title--orange\">\n {{ t('medication.delivery.title') }}\n </p>\n <div class=\"supplyProblemsTooltip__content\">\n <div *ngIf=\"medication.deliveryModusCode\">\n <span>\n {{ t('medication.delivery.code') }}\n </span>\n <p>{{ medication.deliveryModusCode }}</p>\n </div>\n\n <div *ngIf=\"medication.deliveryModus\">\n <span>{{ t('medication.delivery.modus') }}</span>\n <p>{{ medication.deliveryModus }}</p>\n </div>\n\n <div *ngIf=\"medication.deliveryModusSpecification\">\n <span>{{\n t('medication.delivery.specification')\n }}</span>\n <p>{{ medication.deliveryModusSpecification }}</p>\n </div>\n </div>\n </div>\n </div>\n\n <ng-template #noDeliveryModus>\n <div class=\"supplyProblemsTooltip\">\n <p\n class=\"supplyProblemsTooltip__title supplyProblemsTooltip__title--green\">\n {{ t('medication.delivery.title') }}\n </p>\n <div class=\"supplyProblemsTooltip__content\">\n <div>\n <p>{{ t('medication.prescription.free') }}</p>\n </div>\n </div>\n </div>\n </ng-template>\n </ng-template>\n <cardinal-tooltip\n *ngIf=\"!!medication.deliveryModusCode\"\n [iconSnippet]=\"deliveryConditionsIcn\"\n [contentSnippet]=\"deliveryConditionsContent\" />\n\n <ng-template #prescriptionConditionsIcn>\n <div\n *ngIf=\"\n medication.deliveryModusSpecificationCode &&\n medication.deliveryModusSpecification\n \">\n <div class=\"textToIcon textToIcon--red\">\n <p>{{ medication.deliveryModusSpecificationCode }}</p>\n </div>\n </div>\n </ng-template>\n <ng-template #prescriptionConditionsContent>\n <div\n *ngIf=\"\n medication.deliveryModusSpecificationCode;\n else noDeliveryModus\n \">\n <div class=\"supplyProblemsTooltip\">\n <p\n class=\"supplyProblemsTooltip__title supplyProblemsTooltip__title--red\">\n {{ t('medication.prescription.title') }}\n </p>\n <div class=\"supplyProblemsTooltip__content\">\n <div *ngIf=\"medication.deliveryModusSpecificationCode\">\n <span>\n {{ t('medication.delivery.code') }}\n </span>\n <p>{{ medication.deliveryModusSpecificationCode }}</p>\n </div>\n\n <div *ngIf=\"medication.deliveryModusSpecification\">\n <span>\n {{ t('medication.delivery.specification') }}\n </span>\n <p>\n {{ medication.deliveryModusSpecification }}\n </p>\n </div>\n </div>\n </div>\n </div>\n\n <ng-template #noDeliveryModus>\n <div class=\"supplyProblemsTooltip\">\n <p\n class=\"supplyProblemsTooltip__title supplyProblemsTooltip__title--green\">\n {{ t('medication.prescription.title') }}\n </p>\n <div class=\"supplyProblemsTooltip__content\">\n <div>\n <p>{{ t('medication.delivery.notApplicable') }}</p>\n </div>\n </div>\n </div>\n </ng-template>\n </ng-template>\n <cardinal-tooltip\n *ngIf=\"!!medication.deliveryModusSpecificationCode\"\n [iconSnippet]=\"prescriptionConditionsIcn\"\n [contentSnippet]=\"prescriptionConditionsContent\" />\n </div>\n </div>\n </div>\n\n <p class=\"header__medication__content__heading__activeIngredient\">\n {{ medication.activeIngredient }}\n </p>\n </div>\n\n <div class=\"header__medication__content__description\">\n <div\n class=\"header__medication__content__description__item price\"\n *ngIf=\"medication.price\">\n <span>\n {{ t('medication.ui.price') }}\n </span>\n <p>{{ medication.price }}</p>\n </div>\n\n <div\n *ngIf=\"medication.price\"\n class=\"header__medication__content__description__item price\">\n <span>\n {{ t('medication.reimbursement.title') }}\n </span>\n <div *ngIf=\"reimbursement; else noReimbursement\">\n <div class=\"textToIcon textToIcon--green\">\n <p>\n {{ reimbursement.reimbursementCriterion?.category }}\n </p>\n </div>\n </div>\n <ng-template #noReimbursement>\n <div class=\"textToIcon textToIcon--gray\">\n <p>\n {{ t('medication.reimbursement.non') }}\n </p>\n </div>\n </ng-template>\n </div>\n\n <div class=\"header__medication__content__description__item\">\n <span>{{ t('medication.delivery.title') }}</span>\n <div *ngIf=\"medication.deliveryModusCode; else freeOfPrescription\">\n <div class=\"textToIcon textToIcon--orange\">\n <p>{{ medication.deliveryModusCode }}</p>\n </div>\n </div>\n <ng-template #freeOfPrescription>\n <div class=\"textToIcon textToIcon--green\">\n <p>{{ t('medication.prescription.free') }}</p>\n </div>\n </ng-template>\n </div>\n\n <div class=\"header__medication__content__description__item\">\n <span>\n {{ t('medication.prescription.title') }}\n </span>\n <div\n *ngIf=\"\n medication.deliveryModusSpecificationCode &&\n medication.deliveryModusSpecification;\n else notApplicable\n \">\n <div class=\"textToIcon textToIcon--red\">\n <p>{{ medication.deliveryModusSpecificationCode }}</p>\n </div>\n </div>\n <ng-template #notApplicable>\n <div class=\"textToIcon textToIcon--green\">\n <p>\n {{ t('medication.delivery.notApplicable') }}\n </p>\n </div>\n </ng-template>\n </div>\n </div>\n </div>\n </div>\n <button\n class=\"header__arrow\"\n [class.isExpanded]=\"isExpanded\"\n (click)=\"toggleMedicationDetails()\">\n <cardinal-chevron-icn color=\"#3D87C5\" />\n </button>\n </div>\n\n <div *ngIf=\"isExpanded\" class=\"content\">\n <div *ngIf=\"medication.vmp\" class=\"content__vmp\">\n <div *ngIf=\"vmpName\" class=\"content__vmp__item\">\n <span>\n {{ t('medication.vmp.label') }}\n </span>\n <p>{{ vmpName }}</p>\n </div>\n <div *ngIf=\"vmpGroupName\" class=\"content__vmp__item\">\n <span>\n {{ t('medication.vmp.groupLabel') }}\n </span>\n <p>{{ vmpGroupName }}</p>\n </div>\n </div>\n\n <div class=\"content__divider\" *ngIf=\"showLinks\"></div>\n\n <div class=\"content__links\" *ngIf=\"showLinks\">\n <a *ngIf=\"medication.crmLink\" [href]=\"medication.crmLink\" target=\"_blank\">\n {{ t('medication.links.cbip') }}\n </a>\n <a\n *ngIf=\"medication.patientInformationLeafletLink\"\n [href]=\"medication.patientInformationLeafletLink\"\n target=\"_blank\">\n {{ t('medication.links.leaflet') }}\n </a>\n <a\n *ngIf=\"medication.rmaProfessionalLink\"\n [href]=\"medication.rmaProfessionalLink\"\n target=\"_blank\">\n {{ t('medication.links.rma') }}\n </a>\n <a *ngIf=\"medication.spcLink\" [href]=\"medication.spcLink\" target=\"_blank\">\n {{ t('medication.links.spc') }}\n </a>\n <a\n *ngIf=\"medication.dhpcLink\"\n [href]=\"medication.dhpcLink\"\n target=\"_blank\">\n {{ t('medication.links.dhpc') }}\n </a>\n </div>\n\n <div class=\"content__divider\" *ngIf=\"reimbursement\"></div>\n <div *ngIf=\"reimbursement\">\n <ng-container *ngTemplateOutlet=\"reimbursementsContent\"></ng-container>\n </div>\n\n <div class=\"content__divider\"></div>\n <ng-container\n *ngTemplateOutlet=\"prescriptionConditionsContent\"></ng-container>\n\n <div class=\"content__divider\"></div>\n <ng-container *ngTemplateOutlet=\"deliveryConditionsContent\"></ng-container>\n\n <div *ngIf=\"medication.supplyProblems\" class=\"content__divider\"></div>\n <div *ngIf=\"medication.supplyProblems\">\n <ng-container *ngTemplateOutlet=\"supplyProblemsContent\"></ng-container>\n </div>\n\n <div\n *ngIf=\"commercialization?.endOfComercialization\"\n class=\"content__divider\"></div>\n <div *ngIf=\"commercialization?.endOfComercialization\">\n <ng-container\n *ngTemplateOutlet=\"endOfCommercialisationContent\"></ng-container>\n </div>\n\n <div\n *ngIf=\"commercialization && !commercialization.endOfComercialization\"\n class=\"content__divider\"></div>\n <div *ngIf=\"commercialization && !commercialization.endOfComercialization\">\n <ng-container\n *ngTemplateOutlet=\"startOfCommercialisationContent\"></ng-container>\n </div>\n </div>\n</div>\n", styles: ["*{margin:0;padding:0;font-size:100%;box-sizing:border-box;font-family:Inter Variable,sans-serif}a{text-decoration:none}a:active,a:hover{outline:0}ul,li{list-style-type:none;margin:0;padding:0}h1,h2,h3,h4,h5,h6{font-size:100%}html,body{box-sizing:border-box;font-size:16px;background-color:#fbfdff}*,*:before,*:after{box-sizing:border-box}:focus{outline:0}img,audio,video{max-width:100%;height:auto}iframe{border:0}textarea{resize:none;overflow:auto;vertical-align:top;box-shadow:none;-webkit-box-shadow:none;-moz-box-shadow:none}input,textarea,select,button{outline:none;border:none;font-size:100%;margin:0}button,input{line-height:normal}input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,textarea:-webkit-autofill,textarea:-webkit-autofill:hover,textarea:-webkit-autofill:focus,select:-webkit-autofill,select:-webkit-autofill:hover,select:-webkit-autofill:focus{-webkit-text-fill-color:rgb(0,0,0);transition:background-color 5000s ease-in-out 0s}table{border-collapse:collapse;border-spacing:0}td,th{padding:0;text-align:left}.medicationRow{width:100%;display:flex;flex-direction:column;border-radius:6px;background:#fff;border:1px solid #dce7f2;cursor:pointer}.medicationRow.disableHover:hover{border-color:#dce7f2;box-shadow:none;cursor:not-allowed}.medicationRow:hover,.medicationRow.isExpanded,.medicationRow.focused,.medicationRow.disableHover.focused:hover{border-color:#3d87c5;box-shadow:0 0 0 2px #3d87c54d}.medicationRow.isExpanded .header{border-radius:6px 6px 0 0}.medicationRow .header{width:100%;display:flex;padding:8px 12px;justify-content:space-between;gap:12px;align-items:center;align-self:stretch;background:#fff;border-radius:6px}@media only screen and (max-width: 576px){.medicationRow .header{gap:4px}}.medicationRow .header__medication{width:100%;display:flex;align-items:center;gap:12px}@media only screen and (max-width: 576px){.medicationRow .header__medication{gap:8px}}.medicationRow .header__medication__content{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:12px}.medicationRow .header__medication__content__heading{display:flex;flex-direction:column;gap:4px}.medicationRow .header__medication__content__heading__title{display:flex;align-items:center;gap:8px}.medicationRow .header__medication__content__heading__title h3{color:#1d2235;font-size:16px;font-style:normal;font-weight:500}.medicationRow .header__medication__content__heading__infographics{display:flex;align-items:center;gap:12px}.medicationRow .header__medication__content__heading__infographics .deliveryPrescriptionConditions,.medicationRow .header__medication__content__heading__infographics .medicationInfographics,.medicationRow .header__medication__content__heading__infographics .medicationAvailabilityInfographics{display:flex;align-items:center;gap:2px}.medicationRow .header__medication__content__heading__infographics .medicationInfographics__item{display:flex;width:22px;height:22px;justify-content:center;align-items:center;border-radius:5px;border:1px solid #add5ff}.medicationRow .header__medication__content__heading__infographics .medicationAvailabilityInfographics__item{display:flex;width:22px;height:22px;justify-content:center;align-items:center;border-radius:5px}.medicationRow .header__medication__content__heading__infographics .medicationAvailabilityInfographics__item--red{background-color:#ffcdcd}.medicationRow .header__medication__content__heading__infographics .medicationAvailabilityInfographics__item--orange{background-color:#ffda83}.medicationRow .header__medication__content__heading__infographics .medicationAvailabilityInfographics__item--green{background-color:#c7f4ab}.medicationRow .header__medication__content__heading__activeIngredient{color:#1d2235;font-size:14px;font-style:normal;font-weight:300;line-height:normal}.medicationRow .header__medication__content__description{width:100%;display:flex;gap:32px;row-gap:8px;flex-wrap:wrap}.medicationRow .header__medication__content__description__item{display:flex;align-items:center;gap:6px}.medicationRow .header__medication__content__description__item span{font-size:12px;font-weight:400;color:#4b6682}.medicationRow .header__medication__content__description__item p{font-size:14px;font-weight:400;color:#000}.medicationRow .header__medication__content__description__item.price p{color:#ef762f;font-size:14px;font-style:normal;font-weight:600;line-height:normal}.medicationRow .header__medication__content__description__item.delivery,.medicationRow .header__medication__content__description__item.prescription{width:100%;flex-wrap:wrap;align-items:center;gap:4px}.medicationRow .header__arrow{width:18px;background:none;cursor:pointer}.medicationRow .header__arrow.isExpanded{transform:rotate(90deg)}.medicationRow .content{width:100%;display:flex;flex-direction:column;padding:18px 12px;gap:18px;background-color:#f9fbfe;border-radius:0 0 6px 6px;border-top:1px dashed #3d87c5}.medicationRow .content__vmp{width:100%;display:flex;flex-direction:column;gap:12px}.medicationRow .content__vmp__item{width:100%;display:flex;flex-direction:column;gap:4px}.medicationRow .content__vmp__item span{font-size:12px;font-weight:400;color:#4b6682}.medicationRow .content__vmp__item p{font-size:14px;font-weight:400;color:#000}.medicationRow .content__divider{width:100%;display:flex;border-bottom:1px dashed rgba(61,135,197,.25)}.medicationRow .content__links{width:100%;display:flex;align-items:flex-start;justify-content:space-between;flex-wrap:wrap;row-gap:8px}.medicationRow .content__links a{width:49%;color:#3d87c5;font-size:14px;font-style:normal;font-weight:400;line-height:normal}.medicationRow .content__links a:hover{text-decoration:underline}.supplyProblemsTooltip{width:100%;display:flex;flex-direction:column;gap:8px}.supplyProblemsTooltip__title{width:100%;font-size:14px;font-weight:500}.supplyProblemsTooltip__title--orange{background-color:#ffda83}.supplyProblemsTooltip__title--red{background-color:#ffcdcd}.supplyProblemsTooltip__title--green{background-color:#c7f4ab}.supplyProblemsTooltip__content{width:100%;display:flex;flex-direction:column;gap:8px}.supplyProblemsTooltip__content div{width:100%;display:flex;flex-direction:column;gap:4px}.supplyProblemsTooltip__content div span{font-size:12px;font-weight:400;color:#4b6682}.supplyProblemsTooltip__content div p{font-size:14px;font-weight:400;color:#000}.supplyProblemsTooltip__content div a{font-size:14px;font-weight:400;color:#4b6682}.supplyProblemsTooltip__content div a:hover{text-decoration:underline}.textToIcon{height:22px;width:auto;display:flex;align-items:center;justify-content:center;padding:0 6px;border-radius:5px}.textToIcon--orange{background-color:#e5a613}.textToIcon--red{background-color:#ee5d59}.textToIcon--green{background-color:#33b96b}.textToIcon--gray{background-color:#7e827f}.textToIcon p{font-size:11px!important;font-weight:600;color:#fff!important}.tooltipBtn{display:flex;align-items:center;justify-content:center}.snippetLink{color:#3d87c5;font-size:14px!important;font-style:normal;font-weight:400;line-height:normal}.snippetLink:hover{text-decoration:underline}\n"], dependencies: [{ kind: "component", type: TooltipComponent, selector: "cardinal-tooltip", inputs: ["content", "contentSnippet", "iconSnippet", "orientation"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: ChevronIcnComponent, selector: "cardinal-chevron-icn", inputs: ["color"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: SolidPillIcnComponent, selector: "cardinal-solid-pill-icn", inputs: ["color"] }, { kind: "component", type: MoleculeIcnComponent, selector: "cardinal-molecule-icn", inputs: ["color"] }, { kind: "component", type: LeafIcnComponent, selector: "cardinal-leaf-icn", inputs: ["color"] }, { kind: "component", type: TriangleIcnComponent, selector: "cardinal-triangle-icn", inputs: ["color"] }, { kind: "component", type: PillsBottleIcnComponent, selector: "cardinal-pills-bottle-icn", inputs: ["color"] }, { kind: "component", type: PrescriptionIcnComponent, selector: "cardinal-prescription-icn", inputs: ["color"] }, { kind: "component", type: SupplyIcnComponent, selector: "cardinal-supply-icn", inputs: ["color"] }, { kind: "component", type: EndOfCommercialisationIcnComponent, selector: "cardinal-end-of-commercialisation-icn", inputs: ["color"] }, { kind: "component", type: StartOfCommercialisationIcnComponent, selector: "cardinal-start-of-commercialisation-icn", inputs: ["color"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: MedicationCardComponent, decorators: [{
type: Component,
args: [{ selector: 'cardinal-medication-card', standalone: true, imports: [
TooltipComponent,
NgIf,
NgForOf,
ChevronIcnComponent,
NgTemplateOutlet,
SolidPillIcnComponent,
MoleculeIcnComponent,
LeafIcnComponent,
TriangleIcnComponent,
PillsBottleIcnComponent,
PrescriptionIcnComponent,
SupplyIcnComponent,
EndOfCommercialisationIcnComponent,
StartOfCommercialisationIcnComponent,
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n [class.focused]=\"focused\"\n [class.isExpanded]=\"isExpanded\"\n [id]=\"index\"\n class=\"medicationRow\">\n <div class=\"header\">\n <div\n class=\"header__medication\"\n (click)=\"handleMedicationClick()\"\n tabindex=\"0\">\n <div class=\"header__medication__content\">\n <div class=\"header__medication__content__heading\">\n <div class=\"header__medication__content__heading__title\">\n <!-- Choose the appropriate icon based on the drug type: medications,molecules, non-medicinal products -->\n <ng-container *ngIf=\"!!medication.ampId; else checkVmpGroup\">\n <cardinal-tooltip\n [iconSnippet]=\"medicationIcn\"\n content=\"{{ t('medication.drugType.medication') }}\" />\n </ng-container>\n\n <ng-template #checkVmpGroup>\n <ng-container *ngIf=\"!!medication.vmpGroupId; else checkNmp\">\n <cardinal-tooltip\n [iconSnippet]=\"moleculeIcn\"\n content=\"{{ t('medication.drugType.molecule') }}\" />\n </ng-container>\n </ng-template>\n\n <ng-template #checkNmp>\n <ng-container *ngIf=\"!!medication.nmpId\">\n <cardinal-tooltip\n [iconSnippet]=\"naturalIcn\"\n content=\"{{ t('medication.drugType.homologation') }}\" />\n </ng-container>\n </ng-template>\n\n <!-- Templates for icons -->\n <ng-template #medicationIcn>\n <cardinal-solid-pill-icn [color]=\"'#3D87C5'\" />\n </ng-template>\n\n <ng-template #moleculeIcn>\n <cardinal-molecule-icn [color]=\"'#EFAC2F'\" />\n </ng-template>\n\n <ng-template #naturalIcn>\n <cardinal-leaf-icn [color]=\"'#197437'\" />\n </ng-template>\n\n <h3>{{ medication.title }}</h3>\n <div class=\"header__medication__content__heading__infographics\">\n <div class=\"medicationInfographics\">\n <div\n class=\"medicationInfographics__item\"\n *ngIf=\"!!medication.blackTriangle\">\n <ng-template #blackTriangleIcn>\n <cardinal-triangle-icn [color]=\"'#000000'\" />\n </ng-template>\n <cardinal-tooltip\n [iconSnippet]=\"blackTriangleIcn\"\n content=\"{{\n t('medication.drugInfographic.blackTriangle')\n }}\" />\n </div>\n <div\n class=\"medicationInfographics__item\"\n *ngIf=\"!!medication.rmaProfessionalLink\">\n <ng-template #rmaContent>\n <p *ngIf=\"medication?.rmakeyMessages\">\n {{ medication.rmakeyMessages }}\n </p>\n <a\n class=\"snippetLink\"\n [href]=\"medication.rmaProfessionalLink\"\n target=\"_blank\">\n {{ t('medication.drugInfographic.rma') }}\n </a>\n </ng-template>\n <ng-template #orangeTriangleIcn>\n <cardinal-triangle-icn [color]=\"'#FF5E00'\" />\n </ng-template>\n <cardinal-tooltip\n [iconSnippet]=\"orangeTriangleIcn\"\n [contentSnippet]=\"rmaContent\" />\n </div>\n <div\n class=\"medicationInfographics__item\"\n *ngIf=\"!!medication.speciallyRegulated\">\n <ng-template #specialRegulationsIcn>\n <cardinal-pills-bottle-icn [color]=\"'#000000'\" />\n </ng-template>\n <cardinal-tooltip\n [content]=\"\n getSpecialRegulation(medication.speciallyRegulated)\n \"\n [iconSnippet]=\"specialRegulationsIcn\" />\n </div>\n <div\n class=\"medicationInfographics__item\"\n *ngIf=\"!!medication.genericPrescriptionRequired\">\n <ng-template #prescriptionIcn>\n <cardinal-prescription-icn [color]=\"'#000000'\" />\n </ng-template>\n <cardinal-tooltip\n content=\"{{\n t(\n 'medication.drugInfographic.genericPrescriptionRequired'\n )\n }}\"\n [iconSnippet]=\"prescriptionIcn\" />\n </div>\n </div>\n <div class=\"medicationAvailabilityInfographics\">\n <ng-template #supplyProblemsContent>\n <div class=\"supplyProblemsTooltip\" *ngIf=\"!!supplyProblem\">\n <p\n class=\"supplyProblemsTooltip__title supplyProblemsTooltip__title--orange\">\n {{ t('medication.supply.issueTitle') }}\n </p>\n\n <div class=\"supplyProblemsTooltip__content\">\n <div *ngIf=\"supplyProblem.from\">\n <span>\n {{ t('medication.supply.startDate') }}\n </span>\n <p>\n {{ formatTimestamp(supplyProblem.from) }}\n </p>\n </div>\n <div *ngIf=\"supplyProblem.expectedEndOn\">\n <span>\n {{ t('medication.supply.expectedEndDate') }}\n </span>\n <p>\n {{ formatTimestamp(supplyProblem.expectedEndOn) }}\n </p>\n </div>\n <div *ngIf=\"supplyProblemReason\">\n <span>{{ t('medication.supply.reason') }}</span>\n <p>\n {{ supplyProblemReason }}\n </p>\n </div>\n <div *ngIf=\"supplyProblemImpact\">\n <span>{{ t('medication.supply.impact') }}</span>\n <p>{{ supplyProblemImpact }}</p>\n </div>\n\n <div\n *ngIf=\"\n supplyProblem.impact?.fr ===\n 'Importation possible par le pharmacien'\n \">\n <span>{{ t('medication.supply.prescriberNote') }}</span>\n <a\n target=\"_blank\"\n href=\"https://www.afmps.be/sites/default/files/content/INSP/NARC/declaration-medecin.pdf\"\n >{{ t('medication.supply.downloadPdf') }}</a\n >\n </div>\n\n <div *ngIf=\"supplyProblemExtraInfo?.length !== 0\">\n <span>{{ t('medication.supply.extraInfo') }}</span>\n <p *ngFor=\"let problem of supplyProblemExtraInfo\">\n {{ problem }}\n </p>\n </div>\n </div>\n </div>\n </ng-template>\n <div\n class=\"medicationAvailabilityInfographics__item medicationAvailabilityInfographics__item--orange\"\n *ngIf=\"!!medication.supplyProblems\">\n <ng-template #supplyIcn>\n <cardinal-supply-icn [color]=\"'#FF5E00'\" />\n </ng-template>\n <cardinal-tooltip\n [iconSnippet]=\"supplyIcn\"\n [contentSnippet]=\"supplyProblemsContent\" />\n </div>\n <ng-template #endOfCommercialisationContent>\n <div\n class=\"supplyProblemsTooltip\"\n *ngIf=\"!!commercialization\">\n <p\n class=\"supplyProblemsTooltip__title supplyProblemsTooltip__title--red\">\n {{ t('medication.commercialization.end') }}\n </p>\n <div class=\"supplyProblemsTooltip__content\">\n <div *ngIf=\"commercialization.from\">\n <span>\n {{\n t(\n 'medication.commercialization.limitedAvailabilityFrom'\n )\n }}</span\n >\n <p>\n {{ formatTimestamp(commercialization.from) }}\n </p>\n </div>\n <div *ngIf=\"commercialization.to\">\n <span>{{\n t('medication.commercialization.unavailableFrom')\n }}</span>\n <p>\n {{ formatTimestamp(commercialization.to) }}\n </p>\n </div>\n\n <div *ngIf=\"commercializationEnd\">\n <span>{{ t('medication.commercialization.end') }}</span>\n <p>\n {{ commercializationEnd }}\n </p>\n </div>\n\n <div *ngIf=\"commercializationReason\">\n <span>{{\n t('medication.commercialization.endReason')\n }}</span>\n <p>{{ commercializationReason }}</p>\n </div>\n\n <div *ngIf=\"commercializationImpact\">\n <span>{{\n t('medication.commercialization.endImpact')\n }}</span>\n <p>{{ commercializationImpact }}</p>\n </div>\n\n <div *ngIf=\"commercializationExtraInfo?.length !== 0\">\n <span>{{\n t(\n 'medication.commercialization.endAdditionalInformation'\n )\n }}</span>\n\n <p *ngFor=\"let line of commercializationExtraInfo\">\n {{ line }}\n </p>\n </div>\n </div>\n </div>\n </ng-template>\n <div\n class=\"medicationAvailabilityInfographics__item medicationAvailabilityInfographics__item--red\"\n *ngIf=\"commercialization?.endOfComercialization\">\n <ng-template #endOfCommercialisationIcn>\n <cardinal-end-of-commercialisation-icn\n [color]=\"'#EE1313'\" />\n </ng-template>\n <cardinal-tooltip\n [iconSnippet]=\"endOfCommercialisationIcn\"\n [contentSnippet]=\"endOfCommercialisationContent\" />\n </div>\n <ng-template #startOfCommercialisationContent>\n <div\n class=\"supplyProblemsTooltip\"\n *ngIf=\"!!commercialization\">\n <p\n class=\"supplyProblemsTooltip__title supplyProblemsTooltip__title--green\">\n {{ t('medication.commercialization.start') }}\n </p>\n <div class=\"supplyProblemsTooltip__content\">\n <div *ngIf=\"commercialization.from\">\n <span>{{\n t('medication.commercialization.startAvailableFrom')\n }}</span>\n <p>\n {{ formatTimestamp(commercialization.from) }}\n </p>\n </div>\n </div>\n </div>\n </ng-template>\n <div\n class=\"medicationAvailabilityInfographics__item medicationAvailabilityInfographics__item--green\"\n *ngIf=\"\n commercialization &&\n !commercialization?.endOfComercialization\n \">\n <ng-template #startOfCommercialisationIcn>\n <cardinal-start-of-commercialisation-icn\n [color]=\"'#09853D'\" />\n </ng-template>\n <cardinal-tooltip\n [iconSnippet]=\"startOfCommercialisationIcn\"\n [contentSnippet]=\"startOfCommercialisationContent\" />\n </div>\n </div>\n <div class=\"deliveryPrescriptionConditions\">\n <ng-template #reimbursementsIcn>\n <div class=\"textToIcon textToIcon--green\">\n <p>\n {{ reimbursement?.reimbursementCriterion?.category }}\n </p>\n </div>\n </ng-template>\n <ng-template #reimbursementsContent>\n <div *ngIf=\"reimbursement; else noReimbursement\">\n <div class=\"supplyProblemsTooltip\">\n <p\n class=\"supplyProblemsTooltip__title supplyProblemsTooltip__title--green\">\n {{ t('medication.reimbursement.title') }}\n </p>\n <div class=\"supplyProblemsTooltip__content\">\n <div\n *ngIf=\"\n reimbursement.reimbursementCriterion?.category\n \">\n <span>\n {{ t('medication.reimbursement.category') }}\n </span>\n <p>\n {{ reimbursement.reimbursementCriterion?.category }}\n </p>\n </div>\n <div\n *ngIf=\"\n reimbursement.reimbursementCriterion?.category\n \">\n <span>\n {{ t('medication.reimbursement.categoryLabel') }}\n </span>\n <p>\n {{\n getCategoryLabelForReimbursement(\n reimbursement.reimbursementCriterion?.category\n )\n }}\n </p>\n </div>\n\n <div *ngIf=\"reimbursement.copayments\">\n <div *ngFor=\"let el of reimbursement.copayments\">\n <div *ngIf=\"el.regimeType === 1\">\n <span>\n {{ t('medication.reimbursement.copay') }}\n <strong>\n {{\n t(\n 'medication.reimbursement.copayPreferential'\n )\n }}\n </strong>\n </span>\n </div>\n <div *ngIf=\"el.regimeType === 2\">\n <span>\n {{ t('medication.reimbursement.copay') }}\n <strong>\n {{\n t('medication.reimbursement.copayActive')\n }}\n </strong>\n </span>\n </div>\n <div *ngIf=\"el.feeAmount\">\n <p class=\"feeAmount\">\n {{ computeFeeAmount(el.feeAmount) }}\n </p>\n </div>\n </div>\n </div>\n\n <div *ngIf=\"reimbursement.temporary\">\n <span>\n {{ t('medication.reimbursement.temporary') }}\n </span>\n <p class=\"textRed\">\n {{ reimbursement.temporary }}\n </p>\n </div>\n\n <div *ngIf=\"reimbursementCriterion\">\n <span>\n {{ t('medication.reimbursement.chapter') }}\n </span>\n <p>\n {{ reimbursementCriterion }}\n </p>\n </div>\n </div>\n </div>\n </div>\n\n <ng-template #noReimbursement>\n <div class=\"supplyProblemsTooltip\">\n <p\n class=\"supplyProblemsTooltip__title supplyProblemsTooltip__title--green\">\n {{ t('medication.reimbursement.noneTitle') }}\n </p>\n <div class=\"supplyProblemsTooltip__content\">\n <div>\n <p>\n {{ t('medication.reimbursement.notApplicable') }}\n </p>\n </div>\n </div>\n </div>\n </ng-template>\n </ng-template>\n <cardinal-tooltip\n *ngIf=\"reimbursement\"\n [iconSnippet]=\"reimbursementsIcn\"\n [contentSnippet]=\"reimbursementsContent\" />\n\n <ng-template #deliveryConditionsIcn>\n <div class=\"textToIcon textToIcon--orange\">\n <p>{{ medication.deliveryModusCode }}</p>\n </div>\n </ng-template>\n <ng-template #deliveryConditionsContent>\n <div\n *ngIf=\"medication.deliveryModusCode; else noDeliveryModus\">\n <div class=\"supplyProblemsTooltip\">\n <p\n class=\"supplyProblemsTooltip__title supplyProblemsTooltip__title--orange\">\n {{ t('medication.delivery.title') }}\n </p>\n <div class=\"supplyProblemsTooltip__content\">\n <div *ngIf=\"medication.deliveryModusCode\">\n <span>\n {{ t('medication.delivery.code') }}\n </span>\n <p>{{ medication.deliveryModusCode }}</p>\n </div>\n\n <div *ngIf=\"medication.deliveryModus\">\n <span>{{ t('medication.delivery.modus') }}</span>\n <p>{{ medication.deliveryModus }}</p>\n </div>\n\n <div *ngIf=\"medication.deliveryModusSpecification\">\n <span>{{\n t('medication.delivery.specification')\n }}</span>\n <p>{{ medication.deliveryModusSpecification }}</p>\n </div>\n </div>\n </div>\n </div>\n\n <ng-template #noDeliveryModus>\n <div class=\"supplyProblemsTooltip\">\n <p\n class=\"supplyProblemsTooltip__title supplyProblemsTooltip__title--green\">\n {{ t('medication.delivery.title') }}\n </p>\n <div class=\"supplyProblemsTooltip__content\">\n <div>\n <p>{{ t('medication.prescription.free') }}</p>\n </div>\n </div>\n </div>\n </ng-template>\n </ng-template>\n <cardinal-tooltip\n *ngIf=\"!!medication.deliveryModusCode\"\n [iconSnippet]=\"deliveryConditionsIcn\"\n [contentSnippet]=\"deliveryConditionsContent\" />\n\n <ng-template #prescriptionConditionsIcn>\n <div\n *ngIf=\"\n medication.deliveryModusSpecificationCode &&\n medication.deliveryModusSpecification\n \">\n <div class=\"textToIcon textToIcon--red\">\n <p>{{ medication.deliveryModusSpecificationCode }}</p>\n </div>\n </div>\n </ng-template>\n <ng-template #prescriptionConditionsContent>\n <div\n *ngIf=\"\n medication.deliveryModusSpecificationCode;\n else noDeliveryModus\n \">\n <div class=\"supplyProblemsTooltip\">\n <p\n class=\"supplyProblemsTooltip__title supplyProblemsTooltip__title--red\">\n {{ t('medication.prescription.title') }}\n </p>\n <div class=\"supplyProblemsTooltip__content\">\n <div *ngIf=\"medication.deliveryModusSpecificationCode\">\n <span>\n {{ t('medication.delivery.code') }}\n </span>\n <p>{{ medication.deliveryModusSpecificationCode }}</p>\n </div>\n\n <div *ngIf=\"medication.deliveryModusSpecification\">\n <span>\n {{ t('medication.delivery.specification') }}\n </span>\n <p>\n {{ medication.deliveryModusSpecification }}\n </p>\n </div>\n </div>\n </div>\n </div>\n\n <ng-template #noDeliveryModus>\n <div class=\"supplyProblemsTooltip\">\n <p\n class=\"supplyProblemsTooltip__title supplyProblemsTooltip__title--green\">\n {{ t('medication.prescription.title') }}\n </p>\n <div class=\"supplyProblemsTooltip__content\">\n <div>\n <p>{{ t('medication.delivery.notApplicable') }}</p>\n </div>\n </div>\n </div>\n </ng-template>\n </ng-template>\n <cardinal-tooltip\n *ngIf=\"!!medication.deliveryModusSpecificationCode\"\n [iconSnippet]=\"prescriptionConditionsIcn\"\n [contentSnippet]=\"prescriptionConditionsContent\" />\n </div>\n </div>\n </div>\n\n <p class=\"header__medication__content__heading__activeIngredient\">\n {{ medication.activeIngredient }}\n </p>\n </div>\n\n <div class=\"header__medication__content__description\">\n <div\n class=\"header__medication__content__description__item price\"\n *ngIf=\"medication.price\">\n <span>\n {{ t('medication.ui.price') }}\n </span>\n <p>{{ medication.price }}</p>\n </div>\n\n <div\n *ngIf=\"medication.price\"\n class=\"header__medication__content__description__item price\">\n <span>\n {{ t('medication.reimbursement.title') }}\n </span>\n <div *ngIf=\"reimbursement; else noReimbursement\">\n <div class=\"textToIcon textToIcon--green\">\n <p>\n {{ reimbursement.reimbursementCriterion?.category }}\n </p>\n </div>\n </div>\n <ng-template #noReimbursement>\n <div class=\"textToIcon textToIcon--gray\">\n <p>\n {{ t('medication.reimbursement.non') }}\n </p>\n </div>\n </ng-template>\n </div>\n\n <div class=\"header__medication__content__description__item\">\n <span>{{ t('medication.delivery.title') }}</span>\n <div *ngIf=\"medication.deliveryModusCode; else freeOfPrescription\">\n <div class=\"textToIcon textToIcon--orange\">\n <p>{{ medication.deliveryModusCode }}</p>\n </div>\n </div>\n <ng-template #freeOfPrescription>\n <div class=\"textToIcon textToIcon--green\">\n <p>{{ t('medication.prescription.free') }}</p>\n </div>\n </ng-template>\n </div>\n\n <div class=\"header__medication__content__description__item\">\n <span>\n {{ t('medication.prescription.title') }}\n </span>\n <div\n *ngIf=\"\n medication.deliveryModusSpecificationCode &&\n medication.deliveryModusSpecification;\n else notApplicable\n \">\n <div class=\"textToIcon textToIcon--red\">\n <p>{{ medication.deliveryModusSpecificationCode }}</p>\n </div>\n </div>\n <ng-template #notApplicable>\n <div class=\"textToIcon textToIcon--green\">\n <p>\n {{ t('medication.delivery.notApplicable') }}\n </p>\n </div>\n </ng-template>\n </div>\n </div>\n </div>\n </div>\n <button\n class=\"header__arrow\"\n [class.isExpanded]=\"isExpanded\"\n (click)=\"toggleMedicationDetails()\">\n <cardinal-chevron-icn color=\"#3D87C5\" />\n </button>\n </div>\n\n <div *ngIf=\"isExpanded\" class=\"content\">\n <div *ngIf=\"medication.vmp\" class=\"content__vmp\">\n <div *ngIf=\"vmpName\" class=\"content__vmp__item\">\n <span>\n {{ t('medication.vmp.label') }}\n </span>\n <p>{{ vmpName }}</p>\n </div>\n <div *ngIf=\"vmpGroupName\" class=\"content__vmp__item\">\n <span>\n {{ t('medication.vmp.groupLabel') }}\n </span>\n <p>{{ vmpGroupName }}</p>\n </div>\n </div>\n\n <div class=\"content__divider\" *ngIf=\"showLinks\"></div>\n\n <div class=\"content__links\" *ngIf=\"showLinks\">\n <a *ngIf=\"medication.crmLink\" [href]=\"medication.crmLink\" target=\"_blank\">\n {{ t('medication.links.cbip') }}\n </a>\n <a\n *ngIf=\"medication.patientInformationLeafletLink\"\n [href]=\"medication.patientInformationLeafletLink\"\n target=\"_blank\">\n {{ t('medication.links.leaflet') }}\n </a>\n <a\n *ngIf=\"medication.rmaProfessionalLink\"\n [href]=\"medication.rmaProfessionalLink\"\n target=\"_blank\">\n {{ t('medication.links.rma') }}\n </a>\n <a *ngIf=\"medication.spcLink\" [href]=\"medication.spcLink\" target=\"_blank\">\n {{ t('medication.links.spc') }}\n </a>\n <a\n *ngIf=\"medication.dhpcLink\"\n [href]=\"medication.dhpcLink\"\n target=\"_blank\">\n {{ t('medication.links.dhpc') }}\n </a>\n </div>\n\n <div class=\"content__divider\" *ngIf=\"reimbursement\"></div>\n <div *ngIf=\"reimbursement\">\n <ng-container *ngTemplateOutlet=\"reimbursementsContent\"></ng-container>\n </div>\n\n <div class=\"content__divider\"></div>\n <ng-container\n *ngTemplateOutlet=\"prescriptionConditionsContent\"></ng-container>\n\n <div class=\"content__divider\"></div>\n <ng-container *ngTemplateOutlet=\"deliveryConditionsContent\"></ng-container>\n\n <div *ngIf=\"medication.supplyProblems\" class=\"content__divider\"></div>\n <div *ngIf=\"medication.supplyProblems\">\n <ng-container *ngTemplateOutlet=\"supplyProblemsContent\"></ng-container>\n </div>\n\n <div\n *ngIf=\"commercialization?.endOfComercialization\"\n class=\"content__divider\"></div>\n <div *ngIf=\"commercialization?.endOfComercialization\">\n <ng-container\n *ngTemplateOutlet=\"endOfCommercialisationContent\"></ng-container>\n </div>\n\n <div\n *ngIf=\"commercialization && !commercialization.endOfComercialization\"\n class=\"content__divider\"></div>\n <div *ngIf=\"commercialization && !commercialization.endOfComercialization\">\n <ng-container\n *ngTemplateOutlet=\"startOfCommercialisationContent\"></ng-container>\n </div>\n </div>\n</div>\n", styles: ["*{margin:0;padding:0;font-size:100%;box-sizing:border-box;font-family:Inter Variable,sans-serif}a{text-decoration:none}a:active,a:hover{outline:0}ul,li{list-style-type:none;margin:0;padding:0}h1,h2,h3,h4,h5,h6{font-size:100%}html,body{box-sizing:border-box;font-size:16px;background-color:#fbfdff}*,*:before,*:after{box-sizing:border-box}:focus{outline:0}img,audio,video{max-width:100%;height:auto}iframe{border:0}textarea{resize:none;overflow:auto;vertical-align:top;box-shadow:none;-webkit-box-shadow:none;-moz-box-shadow:none}input,textarea,select,button{outline:none;border:none;font-size:100%;margin:0}button,input{line-height:normal}input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,textarea:-webkit-autofill,textarea:-webkit-autofill:hover,textarea:-webkit-autofill:focus,select:-webkit-autofill,select:-webkit-autofill:hover,select:-webkit-autofill:focus{-webkit-text-fill-color:rgb(0,0,0);transition:background-color 5000s ease-in-out 0s}table{border-collapse:collapse;border-spacing:0}td,th{padding:0;text-align:left}.medicationRow{width:100%;display:flex;flex-direction:column;border-radius:6px;background:#fff;border:1px solid #dce7f2;cursor:pointer}.medicationRow.disableHover:hover{border-color:#dce7f2;box-shadow:none;cursor:not-allowed}.medicationRow:hover,.medicationRow.isExpanded,.medicationRow.focused,.medicationRow.disableHover.focused:hover{border-color:#3d87c5;box-shadow:0 0 0 2px #3d87c54d}.medicationRow.isExpanded .header{border-radius:6px 6px 0 0}.medicationRow .header{width:100%;display:flex;padding:8px 12px;justify-content:space-between;gap:12px;align-items:center;align-self:stretch;background:#fff;border-radius:6px}@media only screen and (max-width: 576px){.medicationRow .header{gap:4px}}.medicationRow .header__medication{width:100%;display:flex;align-items:center;gap:12px}@media only screen and (max-width: 576px){.medicationRow .header__medication{gap:8px}}.medicationRow .header__medication__content{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:12px}.medicationRow .header__medication__content__heading{display:flex;flex-direction:column;gap:4px}.medicationRow .header__medication__content__heading__title{display:flex;align-items:center;gap:8px}.medicationRow .header__medication__content__heading__title h3{color:#1d2235;font-size:16px;font-style:normal;font-weight:500}.medicationRow .header__medication__content__heading__infographics{display:flex;align-items:center;gap:12px}.medicationRow .header__medication__content__heading__infographics .deliveryPrescriptionConditions,.medicationRow .header__medication__content__heading__infographics .medicationInfographics,.medicationRow .header__medication__content__heading__infographics .medicationAvailabilityInfographics{display:flex;align-items:center;gap:2px}.medicationRow .header__medication__content__heading__infographics .medicationInfographics__item{display:flex;width:22px;height:22px;justify-content:center;align-items:center;border-radius:5px;border:1px solid #add5ff}.medicationRow .header__medication__content__heading__infographics .medicationAvailabilityInfographics__item{display:flex;width:22px;height:22px;justify-content:center;align-items:center;border-radius:5px}.medicationRow .header__medication__content__heading__infographics .medicationAvailabilityInfographics__item--red{background-color:#ffcdcd}.medicationRow .header__medication__content__heading__infographics .medicationAvailabilityInfographics__item--orange{background-color:#ffda83}.medicationRow .header__medication__content__heading__infographics .medicationAvailabilityInfographics__item--green{background-color:#c7f4ab}.medicationRow .header__medication__content__heading__activeIngredient{color:#1d2235;font-size:14px;font-style:normal;font-weight:300;line-height:normal}.medicationRow .header__medication__content__description{width:100%;display:flex;gap:32px;row-gap:8px;flex-wrap:wrap}.medicationRow .header__medication__content__description__item{display:flex;align-items:center;gap:6px}.medicationRow .header__medication__content__description__item span{font-size:12px;font-weight:400;color:#4b6682}.medicationRow .header__medication__content__description__item p{font-size:14px;font-weight:400;color:#000}.medicationRow .header__medication__content__description__item.price p{color:#ef762f;font-size:14px;font-style:normal;font-weight:600;line-height:normal}.medicationRow .header__medication__content__description__item.delivery,.medicationRow .header__medication__content__description__item.prescription{width:100%;flex-wrap:wrap;align-items:center;gap:4px}.medicationRow .header__arrow{width:18px;background:none;cursor:pointer}.medicationRow .header__arrow.isExpanded{transform:rotate(90deg)}.medicationRow .content{width:100%;display:flex;flex-direction:column;padding:18px 12px;gap:18px;background-color:#f9fbfe;border-radius:0 0 6px 6px;border-top:1px dashed #3d87c5}.medicationRow .content__vmp{width:100%;display:flex;flex-direction:column;gap:12px}.medicationRow .content__vmp__item{width:100%;display:flex;flex-direction:column;gap:4px}.medicationRow .content__vmp__item span{font-size:12px;font-weight:400;color:#4b6682}.medicationRow .content__vmp__item p{font-size:14px;font-weight:400;color:#000}.medicationRow .content__divider{width:100%;display:flex;border-bottom:1px dashed rgba(61,135,197,.25)}.medicationRow .content__links{width:100%;display:flex;align-items:flex-start;justify-content:space-between;flex-wrap:wrap;row-gap:8px}.medicationRow .content__links a{width:49%;color:#3d87c5;font-size:14px;font-style:normal;font-weight:400;line-height:normal}.medicationRow .content__links a:hover{text-decoration:underline}.supplyProblemsTooltip{width:100%;display:flex;flex-direction:column;gap:8px}.supplyProblemsTooltip__title{width:100%;font-size:14px;font-weight:500}.supplyProblemsTooltip__title--orange{background-color:#ffda83}.supplyProblemsTooltip__title--red{background-color:#ffcdcd}.supplyProblemsTooltip__title--green{background-color:#c7f4ab}.supplyProblemsTooltip__content{width:100%;display:flex;flex-direction:column;gap:8px}.supplyProblemsTooltip__content div{width:100%;display:flex;flex-direction:column;gap:4px}.supplyProblemsTooltip__content div span{font-size:12px;font-weight:400;color:#4b6682}.supplyProblemsTooltip__content div p{font-size:14px;font-weight:400;color:#000}.supplyProblemsTooltip__content div a{font-size:14px;font-weight:400;color:#4b6682}.supplyProblemsTooltip__content div a:hover{text-decoration:underline}.textToIcon{height:22px;width:auto;display:flex;align-items:center;justify-content:center;padding:0 6px;border-radius:5px}.textToIcon--orange{background-color:#e5a613}.textToIcon--red{background-color:#ee5d59}.textToIcon--green{background-color:#33b96b}.textToIcon--gray{background-color:#7e827f}.textToIcon p{font-size:11px!important;font-weight:600;color:#fff!important}.tooltipBtn{display:flex;align-items:center;justify-content:center}.snippetLink{color:#3d87c5;font-size:14px!important;font-style:normal;font-weight:400;line-height:normal}.snippetLink:hover{text-decoration:underline}\n"] }]
}], ctorParameters: () => [{ type: TranslationService }, { type: i0.ChangeDetectorRef }], propDecorators: { medication: [{
type: Input,
args: [{ required: true }]
}], index: [{
type: Input,
args: [{ required: true }]
}], focused: [{
type: Input
}], addPrescription: [{
type: Output
}] } });
class SamSdkService {
sdk = null;
setSdk(instance) {
this.sdk = instance;
}
async searchMedications(lang, query) {
if (!this.sdk)
throw new Error('SDK not initialized');
if (!query)
throw new Error('Query is not found');
try {
const res = await Promise.all([
this.sdk.findPaginatedAmpsByLabel(lang, query),
this.sdk.findPaginatedVmpGroupsByLabel(lang, query),
this.sdk.findPaginatedNmpsByLabel(lang, query),
]);
console.log('search res');
console.log(res);
return res;
}
catch (error) {
console.error('Error searching medications:', error);
throw error;
}
}
async getSamVersion() {
if (!this.sdk)
throw new Error('SDK not initialized');
try {
return await this.sdk.getSamVersion();
}
catch (error) {
console.error('Error getting SAM version:', error);
return undefined;
}
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: SamSdkService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: SamSdkService, providedIn: 'root' });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: SamSdkService, decorators: [{
type: Injectable,
args: [{
providedIn: 'root',
}]
}] });
function capitalize(s) {
if (!s)
return s;
return s.charAt(0).toUpperCase() + s.slice(1).toLowerCase();
}
/**
* Service to merge multiple sorted, partially loaded arrays of NamedItems.
*/
class MergeLazySortedNamedItemsService {
async mergeLazySortedNamedItems(limit, arrays, fetchMissingCallbacks) {
if (arrays.length !== fetchMissingCallbacks.length) {
throw new Error('Each array must have a corresponding fetch callback.');
}
const result = [];
const pointers = arrays.map(() => 0);
let lastPushedName = '';
async function drainArrayUpTo(k, limitName, limit) {
const arr = arrays[k];
let p = pointers[k];
const fetchMissing = fetchMissingCallbacks[k];
while (result.length < limit) {
if (p < arr.length) {
const itemName = arr[p].title.toLowerCase();
if (limitName === null || itemName < limitName) {
result.push(arr[p]);
lastPushedName = itemName;
p++;
}
else {
break;
}
}
else {
const upper = limitName === null ? undefined : limitName;
const newItems = await fetchMissing(lastPushedName, upper);
if (newItems.length === 0)
break;
arr.splice(p, 0, ...newItems);
}
}
pointers[k] = p;
}
function indexOfSmallestFront() {
let smallestIndex = null;
let smallestName = '';
for (let k = 0; k < arrays.length; k++) {
const p = pointers[k];
if (p < arrays[k].length) {
const candidateName = arrays[k][p].title.toLowerCase();
if (smallestIndex === null || candidateName < smallestName) {
smallestIndex = k;
smallestName = candidateName;
}
}
}
return smallestIndex;
}
while (result.length < limit) {
const si = indexOfSmallestFront();
if (si === null)
break;
const nextName = arrays[si][pointers[si]].title.toLowerCase();
for (let k = 0; k < arrays.length; k++) {
await drainArrayUpTo(k, nextName, limit);
}
if (result.length < limit && pointers[si] < arrays[si].length) {
const item = arrays[si][pointers[si]];
if (item.title.toLowerCase() === nextName) {
result.push(item);
lastPushedName = nextName;
pointers[si]++;
}
}
}
if (result.length < limit) {
for (let k = 0; k < arrays.length; k++) {
await drainArrayUpTo(k, null, limit);
}
}
return [result, pointers];
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: MergeLazySortedNamedItemsService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: MergeLazySortedNamedItemsService, providedIn: 'root' });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: MergeLazySortedNamedItemsService, decorators: [{
type: Injectable,
args: [{
providedIn: 'root',
}]
}] });
class MedicationLoaderService {
mergeService;
translationService;
constructor(mergeService, translationService) {
this.mergeService = mergeService;
this.translationService = translationService;
}
defaultLanguage = 'fr';
get language() {
return (this.translationService.getCurrentLanguage?.() ?? this.defaultLanguage);
}
async loadMedicationsPage(medications, min, deliveryEnvironment, acc = []) {
const now = Date.now();
const twoYearsAgo = now - 2 * 365 * 24 * 3600 * 1000;
const loadedPage = !(await medications.hasNext())
? []
: await medications.next(min);
const page = loadedPage.flatMap((amp) => amp.to && amp.to < now
? []
: amp.ampps
.filter(ampp => ampp.from &&
ampp.from < now &&
(!ampp.to || ampp.to > now) &&
ampp.status === AmpStatus.Authorized &&
ampp.commercializations?.some(c => !!c.from && (!c.to || c.to > twoYearsAgo)) &&
ampp.dmpps?.some(dmpp => dmpp.from &&
dmpp.from < now &&
(!dmpp.to || dmpp.to > now) &&
dmpp.deliveryEnvironment?.toString() === deliveryEnvironment))
.map(ampp => {
const dmpp = ampp.dmpps?.find(dmpp => dmpp.from &&
dmpp.from < now &&
(!dmpp.to || dmpp.to > now) &&
dmpp.deliveryEnvironment?.toString() ===
deliveryEnvironment &&
dmpp.codeType === DmppCodeType.Cnk);
const language = this.language;
return {
ampId: amp.id,
vmpGroupId: amp.vmp?.vmpGroup?.id,
id: ampp.ctiExtended,
cnk: dmpp?.code,
dmppProductId: dmpp?.productId,
title: ampp.prescriptionName?.[language] ??
ampp.prescriptionName?.[this.defaultLanguage] ??
ampp.abbreviatedName?.[language] ??
ampp.abbreviatedName?.[this.defaultLanguage] ??
amp.prescriptionName?.[language] ??
amp.prescriptionName?.[this.defaultLanguage] ??
amp.name?.[language] ??
amp.name?.[this.defaultLanguage] ??
amp.abbreviatedName?.[language] ??
amp.abbreviatedName?.[this.defaultLanguage] ??
'',
vmpTitle: amp.vmp?.name?.[language] ??
amp.vmp?.name?.[this.defaultLanguage] ??
'',
activeIngredient: amp.vmp?.vmpGroup?.name?.[language] ??
amp.vmp?.vmpGroup?.name?.[this.defaultLanguage] ??
'',
price: ampp?.exFactoryPrice ? `€${ampp.exFactoryPrice}` : '',
crmLink: ampp.crmLink?.[language] ??
ampp.crmLink?.[this.defaultLanguage],
patientInformationLeafletLink: ampp.leafletLink?.[language] ??
ampp.leafletLink?.[this.defaultLanguage],
blackTriangle: amp.blackTriangle,
speciallyRegulated: ampp.speciallyRegulated,
genericPrescriptionRequired: ampp.genericPrescriptionRequired,
intendedName: ampp.prescriptionName?.[language] ??
ampp.prescriptionName?.[this.defaultLanguage],
rmaProfessionalLink: ampp.rmaProfessionalLink?.[language] ??
ampp.rmaProfessionalLink?.[this.defaultLanguage],
spcLink: ampp.spcLink?.[language] ??
ampp.spcLink?.[this.defaultLanguage],
dhpcLink: ampp.dhpcLink?.[language] ??
ampp.dhpcLink?.[this.defaultLanguage],
rmakeyMessages: ampp.rmaKeyMessages,
vmp: amp.vmp,
supplyProblems: ampp.supplyProblems,
commercializations: ampp?.commercializations,
deliveryModusCode: ampp.deliveryModusCode,
deliveryModus: ampp.deliveryModus?.[language] ??
ampp.deliveryModus?.[this.defaultLanguage],
deliveryModusSpecificationCode: ampp.deliveryModusSpecificationCode,
deliveryModusSpecification: ampp.deliveryModusSpecification?.[language] ??
ampp.deliveryModusSpecification?.[this.defaultLanguage],
reimbursements: dmpp?.reimbursements?.find(dmpp => dmpp.from && dmpp.from < now && (!dmpp.to || dmpp.to > now)),
};
}));
return loadedPage.length < min || page.length + acc.length >= min
? [...acc, ...page]
: await this.loadMedicationsPage(medications, min, deliveryEnvironment, [
...acc,
...page,
]);
}
async loadMoleculesPage(molecules, min, acc = []) {
const now = Date.now();
const language = this.language;
const loadedPage = !(await molecules.hasNext())
? []
: await molecules.next(min);
const page = loadedPage
.filter((vmp) => !(vmp.to && vmp.to < now))
.map(vmp => {
return {
vmpGroupId: vmp.id,
id: vmp.code,
title: capitalize(vmp.name?.[language]) ??
capitalize(vmp.name?.[this.defaultLanguage]) ??
'',
standardDosage: vmp.standardDosage,
};
});
return page.length < min || page.length + acc.length >= min
? [...acc, ...page]
: await this.loadMoleculesPage(molecules, min, [...acc, ...page]);
}
async loadNonMedicinalPage(products, min, acc = []) {
const now = Date.now();
const language = this.language;
const loadedPage = !(await products.hasNext())
? []
: await products.next(min);
const page = loadedPage
.filter((nmp) => !(nmp.to && nmp.to < now))
.map(nmp => {
return {
nmpId: nmp.id,
id: nmp.code,
title: capitalize(nmp.name?.[language]) ??
capitalize(nmp.name?.[this.defaultLanguage]) ??
'',
};
});
return page.length < min || page.length + acc.length >= min
? [...acc, ...page]
: await this.loadNonMedicinalPage(products, min, [...acc, ...page]);
}
async loadUntil(toName, loadPage) {
let page = await loadPage();
const lcToName = toName?.toLowerCase();
while (page.length &&
(!lcToName || page[page.length - 1].title.toLowerCase() < lcToName)) {
const newPage = await loadPage();
if (!newPage.length)
break;
page = [...page, ...newPage];
}
return page;
}
async loadMore(params) {
const { medicationsPage, moleculesPage, productsPage, medications, molecules, products, deliveryEnvironment, } = params;
const [result, pointers] = await this.mergeService.mergeLazySortedNamedItems(10, [[...medicationsPage], [...moleculesPage], [...productsPage]], [
async (_, toName) => {
const loaded = await this.loadUntil(toName, () => medications
? this.loadMedicationsPage(medications, 10, deliveryEnvironment)
: Promise.resolve([]));
params.medicationsPage.push(...loaded);
return loaded;
},
async (_, toName) => {
const loaded = await this.loadUntil(toName, () => molecules
? this.loadMoleculesPage(molecules, 10)
: Promise.resolve([]));
params.moleculesPage.push(...loaded);
return loaded;
},
async (_, toName) => {
const loaded = await this.loadUntil(toName, () => products
? this.loadNonMedicinalPage(products, 10)
: Promise.resolve([]));
params.productsPage.push(...loaded);
return loaded;
},
]);
return {
result,
updated: {
medicationsPage: params.medicationsPage.slice(pointers[0]),
moleculesPage: params.moleculesPage.slice(pointers[1]),
productsPage: params.productsPage.slice(pointers[2]),
},
};
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: MedicationLoaderService, deps: [{ token: MergeLazySortedNamedItemsService }, { token: TranslationService }], target: i0.ɵɵFactoryTarget.Injectable });
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: MedicationLoaderService, providedIn: 'root' });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: MedicationLoaderService, decorators: [{
type: Injectable,
args: [{
providedIn: 'root',
}]
}], ctorParameters: () => [{ type: MergeLazySortedNamedItemsService }, { type: TranslationService }] });
class MedicationSearchComponent {
samSdkService;
loader;
tooltipContext;
translationService;
cdr;
deliveryEnvironment;
addPrescription = new EventEmitter();
inputRef;
scrollAnchor;
resultRefs;
medicationSearchDropdown;
constructor(samSdkService, loader, tooltipContext, translationService, cdr) {
this.samSdkService = samSdkService;
this.loader = loader;
this.tooltipContext = tooltipContext;
this.translationService = translationService;
this.cdr = cdr;
}
t(key) {
return this.translationService.translate(key);
}
intersectionObserver;
observerInitialized = false;
medicationSearchDropdownRectInitialized = false;
language = 'fr';
destroy$ = new Subject();
medications;
molecules;
products;
pages = [];
medicationsPage = [];
moleculesPage = [];
productsPage = [];
focusedMedicationIndex = undefined;
searchControl = new FormControl('');
get totalPagesLength() {
return this.pages.length;
}
get dropdownDisplayed() {
return !!this.searchControl.value?.trim();
}
ngOnInit() {
this.language = this.translationService.getCurrentLanguage();
this.searchControl.valueChanges
.pipe(debounceTime(100), takeUntil(this.destroy$))
.subscribe(query => {
const q = query?.trim() ?? '';
if (q.length === 0) {
this.onResetSearch();
return;
}
if (q.length < 3)
return;
this.samSdkService
.searchMedications(this.language, q)
.then(async ([meds, mols, prods]) => {
const latestQuery = this.searchControl.value?.trim();
if (q !== latestQuery)
return;
this.medications = meds;
this.molecules = mols;
this.products = prods;
const [medicationsPage, moleculesPage, productsPage] = await Promise.all([
meds
? this.loader.loadMedicationsPage(meds, 10, this.deliveryEnvironment)
: [],
mols ? this.loader.loadMoleculesPage(mols, 10) : [],
prods ? this.loader.loadNonMedicinalPage(prods, 10) : [],
]);
this.medicationsPage = medicationsPage;
this.moleculesPage = moleculesPage;
this.productsPage = productsPage;
if (q !== this.searchControl.value?.trim())
return;
const { result, updated } = await this.loader.loadMore({
medicationsPage: this.medicationsPage,
moleculesPage: this.moleculesPage,
productsPage: this.productsPage,
medications: this.medications,
molecules: this.molecules,
products: this.products,
deliveryEnvironment: this.deliveryEnvironment,
});
this.medicationsPage = updated.medicationsPage;
this.moleculesPage = updated.moleculesPage;
this.productsPage = updated.productsPage;
this.pages = result;
this.focusedMedicationIndex = 0;
this.cdr.markForCheck();
});
});
}
ngAfterViewChecked() {
if (!this.observerInitialized &&
this.medicationSearchDropdown &&
this.scrollAnchor) {
this.initIntersectionObserver();
this.observerInitialized = true;
}
if (!this.medicationSearchDropdownRectInitialized &&
this.medicationSearchDropdown) {
const rect = this.medicationSearchDropdown.nativeElement.getBoundingClientRect();
this.tooltipContext.setDropdownRect(rect);
this.medicationSearchDropdownRectInitialized = true;
}
}
ngOnDestroy() {
this.destroy$.next();
this.destroy$.complete();
if (this.intersectionObserver) {
this.intersectionObserver.disconnect();
}
}
handleAddPrescription(med) {
this.addPrescription.emit(med);
this.searchControl.setValue('');
this.onResetSearch();
this.cdr.markForCheck();
}
onResetSearch() {
this.medications = undefined;
this.molecules = undefined;
this.products = undefined;
this.medicationsPage = [];
this.moleculesPage = [];
this.productsPage = [];
this.pages = [];
this.focusedMedicationIndex = undefined;
this.cdr.markForCheck();
}
handleKeyDown(event) {
const pageCount = this.totalPagesLength;
const viewCount = this.resultRefs.length;
if (this.focusedMedicationIndex !== undefined) {
if (event.key === 'ArrowDown') {
this.focusedMedicationIndex =
(this.focusedMedicationIndex + 1) % pageCount;
}
else if (event.key === 'ArrowUp') {
this.focusedMedicationIndex =
(this.focusedMedicationIndex - 1 + pageCount) % pageCount;
}
else if (event.key === 'Enter' && this.focusedMedicationIndex >= 0) {
this.handleAddPrescription(this.pages[this.focusedMedicationIndex]);
}
if (viewCount > 0) {
this.scrollToFocusedItem();
}
}
this.cdr.markForCheck();
}
scrollToFocusedItem() {
setTimeout(() => {
const refs = this.resultRefs?.toArray();
const index = this.focusedMedicationIndex;
if (index !== undefined && refs && refs[index]) {
refs[index].nativeElement.scrollIntoView({
behavior: 'smooth',
block: 'nearest',
});
}
}, 0);
this.cdr.markForCheck();
}
initIntersectionObserver() {
this.intersectionObserver = new IntersectionObserver(async (entries) => {
for (let entry of entries) {
if (entry.isIntersecting) {
const res = await this.loader.loadMore({
medicationsPage: this.medicationsPage,
moleculesPage: this.moleculesPage,
productsPage: this.productsPage,
medications: this.medications,
molecules: this.molecules,
products: this.products,
deliveryEnvironment: this.deliveryEnvironment,
});
this.medicationsPage = [
...this.medicationsPage,
...res.updated.medicationsPage,
];
this.moleculesPage = [
...this.moleculesPage,
...res.updated.moleculesPage,
];
this.productsPage = [
...this.productsPage,
...res.updated.productsPage,
];
this.pages = [...this.pages, ...res.result];
this.cdr.markForCheck();
}
}
}, {
root: this.medicationSearchDropdown.nativeElement,
rootMargin: '0px',
threshold: 0.1,
});
this.intersectionObserver.observe(this.scrollAnchor.nativeElement);
}
get showSearchError() {
const value = this.searchControl.value?.trim();
return !!value && value.length < 3;
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: MedicationSearchComponent, deps: [{ token: SamSdkService }, { token: MedicationLoaderService }, { token: TooltipContextService }, { token: TranslationService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: MedicationSearchComponent, isStandalone: true, selector: "cardinal-medication-search", inputs: { deliveryEnvironment: "deliveryEnvironment" }, outputs: { addPrescription: "addPrescription" }, host: { listeners: { "document:keydown": "handleKeyDown($event)" } }, viewQueries: [{ propertyName: "inputRef", first: true, predicate: ["inputRef"], descendants: true }, { propertyName: "scrollAnchor", first: true, predicate: ["scrollAnchor"], descendants: true }, { propertyName: "medicationSearchDropdown", first: true, predicate: ["medicationSearchDropdown"], descendants: true }, { propertyName: "resultRefs", predicate: ["resultRef"], descendants: true }], ngImport: i0, template: "<div class=\"medicationSearch\">\n <div\n [class.dropdownDisplayed]=\"dropdownDisplayed\"\n class=\"medicationSearch__input\">\n <p>{{ t('medication.search.label') }}:</p>\n <label for=\"medicationSearch\">\n <input\n #inputRef\n id=\"medicationSearch\"\n type=\"text\"\n placeholder=\"{{ t('medication.search.label') }}\"\n autocomplete=\"off\"\n autocapitalize=\"off\"\n [formControl]=\"searchControl\" />\n <cardinal-search-icn color=\"#9CA8B2\" />\n </label>\n <p class=\"error\" *ngIf=\"showSearchError\">\n {{ t('medication.search.errorMessage') }}\n </p>\n </div>\n\n <div\n #medicationSearchDropdown\n *ngIf=\"pages && pages.length > 0\"\n class=\"medicationSearchDropdown\"\n (keydown)=\"handleKeyDown($event)\">\n <div\n *ngFor=\"let med of pages; let i = index\"\n #resultRef\n class=\"medicationSearchDropdown__cardWrap\"\n [class.focused]=\"focusedMedicationIndex === i\">\n <cardinal-medication-card\n class=\"medication-card\"\n [medication]=\"med\"\n [index]=\"i\"\n [focused]=\"focusedMedicationIndex === i\"\n (addPrescription)=\"handleAddPrescription($event)\" />\n </div>\n <div #scrollAnchor style=\"height: 1px\"></div>\n </div>\n</div>\n", styles: ["*{margin:0;padding:0;font-size:100%;box-sizing:border-box;font-family:Inter Variable,sans-serif}a{text-decoration:none}a:active,a:hover{outline:0}ul,li{list-style-type:none;margin:0;padding:0}h1,h2,h3,h4,h5,h6{font-size:100%}html,body{box-sizing:border-box;font-size:16px;background-color:#fbfdff}*,*:before,*:after{box-sizing:border-box}:focus{outline:0}img,audio,video{max-width:100%;height:auto}iframe{border:0}textarea{resize:none;overflow:auto;vertical-align:top;box-shadow:none;-webkit-box-shadow:none;-moz-box-shadow:none}input,textarea,select,button{outline:none;border:none;font-size:100%;margin:0}button,input{line-height:normal}input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,textarea:-webkit-autofill,textarea:-webkit-autofill:hover,textarea:-webkit-autofill:focus,select:-webkit-autofill,select:-webkit-autofill:hover,select:-webkit-autofill:focus{-webkit-text-fill-color:rgb(0,0,0);transition:background-color 5000s ease-in-out 0s}table{border-collapse:collapse;border-spacing:0}td,th{padding:0;text-align:left}.medicationSearch{display:flex;flex-direction:column;gap:4px;width:50%;min-width:700px}@media only screen and (max-width: 768px){.medicationSearch{width:100%;min-width:100%}}.medicationSearch__input{width:100%;display:flex;flex-direction:column;align-items:flex-start;gap:4px;align-self:stretch}.medicationSearch__input p{width:100%;display:flex;align-items:flex-start;gap:4px;color:#1d2235;font-size:14px;font-weight:500;line-height:22px;cursor:pointer}.medicationSearch__input p span{display:none}.medicationSearch__input p.required span{display:flex;color:red;font-weight:700}.medicationSearch__input p.error{color:red}.medicationSearch__input label{width:100%;display:flex;height:32px;padding:5px 12px;align-items:center;gap:4px;align-self:stretch;cursor:pointer;border-radius:6px;border:1px solid #cad0d5;background:#fff;color:#1d2235;font-family:Inter Variable,sans-serif;font-size:14px;font-weight:400;line-height:22px;justify-content:space-between}.medicationSearch__input label::placeholder{color:#9ca8b2}.medicationSearch__input label:hover,.medicationSearch__input label:focus{border-color:#084b83}.medicationSearch__input label:focus{box-shadow:0 0 0 2px #3d87c533}.medicationSearch__input label.disabled{cursor:not-allowed;background-color:#f5f5f5;border-color:#cad0d5;opacity:.7}.medicationSearch__input label.disabled:hover{border-color:#cad0d5}.medicationSearch__input label.error{border-color:red;box-shadow:0 0 0 2px #f003;color:red}.medicationSearch__input label.error::placeholder{color:#ff000080}.medicationSearch__input label:focus-within{border-color:#084b83;box-shadow:0 0 0 2px #3d87c533}.medicationSearch__input label input{width:100%}.medicationSearch__input label input::placeholder{color:#9ca8b2}.medicationSearch__input label cardinal-search-icn{display:flex;align-items:center;justify-content:center}.medicationSearch__input.dropdownDisplayed label{border-color:#084b83;box-shadow:0 0 0 2px #3d87c533;border-radius:6px}.medicationSearchDropdown{width:100%;height:400px;overflow-y:scroll;display:flex;flex-direction:column;align-items:flex-start;align-self:stretch;position:relative;padding:6px 8px 6px 6px;gap:5px;border-radius:0 0 6px 6px;border-top:none;background:#eef6fe;box-shadow:0 9px 28px #0000000d,0 6px 16px #00000014,0 3px 6px #0000001f}.medicationSearchDropdown li{width:100%}.medicationSearchDropdown cardinal-medication-card{width:100%}.medicationSearchDropdown__cardWrap{width:100%}\n"], dependencies: [{ kind: "component", type: SearchIcnComponent, selector: "cardinal-search-icn", inputs: ["color"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: MedicationCardComponent, selector: "cardinal-medication-card", inputs: ["medication", "index", "focused"], outputs: ["addPrescription"] }, { kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: MedicationSearchComponent, decorators: [{
type: Component,
args: [{ selector: 'cardinal-medication-search', standalone: true, imports: [
SearchIcnComponent,
NgIf,
MedicationCardComponent,
NgForOf,
ReactiveFormsModule,
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"medicationSearch\">\n <div\n [class.dropdownDisplayed]=\"dropdownDisplayed\"\n class=\"medicationSearch__input\">\n <p>{{ t('medication.search.label') }}:</p>\n <label for=\"medicationSearch\">\n <input\n #inputRef\n id=\"medicationSearch\"\n type=\"text\"\n placeholder=\"{{ t('medication.search.label') }}\"\n autocomplete=\"off\"\n autocapitalize=\"off\"\n [formControl]=\"searchControl\" />\n <cardinal-search-icn color=\"#9CA8B2\" />\n </label>\n <p class=\"error\" *ngIf=\"showSearchError\">\n {{ t('medication.search.errorMessage') }}\n </p>\n </div>\n\n <div\n #medicationSearchDropdown\n *ngIf=\"pages && pages.length > 0\"\n class=\"medicationSearchDropdown\"\n (keydown)=\"handleKeyDown($event)\">\n <div\n *ngFor=\"let med of pages; let i = index\"\n #resultRef\n class=\"medicationSearchDropdown__cardWrap\"\n [class.focused]=\"focusedMedicationIndex === i\">\n <cardinal-medication-card\n class=\"medication-card\"\n [medication]=\"med\"\n [index]=\"i\"\n [focused]=\"focusedMedicationIndex === i\"\n (addPrescription)=\"handleAddPrescription($event)\" />\n </div>\n <div #scrollAnchor style=\"height: 1px\"></div>\n </div>\n</div>\n", styles: ["*{margin:0;padding:0;font-size:100%;box-sizing:border-box;font-family:Inter Variable,sans-serif}a{text-decoration:none}a:active,a:hover{outline:0}ul,li{list-style-type:none;margin:0;padding:0}h1,h2,h3,h4,h5,h6{font-size:100%}html,body{box-sizing:border-box;font-size:16px;background-color:#fbfdff}*,*:before,*:after{box-sizing:border-box}:focus{outline:0}img,audio,video{max-width:100%;height:auto}iframe{border:0}textarea{resize:none;overflow:auto;vertical-align:top;box-shadow:none;-webkit-box-shadow:none;-moz-box-shadow:none}input,textarea,select,button{outline:none;border:none;font-size:100%;margin:0}button,input{line-height:normal}input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,textarea:-webkit-autofill,textarea:-webkit-autofill:hover,textarea:-webkit-autofill:focus,select:-webkit-autofill,select:-webkit-autofill:hover,select:-webkit-autofill:focus{-webkit-text-fill-color:rgb(0,0,0);transition:background-color 5000s ease-in-out 0s}table{border-collapse:collapse;border-spacing:0}td,th{padding:0;text-align:left}.medicationSearch{display:flex;flex-direction:column;gap:4px;width:50%;min-width:700px}@media only screen and (max-width: 768px){.medicationSearch{width:100%;min-width:100%}}.medicationSearch__input{width:100%;display:flex;flex-direction:column;align-items:flex-start;gap:4px;align-self:stretch}.medicationSearch__input p{width:100%;display:flex;align-items:flex-start;gap:4px;color:#1d2235;font-size:14px;font-weight:500;line-height:22px;cursor:pointer}.medicationSearch__input p span{display:none}.medicationSearch__input p.required span{display:flex;color:red;font-weight:700}.medicationSearch__input p.error{color:red}.medicationSearch__input label{width:100%;display:flex;height:32px;padding:5px 12px;align-items:center;gap:4px;align-self:stretch;cursor:pointer;border-radius:6px;border:1px solid #cad0d5;background:#fff;color:#1d2235;font-family:Inter Variable,sans-serif;font-size:14px;font-weight:400;line-height:22px;justify-content:space-between}.medicationSearch__input label::placeholder{color:#9ca8b2}.medicationSearch__input label:hover,.medicationSearch__input label:focus{border-color:#084b83}.medicationSearch__input label:focus{box-shadow:0 0 0 2px #3d87c533}.medicationSearch__input label.disabled{cursor:not-allowed;background-color:#f5f5f5;border-color:#cad0d5;opacity:.7}.medicationSearch__input label.disabled:hover{border-color:#cad0d5}.medicationSearch__input label.error{border-color:red;box-shadow:0 0 0 2px #f003;color:red}.medicationSearch__input label.error::placeholder{color:#ff000080}.medicationSearch__input label:focus-within{border-color:#084b83;box-shadow:0 0 0 2px #3d87c533}.medicationSearch__input label input{width:100%}.medicationSearch__input label input::placeholder{color:#9ca8b2}.medicationSearch__input label cardinal-search-icn{display:flex;align-items:center;justify-content:center}.medicationSearch__input.dropdownDisplayed label{border-color:#084b83;box-shadow:0 0 0 2px #3d87c533;border-radius:6px}.medicationSearchDropdown{width:100%;height:400px;overflow-y:scroll;display:flex;flex-direction:column;align-items:flex-start;align-self:stretch;position:relative;padding:6px 8px 6px 6px;gap:5px;border-radius:0 0 6px 6px;border-top:none;background:#eef6fe;box-shadow:0 9px 28px #0000000d,0 6px 16px #00000014,0 3px 6px #0000001f}.medicationSearchDropdown li{width:100%}.medicationSearchDropdown cardinal-medication-card{width:100%}.medicationSearchDropdown__cardWrap{width:100%}\n"] }]
}], ctorParameters: () => [{ type: SamSdkService }, { type: MedicationLoaderService }, { type: TooltipContextService }, { type: TranslationService }, { type: i0.ChangeDetectorRef }], propDecorators: { deliveryEnvironment: [{
type: Input,
args: [{ required: true }]
}], addPrescription: [{
type: Output
}], inputRef: [{
type: ViewChild,
args: ['inputRef']
}], scrollAnchor: [{
type: ViewChild,
args: ['scrollAnchor', { static: false }]
}], resultRefs: [{
type: ViewChildren,
args: ['resultRef']
}], medicationSearchDropdown: [{
type: ViewChild,
args: ['medicationSearchDropdown', { static: false }]
}], handleKeyDown: [{
type: HostListener,
args: ['document:keydown', ['$event']]
}] } });
class StatusSuccessComponent {
color = 'currentColor';
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: StatusSuccessComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: StatusSuccessComponent, isStandalone: true, selector: "cardinal-status-success", inputs: { color: "color" }, ngImport: i0, template: "<svg\n width=\"26\"\n height=\"26\"\n viewBox=\"0 0 26 26\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <g clip-path=\"url(#clip0_1152_2420)\">\n <path\n d=\"M13 0C5.82098 0 0 5.82098 0 13C0 20.179 5.82098 26 13 26C20.179 26 26 20.179 26 13C26 5.82098 20.179 0 13 0ZM18.615 8.75469L12.5038 17.2279C12.4184 17.3471 12.3058 17.4443 12.1753 17.5113C12.0449 17.5783 11.9003 17.6132 11.7537 17.6132C11.607 17.6132 11.4625 17.5783 11.332 17.5113C11.2016 17.4443 11.089 17.3471 11.0036 17.2279L7.38504 12.2136C7.27478 12.0598 7.38504 11.8451 7.57366 11.8451H8.9346C9.23058 11.8451 9.51205 11.9873 9.68616 12.231L11.7522 15.098L16.3138 8.7721C16.4879 8.53125 16.7665 8.38616 17.0654 8.38616H18.4263C18.615 8.38616 18.7252 8.60089 18.615 8.75469Z\"\n [attr.fill]=\"color\" />\n </g>\n <defs>\n <clipPath id=\"clip0_1152_2420\">\n <rect width=\"26\" height=\"26\" fill=\"white\" />\n </clipPath>\n </defs>\n</svg>\n", styles: [""], changeDetection: i0.ChangeDetectionStrategy.OnPush });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: StatusSuccessComponent, decorators: [{
type: Component,
args: [{ selector: 'cardinal-status-success', imports: [], changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, template: "<svg\n width=\"26\"\n height=\"26\"\n viewBox=\"0 0 26 26\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <g clip-path=\"url(#clip0_1152_2420)\">\n <path\n d=\"M13 0C5.82098 0 0 5.82098 0 13C0 20.179 5.82098 26 13 26C20.179 26 26 20.179 26 13C26 5.82098 20.179 0 13 0ZM18.615 8.75469L12.5038 17.2279C12.4184 17.3471 12.3058 17.4443 12.1753 17.5113C12.0449 17.5783 11.9003 17.6132 11.7537 17.6132C11.607 17.6132 11.4625 17.5783 11.332 17.5113C11.2016 17.4443 11.089 17.3471 11.0036 17.2279L7.38504 12.2136C7.27478 12.0598 7.38504 11.8451 7.57366 11.8451H8.9346C9.23058 11.8451 9.51205 11.9873 9.68616 12.231L11.7522 15.098L16.3138 8.7721C16.4879 8.53125 16.7665 8.38616 17.0654 8.38616H18.4263C18.615 8.38616 18.7252 8.60089 18.615 8.75469Z\"\n [attr.fill]=\"color\" />\n </g>\n <defs>\n <clipPath id=\"clip0_1152_2420\">\n <rect width=\"26\" height=\"26\" fill=\"white\" />\n </clipPath>\n </defs>\n</svg>\n" }]
}], propDecorators: { color: [{
type: Input,
args: [{ required: true }]
}] } });
class StatusErrorComponent {
color = 'currentColor';
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: StatusErrorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: StatusErrorComponent, isStandalone: true, selector: "cardinal-status-error", inputs: { color: "color" }, ngImport: i0, template: "<svg\n width=\"24\"\n height=\"24\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M12 0C18.6268 0 24 5.37321 24 12C24 18.6268 18.6268 24 12 24C5.37321 24 0 18.6268 0 12C0 5.37321 5.37321 0 12 0ZM15.428 7.36125H15.427L15.4248 7.36286L12 10.7879L8.57518 7.36286C8.57411 7.36152 8.57357 7.36125 8.57304 7.36125C8.57242 7.36106 8.57177 7.36106 8.57116 7.36125C8.57036 7.36125 8.56982 7.36152 8.56875 7.36259L7.36286 8.56848C7.36221 8.56916 7.36175 8.56999 7.36152 8.57089C7.36133 8.5715 7.36133 8.57216 7.36152 8.57277V8.5733C7.36197 8.57392 7.36251 8.57446 7.36313 8.57491L10.7879 12L7.36286 15.4248C7.36152 15.4259 7.36125 15.4264 7.36125 15.427C7.36106 15.4276 7.36106 15.4282 7.36125 15.4288C7.36125 15.4296 7.36152 15.4302 7.36259 15.4312L8.56848 16.6371C8.56916 16.6378 8.56999 16.6383 8.57089 16.6385C8.5715 16.6387 8.57216 16.6387 8.57277 16.6385C8.5733 16.6385 8.57384 16.6382 8.57491 16.6371L12 13.2121L15.4248 16.6371C15.4259 16.6382 15.4264 16.6385 15.427 16.6385C15.4276 16.6387 15.4282 16.6387 15.4288 16.6385C15.4296 16.6385 15.4302 16.6382 15.4312 16.6371L16.6371 15.4312C16.6378 15.4306 16.6383 15.4297 16.6385 15.4288C16.6387 15.4282 16.6387 15.4276 16.6385 15.427V15.4264C16.6381 15.4258 16.6377 15.4253 16.6371 15.4248L13.2121 12L16.6371 8.57518C16.6382 8.57411 16.6385 8.57357 16.6385 8.57304C16.6387 8.57242 16.6387 8.57177 16.6385 8.57116C16.6385 8.57036 16.6382 8.56982 16.6371 8.56875L15.4312 7.36286C15.4306 7.36221 15.4297 7.36175 15.4288 7.36152C15.4282 7.36133 15.4276 7.36133 15.427 7.36152L15.428 7.36125Z\"\n [attr.fill]=\"color\" />\n</svg>\n", styles: [""], changeDetection: i0.ChangeDetectionStrategy.OnPush });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: StatusErrorComponent, decorators: [{
type: Component,
args: [{ selector: 'cardinal-status-error', imports: [], changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, template: "<svg\n width=\"24\"\n height=\"24\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M12 0C18.6268 0 24 5.37321 24 12C24 18.6268 18.6268 24 12 24C5.37321 24 0 18.6268 0 12C0 5.37321 5.37321 0 12 0ZM15.428 7.36125H15.427L15.4248 7.36286L12 10.7879L8.57518 7.36286C8.57411 7.36152 8.57357 7.36125 8.57304 7.36125C8.57242 7.36106 8.57177 7.36106 8.57116 7.36125C8.57036 7.36125 8.56982 7.36152 8.56875 7.36259L7.36286 8.56848C7.36221 8.56916 7.36175 8.56999 7.36152 8.57089C7.36133 8.5715 7.36133 8.57216 7.36152 8.57277V8.5733C7.36197 8.57392 7.36251 8.57446 7.36313 8.57491L10.7879 12L7.36286 15.4248C7.36152 15.4259 7.36125 15.4264 7.36125 15.427C7.36106 15.4276 7.36106 15.4282 7.36125 15.4288C7.36125 15.4296 7.36152 15.4302 7.36259 15.4312L8.56848 16.6371C8.56916 16.6378 8.56999 16.6383 8.57089 16.6385C8.5715 16.6387 8.57216 16.6387 8.57277 16.6385C8.5733 16.6385 8.57384 16.6382 8.57491 16.6371L12 13.2121L15.4248 16.6371C15.4259 16.6382 15.4264 16.6385 15.427 16.6385C15.4276 16.6387 15.4282 16.6387 15.4288 16.6385C15.4296 16.6385 15.4302 16.6382 15.4312 16.6371L16.6371 15.4312C16.6378 15.4306 16.6383 15.4297 16.6385 15.4288C16.6387 15.4282 16.6387 15.4276 16.6385 15.427V15.4264C16.6381 15.4258 16.6377 15.4253 16.6371 15.4248L13.2121 12L16.6371 8.57518C16.6382 8.57411 16.6385 8.57357 16.6385 8.57304C16.6387 8.57242 16.6387 8.57177 16.6385 8.57116C16.6385 8.57036 16.6382 8.56982 16.6371 8.56875L15.4312 7.36286C15.4306 7.36221 15.4297 7.36175 15.4288 7.36152C15.4282 7.36133 15.4276 7.36133 15.427 7.36152L15.428 7.36125Z\"\n [attr.fill]=\"color\" />\n</svg>\n" }]
}], propDecorators: { color: [{
type: Input,
args: [{ required: true }]
}] } });
class CertificateStatusComponent {
status;
title;
description;
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: CertificateStatusComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: CertificateStatusComponent, isStandalone: true, selector: "cardinal-certificate-status", inputs: { status: "status", title: "title", description: "description" }, ngImport: i0, template: "<div\n class=\"status\"\n [class.success]=\"status === 'success'\"\n [class.error]=\"status === 'error'\">\n <div class=\"status__heading\">\n <cardinal-status-success [color]=\"'#52C41A'\" *ngIf=\"status === 'success'\" />\n <cardinal-status-error [color]=\"'#FF4D4F'\" *ngIf=\"status === 'error'\" />\n\n <h4>{{ title }}</h4>\n </div>\n <p>{{ description }}</p>\n</div>\n", styles: ["*{margin:0;padding:0;font-size:100%;box-sizing:border-box;font-family:Inter Variable,sans-serif}a{text-decoration:none}a:active,a:hover{outline:0}ul,li{list-style-type:none;margin:0;padding:0}h1,h2,h3,h4,h5,h6{font-size:100%}html,body{box-sizing:border-box;font-size:16px;background-color:#fbfdff}*,*:before,*:after{box-sizing:border-box}:focus{outline:0}img,audio,video{max-width:100%;height:auto}iframe{border:0}textarea{resize:none;overflow:auto;vertical-align:top;box-shadow:none;-webkit-box-shadow:none;-moz-box-shadow:none}input,textarea,select,button{outline:none;border:none;font-size:100%;margin:0}button,input{line-height:normal}input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,textarea:-webkit-autofill,textarea:-webkit-autofill:hover,textarea:-webkit-autofill:focus,select:-webkit-autofill,select:-webkit-autofill:hover,select:-webkit-autofill:focus{-webkit-text-fill-color:rgb(0,0,0);transition:background-color 5000s ease-in-out 0s}table{border-collapse:collapse;border-spacing:0}td,th{padding:0;text-align:left}.status{width:100%;display:flex;padding:20px 24px;flex-direction:column;align-items:flex-start;gap:6px;align-self:stretch;border-radius:12px;border:1px solid white}.status__heading{display:flex;align-items:center;gap:10px;align-self:stretch}.status h4{color:#1d2235;font-size:16px;font-style:normal;font-weight:400;line-height:24px}.status p{color:#1d2235;font-size:14px;font-style:normal;font-weight:400;line-height:22px}.status.success{border-color:#b7eb8f;background:#f6ffed}.status.error{border-color:#ffccc7;background:#fff1f0}\n"], dependencies: [{ kind: "component", type: StatusSuccessComponent, selector: "cardinal-status-success", inputs: ["color"] }, { kind: "component", type: StatusErrorComponent, selector: "cardinal-status-error", inputs: ["color"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: CertificateStatusComponent, decorators: [{
type: Component,
args: [{ selector: 'cardinal-certificate-status', imports: [StatusSuccessComponent, StatusErrorComponent, NgIf], changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, template: "<div\n class=\"status\"\n [class.success]=\"status === 'success'\"\n [class.error]=\"status === 'error'\">\n <div class=\"status__heading\">\n <cardinal-status-success [color]=\"'#52C41A'\" *ngIf=\"status === 'success'\" />\n <cardinal-status-error [color]=\"'#FF4D4F'\" *ngIf=\"status === 'error'\" />\n\n <h4>{{ title }}</h4>\n </div>\n <p>{{ description }}</p>\n</div>\n", styles: ["*{margin:0;padding:0;font-size:100%;box-sizing:border-box;font-family:Inter Variable,sans-serif}a{text-decoration:none}a:active,a:hover{outline:0}ul,li{list-style-type:none;margin:0;padding:0}h1,h2,h3,h4,h5,h6{font-size:100%}html,body{box-sizing:border-box;font-size:16px;background-color:#fbfdff}*,*:before,*:after{box-sizing:border-box}:focus{outline:0}img,audio,video{max-width:100%;height:auto}iframe{border:0}textarea{resize:none;overflow:auto;vertical-align:top;box-shadow:none;-webkit-box-shadow:none;-moz-box-shadow:none}input,textarea,select,button{outline:none;border:none;font-size:100%;margin:0}button,input{line-height:normal}input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,textarea:-webkit-autofill,textarea:-webkit-autofill:hover,textarea:-webkit-autofill:focus,select:-webkit-autofill,select:-webkit-autofill:hover,select:-webkit-autofill:focus{-webkit-text-fill-color:rgb(0,0,0);transition:background-color 5000s ease-in-out 0s}table{border-collapse:collapse;border-spacing:0}td,th{padding:0;text-align:left}.status{width:100%;display:flex;padding:20px 24px;flex-direction:column;align-items:flex-start;gap:6px;align-self:stretch;border-radius:12px;border:1px solid white}.status__heading{display:flex;align-items:center;gap:10px;align-self:stretch}.status h4{color:#1d2235;font-size:16px;font-style:normal;font-weight:400;line-height:24px}.status p{color:#1d2235;font-size:14px;font-style:normal;font-weight:400;line-height:22px}.status.success{border-color:#b7eb8f;background:#f6ffed}.status.error{border-color:#ffccc7;background:#fff1f0}\n"] }]
}], propDecorators: { status: [{
type: Input,
args: [{ required: true }]
}], title: [{
type: Input,
args: [{ required: true }]
}], description: [{
type: Input,
args: [{ required: true }]
}] } });
class TextInputComponent {
cdr;
label;
id;
type = 'text';
required = false;
autofocus = false;
disabled = false;
min;
max;
accept;
errorMessage;
inputRef;
value = '';
constructor(cdr) {
this.cdr = cdr;
}
onChange = (_) => { };
onTouched = () => { };
writeValue(value) {
this.value = value;
this.cdr.markForCheck();
}
registerOnChange(fn) {
this.onChange = fn;
}
registerOnTouched(fn) {
this.onTouched = fn;
}
setDisabledState(isDisabled) {
this.disabled = isDisabled;
this.cdr.markForCheck(); // ensures view reflects disabled state
}
ngAfterViewInit() {
if (this.autofocus) {
setTimeout(() => this.inputRef.nativeElement.focus());
this.cdr.markForCheck(); // triggers a re-render
}
}
onInputChange(event) {
const target = event.target;
this.value = target.value;
this.onChange(this.value);
this.onTouched();
this.cdr.markForCheck();
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: TextInputComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: TextInputComponent, isStandalone: true, selector: "cardinal-text-input", inputs: { label: "label", id: "id", type: "type", required: "required", autofocus: "autofocus", disabled: "disabled", min: "min", max: "max", accept: "accept", errorMessage: "errorMessage" }, providers: [
{
provide: NG_VALUE_ACCESSOR,
useExisting: forwardRef(() => TextInputComponent),
multi: true,
},
], viewQueries: [{ propertyName: "inputRef", first: true, predicate: ["inputRef"], descendants: true }], ngImport: i0, template: "<div class=\"textInput\">\n <label [for]=\"id\" [ngClass]=\"{ required: required, error: errorMessage }\">\n <span *ngIf=\"required\">*</span>{{ label }}\n </label>\n\n <input\n #inputRef\n [id]=\"id\"\n [name]=\"id\"\n [type]=\"type\"\n [placeholder]=\"label\"\n [disabled]=\"disabled ?? false\"\n [attr.min]=\"min\"\n [attr.max]=\"max\"\n [attr.accept]=\"accept\"\n [ngClass]=\"{ disabled: disabled, error: errorMessage }\"\n [(ngModel)]=\"value\"\n (input)=\"onInputChange($event)\"\n autocomplete=\"off\" />\n\n <p class=\"textInput__error\" *ngIf=\"errorMessage\">\n {{ errorMessage }}\n </p>\n</div>\n", styles: ["*{margin:0;padding:0;font-size:100%;box-sizing:border-box;font-family:Inter Variable,sans-serif}a{text-decoration:none}a:active,a:hover{outline:0}ul,li{list-style-type:none;margin:0;padding:0}h1,h2,h3,h4,h5,h6{font-size:100%}html,body{box-sizing:border-box;font-size:16px;background-color:#fbfdff}*,*:before,*:after{box-sizing:border-box}:focus{outline:0}img,audio,video{max-width:100%;height:auto}iframe{border:0}textarea{resize:none;overflow:auto;vertical-align:top;box-shadow:none;-webkit-box-shadow:none;-moz-box-shadow:none}input,textarea,select,button{outline:none;border:none;font-size:100%;margin:0}button,input{line-height:normal}input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,textarea:-webkit-autofill,textarea:-webkit-autofill:hover,textarea:-webkit-autofill:focus,select:-webkit-autofill,select:-webkit-autofill:hover,select:-webkit-autofill:focus{-webkit-text-fill-color:rgb(0,0,0);transition:background-color 5000s ease-in-out 0s}table{border-collapse:collapse;border-spacing:0}td,th{padding:0;text-align:left}.textInput{width:100%;display:flex;flex-direction:column;align-items:flex-start;gap:4px;align-self:stretch}.textInput label{width:100%;display:flex;align-items:flex-start;gap:4px;color:#1d2235;font-size:14px;font-weight:500;line-height:22px;cursor:pointer}.textInput label span{display:none}.textInput label.required span{display:flex;color:red;font-weight:700}.textInput label.error{color:red}.textInput input{width:100%;display:flex;height:32px;padding:5px 12px;align-items:center;gap:4px;align-self:stretch;cursor:pointer;border-radius:6px;border:1px solid #cad0d5;background:#fff;color:#1d2235;font-family:Inter Variable,sans-serif;font-size:14px;font-weight:400;line-height:22px}.textInput input::placeholder{color:#9ca8b2}.textInput input:hover,.textInput input:focus{border-color:#084b83}.textInput input:focus{box-shadow:0 0 0 2px #3d87c533}.textInput input.disabled{cursor:not-allowed;background-color:#f5f5f5;border-color:#cad0d5;opacity:.7}.textInput input.disabled:hover{border-color:#cad0d5}.textInput input.error{border-color:red;box-shadow:0 0 0 2px #f003;color:red}.textInput input.error::placeholder{color:#ff000080}.textInput input::file-selector-button{border-radius:0;height:100%;cursor:pointer;background-color:#fff;border:none;border-right:1px solid rgba(0,0,0,.16);margin-right:16px;padding-right:12px;transition:background-color .2s}.textInput input.error::file-selector-button{color:#ff000080;border-color:red}.textInput__error{color:red;font-size:13px}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: TextInputComponent, decorators: [{
type: Component,
args: [{ selector: 'cardinal-text-input', providers: [
{
provide: NG_VALUE_ACCESSOR,
useExisting: forwardRef(() => TextInputComponent),
multi: true,
},
], standalone: true, imports: [NgClass, NgIf, FormsModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"textInput\">\n <label [for]=\"id\" [ngClass]=\"{ required: required, error: errorMessage }\">\n <span *ngIf=\"required\">*</span>{{ label }}\n </label>\n\n <input\n #inputRef\n [id]=\"id\"\n [name]=\"id\"\n [type]=\"type\"\n [placeholder]=\"label\"\n [disabled]=\"disabled ?? false\"\n [attr.min]=\"min\"\n [attr.max]=\"max\"\n [attr.accept]=\"accept\"\n [ngClass]=\"{ disabled: disabled, error: errorMessage }\"\n [(ngModel)]=\"value\"\n (input)=\"onInputChange($event)\"\n autocomplete=\"off\" />\n\n <p class=\"textInput__error\" *ngIf=\"errorMessage\">\n {{ errorMessage }}\n </p>\n</div>\n", styles: ["*{margin:0;padding:0;font-size:100%;box-sizing:border-box;font-family:Inter Variable,sans-serif}a{text-decoration:none}a:active,a:hover{outline:0}ul,li{list-style-type:none;margin:0;padding:0}h1,h2,h3,h4,h5,h6{font-size:100%}html,body{box-sizing:border-box;font-size:16px;background-color:#fbfdff}*,*:before,*:after{box-sizing:border-box}:focus{outline:0}img,audio,video{max-width:100%;height:auto}iframe{border:0}textarea{resize:none;overflow:auto;vertical-align:top;box-shadow:none;-webkit-box-shadow:none;-moz-box-shadow:none}input,textarea,select,button{outline:none;border:none;font-size:100%;margin:0}button,input{line-height:normal}input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,textarea:-webkit-autofill,textarea:-webkit-autofill:hover,textarea:-webkit-autofill:focus,select:-webkit-autofill,select:-webkit-autofill:hover,select:-webkit-autofill:focus{-webkit-text-fill-color:rgb(0,0,0);transition:background-color 5000s ease-in-out 0s}table{border-collapse:collapse;border-spacing:0}td,th{padding:0;text-align:left}.textInput{width:100%;display:flex;flex-direction:column;align-items:flex-start;gap:4px;align-self:stretch}.textInput label{width:100%;display:flex;align-items:flex-start;gap:4px;color:#1d2235;font-size:14px;font-weight:500;line-height:22px;cursor:pointer}.textInput label span{display:none}.textInput label.required span{display:flex;color:red;font-weight:700}.textInput label.error{color:red}.textInput input{width:100%;display:flex;height:32px;padding:5px 12px;align-items:center;gap:4px;align-self:stretch;cursor:pointer;border-radius:6px;border:1px solid #cad0d5;background:#fff;color:#1d2235;font-family:Inter Variable,sans-serif;font-size:14px;font-weight:400;line-height:22px}.textInput input::placeholder{color:#9ca8b2}.textInput input:hover,.textInput input:focus{border-color:#084b83}.textInput input:focus{box-shadow:0 0 0 2px #3d87c533}.textInput input.disabled{cursor:not-allowed;background-color:#f5f5f5;border-color:#cad0d5;opacity:.7}.textInput input.disabled:hover{border-color:#cad0d5}.textInput input.error{border-color:red;box-shadow:0 0 0 2px #f003;color:red}.textInput input.error::placeholder{color:#ff000080}.textInput input::file-selector-button{border-radius:0;height:100%;cursor:pointer;background-color:#fff;border:none;border-right:1px solid rgba(0,0,0,.16);margin-right:16px;padding-right:12px;transition:background-color .2s}.textInput input.error::file-selector-button{color:#ff000080;border-color:red}.textInput__error{color:red;font-size:13px}\n"] }]
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { label: [{
type: Input,
args: [{ required: true }]
}], id: [{
type: Input,
args: [{ required: true }]
}], type: [{
type: Input
}], required: [{
type: Input
}], autofocus: [{
type: Input
}], disabled: [{
type: Input
}], min: [{
type: Input
}], max: [{
type: Input
}], accept: [{
type: Input
}], errorMessage: [{
type: Input
}], inputRef: [{
type: ViewChild,
args: ['inputRef']
}] } });
class SpinnerIcnComponent {
color = 'currentColor';
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: SpinnerIcnComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: SpinnerIcnComponent, isStandalone: true, selector: "cardinal-spinner-icn", inputs: { color: "color" }, ngImport: i0, template: "<svg\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 100 100\"\n preserveAspectRatio=\"xMidYMid\"\n width=\"24\"\n height=\"24\"\n style=\"shape-rendering: auto; display: block; background: transparent\"\n xmlns:xlink=\"http://www.w3.org/1999/xlink\">\n <g>\n <circle\n stroke-dasharray=\"169.64600329384882 58.548667764616276\"\n r=\"36\"\n stroke-width=\"8\"\n [attr.stroke]=\"color\"\n fill=\"none\"\n cy=\"50\"\n cx=\"50\">\n <animateTransform\n keyTimes=\"0;1\"\n values=\"0 50 50;360 50 50\"\n dur=\"1s\"\n repeatCount=\"indefinite\"\n type=\"rotate\"\n attributeName=\"transform\"></animateTransform>\n </circle>\n <g></g>\n </g>\n <!-- [ldio] generated by https://loading.io -->\n</svg>\n", styles: [""], changeDetection: i0.ChangeDetectionStrategy.OnPush });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: SpinnerIcnComponent, decorators: [{
type: Component,
args: [{ selector: 'cardinal-spinner-icn', imports: [], changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, template: "<svg\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 100 100\"\n preserveAspectRatio=\"xMidYMid\"\n width=\"24\"\n height=\"24\"\n style=\"shape-rendering: auto; display: block; background: transparent\"\n xmlns:xlink=\"http://www.w3.org/1999/xlink\">\n <g>\n <circle\n stroke-dasharray=\"169.64600329384882 58.548667764616276\"\n r=\"36\"\n stroke-width=\"8\"\n [attr.stroke]=\"color\"\n fill=\"none\"\n cy=\"50\"\n cx=\"50\">\n <animateTransform\n keyTimes=\"0;1\"\n values=\"0 50 50;360 50 50\"\n dur=\"1s\"\n repeatCount=\"indefinite\"\n type=\"rotate\"\n attributeName=\"transform\"></animateTransform>\n </circle>\n <g></g>\n </g>\n <!-- [ldio] generated by https://loading.io -->\n</svg>\n" }]
}], propDecorators: { color: [{
type: Input,
args: [{ required: true }]
}] } });
class ButtonComponent {
view = 'primary';
type = 'button';
formId;
disabled = false;
handleClick = new EventEmitter();
onClick(evt) {
this.formId?.onSubmit(evt);
if (this.view !== 'withSpinner') {
this.handleClick.emit();
}
}
getSpinnerIcnColor() {
if (this.disabled) {
return '#B8B8B8';
}
else {
return '#084B83';
}
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: ButtonComponent, isStandalone: true, selector: "cardinal-button", inputs: { view: "view", type: "type", formId: "formId", disabled: "disabled" }, outputs: { handleClick: "handleClick" }, ngImport: i0, template: "<button\n [ngClass]=\"view\"\n [type]=\"type\"\n [disabled]=\"disabled\"\n (click)=\"onClick($event)\">\n <ng-container *ngIf=\"view === 'withSpinner'; else null\">\n <cardinal-spinner-icn [color]=\"getSpinnerIcnColor()\" />\n </ng-container>\n <ng-content />\n</button>\n", styles: ["*{margin:0;padding:0;font-size:100%;box-sizing:border-box;font-family:Inter Variable,sans-serif}a{text-decoration:none}a:active,a:hover{outline:0}ul,li{list-style-type:none;margin:0;padding:0}h1,h2,h3,h4,h5,h6{font-size:100%}html,body{box-sizing:border-box;font-size:16px;background-color:#fbfdff}*,*:before,*:after{box-sizing:border-box}:focus{outline:0}img,audio,video{max-width:100%;height:auto}iframe{border:0}textarea{resize:none;overflow:auto;vertical-align:top;box-shadow:none;-webkit-box-shadow:none;-moz-box-shadow:none}input,textarea,select,button{outline:none;border:none;font-size:100%;margin:0}button,input{line-height:normal}input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,textarea:-webkit-autofill,textarea:-webkit-autofill:hover,textarea:-webkit-autofill:focus,select:-webkit-autofill,select:-webkit-autofill:hover,select:-webkit-autofill:focus{-webkit-text-fill-color:rgb(0,0,0);transition:background-color 5000s ease-in-out 0s}table{border-collapse:collapse;border-spacing:0}td,th{padding:0;text-align:left}button{display:flex;height:32px;padding:0 16px;justify-content:center;align-items:center;border-radius:6px;font-size:14px;font-style:normal;font-weight:400;line-height:normal;border:1px solid #084b83;cursor:pointer;min-width:64px}button.primary{background:#084b83;color:#fff}button.primary:hover{opacity:.9}button.outlined{border-radius:6px;border-color:#cad0d5;background:#fcfcfd;color:#084b83}button.outlined:hover{border-color:#084b83}button.withSpinner{border-radius:6px;border-color:#cad0d5;background:#fcfcfd;color:#084b83;gap:8px}button[disabled],button[disabled]:hover{cursor:not-allowed;border-color:#cad0d5;background:#f5f5f5;color:#848482}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: SpinnerIcnComponent, selector: "cardinal-spinner-icn", inputs: ["color"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ButtonComponent, decorators: [{
type: Component,
args: [{ selector: 'cardinal-button', standalone: true, imports: [CommonModule, SpinnerIcnComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<button\n [ngClass]=\"view\"\n [type]=\"type\"\n [disabled]=\"disabled\"\n (click)=\"onClick($event)\">\n <ng-container *ngIf=\"view === 'withSpinner'; else null\">\n <cardinal-spinner-icn [color]=\"getSpinnerIcnColor()\" />\n </ng-container>\n <ng-content />\n</button>\n", styles: ["*{margin:0;padding:0;font-size:100%;box-sizing:border-box;font-family:Inter Variable,sans-serif}a{text-decoration:none}a:active,a:hover{outline:0}ul,li{list-style-type:none;margin:0;padding:0}h1,h2,h3,h4,h5,h6{font-size:100%}html,body{box-sizing:border-box;font-size:16px;background-color:#fbfdff}*,*:before,*:after{box-sizing:border-box}:focus{outline:0}img,audio,video{max-width:100%;height:auto}iframe{border:0}textarea{resize:none;overflow:auto;vertical-align:top;box-shadow:none;-webkit-box-shadow:none;-moz-box-shadow:none}input,textarea,select,button{outline:none;border:none;font-size:100%;margin:0}button,input{line-height:normal}input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,textarea:-webkit-autofill,textarea:-webkit-autofill:hover,textarea:-webkit-autofill:focus,select:-webkit-autofill,select:-webkit-autofill:hover,select:-webkit-autofill:focus{-webkit-text-fill-color:rgb(0,0,0);transition:background-color 5000s ease-in-out 0s}table{border-collapse:collapse;border-spacing:0}td,th{padding:0;text-align:left}button{display:flex;height:32px;padding:0 16px;justify-content:center;align-items:center;border-radius:6px;font-size:14px;font-style:normal;font-weight:400;line-height:normal;border:1px solid #084b83;cursor:pointer;min-width:64px}button.primary{background:#084b83;color:#fff}button.primary:hover{opacity:.9}button.outlined{border-radius:6px;border-color:#cad0d5;background:#fcfcfd;color:#084b83}button.outlined:hover{border-color:#084b83}button.withSpinner{border-radius:6px;border-color:#cad0d5;background:#fcfcfd;color:#084b83;gap:8px}button[disabled],button[disabled]:hover{cursor:not-allowed;border-color:#cad0d5;background:#f5f5f5;color:#848482}\n"] }]
}], propDecorators: { view: [{
type: Input
}], type: [{
type: Input
}], formId: [{
type: Input
}], disabled: [{
type: Input
}], handleClick: [{
type: Output
}] } });
class UploadPractitionerCertificateService {
// Open IndexedDB database
async openCertificatesDatabase() {
return new Promise((resolve, reject) => {
const request = indexedDB.open('CertificateStore', 1);
request.onupgradeneeded = event => {
const database = event.target.result;
database.createObjectStore('certificates', { keyPath: 'id' });
};
request.onsuccess = () => resolve(request.result);
request.onerror = () => reject(request.error);
});
}
// Load certificate information from IndexedDB
async loadCertificateInformation(db, id) {
const transaction = db.transaction('certificates', 'readonly');
const store = transaction.objectStore('certificates');
const request = store.get(id);
const record = await new Promise((resolve, reject) => {
request.onsuccess = () => resolve(request.result);
request.onerror = () => reject(request.error);
});
if (!record) {
throw new Error('Record not found');
}
return {
salt: new Uint8Array(record.salt).buffer,
iv: new Uint8Array(record.iv).buffer,
encryptedCertificate: new Uint8Array(record.encryptedCertificate).buffer,
};
}
// Load and decrypt certificate using password
async loadAndDecryptCertificate(password, id) {
const db = await this.openCertificatesDatabase();
if (!db) {
console.error('Database not initialized');
return undefined;
}
const { salt, iv, encryptedCertificate } = await this.loadCertificateInformation(db, id);
// Derive a key from the password using PBKDF2
const passwordKey = await crypto.subtle.importKey('raw', new TextEncoder().encode(password), { name: 'PBKDF2' }, false, ['deriveKey']);
const decryptionKey = await crypto.subtle.deriveKey({
name: 'PBKDF2',
salt: new Uint8Array(salt),
iterations: 100000,
hash: 'SHA-256',
}, passwordKey, { name: 'AES-GCM', length: 256 }, false, ['decrypt']);
// Decrypt the certificate
return await crypto.subtle.decrypt({ name: 'AES-GCM', iv: new Uint8Array(iv) }, decryptionKey, new Uint8Array(encryptedCertificate));
}
// Upload and encrypt certificate to IndexedDB
async uploadAndEncrypt(db, id, passphrase, certificate) {
const salt = crypto.getRandomValues(new Uint8Array(16));
const iv = crypto.getRandomValues(new Uint8Array(12));
// Derive a key from the password using PBKDF2
const passwordKey = await crypto.subtle.importKey('raw', new TextEncoder().encode(passphrase), { name: 'PBKDF2' }, false, ['deriveKey']);
const encryptionKey = await crypto.subtle.deriveKey({
name: 'PBKDF2',
salt,
iterations: 100000,
hash: 'SHA-256',
}, passwordKey, { name: 'AES-GCM', length: 256 }, false, ['encrypt']);
return new Promise(async (resolve, reject) => {
try {
// Ensure the database is available
if (!db) {
console.error('IndexedDB instance is not available.');
}
// Encrypt the certificate (outside the transaction to avoid delays)
const encryptedCertificate = await crypto.subtle.encrypt({ name: 'AES-GCM', iv }, encryptionKey, certificate);
// Start a transaction
const transaction = db.transaction('certificates', 'readwrite');
const store = transaction.objectStore('certificates');
// Convert the encrypted certificate and other data to a storable format
const record = {
id: id,
salt: Array.from(salt), // Convert TypedArray to a normal array
iv: Array.from(iv),
encryptedCertificate: Array.from(new Uint8Array(encryptedCertificate)), // Convert ArrayBuffer to an array
};
// Use a single transaction to perform all operations
const request = store.get(id);
request.onsuccess = () => {
if (request.result) {
// Update the existing record
const putRequest = store.put(record);
putRequest.onsuccess = () => {
console.log(`Record with ID ${id} successfully updated.`);
resolve(id);
};
putRequest.onerror = () => {
console.error(`Error updating record with ID ${id}:`, putRequest.error);
reject(putRequest.error);
};
}
else {
// Add a new record
const addRequest = store.add(record);
addRequest.onsuccess = () => {
console.log(`Record with ID ${id} successfully added.`);
resolve(id);
};
addRequest.onerror = () => {
console.error(`Error adding record with ID ${id}:`, addRequest.error);
reject(addRequest.error);
};
}
};
request.onerror = () => {
console.error(`Error retrieving record with ID ${id}:`, request.error);
reject(request.error);
};
// Transaction completion handlers
transaction.oncomplete = () => {
console.log('Transaction completed successfully.');
};
transaction.onerror = () => {
console.error('Transaction failed:', transaction.error);
};
transaction.onabort = () => {
console.error('Transaction aborted.');
};
}
catch (error) {
console.error('An error occurred:', error);
}
});
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: UploadPractitionerCertificateService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: UploadPractitionerCertificateService, providedIn: 'root' });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: UploadPractitionerCertificateService, decorators: [{
type: Injectable,
args: [{
providedIn: 'root',
}]
}] });
class CertificateUploadComponent {
certificateService;
fb;
translationService;
cdr;
hcp;
onUploadCertificate = new EventEmitter();
constructor(certificateService, fb, translationService, cdr) {
this.certificateService = certificateService;
this.fb = fb;
this.translationService = translationService;
this.cdr = cdr;
}
t(key) {
return this.translationService.translate(key);
}
password = '';
certificateFile = null;
db;
uploadCertificateForm;
certificateUploaded = false;
certificateAvailabilityFeedback;
// Initialize IndexedDB
ngOnInit() {
this.buildFeedback();
this.certificateService.openCertificatesDatabase().then(async (db) => {
this.db = db;
try {
if (!this.hcp.ssin)
return;
const stored = await this.certificateService.loadCertificateInformation(db, this.hcp.ssin);
this.certificateUploaded = !!stored;
}
catch {
this.certificateUploaded = false;
}
this.uploadCertificateForm = this.fb.group({
certificateFile: [
{ value: null, disabled: false },
this.certificateUploaded ? [] : [Validators.required],
],
certificatePassword: ['', Validators.required],
});
this.cdr.markForCheck();
});
}
getErrorMessage(fieldName) {
const control = this.uploadCertificateForm.get(fieldName);
if (!this.uploadCertificateForm.dirty ||
!control?.touched ||
control?.valid ||
control?.disabled)
return undefined;
if (control.errors?.['required'])
return this.t('practitioner.certificateUpload.errorRequired');
return this.t('practitioner.certificateUpload.errorInvalid');
}
// Handle form submission
async handleFormSubmit() {
if (this.certificateFile !== null && !!this.db) {
const certificateData = await this.readFileAsArrayBuffer(this.certificateFile);
await this.certificateService.uploadAndEncrypt(this.db, this.certificateFile.name.split('=')[1].split(' ')[0], this.password, certificateData);
}
this.onUploadCertificate.emit(this.password);
}
async onSubmit() {
if (this.uploadCertificateForm.invalid) {
this.uploadCertificateForm.markAllAsTouched();
return;
}
if (this.uploadCertificateForm.valid) {
const formValues = this.uploadCertificateForm.value;
this.password = formValues.certificatePassword;
await this.handleFormSubmit();
// ✅ Clean reset without validation flicker
this.uploadCertificateForm.reset({
certificateFile: null,
certificatePassword: '',
});
this.uploadCertificateForm.markAsPristine();
this.uploadCertificateForm.markAsUntouched();
}
this.cdr.markForCheck();
}
buildFeedback() {
this.certificateAvailabilityFeedback = {
passwordMissing: {
title: this.t('practitioner.certificateUpload.passwordMissingTitle'),
description: this.t('practitioner.certificateUpload.passwordMissingDescription'),
},
};
this.cdr.markForCheck();
}
onUploadedAnotherCertificate() {
this.uploadCertificateForm.reset();
this.certificateUploaded = false;
this.cdr.markForCheck();
}
// Handle file input change
handleFileChange(event) {
const target = event.target;
this.certificateFile = target.files ? target.files[0] : null;
this.cdr.markForCheck();
}
// Read the file as ArrayBuffer
readFileAsArrayBuffer(file) {
return new Promise((resolve, reject) => {
const reader = new FileReader();
reader.onload = () => resolve(reader.result);
reader.onerror = () => reject(reader.error);
reader.readAsArrayBuffer(file);
});
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: CertificateUploadComponent, deps: [{ token: UploadPractitionerCertificateService }, { token: i1.NonNullableFormBuilder }, { token: TranslationService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: CertificateUploadComponent, isStandalone: true, selector: "cardinal-certificate-upload", inputs: { hcp: "hcp" }, outputs: { onUploadCertificate: "onUploadCertificate" }, ngImport: i0, template: "<div class=\"uploadCertificateWrap\">\n <cardinal-certificate-status\n *ngIf=\"certificateUploaded\"\n [status]=\"'error'\"\n [title]=\"certificateAvailabilityFeedback?.passwordMissing?.title ?? ''\"\n [description]=\"\n certificateAvailabilityFeedback?.passwordMissing?.description ?? ''\n \" />\n\n <form\n *ngIf=\"uploadCertificateForm\"\n class=\"uploadCertificate\"\n id=\"uploadCertificateForm\"\n (ngSubmit)=\"onSubmit()\"\n [formGroup]=\"uploadCertificateForm\">\n <h3>\n {{\n !certificateUploaded\n ? t('practitioner.certificateUpload.titleUpload')\n : t('practitioner.certificateUpload.titlePassword')\n }}\n </h3>\n <div class=\"uploadCertificate__inputs\">\n <cardinal-text-input\n *ngIf=\"!certificateUploaded\"\n [label]=\"t('practitioner.certificateUpload.fileLabel')\"\n [id]=\"'certificateFile'\"\n [type]=\"'file'\"\n [required]=\"true\"\n [accept]=\"'.p12,.acc-p12'\"\n formControlName=\"certificateFile\"\n (change)=\"handleFileChange($event)\"\n [errorMessage]=\"getErrorMessage('certificateFile')\" />\n\n <cardinal-text-input\n [label]=\"t('practitioner.certificateUpload.passwordLabel')\"\n [id]=\"'certificatePassword'\"\n [type]=\"'password'\"\n [required]=\"true\"\n formControlName=\"certificatePassword\"\n [errorMessage]=\"getErrorMessage('certificatePassword')\" />\n </div>\n\n <cardinal-button\n [type]=\"'submit'\"\n (handleClick)=\"onSubmit()\"\n [view]=\"'primary'\">\n {{\n !certificateUploaded\n ? t('practitioner.certificateUpload.submitButtonUpload')\n : t('practitioner.certificateUpload.submitButtonPassword')\n }}\n </cardinal-button>\n </form>\n <cardinal-button\n *ngIf=\"certificateUploaded\"\n [type]=\"'reset'\"\n (handleClick)=\"onUploadedAnotherCertificate()\"\n [view]=\"'outlined'\">\n {{ t('practitioner.certificateUpload.resetButton') }}\n </cardinal-button>\n</div>\n", styles: ["*{margin:0;padding:0;font-size:100%;box-sizing:border-box;font-family:Inter Variable,sans-serif}a{text-decoration:none}a:active,a:hover{outline:0}ul,li{list-style-type:none;margin:0;padding:0}h1,h2,h3,h4,h5,h6{font-size:100%}html,body{box-sizing:border-box;font-size:16px;background-color:#fbfdff}*,*:before,*:after{box-sizing:border-box}:focus{outline:0}img,audio,video{max-width:100%;height:auto}iframe{border:0}textarea{resize:none;overflow:auto;vertical-align:top;box-shadow:none;-webkit-box-shadow:none;-moz-box-shadow:none}input,textarea,select,button{outline:none;border:none;font-size:100%;margin:0}button,input{line-height:normal}input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,textarea:-webkit-autofill,textarea:-webkit-autofill:hover,textarea:-webkit-autofill:focus,select:-webkit-autofill,select:-webkit-autofill:hover,select:-webkit-autofill:focus{-webkit-text-fill-color:rgb(0,0,0);transition:background-color 5000s ease-in-out 0s}table{border-collapse:collapse;border-spacing:0}td,th{padding:0;text-align:left}.uploadCertificateWrap{width:100%;display:flex;flex-direction:column;align-items:flex-start;align-self:stretch;gap:12px}.uploadCertificate{width:100%;display:flex;flex-direction:column;align-items:flex-start;align-self:stretch;border-radius:12px;border:1px solid #e4e4e7;background:#fff;padding:24px;gap:12px}@media only screen and (max-width: 992px){.uploadCertificate{padding:18px}}.uploadCertificate h3{color:#1d2235;font-size:16px;font-style:normal;font-weight:700;line-height:normal}.uploadCertificate__inputs{width:100%;display:flex;flex-direction:column;align-items:flex-start;align-self:stretch;gap:12px}.uploadCertificate__inputs cardinal-text-input,.uploadCertificate__inputs cardinal-select-input,.uploadCertificate__inputs cardinal-textarea-input{flex:1 1 0;width:100%;min-width:0}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: TextInputComponent, selector: "cardinal-text-input", inputs: ["label", "id", "type", "required", "autofocus", "disabled", "min", "max", "accept", "errorMessage"] }, { kind: "component", type: ButtonComponent, selector: "cardinal-button", inputs: ["view", "type", "formId", "disabled"], outputs: ["handleClick"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: CertificateStatusComponent, selector: "cardinal-certificate-status", inputs: ["status", "title", "description"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: CertificateUploadComponent, decorators: [{
type: Component,
args: [{ selector: 'cardinal-certificate-upload', imports: [
FormsModule,
ReactiveFormsModule,
TextInputComponent,
ButtonComponent,
NgIf,
CertificateStatusComponent,
], changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, template: "<div class=\"uploadCertificateWrap\">\n <cardinal-certificate-status\n *ngIf=\"certificateUploaded\"\n [status]=\"'error'\"\n [title]=\"certificateAvailabilityFeedback?.passwordMissing?.title ?? ''\"\n [description]=\"\n certificateAvailabilityFeedback?.passwordMissing?.description ?? ''\n \" />\n\n <form\n *ngIf=\"uploadCertificateForm\"\n class=\"uploadCertificate\"\n id=\"uploadCertificateForm\"\n (ngSubmit)=\"onSubmit()\"\n [formGroup]=\"uploadCertificateForm\">\n <h3>\n {{\n !certificateUploaded\n ? t('practitioner.certificateUpload.titleUpload')\n : t('practitioner.certificateUpload.titlePassword')\n }}\n </h3>\n <div class=\"uploadCertificate__inputs\">\n <cardinal-text-input\n *ngIf=\"!certificateUploaded\"\n [label]=\"t('practitioner.certificateUpload.fileLabel')\"\n [id]=\"'certificateFile'\"\n [type]=\"'file'\"\n [required]=\"true\"\n [accept]=\"'.p12,.acc-p12'\"\n formControlName=\"certificateFile\"\n (change)=\"handleFileChange($event)\"\n [errorMessage]=\"getErrorMessage('certificateFile')\" />\n\n <cardinal-text-input\n [label]=\"t('practitioner.certificateUpload.passwordLabel')\"\n [id]=\"'certificatePassword'\"\n [type]=\"'password'\"\n [required]=\"true\"\n formControlName=\"certificatePassword\"\n [errorMessage]=\"getErrorMessage('certificatePassword')\" />\n </div>\n\n <cardinal-button\n [type]=\"'submit'\"\n (handleClick)=\"onSubmit()\"\n [view]=\"'primary'\">\n {{\n !certificateUploaded\n ? t('practitioner.certificateUpload.submitButtonUpload')\n : t('practitioner.certificateUpload.submitButtonPassword')\n }}\n </cardinal-button>\n </form>\n <cardinal-button\n *ngIf=\"certificateUploaded\"\n [type]=\"'reset'\"\n (handleClick)=\"onUploadedAnotherCertificate()\"\n [view]=\"'outlined'\">\n {{ t('practitioner.certificateUpload.resetButton') }}\n </cardinal-button>\n</div>\n", styles: ["*{margin:0;padding:0;font-size:100%;box-sizing:border-box;font-family:Inter Variable,sans-serif}a{text-decoration:none}a:active,a:hover{outline:0}ul,li{list-style-type:none;margin:0;padding:0}h1,h2,h3,h4,h5,h6{font-size:100%}html,body{box-sizing:border-box;font-size:16px;background-color:#fbfdff}*,*:before,*:after{box-sizing:border-box}:focus{outline:0}img,audio,video{max-width:100%;height:auto}iframe{border:0}textarea{resize:none;overflow:auto;vertical-align:top;box-shadow:none;-webkit-box-shadow:none;-moz-box-shadow:none}input,textarea,select,button{outline:none;border:none;font-size:100%;margin:0}button,input{line-height:normal}input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,textarea:-webkit-autofill,textarea:-webkit-autofill:hover,textarea:-webkit-autofill:focus,select:-webkit-autofill,select:-webkit-autofill:hover,select:-webkit-autofill:focus{-webkit-text-fill-color:rgb(0,0,0);transition:background-color 5000s ease-in-out 0s}table{border-collapse:collapse;border-spacing:0}td,th{padding:0;text-align:left}.uploadCertificateWrap{width:100%;display:flex;flex-direction:column;align-items:flex-start;align-self:stretch;gap:12px}.uploadCertificate{width:100%;display:flex;flex-direction:column;align-items:flex-start;align-self:stretch;border-radius:12px;border:1px solid #e4e4e7;background:#fff;padding:24px;gap:12px}@media only screen and (max-width: 992px){.uploadCertificate{padding:18px}}.uploadCertificate h3{color:#1d2235;font-size:16px;font-style:normal;font-weight:700;line-height:normal}.uploadCertificate__inputs{width:100%;display:flex;flex-direction:column;align-items:flex-start;align-self:stretch;gap:12px}.uploadCertificate__inputs cardinal-text-input,.uploadCertificate__inputs cardinal-select-input,.uploadCertificate__inputs cardinal-textarea-input{flex:1 1 0;width:100%;min-width:0}\n"] }]
}], ctorParameters: () => [{ type: UploadPractitionerCertificateService }, { type: i1.NonNullableFormBuilder }, { type: TranslationService }, { type: i0.ChangeDetectorRef }], propDecorators: { hcp: [{
type: Input,
args: [{ required: true }]
}], onUploadCertificate: [{
type: Output
}] } });
class PractitionerCertificateComponent {
translationService;
hcp;
certificateValid = false;
certificateUploaded = false;
errorWhileVerifyingCertificate = undefined;
onUploadCertificate = new EventEmitter();
constructor(translationService) {
this.translationService = translationService;
}
t(key) {
return this.translationService.translate(key);
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: PractitionerCertificateComponent, deps: [{ token: TranslationService }], target: i0.ɵɵFactoryTarget.Component });
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: PractitionerCertificateComponent, isStandalone: true, selector: "cardinal-practitioner-certificate", inputs: { hcp: "hcp", certificateValid: "certificateValid", certificateUploaded: "certificateUploaded", errorWhileVerifyingCertificate: "errorWhileVerifyingCertificate" }, outputs: { onUploadCertificate: "onUploadCertificate" }, ngImport: i0, template: "<div class=\"certificate\">\n <cardinal-certificate-status\n *ngIf=\"certificateValid && !errorWhileVerifyingCertificate\"\n [status]=\"'success'\"\n [title]=\"t('practitioner.certificateFeedback.successTitle')\"\n [description]=\"t('practitioner.certificateFeedback.successDescription')\" />\n\n <cardinal-certificate-status\n *ngIf=\"!certificateValid && !certificateUploaded\"\n [status]=\"'error'\"\n [title]=\"t('practitioner.certificateFeedback.failureTitle')\"\n [description]=\"t('practitioner.certificateFeedback.failureDescription')\" />\n\n <cardinal-certificate-status\n *ngIf=\"errorWhileVerifyingCertificate\"\n [status]=\"'error'\"\n [title]=\"t('practitioner.certificateFeedback.verificationErrorTitle')\"\n [description]=\"errorWhileVerifyingCertificate\" />\n\n <cardinal-certificate-upload\n [hcp]=\"hcp\"\n *ngIf=\"!certificateValid || !certificateUploaded\"\n (onUploadCertificate)=\"onUploadCertificate.emit($event)\" />\n</div>\n", styles: ["*{margin:0;padding:0;font-size:100%;box-sizing:border-box;font-family:Inter Variable,sans-serif}a{text-decoration:none}a:active,a:hover{outline:0}ul,li{list-style-type:none;margin:0;padding:0}h1,h2,h3,h4,h5,h6{font-size:100%}html,body{box-sizing:border-box;font-size:16px;background-color:#fbfdff}*,*:before,*:after{box-sizing:border-box}:focus{outline:0}img,audio,video{max-width:100%;height:auto}iframe{border:0}textarea{resize:none;overflow:auto;vertical-align:top;box-shadow:none;-webkit-box-shadow:none;-moz-box-shadow:none}input,textarea,select,button{outline:none;border:none;font-size:100%;margin:0}button,input{line-height:normal}input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,textarea:-webkit-autofill,textarea:-webkit-autofill:hover,textarea:-webkit-autofill:focus,select:-webkit-autofill,select:-webkit-autofill:hover,select:-webkit-autofill:focus{-webkit-text-fill-color:rgb(0,0,0);transition:background-color 5000s ease-in-out 0s}table{border-collapse:collapse;border-spacing:0}td,th{padding:0;text-align:left}.certificate{width:50%;min-width:700px;display:flex;flex-direction:column;gap:12px}@media only screen and (max-width: 768px){.certificate{width:100%;min-width:100%}}\n"], dependencies: [{ kind: "component", type: CertificateStatusComponent, selector: "cardinal-certificate-status", inputs: ["status", "title", "description"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: CertificateUploadComponent, selector: "cardinal-certificate-upload", inputs: ["hcp"], outputs: ["onUploadCertificate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: PractitionerCertificateComponent, decorators: [{
type: Component,
args: [{ selector: 'cardinal-practitioner-certificate', standalone: true, imports: [CertificateStatusComponent, NgIf, CertificateUploadComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"certificate\">\n <cardinal-certificate-status\n *ngIf=\"certificateValid && !errorWhileVerifyingCertificate\"\n [status]=\"'success'\"\n [title]=\"t('practitioner.certificateFeedback.successTitle')\"\n [description]=\"t('practitioner.certificateFeedback.successDescription')\" />\n\n <cardinal-certificate-status\n *ngIf=\"!certificateValid && !certificateUploaded\"\n [status]=\"'error'\"\n [title]=\"t('practitioner.certificateFeedback.failureTitle')\"\n [description]=\"t('practitioner.certificateFeedback.failureDescription')\" />\n\n <cardinal-certificate-status\n *ngIf=\"errorWhileVerifyingCertificate\"\n [status]=\"'error'\"\n [title]=\"t('practitioner.certificateFeedback.verificationErrorTitle')\"\n [description]=\"errorWhileVerifyingCertificate\" />\n\n <cardinal-certificate-upload\n [hcp]=\"hcp\"\n *ngIf=\"!certificateValid || !certificateUploaded\"\n (onUploadCertificate)=\"onUploadCertificate.emit($event)\" />\n</div>\n", styles: ["*{margin:0;padding:0;font-size:100%;box-sizing:border-box;font-family:Inter Variable,sans-serif}a{text-decoration:none}a:active,a:hover{outline:0}ul,li{list-style-type:none;margin:0;padding:0}h1,h2,h3,h4,h5,h6{font-size:100%}html,body{box-sizing:border-box;font-size:16px;background-color:#fbfdff}*,*:before,*:after{box-sizing:border-box}:focus{outline:0}img,audio,video{max-width:100%;height:auto}iframe{border:0}textarea{resize:none;overflow:auto;vertical-align:top;box-shadow:none;-webkit-box-shadow:none;-moz-box-shadow:none}input,textarea,select,button{outline:none;border:none;font-size:100%;margin:0}button,input{line-height:normal}input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,textarea:-webkit-autofill,textarea:-webkit-autofill:hover,textarea:-webkit-autofill:focus,select:-webkit-autofill,select:-webkit-autofill:hover,select:-webkit-autofill:focus{-webkit-text-fill-color:rgb(0,0,0);transition:background-color 5000s ease-in-out 0s}table{border-collapse:collapse;border-spacing:0}td,th{padding:0;text-align:left}.certificate{width:50%;min-width:700px;display:flex;flex-direction:column;gap:12px}@media only screen and (max-width: 768px){.certificate{width:100%;min-width:100%}}\n"] }]
}], ctorParameters: () => [{ type: TranslationService }], propDecorators: { hcp: [{
type: Input,
args: [{ required: true }]
}], certificateValid: [{
type: Input
}], certificateUploaded: [{
type: Input
}], errorWhileVerifyingCertificate: [{
type: Input
}], onUploadCertificate: [{
type: Output
}] } });
class EditIcnComponent {
color = 'currentColor';
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: EditIcnComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: EditIcnComponent, isStandalone: true, selector: "cardinal-edit-icn", inputs: { color: "color" }, ngImport: i0, template: "<svg\n width=\"14\"\n height=\"14\"\n viewBox=\"0 0 14 14\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M7.277 9.81458L12.1624 4.92916L11.4041 4.17083L6.51867 9.05625L7.277 9.81458ZM3.47075 11.0833C2.49853 11.0347 1.77422 10.8306 1.29784 10.4708C0.821446 10.1111 0.583252 9.59097 0.583252 8.91041C0.583252 8.27847 0.843321 7.76562 1.36346 7.37187C1.8836 6.97812 2.60547 6.74236 3.52909 6.66458C3.90825 6.63541 4.19263 6.57465 4.38221 6.48229C4.57179 6.38993 4.66659 6.26111 4.66659 6.09583C4.66659 5.84305 4.52318 5.65347 4.23638 5.52708C3.94957 5.40069 3.47561 5.30833 2.8145 5.25L2.91659 4.08333C3.91797 4.16111 4.65443 4.36284 5.12596 4.68854C5.59749 5.01423 5.83325 5.48333 5.83325 6.09583C5.83325 6.61111 5.6461 7.01458 5.27179 7.30625C4.89749 7.59791 4.34575 7.77291 3.61659 7.83125C2.99436 7.87986 2.5277 7.99409 2.21659 8.17396C1.90547 8.35382 1.74992 8.5993 1.74992 8.91041C1.74992 9.25069 1.88603 9.49618 2.15825 9.64687C2.43047 9.79757 2.88742 9.8875 3.52909 9.91666L3.47075 11.0833ZM7.55409 11.1854L5.14784 8.77916L10.7187 3.20833C10.9131 3.01389 11.144 2.91666 11.4114 2.91666C11.6787 2.91666 11.9096 3.01389 12.1041 3.20833L13.1249 4.22916C13.3194 4.42361 13.4166 4.65451 13.4166 4.92187C13.4166 5.18923 13.3194 5.42014 13.1249 5.61458L7.55409 11.1854ZM5.23534 11.6667C5.07006 11.7056 4.92422 11.6618 4.79784 11.5354C4.67145 11.409 4.6277 11.2632 4.66659 11.0979L5.14784 8.77916L7.55409 11.1854L5.23534 11.6667Z\"\n [attr.fill]=\"color\" />\n</svg>\n", styles: [""], changeDetection: i0.ChangeDetectionStrategy.OnPush });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: EditIcnComponent, decorators: [{
type: Component,
args: [{ selector: 'cardinal-edit-icn', imports: [], changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, template: "<svg\n width=\"14\"\n height=\"14\"\n viewBox=\"0 0 14 14\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M7.277 9.81458L12.1624 4.92916L11.4041 4.17083L6.51867 9.05625L7.277 9.81458ZM3.47075 11.0833C2.49853 11.0347 1.77422 10.8306 1.29784 10.4708C0.821446 10.1111 0.583252 9.59097 0.583252 8.91041C0.583252 8.27847 0.843321 7.76562 1.36346 7.37187C1.8836 6.97812 2.60547 6.74236 3.52909 6.66458C3.90825 6.63541 4.19263 6.57465 4.38221 6.48229C4.57179 6.38993 4.66659 6.26111 4.66659 6.09583C4.66659 5.84305 4.52318 5.65347 4.23638 5.52708C3.94957 5.40069 3.47561 5.30833 2.8145 5.25L2.91659 4.08333C3.91797 4.16111 4.65443 4.36284 5.12596 4.68854C5.59749 5.01423 5.83325 5.48333 5.83325 6.09583C5.83325 6.61111 5.6461 7.01458 5.27179 7.30625C4.89749 7.59791 4.34575 7.77291 3.61659 7.83125C2.99436 7.87986 2.5277 7.99409 2.21659 8.17396C1.90547 8.35382 1.74992 8.5993 1.74992 8.91041C1.74992 9.25069 1.88603 9.49618 2.15825 9.64687C2.43047 9.79757 2.88742 9.8875 3.52909 9.91666L3.47075 11.0833ZM7.55409 11.1854L5.14784 8.77916L10.7187 3.20833C10.9131 3.01389 11.144 2.91666 11.4114 2.91666C11.6787 2.91666 11.9096 3.01389 12.1041 3.20833L13.1249 4.22916C13.3194 4.42361 13.4166 4.65451 13.4166 4.92187C13.4166 5.18923 13.3194 5.42014 13.1249 5.61458L7.55409 11.1854ZM5.23534 11.6667C5.07006 11.7056 4.92422 11.6618 4.79784 11.5354C4.67145 11.409 4.6277 11.2632 4.66659 11.0979L5.14784 8.77916L7.55409 11.1854L5.23534 11.6667Z\"\n [attr.fill]=\"color\" />\n</svg>\n" }]
}], propDecorators: { color: [{
type: Input,
args: [{ required: true }]
}] } });
class DeleteIcnComponent {
color = 'currentColor';
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DeleteIcnComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: DeleteIcnComponent, isStandalone: true, selector: "cardinal-delete-icn", inputs: { color: "color" }, ngImport: i0, template: "<svg\n width=\"14\"\n height=\"14\"\n viewBox=\"0 0 14 14\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M5.83325 5.25C6.15542 5.25 6.41659 5.51117 6.41659 5.83334V9.625C6.41659 9.94717 6.15542 10.2083 5.83325 10.2083C5.51109 10.2083 5.24992 9.94717 5.24992 9.625V5.83334C5.24992 5.51117 5.51109 5.25 5.83325 5.25Z\"\n [attr.fill]=\"color\" />\n <path\n d=\"M8.74992 5.83334C8.74992 5.51117 8.48875 5.25 8.16659 5.25C7.84442 5.25 7.58325 5.51117 7.58325 5.83334V9.625C7.58325 9.94717 7.84442 10.2083 8.16659 10.2083C8.48875 10.2083 8.74992 9.94717 8.74992 9.625V5.83334Z\"\n [attr.fill]=\"color\" />\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M5.62588 0.583336C5.41285 0.583336 5.21676 0.699465 5.11436 0.88627L4.32112 2.33334H1.16659C0.844419 2.33334 0.583252 2.5945 0.583252 2.91667C0.583252 3.23884 0.844419 3.5 1.16659 3.5H2.04159V12.8333C2.04159 13.1555 2.30275 13.4167 2.62492 13.4167H11.3749C11.6971 13.4167 11.9583 13.1555 11.9583 12.8333V3.5H12.8333C13.1554 3.5 13.4166 3.23884 13.4166 2.91667C13.4166 2.5945 13.1554 2.33334 12.8333 2.33334H9.68208L8.90713 0.890634C8.80548 0.701395 8.60805 0.583336 8.39324 0.583336H5.62588ZM8.35775 2.33334L8.04442 1.75H5.97134L5.65158 2.33334H8.35775ZM3.20825 3.5V12.25H10.7916V3.5H3.20825Z\"\n [attr.fill]=\"color\" />\n</svg>\n", styles: [""], changeDetection: i0.ChangeDetectionStrategy.OnPush });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DeleteIcnComponent, decorators: [{
type: Component,
args: [{ selector: 'cardinal-delete-icn', imports: [], changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, template: "<svg\n width=\"14\"\n height=\"14\"\n viewBox=\"0 0 14 14\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M5.83325 5.25C6.15542 5.25 6.41659 5.51117 6.41659 5.83334V9.625C6.41659 9.94717 6.15542 10.2083 5.83325 10.2083C5.51109 10.2083 5.24992 9.94717 5.24992 9.625V5.83334C5.24992 5.51117 5.51109 5.25 5.83325 5.25Z\"\n [attr.fill]=\"color\" />\n <path\n d=\"M8.74992 5.83334C8.74992 5.51117 8.48875 5.25 8.16659 5.25C7.84442 5.25 7.58325 5.51117 7.58325 5.83334V9.625C7.58325 9.94717 7.84442 10.2083 8.16659 10.2083C8.48875 10.2083 8.74992 9.94717 8.74992 9.625V5.83334Z\"\n [attr.fill]=\"color\" />\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M5.62588 0.583336C5.41285 0.583336 5.21676 0.699465 5.11436 0.88627L4.32112 2.33334H1.16659C0.844419 2.33334 0.583252 2.5945 0.583252 2.91667C0.583252 3.23884 0.844419 3.5 1.16659 3.5H2.04159V12.8333C2.04159 13.1555 2.30275 13.4167 2.62492 13.4167H11.3749C11.6971 13.4167 11.9583 13.1555 11.9583 12.8333V3.5H12.8333C13.1554 3.5 13.4166 3.23884 13.4166 2.91667C13.4166 2.5945 13.1554 2.33334 12.8333 2.33334H9.68208L8.90713 0.890634C8.80548 0.701395 8.60805 0.583336 8.39324 0.583336H5.62588ZM8.35775 2.33334L8.04442 1.75H5.97134L5.65158 2.33334H8.35775ZM3.20825 3.5V12.25H10.7916V3.5H3.20825Z\"\n [attr.fill]=\"color\" />\n</svg>\n" }]
}], propDecorators: { color: [{
type: Input,
args: [{ required: true }]
}] } });
class PrescriptionRowComponent {
prescribedMedication;
handleModifyPrescription = new EventEmitter();
handleDeletePrescription = new EventEmitter();
onModifyClick() {
this.handleModifyPrescription.emit(this.prescribedMedication);
}
onDeleteClick() {
this.handleDeletePrescription.emit(this.prescribedMedication);
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: PrescriptionRowComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: PrescriptionRowComponent, isStandalone: true, selector: "cardinal-prescription-card", inputs: { prescribedMedication: "prescribedMedication" }, outputs: { handleModifyPrescription: "handleModifyPrescription", handleDeletePrescription: "handleDeletePrescription" }, ngImport: i0, template: "<div\n *ngIf=\"prescribedMedication\"\n class=\"prescriptionCard\"\n [class.prescribed]=\"prescribedMedication.rid\">\n <div class=\"header\">\n <div class=\"header__prescription\">\n <div class=\"header__prescription__content\">\n <div class=\"header__prescription__content__title\">\n <h3>\n {{\n prescribedMedication.medication.medicinalProduct?.intendedname ||\n prescribedMedication.medication.substanceProduct\n ?.intendedname ||\n prescribedMedication.medication.compoundPrescription\n }}\n </h3>\n </div>\n <p>{{ prescribedMedication.medication.instructionForPatient }}</p>\n </div>\n </div>\n </div>\n\n <div *ngIf=\"!prescribedMedication.rid\" class=\"actions\">\n <button class=\"actions__btn actions__btn--edit\" (click)=\"onModifyClick()\">\n <cardinal-edit-icn [color]=\"'#383A3C'\" />\n </button>\n <button class=\"actions__btn actions__btn--delete\" (click)=\"onDeleteClick()\">\n <cardinal-delete-icn [color]=\"'#383A3C'\" />\n </button>\n </div>\n\n <div *ngIf=\"prescribedMedication.rid\" class=\"rid\">\n {{ prescribedMedication.rid }}\n </div>\n</div>\n", styles: ["*{margin:0;padding:0;font-size:100%;box-sizing:border-box;font-family:Inter Variable,sans-serif}a{text-decoration:none}a:active,a:hover{outline:0}ul,li{list-style-type:none;margin:0;padding:0}h1,h2,h3,h4,h5,h6{font-size:100%}html,body{box-sizing:border-box;font-size:16px;background-color:#fbfdff}*,*:before,*:after{box-sizing:border-box}:focus{outline:0}img,audio,video{max-width:100%;height:auto}iframe{border:0}textarea{resize:none;overflow:auto;vertical-align:top;box-shadow:none;-webkit-box-shadow:none;-moz-box-shadow:none}input,textarea,select,button{outline:none;border:none;font-size:100%;margin:0}button,input{line-height:normal}input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,textarea:-webkit-autofill,textarea:-webkit-autofill:hover,textarea:-webkit-autofill:focus,select:-webkit-autofill,select:-webkit-autofill:hover,select:-webkit-autofill:focus{-webkit-text-fill-color:rgb(0,0,0);transition:background-color 5000s ease-in-out 0s}table{border-collapse:collapse;border-spacing:0}td,th{padding:0;text-align:left}.prescriptionCard{width:100%;display:flex;flex-direction:row;justify-content:space-between;align-items:center;padding:8px 12px;gap:12px;border-radius:6px;background:#f9fbfe;border:1px solid #dce7f2}.prescriptionCard:hover{border-radius:6px;border-color:#3d87c5;box-shadow:0 0 0 2px #3d87c54d;background-color:#fff}.prescriptionCard.prescribed{background:#e5fae5;border-color:green}.prescriptionCard.prescribed:hover{border-color:green;border-radius:inherit;background:#e5fae5;box-shadow:inherit}.prescriptionCard .header{width:83%;display:flex;justify-content:space-between;align-items:center;align-self:stretch}@media only screen and (max-width: 576px){.prescriptionCard .header{width:100%}}.prescriptionCard .header__prescription{display:flex;align-items:center;gap:12px}.prescriptionCard .header__prescription__content{display:flex;flex-direction:column;justify-content:center;align-items:flex-start}.prescriptionCard .header__prescription__content__title{display:flex;align-items:flex-start;gap:8px}.prescriptionCard .header__prescription__content__title h3{color:#1d2235;font-size:16px;font-style:normal;font-weight:500}.prescriptionCard .header__prescription__content p{color:#1d2235;font-size:14px;font-style:normal;font-weight:300;line-height:normal}.prescriptionCard .rid{font-size:12px;letter-spacing:1.2px;background-color:#52c41a;color:#fff;padding:4px 8px;border-radius:4px}.prescriptionCard .actions{width:36px;display:flex;gap:8px}@media only screen and (max-width: 576px){.prescriptionCard .actions{width:100%;gap:4px}}.prescriptionCard .actions__btn{background:none;cursor:pointer;display:flex;align-items:center;justify-content:center}.prescriptionCard .actions__btn cardinal-edit-icn:hover svg path{fill:#3d87c5}.prescriptionCard .actions__btn cardinal-delete-icn:hover svg path{fill:red}@media only screen and (max-width: 576px){.prescriptionCard .actions__btn{width:32px;height:32px;border:1px solid #eef6fe;background:#eef6fe4d;border-radius:6px}}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: EditIcnComponent, selector: "cardinal-edit-icn", inputs: ["color"] }, { kind: "component", type: DeleteIcnComponent, selector: "cardinal-delete-icn", inputs: ["color"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: PrescriptionRowComponent, decorators: [{
type: Component,
args: [{ selector: 'cardinal-prescription-card', imports: [NgIf, EditIcnComponent, DeleteIcnComponent], changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, template: "<div\n *ngIf=\"prescribedMedication\"\n class=\"prescriptionCard\"\n [class.prescribed]=\"prescribedMedication.rid\">\n <div class=\"header\">\n <div class=\"header__prescription\">\n <div class=\"header__prescription__content\">\n <div class=\"header__prescription__content__title\">\n <h3>\n {{\n prescribedMedication.medication.medicinalProduct?.intendedname ||\n prescribedMedication.medication.substanceProduct\n ?.intendedname ||\n prescribedMedication.medication.compoundPrescription\n }}\n </h3>\n </div>\n <p>{{ prescribedMedication.medication.instructionForPatient }}</p>\n </div>\n </div>\n </div>\n\n <div *ngIf=\"!prescribedMedication.rid\" class=\"actions\">\n <button class=\"actions__btn actions__btn--edit\" (click)=\"onModifyClick()\">\n <cardinal-edit-icn [color]=\"'#383A3C'\" />\n </button>\n <button class=\"actions__btn actions__btn--delete\" (click)=\"onDeleteClick()\">\n <cardinal-delete-icn [color]=\"'#383A3C'\" />\n </button>\n </div>\n\n <div *ngIf=\"prescribedMedication.rid\" class=\"rid\">\n {{ prescribedMedication.rid }}\n </div>\n</div>\n", styles: ["*{margin:0;padding:0;font-size:100%;box-sizing:border-box;font-family:Inter Variable,sans-serif}a{text-decoration:none}a:active,a:hover{outline:0}ul,li{list-style-type:none;margin:0;padding:0}h1,h2,h3,h4,h5,h6{font-size:100%}html,body{box-sizing:border-box;font-size:16px;background-color:#fbfdff}*,*:before,*:after{box-sizing:border-box}:focus{outline:0}img,audio,video{max-width:100%;height:auto}iframe{border:0}textarea{resize:none;overflow:auto;vertical-align:top;box-shadow:none;-webkit-box-shadow:none;-moz-box-shadow:none}input,textarea,select,button{outline:none;border:none;font-size:100%;margin:0}button,input{line-height:normal}input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,textarea:-webkit-autofill,textarea:-webkit-autofill:hover,textarea:-webkit-autofill:focus,select:-webkit-autofill,select:-webkit-autofill:hover,select:-webkit-autofill:focus{-webkit-text-fill-color:rgb(0,0,0);transition:background-color 5000s ease-in-out 0s}table{border-collapse:collapse;border-spacing:0}td,th{padding:0;text-align:left}.prescriptionCard{width:100%;display:flex;flex-direction:row;justify-content:space-between;align-items:center;padding:8px 12px;gap:12px;border-radius:6px;background:#f9fbfe;border:1px solid #dce7f2}.prescriptionCard:hover{border-radius:6px;border-color:#3d87c5;box-shadow:0 0 0 2px #3d87c54d;background-color:#fff}.prescriptionCard.prescribed{background:#e5fae5;border-color:green}.prescriptionCard.prescribed:hover{border-color:green;border-radius:inherit;background:#e5fae5;box-shadow:inherit}.prescriptionCard .header{width:83%;display:flex;justify-content:space-between;align-items:center;align-self:stretch}@media only screen and (max-width: 576px){.prescriptionCard .header{width:100%}}.prescriptionCard .header__prescription{display:flex;align-items:center;gap:12px}.prescriptionCard .header__prescription__content{display:flex;flex-direction:column;justify-content:center;align-items:flex-start}.prescriptionCard .header__prescription__content__title{display:flex;align-items:flex-start;gap:8px}.prescriptionCard .header__prescription__content__title h3{color:#1d2235;font-size:16px;font-style:normal;font-weight:500}.prescriptionCard .header__prescription__content p{color:#1d2235;font-size:14px;font-style:normal;font-weight:300;line-height:normal}.prescriptionCard .rid{font-size:12px;letter-spacing:1.2px;background-color:#52c41a;color:#fff;padding:4px 8px;border-radius:4px}.prescriptionCard .actions{width:36px;display:flex;gap:8px}@media only screen and (max-width: 576px){.prescriptionCard .actions{width:100%;gap:4px}}.prescriptionCard .actions__btn{background:none;cursor:pointer;display:flex;align-items:center;justify-content:center}.prescriptionCard .actions__btn cardinal-edit-icn:hover svg path{fill:#3d87c5}.prescriptionCard .actions__btn cardinal-delete-icn:hover svg path{fill:red}@media only screen and (max-width: 576px){.prescriptionCard .actions__btn{width:32px;height:32px;border:1px solid #eef6fe;background:#eef6fe4d;border-radius:6px}}\n"] }]
}], propDecorators: { prescribedMedication: [{
type: Input,
args: [{ required: true }]
}], handleModifyPrescription: [{
type: Output
}], handleDeletePrescription: [{
type: Output
}] } });
class PrescriptionListComponent {
translationService;
prescribedMedications;
sending;
printing;
sendPrescriptions = new EventEmitter();
sendAndPrintPrescriptions = new EventEmitter();
printPrescriptions = new EventEmitter();
handleModifyPrescription = new EventEmitter();
handleDeletePrescription = new EventEmitter();
constructor(translationService) {
this.translationService = translationService;
}
t(key) {
return this.translationService.translate(key);
}
get sentPrescriptions() {
return this.prescribedMedications.filter(item => !!item.rid);
}
get pendingPrescriptions() {
return this.prescribedMedications.filter(item => !item.rid);
}
onClickSend() {
this.sendPrescriptions.emit();
}
onClickPrint() {
this.printPrescriptions.emit();
}
onClickSendAndPrint() {
this.sendAndPrintPrescriptions.emit();
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: PrescriptionListComponent, deps: [{ token: TranslationService }], target: i0.ɵɵFactoryTarget.Component });
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: PrescriptionListComponent, isStandalone: true, selector: "cardinal-prescription-list", inputs: { prescribedMedications: "prescribedMedications", sending: "sending", printing: "printing" }, outputs: { sendPrescriptions: "sendPrescriptions", sendAndPrintPrescriptions: "sendAndPrintPrescriptions", printPrescriptions: "printPrescriptions", handleModifyPrescription: "handleModifyPrescription", handleDeletePrescription: "handleDeletePrescription" }, ngImport: i0, template: "<div class=\"prescriptionsWrap\">\n <div *ngIf=\"sentPrescriptions.length\" class=\"prescriptions\">\n <p class=\"prescriptions__title\">{{ t('prescription.list.sentTitle') }}</p>\n <div class=\"prescriptions__rows\">\n <cardinal-prescription-card\n *ngFor=\"let medication of sentPrescriptions\"\n [prescribedMedication]=\"medication\"\n (handleModifyPrescription)=\"handleModifyPrescription.emit($event)\"\n (handleDeletePrescription)=\"handleDeletePrescription.emit($event)\" />\n </div>\n\n <div class=\"prescriptions__footer\">\n <cardinal-button\n [disabled]=\"sending\"\n [view]=\"printing && !sending ? 'withSpinner' : 'outlined'\"\n type=\"submit\"\n (click)=\"onClickPrint()\">\n {{ t('prescription.list.print') }}\n </cardinal-button>\n </div>\n </div>\n\n <div *ngIf=\"pendingPrescriptions.length\" class=\"prescriptions\">\n <p class=\"prescriptions__title\">\n {{ t('prescription.list.pendingTitle') }}\n </p>\n\n <div class=\"prescriptions__rows\">\n <cardinal-prescription-card\n *ngFor=\"let medication of pendingPrescriptions\"\n [prescribedMedication]=\"medication\"\n (handleModifyPrescription)=\"handleModifyPrescription.emit($event)\"\n (handleDeletePrescription)=\"handleDeletePrescription.emit($event)\" />\n </div>\n\n <div class=\"prescriptions__footer\">\n <cardinal-button\n [disabled]=\"sending\"\n [view]=\"printing ? 'withSpinner' : 'outlined'\"\n type=\"submit\"\n (click)=\"onClickSendAndPrint()\">\n {{ t('prescription.list.sendAndPrint') }}\n </cardinal-button>\n\n <cardinal-button\n [disabled]=\"printing\"\n [view]=\"sending && !printing ? 'withSpinner' : 'primary'\"\n type=\"submit\"\n (click)=\"onClickSend()\">\n {{ t('prescription.list.send') }}\n </cardinal-button>\n </div>\n </div>\n</div>\n", styles: ["*{margin:0;padding:0;font-size:100%;box-sizing:border-box;font-family:Inter Variable,sans-serif}a{text-decoration:none}a:active,a:hover{outline:0}ul,li{list-style-type:none;margin:0;padding:0}h1,h2,h3,h4,h5,h6{font-size:100%}html,body{box-sizing:border-box;font-size:16px;background-color:#fbfdff}*,*:before,*:after{box-sizing:border-box}:focus{outline:0}img,audio,video{max-width:100%;height:auto}iframe{border:0}textarea{resize:none;overflow:auto;vertical-align:top;box-shadow:none;-webkit-box-shadow:none;-moz-box-shadow:none}input,textarea,select,button{outline:none;border:none;font-size:100%;margin:0}button,input{line-height:normal}input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,textarea:-webkit-autofill,textarea:-webkit-autofill:hover,textarea:-webkit-autofill:focus,select:-webkit-autofill,select:-webkit-autofill:hover,select:-webkit-autofill:focus{-webkit-text-fill-color:rgb(0,0,0);transition:background-color 5000s ease-in-out 0s}table{border-collapse:collapse;border-spacing:0}td,th{padding:0;text-align:left}.prescriptionsWrap{display:flex;flex-direction:column;gap:24px}.prescriptions{display:flex;flex-direction:column;gap:4px;width:50%;min-width:700px}@media only screen and (max-width: 768px){.prescriptions{width:100%;min-width:100%}}.prescriptions__title{width:100%;display:flex;align-items:flex-start;gap:4px;color:#1d2235;font-size:14px;font-weight:500;line-height:22px;cursor:pointer}.prescriptions__title span{display:none}.prescriptions__title.required span{display:flex;color:red;font-weight:700}.prescriptions__title.error{color:red}.prescriptions__rows{width:100%;height:auto;max-height:380px;overflow-y:scroll;display:flex;flex-direction:column;align-items:flex-start;align-self:stretch;padding:6px 8px 6px 6px;gap:5px;border-radius:8px;border:1px solid #e4e4e7;background:#fff}.prescriptions__rows cardinal-prescription-card{width:100%}.prescriptions__footer{display:flex;justify-content:flex-start;align-items:flex-start;gap:12px;align-self:stretch;background:#fff}.print{font-family:Arial,sans-serif;margin:20px}.print .header{text-align:center;margin-bottom:20px}.print .header h1{margin:0;font-size:18px;border-bottom:1px solid #000}.print .options{border-top:1px solid #000;border-bottom:1px solid #000;font-size:14px;margin-bottom:20px}.print .prescription-section{padding:10px;margin-bottom:20px}.print .prescription-item{display:flex;justify-content:space-between;border-top:1px solid #000;margin-bottom:20px}.print .prescription-item div{width:48%}.print .barcode{border:1px solid #000;width:12mm;height:12mm;margin:5px 0}.print .right{margin-left:auto}\n"], dependencies: [{ kind: "component", type: PrescriptionRowComponent, selector: "cardinal-prescription-card", inputs: ["prescribedMedication"], outputs: ["handleModifyPrescription", "handleDeletePrescription"] }, { kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ButtonComponent, selector: "cardinal-button", inputs: ["view", "type", "formId", "disabled"], outputs: ["handleClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: PrescriptionListComponent, decorators: [{
type: Component,
args: [{ standalone: true, selector: 'cardinal-prescription-list', imports: [PrescriptionRowComponent, NgForOf, NgIf, ButtonComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"prescriptionsWrap\">\n <div *ngIf=\"sentPrescriptions.length\" class=\"prescriptions\">\n <p class=\"prescriptions__title\">{{ t('prescription.list.sentTitle') }}</p>\n <div class=\"prescriptions__rows\">\n <cardinal-prescription-card\n *ngFor=\"let medication of sentPrescriptions\"\n [prescribedMedication]=\"medication\"\n (handleModifyPrescription)=\"handleModifyPrescription.emit($event)\"\n (handleDeletePrescription)=\"handleDeletePrescription.emit($event)\" />\n </div>\n\n <div class=\"prescriptions__footer\">\n <cardinal-button\n [disabled]=\"sending\"\n [view]=\"printing && !sending ? 'withSpinner' : 'outlined'\"\n type=\"submit\"\n (click)=\"onClickPrint()\">\n {{ t('prescription.list.print') }}\n </cardinal-button>\n </div>\n </div>\n\n <div *ngIf=\"pendingPrescriptions.length\" class=\"prescriptions\">\n <p class=\"prescriptions__title\">\n {{ t('prescription.list.pendingTitle') }}\n </p>\n\n <div class=\"prescriptions__rows\">\n <cardinal-prescription-card\n *ngFor=\"let medication of pendingPrescriptions\"\n [prescribedMedication]=\"medication\"\n (handleModifyPrescription)=\"handleModifyPrescription.emit($event)\"\n (handleDeletePrescription)=\"handleDeletePrescription.emit($event)\" />\n </div>\n\n <div class=\"prescriptions__footer\">\n <cardinal-button\n [disabled]=\"sending\"\n [view]=\"printing ? 'withSpinner' : 'outlined'\"\n type=\"submit\"\n (click)=\"onClickSendAndPrint()\">\n {{ t('prescription.list.sendAndPrint') }}\n </cardinal-button>\n\n <cardinal-button\n [disabled]=\"printing\"\n [view]=\"sending && !printing ? 'withSpinner' : 'primary'\"\n type=\"submit\"\n (click)=\"onClickSend()\">\n {{ t('prescription.list.send') }}\n </cardinal-button>\n </div>\n </div>\n</div>\n", styles: ["*{margin:0;padding:0;font-size:100%;box-sizing:border-box;font-family:Inter Variable,sans-serif}a{text-decoration:none}a:active,a:hover{outline:0}ul,li{list-style-type:none;margin:0;padding:0}h1,h2,h3,h4,h5,h6{font-size:100%}html,body{box-sizing:border-box;font-size:16px;background-color:#fbfdff}*,*:before,*:after{box-sizing:border-box}:focus{outline:0}img,audio,video{max-width:100%;height:auto}iframe{border:0}textarea{resize:none;overflow:auto;vertical-align:top;box-shadow:none;-webkit-box-shadow:none;-moz-box-shadow:none}input,textarea,select,button{outline:none;border:none;font-size:100%;margin:0}button,input{line-height:normal}input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,textarea:-webkit-autofill,textarea:-webkit-autofill:hover,textarea:-webkit-autofill:focus,select:-webkit-autofill,select:-webkit-autofill:hover,select:-webkit-autofill:focus{-webkit-text-fill-color:rgb(0,0,0);transition:background-color 5000s ease-in-out 0s}table{border-collapse:collapse;border-spacing:0}td,th{padding:0;text-align:left}.prescriptionsWrap{display:flex;flex-direction:column;gap:24px}.prescriptions{display:flex;flex-direction:column;gap:4px;width:50%;min-width:700px}@media only screen and (max-width: 768px){.prescriptions{width:100%;min-width:100%}}.prescriptions__title{width:100%;display:flex;align-items:flex-start;gap:4px;color:#1d2235;font-size:14px;font-weight:500;line-height:22px;cursor:pointer}.prescriptions__title span{display:none}.prescriptions__title.required span{display:flex;color:red;font-weight:700}.prescriptions__title.error{color:red}.prescriptions__rows{width:100%;height:auto;max-height:380px;overflow-y:scroll;display:flex;flex-direction:column;align-items:flex-start;align-self:stretch;padding:6px 8px 6px 6px;gap:5px;border-radius:8px;border:1px solid #e4e4e7;background:#fff}.prescriptions__rows cardinal-prescription-card{width:100%}.prescriptions__footer{display:flex;justify-content:flex-start;align-items:flex-start;gap:12px;align-self:stretch;background:#fff}.print{font-family:Arial,sans-serif;margin:20px}.print .header{text-align:center;margin-bottom:20px}.print .header h1{margin:0;font-size:18px;border-bottom:1px solid #000}.print .options{border-top:1px solid #000;border-bottom:1px solid #000;font-size:14px;margin-bottom:20px}.print .prescription-section{padding:10px;margin-bottom:20px}.print .prescription-item{display:flex;justify-content:space-between;border-top:1px solid #000;margin-bottom:20px}.print .prescription-item div{width:48%}.print .barcode{border:1px solid #000;width:12mm;height:12mm;margin:5px 0}.print .right{margin-left:auto}\n"] }]
}], ctorParameters: () => [{ type: TranslationService }], propDecorators: { prescribedMedications: [{
type: Input,
args: [{ required: true }]
}], sending: [{
type: Input,
args: [{ required: true }]
}], printing: [{
type: Input,
args: [{ required: true }]
}], sendPrescriptions: [{
type: Output
}], sendAndPrintPrescriptions: [{
type: Output
}], printPrescriptions: [{
type: Output
}], handleModifyPrescription: [{
type: Output
}], handleDeletePrescription: [{
type: Output
}] } });
class SelectInputComponent {
cdr;
label;
id;
required = false;
disabled = false;
options = [];
errorMessage;
valueChange = new EventEmitter();
value = '';
constructor(cdr) {
this.cdr = cdr;
}
onChangeFn = () => { };
onTouchedFn = () => { };
writeValue(value) {
this.value = value;
this.cdr.markForCheck(); // triggers a re-render
}
registerOnChange(fn) {
this.onChangeFn = fn;
}
registerOnTouched(fn) {
this.onTouchedFn = fn;
}
setDisabledState(isDisabled) {
this.disabled = isDisabled;
this.cdr.markForCheck(); // ensure view reflects disabled state
}
trackByOptionValue(_, option) {
return option.value;
}
onChange(event) {
const target = event.target;
this.value = target.value;
this.onChangeFn(this.value);
this.onTouchedFn();
this.valueChange.emit(this.value);
this.cdr.markForCheck(); // triggers a re-render
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: SelectInputComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: SelectInputComponent, isStandalone: true, selector: "cardinal-select-input", inputs: { label: "label", id: "id", required: "required", disabled: "disabled", options: "options", errorMessage: "errorMessage" }, outputs: { valueChange: "valueChange" }, providers: [
{
provide: NG_VALUE_ACCESSOR,
useExisting: forwardRef(() => SelectInputComponent),
multi: true,
},
], ngImport: i0, template: "<div class=\"selectInput\">\n <label [for]=\"id\" [ngClass]=\"{ required: required, error: errorMessage }\">\n <span *ngIf=\"required\">*</span>{{ label }}\n </label>\n\n <select\n [id]=\"id\"\n [name]=\"id\"\n [ngClass]=\"{ disabled: disabled, error: errorMessage }\"\n [disabled]=\"disabled\"\n [(ngModel)]=\"value\"\n (change)=\"onChange($event)\">\n <option\n *ngFor=\"let option of options; trackBy: trackByOptionValue\"\n [value]=\"option.value\">\n {{ option.label }}\n </option>\n </select>\n\n <p class=\"selectInput__error\" *ngIf=\"errorMessage\">\n {{ errorMessage }}\n </p>\n</div>\n", styles: ["*{margin:0;padding:0;font-size:100%;box-sizing:border-box;font-family:Inter Variable,sans-serif}a{text-decoration:none}a:active,a:hover{outline:0}ul,li{list-style-type:none;margin:0;padding:0}h1,h2,h3,h4,h5,h6{font-size:100%}html,body{box-sizing:border-box;font-size:16px;background-color:#fbfdff}*,*:before,*:after{box-sizing:border-box}:focus{outline:0}img,audio,video{max-width:100%;height:auto}iframe{border:0}textarea{resize:none;overflow:auto;vertical-align:top;box-shadow:none;-webkit-box-shadow:none;-moz-box-shadow:none}input,textarea,select,button{outline:none;border:none;font-size:100%;margin:0}button,input{line-height:normal}input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,textarea:-webkit-autofill,textarea:-webkit-autofill:hover,textarea:-webkit-autofill:focus,select:-webkit-autofill,select:-webkit-autofill:hover,select:-webkit-autofill:focus{-webkit-text-fill-color:rgb(0,0,0);transition:background-color 5000s ease-in-out 0s}table{border-collapse:collapse;border-spacing:0}td,th{padding:0;text-align:left}.selectInput{width:100%;display:flex;flex-direction:column;align-items:flex-start;gap:4px;align-self:stretch}.selectInput label{width:100%;display:flex;align-items:flex-start;gap:4px;color:#1d2235;font-size:14px;font-weight:500;line-height:22px;cursor:pointer}.selectInput label span{display:none}.selectInput label.required span{display:flex;color:red;font-weight:700}.selectInput label.error{color:red}.selectInput select{width:100%;display:flex;height:32px;padding:5px 12px;align-items:center;gap:4px;align-self:stretch;cursor:pointer;border-radius:6px;border:1px solid #cad0d5;background:#fff;color:#1d2235;font-family:Inter Variable,sans-serif;font-size:14px;font-weight:400;line-height:22px}.selectInput select::placeholder{color:#9ca8b2}.selectInput select:hover,.selectInput select:focus{border-color:#084b83}.selectInput select:focus{box-shadow:0 0 0 2px #3d87c533}.selectInput select.disabled{cursor:not-allowed;background-color:#f5f5f5;border-color:#cad0d5;opacity:.7}.selectInput select.disabled:hover{border-color:#cad0d5}.selectInput select.error{border-color:red;box-shadow:0 0 0 2px #f003;color:red}.selectInput select.error::placeholder{color:#ff000080}.selectInput__error{color:red;font-size:13px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: SelectInputComponent, decorators: [{
type: Component,
args: [{ selector: 'cardinal-select-input', standalone: true, imports: [CommonModule, FormsModule], providers: [
{
provide: NG_VALUE_ACCESSOR,
useExisting: forwardRef(() => SelectInputComponent),
multi: true,
},
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"selectInput\">\n <label [for]=\"id\" [ngClass]=\"{ required: required, error: errorMessage }\">\n <span *ngIf=\"required\">*</span>{{ label }}\n </label>\n\n <select\n [id]=\"id\"\n [name]=\"id\"\n [ngClass]=\"{ disabled: disabled, error: errorMessage }\"\n [disabled]=\"disabled\"\n [(ngModel)]=\"value\"\n (change)=\"onChange($event)\">\n <option\n *ngFor=\"let option of options; trackBy: trackByOptionValue\"\n [value]=\"option.value\">\n {{ option.label }}\n </option>\n </select>\n\n <p class=\"selectInput__error\" *ngIf=\"errorMessage\">\n {{ errorMessage }}\n </p>\n</div>\n", styles: ["*{margin:0;padding:0;font-size:100%;box-sizing:border-box;font-family:Inter Variable,sans-serif}a{text-decoration:none}a:active,a:hover{outline:0}ul,li{list-style-type:none;margin:0;padding:0}h1,h2,h3,h4,h5,h6{font-size:100%}html,body{box-sizing:border-box;font-size:16px;background-color:#fbfdff}*,*:before,*:after{box-sizing:border-box}:focus{outline:0}img,audio,video{max-width:100%;height:auto}iframe{border:0}textarea{resize:none;overflow:auto;vertical-align:top;box-shadow:none;-webkit-box-shadow:none;-moz-box-shadow:none}input,textarea,select,button{outline:none;border:none;font-size:100%;margin:0}button,input{line-height:normal}input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,textarea:-webkit-autofill,textarea:-webkit-autofill:hover,textarea:-webkit-autofill:focus,select:-webkit-autofill,select:-webkit-autofill:hover,select:-webkit-autofill:focus{-webkit-text-fill-color:rgb(0,0,0);transition:background-color 5000s ease-in-out 0s}table{border-collapse:collapse;border-spacing:0}td,th{padding:0;text-align:left}.selectInput{width:100%;display:flex;flex-direction:column;align-items:flex-start;gap:4px;align-self:stretch}.selectInput label{width:100%;display:flex;align-items:flex-start;gap:4px;color:#1d2235;font-size:14px;font-weight:500;line-height:22px;cursor:pointer}.selectInput label span{display:none}.selectInput label.required span{display:flex;color:red;font-weight:700}.selectInput label.error{color:red}.selectInput select{width:100%;display:flex;height:32px;padding:5px 12px;align-items:center;gap:4px;align-self:stretch;cursor:pointer;border-radius:6px;border:1px solid #cad0d5;background:#fff;color:#1d2235;font-family:Inter Variable,sans-serif;font-size:14px;font-weight:400;line-height:22px}.selectInput select::placeholder{color:#9ca8b2}.selectInput select:hover,.selectInput select:focus{border-color:#084b83}.selectInput select:focus{box-shadow:0 0 0 2px #3d87c533}.selectInput select.disabled{cursor:not-allowed;background-color:#f5f5f5;border-color:#cad0d5;opacity:.7}.selectInput select.disabled:hover{border-color:#cad0d5}.selectInput select.error{border-color:red;box-shadow:0 0 0 2px #f003;color:red}.selectInput select.error::placeholder{color:#ff000080}.selectInput__error{color:red;font-size:13px}\n"] }]
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { label: [{
type: Input,
args: [{ required: true }]
}], id: [{
type: Input,
args: [{ required: true }]
}], required: [{
type: Input
}], disabled: [{
type: Input
}], options: [{
type: Input,
args: [{ required: true }]
}], errorMessage: [{
type: Input
}], valueChange: [{
type: Output
}] } });
class RadioInputComponent {
cdr;
label;
name;
required = false;
errorMessage;
options = [];
value;
constructor(cdr) {
this.cdr = cdr;
}
onChange = (value) => { };
onTouched = () => { };
writeValue(value) {
this.value = value;
this.cdr.markForCheck(); // triggers a re-render
}
registerOnChange(fn) {
this.onChange = fn;
}
registerOnTouched(fn) {
this.onTouched = fn;
}
onSelectionChange(val) {
this.value = val;
this.onChange(val);
this.onTouched();
this.cdr.markForCheck(); // triggers a re-render
}
trackById(_, item) {
return item.id;
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: RadioInputComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: RadioInputComponent, isStandalone: true, selector: "cardinal-radio-input", inputs: { label: "label", name: "name", required: "required", errorMessage: "errorMessage", options: "options" }, providers: [
{
provide: NG_VALUE_ACCESSOR,
useExisting: forwardRef(() => RadioInputComponent),
multi: true,
},
], ngImport: i0, template: "<div class=\"radioBtnsGroup\">\n <p\n [ngClass]=\"{ required: required, error: errorMessage }\"\n class=\"radioBtnsGroup__label\">\n <span *ngIf=\"required\">*</span>{{ label }}\n </p>\n\n <div class=\"radioBtnsGroup__buttons\">\n <label\n *ngFor=\"let option of options; trackBy: trackById\"\n [for]=\"option.id\"\n class=\"radioButton\"\n [ngClass]=\"{ error: errorMessage }\">\n <input\n type=\"radio\"\n [id]=\"option.id\"\n [name]=\"name\"\n [value]=\"option.value\"\n [checked]=\"value === option.value\"\n (change)=\"onSelectionChange(option.value)\" />\n <span class=\"radioButton__toggle\" [ngClass]=\"{ error: errorMessage }\">\n <span class=\"radioButton__toggle__inside\"></span>\n </span>\n <span class=\"radioButton__label\" [ngClass]=\"{ error: errorMessage }\">{{\n option.label\n }}</span>\n </label>\n </div>\n\n <p *ngIf=\"errorMessage\" class=\"radioBtnsGroup__error\">{{ errorMessage }}</p>\n</div>\n", styles: ["*{margin:0;padding:0;font-size:100%;box-sizing:border-box;font-family:Inter Variable,sans-serif}a{text-decoration:none}a:active,a:hover{outline:0}ul,li{list-style-type:none;margin:0;padding:0}h1,h2,h3,h4,h5,h6{font-size:100%}html,body{box-sizing:border-box;font-size:16px;background-color:#fbfdff}*,*:before,*:after{box-sizing:border-box}:focus{outline:0}img,audio,video{max-width:100%;height:auto}iframe{border:0}textarea{resize:none;overflow:auto;vertical-align:top;box-shadow:none;-webkit-box-shadow:none;-moz-box-shadow:none}input,textarea,select,button{outline:none;border:none;font-size:100%;margin:0}button,input{line-height:normal}input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,textarea:-webkit-autofill,textarea:-webkit-autofill:hover,textarea:-webkit-autofill:focus,select:-webkit-autofill,select:-webkit-autofill:hover,select:-webkit-autofill:focus{-webkit-text-fill-color:rgb(0,0,0);transition:background-color 5000s ease-in-out 0s}table{border-collapse:collapse;border-spacing:0}td,th{padding:0;text-align:left}.radioBtnsGroup{width:100%;display:flex;flex-direction:column;align-items:flex-start;gap:4px;align-self:stretch}.radioBtnsGroup__label{width:100%;display:flex;align-items:flex-start;gap:4px;color:#1d2235;font-size:14px;font-weight:500;line-height:22px;cursor:pointer}.radioBtnsGroup__label span{display:none}.radioBtnsGroup__label.required span{display:flex;color:red;font-weight:700}.radioBtnsGroup__label.error{color:red}.radioBtnsGroup__buttons{width:100%;display:flex;flex-direction:row;align-items:center;flex-wrap:wrap;gap:18px}.radioBtnsGroup__buttons .radioButton{align-self:stretch;display:flex;align-items:center;justify-content:flex-start;gap:8px;cursor:pointer}.radioBtnsGroup__buttons .radioButton:hover .radioButton__toggle{box-shadow:0 0 0 2px #3d87c533;border-color:#084b83}.radioBtnsGroup__buttons .radioButton__toggle{display:flex;align-items:center;justify-content:center;width:15px;height:15px;padding:2px;border-radius:50%;border:1px solid #848482;background:#fff}.radioBtnsGroup__buttons .radioButton__toggle__inside{display:none;width:100%;height:100%;border-radius:50%;background:#084b83}.radioBtnsGroup__buttons .radioButton__toggle.error{border-color:red}.radioBtnsGroup__buttons .radioButton__toggle.error:hover{box-shadow:0 0 0 2px #f003}.radioBtnsGroup__buttons .radioButton__toggle.error .radioButton__toggle__inside{background:red}.radioBtnsGroup__buttons .radioButton input{display:none}.radioBtnsGroup__buttons .radioButton input:checked+.radioButton__toggle{border-color:#084b83}.radioBtnsGroup__buttons .radioButton input:checked+.radioButton__toggle .radioButton__toggle__inside{display:flex}.radioBtnsGroup__buttons .radioButton__label{width:100%;display:flex;align-items:flex-start;gap:4px;color:#1d2235;font-size:14px;font-weight:500;line-height:22px;cursor:pointer;width:auto;font-weight:400}.radioBtnsGroup__buttons .radioButton__label span{display:none}.radioBtnsGroup__buttons .radioButton__label.required span{display:flex;color:red;font-weight:700}.radioBtnsGroup__buttons .radioButton__label.error{color:red}.radioBtnsGroup__error{color:red;font-size:13px}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: RadioInputComponent, decorators: [{
type: Component,
args: [{ selector: 'cardinal-radio-input', standalone: true, imports: [FormsModule, NgIf, NgForOf, NgClass], providers: [
{
provide: NG_VALUE_ACCESSOR,
useExisting: forwardRef(() => RadioInputComponent),
multi: true,
},
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"radioBtnsGroup\">\n <p\n [ngClass]=\"{ required: required, error: errorMessage }\"\n class=\"radioBtnsGroup__label\">\n <span *ngIf=\"required\">*</span>{{ label }}\n </p>\n\n <div class=\"radioBtnsGroup__buttons\">\n <label\n *ngFor=\"let option of options; trackBy: trackById\"\n [for]=\"option.id\"\n class=\"radioButton\"\n [ngClass]=\"{ error: errorMessage }\">\n <input\n type=\"radio\"\n [id]=\"option.id\"\n [name]=\"name\"\n [value]=\"option.value\"\n [checked]=\"value === option.value\"\n (change)=\"onSelectionChange(option.value)\" />\n <span class=\"radioButton__toggle\" [ngClass]=\"{ error: errorMessage }\">\n <span class=\"radioButton__toggle__inside\"></span>\n </span>\n <span class=\"radioButton__label\" [ngClass]=\"{ error: errorMessage }\">{{\n option.label\n }}</span>\n </label>\n </div>\n\n <p *ngIf=\"errorMessage\" class=\"radioBtnsGroup__error\">{{ errorMessage }}</p>\n</div>\n", styles: ["*{margin:0;padding:0;font-size:100%;box-sizing:border-box;font-family:Inter Variable,sans-serif}a{text-decoration:none}a:active,a:hover{outline:0}ul,li{list-style-type:none;margin:0;padding:0}h1,h2,h3,h4,h5,h6{font-size:100%}html,body{box-sizing:border-box;font-size:16px;background-color:#fbfdff}*,*:before,*:after{box-sizing:border-box}:focus{outline:0}img,audio,video{max-width:100%;height:auto}iframe{border:0}textarea{resize:none;overflow:auto;vertical-align:top;box-shadow:none;-webkit-box-shadow:none;-moz-box-shadow:none}input,textarea,select,button{outline:none;border:none;font-size:100%;margin:0}button,input{line-height:normal}input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,textarea:-webkit-autofill,textarea:-webkit-autofill:hover,textarea:-webkit-autofill:focus,select:-webkit-autofill,select:-webkit-autofill:hover,select:-webkit-autofill:focus{-webkit-text-fill-color:rgb(0,0,0);transition:background-color 5000s ease-in-out 0s}table{border-collapse:collapse;border-spacing:0}td,th{padding:0;text-align:left}.radioBtnsGroup{width:100%;display:flex;flex-direction:column;align-items:flex-start;gap:4px;align-self:stretch}.radioBtnsGroup__label{width:100%;display:flex;align-items:flex-start;gap:4px;color:#1d2235;font-size:14px;font-weight:500;line-height:22px;cursor:pointer}.radioBtnsGroup__label span{display:none}.radioBtnsGroup__label.required span{display:flex;color:red;font-weight:700}.radioBtnsGroup__label.error{color:red}.radioBtnsGroup__buttons{width:100%;display:flex;flex-direction:row;align-items:center;flex-wrap:wrap;gap:18px}.radioBtnsGroup__buttons .radioButton{align-self:stretch;display:flex;align-items:center;justify-content:flex-start;gap:8px;cursor:pointer}.radioBtnsGroup__buttons .radioButton:hover .radioButton__toggle{box-shadow:0 0 0 2px #3d87c533;border-color:#084b83}.radioBtnsGroup__buttons .radioButton__toggle{display:flex;align-items:center;justify-content:center;width:15px;height:15px;padding:2px;border-radius:50%;border:1px solid #848482;background:#fff}.radioBtnsGroup__buttons .radioButton__toggle__inside{display:none;width:100%;height:100%;border-radius:50%;background:#084b83}.radioBtnsGroup__buttons .radioButton__toggle.error{border-color:red}.radioBtnsGroup__buttons .radioButton__toggle.error:hover{box-shadow:0 0 0 2px #f003}.radioBtnsGroup__buttons .radioButton__toggle.error .radioButton__toggle__inside{background:red}.radioBtnsGroup__buttons .radioButton input{display:none}.radioBtnsGroup__buttons .radioButton input:checked+.radioButton__toggle{border-color:#084b83}.radioBtnsGroup__buttons .radioButton input:checked+.radioButton__toggle .radioButton__toggle__inside{display:flex}.radioBtnsGroup__buttons .radioButton__label{width:100%;display:flex;align-items:flex-start;gap:4px;color:#1d2235;font-size:14px;font-weight:500;line-height:22px;cursor:pointer;width:auto;font-weight:400}.radioBtnsGroup__buttons .radioButton__label span{display:none}.radioBtnsGroup__buttons .radioButton__label.required span{display:flex;color:red;font-weight:700}.radioBtnsGroup__buttons .radioButton__label.error{color:red}.radioBtnsGroup__error{color:red;font-size:13px}\n"] }]
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { label: [{
type: Input,
args: [{ required: true }]
}], name: [{
type: Input,
args: [{ required: true }]
}], required: [{
type: Input
}], errorMessage: [{
type: Input
}], options: [{
type: Input,
args: [{ required: true }]
}] } });
class ToggleSwitchComponent {
cdr;
id;
value;
label;
checkedChange = new EventEmitter();
checked = false;
disabled = false;
constructor(cdr) {
this.cdr = cdr;
}
// ControlValueAccessor required methods
onChange = (_) => { };
onTouched = () => { };
writeValue(value) {
this.checked = value;
this.cdr.markForCheck();
}
registerOnChange(fn) {
this.onChange = fn;
}
registerOnTouched(fn) {
this.onTouched = fn;
}
setDisabledState(isDisabled) {
this.disabled = isDisabled;
this.cdr.markForCheck();
}
toggle() {
this.checked = !this.checked;
this.onChange(this.checked); // notify Reactive Form of change
this.checkedChange.emit(this.checked);
this.onTouched(); // mark as touched
this.cdr.markForCheck();
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ToggleSwitchComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: ToggleSwitchComponent, isStandalone: true, selector: "cardinal-toggle-switch", inputs: { id: "id", value: "value", label: "label" }, outputs: { checkedChange: "checkedChange" }, providers: [
{
provide: NG_VALUE_ACCESSOR,
useExisting: forwardRef(() => ToggleSwitchComponent),
multi: true,
},
], ngImport: i0, template: "<div class=\"switch\">\n <p *ngIf=\"label\" class=\"switch__label\">{{ label }}</p>\n\n <div class=\"toggleWrapper\" [class.checked]=\"checked\">\n <label class=\"toggle\">\n <input\n type=\"checkbox\"\n [id]=\"id\"\n [name]=\"id\"\n [checked]=\"checked\"\n (change)=\"toggle()\" />\n <span class=\"slider\"></span>\n </label>\n <p (click)=\"toggle()\">{{ value }}</p>\n </div>\n</div>\n", styles: ["*{margin:0;padding:0;font-size:100%;box-sizing:border-box;font-family:Inter Variable,sans-serif}a{text-decoration:none}a:active,a:hover{outline:0}ul,li{list-style-type:none;margin:0;padding:0}h1,h2,h3,h4,h5,h6{font-size:100%}html,body{box-sizing:border-box;font-size:16px;background-color:#fbfdff}*,*:before,*:after{box-sizing:border-box}:focus{outline:0}img,audio,video{max-width:100%;height:auto}iframe{border:0}textarea{resize:none;overflow:auto;vertical-align:top;box-shadow:none;-webkit-box-shadow:none;-moz-box-shadow:none}input,textarea,select,button{outline:none;border:none;font-size:100%;margin:0}button,input{line-height:normal}input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,textarea:-webkit-autofill,textarea:-webkit-autofill:hover,textarea:-webkit-autofill:focus,select:-webkit-autofill,select:-webkit-autofill:hover,select:-webkit-autofill:focus{-webkit-text-fill-color:rgb(0,0,0);transition:background-color 5000s ease-in-out 0s}table{border-collapse:collapse;border-spacing:0}td,th{padding:0;text-align:left}.switch{width:100%;display:flex;flex-direction:column;align-items:flex-start;gap:4px;align-self:stretch}.switch__label{width:100%;display:flex;align-items:flex-start;gap:4px;color:#1d2235;font-size:14px;font-weight:500;line-height:22px;cursor:pointer}.switch__label span{display:none}.switch__label.required span{display:flex;color:red;font-weight:700}.switch__label.error{color:red}.switch .toggleWrapper{display:flex;padding:4px 0;align-items:center;gap:12px;align-self:stretch}.switch .toggleWrapper p{width:100%;display:flex;align-items:flex-start;gap:4px;color:#1d2235;font-size:14px;font-weight:500;line-height:22px;cursor:pointer}.switch .toggleWrapper p span{display:none}.switch .toggleWrapper p.required span{display:flex;color:red;font-weight:700}.switch .toggleWrapper p.error{color:red}.switch .toggleWrapper .toggle{position:relative;display:inline-block;width:46px;height:24px}.switch .toggleWrapper .toggle .slider{position:absolute;cursor:pointer;inset:0;background-color:#cad0d5;border:1px solid transparent;transition:.4s;border-radius:34px}.switch .toggleWrapper .toggle .slider:hover{border-color:#084b83;box-shadow:0 0 0 2px #3d87c533}.switch .toggleWrapper .toggle .slider:before{position:absolute;content:\"\";height:18px;width:18px;left:2px;bottom:2px;background-color:#fff;transition:.4s;border-radius:50%}.switch .toggleWrapper .toggle input{opacity:0;width:0;height:0}.switch .toggleWrapper .toggle input:checked+.slider{background-color:#084b83}.switch .toggleWrapper .toggle input:checked+.slider:hover{box-shadow:0 0 0 2px #3d87c533}.switch .toggleWrapper .toggle input:focus+.slider{box-shadow:0 0 1px #084b83}.switch .toggleWrapper .toggle input:checked+.slider:before{-webkit-transform:translateX(20px);-ms-transform:translateX(20px);transform:translate(20px)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ToggleSwitchComponent, decorators: [{
type: Component,
args: [{ selector: 'cardinal-toggle-switch', standalone: true, imports: [CommonModule], providers: [
{
provide: NG_VALUE_ACCESSOR,
useExisting: forwardRef(() => ToggleSwitchComponent),
multi: true,
},
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"switch\">\n <p *ngIf=\"label\" class=\"switch__label\">{{ label }}</p>\n\n <div class=\"toggleWrapper\" [class.checked]=\"checked\">\n <label class=\"toggle\">\n <input\n type=\"checkbox\"\n [id]=\"id\"\n [name]=\"id\"\n [checked]=\"checked\"\n (change)=\"toggle()\" />\n <span class=\"slider\"></span>\n </label>\n <p (click)=\"toggle()\">{{ value }}</p>\n </div>\n</div>\n", styles: ["*{margin:0;padding:0;font-size:100%;box-sizing:border-box;font-family:Inter Variable,sans-serif}a{text-decoration:none}a:active,a:hover{outline:0}ul,li{list-style-type:none;margin:0;padding:0}h1,h2,h3,h4,h5,h6{font-size:100%}html,body{box-sizing:border-box;font-size:16px;background-color:#fbfdff}*,*:before,*:after{box-sizing:border-box}:focus{outline:0}img,audio,video{max-width:100%;height:auto}iframe{border:0}textarea{resize:none;overflow:auto;vertical-align:top;box-shadow:none;-webkit-box-shadow:none;-moz-box-shadow:none}input,textarea,select,button{outline:none;border:none;font-size:100%;margin:0}button,input{line-height:normal}input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,textarea:-webkit-autofill,textarea:-webkit-autofill:hover,textarea:-webkit-autofill:focus,select:-webkit-autofill,select:-webkit-autofill:hover,select:-webkit-autofill:focus{-webkit-text-fill-color:rgb(0,0,0);transition:background-color 5000s ease-in-out 0s}table{border-collapse:collapse;border-spacing:0}td,th{padding:0;text-align:left}.switch{width:100%;display:flex;flex-direction:column;align-items:flex-start;gap:4px;align-self:stretch}.switch__label{width:100%;display:flex;align-items:flex-start;gap:4px;color:#1d2235;font-size:14px;font-weight:500;line-height:22px;cursor:pointer}.switch__label span{display:none}.switch__label.required span{display:flex;color:red;font-weight:700}.switch__label.error{color:red}.switch .toggleWrapper{display:flex;padding:4px 0;align-items:center;gap:12px;align-self:stretch}.switch .toggleWrapper p{width:100%;display:flex;align-items:flex-start;gap:4px;color:#1d2235;font-size:14px;font-weight:500;line-height:22px;cursor:pointer}.switch .toggleWrapper p span{display:none}.switch .toggleWrapper p.required span{display:flex;color:red;font-weight:700}.switch .toggleWrapper p.error{color:red}.switch .toggleWrapper .toggle{position:relative;display:inline-block;width:46px;height:24px}.switch .toggleWrapper .toggle .slider{position:absolute;cursor:pointer;inset:0;background-color:#cad0d5;border:1px solid transparent;transition:.4s;border-radius:34px}.switch .toggleWrapper .toggle .slider:hover{border-color:#084b83;box-shadow:0 0 0 2px #3d87c533}.switch .toggleWrapper .toggle .slider:before{position:absolute;content:\"\";height:18px;width:18px;left:2px;bottom:2px;background-color:#fff;transition:.4s;border-radius:50%}.switch .toggleWrapper .toggle input{opacity:0;width:0;height:0}.switch .toggleWrapper .toggle input:checked+.slider{background-color:#084b83}.switch .toggleWrapper .toggle input:checked+.slider:hover{box-shadow:0 0 0 2px #3d87c533}.switch .toggleWrapper .toggle input:focus+.slider{box-shadow:0 0 1px #084b83}.switch .toggleWrapper .toggle input:checked+.slider:before{-webkit-transform:translateX(20px);-ms-transform:translateX(20px);transform:translate(20px)}\n"] }]
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { id: [{
type: Input,
args: [{ required: true }]
}], value: [{
type: Input,
args: [{ required: true }]
}], label: [{
type: Input
}], checkedChange: [{
type: Output
}] } });
class TextareaInputComponent {
cdr;
label;
id;
required = false;
disabled = false;
errorMessage;
autofocus = false;
textareaRef;
constructor(cdr) {
this.cdr = cdr;
}
value = '';
onChange = (_) => { };
onTouched = () => { };
writeValue(value) {
this.value = value ?? '';
this.cdr.markForCheck();
}
registerOnChange(fn) {
this.onChange = fn;
}
registerOnTouched(fn) {
this.onTouched = fn;
}
setDisabledState(isDisabled) {
this.disabled = isDisabled;
this.cdr.markForCheck();
}
ngAfterViewInit() {
if (this.autofocus) {
setTimeout(() => this.textareaRef.nativeElement.focus());
this.cdr.markForCheck();
}
}
onInputChange(event) {
const target = event.target;
this.value = target.value;
this.onChange(this.value);
this.onTouched();
this.cdr.markForCheck();
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: TextareaInputComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: TextareaInputComponent, isStandalone: true, selector: "cardinal-textarea-input", inputs: { label: "label", id: "id", required: "required", disabled: "disabled", errorMessage: "errorMessage", autofocus: "autofocus" }, providers: [
{
provide: NG_VALUE_ACCESSOR,
useExisting: forwardRef(() => TextareaInputComponent),
multi: true,
},
], viewQueries: [{ propertyName: "textareaRef", first: true, predicate: ["textareaRef"], descendants: true }], ngImport: i0, template: "<div class=\"textareaInput\">\n <label [for]=\"id\" [ngClass]=\"{ required: required, error: errorMessage }\">\n <span *ngIf=\"required\">*</span>{{ label }}\n </label>\n <textarea\n #textareaRef\n [id]=\"id\"\n [name]=\"id\"\n [attr.placeholder]=\"label\"\n [disabled]=\"disabled\"\n [ngClass]=\"{ disabled: disabled }\"\n rows=\"2\"\n [(ngModel)]=\"value\"\n (input)=\"onInputChange($event)\"></textarea>\n <p class=\"textareaInput__error\" *ngIf=\"errorMessage\">\n {{ errorMessage }}\n </p>\n</div>\n", styles: ["*{margin:0;padding:0;font-size:100%;box-sizing:border-box;font-family:Inter Variable,sans-serif}a{text-decoration:none}a:active,a:hover{outline:0}ul,li{list-style-type:none;margin:0;padding:0}h1,h2,h3,h4,h5,h6{font-size:100%}html,body{box-sizing:border-box;font-size:16px;background-color:#fbfdff}*,*:before,*:after{box-sizing:border-box}:focus{outline:0}img,audio,video{max-width:100%;height:auto}iframe{border:0}textarea{resize:none;overflow:auto;vertical-align:top;box-shadow:none;-webkit-box-shadow:none;-moz-box-shadow:none}input,textarea,select,button{outline:none;border:none;font-size:100%;margin:0}button,input{line-height:normal}input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,textarea:-webkit-autofill,textarea:-webkit-autofill:hover,textarea:-webkit-autofill:focus,select:-webkit-autofill,select:-webkit-autofill:hover,select:-webkit-autofill:focus{-webkit-text-fill-color:rgb(0,0,0);transition:background-color 5000s ease-in-out 0s}table{border-collapse:collapse;border-spacing:0}td,th{padding:0;text-align:left}.textareaInput{width:100%;display:flex;flex-direction:column;align-items:flex-start;gap:4px;align-self:stretch}.textareaInput label{width:100%;display:flex;align-items:flex-start;gap:4px;color:#1d2235;font-size:14px;font-weight:500;line-height:22px;cursor:pointer}.textareaInput label span{display:none}.textareaInput label.required span{display:flex;color:red;font-weight:700}.textareaInput label.error{color:red}.textareaInput textarea{width:100%;display:flex;height:32px;padding:5px 12px;align-items:center;gap:4px;align-self:stretch;cursor:pointer;border-radius:6px;border:1px solid #cad0d5;background:#fff;color:#1d2235;font-family:Inter Variable,sans-serif;font-size:14px;font-weight:400;line-height:22px;height:auto}.textareaInput textarea::placeholder{color:#9ca8b2}.textareaInput textarea:hover,.textareaInput textarea:focus{border-color:#084b83}.textareaInput textarea:focus{box-shadow:0 0 0 2px #3d87c533}.textareaInput textarea.disabled{cursor:not-allowed;background-color:#f5f5f5;border-color:#cad0d5;opacity:.7}.textareaInput textarea.disabled:hover{border-color:#cad0d5}.textareaInput textarea.error{border-color:red;box-shadow:0 0 0 2px #f003;color:red}.textareaInput textarea.error::placeholder{color:#ff000080}.textareaInput__error{color:red;font-size:13px}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: TextareaInputComponent, decorators: [{
type: Component,
args: [{ selector: 'cardinal-textarea-input', standalone: true, imports: [NgClass, NgIf, FormsModule], providers: [
{
provide: NG_VALUE_ACCESSOR,
useExisting: forwardRef(() => TextareaInputComponent),
multi: true,
},
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"textareaInput\">\n <label [for]=\"id\" [ngClass]=\"{ required: required, error: errorMessage }\">\n <span *ngIf=\"required\">*</span>{{ label }}\n </label>\n <textarea\n #textareaRef\n [id]=\"id\"\n [name]=\"id\"\n [attr.placeholder]=\"label\"\n [disabled]=\"disabled\"\n [ngClass]=\"{ disabled: disabled }\"\n rows=\"2\"\n [(ngModel)]=\"value\"\n (input)=\"onInputChange($event)\"></textarea>\n <p class=\"textareaInput__error\" *ngIf=\"errorMessage\">\n {{ errorMessage }}\n </p>\n</div>\n", styles: ["*{margin:0;padding:0;font-size:100%;box-sizing:border-box;font-family:Inter Variable,sans-serif}a{text-decoration:none}a:active,a:hover{outline:0}ul,li{list-style-type:none;margin:0;padding:0}h1,h2,h3,h4,h5,h6{font-size:100%}html,body{box-sizing:border-box;font-size:16px;background-color:#fbfdff}*,*:before,*:after{box-sizing:border-box}:focus{outline:0}img,audio,video{max-width:100%;height:auto}iframe{border:0}textarea{resize:none;overflow:auto;vertical-align:top;box-shadow:none;-webkit-box-shadow:none;-moz-box-shadow:none}input,textarea,select,button{outline:none;border:none;font-size:100%;margin:0}button,input{line-height:normal}input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,textarea:-webkit-autofill,textarea:-webkit-autofill:hover,textarea:-webkit-autofill:focus,select:-webkit-autofill,select:-webkit-autofill:hover,select:-webkit-autofill:focus{-webkit-text-fill-color:rgb(0,0,0);transition:background-color 5000s ease-in-out 0s}table{border-collapse:collapse;border-spacing:0}td,th{padding:0;text-align:left}.textareaInput{width:100%;display:flex;flex-direction:column;align-items:flex-start;gap:4px;align-self:stretch}.textareaInput label{width:100%;display:flex;align-items:flex-start;gap:4px;color:#1d2235;font-size:14px;font-weight:500;line-height:22px;cursor:pointer}.textareaInput label span{display:none}.textareaInput label.required span{display:flex;color:red;font-weight:700}.textareaInput label.error{color:red}.textareaInput textarea{width:100%;display:flex;height:32px;padding:5px 12px;align-items:center;gap:4px;align-self:stretch;cursor:pointer;border-radius:6px;border:1px solid #cad0d5;background:#fff;color:#1d2235;font-family:Inter Variable,sans-serif;font-size:14px;font-weight:400;line-height:22px;height:auto}.textareaInput textarea::placeholder{color:#9ca8b2}.textareaInput textarea:hover,.textareaInput textarea:focus{border-color:#084b83}.textareaInput textarea:focus{box-shadow:0 0 0 2px #3d87c533}.textareaInput textarea.disabled{cursor:not-allowed;background-color:#f5f5f5;border-color:#cad0d5;opacity:.7}.textareaInput textarea.disabled:hover{border-color:#cad0d5}.textareaInput textarea.error{border-color:red;box-shadow:0 0 0 2px #f003;color:red}.textareaInput textarea.error::placeholder{color:#ff000080}.textareaInput__error{color:red;font-size:13px}\n"] }]
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { label: [{
type: Input,
args: [{ required: true }]
}], id: [{
type: Input,
args: [{ required: true }]
}], required: [{
type: Input
}], disabled: [{
type: Input
}], errorMessage: [{
type: Input
}], autofocus: [{
type: Input
}], textareaRef: [{
type: ViewChild,
args: ['textareaRef']
}] } });
class CloseIcnComponent {
color = 'currentColor';
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: CloseIcnComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: CloseIcnComponent, isStandalone: true, selector: "cardinal-close-icn", inputs: { color: "color" }, ngImport: i0, template: "<svg\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M13.1404 2.32697C13.1407 2.32697 13.1411 2.32732 13.1418 2.32804L14.172 3.3584C14.1727 3.35893 14.1729 3.35929 14.1731 3.35982C14.1732 3.36018 14.1732 3.36054 14.1731 3.3609C14.1731 3.36143 14.1727 3.36179 14.172 3.3625L9.0345 8.5L14.172 13.6375C14.1727 13.6382 14.1729 13.6386 14.1731 13.6391C14.1732 13.6395 14.1732 13.64 14.1731 13.6404C14.1731 13.6407 14.1727 13.6411 14.172 13.6418L13.1416 14.672C13.1411 14.6727 13.1407 14.6729 13.1404 14.673C13.14 14.6732 13.1395 14.6732 13.1391 14.673C13.1386 14.673 13.1382 14.6727 13.1375 14.672L8.00003 9.53447L2.86253 14.672C2.86182 14.6727 2.86146 14.6729 2.86093 14.673C2.86052 14.6732 2.86008 14.6732 2.85968 14.673C2.85932 14.673 2.85896 14.6727 2.85825 14.672L1.82807 13.6416C1.82735 13.6411 1.82718 13.6407 1.827 13.6404C1.82687 13.64 1.82687 13.6395 1.827 13.6391C1.827 13.6386 1.82735 13.6382 1.82807 13.6375L6.96557 8.5L1.82807 3.3625C1.82735 3.36179 1.82718 3.36143 1.827 3.3609C1.82687 3.36049 1.82687 3.36005 1.827 3.35965C1.827 3.35929 1.82735 3.35893 1.82807 3.35822L2.85843 2.32804C2.85896 2.32732 2.85932 2.32715 2.85968 2.32697C2.86008 2.32684 2.86052 2.32684 2.86093 2.32697C2.86146 2.32697 2.86182 2.32732 2.86253 2.32804L8.00003 7.46554L13.1375 2.32804C13.1382 2.32732 13.1386 2.32715 13.1391 2.32697C13.1395 2.32684 13.14 2.32684 13.1404 2.32697Z\"\n [attr.fill]=\"color\" />\n</svg>\n", styles: [""], changeDetection: i0.ChangeDetectionStrategy.OnPush });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: CloseIcnComponent, decorators: [{
type: Component,
args: [{ selector: 'cardinal-close-icn', imports: [], changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, template: "<svg\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M13.1404 2.32697C13.1407 2.32697 13.1411 2.32732 13.1418 2.32804L14.172 3.3584C14.1727 3.35893 14.1729 3.35929 14.1731 3.35982C14.1732 3.36018 14.1732 3.36054 14.1731 3.3609C14.1731 3.36143 14.1727 3.36179 14.172 3.3625L9.0345 8.5L14.172 13.6375C14.1727 13.6382 14.1729 13.6386 14.1731 13.6391C14.1732 13.6395 14.1732 13.64 14.1731 13.6404C14.1731 13.6407 14.1727 13.6411 14.172 13.6418L13.1416 14.672C13.1411 14.6727 13.1407 14.6729 13.1404 14.673C13.14 14.6732 13.1395 14.6732 13.1391 14.673C13.1386 14.673 13.1382 14.6727 13.1375 14.672L8.00003 9.53447L2.86253 14.672C2.86182 14.6727 2.86146 14.6729 2.86093 14.673C2.86052 14.6732 2.86008 14.6732 2.85968 14.673C2.85932 14.673 2.85896 14.6727 2.85825 14.672L1.82807 13.6416C1.82735 13.6411 1.82718 13.6407 1.827 13.6404C1.82687 13.64 1.82687 13.6395 1.827 13.6391C1.827 13.6386 1.82735 13.6382 1.82807 13.6375L6.96557 8.5L1.82807 3.3625C1.82735 3.36179 1.82718 3.36143 1.827 3.3609C1.82687 3.36049 1.82687 3.36005 1.827 3.35965C1.827 3.35929 1.82735 3.35893 1.82807 3.35822L2.85843 2.32804C2.85896 2.32732 2.85932 2.32715 2.85968 2.32697C2.86008 2.32684 2.86052 2.32684 2.86093 2.32697C2.86146 2.32697 2.86182 2.32732 2.86253 2.32804L8.00003 7.46554L13.1375 2.32804C13.1382 2.32732 13.1386 2.32715 13.1391 2.32697C13.1395 2.32684 13.14 2.32684 13.1404 2.32697Z\"\n [attr.fill]=\"color\" />\n</svg>\n" }]
}], propDecorators: { color: [{
type: Input,
args: [{ required: true }]
}] } });
var durationTimeUnitsEnum;
(function (durationTimeUnitsEnum) {
durationTimeUnitsEnum["DAY"] = "DAY";
durationTimeUnitsEnum["WEEK"] = "WEEK";
})(durationTimeUnitsEnum || (durationTimeUnitsEnum = {}));
const getDurationTimeUnits = (t) => [
{
value: durationTimeUnitsEnum.DAY,
label: t('prescriptionDurationHelper.durationUnits.day'),
},
{
value: durationTimeUnitsEnum.WEEK,
label: t('prescriptionDurationHelper.durationUnits.week'),
},
];
var periodicityTimeUnitsEnum;
(function (periodicityTimeUnitsEnum) {
periodicityTimeUnitsEnum["NONE"] = "0";
periodicityTimeUnitsEnum["WEEK"] = "7";
periodicityTimeUnitsEnum["TWO_WEEKS"] = "14";
periodicityTimeUnitsEnum["THREE_WEEKS"] = "21";
periodicityTimeUnitsEnum["NUMBER_OF_DAYS"] = "1";
})(periodicityTimeUnitsEnum || (periodicityTimeUnitsEnum = {}));
const getPeriodicityTimeUnits = (t) => [
{
value: periodicityTimeUnitsEnum.NONE,
label: t('prescriptionDurationHelper.periodicityUnits.none'),
},
{
value: periodicityTimeUnitsEnum.WEEK,
label: t('prescriptionDurationHelper.periodicityUnits.week'),
},
{
value: periodicityTimeUnitsEnum.TWO_WEEKS,
label: t('prescriptionDurationHelper.periodicityUnits.twoWeeks'),
},
{
value: periodicityTimeUnitsEnum.THREE_WEEKS,
label: t('prescriptionDurationHelper.periodicityUnits.threeWeeks'),
},
{
value: periodicityTimeUnitsEnum.NUMBER_OF_DAYS,
label: t('prescriptionDurationHelper.periodicityUnits.numberOfDays'),
},
];
const getDurationInDays = (timeUnit, value) => {
if (timeUnit === durationTimeUnitsEnum.DAY) {
return value;
}
else if (timeUnit === durationTimeUnitsEnum.WEEK) {
return value * 7;
}
// Handle unexpected values of timeUnit (optional but recommended)
throw new Error(`Invalid time unit: ${timeUnit}`);
};
const getDurationFromDays = (numberOfDays) => {
if (numberOfDays % 7 === 0) {
return {
duration: numberOfDays / 7,
durationTimeUnit: durationTimeUnitsEnum.WEEK,
};
}
else {
return {
duration: numberOfDays,
durationTimeUnit: durationTimeUnitsEnum.DAY,
};
}
};
function getPractitionerVisibilityOptions(t) {
return [
{
value: 'open',
label: t('prescriptionVisibilityHelper.practitionerVisibility.open'),
},
{
value: 'locked',
label: t('prescriptionVisibilityHelper.practitionerVisibility.locked'),
},
{
value: 'gmd_prescriber',
label: t('prescriptionVisibilityHelper.practitionerVisibility.gmd_prescriber'),
},
];
}
function getPharmacistVisibilityOptions(t) {
return [
{
value: null,
label: t('prescriptionVisibilityHelper.pharmacistVisibility.null'),
},
{
value: 'locked',
label: t('prescriptionVisibilityHelper.pharmacistVisibility.locked'),
},
];
}
// TODO: Replace with actual vendor information and package details
const vendor = {
vendorEmail: 'support@test.be',
vendorName: 'vendorName',
vendorPhone: '+3200000000',
};
const usedPackage = {
packageName: 'test[test/1.0]-freehealth-connector',
packageVersion: '1.0-freehealth-connector',
};
class FhcService {
certificateService;
translationService;
language;
constructor(certificateService, translationService) {
this.certificateService = certificateService;
this.translationService = translationService;
this.language = this.translationService.getCurrentLanguage();
}
// Method to create a Free Health Connector Code
createFhcFromCode(type, code, version) {
return new Code({
id: `${type}:${code}:${version ?? '1.0'}`,
type,
code,
version: version ?? '1.0',
});
}
// Create the prescription request
makePrescriptionRequest(samVersion, prescriber, patient, prescribedMedication) {
return new PrescriptionRequest({
medications: [prescribedMedication.medication],
patient: {
firstName: patient.firstName,
lastName: patient.lastName,
ssin: patient.ssin,
dateOfBirth: patient.dateOfBirth,
},
hcp: {
firstName: prescriber.firstName,
lastName: prescriber.lastName,
ssin: prescriber.ssin,
nihii: prescriber.nihii,
addresses: prescriber.addresses,
},
feedback: false,
vendorName: vendor.vendorName,
vendorEmail: vendor.vendorEmail,
vendorPhone: vendor.vendorPhone,
packageName: usedPackage.packageName,
packageVersion: usedPackage.packageVersion,
vision: prescribedMedication.pharmacistVisibility,
visionOthers: prescribedMedication.prescriberVisibility,
samVersion: samVersion.version,
deliveryDate: prescribedMedication.medication.beginMoment ?? dateEncode(new Date()),
expirationDate: prescribedMedication.medication.beginMoment ??
dateEncode(new Date(+new Date() + 1000 * 3600 * 24 * 90)),
lang: this.language,
});
}
async sendRecipe(samVersion, prescriber, patient, prescribedMedication, passphrase, cache) {
const prescription = this.makePrescriptionRequest(samVersion, prescriber, patient, prescribedMedication);
if (!prescriber || !prescriber.ssin || !prescriber.nihii) {
throw new Error('Missing prescriber information');
}
// Load and decrypt keystore
const keystore = await this.certificateService.loadAndDecryptCertificate(passphrase, prescriber.ssin);
if (!keystore) {
throw new Error('Cannot obtain keystore');
}
const url = 'https://fhcacc.icure.cloud';
const sts = new fhcStsApi(url, []);
const recipe = new fhcRecipeApi(url, []);
let storeKey = `keystore.${prescriber.ssin}`;
const keystoreUuid = (await cache.get(storeKey)) ??
(await sts
.uploadKeystoreUsingPOST(keystore)
.then(({ uuid }) => {
if (!uuid) {
throw new Error('Cannot obtain keystore uuid');
}
return cache.put(storeKey, uuid);
}));
const stsToken = await sts.requestTokenUsingGET(passphrase, prescriber.ssin, keystoreUuid, 'doctor', await cache.get(storeKey));
if (!stsToken.tokenId) {
console.error('Cannot obtain token');
}
return Promise.all(prescription.medications?.map(m => recipe.createPrescriptionV4UsingPOST(keystoreUuid, stsToken.tokenId, passphrase, 'persphysician', prescriber.nihii, prescriber.ssin, `${prescriber.firstName} ${prescriber.lastName}`, 'iCure', '1', new PrescriptionRequest({ ...prescription, medications: [m] }))) ?? []);
}
async verifyCertificateWithSts(prescriber, passphrase, cache) {
if (!prescriber?.ssin || !prescriber?.nihii) {
return {
status: false,
error: {
en: 'Missing prescriber information',
fr: 'Informations du prescripteur manquantes',
nl: 'Ontbrekende voorschrijversinformatie',
de: 'Fehlende Verschreiberinformationen',
},
};
}
try {
const keystore = await this.certificateService.loadAndDecryptCertificate(passphrase, prescriber.ssin);
if (!keystore) {
return {
status: false,
error: {
en: 'Cannot obtain the certificat',
fr: 'Impossible d’obtenir le certificat',
nl: 'Certificaat kan niet worden verkregen',
de: 'Zertifikat kann nicht abgerufen werden',
},
};
}
const url = 'https://fhcacc.icure.cloud';
const sts = new fhcStsApi(url, []);
const storeKey = `keystore.${prescriber.ssin}`;
const keystoreUuid = await sts
.uploadKeystoreUsingPOST(keystore)
.then(({ uuid }) => {
if (!uuid) {
throw new Error('Cannot obtain keystore uuid');
}
return cache.put(storeKey, uuid);
});
const token = await cache.get(storeKey);
const stsToken = await sts.requestTokenUsingGET(passphrase, prescriber.ssin, keystoreUuid, 'doctor', token);
return { status: !!stsToken.tokenId };
}
catch (error) {
console.error('Certificate verification error:', error);
return {
status: false,
error: {
en: error?.message || 'Unknown error occurred',
fr: error?.message || 'Une erreur inconnue est survenue',
nl: error?.message || 'Er is een onbekende fout opgetreden',
de: error?.message || 'Ein unbekannter Fehler ist aufgetreten',
},
};
}
}
// Validate the certificate by loading and decrypting it, then verifying with FHC
async validateDecryptedCertificate(hcp, passphrase, indexedDbTokenStore) {
try {
await this.certificateService.loadAndDecryptCertificate(passphrase, hcp.ssin);
const res = await this.verifyCertificateWithSts(hcp, passphrase, indexedDbTokenStore);
return { status: res.status, error: res.error };
}
catch {
return { status: false };
}
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: FhcService, deps: [{ token: UploadPractitionerCertificateService }, { token: TranslationService }], target: i0.ɵɵFactoryTarget.Injectable });
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: FhcService, providedIn: 'root' });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: FhcService, decorators: [{
type: Injectable,
args: [{
providedIn: 'root',
}]
}], ctorParameters: () => [{ type: UploadPractitionerCertificateService }, { type: TranslationService }] });
class CreatePrescriptionService {
fhcService;
constructor(fhcService) {
this.fhcService = fhcService;
}
createPrescribedMedication(formValues, prescribedMedication, medicationToPrescribe) {
if (prescribedMedication) {
return this.createSinglePrescribedMedication(prescribedMedication, formValues);
}
else if (medicationToPrescribe) {
return this.createMultiplePrescribedMedications(formValues, medicationToPrescribe);
}
else {
return [];
}
}
createSinglePrescribedMedication(prescribedMedication, formValues) {
return [
{
...prescribedMedication,
medication: new Medication({
...prescribedMedication.medication,
beginMoment: offsetDate(parseInt(formValues.treatmentStartDate?.replace(/-/g, '')), formValues.periodicityTimeUnit
? parseInt(formValues.periodicityTimeUnit) *
(formValues.periodicityDaysNumber ?? 1)
: 0),
endMoment: offsetDate(parseInt(formValues.executableUntil?.replace(/-/g, '')), formValues.periodicityTimeUnit
? parseInt(formValues.periodicityTimeUnit) *
(formValues.periodicityDaysNumber ?? 1)
: 0),
duration: new Duration({
unit: this.fhcService.createFhcFromCode('CD-TIMEUNIT', 'D'),
value: getDurationInDays(formValues.durationTimeUnit, formValues.duration),
}),
instructionForPatient: formValues.dosage,
recipeInstructionForPatient: formValues.recipeInstructionForPatient,
instructionsForReimbursement: formValues.instructionsForReimbursement,
substitutionAllowed: formValues.substitutionAllowed,
}),
prescriberVisibility: formValues.prescriberVisibility,
pharmacistVisibility: formValues.pharmacistVisibility,
},
];
}
createMultiplePrescribedMedications(formValues, medicationToPrescribe) {
const prescriptionsNumber = formValues.prescriptionsNumber ?? 1;
return Array.from({ length: prescriptionsNumber }, (_, idx) => {
return {
uuid: v4(),
medication: this.createMedicationForPrescription(formValues, medicationToPrescribe, idx),
prescriberVisibility: formValues.prescriberVisibility,
pharmacistVisibility: formValues.pharmacistVisibility,
};
});
}
createMedicationForPrescription(formValues, medicationToPrescribe, idx) {
const medicationData = this.determineMedicationData(medicationToPrescribe);
return new Medication({
...medicationData,
beginMoment: offsetDate(parseInt(formValues.treatmentStartDate?.replace(/-/g, '')), formValues.periodicityTimeUnit
? parseInt(formValues.periodicityTimeUnit) *
(formValues.periodicityDaysNumber ?? 1) *
idx
: 0),
endMoment: offsetDate(parseInt(formValues.executableUntil?.replace(/-/g, '')), formValues.periodicityTimeUnit
? parseInt(formValues.periodicityTimeUnit) *
(formValues.periodicityDaysNumber ?? 1) *
idx
: 0),
duration: new Duration({
unit: this.fhcService.createFhcFromCode('CD-TIMEUNIT', 'D'),
value: getDurationInDays(formValues.durationTimeUnit, formValues.duration),
}),
instructionForPatient: formValues.dosage,
recipeInstructionForPatient: formValues.recipeInstructionForPatient,
instructionsForReimbursement: formValues.instructionsForReimbursement,
substitutionAllowed: formValues.substitutionAllowed,
});
}
determineMedicationData(medicationToPrescribe) {
if (medicationToPrescribe?.ampId &&
!medicationToPrescribe.genericPrescriptionRequired &&
medicationToPrescribe.cnk) {
return {
medicinalProduct: new Medicinalproduct({
samId: medicationToPrescribe.dmppProductId,
intendedcds: [
this.fhcService.createFhcFromCode('CD-DRUG-CNK', medicationToPrescribe.cnk),
],
intendedname: medicationToPrescribe.intendedName,
}),
};
}
else if (medicationToPrescribe?.vmpGroupId) {
return {
substanceProduct: new Substanceproduct({
samId: medicationToPrescribe.vmpGroupId,
intendedcds: [
this.fhcService.createFhcFromCode('CD_VMPGROUP', medicationToPrescribe.vmpGroupId),
],
intendedname: medicationToPrescribe.vmpTitle ?? medicationToPrescribe.title,
}),
};
}
else {
return { compoundPrescription: medicationToPrescribe.title };
}
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: CreatePrescriptionService, deps: [{ token: FhcService }], target: i0.ɵɵFactoryTarget.Injectable });
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: CreatePrescriptionService, providedIn: 'root' });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: CreatePrescriptionService, decorators: [{
type: Injectable,
args: [{
providedIn: 'root',
}]
}], ctorParameters: () => [{ type: FhcService }] });
class PrescriptionModalComponent {
fb;
createPrescriptionService;
translationService;
cdr;
modalTitle;
medicationToPrescribe;
prescriptionToModify;
handleSubmit = new EventEmitter();
handleCancel = new EventEmitter();
constructor(fb, createPrescriptionService, translationService, cdr) {
this.fb = fb;
this.createPrescriptionService = createPrescriptionService;
this.translationService = translationService;
this.cdr = cdr;
}
t = (key) => {
return this.translationService.translate(key);
};
language = 'fr';
prescriptionForm;
subscriptions = [];
practitionerVisibilityOptions = [];
pharmacistVisibilityOptions = [];
reimbursementOptions = [];
durationTimeUnits = [];
periodicityTimeUnits = [];
recipeInstructionForPatientLabel;
selectedReimbursementLabel;
selectedPractitionerVisibilityLabel;
selectedPharmacistVisibilityLabel;
focusedDosageIndex = -1;
dosageSuggestions = [];
disableHover = false;
ngOnInit() {
this.language = this.translationService.getCurrentLanguage();
this.practitionerVisibilityOptions = getPractitionerVisibilityOptions(this.t);
this.pharmacistVisibilityOptions = getPharmacistVisibilityOptions(this.t);
this.reimbursementOptions = getReimbursementOptions(this.t);
this.durationTimeUnits = getDurationTimeUnits(this.t);
this.periodicityTimeUnits = getPeriodicityTimeUnits(this.t);
this.selectedPractitionerVisibilityLabel =
this.practitionerVisibilityOptions[0].label;
this.selectedPharmacistVisibilityLabel =
this.pharmacistVisibilityOptions[0].label;
this.selectedReimbursementLabel = this.reimbursementOptions[0].label;
this.initForm();
this.subscribeToValidationChanges();
this.subscribeToLabelChanges();
this.setupDosageSuggestionLogic();
}
ngOnChanges(changes) {
if (changes['prescriptionToModify'] &&
changes['prescriptionToModify'].currentValue !==
changes['prescriptionToModify'].previousValue) {
this.initForm();
this.cdr.markForCheck();
}
}
ngOnDestroy() {
this.subscriptions.forEach(sub => sub.unsubscribe());
}
getInitialFormValues() {
const medicationTitleValue = this.medicationToPrescribe?.title ??
this.prescriptionToModify?.medication.medicinalProduct?.intendedname ??
this.prescriptionToModify?.medication.substanceProduct?.intendedname ??
this.prescriptionToModify?.medication.compoundPrescription ??
'';
return {
medicationTitle: {
value: medicationTitleValue,
disabled: true,
},
dosage: this.prescriptionToModify?.medication.instructionForPatient ?? '',
duration: getDurationFromDays(this.prescriptionToModify?.medication.duration?.value ?? 1).duration ?? 1,
durationTimeUnit: getDurationFromDays(this.prescriptionToModify?.medication.duration?.value ?? 1).durationTimeUnit ?? this.durationTimeUnits[0]?.value,
treatmentStartDate: getTreatmentStartDate(this.prescriptionToModify),
executableUntil: getExecutableUntilDate(this.prescriptionToModify),
prescriptionsNumber: 1,
substitutionAllowed: this.prescriptionToModify?.medication.substitutionAllowed ?? false,
showExtraFields: false,
periodicityTimeUnit: this.periodicityTimeUnits[0]?.value,
periodicityDaysNumber: 1,
recipeInstructionForPatient: this.prescriptionToModify?.medication.recipeInstructionForPatient,
instructionsForReimbursement: this.prescriptionToModify?.medication.instructionsForReimbursement ??
this.reimbursementOptions?.[0]?.value,
prescriberVisibility: this.prescriptionToModify?.prescriberVisibility ??
this.practitionerVisibilityOptions?.[0]?.value,
pharmacistVisibility: this.prescriptionToModify?.pharmacistVisibility ??
this.pharmacistVisibilityOptions?.[0]?.value,
};
}
initForm() {
this.prescriptionForm = this.fb.group(this.getInitialFormValues());
this.recipeInstructionForPatientLabel =
this.prescriptionToModify?.medication.recipeInstructionForPatient ??
this.t('prescription.form.instructionLabelNone');
if (this.prescriptionToModify?.medication.instructionsForReimbursement) {
this.selectedReimbursementLabel = this.getLabel(this.reimbursementOptions, this.prescriptionToModify.medication.instructionsForReimbursement);
}
if (this.prescriptionToModify?.prescriberVisibility) {
this.selectedPractitionerVisibilityLabel = this.getLabel(this.practitionerVisibilityOptions, this.prescriptionToModify.prescriberVisibility);
}
if (this.prescriptionToModify?.pharmacistVisibility) {
this.selectedPharmacistVisibilityLabel = this.getLabel(this.pharmacistVisibilityOptions, this.prescriptionToModify.pharmacistVisibility);
}
this.cdr.markForCheck();
}
getLabel(options, value) {
return (options.find(opt => opt.value === value)?.label ??
this.t('prescription.form.instructionLabelNone'));
}
getControl(name) {
return this.prescriptionForm.get(name);
}
getErrorMessage(fieldName) {
const control = this.getControl(fieldName);
if (control?.valid || !control?.touched || control?.disabled)
return undefined;
if (control?.errors?.['required'])
return this.t('prescription.form.fieldRequired');
return this.t('prescription.form.fieldInvalid');
}
onSubmit() {
if (this.prescriptionForm.invalid) {
this.prescriptionForm.markAllAsTouched();
return;
}
const prescribedMedications = this.createPrescriptionService.createPrescribedMedication(this.prescriptionForm.value, this.prescriptionToModify, this.medicationToPrescribe);
this.handleSubmit.emit(prescribedMedications);
this.prescriptionForm.reset();
// this.cdr.markForCheck();
}
onCancel() {
this.handleCancel.emit();
this.prescriptionForm.reset();
this.cdr.markForCheck();
}
subscribeToValidationChanges() {
const prescriptionsNumberCtrl = this.getControl('prescriptionsNumber');
const periodicityTimeUnitCtrl = this.getControl('periodicityTimeUnit');
if (prescriptionsNumberCtrl && periodicityTimeUnitCtrl) {
this.subscriptions.push(prescriptionsNumberCtrl.valueChanges.subscribe(() => this.updatePeriodicityValidators()), periodicityTimeUnitCtrl.valueChanges.subscribe(() => this.updatePeriodicityValidators()));
}
this.updatePeriodicityValidators();
this.cdr.markForCheck();
}
updatePeriodicityValidators() {
const prescriptionsNumber = this.getControl('prescriptionsNumber')?.value;
const periodicityTimeUnit = this.getControl('periodicityTimeUnit')?.value;
const periodicityTimeUnitCtrl = this.getControl('periodicityTimeUnit');
const periodicityDaysNumberCtrl = this.getControl('periodicityDaysNumber');
if (prescriptionsNumber > 1) {
periodicityTimeUnitCtrl?.setValidators([Validators.required]);
}
else {
periodicityTimeUnitCtrl?.clearValidators();
}
periodicityTimeUnitCtrl?.updateValueAndValidity({ emitEvent: false });
if (prescriptionsNumber && periodicityTimeUnit === '1') {
periodicityDaysNumberCtrl?.setValidators([Validators.required]);
}
else {
periodicityDaysNumberCtrl?.clearValidators();
}
periodicityDaysNumberCtrl?.updateValueAndValidity({ emitEvent: false });
this.cdr.markForCheck();
}
subscribeToLabelChanges() {
const reimbursementCtrl = this.getControl('instructionsForReimbursement');
const practitionerCtrl = this.getControl('prescriberVisibility');
const pharmacistCtrl = this.getControl('pharmacistVisibility');
const recipeInstructionCtrl = this.getControl('recipeInstructionForPatient');
if (reimbursementCtrl &&
practitionerCtrl &&
pharmacistCtrl &&
recipeInstructionCtrl) {
this.subscriptions.push(reimbursementCtrl.valueChanges.subscribe(value => {
this.selectedReimbursementLabel = this.getLabel(this.reimbursementOptions, value);
}), practitionerCtrl.valueChanges.subscribe(value => {
this.selectedPractitionerVisibilityLabel = this.getLabel(this.practitionerVisibilityOptions, value);
}), pharmacistCtrl.valueChanges.subscribe(value => {
this.selectedPharmacistVisibilityLabel = this.getLabel(this.pharmacistVisibilityOptions, value);
}), recipeInstructionCtrl.valueChanges.subscribe(value => {
this.recipeInstructionForPatientLabel = value;
}));
}
this.cdr.markForCheck();
}
setupDosageSuggestionLogic() {
const dosageControl = this.getControl('dosage');
if (!dosageControl)
return;
const { completePosology: completeDosage } = makeParser(this.language);
this.subscriptions.push(dosageControl.valueChanges.subscribe((newValue) => {
if (!newValue?.trim()) {
this.dosageSuggestions = [];
return;
}
setTimeout(() => {
if (dosageControl.value === newValue) {
this.dosageSuggestions = completeDosage(newValue);
}
}, 100);
}));
this.cdr.markForCheck();
}
findCommonSequence(a, b) {
let i = 0;
while (i < a.length && a[i] === b[i])
i++;
return a.slice(0, i);
}
validateSuggestion(index) {
const dosageCtrl = this.getControl('dosage');
const dosage = dosageCtrl?.value;
const suggestion = this.dosageSuggestions[index];
if (!suggestion || !dosage)
return;
const common = this.findCommonSequence(dosage, suggestion);
const newDosage = (dosage +
(common.length ? suggestion.slice(common.length) : ' ' + suggestion))
.replace(/ {2,}/g, ' ')
.replace(/\/ /g, '/');
dosageCtrl?.setValue(newDosage);
this.dosageSuggestions = [];
this.focusedDosageIndex = -1;
this.cdr.markForCheck();
}
onKeyDownDosageSuggestions(event) {
const len = this.dosageSuggestions.length;
if (event.key === 'ArrowDown') {
this.disableHover = true;
this.focusedDosageIndex = (this.focusedDosageIndex + 1) % len;
event.preventDefault();
event.stopPropagation();
}
else if (event.key === 'ArrowUp') {
this.disableHover = true;
this.focusedDosageIndex = (this.focusedDosageIndex - 1 + len) % len;
event.preventDefault();
event.stopPropagation();
}
else if (event.key === 'Enter' && this.focusedDosageIndex >= 0) {
this.validateSuggestion(this.focusedDosageIndex);
event.preventDefault();
event.stopPropagation();
}
else if (event.key === 'Escape') {
this.dosageSuggestions = [];
this.focusedDosageIndex = -1;
event.preventDefault();
event.stopPropagation();
}
this.cdr.markForCheck();
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: PrescriptionModalComponent, deps: [{ token: i1.NonNullableFormBuilder }, { token: CreatePrescriptionService }, { token: TranslationService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: PrescriptionModalComponent, isStandalone: true, selector: "cardinal-prescription-modal", inputs: { modalTitle: "modalTitle", medicationToPrescribe: "medicationToPrescribe", prescriptionToModify: "prescriptionToModify" }, outputs: { handleSubmit: "handleSubmit", handleCancel: "handleCancel" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"addMedicationModal\">\n <div class=\"addMedicationModal__content\">\n <form\n id=\"prescriptionForm\"\n class=\"addMedicationForm\"\n [formGroup]=\"prescriptionForm\"\n (ngSubmit)=\"onSubmit()\">\n <div class=\"addMedicationForm__header\">\n <h3>{{ modalTitle }}</h3>\n <button\n type=\"reset\"\n class=\"addMedicationForm__header__closeIcn\"\n (click)=\"onCancel()\">\n <cardinal-close-icn color=\"#4B6682\" />\n </button>\n </div>\n <div class=\"addMedicationForm__body\">\n <div class=\"addMedicationForm__body__content\">\n <cardinal-text-input\n [required]=\"true\"\n [label]=\"t('prescription.form.medicationTitle')\"\n [id]=\"'medicationTitle'\"\n formControlName=\"medicationTitle\"\n [errorMessage]=\"getErrorMessage('medicationTitle')\" />\n <div class=\"dosageInput\">\n <cardinal-text-input\n [label]=\"t('prescription.form.dosage')\"\n [id]=\"'dosage'\"\n [required]=\"true\"\n formControlName=\"dosage\"\n [errorMessage]=\"getErrorMessage('dosage')\"\n (keydown)=\"onKeyDownDosageSuggestions($event)\" />\n <ul\n class=\"dosageInput__dropdown\"\n *ngIf=\"dosageSuggestions.length > 0\">\n <li\n *ngFor=\"let suggestion of dosageSuggestions; let i = index\"\n [class.focused]=\"focusedDosageIndex === i\"\n (click)=\"validateSuggestion(i)\">\n {{ suggestion }}\n </li>\n </ul>\n </div>\n\n <div class=\"addMedicationForm__body__content__inputsGroup\">\n <cardinal-text-input\n [label]=\"t('prescription.form.duration')\"\n [id]=\"'duration'\"\n [type]=\"'number'\"\n formControlName=\"duration\"\n [min]=\"1\"\n [required]=\"true\"\n [errorMessage]=\"getErrorMessage('duration')\" />\n\n <cardinal-select-input\n [label]=\"t('prescription.form.durationTimeUnit')\"\n [id]=\"'durationTimeUnit'\"\n [required]=\"true\"\n [options]=\"durationTimeUnits\"\n formControlName=\"durationTimeUnit\"\n [errorMessage]=\"getErrorMessage('durationTimeUnit')\" />\n </div>\n <div class=\"addMedicationForm__body__content__inputsGroup\">\n <cardinal-text-input\n [label]=\"t('prescription.form.treatmentStartDate')\"\n [id]=\"'treatmentStartDate'\"\n [type]=\"'date'\"\n [required]=\"true\"\n formControlName=\"treatmentStartDate\"\n [errorMessage]=\"getErrorMessage('treatmentStartDate')\" />\n\n <cardinal-text-input\n [label]=\"t('prescription.form.executableUntil')\"\n [id]=\"'executableUntil'\"\n [type]=\"'date'\"\n [required]=\"true\"\n formControlName=\"executableUntil\"\n [errorMessage]=\"getErrorMessage('executableUntil')\" />\n </div>\n\n <div\n class=\"addMedicationForm__body__content__inputsGroup\"\n *ngIf=\"medicationToPrescribe\">\n <cardinal-text-input\n [label]=\"t('prescription.form.prescriptionsNumber')\"\n [id]=\"'prescriptionsNumber'\"\n [type]=\"'number'\"\n [min]=\"1\"\n [required]=\"true\"\n formControlName=\"prescriptionsNumber\"\n [errorMessage]=\"getErrorMessage('prescriptionsNumber')\" />\n\n <cardinal-select-input\n [label]=\"t('prescription.form.periodicityTimeUnit')\"\n [id]=\"'periodicityTimeUnit'\"\n [required]=\"true\"\n [options]=\"periodicityTimeUnits\"\n formControlName=\"periodicityTimeUnit\"\n *ngIf=\"\n prescriptionForm.get('prescriptionsNumber')?.value &&\n prescriptionForm.get('prescriptionsNumber')?.value > 1\n \"\n [errorMessage]=\"getErrorMessage('periodicityTimeUnit')\" />\n\n <cardinal-text-input\n [label]=\"t('prescription.form.periodicityDaysNumber')\"\n [id]=\"'periodicityDaysNumber'\"\n [type]=\"'number'\"\n [min]=\"1\"\n [required]=\"true\"\n formControlName=\"periodicityDaysNumber\"\n *ngIf=\"\n prescriptionForm.get('prescriptionsNumber')?.value &&\n prescriptionForm.get('periodicityTimeUnit')?.value &&\n prescriptionForm.get('periodicityTimeUnit')?.value === '1'\n \"\n [errorMessage]=\"getErrorMessage('periodicityDaysNumber')\" />\n </div>\n\n <div class=\"addMedicationForm__body__content__radioBtns\">\n <cardinal-radio-input\n [name]=\"'substitutionAllowed'\"\n [label]=\"t('prescription.form.substitutionAllowed')\"\n [options]=\"[\n {\n id: 'yes',\n label: t('prescription.form.substitutionYes'),\n value: true,\n },\n {\n id: 'no',\n label: t('prescription.form.substitutionNo'),\n value: false,\n },\n ]\"\n formControlName=\"substitutionAllowed\"\n [required]=\"true\"\n [errorMessage]=\"getErrorMessage('substitutionAllowed')\" />\n </div>\n </div>\n <cardinal-toggle-switch\n [id]=\"'showExtraFields'\"\n formControlName=\"showExtraFields\"\n [value]=\"t('prescription.form.toggleExtraFields')\" />\n\n <div\n class=\"addMedicationForm__body__extraFieldsPreview\"\n *ngIf=\"prescriptionForm.get('showExtraFields')?.value === false\">\n <p>\n <span>{{ t('prescription.form.patientInstructions') }} :</span>\n <i\n ><span> {{ recipeInstructionForPatientLabel }}</span></i\n >\n </p>\n <p>\n <span\n >{{ t('prescription.form.reimbursementInstructions') }} :</span\n >\n <i\n ><span> {{ selectedReimbursementLabel }}</span></i\n >\n </p>\n <p>\n <span>{{ t('prescription.form.prescriberVisibility') }} :</span>\n <i\n ><span> {{ selectedPractitionerVisibilityLabel }}</span></i\n >\n </p>\n\n <p>\n <span>{{ t('prescription.form.pharmacistVisibility') }} :</span>\n <i\n ><span> {{ selectedPharmacistVisibilityLabel }}</span></i\n >\n </p>\n\n <p></p>\n </div>\n\n <div\n class=\"addMedicationForm__body__content\"\n *ngIf=\"prescriptionForm.get('showExtraFields')?.value === true\">\n <cardinal-textarea-input\n [label]=\"t('prescription.form.patientInstructions')\"\n [id]=\"'recipeInstructionForPatient'\"\n formControlName=\"recipeInstructionForPatient\"\n *ngIf=\"prescriptionForm.get('showExtraFields')?.value === true\" />\n\n <cardinal-select-input\n [label]=\"t('prescription.form.reimbursementInstructions')\"\n [id]=\"'instructionsForReimbursement'\"\n [options]=\"reimbursementOptions\"\n formControlName=\"instructionsForReimbursement\"\n *ngIf=\"prescriptionForm.get('showExtraFields')?.value === true\" />\n\n <cardinal-select-input\n [label]=\"t('prescription.form.prescriberVisibility')\"\n [id]=\"'prescriberVisibility'\"\n [options]=\"practitionerVisibilityOptions\"\n formControlName=\"prescriberVisibility\"\n *ngIf=\"prescriptionForm.get('showExtraFields')?.value === true\" />\n\n <cardinal-select-input\n [label]=\"t('prescription.form.pharmacistVisibility')\"\n [id]=\"'pharmacistVisibility'\"\n [options]=\"pharmacistVisibilityOptions\"\n formControlName=\"pharmacistVisibility\"\n *ngIf=\"prescriptionForm.get('showExtraFields')?.value === true\" />\n </div>\n </div>\n <div class=\"addMedicationForm__footer\">\n <cardinal-button\n [view]=\"'outlined'\"\n [type]=\"'reset'\"\n (handleClick)=\"onCancel()\">\n {{ t('prescription.form.cancel') }}\n </cardinal-button>\n <cardinal-button\n [type]=\"'submit'\"\n (handleClick)=\"onSubmit()\"\n [view]=\"'primary'\">\n {{ t('prescription.form.submit') }}\n </cardinal-button>\n </div>\n </form>\n </div>\n</div>\n", styles: ["*{margin:0;padding:0;font-size:100%;box-sizing:border-box;font-family:Inter Variable,sans-serif}a{text-decoration:none}a:active,a:hover{outline:0}ul,li{list-style-type:none;margin:0;padding:0}h1,h2,h3,h4,h5,h6{font-size:100%}html,body{box-sizing:border-box;font-size:16px;background-color:#fbfdff}*,*:before,*:after{box-sizing:border-box}:focus{outline:0}img,audio,video{max-width:100%;height:auto}iframe{border:0}textarea{resize:none;overflow:auto;vertical-align:top;box-shadow:none;-webkit-box-shadow:none;-moz-box-shadow:none}input,textarea,select,button{outline:none;border:none;font-size:100%;margin:0}button,input{line-height:normal}input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,textarea:-webkit-autofill,textarea:-webkit-autofill:hover,textarea:-webkit-autofill:focus,select:-webkit-autofill,select:-webkit-autofill:hover,select:-webkit-autofill:focus{-webkit-text-fill-color:rgb(0,0,0);transition:background-color 5000s ease-in-out 0s}table{border-collapse:collapse;border-spacing:0}td,th{padding:0;text-align:left}.addMedicationModal{width:100vw;height:100vh;position:fixed;top:0;left:0;z-index:100;display:flex;background:#084b834d}.addMedicationModal__content{width:900px;height:100%;max-height:100%;border:none;padding:0;margin:0 0 0 auto}@media only screen and (max-width: 992px){.addMedicationModal__content{width:100%;border-radius:.2em}}.addMedicationForm{display:flex;width:100%;height:100vh;overflow:hidden;flex-direction:column;align-items:flex-start;align-self:stretch}.addMedicationForm__header{display:flex;padding:20px 24px;justify-content:space-between;align-items:center;align-self:stretch;border-bottom:1px solid #e4e4e7;background:#fff}@media only screen and (max-width: 992px){.addMedicationForm__header{padding:20px 16px}}.addMedicationForm__header h3{color:#1d2235;font-size:16px;font-style:normal;font-weight:500;line-height:normal}.addMedicationForm__header__closeIcn{width:22px;height:22px;display:flex;justify-content:center;align-items:center;cursor:pointer;background-color:#fff;border-radius:4px}.addMedicationForm__header__closeIcn:hover{background-color:#e4e4e766}.addMedicationForm__body{width:100%;height:100%;overflow-y:auto;padding:24px 32px;display:flex;flex-direction:column;align-items:flex-start;align-self:stretch;flex:1 0 0;gap:12px;background-color:#f9fbfe}@media only screen and (max-width: 992px){.addMedicationForm__body{padding:16px}}@media only screen and (max-width: 576px){.addMedicationForm__body{padding:8px}}.addMedicationForm__body__content{width:100%;display:flex;flex-direction:column;align-items:flex-start;align-self:stretch;border-radius:12px;border:1px solid #e4e4e7;background:#fff;padding:24px;gap:12px}@media only screen and (max-width: 992px){.addMedicationForm__body__content{padding:18px}}.addMedicationForm__body__content cardinal-text-input,.addMedicationForm__body__content cardinal-select-input,.addMedicationForm__body__content cardinal-textarea-input{flex:1 1 0;width:100%;min-width:0}.addMedicationForm__body__content__inputsGroup{width:100%;display:flex;align-items:flex-start;gap:4px;align-self:stretch}@media only screen and (max-width: 576px){.addMedicationForm__body__content__inputsGroup{flex-direction:column;gap:12px}}.addMedicationForm__body cardinal-toggle-switch{flex:0 1 0;width:100%;min-width:0}.addMedicationForm__body__extraFieldsPreview{display:flex;width:100%;padding:12px;flex-direction:column;align-items:flex-start;align-self:stretch;border-radius:12px;border:1px solid #e4e4e7;background:#fff;box-shadow:0 1px 1px #dadade40}.addMedicationForm__body__extraFieldsPreview p{color:#848482b3;font-size:14px;font-style:normal;font-weight:400;line-height:22px}.addMedicationForm__footer{display:flex;padding:20px 24px;justify-content:flex-end;align-items:flex-start;gap:12px;align-self:stretch;border-top:1px solid #e4e4e7;background:#fff}.dosageInput{width:100%;position:relative;display:flex;flex-direction:column;align-items:flex-start}.dosageInput__dropdown{position:absolute;top:calc(100% + 2px);width:100%;display:flex;flex-direction:column;align-items:flex-start;padding:2px;gap:2px;border-radius:6px;background:#fff;box-shadow:0 9px 28px #0000000d,0 6px 16px #00000014,0 3px 6px #0000001f}.dosageInput__dropdown li{width:100%;display:flex;padding:8px;align-items:center;align-self:stretch;border-radius:4px;background:#fff;color:#1d2235;font-family:Inter Variable,sans-serif;font-size:14px;font-weight:400;line-height:22px}.dosageInput__dropdown li.disableHover:hover{background:none}.dosageInput__dropdown li:hover,.dosageInput__dropdown li.focused,.dosageInput__dropdown li.disableHover.focused:hover{background:#eef6fe;color:#084b83!important}@keyframes zoom{0%{transform:scale(.95)}to{transform:scale(1)}}@keyframes fade{0%{opacity:0}to{opacity:1}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: ButtonComponent, selector: "cardinal-button", inputs: ["view", "type", "formId", "disabled"], outputs: ["handleClick"] }, { kind: "component", type: TextInputComponent, selector: "cardinal-text-input", inputs: ["label", "id", "type", "required", "autofocus", "disabled", "min", "max", "accept", "errorMessage"] }, { kind: "component", type: TextareaInputComponent, selector: "cardinal-textarea-input", inputs: ["label", "id", "required", "disabled", "errorMessage", "autofocus"] }, { kind: "component", type: SelectInputComponent, selector: "cardinal-select-input", inputs: ["label", "id", "required", "disabled", "options", "errorMessage"], outputs: ["valueChange"] }, { kind: "component", type: RadioInputComponent, selector: "cardinal-radio-input", inputs: ["label", "name", "required", "errorMessage", "options"] }, { kind: "component", type: ToggleSwitchComponent, selector: "cardinal-toggle-switch", inputs: ["id", "value", "label"], outputs: ["checkedChange"] }, { kind: "component", type: CloseIcnComponent, selector: "cardinal-close-icn", inputs: ["color"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: PrescriptionModalComponent, decorators: [{
type: Component,
args: [{ selector: 'cardinal-prescription-modal', standalone: true, imports: [
CommonModule,
ReactiveFormsModule,
ButtonComponent,
TextInputComponent,
TextareaInputComponent,
SelectInputComponent,
RadioInputComponent,
ToggleSwitchComponent,
CloseIcnComponent,
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"addMedicationModal\">\n <div class=\"addMedicationModal__content\">\n <form\n id=\"prescriptionForm\"\n class=\"addMedicationForm\"\n [formGroup]=\"prescriptionForm\"\n (ngSubmit)=\"onSubmit()\">\n <div class=\"addMedicationForm__header\">\n <h3>{{ modalTitle }}</h3>\n <button\n type=\"reset\"\n class=\"addMedicationForm__header__closeIcn\"\n (click)=\"onCancel()\">\n <cardinal-close-icn color=\"#4B6682\" />\n </button>\n </div>\n <div class=\"addMedicationForm__body\">\n <div class=\"addMedicationForm__body__content\">\n <cardinal-text-input\n [required]=\"true\"\n [label]=\"t('prescription.form.medicationTitle')\"\n [id]=\"'medicationTitle'\"\n formControlName=\"medicationTitle\"\n [errorMessage]=\"getErrorMessage('medicationTitle')\" />\n <div class=\"dosageInput\">\n <cardinal-text-input\n [label]=\"t('prescription.form.dosage')\"\n [id]=\"'dosage'\"\n [required]=\"true\"\n formControlName=\"dosage\"\n [errorMessage]=\"getErrorMessage('dosage')\"\n (keydown)=\"onKeyDownDosageSuggestions($event)\" />\n <ul\n class=\"dosageInput__dropdown\"\n *ngIf=\"dosageSuggestions.length > 0\">\n <li\n *ngFor=\"let suggestion of dosageSuggestions; let i = index\"\n [class.focused]=\"focusedDosageIndex === i\"\n (click)=\"validateSuggestion(i)\">\n {{ suggestion }}\n </li>\n </ul>\n </div>\n\n <div class=\"addMedicationForm__body__content__inputsGroup\">\n <cardinal-text-input\n [label]=\"t('prescription.form.duration')\"\n [id]=\"'duration'\"\n [type]=\"'number'\"\n formControlName=\"duration\"\n [min]=\"1\"\n [required]=\"true\"\n [errorMessage]=\"getErrorMessage('duration')\" />\n\n <cardinal-select-input\n [label]=\"t('prescription.form.durationTimeUnit')\"\n [id]=\"'durationTimeUnit'\"\n [required]=\"true\"\n [options]=\"durationTimeUnits\"\n formControlName=\"durationTimeUnit\"\n [errorMessage]=\"getErrorMessage('durationTimeUnit')\" />\n </div>\n <div class=\"addMedicationForm__body__content__inputsGroup\">\n <cardinal-text-input\n [label]=\"t('prescription.form.treatmentStartDate')\"\n [id]=\"'treatmentStartDate'\"\n [type]=\"'date'\"\n [required]=\"true\"\n formControlName=\"treatmentStartDate\"\n [errorMessage]=\"getErrorMessage('treatmentStartDate')\" />\n\n <cardinal-text-input\n [label]=\"t('prescription.form.executableUntil')\"\n [id]=\"'executableUntil'\"\n [type]=\"'date'\"\n [required]=\"true\"\n formControlName=\"executableUntil\"\n [errorMessage]=\"getErrorMessage('executableUntil')\" />\n </div>\n\n <div\n class=\"addMedicationForm__body__content__inputsGroup\"\n *ngIf=\"medicationToPrescribe\">\n <cardinal-text-input\n [label]=\"t('prescription.form.prescriptionsNumber')\"\n [id]=\"'prescriptionsNumber'\"\n [type]=\"'number'\"\n [min]=\"1\"\n [required]=\"true\"\n formControlName=\"prescriptionsNumber\"\n [errorMessage]=\"getErrorMessage('prescriptionsNumber')\" />\n\n <cardinal-select-input\n [label]=\"t('prescription.form.periodicityTimeUnit')\"\n [id]=\"'periodicityTimeUnit'\"\n [required]=\"true\"\n [options]=\"periodicityTimeUnits\"\n formControlName=\"periodicityTimeUnit\"\n *ngIf=\"\n prescriptionForm.get('prescriptionsNumber')?.value &&\n prescriptionForm.get('prescriptionsNumber')?.value > 1\n \"\n [errorMessage]=\"getErrorMessage('periodicityTimeUnit')\" />\n\n <cardinal-text-input\n [label]=\"t('prescription.form.periodicityDaysNumber')\"\n [id]=\"'periodicityDaysNumber'\"\n [type]=\"'number'\"\n [min]=\"1\"\n [required]=\"true\"\n formControlName=\"periodicityDaysNumber\"\n *ngIf=\"\n prescriptionForm.get('prescriptionsNumber')?.value &&\n prescriptionForm.get('periodicityTimeUnit')?.value &&\n prescriptionForm.get('periodicityTimeUnit')?.value === '1'\n \"\n [errorMessage]=\"getErrorMessage('periodicityDaysNumber')\" />\n </div>\n\n <div class=\"addMedicationForm__body__content__radioBtns\">\n <cardinal-radio-input\n [name]=\"'substitutionAllowed'\"\n [label]=\"t('prescription.form.substitutionAllowed')\"\n [options]=\"[\n {\n id: 'yes',\n label: t('prescription.form.substitutionYes'),\n value: true,\n },\n {\n id: 'no',\n label: t('prescription.form.substitutionNo'),\n value: false,\n },\n ]\"\n formControlName=\"substitutionAllowed\"\n [required]=\"true\"\n [errorMessage]=\"getErrorMessage('substitutionAllowed')\" />\n </div>\n </div>\n <cardinal-toggle-switch\n [id]=\"'showExtraFields'\"\n formControlName=\"showExtraFields\"\n [value]=\"t('prescription.form.toggleExtraFields')\" />\n\n <div\n class=\"addMedicationForm__body__extraFieldsPreview\"\n *ngIf=\"prescriptionForm.get('showExtraFields')?.value === false\">\n <p>\n <span>{{ t('prescription.form.patientInstructions') }} :</span>\n <i\n ><span> {{ recipeInstructionForPatientLabel }}</span></i\n >\n </p>\n <p>\n <span\n >{{ t('prescription.form.reimbursementInstructions') }} :</span\n >\n <i\n ><span> {{ selectedReimbursementLabel }}</span></i\n >\n </p>\n <p>\n <span>{{ t('prescription.form.prescriberVisibility') }} :</span>\n <i\n ><span> {{ selectedPractitionerVisibilityLabel }}</span></i\n >\n </p>\n\n <p>\n <span>{{ t('prescription.form.pharmacistVisibility') }} :</span>\n <i\n ><span> {{ selectedPharmacistVisibilityLabel }}</span></i\n >\n </p>\n\n <p></p>\n </div>\n\n <div\n class=\"addMedicationForm__body__content\"\n *ngIf=\"prescriptionForm.get('showExtraFields')?.value === true\">\n <cardinal-textarea-input\n [label]=\"t('prescription.form.patientInstructions')\"\n [id]=\"'recipeInstructionForPatient'\"\n formControlName=\"recipeInstructionForPatient\"\n *ngIf=\"prescriptionForm.get('showExtraFields')?.value === true\" />\n\n <cardinal-select-input\n [label]=\"t('prescription.form.reimbursementInstructions')\"\n [id]=\"'instructionsForReimbursement'\"\n [options]=\"reimbursementOptions\"\n formControlName=\"instructionsForReimbursement\"\n *ngIf=\"prescriptionForm.get('showExtraFields')?.value === true\" />\n\n <cardinal-select-input\n [label]=\"t('prescription.form.prescriberVisibility')\"\n [id]=\"'prescriberVisibility'\"\n [options]=\"practitionerVisibilityOptions\"\n formControlName=\"prescriberVisibility\"\n *ngIf=\"prescriptionForm.get('showExtraFields')?.value === true\" />\n\n <cardinal-select-input\n [label]=\"t('prescription.form.pharmacistVisibility')\"\n [id]=\"'pharmacistVisibility'\"\n [options]=\"pharmacistVisibilityOptions\"\n formControlName=\"pharmacistVisibility\"\n *ngIf=\"prescriptionForm.get('showExtraFields')?.value === true\" />\n </div>\n </div>\n <div class=\"addMedicationForm__footer\">\n <cardinal-button\n [view]=\"'outlined'\"\n [type]=\"'reset'\"\n (handleClick)=\"onCancel()\">\n {{ t('prescription.form.cancel') }}\n </cardinal-button>\n <cardinal-button\n [type]=\"'submit'\"\n (handleClick)=\"onSubmit()\"\n [view]=\"'primary'\">\n {{ t('prescription.form.submit') }}\n </cardinal-button>\n </div>\n </form>\n </div>\n</div>\n", styles: ["*{margin:0;padding:0;font-size:100%;box-sizing:border-box;font-family:Inter Variable,sans-serif}a{text-decoration:none}a:active,a:hover{outline:0}ul,li{list-style-type:none;margin:0;padding:0}h1,h2,h3,h4,h5,h6{font-size:100%}html,body{box-sizing:border-box;font-size:16px;background-color:#fbfdff}*,*:before,*:after{box-sizing:border-box}:focus{outline:0}img,audio,video{max-width:100%;height:auto}iframe{border:0}textarea{resize:none;overflow:auto;vertical-align:top;box-shadow:none;-webkit-box-shadow:none;-moz-box-shadow:none}input,textarea,select,button{outline:none;border:none;font-size:100%;margin:0}button,input{line-height:normal}input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,textarea:-webkit-autofill,textarea:-webkit-autofill:hover,textarea:-webkit-autofill:focus,select:-webkit-autofill,select:-webkit-autofill:hover,select:-webkit-autofill:focus{-webkit-text-fill-color:rgb(0,0,0);transition:background-color 5000s ease-in-out 0s}table{border-collapse:collapse;border-spacing:0}td,th{padding:0;text-align:left}.addMedicationModal{width:100vw;height:100vh;position:fixed;top:0;left:0;z-index:100;display:flex;background:#084b834d}.addMedicationModal__content{width:900px;height:100%;max-height:100%;border:none;padding:0;margin:0 0 0 auto}@media only screen and (max-width: 992px){.addMedicationModal__content{width:100%;border-radius:.2em}}.addMedicationForm{display:flex;width:100%;height:100vh;overflow:hidden;flex-direction:column;align-items:flex-start;align-self:stretch}.addMedicationForm__header{display:flex;padding:20px 24px;justify-content:space-between;align-items:center;align-self:stretch;border-bottom:1px solid #e4e4e7;background:#fff}@media only screen and (max-width: 992px){.addMedicationForm__header{padding:20px 16px}}.addMedicationForm__header h3{color:#1d2235;font-size:16px;font-style:normal;font-weight:500;line-height:normal}.addMedicationForm__header__closeIcn{width:22px;height:22px;display:flex;justify-content:center;align-items:center;cursor:pointer;background-color:#fff;border-radius:4px}.addMedicationForm__header__closeIcn:hover{background-color:#e4e4e766}.addMedicationForm__body{width:100%;height:100%;overflow-y:auto;padding:24px 32px;display:flex;flex-direction:column;align-items:flex-start;align-self:stretch;flex:1 0 0;gap:12px;background-color:#f9fbfe}@media only screen and (max-width: 992px){.addMedicationForm__body{padding:16px}}@media only screen and (max-width: 576px){.addMedicationForm__body{padding:8px}}.addMedicationForm__body__content{width:100%;display:flex;flex-direction:column;align-items:flex-start;align-self:stretch;border-radius:12px;border:1px solid #e4e4e7;background:#fff;padding:24px;gap:12px}@media only screen and (max-width: 992px){.addMedicationForm__body__content{padding:18px}}.addMedicationForm__body__content cardinal-text-input,.addMedicationForm__body__content cardinal-select-input,.addMedicationForm__body__content cardinal-textarea-input{flex:1 1 0;width:100%;min-width:0}.addMedicationForm__body__content__inputsGroup{width:100%;display:flex;align-items:flex-start;gap:4px;align-self:stretch}@media only screen and (max-width: 576px){.addMedicationForm__body__content__inputsGroup{flex-direction:column;gap:12px}}.addMedicationForm__body cardinal-toggle-switch{flex:0 1 0;width:100%;min-width:0}.addMedicationForm__body__extraFieldsPreview{display:flex;width:100%;padding:12px;flex-direction:column;align-items:flex-start;align-self:stretch;border-radius:12px;border:1px solid #e4e4e7;background:#fff;box-shadow:0 1px 1px #dadade40}.addMedicationForm__body__extraFieldsPreview p{color:#848482b3;font-size:14px;font-style:normal;font-weight:400;line-height:22px}.addMedicationForm__footer{display:flex;padding:20px 24px;justify-content:flex-end;align-items:flex-start;gap:12px;align-self:stretch;border-top:1px solid #e4e4e7;background:#fff}.dosageInput{width:100%;position:relative;display:flex;flex-direction:column;align-items:flex-start}.dosageInput__dropdown{position:absolute;top:calc(100% + 2px);width:100%;display:flex;flex-direction:column;align-items:flex-start;padding:2px;gap:2px;border-radius:6px;background:#fff;box-shadow:0 9px 28px #0000000d,0 6px 16px #00000014,0 3px 6px #0000001f}.dosageInput__dropdown li{width:100%;display:flex;padding:8px;align-items:center;align-self:stretch;border-radius:4px;background:#fff;color:#1d2235;font-family:Inter Variable,sans-serif;font-size:14px;font-weight:400;line-height:22px}.dosageInput__dropdown li.disableHover:hover{background:none}.dosageInput__dropdown li:hover,.dosageInput__dropdown li.focused,.dosageInput__dropdown li.disableHover.focused:hover{background:#eef6fe;color:#084b83!important}@keyframes zoom{0%{transform:scale(.95)}to{transform:scale(1)}}@keyframes fade{0%{opacity:0}to{opacity:1}}\n"] }]
}], ctorParameters: () => [{ type: i1.NonNullableFormBuilder }, { type: CreatePrescriptionService }, { type: TranslationService }, { type: i0.ChangeDetectorRef }], propDecorators: { modalTitle: [{
type: Input,
args: [{ required: true }]
}], medicationToPrescribe: [{
type: Input
}], prescriptionToModify: [{
type: Input
}], handleSubmit: [{
type: Output
}], handleCancel: [{
type: Output
}] } });
class PrescriptionDocumentToPrintComponent {
translationService;
cdr;
prescribedMedications;
prescriber;
patient;
ridElements;
constructor(translationService, cdr) {
this.translationService = translationService;
this.cdr = cdr;
}
t(key) {
return this.translationService.translate(key);
}
chunks = [];
ngOnInit() {
this.chunkPrescriptions();
}
ngAfterViewInit() {
setTimeout(() => this.generateBarcodes()); // ensures DOM is fully rendered
this.cdr.markForCheck();
}
// Chunk the medications into groups of 4 for display
chunkPrescriptions() {
const chunkSize = 4;
const tmpChunks = [];
for (let i = 0; i < this.prescribedMedications.length; i += chunkSize) {
tmpChunks.push(this.prescribedMedications.slice(i, i + chunkSize));
}
this.chunks = tmpChunks;
this.cdr.markForCheck();
}
// Handle barcode generation using JsBarcode
handleRid(rid, elm) {
if (elm && rid) {
JsBarcode(elm, rid, {
format: 'CODE128A',
lineColor: '#000',
width: 2,
height: 40,
displayValue: true,
});
}
}
// Generate barcodes for each prescription item
generateBarcodes() {
const elements = this.ridElements.toArray();
this.prescribedMedications.forEach((med, idx) => {
this.handleRid(med.rid, elements[idx]?.nativeElement);
});
this.cdr.markForCheck();
}
// Helper to format dates
formatDate(date) {
return (date && dateDecode(date)?.toLocaleDateString()) ?? '-';
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: PrescriptionDocumentToPrintComponent, deps: [{ token: TranslationService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: PrescriptionDocumentToPrintComponent, isStandalone: true, selector: "cardinal-prescription-document-to-print", inputs: { prescribedMedications: "prescribedMedications", prescriber: "prescriber", patient: "patient" }, viewQueries: [{ propertyName: "ridElements", predicate: ["ridElements"], descendants: true }], ngImport: i0, template: "<div *ngIf=\"prescribedMedications?.length\" class=\"prescriptionsHolder\">\n <div *ngFor=\"let chunk of chunks; let chunkIndex = index\">\n <div class=\"prescription\">\n <div class=\"header\">\n <h1>{{ t('prescription.pdf.title') }}</h1>\n <p>{{ t('prescription.pdf.instructions') }}</p>\n </div>\n <div class=\"divider\"></div>\n <div class=\"options\">\n <p>\n <strong>{{ t('prescription.pdf.options.title') }}</strong>\n </p>\n <ol>\n <li>{{ t('prescription.pdf.options.option1') }}</li>\n <li>{{ t('prescription.pdf.options.option2') }}</li>\n </ol>\n </div>\n <div class=\"divider\"></div>\n\n <div class=\"prescription-section\">\n <div class=\"prescription-section__persons\">\n <p>\n <strong>{{ t('prescription.pdf.prescriber') }}:</strong>\n {{ prescriber.lastName }} {{ prescriber.firstName }}\n {{ prescriber.nihii }}\n </p>\n <p>\n <strong>{{ t('prescription.pdf.patient') }}:</strong>\n {{ patient.lastName }} {{ patient.firstName }}\n {{ patient.ssin }}\n </p>\n </div>\n <h3>{{ t('prescription.pdf.electronicContent') }}</h3>\n\n <div\n *ngFor=\"let item of chunk; let idx = index\"\n class=\"prescription-item\">\n <div class=\"prescription-item__block\">\n <p>\n {{ t('prescription.pdf.product') }}\n <strong>{{\n item.medication.medicinalProduct?.intendedname\n }}</strong>\n </p>\n <p>\n {{ t('prescription.pdf.dosage') }}\n {{ item.medication.instructionForPatient }}\n </p>\n <p>\n {{ t('prescription.pdf.date') }}\n {{ formatDate(item.medication.beginMoment) }}\n </p>\n <p>\n {{ t('prescription.pdf.validUntil') }}\n {{\n item.medication.endMoment\n ? formatDate(item.medication.endMoment)\n : '-'\n }}\n </p>\n </div>\n <div class=\"prescription-item__block prescription-item__block--right\">\n <strong class=\"ridTitle\">RID {{ idx + 1 }}</strong>\n <div class=\"barcode\">\n <svg #ridElements [attr.id]=\"'barcode' + idx\"></svg>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n</div>\n", styles: ["*{margin:0;padding:0;font-size:100%;box-sizing:border-box;font-family:Inter Variable,sans-serif}a{text-decoration:none}a:active,a:hover{outline:0}ul,li{list-style-type:none;margin:0;padding:0}h1,h2,h3,h4,h5,h6{font-size:100%}html,body{box-sizing:border-box;font-size:16px;background-color:#fbfdff}*,*:before,*:after{box-sizing:border-box}:focus{outline:0}img,audio,video{max-width:100%;height:auto}iframe{border:0}textarea{resize:none;overflow:auto;vertical-align:top;box-shadow:none;-webkit-box-shadow:none;-moz-box-shadow:none}input,textarea,select,button{outline:none;border:none;font-size:100%;margin:0}button,input{line-height:normal}input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,textarea:-webkit-autofill,textarea:-webkit-autofill:hover,textarea:-webkit-autofill:focus,select:-webkit-autofill,select:-webkit-autofill:hover,select:-webkit-autofill:focus{-webkit-text-fill-color:rgb(0,0,0);transition:background-color 5000s ease-in-out 0s}table{border-collapse:collapse;border-spacing:0}td,th{padding:0;text-align:left}@media print{.prescription{page-break-after:always;border:none}}.prescriptionsHolder{display:flex;flex-direction:column;gap:24px}.prescription{border:1px solid #e4e4e7;border-radius:8px;background-color:#fff;padding:24px;font-size:14px;display:flex;flex-direction:column;gap:24px}.divider{border-top:1px solid #e4e4e7}.header{text-align:center;display:flex;flex-direction:column;gap:4px}.header h1{margin:0;font-size:18px;padding-bottom:4px}.options{display:flex;flex-direction:column;gap:8px}.prescription-section{display:flex;flex-direction:column;gap:12px}.prescription-section__persons{display:flex;align-items:center;justify-content:space-between}.prescription-section h3{font-size:14px}.prescription-section .prescription-item{display:flex;align-items:flex-start;justify-content:space-between;padding:24px 12px;border-radius:12px;border:1px dashed #848482}.prescription-section .prescription-item__block{display:flex;flex-direction:column;width:48%}.prescription-section .prescription-item__block--right{align-items:center;width:auto}.prescription-section .prescription-item:nth-child(2n){flex-direction:row-reverse}.barcode{width:200px;height:40px;margin:5px 0;display:flex;flex-direction:row;align-items:flex-end}.barcode svg{height:40px}.right{margin-left:auto}\n"], dependencies: [{ kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: PrescriptionDocumentToPrintComponent, decorators: [{
type: Component,
args: [{ selector: 'cardinal-prescription-document-to-print', imports: [NgForOf, NgIf], changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, template: "<div *ngIf=\"prescribedMedications?.length\" class=\"prescriptionsHolder\">\n <div *ngFor=\"let chunk of chunks; let chunkIndex = index\">\n <div class=\"prescription\">\n <div class=\"header\">\n <h1>{{ t('prescription.pdf.title') }}</h1>\n <p>{{ t('prescription.pdf.instructions') }}</p>\n </div>\n <div class=\"divider\"></div>\n <div class=\"options\">\n <p>\n <strong>{{ t('prescription.pdf.options.title') }}</strong>\n </p>\n <ol>\n <li>{{ t('prescription.pdf.options.option1') }}</li>\n <li>{{ t('prescription.pdf.options.option2') }}</li>\n </ol>\n </div>\n <div class=\"divider\"></div>\n\n <div class=\"prescription-section\">\n <div class=\"prescription-section__persons\">\n <p>\n <strong>{{ t('prescription.pdf.prescriber') }}:</strong>\n {{ prescriber.lastName }} {{ prescriber.firstName }}\n {{ prescriber.nihii }}\n </p>\n <p>\n <strong>{{ t('prescription.pdf.patient') }}:</strong>\n {{ patient.lastName }} {{ patient.firstName }}\n {{ patient.ssin }}\n </p>\n </div>\n <h3>{{ t('prescription.pdf.electronicContent') }}</h3>\n\n <div\n *ngFor=\"let item of chunk; let idx = index\"\n class=\"prescription-item\">\n <div class=\"prescription-item__block\">\n <p>\n {{ t('prescription.pdf.product') }}\n <strong>{{\n item.medication.medicinalProduct?.intendedname\n }}</strong>\n </p>\n <p>\n {{ t('prescription.pdf.dosage') }}\n {{ item.medication.instructionForPatient }}\n </p>\n <p>\n {{ t('prescription.pdf.date') }}\n {{ formatDate(item.medication.beginMoment) }}\n </p>\n <p>\n {{ t('prescription.pdf.validUntil') }}\n {{\n item.medication.endMoment\n ? formatDate(item.medication.endMoment)\n : '-'\n }}\n </p>\n </div>\n <div class=\"prescription-item__block prescription-item__block--right\">\n <strong class=\"ridTitle\">RID {{ idx + 1 }}</strong>\n <div class=\"barcode\">\n <svg #ridElements [attr.id]=\"'barcode' + idx\"></svg>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n</div>\n", styles: ["*{margin:0;padding:0;font-size:100%;box-sizing:border-box;font-family:Inter Variable,sans-serif}a{text-decoration:none}a:active,a:hover{outline:0}ul,li{list-style-type:none;margin:0;padding:0}h1,h2,h3,h4,h5,h6{font-size:100%}html,body{box-sizing:border-box;font-size:16px;background-color:#fbfdff}*,*:before,*:after{box-sizing:border-box}:focus{outline:0}img,audio,video{max-width:100%;height:auto}iframe{border:0}textarea{resize:none;overflow:auto;vertical-align:top;box-shadow:none;-webkit-box-shadow:none;-moz-box-shadow:none}input,textarea,select,button{outline:none;border:none;font-size:100%;margin:0}button,input{line-height:normal}input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,textarea:-webkit-autofill,textarea:-webkit-autofill:hover,textarea:-webkit-autofill:focus,select:-webkit-autofill,select:-webkit-autofill:hover,select:-webkit-autofill:focus{-webkit-text-fill-color:rgb(0,0,0);transition:background-color 5000s ease-in-out 0s}table{border-collapse:collapse;border-spacing:0}td,th{padding:0;text-align:left}@media print{.prescription{page-break-after:always;border:none}}.prescriptionsHolder{display:flex;flex-direction:column;gap:24px}.prescription{border:1px solid #e4e4e7;border-radius:8px;background-color:#fff;padding:24px;font-size:14px;display:flex;flex-direction:column;gap:24px}.divider{border-top:1px solid #e4e4e7}.header{text-align:center;display:flex;flex-direction:column;gap:4px}.header h1{margin:0;font-size:18px;padding-bottom:4px}.options{display:flex;flex-direction:column;gap:8px}.prescription-section{display:flex;flex-direction:column;gap:12px}.prescription-section__persons{display:flex;align-items:center;justify-content:space-between}.prescription-section h3{font-size:14px}.prescription-section .prescription-item{display:flex;align-items:flex-start;justify-content:space-between;padding:24px 12px;border-radius:12px;border:1px dashed #848482}.prescription-section .prescription-item__block{display:flex;flex-direction:column;width:48%}.prescription-section .prescription-item__block--right{align-items:center;width:auto}.prescription-section .prescription-item:nth-child(2n){flex-direction:row-reverse}.barcode{width:200px;height:40px;margin:5px 0;display:flex;flex-direction:row;align-items:flex-end}.barcode svg{height:40px}.right{margin-left:auto}\n"] }]
}], ctorParameters: () => [{ type: TranslationService }, { type: i0.ChangeDetectorRef }], propDecorators: { prescribedMedications: [{
type: Input,
args: [{ required: true }]
}], prescriber: [{
type: Input,
args: [{ required: true }]
}], patient: [{
type: Input,
args: [{ required: true }]
}], ridElements: [{
type: ViewChildren,
args: ['ridElements']
}] } });
class PrintPrescriptionModalComponent {
translationService;
prescribedMedications;
prescriber;
patient;
onCloseModal = new EventEmitter(); // Emit event to close the modal
printContainer; // ViewChild to access print container
constructor(translationService) {
this.translationService = translationService;
}
t(key) {
return this.translationService.translate(key);
}
get sentPrescriptions() {
return this.prescribedMedications.filter(item => !!item.rid);
}
// Print function
print() {
const div = this.printContainer.nativeElement;
if (div) {
const newDiv = div.cloneNode(true);
newDiv.style.cssText = window.getComputedStyle(div).cssText;
newDiv.id = 'new' + div.id;
const hideFrame = document.createElement('iframe');
hideFrame.style.display = 'none';
// Set onload handler BEFORE setting src and appending to DOM
hideFrame.onload = () => {
console.log('Frame loaded, ready to print');
const setPrint = () => {
const closePrint = () => {
document.body.removeChild(hideFrame);
};
if (hideFrame.contentWindow && hideFrame.contentDocument) {
// Append stylesheets to iframe document
const stylesheets = document.querySelectorAll("link[rel='stylesheet'], style");
stylesheets.forEach(stylesheet => {
hideFrame.contentDocument.head.appendChild(stylesheet.cloneNode(true));
});
hideFrame.contentDocument.body.appendChild(newDiv);
hideFrame.contentWindow.onbeforeunload = closePrint;
hideFrame.contentWindow.onafterprint = closePrint;
hideFrame.contentWindow.print();
}
};
setPrint();
};
// Set src and append to DOM after onload handler is set
hideFrame.src = 'about:blank';
document.body.appendChild(hideFrame);
}
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: PrintPrescriptionModalComponent, deps: [{ token: TranslationService }], target: i0.ɵɵFactoryTarget.Component });
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: PrintPrescriptionModalComponent, isStandalone: true, selector: "cardinal-print-prescription-modal", inputs: { prescribedMedications: "prescribedMedications", prescriber: "prescriber", patient: "patient" }, outputs: { onCloseModal: "onCloseModal" }, viewQueries: [{ propertyName: "printContainer", first: true, predicate: ["printContainer"], descendants: true }], ngImport: i0, template: "<div class=\"printPrescriptionModal\">\n <div class=\"printPrescriptionModal__contentWrap\">\n <div class=\"printPrescriptionModal__content\">\n <div class=\"printPrescriptionModal__content__header\">\n <h3>{{ t('practitioner.printModal.title') }}</h3>\n <button\n type=\"reset\"\n class=\"printPrescriptionModal__content__header__closeIcn\"\n (click)=\"onCloseModal.emit()\">\n <cardinal-close-icn color=\"#4B6682\" />\n </button>\n </div>\n <div class=\"printPrescriptionModal__content__body\">\n <div #printContainer id=\"print-container\">\n <cardinal-prescription-document-to-print\n [prescribedMedications]=\"sentPrescriptions\"\n [prescriber]=\"prescriber\"\n [patient]=\"patient\" />\n </div>\n </div>\n <div class=\"printPrescriptionModal__content__footer\">\n <cardinal-button\n [view]=\"'outlined'\"\n [type]=\"'reset'\"\n (click)=\"onCloseModal.emit()\">\n {{ t('practitioner.printModal.close') }}\n </cardinal-button>\n <cardinal-button [type]=\"'submit'\" (click)=\"print()\" [view]=\"'primary'\">\n {{ t('practitioner.printModal.print') }}\n </cardinal-button>\n </div>\n </div>\n </div>\n</div>\n", styles: ["*{margin:0;padding:0;font-size:100%;box-sizing:border-box;font-family:Inter Variable,sans-serif}a{text-decoration:none}a:active,a:hover{outline:0}ul,li{list-style-type:none;margin:0;padding:0}h1,h2,h3,h4,h5,h6{font-size:100%}html,body{box-sizing:border-box;font-size:16px;background-color:#fbfdff}*,*:before,*:after{box-sizing:border-box}:focus{outline:0}img,audio,video{max-width:100%;height:auto}iframe{border:0}textarea{resize:none;overflow:auto;vertical-align:top;box-shadow:none;-webkit-box-shadow:none;-moz-box-shadow:none}input,textarea,select,button{outline:none;border:none;font-size:100%;margin:0}button,input{line-height:normal}input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,textarea:-webkit-autofill,textarea:-webkit-autofill:hover,textarea:-webkit-autofill:focus,select:-webkit-autofill,select:-webkit-autofill:hover,select:-webkit-autofill:focus{-webkit-text-fill-color:rgb(0,0,0);transition:background-color 5000s ease-in-out 0s}table{border-collapse:collapse;border-spacing:0}td,th{padding:0;text-align:left}.printPrescriptionModal{width:100vw;height:100vh;position:fixed;top:0;left:0;z-index:100;display:flex;background:#084b834d}.printPrescriptionModal__contentWrap{width:900px;height:100%;max-height:100%;border:none;padding:0;margin:0 0 0 auto}@media only screen and (max-width: 992px){.printPrescriptionModal__contentWrap{width:100%;border-radius:.2em}}.printPrescriptionModal__content{display:flex;width:100%;height:100vh;overflow:hidden;flex-direction:column;align-items:flex-start;align-self:stretch}.printPrescriptionModal__content__header{display:flex;padding:20px 24px;justify-content:space-between;align-items:center;align-self:stretch;border-bottom:1px solid #e4e4e7;background:#fff}@media only screen and (max-width: 992px){.printPrescriptionModal__content__header{padding:20px 16px}}.printPrescriptionModal__content__header h3{color:#1d2235;font-size:16px;font-style:normal;font-weight:500;line-height:normal}.printPrescriptionModal__content__header__closeIcn{width:22px;height:22px;display:flex;justify-content:center;align-items:center;cursor:pointer;background-color:#fff;border-radius:4px}.printPrescriptionModal__content__header__closeIcn:hover{background-color:#e4e4e766}.printPrescriptionModal__content__body{width:100%;height:100%;overflow-y:auto;padding:24px 32px;display:flex;flex-direction:column;align-items:flex-start;align-self:stretch;flex:1 0 0;gap:12px;background-color:#f9fbfe}@media only screen and (max-width: 992px){.printPrescriptionModal__content__body{padding:16px}}@media only screen and (max-width: 576px){.printPrescriptionModal__content__body{padding:8px}}.printPrescriptionModal__content__body__content{width:100%;display:flex;flex-direction:column;align-items:flex-start;align-self:stretch;border-radius:12px;border:1px solid #e4e4e7;background:#fff;padding:24px;gap:12px}@media only screen and (max-width: 992px){.printPrescriptionModal__content__body__content{padding:18px}}.printPrescriptionModal__content__body cardinal-toggle-switch{flex:0 1 0;width:100%;min-width:0}.printPrescriptionModal__content__body__extraFieldsPreview{display:flex;width:100%;padding:12px;flex-direction:column;align-items:flex-start;align-self:stretch;border-radius:12px;border:1px solid #e4e4e7;background:#fff;box-shadow:0 1px 1px #dadade40}.printPrescriptionModal__content__body__extraFieldsPreview p{color:#848482b3;font-size:14px;font-style:normal;font-weight:400;line-height:22px}.printPrescriptionModal__content__footer{display:flex;padding:20px 24px;justify-content:flex-end;align-items:flex-start;gap:12px;align-self:stretch;border-top:1px solid #e4e4e7;background:#fff}\n"], dependencies: [{ kind: "component", type: PrescriptionDocumentToPrintComponent, selector: "cardinal-prescription-document-to-print", inputs: ["prescribedMedications", "prescriber", "patient"] }, { kind: "component", type: ButtonComponent, selector: "cardinal-button", inputs: ["view", "type", "formId", "disabled"], outputs: ["handleClick"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "component", type: CloseIcnComponent, selector: "cardinal-close-icn", inputs: ["color"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: PrintPrescriptionModalComponent, decorators: [{
type: Component,
args: [{ standalone: true, selector: 'cardinal-print-prescription-modal', imports: [
PrescriptionDocumentToPrintComponent,
ButtonComponent,
ReactiveFormsModule,
CloseIcnComponent,
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"printPrescriptionModal\">\n <div class=\"printPrescriptionModal__contentWrap\">\n <div class=\"printPrescriptionModal__content\">\n <div class=\"printPrescriptionModal__content__header\">\n <h3>{{ t('practitioner.printModal.title') }}</h3>\n <button\n type=\"reset\"\n class=\"printPrescriptionModal__content__header__closeIcn\"\n (click)=\"onCloseModal.emit()\">\n <cardinal-close-icn color=\"#4B6682\" />\n </button>\n </div>\n <div class=\"printPrescriptionModal__content__body\">\n <div #printContainer id=\"print-container\">\n <cardinal-prescription-document-to-print\n [prescribedMedications]=\"sentPrescriptions\"\n [prescriber]=\"prescriber\"\n [patient]=\"patient\" />\n </div>\n </div>\n <div class=\"printPrescriptionModal__content__footer\">\n <cardinal-button\n [view]=\"'outlined'\"\n [type]=\"'reset'\"\n (click)=\"onCloseModal.emit()\">\n {{ t('practitioner.printModal.close') }}\n </cardinal-button>\n <cardinal-button [type]=\"'submit'\" (click)=\"print()\" [view]=\"'primary'\">\n {{ t('practitioner.printModal.print') }}\n </cardinal-button>\n </div>\n </div>\n </div>\n</div>\n", styles: ["*{margin:0;padding:0;font-size:100%;box-sizing:border-box;font-family:Inter Variable,sans-serif}a{text-decoration:none}a:active,a:hover{outline:0}ul,li{list-style-type:none;margin:0;padding:0}h1,h2,h3,h4,h5,h6{font-size:100%}html,body{box-sizing:border-box;font-size:16px;background-color:#fbfdff}*,*:before,*:after{box-sizing:border-box}:focus{outline:0}img,audio,video{max-width:100%;height:auto}iframe{border:0}textarea{resize:none;overflow:auto;vertical-align:top;box-shadow:none;-webkit-box-shadow:none;-moz-box-shadow:none}input,textarea,select,button{outline:none;border:none;font-size:100%;margin:0}button,input{line-height:normal}input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,textarea:-webkit-autofill,textarea:-webkit-autofill:hover,textarea:-webkit-autofill:focus,select:-webkit-autofill,select:-webkit-autofill:hover,select:-webkit-autofill:focus{-webkit-text-fill-color:rgb(0,0,0);transition:background-color 5000s ease-in-out 0s}table{border-collapse:collapse;border-spacing:0}td,th{padding:0;text-align:left}.printPrescriptionModal{width:100vw;height:100vh;position:fixed;top:0;left:0;z-index:100;display:flex;background:#084b834d}.printPrescriptionModal__contentWrap{width:900px;height:100%;max-height:100%;border:none;padding:0;margin:0 0 0 auto}@media only screen and (max-width: 992px){.printPrescriptionModal__contentWrap{width:100%;border-radius:.2em}}.printPrescriptionModal__content{display:flex;width:100%;height:100vh;overflow:hidden;flex-direction:column;align-items:flex-start;align-self:stretch}.printPrescriptionModal__content__header{display:flex;padding:20px 24px;justify-content:space-between;align-items:center;align-self:stretch;border-bottom:1px solid #e4e4e7;background:#fff}@media only screen and (max-width: 992px){.printPrescriptionModal__content__header{padding:20px 16px}}.printPrescriptionModal__content__header h3{color:#1d2235;font-size:16px;font-style:normal;font-weight:500;line-height:normal}.printPrescriptionModal__content__header__closeIcn{width:22px;height:22px;display:flex;justify-content:center;align-items:center;cursor:pointer;background-color:#fff;border-radius:4px}.printPrescriptionModal__content__header__closeIcn:hover{background-color:#e4e4e766}.printPrescriptionModal__content__body{width:100%;height:100%;overflow-y:auto;padding:24px 32px;display:flex;flex-direction:column;align-items:flex-start;align-self:stretch;flex:1 0 0;gap:12px;background-color:#f9fbfe}@media only screen and (max-width: 992px){.printPrescriptionModal__content__body{padding:16px}}@media only screen and (max-width: 576px){.printPrescriptionModal__content__body{padding:8px}}.printPrescriptionModal__content__body__content{width:100%;display:flex;flex-direction:column;align-items:flex-start;align-self:stretch;border-radius:12px;border:1px solid #e4e4e7;background:#fff;padding:24px;gap:12px}@media only screen and (max-width: 992px){.printPrescriptionModal__content__body__content{padding:18px}}.printPrescriptionModal__content__body cardinal-toggle-switch{flex:0 1 0;width:100%;min-width:0}.printPrescriptionModal__content__body__extraFieldsPreview{display:flex;width:100%;padding:12px;flex-direction:column;align-items:flex-start;align-self:stretch;border-radius:12px;border:1px solid #e4e4e7;background:#fff;box-shadow:0 1px 1px #dadade40}.printPrescriptionModal__content__body__extraFieldsPreview p{color:#848482b3;font-size:14px;font-style:normal;font-weight:400;line-height:22px}.printPrescriptionModal__content__footer{display:flex;padding:20px 24px;justify-content:flex-end;align-items:flex-start;gap:12px;align-self:stretch;border-top:1px solid #e4e4e7;background:#fff}\n"] }]
}], ctorParameters: () => [{ type: TranslationService }], propDecorators: { prescribedMedications: [{
type: Input,
args: [{ required: true }]
}], prescriber: [{
type: Input,
args: [{ required: true }]
}], patient: [{
type: Input,
args: [{ required: true }]
}], onCloseModal: [{
type: Output
}], printContainer: [{
type: ViewChild,
args: ['printContainer', { static: false }]
}] } });
class IndexedDbTokenStoreService {
dbName = 'certificate-store';
storeName = 'certificates';
async open() {
return new Promise((resolve, reject) => {
const request = indexedDB.open(this.dbName, 1);
request.onupgradeneeded = () => {
const db = request.result;
if (!db.objectStoreNames.contains(this.storeName)) {
db.createObjectStore(this.storeName, { keyPath: 'id' });
}
};
request.onsuccess = () => resolve(request.result);
request.onerror = () => reject(request.error);
});
}
getTokenStore(db) {
return {
get: (key) => {
return new Promise((resolve, reject) => {
const tx = db.transaction(this.storeName, 'readonly');
const store = tx.objectStore(this.storeName);
const request = store.get(key);
request.onsuccess = () => {
request.result
? resolve(request.result.value)
: reject(new Error(`No value for key: ${key}`));
};
request.onerror = () => reject(request.error);
});
},
put: (key, value) => {
return new Promise((resolve, reject) => {
const tx = db.transaction(this.storeName, 'readwrite');
const store = tx.objectStore(this.storeName);
const request = store.put({ id: key, value });
request.onsuccess = () => resolve(value);
request.onerror = () => reject(request.error);
});
},
};
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: IndexedDbTokenStoreService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: IndexedDbTokenStoreService, providedIn: 'root' });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: IndexedDbTokenStoreService, decorators: [{
type: Injectable,
args: [{
providedIn: 'root',
}]
}] });
/*
* Public API Surface of cardinal-prescription-be-angular
*/
/**
* Generated bundle index. Do not edit.
*/
export { FhcService, IndexedDbTokenStoreService, MedicationSearchComponent, PractitionerCertificateComponent, PrescriptionListComponent, PrescriptionModalComponent, PrintPrescriptionModalComponent, SamSdkService, TranslationService, UploadPractitionerCertificateService };
//# sourceMappingURL=icure-cardinal-prescription-be-angular.mjs.map