@inera/ids-angular 8.1.0 → 9.0.0

package/fesm2022/inera-ids-angular-components-popover.mjs

@@ -1,53 +1,321 @@
 import * as i0 from '@angular/core';
-import { Input, Component, CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core';
-import '@inera/ids-core/components/popover/register';
+import { EventEmitter, HostListener, Output, Component, booleanAttribute, Input, inject, ElementRef, effect, ContentChildren, ContentChild, NgModule } from '@angular/core';
+import * as i2 from '@angular/common';
+import { CommonModule } from '@angular/common';
+import * as i1$1 from '@inera/ids-angular/common';
+import { IDClickOutsideDirective } from '@inera/ids-angular/common';
+import * as i1 from '@angular/cdk/a11y';
+import { A11yModule } from '@angular/cdk/a11y';
 
-class IDPopoverComponent {
-    constructor() { }
-    autofocus = false;
-    show = false;
-    srclosetext = 'Stäng';
-    maxwidth = 260;
-    maxheight = 260;
-    category = undefined;
+class IDPopoverCloseComponent {
+    clicked = new EventEmitter();
+    onClick = (e) => {
+        this.clicked.emit(e);
+    };
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: IDPopoverCloseComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: IDPopoverCloseComponent, isStandalone: true, selector: "id-popover-close", outputs: { clicked: "clicked" }, host: { listeners: { "click": "onClick()" } }, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: IDPopoverCloseComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'id-popover-close',
+                    standalone: true,
+                    template: `<ng-content></ng-content>`,
+                }]
+        }], propDecorators: { clicked: [{
+                type: Output
+            }], onClick: [{
+                type: HostListener,
+                args: ['click']
+            }] } });
+
+class IDPopoverContentComponent {
+    contentClosed = new EventEmitter();
     position = 'bottom';
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: IDPopoverComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: IDPopoverComponent, selector: "id-popover", inputs: { autofocus: "autofocus", show: "show", srclosetext: "srclosetext", maxwidth: "maxwidth", maxheight: "maxheight", category: "category", position: "position" }, ngImport: i0, template: "<ids-popover [attr.category]=\"category\" [attr.position]=\"position\">\n  <ng-content></ng-content>\n  <ids-popover-content\n    [attr.autofocus]=\"autofocus ? 'true' : null\"\n    [attr.srclosetext]=\"srclosetext\"\n    [attr.maxwidth]=\"maxwidth\"\n    [attr.maxheight]=\"maxheight\"\n    [attr.show]=\"show ? 'true' : null\">\n    <ng-content select=\"[slot='headline']\"></ng-content>\n    <ng-content select=\"[popover-content]\"></ng-content>\n  </ids-popover-content>\n</ids-popover>\n" });
+    closeOnBlur = false;
+    maxHeight = '260px';
+    maxWidth = '260px';
+    srCloseText = 'Stäng';
+    get contentMaxHeight() {
+        return `calc(${this.maxHeight} - 40px)`;
+    }
+    onClickedOutside(event) {
+        if (this.closeOnBlur) {
+            this.contentClosed.emit(event);
+        }
+    }
+    get caretPositionClass() {
+        return `ids-popover-content__caret--${this.position}`;
+    }
+    get hostClasses() {
+        return `ids-popover-content ids-popover-content--${this.position}`;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: IDPopoverContentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.2.14", type: IDPopoverContentComponent, isStandalone: true, selector: "id-popover-content", inputs: { closeOnBlur: ["closeOnBlur", "closeOnBlur", booleanAttribute], maxHeight: "maxHeight", maxWidth: "maxWidth", srCloseText: "srCloseText" }, outputs: { contentClosed: "contentClosed" }, host: { properties: { "class": "hostClasses" } }, ngImport: i0, template: `
+  <div [cdkTrapFocus]="true" idClickOutside (idClickOutside)="onClickedOutside($event)" class="ids-popover-content__content-wrapper"
+      [style.maxWidth]="maxWidth"
+      [style.maxHeight]="contentMaxHeight">
+    <div class="ids-popover-content__caret" [ngClass]="caretPositionClass">
+      <span class="ids-popover-content__caret-body" [ngClass]="caretPositionClass"></span>
+      <span class="ids-popover-content__caret-border" [ngClass]="caretPositionClass"></span>
+      <span class="ids-popover-content__caret-shadow" [ngClass]="caretPositionClass"></span>
+    </div>
+    <div class="ids-popover-content__top-bar">
+      <div class="ids-popover-content__close-btn-wrapper">
+        <button (click)="contentClosed.emit($event)" class="ids-popover-content__close-btn" [attr.aria-label]="srCloseText"></button>
+      </div>
+    </div>
+    <div tabindex="0" class="ids-popover-content__content-wrapper-inner">
+      <ng-content select="id-popover-header"></ng-content>
+      <ng-content></ng-content>
+    </div>
+  </div>`, isInline: true, dependencies: [{ kind: "ngmodule", type: A11yModule }, { kind: "directive", type: i1.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: IDClickOutsideDirective, selector: "[idClickOutside]", outputs: ["idClickOutside"] }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: IDPopoverComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: IDPopoverContentComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'id-popover', template: "<ids-popover [attr.category]=\"category\" [attr.position]=\"position\">\n  <ng-content></ng-content>\n  <ids-popover-content\n    [attr.autofocus]=\"autofocus ? 'true' : null\"\n    [attr.srclosetext]=\"srclosetext\"\n    [attr.maxwidth]=\"maxwidth\"\n    [attr.maxheight]=\"maxheight\"\n    [attr.show]=\"show ? 'true' : null\">\n    <ng-content select=\"[slot='headline']\"></ng-content>\n    <ng-content select=\"[popover-content]\"></ng-content>\n  </ids-popover-content>\n</ids-popover>\n" }]
-        }], ctorParameters: () => [], propDecorators: { autofocus: [{
-                type: Input
-            }], show: [{
+            args: [{
+                    selector: 'id-popover-content',
+                    standalone: true,
+                    imports: [A11yModule, CommonModule, IDClickOutsideDirective],
+                    template: `
+  <div [cdkTrapFocus]="true" idClickOutside (idClickOutside)="onClickedOutside($event)" class="ids-popover-content__content-wrapper"
+      [style.maxWidth]="maxWidth"
+      [style.maxHeight]="contentMaxHeight">
+    <div class="ids-popover-content__caret" [ngClass]="caretPositionClass">
+      <span class="ids-popover-content__caret-body" [ngClass]="caretPositionClass"></span>
+      <span class="ids-popover-content__caret-border" [ngClass]="caretPositionClass"></span>
+      <span class="ids-popover-content__caret-shadow" [ngClass]="caretPositionClass"></span>
+    </div>
+    <div class="ids-popover-content__top-bar">
+      <div class="ids-popover-content__close-btn-wrapper">
+        <button (click)="contentClosed.emit($event)" class="ids-popover-content__close-btn" [attr.aria-label]="srCloseText"></button>
+      </div>
+    </div>
+    <div tabindex="0" class="ids-popover-content__content-wrapper-inner">
+      <ng-content select="id-popover-header"></ng-content>
+      <ng-content></ng-content>
+    </div>
+  </div>`,
+                    host: {
+                        '[class]': 'hostClasses',
+                    }
+                }]
+        }], propDecorators: { contentClosed: [{
+                type: Output
+            }], closeOnBlur: [{
+                type: Input,
+                args: [{ transform: booleanAttribute }]
+            }], maxHeight: [{
                 type: Input
-            }], srclosetext: [{
+            }], maxWidth: [{
                 type: Input
-            }], maxwidth: [{
+            }], srCloseText: [{
                 type: Input
-            }], maxheight: [{
+            }] } });
+
+class IDPopoverComponent {
+    categoryCollection;
+    position = 'bottom';
+    category = '';
+    show = false;
+    showChange = new EventEmitter();
+    autoFocus = false;
+    closed = new EventEmitter();
+    opened = new EventEmitter();
+    bodyComponent;
+    closeComponents;
+    elementRef = inject(ElementRef);
+    opener = false;
+    constructor(categoryCollection) {
+        this.categoryCollection = categoryCollection;
+        effect(() => {
+            const categoryToClose = this.categoryCollection.closeCategory();
+            if (!categoryToClose || categoryToClose !== this.category)
+                return;
+            if (this.opener) {
+                this.opener = false;
+                return;
+            }
+            this.show = false;
+        });
+    }
+    ngOnChanges(changes) {
+        if (changes['position']) {
+            this.updatePosition(changes['position'].currentValue);
+        }
+    }
+    updatePosition(position) {
+        setTimeout(() => {
+            this.bodyComponent.position = position;
+        }, 0);
+    }
+    ngAfterContentInit() {
+        this.bodyComponent.contentClosed.subscribe((event) => {
+            this.closePopover(event);
+        });
+        this.closeComponents.forEach((closeComponent) => {
+            closeComponent.clicked.subscribe((event) => {
+                this.closePopover(event);
+            });
+        });
+    }
+    closeCategory() {
+    }
+    togglePopover(e) {
+        e.preventDefault();
+        if (this.show) {
+            this.closePopover(e);
+        }
+        else {
+            this.showPopover(e);
+        }
+    }
+    checkAutoFocus() {
+        if (this.autoFocus) {
+            setTimeout(() => {
+                const focusAnchor = this.elementRef.nativeElement.querySelector('.ids-focus-anchor');
+                const bodyComponent = this.elementRef.nativeElement.querySelector('.ids-popover-content__content-wrapper-inner');
+                if (focusAnchor) {
+                    focusAnchor.focus();
+                }
+                else if (bodyComponent) {
+                    bodyComponent.focus();
+                }
+            }, 0);
+        }
+    }
+    showPopover(event) {
+        this.opener = true;
+        this.categoryCollection.requestClose(this.category);
+        this.closeCategory();
+        this.show = true;
+        this.showChange.emit(this.show);
+        this.checkAutoFocus();
+        this.opened.emit(event);
+    }
+    handleKeyDown(event) {
+        if (event.key === 'Escape' && this.show) {
+            this.closePopover(event);
+        }
+    }
+    closePopover(event) {
+        this.show = false;
+        this.showChange.emit(this.show);
+        this.closed.emit(event);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: IDPopoverComponent, deps: [{ token: i1$1.IDTooltipCategoryService }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: IDPopoverComponent, isStandalone: true, selector: "id-popover", inputs: { position: "position", category: "category", show: ["show", "show", booleanAttribute], autoFocus: ["autoFocus", "autoFocus", booleanAttribute] }, outputs: { showChange: "showChange", closed: "closed", opened: "opened" }, host: { listeners: { "window:keydown": "handleKeyDown($event)" }, classAttribute: "ids-popover" }, queries: [{ propertyName: "bodyComponent", first: true, predicate: IDPopoverContentComponent, descendants: true }, { propertyName: "closeComponents", predicate: IDPopoverCloseComponent, descendants: true }], usesOnChanges: true, ngImport: i0, template: `
+    <span class="ids-popover-trigger" (click)="togglePopover($event)">
+      <ng-content></ng-content>
+    </span>
+    @if(show) {
+      <ng-content select="id-popover-content"></ng-content>
+    }
+  `, isInline: true });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: IDPopoverComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'id-popover',
+                    standalone: true,
+                    template: `
+    <span class="ids-popover-trigger" (click)="togglePopover($event)">
+      <ng-content></ng-content>
+    </span>
+    @if(show) {
+      <ng-content select="id-popover-content"></ng-content>
+    }
+  `,
+                    host: {
+                        class: 'ids-popover'
+                    }
+                }]
+        }], ctorParameters: () => [{ type: i1$1.IDTooltipCategoryService }], propDecorators: { position: [{
                 type: Input
             }], category: [{
                 type: Input
-            }], position: [{
-                type: Input
+            }], show: [{
+                type: Input,
+                args: [{ transform: booleanAttribute }]
+            }], showChange: [{
+                type: Output
+            }], autoFocus: [{
+                type: Input,
+                args: [{ transform: booleanAttribute }]
+            }], closed: [{
+                type: Output
+            }], opened: [{
+                type: Output
+            }], bodyComponent: [{
+                type: ContentChild,
+                args: [IDPopoverContentComponent, { descendants: true }]
+            }], closeComponents: [{
+                type: ContentChildren,
+                args: [IDPopoverCloseComponent, { descendants: true }]
+            }], handleKeyDown: [{
+                type: HostListener,
+                args: ['window:keydown', ['$event']]
             }] } });
 
+class IDPopoverHeaderComponent {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: IDPopoverHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: IDPopoverHeaderComponent, isStandalone: true, selector: "id-popover-header", host: { classAttribute: "ids-popover-content__headline" }, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: IDPopoverHeaderComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'id-popover-header',
+                    standalone: true,
+                    template: `<ng-content></ng-content>`,
+                    host: {
+                        class: 'ids-popover-content__headline'
+                    }
+                }]
+        }] });
+
+class IDPopoverTriggerComponent {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: IDPopoverTriggerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: IDPopoverTriggerComponent, isStandalone: true, selector: "id-popover-trigger", ngImport: i0, template: `<ng-content></ng-content>`, isInline: true });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: IDPopoverTriggerComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'id-popover-trigger',
+                    standalone: true,
+                    template: `<ng-content></ng-content>`,
+                }]
+        }] });
+
 class IDPopoverModule {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: IDPopoverModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.14", ngImport: i0, type: IDPopoverModule, declarations: [IDPopoverComponent], exports: [IDPopoverComponent] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: IDPopoverModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.14", ngImport: i0, type: IDPopoverModule, imports: [IDPopoverComponent,
+            IDPopoverHeaderComponent,
+            IDPopoverContentComponent,
+            IDPopoverTriggerComponent,
+            IDPopoverCloseComponent], exports: [IDPopoverComponent,
+            IDPopoverHeaderComponent,
+            IDPopoverContentComponent,
+            IDPopoverTriggerComponent,
+            IDPopoverCloseComponent] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: IDPopoverModule, imports: [IDPopoverContentComponent] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: IDPopoverModule, decorators: [{
             type: NgModule,
             args: [{
-                    declarations: [
-                        IDPopoverComponent
+                    imports: [
+                        IDPopoverComponent,
+                        IDPopoverHeaderComponent,
+                        IDPopoverContentComponent,
+                        IDPopoverTriggerComponent,
+                        IDPopoverCloseComponent
                     ],
                     exports: [
-                        IDPopoverComponent
+                        IDPopoverComponent,
+                        IDPopoverHeaderComponent,
+                        IDPopoverContentComponent,
+                        IDPopoverTriggerComponent,
+                        IDPopoverCloseComponent
                     ],
-                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
                 }]
         }] });
 
@@ -55,5 +323,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { IDPopoverComponent, IDPopoverModule };
+export { IDPopoverCloseComponent, IDPopoverComponent, IDPopoverContentComponent, IDPopoverHeaderComponent, IDPopoverModule, IDPopoverTriggerComponent };
 //# sourceMappingURL=inera-ids-angular-components-popover.mjs.map

package/fesm2022/inera-ids-angular-components-popover.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"inera-ids-angular-components-popover.mjs","sources":["../../../projects/ids-angular/components/popover/popover.component.ts","../../../projects/ids-angular/components/popover/popover.component.html","../../../projects/ids-angular/components/popover/popover.module.ts","../../../projects/ids-angular/components/popover/inera-ids-angular-components-popover.ts"],"sourcesContent":["import { Component, Input } from '@angular/core';\n\n@Component({\n  selector: 'id-popover',\n  templateUrl: './popover.component.html',\n})\nexport class IDPopoverComponent {\n  constructor() {}\n  @Input()\n  autofocus: boolean = false;\n  @Input()\n  show: boolean = false;\n  @Input()\n  srclosetext: string = 'Stäng';\n  @Input()\n  maxwidth: number = 260;\n  @Input()\n  maxheight: number = 260;\n  @Input()\n  category: string | undefined = undefined;\n  @Input()\n  position:\n    | 'top'\n    | 'top-left'\n    | 'top-right'\n    | 'right'\n    | 'right-top'\n    | 'right-bottom'\n    | 'bottom'\n    | 'bottom-left'\n    | 'bottom-right'\n    | 'left'\n    | 'left-top'\n    | 'left-bottom' = 'bottom';\n}\n","<ids-popover [attr.category]=\"category\" [attr.position]=\"position\">\n  <ng-content></ng-content>\n  <ids-popover-content\n    [attr.autofocus]=\"autofocus ? 'true' : null\"\n    [attr.srclosetext]=\"srclosetext\"\n    [attr.maxwidth]=\"maxwidth\"\n    [attr.maxheight]=\"maxheight\"\n    [attr.show]=\"show ? 'true' : null\">\n    <ng-content select=\"[slot='headline']\"></ng-content>\n    <ng-content select=\"[popover-content]\"></ng-content>\n  </ids-popover-content>\n</ids-popover>\n","import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core';\nimport { IDPopoverComponent } from './popover.component';\nimport '@inera/ids-core/components/popover/register';\n\n@NgModule({\n  declarations: [\n    IDPopoverComponent\n  ],\n  exports: [\n    IDPopoverComponent\n  ],\n  schemas: [CUSTOM_ELEMENTS_SCHEMA],\n})\nexport class IDPopoverModule { }\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;MAMa,kBAAkB,CAAA;AAC7B,IAAA,WAAA,GAAA,EAAe;IAEf,SAAS,GAAY,KAAK;IAE1B,IAAI,GAAY,KAAK;IAErB,WAAW,GAAW,OAAO;IAE7B,QAAQ,GAAW,GAAG;IAEtB,SAAS,GAAW,GAAG;IAEvB,QAAQ,GAAuB,SAAS;IAExC,QAAQ,GAYY,QAAQ;wGA3BjB,kBAAkB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAlB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,kBAAkB,0NCN/B,+eAYA,EAAA,CAAA;;4FDNa,kBAAkB,EAAA,UAAA,EAAA,CAAA;kBAJ9B,SAAS;+BACE,YAAY,EAAA,QAAA,EAAA,+eAAA,EAAA;wDAMtB,SAAS,EAAA,CAAA;sBADR;gBAGD,IAAI,EAAA,CAAA;sBADH;gBAGD,WAAW,EAAA,CAAA;sBADV;gBAGD,QAAQ,EAAA,CAAA;sBADP;gBAGD,SAAS,EAAA,CAAA;sBADR;gBAGD,QAAQ,EAAA,CAAA;sBADP;gBAGD,QAAQ,EAAA,CAAA;sBADP;;;MEPU,eAAe,CAAA;wGAAf,eAAe,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA;yGAAf,eAAe,EAAA,YAAA,EAAA,CAPxB,kBAAkB,CAAA,EAAA,OAAA,EAAA,CAGlB,kBAAkB,CAAA,EAAA,CAAA;yGAIT,eAAe,EAAA,CAAA;;4FAAf,eAAe,EAAA,UAAA,EAAA,CAAA;kBAT3B,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;AACR,oBAAA,YAAY,EAAE;wBACZ;AACD,qBAAA;AACD,oBAAA,OAAO,EAAE;wBACP;AACD,qBAAA;oBACD,OAAO,EAAE,CAAC,sBAAsB,CAAC;AAClC,iBAAA;;;ACZD;;AAEG;;;;"}
+{"version":3,"file":"inera-ids-angular-components-popover.mjs","sources":["../../../projects/ids-angular/components/popover/popover-close.component.ts","../../../projects/ids-angular/components/popover/popover-content.component.ts","../../../projects/ids-angular/components/popover/popover.component.ts","../../../projects/ids-angular/components/popover/popover-header.component.ts","../../../projects/ids-angular/components/popover/popover-trigger.component.ts","../../../projects/ids-angular/components/popover/popover.module.ts","../../../projects/ids-angular/components/popover/inera-ids-angular-components-popover.ts"],"sourcesContent":["import { Component, EventEmitter, HostListener, Output } from '@angular/core';\n\n@Component({\n  selector: 'id-popover-close',\n  standalone: true,\n  template: `<ng-content></ng-content>`,\n})\nexport class IDPopoverCloseComponent {\n  @Output() clicked = new EventEmitter<Event>();\n\n  @HostListener('click')\n  onClick = (e:Event) => {\n    this.clicked.emit(e);\n  }\n}","import { CommonModule } from '@angular/common';\nimport { booleanAttribute, Component, EventEmitter, Input, Output } from '@angular/core';\nimport { IDClickOutsideDirective } from '@inera/ids-angular/common';\nimport { A11yModule } from '@angular/cdk/a11y';\n\n@Component({\n  selector: 'id-popover-content',\n  standalone: true,\n  imports: [A11yModule, CommonModule, IDClickOutsideDirective],\n  template: `\n  <div [cdkTrapFocus]=\"true\" idClickOutside (idClickOutside)=\"onClickedOutside($event)\" class=\"ids-popover-content__content-wrapper\"\n      [style.maxWidth]=\"maxWidth\"\n      [style.maxHeight]=\"contentMaxHeight\">\n    <div class=\"ids-popover-content__caret\" [ngClass]=\"caretPositionClass\">\n      <span class=\"ids-popover-content__caret-body\" [ngClass]=\"caretPositionClass\"></span>\n      <span class=\"ids-popover-content__caret-border\" [ngClass]=\"caretPositionClass\"></span>\n      <span class=\"ids-popover-content__caret-shadow\" [ngClass]=\"caretPositionClass\"></span>\n    </div>\n    <div class=\"ids-popover-content__top-bar\">\n      <div class=\"ids-popover-content__close-btn-wrapper\">\n        <button (click)=\"contentClosed.emit($event)\" class=\"ids-popover-content__close-btn\" [attr.aria-label]=\"srCloseText\"></button>\n      </div>\n    </div>\n    <div tabindex=\"0\" class=\"ids-popover-content__content-wrapper-inner\">\n      <ng-content select=\"id-popover-header\"></ng-content>\n      <ng-content></ng-content>\n    </div>\n  </div>`,\n  host: {\n    '[class]': 'hostClasses',\n  }\n})\nexport class IDPopoverContentComponent {\n\n  @Output()\n  contentClosed: EventEmitter<Event> = new EventEmitter<Event>();\n\n  position = 'bottom';\n\n  @Input({transform: booleanAttribute}) closeOnBlur = false;\n  @Input() maxHeight = '260px';\n  @Input() maxWidth = '260px';\n  @Input() srCloseText = 'Stäng';\n\n  get contentMaxHeight() {\n    return `calc(${this.maxHeight} - 40px)`\n  }\n\n  onClickedOutside(event: Event) {\n    if(this.closeOnBlur) {\n      this.contentClosed.emit(event)\n    }\n  }\n\n  get caretPositionClass() {\n    return `ids-popover-content__caret--${this.position}`;\n  }\n\n  get hostClasses(): string {\n    return `ids-popover-content ids-popover-content--${this.position}`;\n  }\n}\n","import { AfterContentInit, booleanAttribute, Component, ContentChild, ContentChildren, effect, ElementRef, EventEmitter, HostListener, inject, Input, OnChanges, Output, QueryList, SimpleChanges } from '@angular/core';\nimport { IDPopoverCloseComponent } from './popover-close.component';\nimport { IDPopoverContentComponent } from './popover-content.component';\nimport { IDTooltipCategoryService } from '@inera/ids-angular/common';\n\n@Component({\n  selector: 'id-popover',\n  standalone: true,\n  template: `\n    <span class=\"ids-popover-trigger\" (click)=\"togglePopover($event)\">\n      <ng-content></ng-content>\n    </span>\n    @if(show) {\n      <ng-content select=\"id-popover-content\"></ng-content>\n    }\n  `,\n  host: {\n    class: 'ids-popover'\n  }\n})\nexport class IDPopoverComponent implements AfterContentInit, OnChanges {\n  @Input() position:\n    | 'top'\n    | 'top-left'\n    | 'top-right'\n    | 'right'\n    | 'right-top'\n    | 'right-bottom'\n    | 'bottom'\n    | 'bottom-left'\n    | 'bottom-right'\n    | 'left'\n    | 'left-top'\n    | 'left-bottom' = 'bottom';\n\n  @Input() category = '';\n  @Input({transform: booleanAttribute}) show: boolean = false;\n  @Output() showChange: EventEmitter<boolean> = new EventEmitter<boolean>();\n  @Input({transform: booleanAttribute}) autoFocus: boolean = false;\n  \n  @Output() closed: EventEmitter<Event> = new EventEmitter();\n  @Output() opened: EventEmitter<Event> = new EventEmitter();\n\n  @ContentChild(IDPopoverContentComponent, { descendants:true })\n  bodyComponent: IDPopoverContentComponent;\n\n  @ContentChildren(IDPopoverCloseComponent, { descendants: true })\n  closeComponents: QueryList<IDPopoverCloseComponent>;\n\n  elementRef = inject(ElementRef);\n  private opener = false;  \n\n  constructor(private categoryCollection: IDTooltipCategoryService) {\n    effect(() => {\n      const categoryToClose = this.categoryCollection.closeCategory();\n      if (!categoryToClose || categoryToClose !== this.category) return;\n      if (this.opener) {\n        this.opener = false;\n        return;\n      }\n      this.show = false;\n    });\n  }\n    \n  ngOnChanges(changes: SimpleChanges): void {\n    if (changes['position']) {\n      this.updatePosition(changes['position'].currentValue)\n    }\n  }\n\n  private updatePosition(position: string) {\n    setTimeout(() => {\n      this.bodyComponent.position = position;\n    }, 0);\n  }\n\n  ngAfterContentInit(): void {\n    this.bodyComponent.contentClosed.subscribe((event: Event) => {\n      this.closePopover(event);\n    })\n    this.closeComponents.forEach((closeComponent) => {\n      closeComponent.clicked.subscribe((event: Event) => {\n        this.closePopover(event);\n      })\n    });\n  }\n\n  closeCategory() {\n  }\n\n  togglePopover(e: Event) {\n    e.preventDefault();\n    if (this.show) {\n      this.closePopover(e);\n    } else {\n      this.showPopover(e);\n    }\n  }\n\n  checkAutoFocus() {\n    if(this.autoFocus) {\n      setTimeout(() => {\n        const focusAnchor = this.elementRef.nativeElement.querySelector('.ids-focus-anchor');\n        const bodyComponent = this.elementRef.nativeElement.querySelector('.ids-popover-content__content-wrapper-inner');\n        if(focusAnchor) {\n          focusAnchor.focus();\n        } else if (bodyComponent) {\n          bodyComponent.focus();\n        }\n      }, 0);\n    }\n  }\n  \n  showPopover(event: Event):void {\n    this.opener = true;\n    this.categoryCollection.requestClose(this.category);\n    this.closeCategory();\n    this.show = true;\n    this.showChange.emit(this.show);\n    this.checkAutoFocus();\n    this.opened.emit(event)\n  }\n\n  @HostListener('window:keydown', ['$event'])\n  handleKeyDown(event: KeyboardEvent) {\n    if (event.key === 'Escape' && this.show) {\n      this.closePopover(event);\n    }\n  }\n\n  closePopover(event: Event):void {\n    this.show = false;\n    this.showChange.emit(this.show);\n    this.closed.emit(event)\n  }\n}","import { Component } from '@angular/core';\n\n@Component({\n  selector: 'id-popover-header',\n  standalone: true,\n  template: `<ng-content></ng-content>`,\n  host: {\n    class: 'ids-popover-content__headline'\n  }\n})\nexport class IDPopoverHeaderComponent {}","import { Component } from '@angular/core';\n\n@Component({\n  selector: 'id-popover-trigger',\n  standalone: true,\n  template: `<ng-content></ng-content>`,\n})\nexport class IDPopoverTriggerComponent {}","import { NgModule } from '@angular/core';\n\nimport { IDPopoverComponent } from './popover.component';\nimport { IDPopoverHeaderComponent } from './popover-header.component';\nimport { IDPopoverContentComponent } from './popover-content.component';\nimport { IDPopoverTriggerComponent } from './popover-trigger.component';\nimport { IDPopoverCloseComponent } from './popover-close.component';\n\n\n@NgModule({\n  imports: [\n    IDPopoverComponent,\n    IDPopoverHeaderComponent,\n    IDPopoverContentComponent,\n    IDPopoverTriggerComponent,\n    IDPopoverCloseComponent\n  ],\n  exports: [\n    IDPopoverComponent,\n    IDPopoverHeaderComponent,\n    IDPopoverContentComponent,\n    IDPopoverTriggerComponent,\n    IDPopoverCloseComponent\n  ],\n})\nexport class IDPopoverModule {}","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":["i1"],"mappings":"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"}

package/fesm2022/inera-ids-angular-components-progressbar.mjs

@@ -1,50 +1,31 @@
 import * as i0 from '@angular/core';
-import { Input, Component, CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core';
-import '@inera/ids-core/components/progressbar/register';
+import { booleanAttribute, Input, Component } from '@angular/core';
 
 class IDProgressbarComponent {
-    constructor() { }
     value = 0;
-    hidelabel = false;
-    srlabel = "";
+    hideLabel = false;
+    srLabel = "";
     label = "";
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: IDProgressbarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: IDProgressbarComponent, selector: "id-progressbar", inputs: { value: "value", hidelabel: "hidelabel", srlabel: "srlabel", label: "label" }, ngImport: i0, template: "<ids-progressbar \n  [value]=\"value\"\n  [hidelabel]=\"hidelabel\"\n  [srlabel]=\"srlabel\"\n  [label]=\"label\">\n</ids-progressbar>" });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: IDProgressbarComponent, isStandalone: true, selector: "id-progressbar", inputs: { value: "value", hideLabel: ["hideLabel", "hideLabel", booleanAttribute], srLabel: "srLabel", label: "label" }, ngImport: i0, template: "<div class=\"ids-progressbar\">\n  @if(label && !hideLabel) {\n    <div class=\"ids-progressbar__label\">{{this.label}} {{this.value}}%</div> \n  } @else if(!hideLabel) {\n    <div class=\"ids-progressbar__label\">{{this.value}}%</div>\n  }\n  <div\n    class=\"ids-progressbar__bar\"\n    role=\"progressbar\"\n    [attr.aria-label]=\"srLabel\"\n    aria-valuemin=\"0\"\n    aria-valuemax=\"100\"\n    [attr.aria-valuenow]=\"value\">\n    <div\n      [class.ids-progressbar__progress]=\"value > 0\"\n      [class.ids-progressbar__progress--none]=\"value == 0\"\n      [style.width]=\"'calc(' + value + '% + 0.125rem)'\"></div>\n  </div>\n</div>" });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: IDProgressbarComponent, decorators: [{
             type: Component,
-            args: [{ selector: "id-progressbar", template: "<ids-progressbar \n  [value]=\"value\"\n  [hidelabel]=\"hidelabel\"\n  [srlabel]=\"srlabel\"\n  [label]=\"label\">\n</ids-progressbar>" }]
-        }], ctorParameters: () => [], propDecorators: { value: [{
+            args: [{ selector: "id-progressbar", standalone: true, template: "<div class=\"ids-progressbar\">\n  @if(label && !hideLabel) {\n    <div class=\"ids-progressbar__label\">{{this.label}} {{this.value}}%</div> \n  } @else if(!hideLabel) {\n    <div class=\"ids-progressbar__label\">{{this.value}}%</div>\n  }\n  <div\n    class=\"ids-progressbar__bar\"\n    role=\"progressbar\"\n    [attr.aria-label]=\"srLabel\"\n    aria-valuemin=\"0\"\n    aria-valuemax=\"100\"\n    [attr.aria-valuenow]=\"value\">\n    <div\n      [class.ids-progressbar__progress]=\"value > 0\"\n      [class.ids-progressbar__progress--none]=\"value == 0\"\n      [style.width]=\"'calc(' + value + '% + 0.125rem)'\"></div>\n  </div>\n</div>" }]
+        }], propDecorators: { value: [{
                 type: Input
-            }], hidelabel: [{
-                type: Input
-            }], srlabel: [{
+            }], hideLabel: [{
+                type: Input,
+                args: [{ transform: booleanAttribute }]
+            }], srLabel: [{
                 type: Input
             }], label: [{
                 type: Input
             }] } });
 
-class IDProgressbarModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: IDProgressbarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.14", ngImport: i0, type: IDProgressbarModule, declarations: [IDProgressbarComponent], exports: [IDProgressbarComponent] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: IDProgressbarModule });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: IDProgressbarModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [
-                        IDProgressbarComponent
-                    ],
-                    exports: [
-                        IDProgressbarComponent
-                    ],
-                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
-                }]
-        }] });
-
 /**
  * Generated bundle index. Do not edit.
  */
 
-export { IDProgressbarComponent, IDProgressbarModule };
+export { IDProgressbarComponent };
 //# sourceMappingURL=inera-ids-angular-components-progressbar.mjs.map

package/fesm2022/inera-ids-angular-components-progressbar.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"inera-ids-angular-components-progressbar.mjs","sources":["../../../projects/ids-angular/components/progressbar/progressbar.component.ts","../../../projects/ids-angular/components/progressbar/progressbar.component.html","../../../projects/ids-angular/components/progressbar/progressbar.module.ts","../../../projects/ids-angular/components/progressbar/inera-ids-angular-components-progressbar.ts"],"sourcesContent":["import { Component, Input } from \"@angular/core\";\n\n@Component({\n  selector: \"id-progressbar\",\n  templateUrl: \"./progressbar.component.html\"\n})\nexport class IDProgressbarComponent {\n  constructor() {}\n\n  @Input()\n  value: number = 0;\n\n  @Input()\n  hidelabel: boolean = false;\n\n  @Input()\n  srlabel: string = \"\";\n\n  @Input()\n  label: string = \"\";\n}\n","<ids-progressbar \n  [value]=\"value\"\n  [hidelabel]=\"hidelabel\"\n  [srlabel]=\"srlabel\"\n  [label]=\"label\">\n</ids-progressbar>","import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core';\nimport { IDProgressbarComponent } from './progressbar.component';\nimport '@inera/ids-core/components/progressbar/register';\n\n@NgModule({\n  declarations: [\n    IDProgressbarComponent\n  ],\n  exports: [\n    IDProgressbarComponent\n  ],\n  schemas: [CUSTOM_ELEMENTS_SCHEMA],\n})\nexport class IDProgressbarModule { }\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;MAMa,sBAAsB,CAAA;AACjC,IAAA,WAAA,GAAA,EAAe;IAGf,KAAK,GAAW,CAAC;IAGjB,SAAS,GAAY,KAAK;IAG1B,OAAO,GAAW,EAAE;IAGpB,KAAK,GAAW,EAAE;wGAbP,sBAAsB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAtB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,sBAAsB,8ICNnC,wIAKkB,EAAA,CAAA;;4FDCL,sBAAsB,EAAA,UAAA,EAAA,CAAA;kBAJlC,SAAS;+BACE,gBAAgB,EAAA,QAAA,EAAA,wIAAA,EAAA;wDAO1B,KAAK,EAAA,CAAA;sBADJ;gBAID,SAAS,EAAA,CAAA;sBADR;gBAID,OAAO,EAAA,CAAA;sBADN;gBAID,KAAK,EAAA,CAAA;sBADJ;;;MELU,mBAAmB,CAAA;wGAAnB,mBAAmB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA;yGAAnB,mBAAmB,EAAA,YAAA,EAAA,CAP5B,sBAAsB,CAAA,EAAA,OAAA,EAAA,CAGtB,sBAAsB,CAAA,EAAA,CAAA;yGAIb,mBAAmB,EAAA,CAAA;;4FAAnB,mBAAmB,EAAA,UAAA,EAAA,CAAA;kBAT/B,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;AACR,oBAAA,YAAY,EAAE;wBACZ;AACD,qBAAA;AACD,oBAAA,OAAO,EAAE;wBACP;AACD,qBAAA;oBACD,OAAO,EAAE,CAAC,sBAAsB,CAAC;AAClC,iBAAA;;;ACZD;;AAEG;;;;"}
+{"version":3,"file":"inera-ids-angular-components-progressbar.mjs","sources":["../../../projects/ids-angular/components/progressbar/progressbar.component.ts","../../../projects/ids-angular/components/progressbar/progressbar.component.html","../../../projects/ids-angular/components/progressbar/inera-ids-angular-components-progressbar.ts"],"sourcesContent":["import { booleanAttribute, Component, Input } from \"@angular/core\";\n\n@Component({\n  selector: \"id-progressbar\",\n  templateUrl: \"./progressbar.component.html\",\n  standalone: true\n})\nexport class IDProgressbarComponent {\n\n  @Input() value: number = 0;\n  @Input({transform: booleanAttribute}) hideLabel: boolean = false;\n  @Input() srLabel: string = \"\";\n  @Input() label: string = \"\";\n\n}\n","<div class=\"ids-progressbar\">\n  @if(label && !hideLabel) {\n    <div class=\"ids-progressbar__label\">{{this.label}} {{this.value}}%</div> \n  } @else if(!hideLabel) {\n    <div class=\"ids-progressbar__label\">{{this.value}}%</div>\n  }\n  <div\n    class=\"ids-progressbar__bar\"\n    role=\"progressbar\"\n    [attr.aria-label]=\"srLabel\"\n    aria-valuemin=\"0\"\n    aria-valuemax=\"100\"\n    [attr.aria-valuenow]=\"value\">\n    <div\n      [class.ids-progressbar__progress]=\"value > 0\"\n      [class.ids-progressbar__progress--none]=\"value == 0\"\n      [style.width]=\"'calc(' + value + '% + 0.125rem)'\"></div>\n  </div>\n</div>","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;MAOa,sBAAsB,CAAA;IAExB,KAAK,GAAW,CAAC;IACY,SAAS,GAAY,KAAK;IACvD,OAAO,GAAW,EAAE;IACpB,KAAK,GAAW,EAAE;wGALhB,sBAAsB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;4FAAtB,sBAAsB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,gBAAA,EAAA,MAAA,EAAA,EAAA,KAAA,EAAA,OAAA,EAAA,SAAA,EAAA,CAAA,WAAA,EAAA,WAAA,EAGd,gBAAgB,CAAA,EAAA,OAAA,EAAA,SAAA,EAAA,KAAA,EAAA,OAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECVrC,uoBAkBM,EAAA,CAAA;;4FDXO,sBAAsB,EAAA,UAAA,EAAA,CAAA;kBALlC,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,gBAAgB,cAEd,IAAI,EAAA,QAAA,EAAA,uoBAAA,EAAA;8BAIP,KAAK,EAAA,CAAA;sBAAb;gBACqC,SAAS,EAAA,CAAA;sBAA9C,KAAK;uBAAC,EAAC,SAAS,EAAE,gBAAgB,EAAC;gBAC3B,OAAO,EAAA,CAAA;sBAAf;gBACQ,KAAK,EAAA,CAAA;sBAAb;;;AEZH;;AAEG;;;;"}