pdm-ui-kit 0.4.0 → 0.4.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/esm2020/lib/components/alert/alert.component.mjs +3 -3
- package/esm2020/lib/components/alert-dialog/alert-dialog.component.mjs +3 -3
- package/esm2020/lib/components/avatar/avatar.component.mjs +3 -3
- package/esm2020/lib/components/badge/badge.component.mjs +3 -3
- package/esm2020/lib/components/button/button.component.mjs +2 -2
- package/esm2020/lib/components/button-group/button-group.component.mjs +2 -2
- package/esm2020/lib/components/calendar/calendar.component.mjs +114 -92
- package/esm2020/lib/components/card/card.component.mjs +3 -3
- package/esm2020/lib/components/carousel/carousel.component.mjs +3 -3
- package/esm2020/lib/components/chart/chart.component.mjs +3 -3
- package/esm2020/lib/components/checkbox/checkbox.component.mjs +3 -3
- package/esm2020/lib/components/collapsible/collapsible.component.mjs +3 -3
- package/esm2020/lib/components/combobox/combobox.component.mjs +3 -3
- package/esm2020/lib/components/command/command.component.mjs +3 -3
- package/esm2020/lib/components/context-menu/context-menu.component.mjs +3 -3
- package/esm2020/lib/components/data-table/data-table.component.mjs +3 -3
- package/esm2020/lib/components/date-picker/date-picker.component.mjs +2 -2
- package/esm2020/lib/components/dialog/dialog.component.mjs +4 -4
- package/esm2020/lib/components/draggable-table/draggable-table.component.mjs +3 -3
- package/esm2020/lib/components/drawer/drawer.component.mjs +4 -4
- package/esm2020/lib/components/dropdown-menu/dropdown-menu.component.mjs +3 -3
- package/esm2020/lib/components/empty/empty.component.mjs +2 -2
- package/esm2020/lib/components/hover-card/hover-card.component.mjs +3 -3
- package/esm2020/lib/components/input/input.component.mjs +3 -3
- package/esm2020/lib/components/input-group/input-group.component.mjs +3 -3
- package/esm2020/lib/components/input-otp/input-otp.component.mjs +2 -2
- package/esm2020/lib/components/input-password/input-password.component.mjs +3 -3
- package/esm2020/lib/components/kbd/kbd.component.mjs +3 -3
- package/esm2020/lib/components/menubar/menubar.component.mjs +3 -3
- package/esm2020/lib/components/native-select/native-select.component.mjs +3 -3
- package/esm2020/lib/components/pagination/pagination.component.mjs +3 -3
- package/esm2020/lib/components/popover/popover.component.mjs +3 -3
- package/esm2020/lib/components/radio-group/radio-group.component.mjs +3 -3
- package/esm2020/lib/components/scroll-area/scroll-area.component.mjs +3 -3
- package/esm2020/lib/components/select/select.component.mjs +3 -3
- package/esm2020/lib/components/sheet/sheet.component.mjs +3 -3
- package/esm2020/lib/components/slider/slider.component.mjs +3 -3
- package/esm2020/lib/components/sonner/sonner.component.mjs +3 -3
- package/esm2020/lib/components/switch/switch.component.mjs +2 -2
- package/esm2020/lib/components/table/table.component.mjs +3 -3
- package/esm2020/lib/components/tabs/tabs.component.mjs +3 -3
- package/esm2020/lib/components/textarea/textarea.component.mjs +3 -3
- package/esm2020/lib/components/toggle-group/toggle-group.component.mjs +3 -3
- package/fesm2015/pdm-ui-kit.mjs +189 -169
- package/fesm2015/pdm-ui-kit.mjs.map +1 -1
- package/fesm2020/pdm-ui-kit.mjs +193 -171
- package/fesm2020/pdm-ui-kit.mjs.map +1 -1
- package/lib/components/calendar/calendar.component.d.ts +4 -5
- package/package.json +1 -1
package/fesm2015/pdm-ui-kit.mjs
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import * as i1 from '@angular/common';
|
|
2
2
|
import { isPlatformBrowser, DOCUMENT, CommonModule } from '@angular/common';
|
|
3
3
|
import * as i0 from '@angular/core';
|
|
4
|
-
import { EventEmitter, Component, ChangeDetectionStrategy, Input, Output, HostListener, ViewChild, ViewChildren, ElementRef, PLATFORM_ID, Directive, Inject, ContentChildren,
|
|
4
|
+
import { EventEmitter, Component, ChangeDetectionStrategy, Input, Output, HostListener, inject, ChangeDetectorRef, ViewChild, ViewChildren, ElementRef, PLATFORM_ID, Directive, Inject, ContentChildren, NgModule } from '@angular/core';
|
|
5
5
|
import * as i1$1 from '@angular/cdk/overlay';
|
|
6
6
|
import { OverlayModule } from '@angular/cdk/overlay';
|
|
7
7
|
import { TemplatePortal } from '@angular/cdk/portal';
|
|
@@ -65,10 +65,10 @@ class PdmAlertComponent {
|
|
|
65
65
|
}
|
|
66
66
|
}
|
|
67
67
|
PdmAlertComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmAlertComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
68
|
-
PdmAlertComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmAlertComponent, selector: "pdm-alert", inputs: { variant: "variant", title: "title", description: "description", details: "details", className: "className" }, ngImport: i0, template: "<section\n role=\"alert\"\n [ngClass]=\"[\n 'w-full rounded-lg border border-border bg-background p-4',\n className\n ]\"\n>\n <div [ngClass]=\"['flex gap-3', isDestructive ? 'items-start' : 'items-center']\">\n <span class=\"inline-flex h-6 w-6 shrink-0 items-center justify-center\">\n <svg *ngIf=\"!isDestructive && !isTitleOnly\" viewBox=\"0 0 24 24\" class=\"h-5 w-5 text-foreground\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <circle cx=\"12\" cy=\"12\" r=\"9\" stroke=\"currentColor\" stroke-width=\"1.5\"></circle>\n <path d=\"M8.5 12.5L10.8 14.8L15.8 9.8\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path>\n </svg>\n <svg *ngIf=\"isTitleOnly\" viewBox=\"0 0 24 24\" class=\"h-5 w-5 text-foreground\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M5 8H19\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\"></path>\n <path d=\"M9 8V6.5C9 5.67 9.67 5 10.5 5H13.5C14.33 5 15 5.67 15 6.5V8\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\"></path>\n <path d=\"M7 8L8 18.5C8.07 19.33 8.77 20 9.6 20H14.4C15.23 20 15.93 19.33 16 18.5L17 8\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\"></path>\n </svg>\n <svg *ngIf=\"isDestructive\" viewBox=\"0 0 24 24\" class=\"h-5 w-5 text-destructive\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <circle cx=\"12\" cy=\"12\" r=\"9\" stroke=\"currentColor\" stroke-width=\"1.5\"></circle>\n <path d=\"M12 8V12\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\"></path>\n <circle cx=\"12\" cy=\"16\" r=\"1\" fill=\"currentColor\"></circle>\n </svg>\n </span>\n\n <div class=\"min-w-0 flex-1\">\n <h4\n [ngClass]=\"[\n 'm-0 text-sm font-medium',\n isDestructive ? 'text-destructive' : 'text-foreground'\n ]\"\n >\n {{ title }}\n </h4>\n\n <p\n *ngIf=\"!isTitleOnly && description\"\n [ngClass]=\"[\n 'm-0 mt-0.5 text-sm',\n isDestructive ? 'text-destructive' : 'text-muted-foreground'\n ]\"\n >\n {{ description }}\n </p>\n\n <ul *ngIf=\"isDestructive && details.length\" class=\"m-0 mt-1 pl-5 text-sm text-destructive\">\n <li *ngFor=\"let item of details\">{{ item }}</li>\n </ul>\n </div>\n </div>\n</section>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
68
|
+
PdmAlertComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmAlertComponent, selector: "pdm-alert", inputs: { variant: "variant", title: "title", description: "description", details: "details", className: "className" }, ngImport: i0, template: "<section\n role=\"alert\"\n [ngClass]=\"[\n 'w-full rounded-lg border border-solid border-border bg-background p-4',\n className\n ]\"\n>\n <div [ngClass]=\"['flex gap-3', isDestructive ? 'items-start' : 'items-center']\">\n <span class=\"inline-flex h-6 w-6 shrink-0 items-center justify-center\">\n <svg *ngIf=\"!isDestructive && !isTitleOnly\" viewBox=\"0 0 24 24\" class=\"h-5 w-5 text-foreground\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <circle cx=\"12\" cy=\"12\" r=\"9\" stroke=\"currentColor\" stroke-width=\"1.5\"></circle>\n <path d=\"M8.5 12.5L10.8 14.8L15.8 9.8\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path>\n </svg>\n <svg *ngIf=\"isTitleOnly\" viewBox=\"0 0 24 24\" class=\"h-5 w-5 text-foreground\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M5 8H19\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\"></path>\n <path d=\"M9 8V6.5C9 5.67 9.67 5 10.5 5H13.5C14.33 5 15 5.67 15 6.5V8\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\"></path>\n <path d=\"M7 8L8 18.5C8.07 19.33 8.77 20 9.6 20H14.4C15.23 20 15.93 19.33 16 18.5L17 8\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\"></path>\n </svg>\n <svg *ngIf=\"isDestructive\" viewBox=\"0 0 24 24\" class=\"h-5 w-5 text-destructive\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <circle cx=\"12\" cy=\"12\" r=\"9\" stroke=\"currentColor\" stroke-width=\"1.5\"></circle>\n <path d=\"M12 8V12\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\"></path>\n <circle cx=\"12\" cy=\"16\" r=\"1\" fill=\"currentColor\"></circle>\n </svg>\n </span>\n\n <div class=\"min-w-0 flex-1\">\n <h4\n [ngClass]=\"[\n 'm-0 text-sm font-medium',\n isDestructive ? 'text-destructive' : 'text-foreground'\n ]\"\n >\n {{ title }}\n </h4>\n\n <p\n *ngIf=\"!isTitleOnly && description\"\n [ngClass]=\"[\n 'm-0 mt-0.5 text-sm',\n isDestructive ? 'text-destructive' : 'text-muted-foreground'\n ]\"\n >\n {{ description }}\n </p>\n\n <ul *ngIf=\"isDestructive && details.length\" class=\"m-0 mt-1 pl-5 text-sm text-destructive\">\n <li *ngFor=\"let item of details\">{{ item }}</li>\n </ul>\n </div>\n </div>\n</section>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
69
69
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmAlertComponent, decorators: [{
|
|
70
70
|
type: Component,
|
|
71
|
-
args: [{ selector: 'pdm-alert', changeDetection: ChangeDetectionStrategy.OnPush, template: "<section\n role=\"alert\"\n [ngClass]=\"[\n 'w-full rounded-lg border border-border bg-background p-4',\n className\n ]\"\n>\n <div [ngClass]=\"['flex gap-3', isDestructive ? 'items-start' : 'items-center']\">\n <span class=\"inline-flex h-6 w-6 shrink-0 items-center justify-center\">\n <svg *ngIf=\"!isDestructive && !isTitleOnly\" viewBox=\"0 0 24 24\" class=\"h-5 w-5 text-foreground\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <circle cx=\"12\" cy=\"12\" r=\"9\" stroke=\"currentColor\" stroke-width=\"1.5\"></circle>\n <path d=\"M8.5 12.5L10.8 14.8L15.8 9.8\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path>\n </svg>\n <svg *ngIf=\"isTitleOnly\" viewBox=\"0 0 24 24\" class=\"h-5 w-5 text-foreground\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M5 8H19\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\"></path>\n <path d=\"M9 8V6.5C9 5.67 9.67 5 10.5 5H13.5C14.33 5 15 5.67 15 6.5V8\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\"></path>\n <path d=\"M7 8L8 18.5C8.07 19.33 8.77 20 9.6 20H14.4C15.23 20 15.93 19.33 16 18.5L17 8\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\"></path>\n </svg>\n <svg *ngIf=\"isDestructive\" viewBox=\"0 0 24 24\" class=\"h-5 w-5 text-destructive\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <circle cx=\"12\" cy=\"12\" r=\"9\" stroke=\"currentColor\" stroke-width=\"1.5\"></circle>\n <path d=\"M12 8V12\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\"></path>\n <circle cx=\"12\" cy=\"16\" r=\"1\" fill=\"currentColor\"></circle>\n </svg>\n </span>\n\n <div class=\"min-w-0 flex-1\">\n <h4\n [ngClass]=\"[\n 'm-0 text-sm font-medium',\n isDestructive ? 'text-destructive' : 'text-foreground'\n ]\"\n >\n {{ title }}\n </h4>\n\n <p\n *ngIf=\"!isTitleOnly && description\"\n [ngClass]=\"[\n 'm-0 mt-0.5 text-sm',\n isDestructive ? 'text-destructive' : 'text-muted-foreground'\n ]\"\n >\n {{ description }}\n </p>\n\n <ul *ngIf=\"isDestructive && details.length\" class=\"m-0 mt-1 pl-5 text-sm text-destructive\">\n <li *ngFor=\"let item of details\">{{ item }}</li>\n </ul>\n </div>\n </div>\n</section>\n" }]
|
|
71
|
+
args: [{ selector: 'pdm-alert', changeDetection: ChangeDetectionStrategy.OnPush, template: "<section\n role=\"alert\"\n [ngClass]=\"[\n 'w-full rounded-lg border border-solid border-border bg-background p-4',\n className\n ]\"\n>\n <div [ngClass]=\"['flex gap-3', isDestructive ? 'items-start' : 'items-center']\">\n <span class=\"inline-flex h-6 w-6 shrink-0 items-center justify-center\">\n <svg *ngIf=\"!isDestructive && !isTitleOnly\" viewBox=\"0 0 24 24\" class=\"h-5 w-5 text-foreground\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <circle cx=\"12\" cy=\"12\" r=\"9\" stroke=\"currentColor\" stroke-width=\"1.5\"></circle>\n <path d=\"M8.5 12.5L10.8 14.8L15.8 9.8\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path>\n </svg>\n <svg *ngIf=\"isTitleOnly\" viewBox=\"0 0 24 24\" class=\"h-5 w-5 text-foreground\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M5 8H19\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\"></path>\n <path d=\"M9 8V6.5C9 5.67 9.67 5 10.5 5H13.5C14.33 5 15 5.67 15 6.5V8\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\"></path>\n <path d=\"M7 8L8 18.5C8.07 19.33 8.77 20 9.6 20H14.4C15.23 20 15.93 19.33 16 18.5L17 8\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\"></path>\n </svg>\n <svg *ngIf=\"isDestructive\" viewBox=\"0 0 24 24\" class=\"h-5 w-5 text-destructive\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <circle cx=\"12\" cy=\"12\" r=\"9\" stroke=\"currentColor\" stroke-width=\"1.5\"></circle>\n <path d=\"M12 8V12\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\"></path>\n <circle cx=\"12\" cy=\"16\" r=\"1\" fill=\"currentColor\"></circle>\n </svg>\n </span>\n\n <div class=\"min-w-0 flex-1\">\n <h4\n [ngClass]=\"[\n 'm-0 text-sm font-medium',\n isDestructive ? 'text-destructive' : 'text-foreground'\n ]\"\n >\n {{ title }}\n </h4>\n\n <p\n *ngIf=\"!isTitleOnly && description\"\n [ngClass]=\"[\n 'm-0 mt-0.5 text-sm',\n isDestructive ? 'text-destructive' : 'text-muted-foreground'\n ]\"\n >\n {{ description }}\n </p>\n\n <ul *ngIf=\"isDestructive && details.length\" class=\"m-0 mt-1 pl-5 text-sm text-destructive\">\n <li *ngFor=\"let item of details\">{{ item }}</li>\n </ul>\n </div>\n </div>\n</section>\n" }]
|
|
72
72
|
}], propDecorators: { variant: [{
|
|
73
73
|
type: Input
|
|
74
74
|
}], title: [{
|
|
@@ -132,10 +132,10 @@ class PdmAlertDialogComponent {
|
|
|
132
132
|
}
|
|
133
133
|
}
|
|
134
134
|
PdmAlertDialogComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmAlertDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
135
|
-
PdmAlertDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmAlertDialogComponent, selector: "pdm-alert-dialog", inputs: { open: "open", showTrigger: "showTrigger", triggerText: "triggerText", title: "title", description: "description", confirmText: "confirmText", cancelText: "cancelText", className: "className", closeOnEsc: "closeOnEsc" }, outputs: { openChange: "openChange", confirm: "confirm", cancel: "cancel" }, host: { listeners: { "document:keydown.escape": "onEsc()" } }, ngImport: i0, template: "<button\n *ngIf=\"showTrigger && !open\"\n type=\"button\"\n class=\"inline-flex h-9 appearance-none box-border items-center justify-center rounded-md border border-input bg-background px-4 py-2 text-sm font-medium text-foreground shadow-sm\"\n (click)=\"onTriggerClick()\"\n>\n {{ triggerText }}\n</button>\n\n<div *ngIf=\"open\" class=\"fixed inset-0 z-50 flex items-center justify-center p-5\">\n <div class=\"absolute inset-0 bg-foreground/30\" (click)=\"onCancel()\"></div>\n <section\n role=\"alertdialog\"\n aria-modal=\"true\"\n [ngClass]=\"[\n 'relative z-[60] w-full max-w-lg rounded-lg border border-border bg-background p-6 text-foreground shadow-lg',\n className\n ]\"\n >\n <div class=\"flex flex-col gap-2\">\n <h2 class=\"m-0 text-lg font-semibold leading-none tracking-tight\">{{ title }}</h2>\n <p *ngIf=\"description\" class=\"m-0 text-sm text-muted-foreground\">{{ description }}</p>\n </div>\n <div class=\"mt-4 flex items-center justify-end gap-2\">\n <button\n type=\"button\"\n class=\"inline-flex h-9 appearance-none box-border items-center justify-center rounded-md border border-input bg-background px-4 py-2 text-sm font-medium text-foreground shadow-sm\"\n (click)=\"onCancel()\"\n >\n {{ cancelText }}\n </button>\n <button\n type=\"button\"\n class=\"inline-flex h-9 appearance-none box-border items-center justify-center rounded-md bg-primary px-4 py-2 text-sm font-medium text-primary-foreground shadow-sm\"\n (click)=\"onConfirm()\"\n >\n {{ confirmText }}\n </button>\n </div>\n </section>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
135
|
+
PdmAlertDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmAlertDialogComponent, selector: "pdm-alert-dialog", inputs: { open: "open", showTrigger: "showTrigger", triggerText: "triggerText", title: "title", description: "description", confirmText: "confirmText", cancelText: "cancelText", className: "className", closeOnEsc: "closeOnEsc" }, outputs: { openChange: "openChange", confirm: "confirm", cancel: "cancel" }, host: { listeners: { "document:keydown.escape": "onEsc()" } }, ngImport: i0, template: "<button\n *ngIf=\"showTrigger && !open\"\n type=\"button\"\n class=\"inline-flex h-9 appearance-none box-border items-center justify-center rounded-md border border-solid border-input bg-background px-4 py-2 text-sm font-medium text-foreground shadow-sm\"\n (click)=\"onTriggerClick()\"\n>\n {{ triggerText }}\n</button>\n\n<div *ngIf=\"open\" class=\"fixed inset-0 z-50 flex items-center justify-center p-5\">\n <div class=\"absolute inset-0 bg-foreground/30\" (click)=\"onCancel()\"></div>\n <section\n role=\"alertdialog\"\n aria-modal=\"true\"\n [ngClass]=\"[\n 'relative z-[60] w-full max-w-lg rounded-lg border border-solid border-border bg-background p-6 text-foreground shadow-lg',\n className\n ]\"\n >\n <div class=\"flex flex-col gap-2\">\n <h2 class=\"m-0 text-lg font-semibold leading-none tracking-tight\">{{ title }}</h2>\n <p *ngIf=\"description\" class=\"m-0 text-sm text-muted-foreground\">{{ description }}</p>\n </div>\n <div class=\"mt-4 flex items-center justify-end gap-2\">\n <button\n type=\"button\"\n class=\"inline-flex h-9 appearance-none box-border items-center justify-center rounded-md border border-solid border-input bg-background px-4 py-2 text-sm font-medium text-foreground shadow-sm\"\n (click)=\"onCancel()\"\n >\n {{ cancelText }}\n </button>\n <button\n type=\"button\"\n class=\"inline-flex h-9 appearance-none box-border items-center justify-center rounded-md bg-primary px-4 py-2 text-sm font-medium text-primary-foreground shadow-sm\"\n (click)=\"onConfirm()\"\n >\n {{ confirmText }}\n </button>\n </div>\n </section>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
136
136
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmAlertDialogComponent, decorators: [{
|
|
137
137
|
type: Component,
|
|
138
|
-
args: [{ selector: 'pdm-alert-dialog', changeDetection: ChangeDetectionStrategy.OnPush, template: "<button\n *ngIf=\"showTrigger && !open\"\n type=\"button\"\n class=\"inline-flex h-9 appearance-none box-border items-center justify-center rounded-md border border-input bg-background px-4 py-2 text-sm font-medium text-foreground shadow-sm\"\n (click)=\"onTriggerClick()\"\n>\n {{ triggerText }}\n</button>\n\n<div *ngIf=\"open\" class=\"fixed inset-0 z-50 flex items-center justify-center p-5\">\n <div class=\"absolute inset-0 bg-foreground/30\" (click)=\"onCancel()\"></div>\n <section\n role=\"alertdialog\"\n aria-modal=\"true\"\n [ngClass]=\"[\n 'relative z-[60] w-full max-w-lg rounded-lg border border-border bg-background p-6 text-foreground shadow-lg',\n className\n ]\"\n >\n <div class=\"flex flex-col gap-2\">\n <h2 class=\"m-0 text-lg font-semibold leading-none tracking-tight\">{{ title }}</h2>\n <p *ngIf=\"description\" class=\"m-0 text-sm text-muted-foreground\">{{ description }}</p>\n </div>\n <div class=\"mt-4 flex items-center justify-end gap-2\">\n <button\n type=\"button\"\n class=\"inline-flex h-9 appearance-none box-border items-center justify-center rounded-md border border-input bg-background px-4 py-2 text-sm font-medium text-foreground shadow-sm\"\n (click)=\"onCancel()\"\n >\n {{ cancelText }}\n </button>\n <button\n type=\"button\"\n class=\"inline-flex h-9 appearance-none box-border items-center justify-center rounded-md bg-primary px-4 py-2 text-sm font-medium text-primary-foreground shadow-sm\"\n (click)=\"onConfirm()\"\n >\n {{ confirmText }}\n </button>\n </div>\n </section>\n</div>\n" }]
|
|
138
|
+
args: [{ selector: 'pdm-alert-dialog', changeDetection: ChangeDetectionStrategy.OnPush, template: "<button\n *ngIf=\"showTrigger && !open\"\n type=\"button\"\n class=\"inline-flex h-9 appearance-none box-border items-center justify-center rounded-md border border-solid border-input bg-background px-4 py-2 text-sm font-medium text-foreground shadow-sm\"\n (click)=\"onTriggerClick()\"\n>\n {{ triggerText }}\n</button>\n\n<div *ngIf=\"open\" class=\"fixed inset-0 z-50 flex items-center justify-center p-5\">\n <div class=\"absolute inset-0 bg-foreground/30\" (click)=\"onCancel()\"></div>\n <section\n role=\"alertdialog\"\n aria-modal=\"true\"\n [ngClass]=\"[\n 'relative z-[60] w-full max-w-lg rounded-lg border border-solid border-border bg-background p-6 text-foreground shadow-lg',\n className\n ]\"\n >\n <div class=\"flex flex-col gap-2\">\n <h2 class=\"m-0 text-lg font-semibold leading-none tracking-tight\">{{ title }}</h2>\n <p *ngIf=\"description\" class=\"m-0 text-sm text-muted-foreground\">{{ description }}</p>\n </div>\n <div class=\"mt-4 flex items-center justify-end gap-2\">\n <button\n type=\"button\"\n class=\"inline-flex h-9 appearance-none box-border items-center justify-center rounded-md border border-solid border-input bg-background px-4 py-2 text-sm font-medium text-foreground shadow-sm\"\n (click)=\"onCancel()\"\n >\n {{ cancelText }}\n </button>\n <button\n type=\"button\"\n class=\"inline-flex h-9 appearance-none box-border items-center justify-center rounded-md bg-primary px-4 py-2 text-sm font-medium text-primary-foreground shadow-sm\"\n (click)=\"onConfirm()\"\n >\n {{ confirmText }}\n </button>\n </div>\n </section>\n</div>\n" }]
|
|
139
139
|
}], propDecorators: { open: [{
|
|
140
140
|
type: Input
|
|
141
141
|
}], showTrigger: [{
|
|
@@ -216,10 +216,10 @@ class PdmAvatarComponent {
|
|
|
216
216
|
}
|
|
217
217
|
}
|
|
218
218
|
PdmAvatarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmAvatarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
219
|
-
PdmAvatarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmAvatarComponent, selector: "pdm-avatar", inputs: { src: "src", alt: "alt", fallback: "fallback", shape: "shape", size: "size", groupSources: "groupSources", className: "className" }, ngImport: i0, template: "<div *ngIf=\"!isGroup\" [ngClass]=\"['relative flex shrink-0 overflow-hidden', radiusClass, sizeClasses[size], className]\">\n <img *ngIf=\"src\" [src]=\"src\" [alt]=\"alt\" [ngClass]=\"['aspect-square h-full w-full object-cover', radiusClass]\" />\n <div\n *ngIf=\"!src\"\n [ngClass]=\"['flex h-full w-full items-center justify-center bg-muted text-xs text-muted-foreground', radiusClass]\"\n >\n {{ fallback }}\n </div>\n</div>\n\n<div *ngIf=\"isGroup\" [ngClass]=\"['inline-flex items-center pr-2', className]\">\n <div\n *ngFor=\"let groupSrc of groupSources; let i = index\"\n [ngClass]=\"[\n 'relative h-8 w-8 shrink-0 overflow-hidden rounded-full',\n i > 0 ? '-mr-2 border border-border' : '-mr-2'\n ]\"\n >\n <img [src]=\"groupSrc\" [alt]=\"alt + ' ' + (i + 1)\" class=\"h-full w-full rounded-full object-cover\" />\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
219
|
+
PdmAvatarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmAvatarComponent, selector: "pdm-avatar", inputs: { src: "src", alt: "alt", fallback: "fallback", shape: "shape", size: "size", groupSources: "groupSources", className: "className" }, ngImport: i0, template: "<div *ngIf=\"!isGroup\" [ngClass]=\"['relative flex shrink-0 overflow-hidden', radiusClass, sizeClasses[size], className]\">\n <img *ngIf=\"src\" [src]=\"src\" [alt]=\"alt\" [ngClass]=\"['aspect-square h-full w-full object-cover', radiusClass]\" />\n <div\n *ngIf=\"!src\"\n [ngClass]=\"['flex h-full w-full items-center justify-center bg-muted text-xs text-muted-foreground', radiusClass]\"\n >\n {{ fallback }}\n </div>\n</div>\n\n<div *ngIf=\"isGroup\" [ngClass]=\"['inline-flex items-center pr-2', className]\">\n <div\n *ngFor=\"let groupSrc of groupSources; let i = index\"\n [ngClass]=\"[\n 'relative h-8 w-8 shrink-0 overflow-hidden rounded-full',\n i > 0 ? '-mr-2 border border-solid border-border' : '-mr-2'\n ]\"\n >\n <img [src]=\"groupSrc\" [alt]=\"alt + ' ' + (i + 1)\" class=\"h-full w-full rounded-full object-cover\" />\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
220
220
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmAvatarComponent, decorators: [{
|
|
221
221
|
type: Component,
|
|
222
|
-
args: [{ selector: 'pdm-avatar', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div *ngIf=\"!isGroup\" [ngClass]=\"['relative flex shrink-0 overflow-hidden', radiusClass, sizeClasses[size], className]\">\n <img *ngIf=\"src\" [src]=\"src\" [alt]=\"alt\" [ngClass]=\"['aspect-square h-full w-full object-cover', radiusClass]\" />\n <div\n *ngIf=\"!src\"\n [ngClass]=\"['flex h-full w-full items-center justify-center bg-muted text-xs text-muted-foreground', radiusClass]\"\n >\n {{ fallback }}\n </div>\n</div>\n\n<div *ngIf=\"isGroup\" [ngClass]=\"['inline-flex items-center pr-2', className]\">\n <div\n *ngFor=\"let groupSrc of groupSources; let i = index\"\n [ngClass]=\"[\n 'relative h-8 w-8 shrink-0 overflow-hidden rounded-full',\n i > 0 ? '-mr-2 border border-border' : '-mr-2'\n ]\"\n >\n <img [src]=\"groupSrc\" [alt]=\"alt + ' ' + (i + 1)\" class=\"h-full w-full rounded-full object-cover\" />\n </div>\n</div>\n" }]
|
|
222
|
+
args: [{ selector: 'pdm-avatar', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div *ngIf=\"!isGroup\" [ngClass]=\"['relative flex shrink-0 overflow-hidden', radiusClass, sizeClasses[size], className]\">\n <img *ngIf=\"src\" [src]=\"src\" [alt]=\"alt\" [ngClass]=\"['aspect-square h-full w-full object-cover', radiusClass]\" />\n <div\n *ngIf=\"!src\"\n [ngClass]=\"['flex h-full w-full items-center justify-center bg-muted text-xs text-muted-foreground', radiusClass]\"\n >\n {{ fallback }}\n </div>\n</div>\n\n<div *ngIf=\"isGroup\" [ngClass]=\"['inline-flex items-center pr-2', className]\">\n <div\n *ngFor=\"let groupSrc of groupSources; let i = index\"\n [ngClass]=\"[\n 'relative h-8 w-8 shrink-0 overflow-hidden rounded-full',\n i > 0 ? '-mr-2 border border-solid border-border' : '-mr-2'\n ]\"\n >\n <img [src]=\"groupSrc\" [alt]=\"alt + ' ' + (i + 1)\" class=\"h-full w-full rounded-full object-cover\" />\n </div>\n</div>\n" }]
|
|
223
223
|
}], propDecorators: { src: [{
|
|
224
224
|
type: Input
|
|
225
225
|
}], alt: [{
|
|
@@ -244,10 +244,10 @@ class PdmBadgeComponent {
|
|
|
244
244
|
}
|
|
245
245
|
}
|
|
246
246
|
PdmBadgeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmBadgeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
247
|
-
PdmBadgeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmBadgeComponent, selector: "pdm-badge", inputs: { variant: "variant", text: "text", className: "className" }, ngImport: i0, template: "<span\n [ngClass]=\"[\n 'inline-flex items-center justify-center text-center align-middle rounded-full px-2.5 py-0.5 text-xs font-semibold',\n variant === 'default' ? 'bg-primary text-primary-foreground' : '',\n variant === 'secondary' ? 'bg-secondary text-secondary-foreground' : '',\n variant === 'destructive' ? 'bg-destructive text-destructive-foreground' : '',\n variant === 'outline' ? 'border border-input text-foreground' : '',\n variant === 'icon' ? 'gap-1 bg-primary text-primary-foreground' : '',\n variant === 'number' ? 'min-w-5 rounded-full bg-primary px-1.5 text-primary-foreground' : '',\n variant === 'destructive-number' ? 'min-w-5 rounded-full bg-destructive px-1.5 text-destructive-foreground' : '',\n variant === 'secondary-number' ? 'min-w-5 rounded-full border border-input px-1.5 text-foreground' : '',\n className\n ]\"\n>\n <svg\n *ngIf=\"variant === 'icon'\"\n viewBox=\"0 0 24 24\"\n class=\"h-4 w-4\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n aria-hidden=\"true\"\n >\n <circle cx=\"12\" cy=\"12\" r=\"9\" stroke=\"currentColor\" stroke-width=\"1.5\"></circle>\n <path d=\"M8.5 12.5L10.8 14.8L15.8 9.8\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path>\n </svg>\n <span [ngClass]=\"[variant === 'secondary-number' ? 'font-mono' : '']\">{{ text }}</span>\n</span>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
247
|
+
PdmBadgeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmBadgeComponent, selector: "pdm-badge", inputs: { variant: "variant", text: "text", className: "className" }, ngImport: i0, template: "<span\n [ngClass]=\"[\n 'inline-flex items-center justify-center text-center align-middle rounded-full px-2.5 py-0.5 text-xs font-semibold',\n variant === 'default' ? 'bg-primary text-primary-foreground' : '',\n variant === 'secondary' ? 'bg-secondary text-secondary-foreground' : '',\n variant === 'destructive' ? 'bg-destructive text-destructive-foreground' : '',\n variant === 'outline' ? 'border border-solid border-input text-foreground' : '',\n variant === 'icon' ? 'gap-1 bg-primary text-primary-foreground' : '',\n variant === 'number' ? 'min-w-5 rounded-full bg-primary px-1.5 text-primary-foreground' : '',\n variant === 'destructive-number' ? 'min-w-5 rounded-full bg-destructive px-1.5 text-destructive-foreground' : '',\n variant === 'secondary-number' ? 'min-w-5 rounded-full border border-solid border-input px-1.5 text-foreground' : '',\n className\n ]\"\n>\n <svg\n *ngIf=\"variant === 'icon'\"\n viewBox=\"0 0 24 24\"\n class=\"h-4 w-4\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n aria-hidden=\"true\"\n >\n <circle cx=\"12\" cy=\"12\" r=\"9\" stroke=\"currentColor\" stroke-width=\"1.5\"></circle>\n <path d=\"M8.5 12.5L10.8 14.8L15.8 9.8\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path>\n </svg>\n <span [ngClass]=\"[variant === 'secondary-number' ? 'font-mono' : '']\">{{ text }}</span>\n</span>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
248
248
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmBadgeComponent, decorators: [{
|
|
249
249
|
type: Component,
|
|
250
|
-
args: [{ selector: 'pdm-badge', changeDetection: ChangeDetectionStrategy.OnPush, template: "<span\n [ngClass]=\"[\n 'inline-flex items-center justify-center text-center align-middle rounded-full px-2.5 py-0.5 text-xs font-semibold',\n variant === 'default' ? 'bg-primary text-primary-foreground' : '',\n variant === 'secondary' ? 'bg-secondary text-secondary-foreground' : '',\n variant === 'destructive' ? 'bg-destructive text-destructive-foreground' : '',\n variant === 'outline' ? 'border border-input text-foreground' : '',\n variant === 'icon' ? 'gap-1 bg-primary text-primary-foreground' : '',\n variant === 'number' ? 'min-w-5 rounded-full bg-primary px-1.5 text-primary-foreground' : '',\n variant === 'destructive-number' ? 'min-w-5 rounded-full bg-destructive px-1.5 text-destructive-foreground' : '',\n variant === 'secondary-number' ? 'min-w-5 rounded-full border border-input px-1.5 text-foreground' : '',\n className\n ]\"\n>\n <svg\n *ngIf=\"variant === 'icon'\"\n viewBox=\"0 0 24 24\"\n class=\"h-4 w-4\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n aria-hidden=\"true\"\n >\n <circle cx=\"12\" cy=\"12\" r=\"9\" stroke=\"currentColor\" stroke-width=\"1.5\"></circle>\n <path d=\"M8.5 12.5L10.8 14.8L15.8 9.8\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path>\n </svg>\n <span [ngClass]=\"[variant === 'secondary-number' ? 'font-mono' : '']\">{{ text }}</span>\n</span>\n" }]
|
|
250
|
+
args: [{ selector: 'pdm-badge', changeDetection: ChangeDetectionStrategy.OnPush, template: "<span\n [ngClass]=\"[\n 'inline-flex items-center justify-center text-center align-middle rounded-full px-2.5 py-0.5 text-xs font-semibold',\n variant === 'default' ? 'bg-primary text-primary-foreground' : '',\n variant === 'secondary' ? 'bg-secondary text-secondary-foreground' : '',\n variant === 'destructive' ? 'bg-destructive text-destructive-foreground' : '',\n variant === 'outline' ? 'border border-solid border-input text-foreground' : '',\n variant === 'icon' ? 'gap-1 bg-primary text-primary-foreground' : '',\n variant === 'number' ? 'min-w-5 rounded-full bg-primary px-1.5 text-primary-foreground' : '',\n variant === 'destructive-number' ? 'min-w-5 rounded-full bg-destructive px-1.5 text-destructive-foreground' : '',\n variant === 'secondary-number' ? 'min-w-5 rounded-full border border-solid border-input px-1.5 text-foreground' : '',\n className\n ]\"\n>\n <svg\n *ngIf=\"variant === 'icon'\"\n viewBox=\"0 0 24 24\"\n class=\"h-4 w-4\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n aria-hidden=\"true\"\n >\n <circle cx=\"12\" cy=\"12\" r=\"9\" stroke=\"currentColor\" stroke-width=\"1.5\"></circle>\n <path d=\"M8.5 12.5L10.8 14.8L15.8 9.8\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path>\n </svg>\n <span [ngClass]=\"[variant === 'secondary-number' ? 'font-mono' : '']\">{{ text }}</span>\n</span>\n" }]
|
|
251
251
|
}], propDecorators: { variant: [{
|
|
252
252
|
type: Input
|
|
253
253
|
}], text: [{
|
|
@@ -496,7 +496,7 @@ const ATTACHMENT_CONTROL_CLASSES = {
|
|
|
496
496
|
],
|
|
497
497
|
};
|
|
498
498
|
const FOCUS_STACKING_CLASS = "*:focus-visible:relative *:focus-visible:z-10";
|
|
499
|
-
const SEPARATOR_CLASSES = "overflow-hidden rounded-md border border-border bg-secondary shadow-sm";
|
|
499
|
+
const SEPARATOR_CLASSES = "overflow-hidden rounded-md border border-solid border-border bg-secondary shadow-sm";
|
|
500
500
|
class PdmButtonGroupComponent {
|
|
501
501
|
constructor() {
|
|
502
502
|
this.variant = "default";
|
|
@@ -599,7 +599,7 @@ class PdmButtonComponent {
|
|
|
599
599
|
const variant = this.resolvedVariant;
|
|
600
600
|
const toneClass = this.toneClassMap[variant][currentState];
|
|
601
601
|
return [
|
|
602
|
-
'inline-flex appearance-none box-border items-center justify-center gap-2 rounded-md border text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-[3px] focus-visible:ring-ring/50 focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 bg-clip-padding',
|
|
602
|
+
'inline-flex appearance-none box-border items-center justify-center gap-2 rounded-md border border-solid text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-[3px] focus-visible:ring-ring/50 focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 bg-clip-padding',
|
|
603
603
|
variant === 'link' ? 'px-4 py-2 h-9' : '',
|
|
604
604
|
variant === 'icon' ? 'h-9 w-9 p-0' : '',
|
|
605
605
|
variant === 'icon-circle' ? 'h-10 w-10 rounded-full p-0' : '',
|
|
@@ -662,13 +662,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
662
662
|
|
|
663
663
|
const DAY_MS = 24 * 60 * 60 * 1000;
|
|
664
664
|
class PdmCalendarComponent {
|
|
665
|
-
constructor(
|
|
666
|
-
this.cdr = cdr;
|
|
665
|
+
constructor() {
|
|
667
666
|
this._value = null;
|
|
668
667
|
this._rangeValue = null;
|
|
669
668
|
this._month = null;
|
|
670
|
-
this.
|
|
671
|
-
this.
|
|
669
|
+
this.cdr = inject(ChangeDetectorRef);
|
|
670
|
+
this.variant = "single";
|
|
671
|
+
this.className = "";
|
|
672
672
|
this.disabledDates = [];
|
|
673
673
|
this.minDate = null;
|
|
674
674
|
this.maxDate = null;
|
|
@@ -682,20 +682,20 @@ class PdmCalendarComponent {
|
|
|
682
682
|
this.monthChange = new EventEmitter();
|
|
683
683
|
this.dateClick = new EventEmitter();
|
|
684
684
|
this.disabledDateClick = new EventEmitter();
|
|
685
|
-
this.weekdays = [
|
|
685
|
+
this.weekdays = ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"];
|
|
686
686
|
this.monthOptions = [
|
|
687
|
-
{ value: 0, label:
|
|
688
|
-
{ value: 1, label:
|
|
689
|
-
{ value: 2, label:
|
|
690
|
-
{ value: 3, label:
|
|
691
|
-
{ value: 4, label:
|
|
692
|
-
{ value: 5, label:
|
|
693
|
-
{ value: 6, label:
|
|
694
|
-
{ value: 7, label:
|
|
695
|
-
{ value: 8, label:
|
|
696
|
-
{ value: 9, label:
|
|
697
|
-
{ value: 10, label:
|
|
698
|
-
{ value: 11, label:
|
|
687
|
+
{ value: 0, label: "Jan" },
|
|
688
|
+
{ value: 1, label: "Feb" },
|
|
689
|
+
{ value: 2, label: "Mar" },
|
|
690
|
+
{ value: 3, label: "Apr" },
|
|
691
|
+
{ value: 4, label: "May" },
|
|
692
|
+
{ value: 5, label: "Jun" },
|
|
693
|
+
{ value: 6, label: "Jul" },
|
|
694
|
+
{ value: 7, label: "Aug" },
|
|
695
|
+
{ value: 8, label: "Sep" },
|
|
696
|
+
{ value: 9, label: "Oct" },
|
|
697
|
+
{ value: 10, label: "Nov" },
|
|
698
|
+
{ value: 11, label: "Dec" },
|
|
699
699
|
];
|
|
700
700
|
this.trackByIndex = (index) => {
|
|
701
701
|
return index;
|
|
@@ -714,7 +714,7 @@ class PdmCalendarComponent {
|
|
|
714
714
|
this._rangeValue = value
|
|
715
715
|
? {
|
|
716
716
|
start: this.normalizeDate(value.start),
|
|
717
|
-
end: this.normalizeDate(value.end)
|
|
717
|
+
end: this.normalizeDate(value.end),
|
|
718
718
|
}
|
|
719
719
|
: null;
|
|
720
720
|
}
|
|
@@ -728,22 +728,22 @@ class PdmCalendarComponent {
|
|
|
728
728
|
return this._month;
|
|
729
729
|
}
|
|
730
730
|
get resolvedVariant() {
|
|
731
|
-
return this.variant ===
|
|
731
|
+
return this.variant === "range" ? "range" : "single";
|
|
732
732
|
}
|
|
733
733
|
get visibleMonths() {
|
|
734
734
|
const baseMonth = this.getAnchorMonth();
|
|
735
|
-
if (this.resolvedVariant ===
|
|
735
|
+
if (this.resolvedVariant === "single") {
|
|
736
736
|
return [
|
|
737
737
|
{
|
|
738
738
|
date: baseMonth,
|
|
739
739
|
title: this.formatMonthYear(baseMonth),
|
|
740
|
-
titleStyle:
|
|
740
|
+
titleStyle: "dropdowns",
|
|
741
741
|
dropdownMonth: this.formatMonthShort(baseMonth),
|
|
742
742
|
dropdownYear: String(baseMonth.getFullYear()),
|
|
743
743
|
showPrevButton: true,
|
|
744
744
|
showNextButton: true,
|
|
745
|
-
weeks: this.buildMonthWeeks(baseMonth, false)
|
|
746
|
-
}
|
|
745
|
+
weeks: this.buildMonthWeeks(baseMonth, false),
|
|
746
|
+
},
|
|
747
747
|
];
|
|
748
748
|
}
|
|
749
749
|
const nextMonth = this.addMonths(baseMonth, 1);
|
|
@@ -751,19 +751,19 @@ class PdmCalendarComponent {
|
|
|
751
751
|
{
|
|
752
752
|
date: baseMonth,
|
|
753
753
|
title: this.formatMonthYear(baseMonth),
|
|
754
|
-
titleStyle:
|
|
754
|
+
titleStyle: "plain",
|
|
755
755
|
showPrevButton: true,
|
|
756
756
|
showNextButton: false,
|
|
757
|
-
weeks: this.buildMonthWeeks(baseMonth, true)
|
|
757
|
+
weeks: this.buildMonthWeeks(baseMonth, true),
|
|
758
758
|
},
|
|
759
759
|
{
|
|
760
760
|
date: nextMonth,
|
|
761
761
|
title: this.formatMonthYear(nextMonth),
|
|
762
|
-
titleStyle:
|
|
762
|
+
titleStyle: "plain",
|
|
763
763
|
showPrevButton: false,
|
|
764
764
|
showNextButton: true,
|
|
765
|
-
weeks: this.buildMonthWeeks(nextMonth, true)
|
|
766
|
-
}
|
|
765
|
+
weeks: this.buildMonthWeeks(nextMonth, true),
|
|
766
|
+
},
|
|
767
767
|
];
|
|
768
768
|
}
|
|
769
769
|
get singleHeaderMonth() {
|
|
@@ -797,99 +797,109 @@ class PdmCalendarComponent {
|
|
|
797
797
|
}
|
|
798
798
|
get rootClasses() {
|
|
799
799
|
return [
|
|
800
|
-
|
|
801
|
-
this.resolvedVariant ===
|
|
802
|
-
?
|
|
803
|
-
:
|
|
804
|
-
this.className
|
|
800
|
+
"border-border bg-background relative rounded-[10px] border border-solid p-3 shadow-sm",
|
|
801
|
+
this.resolvedVariant === "range"
|
|
802
|
+
? "inline-flex items-start justify-center gap-4 shrink-0 grow-0 basis-auto"
|
|
803
|
+
: "inline-flex flex-col gap-4 shrink-0 grow-0 basis-auto",
|
|
804
|
+
this.className,
|
|
805
805
|
];
|
|
806
806
|
}
|
|
807
807
|
get rootStyle() {
|
|
808
|
-
const width = this.resolvedVariant ===
|
|
808
|
+
const width = this.resolvedVariant === "range" ? "488px" : "250px";
|
|
809
809
|
return {
|
|
810
810
|
width,
|
|
811
811
|
minWidth: width,
|
|
812
812
|
maxWidth: width,
|
|
813
|
-
minHeight:
|
|
814
|
-
flex:
|
|
815
|
-
alignSelf:
|
|
813
|
+
minHeight: "293px",
|
|
814
|
+
flex: "0 0 auto",
|
|
815
|
+
alignSelf: "flex-start",
|
|
816
816
|
};
|
|
817
817
|
}
|
|
818
818
|
monthPanelClasses(_index) {
|
|
819
|
-
return [
|
|
819
|
+
return [
|
|
820
|
+
"flex flex-col items-start",
|
|
821
|
+
this.resolvedVariant === "range" ? "w-[224px] gap-4" : "w-full gap-0",
|
|
822
|
+
];
|
|
820
823
|
}
|
|
821
824
|
headerClasses(month) {
|
|
822
|
-
return [
|
|
825
|
+
return [
|
|
826
|
+
"flex w-full items-center justify-between",
|
|
827
|
+
month.titleStyle === "dropdowns" ? "" : "mb-4",
|
|
828
|
+
];
|
|
823
829
|
}
|
|
824
830
|
navButtonClasses() {
|
|
825
831
|
return [
|
|
826
|
-
|
|
827
|
-
|
|
832
|
+
"flex h-8 w-8 appearance-none box-border items-center justify-center rounded-md border-0 bg-transparent p-0 text-foreground",
|
|
833
|
+
"disabled:pointer-events-none disabled:opacity-40",
|
|
828
834
|
];
|
|
829
835
|
}
|
|
830
836
|
navPlaceholderClasses() {
|
|
831
|
-
return [
|
|
837
|
+
return ["h-7 w-7 shrink-0"];
|
|
832
838
|
}
|
|
833
839
|
dropdownWrapClasses() {
|
|
834
|
-
return [
|
|
840
|
+
return ["flex w-40 items-center justify-center gap-2"];
|
|
835
841
|
}
|
|
836
842
|
dropdownClasses(widthClass) {
|
|
837
|
-
return [
|
|
843
|
+
return ["flex h-8 items-center justify-center gap-1 px-1", widthClass];
|
|
838
844
|
}
|
|
839
845
|
dropdownSelectClasses() {
|
|
840
846
|
return [
|
|
841
|
-
|
|
842
|
-
|
|
847
|
+
"text-foreground h-full bg-transparent text-sm font-medium leading-5",
|
|
848
|
+
"appearance-none box-border border-0 outline-none ring-0 focus:outline-none focus:ring-0 text-center cursor-pointer",
|
|
843
849
|
];
|
|
844
850
|
}
|
|
845
851
|
get dropdownSelectStyle() {
|
|
846
852
|
return {
|
|
847
|
-
appearance:
|
|
848
|
-
WebkitAppearance:
|
|
849
|
-
MozAppearance:
|
|
850
|
-
background:
|
|
851
|
-
border:
|
|
852
|
-
boxShadow:
|
|
853
|
-
outline:
|
|
854
|
-
padding:
|
|
855
|
-
margin:
|
|
853
|
+
appearance: "none",
|
|
854
|
+
WebkitAppearance: "none",
|
|
855
|
+
MozAppearance: "none",
|
|
856
|
+
background: "transparent",
|
|
857
|
+
border: "0",
|
|
858
|
+
boxShadow: "none",
|
|
859
|
+
outline: "0",
|
|
860
|
+
padding: "0",
|
|
861
|
+
margin: "0",
|
|
856
862
|
};
|
|
857
863
|
}
|
|
858
864
|
calendarGridWrapClasses() {
|
|
859
|
-
return [
|
|
865
|
+
return ["flex w-full flex-col items-start"];
|
|
860
866
|
}
|
|
861
867
|
weekdayRowClasses() {
|
|
862
|
-
return [
|
|
868
|
+
return ["flex w-full items-center"];
|
|
863
869
|
}
|
|
864
870
|
weekdayCellClasses() {
|
|
865
|
-
return [
|
|
871
|
+
return [
|
|
872
|
+
"text-muted-foreground flex h-[21px] w-8 items-center justify-center rounded-md text-xs leading-4",
|
|
873
|
+
];
|
|
866
874
|
}
|
|
867
875
|
weekRowClasses() {
|
|
868
|
-
return [
|
|
876
|
+
return ["flex w-full items-start pt-2"];
|
|
869
877
|
}
|
|
870
878
|
dayCellClasses(cell) {
|
|
871
879
|
return [
|
|
872
|
-
|
|
873
|
-
cell.rangeFill ?
|
|
874
|
-
cell.rangeLeftCap ?
|
|
875
|
-
cell.rangeRightCap ?
|
|
880
|
+
"relative flex h-8 w-8 shrink-0 items-center justify-center",
|
|
881
|
+
cell.rangeFill ? "bg-accent" : "",
|
|
882
|
+
cell.rangeLeftCap ? "rounded-l-md" : "",
|
|
883
|
+
cell.rangeRightCap ? "rounded-r-md" : "",
|
|
876
884
|
];
|
|
877
885
|
}
|
|
878
886
|
dayButtonClasses(cell) {
|
|
879
887
|
return [
|
|
880
|
-
|
|
888
|
+
"relative z-10 flex h-8 w-8 appearance-none box-border items-center justify-center rounded-md border-0 p-0 text-sm leading-5",
|
|
881
889
|
cell.selected
|
|
882
|
-
?
|
|
890
|
+
? "bg-primary text-primary-foreground"
|
|
883
891
|
: cell.rangeFill
|
|
884
|
-
?
|
|
885
|
-
:
|
|
886
|
-
cell.muted && !cell.rangeFill ?
|
|
887
|
-
cell.disabled ?
|
|
888
|
-
!cell.disabled && !this.readonly && !cell.selected
|
|
892
|
+
? "bg-transparent text-accent-foreground"
|
|
893
|
+
: "bg-transparent text-foreground",
|
|
894
|
+
cell.muted && !cell.rangeFill ? "opacity-50" : "",
|
|
895
|
+
cell.disabled ? "cursor-not-allowed opacity-40" : "",
|
|
896
|
+
!cell.disabled && !this.readonly && !cell.selected
|
|
897
|
+
? "hover:bg-accent/70"
|
|
898
|
+
: "",
|
|
889
899
|
];
|
|
890
900
|
}
|
|
891
901
|
dayLabelClasses(_cell) {
|
|
892
|
-
return [
|
|
902
|
+
return ["font-normal"];
|
|
893
903
|
}
|
|
894
904
|
goToPreviousMonth() {
|
|
895
905
|
this.setAnchorMonth(this.addMonths(this.getAnchorMonth(), -1));
|
|
@@ -923,7 +933,7 @@ class PdmCalendarComponent {
|
|
|
923
933
|
return;
|
|
924
934
|
}
|
|
925
935
|
this.dateClick.emit(date);
|
|
926
|
-
if (this.resolvedVariant ===
|
|
936
|
+
if (this.resolvedVariant === "single") {
|
|
927
937
|
this._value = date;
|
|
928
938
|
this.valueChange.emit(this.cloneDate(date));
|
|
929
939
|
this.syncVisibleMonthToDate(date);
|
|
@@ -955,7 +965,10 @@ class PdmCalendarComponent {
|
|
|
955
965
|
return;
|
|
956
966
|
}
|
|
957
967
|
this._rangeValue = { start, end };
|
|
958
|
-
this.rangeValueChange.emit({
|
|
968
|
+
this.rangeValueChange.emit({
|
|
969
|
+
start: this.cloneDate(start),
|
|
970
|
+
end: this.cloneDate(end),
|
|
971
|
+
});
|
|
959
972
|
this.syncVisibleMonthToDate(start);
|
|
960
973
|
}
|
|
961
974
|
buildMonthWeeks(month, includeRange) {
|
|
@@ -989,11 +1002,18 @@ class PdmCalendarComponent {
|
|
|
989
1002
|
buildCell(date, visibleMonth, includeRange) {
|
|
990
1003
|
var _a, _b, _c, _d;
|
|
991
1004
|
const normalized = this.cloneDate(date);
|
|
992
|
-
const inCurrentMonth = normalized.getMonth() === visibleMonth.getMonth() &&
|
|
1005
|
+
const inCurrentMonth = normalized.getMonth() === visibleMonth.getMonth() &&
|
|
1006
|
+
normalized.getFullYear() === visibleMonth.getFullYear();
|
|
993
1007
|
const disabled = this.isBlocked(normalized);
|
|
994
|
-
const selectedSingle = this.resolvedVariant ===
|
|
995
|
-
|
|
996
|
-
|
|
1008
|
+
const selectedSingle = this.resolvedVariant === "single" &&
|
|
1009
|
+
!!this._value &&
|
|
1010
|
+
this.isSameDay(normalized, this._value);
|
|
1011
|
+
const rangeStart = includeRange &&
|
|
1012
|
+
!!((_a = this._rangeValue) === null || _a === void 0 ? void 0 : _a.start) &&
|
|
1013
|
+
this.isSameDay(normalized, this._rangeValue.start);
|
|
1014
|
+
const rangeEnd = includeRange &&
|
|
1015
|
+
!!((_b = this._rangeValue) === null || _b === void 0 ? void 0 : _b.end) &&
|
|
1016
|
+
this.isSameDay(normalized, this._rangeValue.end);
|
|
997
1017
|
const inRange = includeRange &&
|
|
998
1018
|
!!((_c = this._rangeValue) === null || _c === void 0 ? void 0 : _c.start) &&
|
|
999
1019
|
!!((_d = this._rangeValue) === null || _d === void 0 ? void 0 : _d.end) &&
|
|
@@ -1008,7 +1028,7 @@ class PdmCalendarComponent {
|
|
|
1008
1028
|
inRange,
|
|
1009
1029
|
rangeFill: inRange,
|
|
1010
1030
|
rangeLeftCap: false,
|
|
1011
|
-
rangeRightCap: false
|
|
1031
|
+
rangeRightCap: false,
|
|
1012
1032
|
};
|
|
1013
1033
|
}
|
|
1014
1034
|
getAnchorMonth() {
|
|
@@ -1017,10 +1037,10 @@ class PdmCalendarComponent {
|
|
|
1017
1037
|
if (this._month) {
|
|
1018
1038
|
candidate = this.cloneDate(this._month);
|
|
1019
1039
|
}
|
|
1020
|
-
else if (this.resolvedVariant ===
|
|
1040
|
+
else if (this.resolvedVariant === "single" && this._value) {
|
|
1021
1041
|
candidate = this.startOfMonth(this._value);
|
|
1022
1042
|
}
|
|
1023
|
-
else if (this.resolvedVariant ===
|
|
1043
|
+
else if (this.resolvedVariant === "range" && ((_a = this._rangeValue) === null || _a === void 0 ? void 0 : _a.start)) {
|
|
1024
1044
|
candidate = this.startOfMonth(this._rangeValue.start);
|
|
1025
1045
|
}
|
|
1026
1046
|
else {
|
|
@@ -1104,7 +1124,7 @@ class PdmCalendarComponent {
|
|
|
1104
1124
|
return this.dateValue(a) - this.dateValue(b);
|
|
1105
1125
|
}
|
|
1106
1126
|
dateValue(date) {
|
|
1107
|
-
return Date.UTC(date.getFullYear(), date.getMonth(), date.getDate()) / DAY_MS;
|
|
1127
|
+
return (Date.UTC(date.getFullYear(), date.getMonth(), date.getDate()) / DAY_MS);
|
|
1108
1128
|
}
|
|
1109
1129
|
isSameDay(a, b) {
|
|
1110
1130
|
return this.compareDate(a, b) === 0;
|
|
@@ -1114,23 +1134,23 @@ class PdmCalendarComponent {
|
|
|
1114
1134
|
}
|
|
1115
1135
|
dateKey(date) {
|
|
1116
1136
|
const y = date.getFullYear();
|
|
1117
|
-
const m = String(date.getMonth() + 1).padStart(2,
|
|
1118
|
-
const d = String(date.getDate()).padStart(2,
|
|
1137
|
+
const m = String(date.getMonth() + 1).padStart(2, "0");
|
|
1138
|
+
const d = String(date.getDate()).padStart(2, "0");
|
|
1119
1139
|
return `${y}-${m}-${d}`;
|
|
1120
1140
|
}
|
|
1121
1141
|
formatMonthShort(date) {
|
|
1122
|
-
return date.toLocaleString(
|
|
1142
|
+
return date.toLocaleString("en-US", { month: "short" });
|
|
1123
1143
|
}
|
|
1124
1144
|
formatMonthYear(date) {
|
|
1125
|
-
return date.toLocaleString(
|
|
1145
|
+
return date.toLocaleString("en-US", { month: "long", year: "numeric" });
|
|
1126
1146
|
}
|
|
1127
1147
|
}
|
|
1128
|
-
PdmCalendarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmCalendarComponent, deps: [
|
|
1148
|
+
PdmCalendarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmCalendarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1129
1149
|
PdmCalendarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmCalendarComponent, selector: "pdm-calendar", inputs: { variant: "variant", className: "className", disabledDates: "disabledDates", minDate: "minDate", maxDate: "maxDate", minYear: "minYear", maxYear: "maxYear", isDateDisabled: "isDateDisabled", allowSameDayRange: "allowSameDayRange", readonly: "readonly", value: "value", rangeValue: "rangeValue", month: "month" }, outputs: { valueChange: "valueChange", rangeValueChange: "rangeValueChange", monthChange: "monthChange", dateClick: "dateClick", disabledDateClick: "disabledDateClick" }, ngImport: i0, template: "<div [ngClass]=\"rootClasses\" [ngStyle]=\"rootStyle\">\n <div *ngFor=\"let month of visibleMonths; let monthIndex = index; trackBy: trackByIndex\" [ngClass]=\"monthPanelClasses(monthIndex)\">\n <div [ngClass]=\"headerClasses(month)\">\n <button\n *ngIf=\"month.showPrevButton; else prevPlaceholder\"\n type=\"button\"\n [ngClass]=\"navButtonClasses()\"\n aria-label=\"Previous month\"\n (click)=\"goToPreviousMonth()\"\n [disabled]=\"readonly\"\n >\n <svg viewBox=\"0 0 24 24\" class=\"h-4 w-4\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" aria-hidden=\"true\">\n <path d=\"m15 18-6-6 6-6\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path>\n </svg>\n </button>\n <ng-template #prevPlaceholder>\n <div [ngClass]=\"navPlaceholderClasses()\" aria-hidden=\"true\"></div>\n </ng-template>\n\n <ng-container *ngIf=\"month.titleStyle === 'dropdowns'; else plainTitle\">\n <div [ngClass]=\"dropdownWrapClasses()\">\n <div [ngClass]=\"dropdownClasses('w-16 sm:w-[72px]')\">\n <select\n [ngClass]=\"dropdownSelectClasses()\"\n [ngStyle]=\"dropdownSelectStyle\"\n [value]=\"singleHeaderMonth\"\n aria-label=\"Month\"\n (change)=\"onSingleMonthChange($any($event.target).value)\"\n >\n <option\n *ngFor=\"let monthOption of monthOptions\"\n [value]=\"monthOption.value\"\n [selected]=\"monthOption.value === singleHeaderMonth\"\n >\n {{ monthOption.label }}\n </option>\n </select>\n <svg viewBox=\"0 0 24 24\" class=\"h-3 w-3 text-foreground\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" aria-hidden=\"true\">\n <path d=\"m6 9 6 6 6-6\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path>\n </svg>\n </div>\n <div [ngClass]=\"dropdownClasses('w-16 sm:w-[82px]')\">\n <select\n [ngClass]=\"dropdownSelectClasses()\"\n [ngStyle]=\"dropdownSelectStyle\"\n [value]=\"singleHeaderYear\"\n aria-label=\"Year\"\n (change)=\"onSingleYearChange($any($event.target).value)\"\n >\n <option\n *ngFor=\"let year of yearOptions\"\n [value]=\"year\"\n [selected]=\"year === singleHeaderYear\"\n >\n {{ year }}\n </option>\n </select>\n <svg viewBox=\"0 0 24 24\" class=\"h-3 w-3 text-foreground\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" aria-hidden=\"true\">\n <path d=\"m6 9 6 6 6-6\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path>\n </svg>\n </div>\n </div>\n </ng-container>\n\n <ng-template #plainTitle>\n <div class=\"flex min-w-0 flex-1 items-center justify-center\">\n <p class=\"m-0 text-foreground text-center text-sm font-medium leading-5\">\n {{ month.title }}\n </p>\n </div>\n </ng-template>\n\n <button\n *ngIf=\"month.showNextButton; else nextPlaceholder\"\n type=\"button\"\n [ngClass]=\"navButtonClasses()\"\n aria-label=\"Next month\"\n (click)=\"goToNextMonth()\"\n [disabled]=\"readonly\"\n >\n <svg viewBox=\"0 0 24 24\" class=\"h-4 w-4\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" aria-hidden=\"true\">\n <path d=\"m9 18 6-6-6-6\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path>\n </svg>\n </button>\n <ng-template #nextPlaceholder>\n <div [ngClass]=\"navPlaceholderClasses()\" aria-hidden=\"true\"></div>\n </ng-template>\n </div>\n\n <div [ngClass]=\"calendarGridWrapClasses()\">\n <div [ngClass]=\"weekdayRowClasses()\">\n <div *ngFor=\"let day of weekdays; trackBy: trackByIndex\" [ngClass]=\"weekdayCellClasses()\">\n <span>{{ day }}</span>\n </div>\n </div>\n\n <div *ngFor=\"let week of month.weeks; trackBy: trackByIndex\" [ngClass]=\"weekRowClasses()\">\n <div *ngFor=\"let cell of week; trackBy: trackByDate\" [ngClass]=\"dayCellClasses(cell)\">\n <button\n type=\"button\"\n [ngClass]=\"dayButtonClasses(cell)\"\n [disabled]=\"readonly\"\n [attr.aria-selected]=\"cell.selected\"\n [attr.aria-disabled]=\"cell.disabled || readonly\"\n [attr.title]=\"cell.date | date : 'yyyy-MM-dd'\"\n (click)=\"onDatePressed(cell)\"\n >\n <span [ngClass]=\"dayLabelClasses(cell)\">{{ cell.label }}</span>\n </button>\n </div>\n </div>\n </div>\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "pipe", type: i1.DatePipe, name: "date" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1130
1150
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmCalendarComponent, decorators: [{
|
|
1131
1151
|
type: Component,
|
|
1132
|
-
args: [{ selector:
|
|
1133
|
-
}],
|
|
1152
|
+
args: [{ selector: "pdm-calendar", changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [ngClass]=\"rootClasses\" [ngStyle]=\"rootStyle\">\n <div *ngFor=\"let month of visibleMonths; let monthIndex = index; trackBy: trackByIndex\" [ngClass]=\"monthPanelClasses(monthIndex)\">\n <div [ngClass]=\"headerClasses(month)\">\n <button\n *ngIf=\"month.showPrevButton; else prevPlaceholder\"\n type=\"button\"\n [ngClass]=\"navButtonClasses()\"\n aria-label=\"Previous month\"\n (click)=\"goToPreviousMonth()\"\n [disabled]=\"readonly\"\n >\n <svg viewBox=\"0 0 24 24\" class=\"h-4 w-4\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" aria-hidden=\"true\">\n <path d=\"m15 18-6-6 6-6\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path>\n </svg>\n </button>\n <ng-template #prevPlaceholder>\n <div [ngClass]=\"navPlaceholderClasses()\" aria-hidden=\"true\"></div>\n </ng-template>\n\n <ng-container *ngIf=\"month.titleStyle === 'dropdowns'; else plainTitle\">\n <div [ngClass]=\"dropdownWrapClasses()\">\n <div [ngClass]=\"dropdownClasses('w-16 sm:w-[72px]')\">\n <select\n [ngClass]=\"dropdownSelectClasses()\"\n [ngStyle]=\"dropdownSelectStyle\"\n [value]=\"singleHeaderMonth\"\n aria-label=\"Month\"\n (change)=\"onSingleMonthChange($any($event.target).value)\"\n >\n <option\n *ngFor=\"let monthOption of monthOptions\"\n [value]=\"monthOption.value\"\n [selected]=\"monthOption.value === singleHeaderMonth\"\n >\n {{ monthOption.label }}\n </option>\n </select>\n <svg viewBox=\"0 0 24 24\" class=\"h-3 w-3 text-foreground\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" aria-hidden=\"true\">\n <path d=\"m6 9 6 6 6-6\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path>\n </svg>\n </div>\n <div [ngClass]=\"dropdownClasses('w-16 sm:w-[82px]')\">\n <select\n [ngClass]=\"dropdownSelectClasses()\"\n [ngStyle]=\"dropdownSelectStyle\"\n [value]=\"singleHeaderYear\"\n aria-label=\"Year\"\n (change)=\"onSingleYearChange($any($event.target).value)\"\n >\n <option\n *ngFor=\"let year of yearOptions\"\n [value]=\"year\"\n [selected]=\"year === singleHeaderYear\"\n >\n {{ year }}\n </option>\n </select>\n <svg viewBox=\"0 0 24 24\" class=\"h-3 w-3 text-foreground\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" aria-hidden=\"true\">\n <path d=\"m6 9 6 6 6-6\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path>\n </svg>\n </div>\n </div>\n </ng-container>\n\n <ng-template #plainTitle>\n <div class=\"flex min-w-0 flex-1 items-center justify-center\">\n <p class=\"m-0 text-foreground text-center text-sm font-medium leading-5\">\n {{ month.title }}\n </p>\n </div>\n </ng-template>\n\n <button\n *ngIf=\"month.showNextButton; else nextPlaceholder\"\n type=\"button\"\n [ngClass]=\"navButtonClasses()\"\n aria-label=\"Next month\"\n (click)=\"goToNextMonth()\"\n [disabled]=\"readonly\"\n >\n <svg viewBox=\"0 0 24 24\" class=\"h-4 w-4\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" aria-hidden=\"true\">\n <path d=\"m9 18 6-6-6-6\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path>\n </svg>\n </button>\n <ng-template #nextPlaceholder>\n <div [ngClass]=\"navPlaceholderClasses()\" aria-hidden=\"true\"></div>\n </ng-template>\n </div>\n\n <div [ngClass]=\"calendarGridWrapClasses()\">\n <div [ngClass]=\"weekdayRowClasses()\">\n <div *ngFor=\"let day of weekdays; trackBy: trackByIndex\" [ngClass]=\"weekdayCellClasses()\">\n <span>{{ day }}</span>\n </div>\n </div>\n\n <div *ngFor=\"let week of month.weeks; trackBy: trackByIndex\" [ngClass]=\"weekRowClasses()\">\n <div *ngFor=\"let cell of week; trackBy: trackByDate\" [ngClass]=\"dayCellClasses(cell)\">\n <button\n type=\"button\"\n [ngClass]=\"dayButtonClasses(cell)\"\n [disabled]=\"readonly\"\n [attr.aria-selected]=\"cell.selected\"\n [attr.aria-disabled]=\"cell.disabled || readonly\"\n [attr.title]=\"cell.date | date : 'yyyy-MM-dd'\"\n (click)=\"onDatePressed(cell)\"\n >\n <span [ngClass]=\"dayLabelClasses(cell)\">{{ cell.label }}</span>\n </button>\n </div>\n </div>\n </div>\n </div>\n</div>\n" }]
|
|
1153
|
+
}], propDecorators: { variant: [{
|
|
1134
1154
|
type: Input
|
|
1135
1155
|
}], className: [{
|
|
1136
1156
|
type: Input
|
|
@@ -1245,10 +1265,10 @@ class PdmCarouselComponent {
|
|
|
1245
1265
|
}
|
|
1246
1266
|
}
|
|
1247
1267
|
PdmCarouselComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmCarouselComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1248
|
-
PdmCarouselComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmCarouselComponent, selector: "pdm-carousel", inputs: { variant: "variant", className: "className", slides: "slides", startIndex: "startIndex", loop: "loop", windowSize: "windowSize", showCounter: "showCounter" }, outputs: { indexChange: "indexChange" }, ngImport: i0, template: "<section [ngClass]=\"[className]\">\n <div *ngIf=\"variant !== 'orientation'\" class=\"flex items-center gap-4\">\n <button\n type=\"button\"\n class=\"inline-flex h-8 w-8 appearance-none box-border items-center justify-center rounded-full border border-input bg-background p-2.5\"\n [ngClass]=\"!canPrev ? 'opacity-50' : ''\"\n [disabled]=\"!canPrev\"\n (click)=\"onPrev()\"\n aria-label=\"Previous slide\"\n >\n <svg viewBox=\"0 0 24 24\" class=\"h-4 w-4 text-foreground\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M15 18L9 12L15 6\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path>\n </svg>\n </button>\n\n <div class=\"flex items-center\">\n <div *ngFor=\"let slide of visibleSlides; let i = index\" class=\"flex items-center\" [ngClass]=\"i > 0 ? 'pl-4' : ''\">\n <div class=\"flex h-40 w-32 items-center p-1\">\n <div class=\"flex h-full w-full items-center justify-center rounded-lg border border-border bg-background py-6 shadow-sm\">\n <div class=\"text-center text-2xl font-semibold text-foreground\">{{ slide }}</div>\n </div>\n </div>\n </div>\n </div>\n\n <button\n type=\"button\"\n class=\"inline-flex h-8 w-8 appearance-none box-border items-center justify-center rounded-full border border-input bg-background p-2.5\"\n [ngClass]=\"!canNext ? 'opacity-50' : ''\"\n [disabled]=\"!canNext\"\n (click)=\"onNext()\"\n aria-label=\"Next slide\"\n >\n <svg viewBox=\"0 0 24 24\" class=\"h-4 w-4 text-foreground\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M9 18L15 12L9 6\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path>\n </svg>\n </button>\n </div>\n\n <p *ngIf=\"variant !== 'orientation' && showCounter\" class=\"m-0 pt-2 text-sm font-medium text-muted-foreground\">\n {{ slides.length ? (index + 1) : 0 }} / {{ slides.length }}\n </p>\n\n <div *ngIf=\"variant === 'orientation'\" class=\"flex flex-col items-center gap-4\">\n <button\n type=\"button\"\n class=\"inline-flex h-8 w-8 appearance-none box-border items-center justify-center rounded-full border border-input bg-background p-2.5\"\n [ngClass]=\"!canPrev ? 'opacity-50' : ''\"\n [disabled]=\"!canPrev\"\n (click)=\"onPrev()\"\n aria-label=\"Previous slide\"\n >\n <svg viewBox=\"0 0 24 24\" class=\"h-4 w-4 text-foreground\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M18 15L12 9L6 15\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path>\n </svg>\n </button>\n\n <div class=\"flex w-80 flex-col\">\n <div *ngFor=\"let slide of visibleSlides; let i = index\" class=\"flex h-36 w-full items-center p-1\" [ngClass]=\"i > 0 ? 'pt-1' : ''\">\n <div class=\"flex h-full w-full items-center justify-center rounded-lg border border-border bg-background py-6 shadow-sm\">\n <div class=\"text-center text-2xl font-semibold text-foreground\">{{ slide }}</div>\n </div>\n </div>\n </div>\n\n <button\n type=\"button\"\n class=\"inline-flex h-8 w-8 appearance-none box-border items-center justify-center rounded-full border border-input bg-background p-2.5\"\n [ngClass]=\"!canNext ? 'opacity-50' : ''\"\n [disabled]=\"!canNext\"\n (click)=\"onNext()\"\n aria-label=\"Next slide\"\n >\n <svg viewBox=\"0 0 24 24\" class=\"h-4 w-4 text-foreground\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M6 9L12 15L18 9\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path>\n </svg>\n </button>\n </div>\n</section>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1268
|
+
PdmCarouselComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmCarouselComponent, selector: "pdm-carousel", inputs: { variant: "variant", className: "className", slides: "slides", startIndex: "startIndex", loop: "loop", windowSize: "windowSize", showCounter: "showCounter" }, outputs: { indexChange: "indexChange" }, ngImport: i0, template: "<section [ngClass]=\"[className]\">\n <div *ngIf=\"variant !== 'orientation'\" class=\"flex items-center gap-4\">\n <button\n type=\"button\"\n class=\"inline-flex h-8 w-8 appearance-none box-border items-center justify-center rounded-full border border-solid border-input bg-background p-2.5\"\n [ngClass]=\"!canPrev ? 'opacity-50' : ''\"\n [disabled]=\"!canPrev\"\n (click)=\"onPrev()\"\n aria-label=\"Previous slide\"\n >\n <svg viewBox=\"0 0 24 24\" class=\"h-4 w-4 text-foreground\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M15 18L9 12L15 6\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path>\n </svg>\n </button>\n\n <div class=\"flex items-center\">\n <div *ngFor=\"let slide of visibleSlides; let i = index\" class=\"flex items-center\" [ngClass]=\"i > 0 ? 'pl-4' : ''\">\n <div class=\"flex h-40 w-32 items-center p-1\">\n <div class=\"flex h-full w-full items-center justify-center rounded-lg border border-solid border-border bg-background py-6 shadow-sm\">\n <div class=\"text-center text-2xl font-semibold text-foreground\">{{ slide }}</div>\n </div>\n </div>\n </div>\n </div>\n\n <button\n type=\"button\"\n class=\"inline-flex h-8 w-8 appearance-none box-border items-center justify-center rounded-full border border-solid border-input bg-background p-2.5\"\n [ngClass]=\"!canNext ? 'opacity-50' : ''\"\n [disabled]=\"!canNext\"\n (click)=\"onNext()\"\n aria-label=\"Next slide\"\n >\n <svg viewBox=\"0 0 24 24\" class=\"h-4 w-4 text-foreground\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M9 18L15 12L9 6\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path>\n </svg>\n </button>\n </div>\n\n <p *ngIf=\"variant !== 'orientation' && showCounter\" class=\"m-0 pt-2 text-sm font-medium text-muted-foreground\">\n {{ slides.length ? (index + 1) : 0 }} / {{ slides.length }}\n </p>\n\n <div *ngIf=\"variant === 'orientation'\" class=\"flex flex-col items-center gap-4\">\n <button\n type=\"button\"\n class=\"inline-flex h-8 w-8 appearance-none box-border items-center justify-center rounded-full border border-solid border-input bg-background p-2.5\"\n [ngClass]=\"!canPrev ? 'opacity-50' : ''\"\n [disabled]=\"!canPrev\"\n (click)=\"onPrev()\"\n aria-label=\"Previous slide\"\n >\n <svg viewBox=\"0 0 24 24\" class=\"h-4 w-4 text-foreground\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M18 15L12 9L6 15\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path>\n </svg>\n </button>\n\n <div class=\"flex w-80 flex-col\">\n <div *ngFor=\"let slide of visibleSlides; let i = index\" class=\"flex h-36 w-full items-center p-1\" [ngClass]=\"i > 0 ? 'pt-1' : ''\">\n <div class=\"flex h-full w-full items-center justify-center rounded-lg border border-solid border-border bg-background py-6 shadow-sm\">\n <div class=\"text-center text-2xl font-semibold text-foreground\">{{ slide }}</div>\n </div>\n </div>\n </div>\n\n <button\n type=\"button\"\n class=\"inline-flex h-8 w-8 appearance-none box-border items-center justify-center rounded-full border border-solid border-input bg-background p-2.5\"\n [ngClass]=\"!canNext ? 'opacity-50' : ''\"\n [disabled]=\"!canNext\"\n (click)=\"onNext()\"\n aria-label=\"Next slide\"\n >\n <svg viewBox=\"0 0 24 24\" class=\"h-4 w-4 text-foreground\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M6 9L12 15L18 9\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path>\n </svg>\n </button>\n </div>\n</section>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1249
1269
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmCarouselComponent, decorators: [{
|
|
1250
1270
|
type: Component,
|
|
1251
|
-
args: [{ selector: 'pdm-carousel', changeDetection: ChangeDetectionStrategy.OnPush, template: "<section [ngClass]=\"[className]\">\n <div *ngIf=\"variant !== 'orientation'\" class=\"flex items-center gap-4\">\n <button\n type=\"button\"\n class=\"inline-flex h-8 w-8 appearance-none box-border items-center justify-center rounded-full border border-input bg-background p-2.5\"\n [ngClass]=\"!canPrev ? 'opacity-50' : ''\"\n [disabled]=\"!canPrev\"\n (click)=\"onPrev()\"\n aria-label=\"Previous slide\"\n >\n <svg viewBox=\"0 0 24 24\" class=\"h-4 w-4 text-foreground\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M15 18L9 12L15 6\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path>\n </svg>\n </button>\n\n <div class=\"flex items-center\">\n <div *ngFor=\"let slide of visibleSlides; let i = index\" class=\"flex items-center\" [ngClass]=\"i > 0 ? 'pl-4' : ''\">\n <div class=\"flex h-40 w-32 items-center p-1\">\n <div class=\"flex h-full w-full items-center justify-center rounded-lg border border-border bg-background py-6 shadow-sm\">\n <div class=\"text-center text-2xl font-semibold text-foreground\">{{ slide }}</div>\n </div>\n </div>\n </div>\n </div>\n\n <button\n type=\"button\"\n class=\"inline-flex h-8 w-8 appearance-none box-border items-center justify-center rounded-full border border-input bg-background p-2.5\"\n [ngClass]=\"!canNext ? 'opacity-50' : ''\"\n [disabled]=\"!canNext\"\n (click)=\"onNext()\"\n aria-label=\"Next slide\"\n >\n <svg viewBox=\"0 0 24 24\" class=\"h-4 w-4 text-foreground\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M9 18L15 12L9 6\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path>\n </svg>\n </button>\n </div>\n\n <p *ngIf=\"variant !== 'orientation' && showCounter\" class=\"m-0 pt-2 text-sm font-medium text-muted-foreground\">\n {{ slides.length ? (index + 1) : 0 }} / {{ slides.length }}\n </p>\n\n <div *ngIf=\"variant === 'orientation'\" class=\"flex flex-col items-center gap-4\">\n <button\n type=\"button\"\n class=\"inline-flex h-8 w-8 appearance-none box-border items-center justify-center rounded-full border border-input bg-background p-2.5\"\n [ngClass]=\"!canPrev ? 'opacity-50' : ''\"\n [disabled]=\"!canPrev\"\n (click)=\"onPrev()\"\n aria-label=\"Previous slide\"\n >\n <svg viewBox=\"0 0 24 24\" class=\"h-4 w-4 text-foreground\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M18 15L12 9L6 15\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path>\n </svg>\n </button>\n\n <div class=\"flex w-80 flex-col\">\n <div *ngFor=\"let slide of visibleSlides; let i = index\" class=\"flex h-36 w-full items-center p-1\" [ngClass]=\"i > 0 ? 'pt-1' : ''\">\n <div class=\"flex h-full w-full items-center justify-center rounded-lg border border-border bg-background py-6 shadow-sm\">\n <div class=\"text-center text-2xl font-semibold text-foreground\">{{ slide }}</div>\n </div>\n </div>\n </div>\n\n <button\n type=\"button\"\n class=\"inline-flex h-8 w-8 appearance-none box-border items-center justify-center rounded-full border border-input bg-background p-2.5\"\n [ngClass]=\"!canNext ? 'opacity-50' : ''\"\n [disabled]=\"!canNext\"\n (click)=\"onNext()\"\n aria-label=\"Next slide\"\n >\n <svg viewBox=\"0 0 24 24\" class=\"h-4 w-4 text-foreground\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M6 9L12 15L18 9\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path>\n </svg>\n </button>\n </div>\n</section>\n" }]
|
|
1271
|
+
args: [{ selector: 'pdm-carousel', changeDetection: ChangeDetectionStrategy.OnPush, template: "<section [ngClass]=\"[className]\">\n <div *ngIf=\"variant !== 'orientation'\" class=\"flex items-center gap-4\">\n <button\n type=\"button\"\n class=\"inline-flex h-8 w-8 appearance-none box-border items-center justify-center rounded-full border border-solid border-input bg-background p-2.5\"\n [ngClass]=\"!canPrev ? 'opacity-50' : ''\"\n [disabled]=\"!canPrev\"\n (click)=\"onPrev()\"\n aria-label=\"Previous slide\"\n >\n <svg viewBox=\"0 0 24 24\" class=\"h-4 w-4 text-foreground\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M15 18L9 12L15 6\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path>\n </svg>\n </button>\n\n <div class=\"flex items-center\">\n <div *ngFor=\"let slide of visibleSlides; let i = index\" class=\"flex items-center\" [ngClass]=\"i > 0 ? 'pl-4' : ''\">\n <div class=\"flex h-40 w-32 items-center p-1\">\n <div class=\"flex h-full w-full items-center justify-center rounded-lg border border-solid border-border bg-background py-6 shadow-sm\">\n <div class=\"text-center text-2xl font-semibold text-foreground\">{{ slide }}</div>\n </div>\n </div>\n </div>\n </div>\n\n <button\n type=\"button\"\n class=\"inline-flex h-8 w-8 appearance-none box-border items-center justify-center rounded-full border border-solid border-input bg-background p-2.5\"\n [ngClass]=\"!canNext ? 'opacity-50' : ''\"\n [disabled]=\"!canNext\"\n (click)=\"onNext()\"\n aria-label=\"Next slide\"\n >\n <svg viewBox=\"0 0 24 24\" class=\"h-4 w-4 text-foreground\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M9 18L15 12L9 6\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path>\n </svg>\n </button>\n </div>\n\n <p *ngIf=\"variant !== 'orientation' && showCounter\" class=\"m-0 pt-2 text-sm font-medium text-muted-foreground\">\n {{ slides.length ? (index + 1) : 0 }} / {{ slides.length }}\n </p>\n\n <div *ngIf=\"variant === 'orientation'\" class=\"flex flex-col items-center gap-4\">\n <button\n type=\"button\"\n class=\"inline-flex h-8 w-8 appearance-none box-border items-center justify-center rounded-full border border-solid border-input bg-background p-2.5\"\n [ngClass]=\"!canPrev ? 'opacity-50' : ''\"\n [disabled]=\"!canPrev\"\n (click)=\"onPrev()\"\n aria-label=\"Previous slide\"\n >\n <svg viewBox=\"0 0 24 24\" class=\"h-4 w-4 text-foreground\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M18 15L12 9L6 15\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path>\n </svg>\n </button>\n\n <div class=\"flex w-80 flex-col\">\n <div *ngFor=\"let slide of visibleSlides; let i = index\" class=\"flex h-36 w-full items-center p-1\" [ngClass]=\"i > 0 ? 'pt-1' : ''\">\n <div class=\"flex h-full w-full items-center justify-center rounded-lg border border-solid border-border bg-background py-6 shadow-sm\">\n <div class=\"text-center text-2xl font-semibold text-foreground\">{{ slide }}</div>\n </div>\n </div>\n </div>\n\n <button\n type=\"button\"\n class=\"inline-flex h-8 w-8 appearance-none box-border items-center justify-center rounded-full border border-solid border-input bg-background p-2.5\"\n [ngClass]=\"!canNext ? 'opacity-50' : ''\"\n [disabled]=\"!canNext\"\n (click)=\"onNext()\"\n aria-label=\"Next slide\"\n >\n <svg viewBox=\"0 0 24 24\" class=\"h-4 w-4 text-foreground\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M6 9L12 15L18 9\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path>\n </svg>\n </button>\n </div>\n</section>\n" }]
|
|
1252
1272
|
}], propDecorators: { variant: [{
|
|
1253
1273
|
type: Input
|
|
1254
1274
|
}], className: [{
|
|
@@ -1304,10 +1324,10 @@ class PdmCardComponent {
|
|
|
1304
1324
|
}
|
|
1305
1325
|
}
|
|
1306
1326
|
PdmCardComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1307
|
-
PdmCardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmCardComponent, selector: "pdm-card", inputs: { className: "className" }, ngImport: i0, template: "<section\n [ngClass]=\"[\n 'w-full rounded-lg border border-border bg-background py-6 shadow-sm',\n className\n ]\"\n>\n <div class=\"flex w-full flex-col gap-6\">\n <div class=\"px-6\">\n <ng-content select=\"[pdmCardHeader]\"></ng-content>\n </div>\n <div class=\"px-6\">\n <ng-content select=\"[pdmCardContent]\"></ng-content>\n </div>\n <div class=\"px-6\">\n <ng-content select=\"[pdmCardFooter]\"></ng-content>\n </div>\n </div>\n</section>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1327
|
+
PdmCardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmCardComponent, selector: "pdm-card", inputs: { className: "className" }, ngImport: i0, template: "<section\n [ngClass]=\"[\n 'w-full rounded-lg border border-solid border-border bg-background py-6 shadow-sm',\n className\n ]\"\n>\n <div class=\"flex w-full flex-col gap-6\">\n <div class=\"px-6\">\n <ng-content select=\"[pdmCardHeader]\"></ng-content>\n </div>\n <div class=\"px-6\">\n <ng-content select=\"[pdmCardContent]\"></ng-content>\n </div>\n <div class=\"px-6\">\n <ng-content select=\"[pdmCardFooter]\"></ng-content>\n </div>\n </div>\n</section>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1308
1328
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmCardComponent, decorators: [{
|
|
1309
1329
|
type: Component,
|
|
1310
|
-
args: [{ selector: 'pdm-card', changeDetection: ChangeDetectionStrategy.OnPush, template: "<section\n [ngClass]=\"[\n 'w-full rounded-lg border border-border bg-background py-6 shadow-sm',\n className\n ]\"\n>\n <div class=\"flex w-full flex-col gap-6\">\n <div class=\"px-6\">\n <ng-content select=\"[pdmCardHeader]\"></ng-content>\n </div>\n <div class=\"px-6\">\n <ng-content select=\"[pdmCardContent]\"></ng-content>\n </div>\n <div class=\"px-6\">\n <ng-content select=\"[pdmCardFooter]\"></ng-content>\n </div>\n </div>\n</section>\n" }]
|
|
1330
|
+
args: [{ selector: 'pdm-card', changeDetection: ChangeDetectionStrategy.OnPush, template: "<section\n [ngClass]=\"[\n 'w-full rounded-lg border border-solid border-border bg-background py-6 shadow-sm',\n className\n ]\"\n>\n <div class=\"flex w-full flex-col gap-6\">\n <div class=\"px-6\">\n <ng-content select=\"[pdmCardHeader]\"></ng-content>\n </div>\n <div class=\"px-6\">\n <ng-content select=\"[pdmCardContent]\"></ng-content>\n </div>\n <div class=\"px-6\">\n <ng-content select=\"[pdmCardFooter]\"></ng-content>\n </div>\n </div>\n</section>\n" }]
|
|
1311
1331
|
}], propDecorators: { className: [{
|
|
1312
1332
|
type: Input
|
|
1313
1333
|
}] } });
|
|
@@ -1431,10 +1451,10 @@ class PdmChartComponent {
|
|
|
1431
1451
|
}
|
|
1432
1452
|
}
|
|
1433
1453
|
PdmChartComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmChartComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1434
|
-
PdmChartComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmChartComponent, selector: "pdm-chart", inputs: { type: "type", className: "className", title: "title", description: "description", desktopLabel: "desktopLabel", desktopValue: "desktopValue", mobileLabel: "mobileLabel", mobileValue: "mobileValue", labels: "labels", bars: "bars", line: "line", pie: "pie", radar: "radar", radialValue: "radialValue", radialLabel: "radialLabel", radialDescription: "radialDescription", tooltipTitle: "tooltipTitle", tooltipPrimaryLabel: "tooltipPrimaryLabel", tooltipPrimaryValue: "tooltipPrimaryValue", tooltipSecondaryLabel: "tooltipSecondaryLabel", tooltipSecondaryValue: "tooltipSecondaryValue", pieLabels: "pieLabels", tooltipHint: "tooltipHint", radarMetricPrefix: "radarMetricPrefix", emptyLabel: "emptyLabel" }, ngImport: i0, template: "<section [ngClass]=\"['w-full rounded-lg border border-border bg-card text-card-foreground', className]\">\n <div *ngIf=\"title || description || desktopLabel || desktopValue || mobileLabel || mobileValue\" class=\"flex w-full items-stretch border-b border-border\">\n <div class=\"flex min-w-0 flex-1 flex-col gap-1 px-6 pb-3 pt-4\">\n <h3 *ngIf=\"title\" class=\"m-0 text-sm font-semibold leading-none tracking-tight\">{{ title }}</h3>\n <p *ngIf=\"description\" class=\"m-0 text-sm text-muted-foreground\">{{ description }}</p>\n </div>\n\n <div *ngIf=\"desktopLabel || desktopValue || mobileLabel || mobileValue\" class=\"flex h-24\">\n <div class=\"flex h-full w-44 flex-col justify-center border-l border-border bg-muted px-6 py-4\">\n <span class=\"text-xs text-muted-foreground\">{{ desktopLabel }}</span>\n <span class=\"mt-1 text-2xl font-semibold\">{{ desktopValue }}</span>\n </div>\n <div class=\"flex h-full w-44 flex-col justify-center px-6 py-4\">\n <span class=\"text-xs text-muted-foreground\">{{ mobileLabel }}</span>\n <span class=\"mt-1 text-2xl font-semibold\">{{ mobileValue }}</span>\n </div>\n </div>\n </div>\n\n <div class=\"w-full p-6\">\n <ng-container [ngSwitch]=\"type\">\n <div *ngSwitchCase=\"'bar'\" class=\"flex h-60 w-full flex-col justify-end gap-2\">\n <p *ngIf=\"normalizedBars.length === 0\" class=\"m-0 text-sm text-muted-foreground\">{{ emptyLabel }}</p>\n <div class=\"relative h-48 w-full overflow-hidden\">\n <div class=\"absolute bottom-0 left-0 right-0 border-t border-border opacity-50\"></div>\n <div class=\"absolute left-0 right-0 top-1/4 border-t border-border opacity-50\"></div>\n <div class=\"absolute left-0 right-0 top-1/2 border-t border-border opacity-50\"></div>\n <div class=\"absolute left-0 right-0 top-3/4 border-t border-border opacity-50\"></div>\n <div class=\"absolute inset-x-0 bottom-0 flex h-48 items-end gap-0.5 px-0.5\">\n <div *ngFor=\"let bar of normalizedBars\" class=\"w-1.5 rounded-sm bg-primary\" [style.height.px]=\"bar\"></div>\n </div>\n </div>\n <div *ngIf=\"labels.length\" class=\"flex h-4 w-full items-center justify-between gap-2\">\n <span *ngFor=\"let label of labels\" class=\"truncate text-xs text-muted-foreground\">{{ label }}</span>\n </div>\n </div>\n\n <div *ngSwitchCase=\"'line'\" class=\"flex h-60 w-full flex-col gap-2\">\n <p *ngIf=\"normalizedLine.length === 0\" class=\"m-0 text-sm text-muted-foreground\">{{ emptyLabel }}</p>\n <svg viewBox=\"0 0 320 180\" class=\"h-48 w-full\">\n <line x1=\"0\" y1=\"180\" x2=\"320\" y2=\"180\" stroke=\"hsl(var(--border))\" stroke-width=\"1\"></line>\n <line x1=\"0\" y1=\"135\" x2=\"320\" y2=\"135\" stroke=\"hsl(var(--border))\" stroke-width=\"1\" opacity=\"0.5\"></line>\n <line x1=\"0\" y1=\"90\" x2=\"320\" y2=\"90\" stroke=\"hsl(var(--border))\" stroke-width=\"1\" opacity=\"0.5\"></line>\n <line x1=\"0\" y1=\"45\" x2=\"320\" y2=\"45\" stroke=\"hsl(var(--border))\" stroke-width=\"1\" opacity=\"0.5\"></line>\n <path [attr.d]=\"linePath\" fill=\"none\" stroke=\"hsl(var(--primary))\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path>\n </svg>\n <div *ngIf=\"labels.length\" class=\"flex h-4 w-full items-center justify-between gap-2\">\n <span *ngFor=\"let label of labels\" class=\"truncate text-xs text-muted-foreground\">{{ label }}</span>\n </div>\n </div>\n\n <div *ngSwitchCase=\"'area'\" class=\"flex h-60 w-full flex-col gap-2\">\n <p *ngIf=\"normalizedLine.length === 0\" class=\"m-0 text-sm text-muted-foreground\">{{ emptyLabel }}</p>\n <svg viewBox=\"0 0 320 180\" class=\"h-48 w-full\">\n <defs>\n <linearGradient id=\"pdm-chart-area-gradient\" x1=\"0\" y1=\"0\" x2=\"0\" y2=\"1\">\n <stop offset=\"0%\" stop-color=\"hsl(var(--primary))\" stop-opacity=\"0.35\"></stop>\n <stop offset=\"100%\" stop-color=\"hsl(var(--primary))\" stop-opacity=\"0.02\"></stop>\n </linearGradient>\n </defs>\n <line x1=\"0\" y1=\"180\" x2=\"320\" y2=\"180\" stroke=\"hsl(var(--border))\" stroke-width=\"1\"></line>\n <line x1=\"0\" y1=\"135\" x2=\"320\" y2=\"135\" stroke=\"hsl(var(--border))\" stroke-width=\"1\" opacity=\"0.5\"></line>\n <line x1=\"0\" y1=\"90\" x2=\"320\" y2=\"90\" stroke=\"hsl(var(--border))\" stroke-width=\"1\" opacity=\"0.5\"></line>\n <line x1=\"0\" y1=\"45\" x2=\"320\" y2=\"45\" stroke=\"hsl(var(--border))\" stroke-width=\"1\" opacity=\"0.5\"></line>\n <path [attr.d]=\"areaPath\" fill=\"url(#pdm-chart-area-gradient)\"></path>\n <path [attr.d]=\"linePath\" fill=\"none\" stroke=\"hsl(var(--primary))\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path>\n </svg>\n <div *ngIf=\"labels.length\" class=\"flex h-4 w-full items-center justify-between gap-2\">\n <span *ngFor=\"let label of labels\" class=\"truncate text-xs text-muted-foreground\">{{ label }}</span>\n </div>\n </div>\n\n <div *ngSwitchCase=\"'pie'\" class=\"flex items-center gap-6\">\n <div class=\"relative h-40 w-40 rounded-full\" [style.background]=\"pieGradient\">\n <div class=\"absolute inset-7 rounded-full bg-card\"></div>\n </div>\n <div class=\"grid flex-1 gap-2\">\n <div *ngFor=\"let segment of pieSegments\" class=\"flex items-center justify-between rounded-md border border-border px-3 py-2\">\n <div class=\"flex items-center gap-2\">\n <span class=\"size-2.5 rounded-full\" [style.background]=\"segment.color\"></span>\n <span class=\"text-sm\">{{ segment.label }}</span>\n </div>\n <span class=\"text-sm font-medium\">{{ segment.size | number: '1.0-0' }}%</span>\n </div>\n </div>\n </div>\n\n <div *ngSwitchCase=\"'radar'\" class=\"flex items-center gap-6\">\n <svg viewBox=\"0 0 160 160\" class=\"h-44 w-44\">\n <polygon points=\"80,8 144,44 144,116 80,152 16,116 16,44\" fill=\"none\" stroke=\"hsl(var(--border))\"></polygon>\n <polygon points=\"80,28 126,54 126,106 80,132 34,106 34,54\" fill=\"none\" stroke=\"hsl(var(--border))\" opacity=\"0.75\"></polygon>\n <polygon points=\"80,48 109,64 109,96 80,112 51,96 51,64\" fill=\"none\" stroke=\"hsl(var(--border))\" opacity=\"0.55\"></polygon>\n <polygon [attr.points]=\"radarPoints\" fill=\"hsl(var(--primary))\" fill-opacity=\"0.22\" stroke=\"hsl(var(--primary))\" stroke-width=\"2\"></polygon>\n </svg>\n <div class=\"grid flex-1 gap-2\">\n <div *ngFor=\"let item of radar; index as i\" class=\"flex items-center justify-between rounded-md border border-border px-3 py-2 text-sm\">\n <span class=\"text-muted-foreground\">{{ radarMetricPrefix }} {{ i + 1 }}</span>\n <span class=\"font-medium\">{{ item }}</span>\n </div>\n </div>\n </div>\n\n <div *ngSwitchCase=\"'radial'\" class=\"flex items-center justify-between gap-6\">\n <div class=\"relative flex size-44 items-center justify-center\">\n <svg viewBox=\"0 0 96 96\" class=\"size-40 -rotate-90\">\n <circle cx=\"48\" cy=\"48\" r=\"42\" fill=\"none\" stroke=\"hsl(var(--muted))\" stroke-width=\"10\"></circle>\n <circle\n cx=\"48\"\n cy=\"48\"\n r=\"42\"\n fill=\"none\"\n stroke=\"hsl(var(--primary))\"\n stroke-width=\"10\"\n stroke-linecap=\"round\"\n stroke-dasharray=\"263.89\"\n [attr.stroke-dashoffset]=\"radialStrokeOffset\"\n ></circle>\n </svg>\n <div class=\"absolute text-center\">\n <div class=\"text-2xl font-semibold\">{{ radialValue }}%</div>\n <div class=\"text-xs text-muted-foreground\">{{ radialLabel }}</div>\n </div>\n </div>\n <div class=\"flex-1\">\n <p class=\"m-0 text-sm font-medium\">{{ radialLabel }}</p>\n <p class=\"m-0 mt-1 text-sm text-muted-foreground\">{{ radialDescription }}</p>\n </div>\n </div>\n\n <div *ngSwitchCase=\"'tooltips'\" class=\"grid gap-3\">\n <div class=\"inline-flex w-fit min-w-56 flex-col gap-2 rounded-lg border border-border bg-card p-3 shadow-sm\">\n <p class=\"m-0 text-xs font-medium text-muted-foreground\">{{ tooltipTitle }}</p>\n <div class=\"flex items-center justify-between text-sm\">\n <span>{{ tooltipPrimaryLabel }}</span>\n <span class=\"font-semibold\">{{ tooltipPrimaryValue }}</span>\n </div>\n <div class=\"flex items-center justify-between text-sm\">\n <span>{{ tooltipSecondaryLabel }}</span>\n <span class=\"font-semibold\">{{ tooltipSecondaryValue }}</span>\n </div>\n </div>\n <p *ngIf=\"tooltipHint\" class=\"m-0 text-xs text-muted-foreground\">{{ tooltipHint }}</p>\n </div>\n </ng-container>\n </div>\n</section>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "pipe", type: i1.DecimalPipe, name: "number" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1454
|
+
PdmChartComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmChartComponent, selector: "pdm-chart", inputs: { type: "type", className: "className", title: "title", description: "description", desktopLabel: "desktopLabel", desktopValue: "desktopValue", mobileLabel: "mobileLabel", mobileValue: "mobileValue", labels: "labels", bars: "bars", line: "line", pie: "pie", radar: "radar", radialValue: "radialValue", radialLabel: "radialLabel", radialDescription: "radialDescription", tooltipTitle: "tooltipTitle", tooltipPrimaryLabel: "tooltipPrimaryLabel", tooltipPrimaryValue: "tooltipPrimaryValue", tooltipSecondaryLabel: "tooltipSecondaryLabel", tooltipSecondaryValue: "tooltipSecondaryValue", pieLabels: "pieLabels", tooltipHint: "tooltipHint", radarMetricPrefix: "radarMetricPrefix", emptyLabel: "emptyLabel" }, ngImport: i0, template: "<section [ngClass]=\"['w-full rounded-lg border border-solid border-border bg-card text-card-foreground', className]\">\n <div *ngIf=\"title || description || desktopLabel || desktopValue || mobileLabel || mobileValue\" class=\"flex w-full items-stretch border-b border-border\">\n <div class=\"flex min-w-0 flex-1 flex-col gap-1 px-6 pb-3 pt-4\">\n <h3 *ngIf=\"title\" class=\"m-0 text-sm font-semibold leading-none tracking-tight\">{{ title }}</h3>\n <p *ngIf=\"description\" class=\"m-0 text-sm text-muted-foreground\">{{ description }}</p>\n </div>\n\n <div *ngIf=\"desktopLabel || desktopValue || mobileLabel || mobileValue\" class=\"flex h-24\">\n <div class=\"flex h-full w-44 flex-col justify-center border-l border-border bg-muted px-6 py-4\">\n <span class=\"text-xs text-muted-foreground\">{{ desktopLabel }}</span>\n <span class=\"mt-1 text-2xl font-semibold\">{{ desktopValue }}</span>\n </div>\n <div class=\"flex h-full w-44 flex-col justify-center px-6 py-4\">\n <span class=\"text-xs text-muted-foreground\">{{ mobileLabel }}</span>\n <span class=\"mt-1 text-2xl font-semibold\">{{ mobileValue }}</span>\n </div>\n </div>\n </div>\n\n <div class=\"w-full p-6\">\n <ng-container [ngSwitch]=\"type\">\n <div *ngSwitchCase=\"'bar'\" class=\"flex h-60 w-full flex-col justify-end gap-2\">\n <p *ngIf=\"normalizedBars.length === 0\" class=\"m-0 text-sm text-muted-foreground\">{{ emptyLabel }}</p>\n <div class=\"relative h-48 w-full overflow-hidden\">\n <div class=\"absolute bottom-0 left-0 right-0 border-t border-border opacity-50\"></div>\n <div class=\"absolute left-0 right-0 top-1/4 border-t border-border opacity-50\"></div>\n <div class=\"absolute left-0 right-0 top-1/2 border-t border-border opacity-50\"></div>\n <div class=\"absolute left-0 right-0 top-3/4 border-t border-border opacity-50\"></div>\n <div class=\"absolute inset-x-0 bottom-0 flex h-48 items-end gap-0.5 px-0.5\">\n <div *ngFor=\"let bar of normalizedBars\" class=\"w-1.5 rounded-sm bg-primary\" [style.height.px]=\"bar\"></div>\n </div>\n </div>\n <div *ngIf=\"labels.length\" class=\"flex h-4 w-full items-center justify-between gap-2\">\n <span *ngFor=\"let label of labels\" class=\"truncate text-xs text-muted-foreground\">{{ label }}</span>\n </div>\n </div>\n\n <div *ngSwitchCase=\"'line'\" class=\"flex h-60 w-full flex-col gap-2\">\n <p *ngIf=\"normalizedLine.length === 0\" class=\"m-0 text-sm text-muted-foreground\">{{ emptyLabel }}</p>\n <svg viewBox=\"0 0 320 180\" class=\"h-48 w-full\">\n <line x1=\"0\" y1=\"180\" x2=\"320\" y2=\"180\" stroke=\"hsl(var(--border))\" stroke-width=\"1\"></line>\n <line x1=\"0\" y1=\"135\" x2=\"320\" y2=\"135\" stroke=\"hsl(var(--border))\" stroke-width=\"1\" opacity=\"0.5\"></line>\n <line x1=\"0\" y1=\"90\" x2=\"320\" y2=\"90\" stroke=\"hsl(var(--border))\" stroke-width=\"1\" opacity=\"0.5\"></line>\n <line x1=\"0\" y1=\"45\" x2=\"320\" y2=\"45\" stroke=\"hsl(var(--border))\" stroke-width=\"1\" opacity=\"0.5\"></line>\n <path [attr.d]=\"linePath\" fill=\"none\" stroke=\"hsl(var(--primary))\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path>\n </svg>\n <div *ngIf=\"labels.length\" class=\"flex h-4 w-full items-center justify-between gap-2\">\n <span *ngFor=\"let label of labels\" class=\"truncate text-xs text-muted-foreground\">{{ label }}</span>\n </div>\n </div>\n\n <div *ngSwitchCase=\"'area'\" class=\"flex h-60 w-full flex-col gap-2\">\n <p *ngIf=\"normalizedLine.length === 0\" class=\"m-0 text-sm text-muted-foreground\">{{ emptyLabel }}</p>\n <svg viewBox=\"0 0 320 180\" class=\"h-48 w-full\">\n <defs>\n <linearGradient id=\"pdm-chart-area-gradient\" x1=\"0\" y1=\"0\" x2=\"0\" y2=\"1\">\n <stop offset=\"0%\" stop-color=\"hsl(var(--primary))\" stop-opacity=\"0.35\"></stop>\n <stop offset=\"100%\" stop-color=\"hsl(var(--primary))\" stop-opacity=\"0.02\"></stop>\n </linearGradient>\n </defs>\n <line x1=\"0\" y1=\"180\" x2=\"320\" y2=\"180\" stroke=\"hsl(var(--border))\" stroke-width=\"1\"></line>\n <line x1=\"0\" y1=\"135\" x2=\"320\" y2=\"135\" stroke=\"hsl(var(--border))\" stroke-width=\"1\" opacity=\"0.5\"></line>\n <line x1=\"0\" y1=\"90\" x2=\"320\" y2=\"90\" stroke=\"hsl(var(--border))\" stroke-width=\"1\" opacity=\"0.5\"></line>\n <line x1=\"0\" y1=\"45\" x2=\"320\" y2=\"45\" stroke=\"hsl(var(--border))\" stroke-width=\"1\" opacity=\"0.5\"></line>\n <path [attr.d]=\"areaPath\" fill=\"url(#pdm-chart-area-gradient)\"></path>\n <path [attr.d]=\"linePath\" fill=\"none\" stroke=\"hsl(var(--primary))\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path>\n </svg>\n <div *ngIf=\"labels.length\" class=\"flex h-4 w-full items-center justify-between gap-2\">\n <span *ngFor=\"let label of labels\" class=\"truncate text-xs text-muted-foreground\">{{ label }}</span>\n </div>\n </div>\n\n <div *ngSwitchCase=\"'pie'\" class=\"flex items-center gap-6\">\n <div class=\"relative h-40 w-40 rounded-full\" [style.background]=\"pieGradient\">\n <div class=\"absolute inset-7 rounded-full bg-card\"></div>\n </div>\n <div class=\"grid flex-1 gap-2\">\n <div *ngFor=\"let segment of pieSegments\" class=\"flex items-center justify-between rounded-md border border-solid border-border px-3 py-2\">\n <div class=\"flex items-center gap-2\">\n <span class=\"size-2.5 rounded-full\" [style.background]=\"segment.color\"></span>\n <span class=\"text-sm\">{{ segment.label }}</span>\n </div>\n <span class=\"text-sm font-medium\">{{ segment.size | number: '1.0-0' }}%</span>\n </div>\n </div>\n </div>\n\n <div *ngSwitchCase=\"'radar'\" class=\"flex items-center gap-6\">\n <svg viewBox=\"0 0 160 160\" class=\"h-44 w-44\">\n <polygon points=\"80,8 144,44 144,116 80,152 16,116 16,44\" fill=\"none\" stroke=\"hsl(var(--border))\"></polygon>\n <polygon points=\"80,28 126,54 126,106 80,132 34,106 34,54\" fill=\"none\" stroke=\"hsl(var(--border))\" opacity=\"0.75\"></polygon>\n <polygon points=\"80,48 109,64 109,96 80,112 51,96 51,64\" fill=\"none\" stroke=\"hsl(var(--border))\" opacity=\"0.55\"></polygon>\n <polygon [attr.points]=\"radarPoints\" fill=\"hsl(var(--primary))\" fill-opacity=\"0.22\" stroke=\"hsl(var(--primary))\" stroke-width=\"2\"></polygon>\n </svg>\n <div class=\"grid flex-1 gap-2\">\n <div *ngFor=\"let item of radar; index as i\" class=\"flex items-center justify-between rounded-md border border-solid border-border px-3 py-2 text-sm\">\n <span class=\"text-muted-foreground\">{{ radarMetricPrefix }} {{ i + 1 }}</span>\n <span class=\"font-medium\">{{ item }}</span>\n </div>\n </div>\n </div>\n\n <div *ngSwitchCase=\"'radial'\" class=\"flex items-center justify-between gap-6\">\n <div class=\"relative flex size-44 items-center justify-center\">\n <svg viewBox=\"0 0 96 96\" class=\"size-40 -rotate-90\">\n <circle cx=\"48\" cy=\"48\" r=\"42\" fill=\"none\" stroke=\"hsl(var(--muted))\" stroke-width=\"10\"></circle>\n <circle\n cx=\"48\"\n cy=\"48\"\n r=\"42\"\n fill=\"none\"\n stroke=\"hsl(var(--primary))\"\n stroke-width=\"10\"\n stroke-linecap=\"round\"\n stroke-dasharray=\"263.89\"\n [attr.stroke-dashoffset]=\"radialStrokeOffset\"\n ></circle>\n </svg>\n <div class=\"absolute text-center\">\n <div class=\"text-2xl font-semibold\">{{ radialValue }}%</div>\n <div class=\"text-xs text-muted-foreground\">{{ radialLabel }}</div>\n </div>\n </div>\n <div class=\"flex-1\">\n <p class=\"m-0 text-sm font-medium\">{{ radialLabel }}</p>\n <p class=\"m-0 mt-1 text-sm text-muted-foreground\">{{ radialDescription }}</p>\n </div>\n </div>\n\n <div *ngSwitchCase=\"'tooltips'\" class=\"grid gap-3\">\n <div class=\"inline-flex w-fit min-w-56 flex-col gap-2 rounded-lg border border-solid border-border bg-card p-3 shadow-sm\">\n <p class=\"m-0 text-xs font-medium text-muted-foreground\">{{ tooltipTitle }}</p>\n <div class=\"flex items-center justify-between text-sm\">\n <span>{{ tooltipPrimaryLabel }}</span>\n <span class=\"font-semibold\">{{ tooltipPrimaryValue }}</span>\n </div>\n <div class=\"flex items-center justify-between text-sm\">\n <span>{{ tooltipSecondaryLabel }}</span>\n <span class=\"font-semibold\">{{ tooltipSecondaryValue }}</span>\n </div>\n </div>\n <p *ngIf=\"tooltipHint\" class=\"m-0 text-xs text-muted-foreground\">{{ tooltipHint }}</p>\n </div>\n </ng-container>\n </div>\n</section>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "pipe", type: i1.DecimalPipe, name: "number" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1435
1455
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmChartComponent, decorators: [{
|
|
1436
1456
|
type: Component,
|
|
1437
|
-
args: [{ selector: 'pdm-chart', changeDetection: ChangeDetectionStrategy.OnPush, template: "<section [ngClass]=\"['w-full rounded-lg border border-border bg-card text-card-foreground', className]\">\n <div *ngIf=\"title || description || desktopLabel || desktopValue || mobileLabel || mobileValue\" class=\"flex w-full items-stretch border-b border-border\">\n <div class=\"flex min-w-0 flex-1 flex-col gap-1 px-6 pb-3 pt-4\">\n <h3 *ngIf=\"title\" class=\"m-0 text-sm font-semibold leading-none tracking-tight\">{{ title }}</h3>\n <p *ngIf=\"description\" class=\"m-0 text-sm text-muted-foreground\">{{ description }}</p>\n </div>\n\n <div *ngIf=\"desktopLabel || desktopValue || mobileLabel || mobileValue\" class=\"flex h-24\">\n <div class=\"flex h-full w-44 flex-col justify-center border-l border-border bg-muted px-6 py-4\">\n <span class=\"text-xs text-muted-foreground\">{{ desktopLabel }}</span>\n <span class=\"mt-1 text-2xl font-semibold\">{{ desktopValue }}</span>\n </div>\n <div class=\"flex h-full w-44 flex-col justify-center px-6 py-4\">\n <span class=\"text-xs text-muted-foreground\">{{ mobileLabel }}</span>\n <span class=\"mt-1 text-2xl font-semibold\">{{ mobileValue }}</span>\n </div>\n </div>\n </div>\n\n <div class=\"w-full p-6\">\n <ng-container [ngSwitch]=\"type\">\n <div *ngSwitchCase=\"'bar'\" class=\"flex h-60 w-full flex-col justify-end gap-2\">\n <p *ngIf=\"normalizedBars.length === 0\" class=\"m-0 text-sm text-muted-foreground\">{{ emptyLabel }}</p>\n <div class=\"relative h-48 w-full overflow-hidden\">\n <div class=\"absolute bottom-0 left-0 right-0 border-t border-border opacity-50\"></div>\n <div class=\"absolute left-0 right-0 top-1/4 border-t border-border opacity-50\"></div>\n <div class=\"absolute left-0 right-0 top-1/2 border-t border-border opacity-50\"></div>\n <div class=\"absolute left-0 right-0 top-3/4 border-t border-border opacity-50\"></div>\n <div class=\"absolute inset-x-0 bottom-0 flex h-48 items-end gap-0.5 px-0.5\">\n <div *ngFor=\"let bar of normalizedBars\" class=\"w-1.5 rounded-sm bg-primary\" [style.height.px]=\"bar\"></div>\n </div>\n </div>\n <div *ngIf=\"labels.length\" class=\"flex h-4 w-full items-center justify-between gap-2\">\n <span *ngFor=\"let label of labels\" class=\"truncate text-xs text-muted-foreground\">{{ label }}</span>\n </div>\n </div>\n\n <div *ngSwitchCase=\"'line'\" class=\"flex h-60 w-full flex-col gap-2\">\n <p *ngIf=\"normalizedLine.length === 0\" class=\"m-0 text-sm text-muted-foreground\">{{ emptyLabel }}</p>\n <svg viewBox=\"0 0 320 180\" class=\"h-48 w-full\">\n <line x1=\"0\" y1=\"180\" x2=\"320\" y2=\"180\" stroke=\"hsl(var(--border))\" stroke-width=\"1\"></line>\n <line x1=\"0\" y1=\"135\" x2=\"320\" y2=\"135\" stroke=\"hsl(var(--border))\" stroke-width=\"1\" opacity=\"0.5\"></line>\n <line x1=\"0\" y1=\"90\" x2=\"320\" y2=\"90\" stroke=\"hsl(var(--border))\" stroke-width=\"1\" opacity=\"0.5\"></line>\n <line x1=\"0\" y1=\"45\" x2=\"320\" y2=\"45\" stroke=\"hsl(var(--border))\" stroke-width=\"1\" opacity=\"0.5\"></line>\n <path [attr.d]=\"linePath\" fill=\"none\" stroke=\"hsl(var(--primary))\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path>\n </svg>\n <div *ngIf=\"labels.length\" class=\"flex h-4 w-full items-center justify-between gap-2\">\n <span *ngFor=\"let label of labels\" class=\"truncate text-xs text-muted-foreground\">{{ label }}</span>\n </div>\n </div>\n\n <div *ngSwitchCase=\"'area'\" class=\"flex h-60 w-full flex-col gap-2\">\n <p *ngIf=\"normalizedLine.length === 0\" class=\"m-0 text-sm text-muted-foreground\">{{ emptyLabel }}</p>\n <svg viewBox=\"0 0 320 180\" class=\"h-48 w-full\">\n <defs>\n <linearGradient id=\"pdm-chart-area-gradient\" x1=\"0\" y1=\"0\" x2=\"0\" y2=\"1\">\n <stop offset=\"0%\" stop-color=\"hsl(var(--primary))\" stop-opacity=\"0.35\"></stop>\n <stop offset=\"100%\" stop-color=\"hsl(var(--primary))\" stop-opacity=\"0.02\"></stop>\n </linearGradient>\n </defs>\n <line x1=\"0\" y1=\"180\" x2=\"320\" y2=\"180\" stroke=\"hsl(var(--border))\" stroke-width=\"1\"></line>\n <line x1=\"0\" y1=\"135\" x2=\"320\" y2=\"135\" stroke=\"hsl(var(--border))\" stroke-width=\"1\" opacity=\"0.5\"></line>\n <line x1=\"0\" y1=\"90\" x2=\"320\" y2=\"90\" stroke=\"hsl(var(--border))\" stroke-width=\"1\" opacity=\"0.5\"></line>\n <line x1=\"0\" y1=\"45\" x2=\"320\" y2=\"45\" stroke=\"hsl(var(--border))\" stroke-width=\"1\" opacity=\"0.5\"></line>\n <path [attr.d]=\"areaPath\" fill=\"url(#pdm-chart-area-gradient)\"></path>\n <path [attr.d]=\"linePath\" fill=\"none\" stroke=\"hsl(var(--primary))\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path>\n </svg>\n <div *ngIf=\"labels.length\" class=\"flex h-4 w-full items-center justify-between gap-2\">\n <span *ngFor=\"let label of labels\" class=\"truncate text-xs text-muted-foreground\">{{ label }}</span>\n </div>\n </div>\n\n <div *ngSwitchCase=\"'pie'\" class=\"flex items-center gap-6\">\n <div class=\"relative h-40 w-40 rounded-full\" [style.background]=\"pieGradient\">\n <div class=\"absolute inset-7 rounded-full bg-card\"></div>\n </div>\n <div class=\"grid flex-1 gap-2\">\n <div *ngFor=\"let segment of pieSegments\" class=\"flex items-center justify-between rounded-md border border-border px-3 py-2\">\n <div class=\"flex items-center gap-2\">\n <span class=\"size-2.5 rounded-full\" [style.background]=\"segment.color\"></span>\n <span class=\"text-sm\">{{ segment.label }}</span>\n </div>\n <span class=\"text-sm font-medium\">{{ segment.size | number: '1.0-0' }}%</span>\n </div>\n </div>\n </div>\n\n <div *ngSwitchCase=\"'radar'\" class=\"flex items-center gap-6\">\n <svg viewBox=\"0 0 160 160\" class=\"h-44 w-44\">\n <polygon points=\"80,8 144,44 144,116 80,152 16,116 16,44\" fill=\"none\" stroke=\"hsl(var(--border))\"></polygon>\n <polygon points=\"80,28 126,54 126,106 80,132 34,106 34,54\" fill=\"none\" stroke=\"hsl(var(--border))\" opacity=\"0.75\"></polygon>\n <polygon points=\"80,48 109,64 109,96 80,112 51,96 51,64\" fill=\"none\" stroke=\"hsl(var(--border))\" opacity=\"0.55\"></polygon>\n <polygon [attr.points]=\"radarPoints\" fill=\"hsl(var(--primary))\" fill-opacity=\"0.22\" stroke=\"hsl(var(--primary))\" stroke-width=\"2\"></polygon>\n </svg>\n <div class=\"grid flex-1 gap-2\">\n <div *ngFor=\"let item of radar; index as i\" class=\"flex items-center justify-between rounded-md border border-border px-3 py-2 text-sm\">\n <span class=\"text-muted-foreground\">{{ radarMetricPrefix }} {{ i + 1 }}</span>\n <span class=\"font-medium\">{{ item }}</span>\n </div>\n </div>\n </div>\n\n <div *ngSwitchCase=\"'radial'\" class=\"flex items-center justify-between gap-6\">\n <div class=\"relative flex size-44 items-center justify-center\">\n <svg viewBox=\"0 0 96 96\" class=\"size-40 -rotate-90\">\n <circle cx=\"48\" cy=\"48\" r=\"42\" fill=\"none\" stroke=\"hsl(var(--muted))\" stroke-width=\"10\"></circle>\n <circle\n cx=\"48\"\n cy=\"48\"\n r=\"42\"\n fill=\"none\"\n stroke=\"hsl(var(--primary))\"\n stroke-width=\"10\"\n stroke-linecap=\"round\"\n stroke-dasharray=\"263.89\"\n [attr.stroke-dashoffset]=\"radialStrokeOffset\"\n ></circle>\n </svg>\n <div class=\"absolute text-center\">\n <div class=\"text-2xl font-semibold\">{{ radialValue }}%</div>\n <div class=\"text-xs text-muted-foreground\">{{ radialLabel }}</div>\n </div>\n </div>\n <div class=\"flex-1\">\n <p class=\"m-0 text-sm font-medium\">{{ radialLabel }}</p>\n <p class=\"m-0 mt-1 text-sm text-muted-foreground\">{{ radialDescription }}</p>\n </div>\n </div>\n\n <div *ngSwitchCase=\"'tooltips'\" class=\"grid gap-3\">\n <div class=\"inline-flex w-fit min-w-56 flex-col gap-2 rounded-lg border border-border bg-card p-3 shadow-sm\">\n <p class=\"m-0 text-xs font-medium text-muted-foreground\">{{ tooltipTitle }}</p>\n <div class=\"flex items-center justify-between text-sm\">\n <span>{{ tooltipPrimaryLabel }}</span>\n <span class=\"font-semibold\">{{ tooltipPrimaryValue }}</span>\n </div>\n <div class=\"flex items-center justify-between text-sm\">\n <span>{{ tooltipSecondaryLabel }}</span>\n <span class=\"font-semibold\">{{ tooltipSecondaryValue }}</span>\n </div>\n </div>\n <p *ngIf=\"tooltipHint\" class=\"m-0 text-xs text-muted-foreground\">{{ tooltipHint }}</p>\n </div>\n </ng-container>\n </div>\n</section>\n" }]
|
|
1457
|
+
args: [{ selector: 'pdm-chart', changeDetection: ChangeDetectionStrategy.OnPush, template: "<section [ngClass]=\"['w-full rounded-lg border border-solid border-border bg-card text-card-foreground', className]\">\n <div *ngIf=\"title || description || desktopLabel || desktopValue || mobileLabel || mobileValue\" class=\"flex w-full items-stretch border-b border-border\">\n <div class=\"flex min-w-0 flex-1 flex-col gap-1 px-6 pb-3 pt-4\">\n <h3 *ngIf=\"title\" class=\"m-0 text-sm font-semibold leading-none tracking-tight\">{{ title }}</h3>\n <p *ngIf=\"description\" class=\"m-0 text-sm text-muted-foreground\">{{ description }}</p>\n </div>\n\n <div *ngIf=\"desktopLabel || desktopValue || mobileLabel || mobileValue\" class=\"flex h-24\">\n <div class=\"flex h-full w-44 flex-col justify-center border-l border-border bg-muted px-6 py-4\">\n <span class=\"text-xs text-muted-foreground\">{{ desktopLabel }}</span>\n <span class=\"mt-1 text-2xl font-semibold\">{{ desktopValue }}</span>\n </div>\n <div class=\"flex h-full w-44 flex-col justify-center px-6 py-4\">\n <span class=\"text-xs text-muted-foreground\">{{ mobileLabel }}</span>\n <span class=\"mt-1 text-2xl font-semibold\">{{ mobileValue }}</span>\n </div>\n </div>\n </div>\n\n <div class=\"w-full p-6\">\n <ng-container [ngSwitch]=\"type\">\n <div *ngSwitchCase=\"'bar'\" class=\"flex h-60 w-full flex-col justify-end gap-2\">\n <p *ngIf=\"normalizedBars.length === 0\" class=\"m-0 text-sm text-muted-foreground\">{{ emptyLabel }}</p>\n <div class=\"relative h-48 w-full overflow-hidden\">\n <div class=\"absolute bottom-0 left-0 right-0 border-t border-border opacity-50\"></div>\n <div class=\"absolute left-0 right-0 top-1/4 border-t border-border opacity-50\"></div>\n <div class=\"absolute left-0 right-0 top-1/2 border-t border-border opacity-50\"></div>\n <div class=\"absolute left-0 right-0 top-3/4 border-t border-border opacity-50\"></div>\n <div class=\"absolute inset-x-0 bottom-0 flex h-48 items-end gap-0.5 px-0.5\">\n <div *ngFor=\"let bar of normalizedBars\" class=\"w-1.5 rounded-sm bg-primary\" [style.height.px]=\"bar\"></div>\n </div>\n </div>\n <div *ngIf=\"labels.length\" class=\"flex h-4 w-full items-center justify-between gap-2\">\n <span *ngFor=\"let label of labels\" class=\"truncate text-xs text-muted-foreground\">{{ label }}</span>\n </div>\n </div>\n\n <div *ngSwitchCase=\"'line'\" class=\"flex h-60 w-full flex-col gap-2\">\n <p *ngIf=\"normalizedLine.length === 0\" class=\"m-0 text-sm text-muted-foreground\">{{ emptyLabel }}</p>\n <svg viewBox=\"0 0 320 180\" class=\"h-48 w-full\">\n <line x1=\"0\" y1=\"180\" x2=\"320\" y2=\"180\" stroke=\"hsl(var(--border))\" stroke-width=\"1\"></line>\n <line x1=\"0\" y1=\"135\" x2=\"320\" y2=\"135\" stroke=\"hsl(var(--border))\" stroke-width=\"1\" opacity=\"0.5\"></line>\n <line x1=\"0\" y1=\"90\" x2=\"320\" y2=\"90\" stroke=\"hsl(var(--border))\" stroke-width=\"1\" opacity=\"0.5\"></line>\n <line x1=\"0\" y1=\"45\" x2=\"320\" y2=\"45\" stroke=\"hsl(var(--border))\" stroke-width=\"1\" opacity=\"0.5\"></line>\n <path [attr.d]=\"linePath\" fill=\"none\" stroke=\"hsl(var(--primary))\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path>\n </svg>\n <div *ngIf=\"labels.length\" class=\"flex h-4 w-full items-center justify-between gap-2\">\n <span *ngFor=\"let label of labels\" class=\"truncate text-xs text-muted-foreground\">{{ label }}</span>\n </div>\n </div>\n\n <div *ngSwitchCase=\"'area'\" class=\"flex h-60 w-full flex-col gap-2\">\n <p *ngIf=\"normalizedLine.length === 0\" class=\"m-0 text-sm text-muted-foreground\">{{ emptyLabel }}</p>\n <svg viewBox=\"0 0 320 180\" class=\"h-48 w-full\">\n <defs>\n <linearGradient id=\"pdm-chart-area-gradient\" x1=\"0\" y1=\"0\" x2=\"0\" y2=\"1\">\n <stop offset=\"0%\" stop-color=\"hsl(var(--primary))\" stop-opacity=\"0.35\"></stop>\n <stop offset=\"100%\" stop-color=\"hsl(var(--primary))\" stop-opacity=\"0.02\"></stop>\n </linearGradient>\n </defs>\n <line x1=\"0\" y1=\"180\" x2=\"320\" y2=\"180\" stroke=\"hsl(var(--border))\" stroke-width=\"1\"></line>\n <line x1=\"0\" y1=\"135\" x2=\"320\" y2=\"135\" stroke=\"hsl(var(--border))\" stroke-width=\"1\" opacity=\"0.5\"></line>\n <line x1=\"0\" y1=\"90\" x2=\"320\" y2=\"90\" stroke=\"hsl(var(--border))\" stroke-width=\"1\" opacity=\"0.5\"></line>\n <line x1=\"0\" y1=\"45\" x2=\"320\" y2=\"45\" stroke=\"hsl(var(--border))\" stroke-width=\"1\" opacity=\"0.5\"></line>\n <path [attr.d]=\"areaPath\" fill=\"url(#pdm-chart-area-gradient)\"></path>\n <path [attr.d]=\"linePath\" fill=\"none\" stroke=\"hsl(var(--primary))\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path>\n </svg>\n <div *ngIf=\"labels.length\" class=\"flex h-4 w-full items-center justify-between gap-2\">\n <span *ngFor=\"let label of labels\" class=\"truncate text-xs text-muted-foreground\">{{ label }}</span>\n </div>\n </div>\n\n <div *ngSwitchCase=\"'pie'\" class=\"flex items-center gap-6\">\n <div class=\"relative h-40 w-40 rounded-full\" [style.background]=\"pieGradient\">\n <div class=\"absolute inset-7 rounded-full bg-card\"></div>\n </div>\n <div class=\"grid flex-1 gap-2\">\n <div *ngFor=\"let segment of pieSegments\" class=\"flex items-center justify-between rounded-md border border-solid border-border px-3 py-2\">\n <div class=\"flex items-center gap-2\">\n <span class=\"size-2.5 rounded-full\" [style.background]=\"segment.color\"></span>\n <span class=\"text-sm\">{{ segment.label }}</span>\n </div>\n <span class=\"text-sm font-medium\">{{ segment.size | number: '1.0-0' }}%</span>\n </div>\n </div>\n </div>\n\n <div *ngSwitchCase=\"'radar'\" class=\"flex items-center gap-6\">\n <svg viewBox=\"0 0 160 160\" class=\"h-44 w-44\">\n <polygon points=\"80,8 144,44 144,116 80,152 16,116 16,44\" fill=\"none\" stroke=\"hsl(var(--border))\"></polygon>\n <polygon points=\"80,28 126,54 126,106 80,132 34,106 34,54\" fill=\"none\" stroke=\"hsl(var(--border))\" opacity=\"0.75\"></polygon>\n <polygon points=\"80,48 109,64 109,96 80,112 51,96 51,64\" fill=\"none\" stroke=\"hsl(var(--border))\" opacity=\"0.55\"></polygon>\n <polygon [attr.points]=\"radarPoints\" fill=\"hsl(var(--primary))\" fill-opacity=\"0.22\" stroke=\"hsl(var(--primary))\" stroke-width=\"2\"></polygon>\n </svg>\n <div class=\"grid flex-1 gap-2\">\n <div *ngFor=\"let item of radar; index as i\" class=\"flex items-center justify-between rounded-md border border-solid border-border px-3 py-2 text-sm\">\n <span class=\"text-muted-foreground\">{{ radarMetricPrefix }} {{ i + 1 }}</span>\n <span class=\"font-medium\">{{ item }}</span>\n </div>\n </div>\n </div>\n\n <div *ngSwitchCase=\"'radial'\" class=\"flex items-center justify-between gap-6\">\n <div class=\"relative flex size-44 items-center justify-center\">\n <svg viewBox=\"0 0 96 96\" class=\"size-40 -rotate-90\">\n <circle cx=\"48\" cy=\"48\" r=\"42\" fill=\"none\" stroke=\"hsl(var(--muted))\" stroke-width=\"10\"></circle>\n <circle\n cx=\"48\"\n cy=\"48\"\n r=\"42\"\n fill=\"none\"\n stroke=\"hsl(var(--primary))\"\n stroke-width=\"10\"\n stroke-linecap=\"round\"\n stroke-dasharray=\"263.89\"\n [attr.stroke-dashoffset]=\"radialStrokeOffset\"\n ></circle>\n </svg>\n <div class=\"absolute text-center\">\n <div class=\"text-2xl font-semibold\">{{ radialValue }}%</div>\n <div class=\"text-xs text-muted-foreground\">{{ radialLabel }}</div>\n </div>\n </div>\n <div class=\"flex-1\">\n <p class=\"m-0 text-sm font-medium\">{{ radialLabel }}</p>\n <p class=\"m-0 mt-1 text-sm text-muted-foreground\">{{ radialDescription }}</p>\n </div>\n </div>\n\n <div *ngSwitchCase=\"'tooltips'\" class=\"grid gap-3\">\n <div class=\"inline-flex w-fit min-w-56 flex-col gap-2 rounded-lg border border-solid border-border bg-card p-3 shadow-sm\">\n <p class=\"m-0 text-xs font-medium text-muted-foreground\">{{ tooltipTitle }}</p>\n <div class=\"flex items-center justify-between text-sm\">\n <span>{{ tooltipPrimaryLabel }}</span>\n <span class=\"font-semibold\">{{ tooltipPrimaryValue }}</span>\n </div>\n <div class=\"flex items-center justify-between text-sm\">\n <span>{{ tooltipSecondaryLabel }}</span>\n <span class=\"font-semibold\">{{ tooltipSecondaryValue }}</span>\n </div>\n </div>\n <p *ngIf=\"tooltipHint\" class=\"m-0 text-xs text-muted-foreground\">{{ tooltipHint }}</p>\n </div>\n </ng-container>\n </div>\n</section>\n" }]
|
|
1438
1458
|
}], propDecorators: { type: [{
|
|
1439
1459
|
type: Input
|
|
1440
1460
|
}], className: [{
|
|
@@ -1509,10 +1529,10 @@ class PdmCheckboxComponent {
|
|
|
1509
1529
|
}
|
|
1510
1530
|
}
|
|
1511
1531
|
PdmCheckboxComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmCheckboxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1512
|
-
PdmCheckboxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmCheckboxComponent, selector: "pdm-checkbox", inputs: { id: "id", checked: "checked", disabled: "disabled", variant: "variant", label: "label", description: "description", className: "className" }, outputs: { checkedChange: "checkedChange" }, ngImport: i0, template: "<button\n type=\"button\"\n role=\"checkbox\"\n [attr.id]=\"id || null\"\n [attr.aria-checked]=\"checked\"\n [attr.aria-disabled]=\"disabled\"\n [disabled]=\"disabled\"\n [ngClass]=\"[\n 'w-full appearance-none box-border border-0 bg-transparent p-0 text-left outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background',\n variant === 'card'\n ? checked\n ? 'flex items-start gap-3 rounded-lg border border-primary bg-muted p-4'\n : 'flex items-start gap-3 rounded-lg border border-border bg-background p-4'\n : hasDescription\n ? 'flex items-start gap-3'\n : 'flex items-center gap-3',\n disabled ? 'opacity-50' : '',\n className,\n ]\"\n (click)=\"onToggle()\"\n>\n <span\n [ngClass]=\"[\n 'mt-0.5 inline-flex h-4 w-4 shrink-0 box-border items-center justify-center rounded-sm border shadow-sm',\n checked\n ? 'border-primary bg-primary text-primary-foreground'\n : 'border-border bg-background text-transparent',\n ]\"\n aria-hidden=\"true\"\n >\n <svg\n viewBox=\"0 0 16 16\"\n class=\"h-3 w-3\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M3 8.5L6.4 12L13 4\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n ></path>\n </svg>\n </span>\n\n <span\n [ngClass]=\"[\n 'min-w-0 flex-1',\n hasDescription ? 'flex flex-col gap-2' : 'flex items-center',\n ]\"\n >\n <span class=\"text-sm font-medium text-foreground\">{{ label }}</span>\n <span *ngIf=\"hasDescription\" class=\"text-sm text-muted-foreground\">{{\n description\n }}</span>\n </span>\n</button>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1532
|
+
PdmCheckboxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmCheckboxComponent, selector: "pdm-checkbox", inputs: { id: "id", checked: "checked", disabled: "disabled", variant: "variant", label: "label", description: "description", className: "className" }, outputs: { checkedChange: "checkedChange" }, ngImport: i0, template: "<button\n type=\"button\"\n role=\"checkbox\"\n [attr.id]=\"id || null\"\n [attr.aria-checked]=\"checked\"\n [attr.aria-disabled]=\"disabled\"\n [disabled]=\"disabled\"\n [ngClass]=\"[\n 'w-full appearance-none box-border border-0 bg-transparent p-0 text-left outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background',\n variant === 'card'\n ? checked\n ? 'flex items-start gap-3 rounded-lg border border-solid border-primary bg-muted p-4'\n : 'flex items-start gap-3 rounded-lg border border-solid border-border bg-background p-4'\n : hasDescription\n ? 'flex items-start gap-3'\n : 'flex items-center gap-3',\n disabled ? 'opacity-50' : '',\n className,\n ]\"\n (click)=\"onToggle()\"\n>\n <span\n [ngClass]=\"[\n 'mt-0.5 inline-flex h-4 w-4 shrink-0 box-border items-center justify-center rounded-sm border border-solid shadow-sm',\n checked\n ? 'border-primary bg-primary text-primary-foreground'\n : 'border-border bg-background text-transparent',\n ]\"\n aria-hidden=\"true\"\n >\n <svg\n viewBox=\"0 0 16 16\"\n class=\"h-3 w-3\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M3 8.5L6.4 12L13 4\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n ></path>\n </svg>\n </span>\n\n <span\n [ngClass]=\"[\n 'min-w-0 flex-1',\n hasDescription ? 'flex flex-col gap-2' : 'flex items-center',\n ]\"\n >\n <span class=\"text-sm font-medium text-foreground\">{{ label }}</span>\n <span *ngIf=\"hasDescription\" class=\"text-sm text-muted-foreground\">{{\n description\n }}</span>\n </span>\n</button>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1513
1533
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmCheckboxComponent, decorators: [{
|
|
1514
1534
|
type: Component,
|
|
1515
|
-
args: [{ selector: 'pdm-checkbox', changeDetection: ChangeDetectionStrategy.OnPush, template: "<button\n type=\"button\"\n role=\"checkbox\"\n [attr.id]=\"id || null\"\n [attr.aria-checked]=\"checked\"\n [attr.aria-disabled]=\"disabled\"\n [disabled]=\"disabled\"\n [ngClass]=\"[\n 'w-full appearance-none box-border border-0 bg-transparent p-0 text-left outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background',\n variant === 'card'\n ? checked\n ? 'flex items-start gap-3 rounded-lg border border-primary bg-muted p-4'\n : 'flex items-start gap-3 rounded-lg border border-border bg-background p-4'\n : hasDescription\n ? 'flex items-start gap-3'\n : 'flex items-center gap-3',\n disabled ? 'opacity-50' : '',\n className,\n ]\"\n (click)=\"onToggle()\"\n>\n <span\n [ngClass]=\"[\n 'mt-0.5 inline-flex h-4 w-4 shrink-0 box-border items-center justify-center rounded-sm border shadow-sm',\n checked\n ? 'border-primary bg-primary text-primary-foreground'\n : 'border-border bg-background text-transparent',\n ]\"\n aria-hidden=\"true\"\n >\n <svg\n viewBox=\"0 0 16 16\"\n class=\"h-3 w-3\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M3 8.5L6.4 12L13 4\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n ></path>\n </svg>\n </span>\n\n <span\n [ngClass]=\"[\n 'min-w-0 flex-1',\n hasDescription ? 'flex flex-col gap-2' : 'flex items-center',\n ]\"\n >\n <span class=\"text-sm font-medium text-foreground\">{{ label }}</span>\n <span *ngIf=\"hasDescription\" class=\"text-sm text-muted-foreground\">{{\n description\n }}</span>\n </span>\n</button>\n" }]
|
|
1535
|
+
args: [{ selector: 'pdm-checkbox', changeDetection: ChangeDetectionStrategy.OnPush, template: "<button\n type=\"button\"\n role=\"checkbox\"\n [attr.id]=\"id || null\"\n [attr.aria-checked]=\"checked\"\n [attr.aria-disabled]=\"disabled\"\n [disabled]=\"disabled\"\n [ngClass]=\"[\n 'w-full appearance-none box-border border-0 bg-transparent p-0 text-left outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background',\n variant === 'card'\n ? checked\n ? 'flex items-start gap-3 rounded-lg border border-solid border-primary bg-muted p-4'\n : 'flex items-start gap-3 rounded-lg border border-solid border-border bg-background p-4'\n : hasDescription\n ? 'flex items-start gap-3'\n : 'flex items-center gap-3',\n disabled ? 'opacity-50' : '',\n className,\n ]\"\n (click)=\"onToggle()\"\n>\n <span\n [ngClass]=\"[\n 'mt-0.5 inline-flex h-4 w-4 shrink-0 box-border items-center justify-center rounded-sm border border-solid shadow-sm',\n checked\n ? 'border-primary bg-primary text-primary-foreground'\n : 'border-border bg-background text-transparent',\n ]\"\n aria-hidden=\"true\"\n >\n <svg\n viewBox=\"0 0 16 16\"\n class=\"h-3 w-3\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M3 8.5L6.4 12L13 4\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n ></path>\n </svg>\n </span>\n\n <span\n [ngClass]=\"[\n 'min-w-0 flex-1',\n hasDescription ? 'flex flex-col gap-2' : 'flex items-center',\n ]\"\n >\n <span class=\"text-sm font-medium text-foreground\">{{ label }}</span>\n <span *ngIf=\"hasDescription\" class=\"text-sm text-muted-foreground\">{{\n description\n }}</span>\n </span>\n</button>\n" }]
|
|
1516
1536
|
}], propDecorators: { id: [{
|
|
1517
1537
|
type: Input
|
|
1518
1538
|
}], checked: [{
|
|
@@ -1553,10 +1573,10 @@ class PdmCollapsibleComponent {
|
|
|
1553
1573
|
}
|
|
1554
1574
|
}
|
|
1555
1575
|
PdmCollapsibleComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmCollapsibleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1556
|
-
PdmCollapsibleComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmCollapsibleComponent, selector: "pdm-collapsible", inputs: { title: "title", open: "open", disabled: "disabled", items: "items", className: "className" }, outputs: { openChange: "openChange" }, ngImport: i0, template: "<div [ngClass]=\"['flex w-full max-w-sm flex-col gap-2', className]\">\n <button\n type=\"button\"\n [disabled]=\"disabled\"\n class=\"flex w-full appearance-none box-border items-center justify-between rounded-md border-0 bg-transparent px-4 py-2 text-left text-sm font-medium text-foreground hover:bg-accent ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2\"\n [attr.aria-expanded]=\"open\"\n (click)=\"toggle()\"\n >\n <span>{{ title }}</span>\n <span class=\"inline-flex h-8 w-8 items-center justify-center text-foreground\">\n <svg viewBox=\"0 0 24 24\" class=\"h-4 w-4\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M7 15L12 20L17 15\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path>\n <path d=\"M17 9L12 4L7 9\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path>\n </svg>\n </span>\n </button>\n\n <div class=\"flex w-full flex-col gap-2\">\n <div\n *ngFor=\"let item of visibleItems\"\n class=\"w-full rounded-md border border-border bg-background px-4 py-2\"\n >\n <span class=\"font-mono text-sm text-foreground\">{{ item }}</span>\n </div>\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1576
|
+
PdmCollapsibleComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmCollapsibleComponent, selector: "pdm-collapsible", inputs: { title: "title", open: "open", disabled: "disabled", items: "items", className: "className" }, outputs: { openChange: "openChange" }, ngImport: i0, template: "<div [ngClass]=\"['flex w-full max-w-sm flex-col gap-2', className]\">\n <button\n type=\"button\"\n [disabled]=\"disabled\"\n class=\"flex w-full appearance-none box-border items-center justify-between rounded-md border-0 bg-transparent px-4 py-2 text-left text-sm font-medium text-foreground hover:bg-accent ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2\"\n [attr.aria-expanded]=\"open\"\n (click)=\"toggle()\"\n >\n <span>{{ title }}</span>\n <span class=\"inline-flex h-8 w-8 items-center justify-center text-foreground\">\n <svg viewBox=\"0 0 24 24\" class=\"h-4 w-4\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M7 15L12 20L17 15\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path>\n <path d=\"M17 9L12 4L7 9\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path>\n </svg>\n </span>\n </button>\n\n <div class=\"flex w-full flex-col gap-2\">\n <div\n *ngFor=\"let item of visibleItems\"\n class=\"w-full rounded-md border border-solid border-border bg-background px-4 py-2\"\n >\n <span class=\"font-mono text-sm text-foreground\">{{ item }}</span>\n </div>\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1557
1577
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmCollapsibleComponent, decorators: [{
|
|
1558
1578
|
type: Component,
|
|
1559
|
-
args: [{ selector: 'pdm-collapsible', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [ngClass]=\"['flex w-full max-w-sm flex-col gap-2', className]\">\n <button\n type=\"button\"\n [disabled]=\"disabled\"\n class=\"flex w-full appearance-none box-border items-center justify-between rounded-md border-0 bg-transparent px-4 py-2 text-left text-sm font-medium text-foreground hover:bg-accent ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2\"\n [attr.aria-expanded]=\"open\"\n (click)=\"toggle()\"\n >\n <span>{{ title }}</span>\n <span class=\"inline-flex h-8 w-8 items-center justify-center text-foreground\">\n <svg viewBox=\"0 0 24 24\" class=\"h-4 w-4\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M7 15L12 20L17 15\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path>\n <path d=\"M17 9L12 4L7 9\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path>\n </svg>\n </span>\n </button>\n\n <div class=\"flex w-full flex-col gap-2\">\n <div\n *ngFor=\"let item of visibleItems\"\n class=\"w-full rounded-md border border-border bg-background px-4 py-2\"\n >\n <span class=\"font-mono text-sm text-foreground\">{{ item }}</span>\n </div>\n </div>\n</div>\n" }]
|
|
1579
|
+
args: [{ selector: 'pdm-collapsible', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [ngClass]=\"['flex w-full max-w-sm flex-col gap-2', className]\">\n <button\n type=\"button\"\n [disabled]=\"disabled\"\n class=\"flex w-full appearance-none box-border items-center justify-between rounded-md border-0 bg-transparent px-4 py-2 text-left text-sm font-medium text-foreground hover:bg-accent ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2\"\n [attr.aria-expanded]=\"open\"\n (click)=\"toggle()\"\n >\n <span>{{ title }}</span>\n <span class=\"inline-flex h-8 w-8 items-center justify-center text-foreground\">\n <svg viewBox=\"0 0 24 24\" class=\"h-4 w-4\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M7 15L12 20L17 15\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path>\n <path d=\"M17 9L12 4L7 9\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path>\n </svg>\n </span>\n </button>\n\n <div class=\"flex w-full flex-col gap-2\">\n <div\n *ngFor=\"let item of visibleItems\"\n class=\"w-full rounded-md border border-solid border-border bg-background px-4 py-2\"\n >\n <span class=\"font-mono text-sm text-foreground\">{{ item }}</span>\n </div>\n </div>\n</div>\n" }]
|
|
1560
1580
|
}], propDecorators: { title: [{
|
|
1561
1581
|
type: Input
|
|
1562
1582
|
}], open: [{
|
|
@@ -1767,10 +1787,10 @@ class PdmComboboxComponent {
|
|
|
1767
1787
|
}
|
|
1768
1788
|
}
|
|
1769
1789
|
PdmComboboxComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmComboboxComponent, deps: [{ token: i1$1.Overlay }, { token: i0.ViewContainerRef }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
1770
|
-
PdmComboboxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmComboboxComponent, selector: "pdm-combobox", inputs: { open: "open", placeholder: "placeholder", searchPlaceholder: "searchPlaceholder", className: "className", options: "options", value: "value", width: "width", panelClassName: "panelClassName" }, outputs: { openChange: "openChange", valueChange: "valueChange" }, host: { listeners: { "document:keydown.escape": "onEscape()" } }, viewQueries: [{ propertyName: "triggerRef", first: true, predicate: ["triggerEl"], descendants: true }, { propertyName: "panelTemplateRef", first: true, predicate: ["panelTemplate"], descendants: true }], ngImport: i0, template: "<div [ngClass]=\"['flex flex-col gap-1', className]\" [style.width.px]=\"width\">\n <button\n #triggerEl\n type=\"button\"\n class=\"flex h-9 w-full appearance-none box-border items-center justify-between gap-2 rounded-md border border-input bg-background px-3 py-2 text-sm shadow-sm\"\n [attr.aria-expanded]=\"open\"\n [attr.aria-haspopup]=\"'listbox'\"\n (click)=\"toggle()\"\n >\n <span\n class=\"min-w-0 flex-1 truncate text-left text-sm font-medium text-foreground\"\n >{{ selectedLabel }}</span\n >\n <svg\n viewBox=\"0 0 24 24\"\n class=\"h-4 w-4 text-foreground\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M7 15L12 20L17 15\"\n stroke=\"currentColor\"\n stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n ></path>\n <path\n d=\"M17 9L12 4L7 9\"\n stroke=\"currentColor\"\n stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n ></path>\n </svg>\n </button>\n\n <!-- Template for CDK Overlay -->\n <ng-template #panelTemplate>\n <div\n class=\"w-full rounded-md border border-border bg-popover p-0 text-popover-foreground shadow-md\"\n >\n <div class=\"flex items-center gap-2 border-b border-border px-3 py-2\">\n <svg\n viewBox=\"0 0 24 24\"\n class=\"h-4 w-4 text-muted-foreground\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <circle\n cx=\"11\"\n cy=\"11\"\n r=\"7\"\n stroke=\"currentColor\"\n stroke-width=\"1.5\"\n ></circle>\n <path\n d=\"M20 20L16.6 16.6\"\n stroke=\"currentColor\"\n stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n ></path>\n </svg>\n <div class=\"flex-1 py-2 text-sm text-muted-foreground\">\n {{ searchPlaceholder }}\n </div>\n </div>\n\n <div class=\"p-1\">\n <button\n *ngFor=\"let option of options\"\n type=\"button\"\n class=\"flex w-full appearance-none box-border items-center gap-2 rounded-sm border-0 bg-transparent px-2 py-1.5 text-left text-sm outline-none transition-colors hover:bg-accent hover:text-accent-foreground focus-visible:bg-accent focus-visible:text-accent-foreground\"\n [ngClass]=\"option === value ? 'bg-accent text-accent-foreground' : ''\"\n role=\"option\"\n [attr.aria-selected]=\"option === value\"\n (click)=\"select(option)\"\n >\n <span class=\"min-w-0 flex-1 truncate\">{{ option }}</span>\n <svg\n *ngIf=\"option === value\"\n viewBox=\"0 0 24 24\"\n class=\"h-4 w-4 text-foreground\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M5 12.5L9.2 16.7L19 7\"\n stroke=\"currentColor\"\n stroke-width=\"1.8\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n ></path>\n </svg>\n </button>\n </div>\n </div>\n </ng-template>\n</div>\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1790
|
+
PdmComboboxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmComboboxComponent, selector: "pdm-combobox", inputs: { open: "open", placeholder: "placeholder", searchPlaceholder: "searchPlaceholder", className: "className", options: "options", value: "value", width: "width", panelClassName: "panelClassName" }, outputs: { openChange: "openChange", valueChange: "valueChange" }, host: { listeners: { "document:keydown.escape": "onEscape()" } }, viewQueries: [{ propertyName: "triggerRef", first: true, predicate: ["triggerEl"], descendants: true }, { propertyName: "panelTemplateRef", first: true, predicate: ["panelTemplate"], descendants: true }], ngImport: i0, template: "<div [ngClass]=\"['flex flex-col gap-1', className]\" [style.width.px]=\"width\">\n <button\n #triggerEl\n type=\"button\"\n class=\"flex h-9 w-full appearance-none box-border items-center justify-between gap-2 rounded-md border border-solid border-input bg-background px-3 py-2 text-sm shadow-sm\"\n [attr.aria-expanded]=\"open\"\n [attr.aria-haspopup]=\"'listbox'\"\n (click)=\"toggle()\"\n >\n <span\n class=\"min-w-0 flex-1 truncate text-left text-sm font-medium text-foreground\"\n >{{ selectedLabel }}</span\n >\n <svg\n viewBox=\"0 0 24 24\"\n class=\"h-4 w-4 text-foreground\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M7 15L12 20L17 15\"\n stroke=\"currentColor\"\n stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n ></path>\n <path\n d=\"M17 9L12 4L7 9\"\n stroke=\"currentColor\"\n stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n ></path>\n </svg>\n </button>\n\n <!-- Template for CDK Overlay -->\n <ng-template #panelTemplate>\n <div\n class=\"w-full rounded-md border border-solid border-border bg-popover p-0 text-popover-foreground shadow-md\"\n >\n <div class=\"flex items-center gap-2 border-b border-border px-3 py-2\">\n <svg\n viewBox=\"0 0 24 24\"\n class=\"h-4 w-4 text-muted-foreground\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <circle\n cx=\"11\"\n cy=\"11\"\n r=\"7\"\n stroke=\"currentColor\"\n stroke-width=\"1.5\"\n ></circle>\n <path\n d=\"M20 20L16.6 16.6\"\n stroke=\"currentColor\"\n stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n ></path>\n </svg>\n <div class=\"flex-1 py-2 text-sm text-muted-foreground\">\n {{ searchPlaceholder }}\n </div>\n </div>\n\n <div class=\"p-1\">\n <button\n *ngFor=\"let option of options\"\n type=\"button\"\n class=\"flex w-full appearance-none box-border items-center gap-2 rounded-sm border-0 bg-transparent px-2 py-1.5 text-left text-sm outline-none transition-colors hover:bg-accent hover:text-accent-foreground focus-visible:bg-accent focus-visible:text-accent-foreground\"\n [ngClass]=\"option === value ? 'bg-accent text-accent-foreground' : ''\"\n role=\"option\"\n [attr.aria-selected]=\"option === value\"\n (click)=\"select(option)\"\n >\n <span class=\"min-w-0 flex-1 truncate\">{{ option }}</span>\n <svg\n *ngIf=\"option === value\"\n viewBox=\"0 0 24 24\"\n class=\"h-4 w-4 text-foreground\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M5 12.5L9.2 16.7L19 7\"\n stroke=\"currentColor\"\n stroke-width=\"1.8\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n ></path>\n </svg>\n </button>\n </div>\n </div>\n </ng-template>\n</div>\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1771
1791
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmComboboxComponent, decorators: [{
|
|
1772
1792
|
type: Component,
|
|
1773
|
-
args: [{ selector: "pdm-combobox", changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [ngClass]=\"['flex flex-col gap-1', className]\" [style.width.px]=\"width\">\n <button\n #triggerEl\n type=\"button\"\n class=\"flex h-9 w-full appearance-none box-border items-center justify-between gap-2 rounded-md border border-input bg-background px-3 py-2 text-sm shadow-sm\"\n [attr.aria-expanded]=\"open\"\n [attr.aria-haspopup]=\"'listbox'\"\n (click)=\"toggle()\"\n >\n <span\n class=\"min-w-0 flex-1 truncate text-left text-sm font-medium text-foreground\"\n >{{ selectedLabel }}</span\n >\n <svg\n viewBox=\"0 0 24 24\"\n class=\"h-4 w-4 text-foreground\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M7 15L12 20L17 15\"\n stroke=\"currentColor\"\n stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n ></path>\n <path\n d=\"M17 9L12 4L7 9\"\n stroke=\"currentColor\"\n stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n ></path>\n </svg>\n </button>\n\n <!-- Template for CDK Overlay -->\n <ng-template #panelTemplate>\n <div\n class=\"w-full rounded-md border border-border bg-popover p-0 text-popover-foreground shadow-md\"\n >\n <div class=\"flex items-center gap-2 border-b border-border px-3 py-2\">\n <svg\n viewBox=\"0 0 24 24\"\n class=\"h-4 w-4 text-muted-foreground\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <circle\n cx=\"11\"\n cy=\"11\"\n r=\"7\"\n stroke=\"currentColor\"\n stroke-width=\"1.5\"\n ></circle>\n <path\n d=\"M20 20L16.6 16.6\"\n stroke=\"currentColor\"\n stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n ></path>\n </svg>\n <div class=\"flex-1 py-2 text-sm text-muted-foreground\">\n {{ searchPlaceholder }}\n </div>\n </div>\n\n <div class=\"p-1\">\n <button\n *ngFor=\"let option of options\"\n type=\"button\"\n class=\"flex w-full appearance-none box-border items-center gap-2 rounded-sm border-0 bg-transparent px-2 py-1.5 text-left text-sm outline-none transition-colors hover:bg-accent hover:text-accent-foreground focus-visible:bg-accent focus-visible:text-accent-foreground\"\n [ngClass]=\"option === value ? 'bg-accent text-accent-foreground' : ''\"\n role=\"option\"\n [attr.aria-selected]=\"option === value\"\n (click)=\"select(option)\"\n >\n <span class=\"min-w-0 flex-1 truncate\">{{ option }}</span>\n <svg\n *ngIf=\"option === value\"\n viewBox=\"0 0 24 24\"\n class=\"h-4 w-4 text-foreground\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M5 12.5L9.2 16.7L19 7\"\n stroke=\"currentColor\"\n stroke-width=\"1.8\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n ></path>\n </svg>\n </button>\n </div>\n </div>\n </ng-template>\n</div>\n", styles: [":host{display:block}\n"] }]
|
|
1793
|
+
args: [{ selector: "pdm-combobox", changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [ngClass]=\"['flex flex-col gap-1', className]\" [style.width.px]=\"width\">\n <button\n #triggerEl\n type=\"button\"\n class=\"flex h-9 w-full appearance-none box-border items-center justify-between gap-2 rounded-md border border-solid border-input bg-background px-3 py-2 text-sm shadow-sm\"\n [attr.aria-expanded]=\"open\"\n [attr.aria-haspopup]=\"'listbox'\"\n (click)=\"toggle()\"\n >\n <span\n class=\"min-w-0 flex-1 truncate text-left text-sm font-medium text-foreground\"\n >{{ selectedLabel }}</span\n >\n <svg\n viewBox=\"0 0 24 24\"\n class=\"h-4 w-4 text-foreground\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M7 15L12 20L17 15\"\n stroke=\"currentColor\"\n stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n ></path>\n <path\n d=\"M17 9L12 4L7 9\"\n stroke=\"currentColor\"\n stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n ></path>\n </svg>\n </button>\n\n <!-- Template for CDK Overlay -->\n <ng-template #panelTemplate>\n <div\n class=\"w-full rounded-md border border-solid border-border bg-popover p-0 text-popover-foreground shadow-md\"\n >\n <div class=\"flex items-center gap-2 border-b border-border px-3 py-2\">\n <svg\n viewBox=\"0 0 24 24\"\n class=\"h-4 w-4 text-muted-foreground\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <circle\n cx=\"11\"\n cy=\"11\"\n r=\"7\"\n stroke=\"currentColor\"\n stroke-width=\"1.5\"\n ></circle>\n <path\n d=\"M20 20L16.6 16.6\"\n stroke=\"currentColor\"\n stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n ></path>\n </svg>\n <div class=\"flex-1 py-2 text-sm text-muted-foreground\">\n {{ searchPlaceholder }}\n </div>\n </div>\n\n <div class=\"p-1\">\n <button\n *ngFor=\"let option of options\"\n type=\"button\"\n class=\"flex w-full appearance-none box-border items-center gap-2 rounded-sm border-0 bg-transparent px-2 py-1.5 text-left text-sm outline-none transition-colors hover:bg-accent hover:text-accent-foreground focus-visible:bg-accent focus-visible:text-accent-foreground\"\n [ngClass]=\"option === value ? 'bg-accent text-accent-foreground' : ''\"\n role=\"option\"\n [attr.aria-selected]=\"option === value\"\n (click)=\"select(option)\"\n >\n <span class=\"min-w-0 flex-1 truncate\">{{ option }}</span>\n <svg\n *ngIf=\"option === value\"\n viewBox=\"0 0 24 24\"\n class=\"h-4 w-4 text-foreground\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M5 12.5L9.2 16.7L19 7\"\n stroke=\"currentColor\"\n stroke-width=\"1.8\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n ></path>\n </svg>\n </button>\n </div>\n </div>\n </ng-template>\n</div>\n", styles: [":host{display:block}\n"] }]
|
|
1774
1794
|
}], ctorParameters: function () { return [{ type: i1$1.Overlay }, { type: i0.ViewContainerRef }, { type: i0.ElementRef }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { open: [{
|
|
1775
1795
|
type: Input
|
|
1776
1796
|
}], placeholder: [{
|
|
@@ -1992,10 +2012,10 @@ class PdmCommandComponent {
|
|
|
1992
2012
|
}
|
|
1993
2013
|
}
|
|
1994
2014
|
PdmCommandComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmCommandComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1995
|
-
PdmCommandComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmCommandComponent, selector: "pdm-command", inputs: { open: "open", hintLabel: "hintLabel", hintKey: "hintKey", placeholder: "placeholder", emptyMessage: "emptyMessage", items: "items", className: "className" }, outputs: { itemSelect: "itemSelect", openChange: "openChange" }, ngImport: i0, template: "<div [ngClass]=\"['w-full', className]\">\n <div *ngIf=\"!open\" class=\"flex items-center gap-1\">\n <span class=\"text-sm font-medium text-muted-foreground\">{{\n hintLabel\n }}</span>\n <button\n type=\"button\"\n class=\"inline-flex h-5 appearance-none box-border items-center gap-0.5 rounded-sm border border-border bg-muted px-1.5\"\n (click)=\"toggleOpen()\"\n >\n <pdm-icon\n name=\"command\"\n [size]=\"12\"\n className=\"text-muted-foreground\"\n [decorative]=\"true\"\n ></pdm-icon>\n <span class=\"text-xs text-muted-foreground\">{{ hintKey }}</span>\n </button>\n </div>\n\n <section\n *ngIf=\"open\"\n class=\"flex w-full flex-col overflow-hidden rounded-lg border border-border bg-popover text-popover-foreground shadow-md\"\n >\n <div class=\"flex items-center gap-2 border-b border-border px-3\">\n <pdm-icon\n name=\"search\"\n [size]=\"16\"\n className=\"text-muted-foreground\"\n [decorative]=\"true\"\n ></pdm-icon>\n <input\n type=\"text\"\n [placeholder]=\"placeholder\"\n [value]=\"query\"\n (input)=\"onQueryChange($event)\"\n class=\"h-10 w-full appearance-none box-border bg-transparent py-3 text-sm text-foreground outline-none placeholder:text-muted-foreground\"\n />\n </div>\n\n <div class=\"max-h-[50vh] overflow-y-auto p-1 md:max-h-72\">\n <ng-container *ngFor=\"let group of groupedItems; let groupIndex = index\">\n <div\n *ngIf=\"group.name\"\n class=\"px-2 py-1.5 text-xs text-muted-foreground\"\n >\n {{ group.name }}\n </div>\n <button\n *ngFor=\"let item of group.items\"\n type=\"button\"\n [disabled]=\"item.disabled\"\n class=\"flex w-full appearance-none box-border items-center gap-2 rounded-sm border-0 bg-transparent px-2 py-1.5 text-left text-sm outline-none transition-colors hover:bg-accent hover:text-accent-foreground focus-visible:bg-accent focus-visible:text-accent-foreground\"\n [ngClass]=\"[\n item.disabled ? 'opacity-50' : '',\n item.label === 'Calendar' ? 'bg-accent text-accent-foreground' : '',\n ]\"\n (click)=\"select(item.value)\"\n >\n <span\n class=\"inline-flex h-4 w-4 items-center justify-center text-foreground\"\n >\n <pdm-icon\n *ngIf=\"item.icon\"\n [name]=\"item.icon\"\n [size]=\"16\"\n [decorative]=\"true\"\n ></pdm-icon>\n </span>\n <span class=\"min-w-0 flex-1 text-foreground\">{{ item.label }}</span>\n <span *ngIf=\"item.shortcut\" class=\"text-xs text-muted-foreground\">{{\n item.shortcut\n }}</span>\n </button>\n <div\n *ngIf=\"groupIndex === 0 && groupedItems.length > 1\"\n class=\"my-1 border-t border-border\"\n ></div>\n </ng-container>\n\n <p\n *ngIf=\"filteredItems.length === 0\"\n class=\"m-0 py-6 text-center text-sm text-muted-foreground\"\n >\n {{ emptyMessage }}\n </p>\n </div>\n </section>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: PdmIconComponent, selector: "pdm-icon", inputs: ["name", "library", "assetUrl", "size", "strokeWidth", "className", "ariaLabel", "decorative"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2015
|
+
PdmCommandComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmCommandComponent, selector: "pdm-command", inputs: { open: "open", hintLabel: "hintLabel", hintKey: "hintKey", placeholder: "placeholder", emptyMessage: "emptyMessage", items: "items", className: "className" }, outputs: { itemSelect: "itemSelect", openChange: "openChange" }, ngImport: i0, template: "<div [ngClass]=\"['w-full', className]\">\n <div *ngIf=\"!open\" class=\"flex items-center gap-1\">\n <span class=\"text-sm font-medium text-muted-foreground\">{{\n hintLabel\n }}</span>\n <button\n type=\"button\"\n class=\"inline-flex h-5 appearance-none box-border items-center gap-0.5 rounded-sm border border-solid border-border bg-muted px-1.5\"\n (click)=\"toggleOpen()\"\n >\n <pdm-icon\n name=\"command\"\n [size]=\"12\"\n className=\"text-muted-foreground\"\n [decorative]=\"true\"\n ></pdm-icon>\n <span class=\"text-xs text-muted-foreground\">{{ hintKey }}</span>\n </button>\n </div>\n\n <section\n *ngIf=\"open\"\n class=\"flex w-full flex-col overflow-hidden rounded-lg border border-solid border-border bg-popover text-popover-foreground shadow-md\"\n >\n <div class=\"flex items-center gap-2 border-b border-border px-3\">\n <pdm-icon\n name=\"search\"\n [size]=\"16\"\n className=\"text-muted-foreground\"\n [decorative]=\"true\"\n ></pdm-icon>\n <input\n type=\"text\"\n [placeholder]=\"placeholder\"\n [value]=\"query\"\n (input)=\"onQueryChange($event)\"\n class=\"h-10 w-full appearance-none box-border bg-transparent py-3 text-sm text-foreground outline-none placeholder:text-muted-foreground\"\n />\n </div>\n\n <div class=\"max-h-[50vh] overflow-y-auto p-1 md:max-h-72\">\n <ng-container *ngFor=\"let group of groupedItems; let groupIndex = index\">\n <div\n *ngIf=\"group.name\"\n class=\"px-2 py-1.5 text-xs text-muted-foreground\"\n >\n {{ group.name }}\n </div>\n <button\n *ngFor=\"let item of group.items\"\n type=\"button\"\n [disabled]=\"item.disabled\"\n class=\"flex w-full appearance-none box-border items-center gap-2 rounded-sm border-0 bg-transparent px-2 py-1.5 text-left text-sm outline-none transition-colors hover:bg-accent hover:text-accent-foreground focus-visible:bg-accent focus-visible:text-accent-foreground\"\n [ngClass]=\"[\n item.disabled ? 'opacity-50' : '',\n item.label === 'Calendar' ? 'bg-accent text-accent-foreground' : '',\n ]\"\n (click)=\"select(item.value)\"\n >\n <span\n class=\"inline-flex h-4 w-4 items-center justify-center text-foreground\"\n >\n <pdm-icon\n *ngIf=\"item.icon\"\n [name]=\"item.icon\"\n [size]=\"16\"\n [decorative]=\"true\"\n ></pdm-icon>\n </span>\n <span class=\"min-w-0 flex-1 text-foreground\">{{ item.label }}</span>\n <span *ngIf=\"item.shortcut\" class=\"text-xs text-muted-foreground\">{{\n item.shortcut\n }}</span>\n </button>\n <div\n *ngIf=\"groupIndex === 0 && groupedItems.length > 1\"\n class=\"my-1 border-t border-border\"\n ></div>\n </ng-container>\n\n <p\n *ngIf=\"filteredItems.length === 0\"\n class=\"m-0 py-6 text-center text-sm text-muted-foreground\"\n >\n {{ emptyMessage }}\n </p>\n </div>\n </section>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: PdmIconComponent, selector: "pdm-icon", inputs: ["name", "library", "assetUrl", "size", "strokeWidth", "className", "ariaLabel", "decorative"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1996
2016
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmCommandComponent, decorators: [{
|
|
1997
2017
|
type: Component,
|
|
1998
|
-
args: [{ selector: 'pdm-command', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [ngClass]=\"['w-full', className]\">\n <div *ngIf=\"!open\" class=\"flex items-center gap-1\">\n <span class=\"text-sm font-medium text-muted-foreground\">{{\n hintLabel\n }}</span>\n <button\n type=\"button\"\n class=\"inline-flex h-5 appearance-none box-border items-center gap-0.5 rounded-sm border border-border bg-muted px-1.5\"\n (click)=\"toggleOpen()\"\n >\n <pdm-icon\n name=\"command\"\n [size]=\"12\"\n className=\"text-muted-foreground\"\n [decorative]=\"true\"\n ></pdm-icon>\n <span class=\"text-xs text-muted-foreground\">{{ hintKey }}</span>\n </button>\n </div>\n\n <section\n *ngIf=\"open\"\n class=\"flex w-full flex-col overflow-hidden rounded-lg border border-border bg-popover text-popover-foreground shadow-md\"\n >\n <div class=\"flex items-center gap-2 border-b border-border px-3\">\n <pdm-icon\n name=\"search\"\n [size]=\"16\"\n className=\"text-muted-foreground\"\n [decorative]=\"true\"\n ></pdm-icon>\n <input\n type=\"text\"\n [placeholder]=\"placeholder\"\n [value]=\"query\"\n (input)=\"onQueryChange($event)\"\n class=\"h-10 w-full appearance-none box-border bg-transparent py-3 text-sm text-foreground outline-none placeholder:text-muted-foreground\"\n />\n </div>\n\n <div class=\"max-h-[50vh] overflow-y-auto p-1 md:max-h-72\">\n <ng-container *ngFor=\"let group of groupedItems; let groupIndex = index\">\n <div\n *ngIf=\"group.name\"\n class=\"px-2 py-1.5 text-xs text-muted-foreground\"\n >\n {{ group.name }}\n </div>\n <button\n *ngFor=\"let item of group.items\"\n type=\"button\"\n [disabled]=\"item.disabled\"\n class=\"flex w-full appearance-none box-border items-center gap-2 rounded-sm border-0 bg-transparent px-2 py-1.5 text-left text-sm outline-none transition-colors hover:bg-accent hover:text-accent-foreground focus-visible:bg-accent focus-visible:text-accent-foreground\"\n [ngClass]=\"[\n item.disabled ? 'opacity-50' : '',\n item.label === 'Calendar' ? 'bg-accent text-accent-foreground' : '',\n ]\"\n (click)=\"select(item.value)\"\n >\n <span\n class=\"inline-flex h-4 w-4 items-center justify-center text-foreground\"\n >\n <pdm-icon\n *ngIf=\"item.icon\"\n [name]=\"item.icon\"\n [size]=\"16\"\n [decorative]=\"true\"\n ></pdm-icon>\n </span>\n <span class=\"min-w-0 flex-1 text-foreground\">{{ item.label }}</span>\n <span *ngIf=\"item.shortcut\" class=\"text-xs text-muted-foreground\">{{\n item.shortcut\n }}</span>\n </button>\n <div\n *ngIf=\"groupIndex === 0 && groupedItems.length > 1\"\n class=\"my-1 border-t border-border\"\n ></div>\n </ng-container>\n\n <p\n *ngIf=\"filteredItems.length === 0\"\n class=\"m-0 py-6 text-center text-sm text-muted-foreground\"\n >\n {{ emptyMessage }}\n </p>\n </div>\n </section>\n</div>\n" }]
|
|
2018
|
+
args: [{ selector: 'pdm-command', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [ngClass]=\"['w-full', className]\">\n <div *ngIf=\"!open\" class=\"flex items-center gap-1\">\n <span class=\"text-sm font-medium text-muted-foreground\">{{\n hintLabel\n }}</span>\n <button\n type=\"button\"\n class=\"inline-flex h-5 appearance-none box-border items-center gap-0.5 rounded-sm border border-solid border-border bg-muted px-1.5\"\n (click)=\"toggleOpen()\"\n >\n <pdm-icon\n name=\"command\"\n [size]=\"12\"\n className=\"text-muted-foreground\"\n [decorative]=\"true\"\n ></pdm-icon>\n <span class=\"text-xs text-muted-foreground\">{{ hintKey }}</span>\n </button>\n </div>\n\n <section\n *ngIf=\"open\"\n class=\"flex w-full flex-col overflow-hidden rounded-lg border border-solid border-border bg-popover text-popover-foreground shadow-md\"\n >\n <div class=\"flex items-center gap-2 border-b border-border px-3\">\n <pdm-icon\n name=\"search\"\n [size]=\"16\"\n className=\"text-muted-foreground\"\n [decorative]=\"true\"\n ></pdm-icon>\n <input\n type=\"text\"\n [placeholder]=\"placeholder\"\n [value]=\"query\"\n (input)=\"onQueryChange($event)\"\n class=\"h-10 w-full appearance-none box-border bg-transparent py-3 text-sm text-foreground outline-none placeholder:text-muted-foreground\"\n />\n </div>\n\n <div class=\"max-h-[50vh] overflow-y-auto p-1 md:max-h-72\">\n <ng-container *ngFor=\"let group of groupedItems; let groupIndex = index\">\n <div\n *ngIf=\"group.name\"\n class=\"px-2 py-1.5 text-xs text-muted-foreground\"\n >\n {{ group.name }}\n </div>\n <button\n *ngFor=\"let item of group.items\"\n type=\"button\"\n [disabled]=\"item.disabled\"\n class=\"flex w-full appearance-none box-border items-center gap-2 rounded-sm border-0 bg-transparent px-2 py-1.5 text-left text-sm outline-none transition-colors hover:bg-accent hover:text-accent-foreground focus-visible:bg-accent focus-visible:text-accent-foreground\"\n [ngClass]=\"[\n item.disabled ? 'opacity-50' : '',\n item.label === 'Calendar' ? 'bg-accent text-accent-foreground' : '',\n ]\"\n (click)=\"select(item.value)\"\n >\n <span\n class=\"inline-flex h-4 w-4 items-center justify-center text-foreground\"\n >\n <pdm-icon\n *ngIf=\"item.icon\"\n [name]=\"item.icon\"\n [size]=\"16\"\n [decorative]=\"true\"\n ></pdm-icon>\n </span>\n <span class=\"min-w-0 flex-1 text-foreground\">{{ item.label }}</span>\n <span *ngIf=\"item.shortcut\" class=\"text-xs text-muted-foreground\">{{\n item.shortcut\n }}</span>\n </button>\n <div\n *ngIf=\"groupIndex === 0 && groupedItems.length > 1\"\n class=\"my-1 border-t border-border\"\n ></div>\n </ng-container>\n\n <p\n *ngIf=\"filteredItems.length === 0\"\n class=\"m-0 py-6 text-center text-sm text-muted-foreground\"\n >\n {{ emptyMessage }}\n </p>\n </div>\n </section>\n</div>\n" }]
|
|
1999
2019
|
}], propDecorators: { open: [{
|
|
2000
2020
|
type: Input
|
|
2001
2021
|
}], hintLabel: [{
|
|
@@ -2146,10 +2166,10 @@ class PdmContextMenuComponent {
|
|
|
2146
2166
|
}
|
|
2147
2167
|
}
|
|
2148
2168
|
PdmContextMenuComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmContextMenuComponent, deps: [{ token: i1$1.Overlay }, { token: i0.ViewContainerRef }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
2149
|
-
PdmContextMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmContextMenuComponent, selector: "pdm-context-menu", inputs: { items: "items", className: "className", triggerLabel: "triggerLabel", width: "width", height: "height", panelClassName: "panelClassName" }, outputs: { itemSelect: "itemSelect" }, host: { listeners: { "document:keydown.escape": "onDocumentClick()", "document:click": "onDocumentClick()" } }, viewQueries: [{ propertyName: "menuTemplateRef", first: true, predicate: ["menuTemplate"], descendants: true }], ngImport: i0, template: "<div\n class=\"relative\"\n [ngClass]=\"className\"\n (contextmenu)=\"onContextMenu($event)\"\n>\n <div\n class=\"flex items-center justify-center rounded-md border border-dashed border-border\"\n [style.width.px]=\"width\"\n [style.height.px]=\"height\"\n >\n <span class=\"text-sm font-medium text-foreground\">{{ triggerLabel }}</span>\n </div>\n\n <!-- Template for CDK Overlay -->\n <ng-template #menuTemplate>\n <div\n class=\"min-w-48 max-w-xs rounded-md border border-border bg-popover p-1 text-popover-foreground shadow-md sm:min-w-52\"\n >\n <div>\n <ng-container *ngFor=\"let item of items\">\n <div\n *ngIf=\"item.type === 'separator'\"\n class=\"-mx-1 my-1 h-px bg-muted\"\n ></div>\n\n <div\n *ngIf=\"item.type === 'label'\"\n class=\"px-2 py-1.5 text-sm font-semibold text-foreground\"\n >\n {{ item.label }}\n </div>\n\n <button\n *ngIf=\"!item.type || item.type === 'item'\"\n type=\"button\"\n [disabled]=\"item.disabled\"\n class=\"relative flex w-full appearance-none box-border cursor-default select-none items-center rounded-sm border-0 bg-transparent py-1.5 pr-2 text-left text-sm outline-none transition-colors hover:bg-accent hover:text-accent-foreground focus-visible:bg-accent focus-visible:text-accent-foreground disabled:pointer-events-none disabled:opacity-50\"\n [ngClass]=\"item.inset ? 'pl-8' : 'px-2'\"\n (click)=\"select(item)\"\n >\n <span\n class=\"mr-2 inline-flex w-4 shrink-0 items-center justify-center text-foreground\"\n >\n <svg\n *ngIf=\"item.checked\"\n viewBox=\"0 0 24 24\"\n class=\"h-3.5 w-3.5\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M5 12.5L9.2 16.7L19 7\"\n stroke=\"currentColor\"\n stroke-width=\"1.8\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n ></path>\n </svg>\n <span\n *ngIf=\"item.selectedDot\"\n class=\"h-2 w-2 rounded-full bg-foreground\"\n ></span>\n </span>\n <span class=\"min-w-0 flex-1 truncate text-foreground\">{{\n item.label\n }}</span>\n <span *ngIf=\"item.shortcut\" class=\"text-xs text-muted-foreground\">{{\n item.shortcut\n }}</span>\n <svg\n *ngIf=\"item.showChevron\"\n viewBox=\"0 0 24 24\"\n class=\"h-3.5 w-3.5 text-muted-foreground\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M9 6L15 12L9 18\"\n stroke=\"currentColor\"\n stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n ></path>\n </svg>\n </button>\n </ng-container>\n </div>\n </div>\n </ng-template>\n</div>\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2169
|
+
PdmContextMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmContextMenuComponent, selector: "pdm-context-menu", inputs: { items: "items", className: "className", triggerLabel: "triggerLabel", width: "width", height: "height", panelClassName: "panelClassName" }, outputs: { itemSelect: "itemSelect" }, host: { listeners: { "document:keydown.escape": "onDocumentClick()", "document:click": "onDocumentClick()" } }, viewQueries: [{ propertyName: "menuTemplateRef", first: true, predicate: ["menuTemplate"], descendants: true }], ngImport: i0, template: "<div\n class=\"relative\"\n [ngClass]=\"className\"\n (contextmenu)=\"onContextMenu($event)\"\n>\n <div\n class=\"flex items-center justify-center rounded-md border border-solid border-dashed border-border\"\n [style.width.px]=\"width\"\n [style.height.px]=\"height\"\n >\n <span class=\"text-sm font-medium text-foreground\">{{ triggerLabel }}</span>\n </div>\n\n <!-- Template for CDK Overlay -->\n <ng-template #menuTemplate>\n <div\n class=\"min-w-48 max-w-xs rounded-md border border-solid border-border bg-popover p-1 text-popover-foreground shadow-md sm:min-w-52\"\n >\n <div>\n <ng-container *ngFor=\"let item of items\">\n <div\n *ngIf=\"item.type === 'separator'\"\n class=\"-mx-1 my-1 h-px bg-muted\"\n ></div>\n\n <div\n *ngIf=\"item.type === 'label'\"\n class=\"px-2 py-1.5 text-sm font-semibold text-foreground\"\n >\n {{ item.label }}\n </div>\n\n <button\n *ngIf=\"!item.type || item.type === 'item'\"\n type=\"button\"\n [disabled]=\"item.disabled\"\n class=\"relative flex w-full appearance-none box-border cursor-default select-none items-center rounded-sm border-0 bg-transparent py-1.5 pr-2 text-left text-sm outline-none transition-colors hover:bg-accent hover:text-accent-foreground focus-visible:bg-accent focus-visible:text-accent-foreground disabled:pointer-events-none disabled:opacity-50\"\n [ngClass]=\"item.inset ? 'pl-8' : 'px-2'\"\n (click)=\"select(item)\"\n >\n <span\n class=\"mr-2 inline-flex w-4 shrink-0 items-center justify-center text-foreground\"\n >\n <svg\n *ngIf=\"item.checked\"\n viewBox=\"0 0 24 24\"\n class=\"h-3.5 w-3.5\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M5 12.5L9.2 16.7L19 7\"\n stroke=\"currentColor\"\n stroke-width=\"1.8\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n ></path>\n </svg>\n <span\n *ngIf=\"item.selectedDot\"\n class=\"h-2 w-2 rounded-full bg-foreground\"\n ></span>\n </span>\n <span class=\"min-w-0 flex-1 truncate text-foreground\">{{\n item.label\n }}</span>\n <span *ngIf=\"item.shortcut\" class=\"text-xs text-muted-foreground\">{{\n item.shortcut\n }}</span>\n <svg\n *ngIf=\"item.showChevron\"\n viewBox=\"0 0 24 24\"\n class=\"h-3.5 w-3.5 text-muted-foreground\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M9 6L15 12L9 18\"\n stroke=\"currentColor\"\n stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n ></path>\n </svg>\n </button>\n </ng-container>\n </div>\n </div>\n </ng-template>\n</div>\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2150
2170
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmContextMenuComponent, decorators: [{
|
|
2151
2171
|
type: Component,
|
|
2152
|
-
args: [{ selector: "pdm-context-menu", changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n class=\"relative\"\n [ngClass]=\"className\"\n (contextmenu)=\"onContextMenu($event)\"\n>\n <div\n class=\"flex items-center justify-center rounded-md border border-dashed border-border\"\n [style.width.px]=\"width\"\n [style.height.px]=\"height\"\n >\n <span class=\"text-sm font-medium text-foreground\">{{ triggerLabel }}</span>\n </div>\n\n <!-- Template for CDK Overlay -->\n <ng-template #menuTemplate>\n <div\n class=\"min-w-48 max-w-xs rounded-md border border-border bg-popover p-1 text-popover-foreground shadow-md sm:min-w-52\"\n >\n <div>\n <ng-container *ngFor=\"let item of items\">\n <div\n *ngIf=\"item.type === 'separator'\"\n class=\"-mx-1 my-1 h-px bg-muted\"\n ></div>\n\n <div\n *ngIf=\"item.type === 'label'\"\n class=\"px-2 py-1.5 text-sm font-semibold text-foreground\"\n >\n {{ item.label }}\n </div>\n\n <button\n *ngIf=\"!item.type || item.type === 'item'\"\n type=\"button\"\n [disabled]=\"item.disabled\"\n class=\"relative flex w-full appearance-none box-border cursor-default select-none items-center rounded-sm border-0 bg-transparent py-1.5 pr-2 text-left text-sm outline-none transition-colors hover:bg-accent hover:text-accent-foreground focus-visible:bg-accent focus-visible:text-accent-foreground disabled:pointer-events-none disabled:opacity-50\"\n [ngClass]=\"item.inset ? 'pl-8' : 'px-2'\"\n (click)=\"select(item)\"\n >\n <span\n class=\"mr-2 inline-flex w-4 shrink-0 items-center justify-center text-foreground\"\n >\n <svg\n *ngIf=\"item.checked\"\n viewBox=\"0 0 24 24\"\n class=\"h-3.5 w-3.5\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M5 12.5L9.2 16.7L19 7\"\n stroke=\"currentColor\"\n stroke-width=\"1.8\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n ></path>\n </svg>\n <span\n *ngIf=\"item.selectedDot\"\n class=\"h-2 w-2 rounded-full bg-foreground\"\n ></span>\n </span>\n <span class=\"min-w-0 flex-1 truncate text-foreground\">{{\n item.label\n }}</span>\n <span *ngIf=\"item.shortcut\" class=\"text-xs text-muted-foreground\">{{\n item.shortcut\n }}</span>\n <svg\n *ngIf=\"item.showChevron\"\n viewBox=\"0 0 24 24\"\n class=\"h-3.5 w-3.5 text-muted-foreground\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M9 6L15 12L9 18\"\n stroke=\"currentColor\"\n stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n ></path>\n </svg>\n </button>\n </ng-container>\n </div>\n </div>\n </ng-template>\n</div>\n", styles: [":host{display:block}\n"] }]
|
|
2172
|
+
args: [{ selector: "pdm-context-menu", changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n class=\"relative\"\n [ngClass]=\"className\"\n (contextmenu)=\"onContextMenu($event)\"\n>\n <div\n class=\"flex items-center justify-center rounded-md border border-solid border-dashed border-border\"\n [style.width.px]=\"width\"\n [style.height.px]=\"height\"\n >\n <span class=\"text-sm font-medium text-foreground\">{{ triggerLabel }}</span>\n </div>\n\n <!-- Template for CDK Overlay -->\n <ng-template #menuTemplate>\n <div\n class=\"min-w-48 max-w-xs rounded-md border border-solid border-border bg-popover p-1 text-popover-foreground shadow-md sm:min-w-52\"\n >\n <div>\n <ng-container *ngFor=\"let item of items\">\n <div\n *ngIf=\"item.type === 'separator'\"\n class=\"-mx-1 my-1 h-px bg-muted\"\n ></div>\n\n <div\n *ngIf=\"item.type === 'label'\"\n class=\"px-2 py-1.5 text-sm font-semibold text-foreground\"\n >\n {{ item.label }}\n </div>\n\n <button\n *ngIf=\"!item.type || item.type === 'item'\"\n type=\"button\"\n [disabled]=\"item.disabled\"\n class=\"relative flex w-full appearance-none box-border cursor-default select-none items-center rounded-sm border-0 bg-transparent py-1.5 pr-2 text-left text-sm outline-none transition-colors hover:bg-accent hover:text-accent-foreground focus-visible:bg-accent focus-visible:text-accent-foreground disabled:pointer-events-none disabled:opacity-50\"\n [ngClass]=\"item.inset ? 'pl-8' : 'px-2'\"\n (click)=\"select(item)\"\n >\n <span\n class=\"mr-2 inline-flex w-4 shrink-0 items-center justify-center text-foreground\"\n >\n <svg\n *ngIf=\"item.checked\"\n viewBox=\"0 0 24 24\"\n class=\"h-3.5 w-3.5\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M5 12.5L9.2 16.7L19 7\"\n stroke=\"currentColor\"\n stroke-width=\"1.8\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n ></path>\n </svg>\n <span\n *ngIf=\"item.selectedDot\"\n class=\"h-2 w-2 rounded-full bg-foreground\"\n ></span>\n </span>\n <span class=\"min-w-0 flex-1 truncate text-foreground\">{{\n item.label\n }}</span>\n <span *ngIf=\"item.shortcut\" class=\"text-xs text-muted-foreground\">{{\n item.shortcut\n }}</span>\n <svg\n *ngIf=\"item.showChevron\"\n viewBox=\"0 0 24 24\"\n class=\"h-3.5 w-3.5 text-muted-foreground\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M9 6L15 12L9 18\"\n stroke=\"currentColor\"\n stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n ></path>\n </svg>\n </button>\n </ng-container>\n </div>\n </div>\n </ng-template>\n</div>\n", styles: [":host{display:block}\n"] }]
|
|
2153
2173
|
}], ctorParameters: function () { return [{ type: i1$1.Overlay }, { type: i0.ViewContainerRef }, { type: i0.ElementRef }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { items: [{
|
|
2154
2174
|
type: Input
|
|
2155
2175
|
}], className: [{
|
|
@@ -2403,10 +2423,10 @@ class PdmTableComponent {
|
|
|
2403
2423
|
}
|
|
2404
2424
|
getVariantWrapperClasses() {
|
|
2405
2425
|
if (this.variant === "interactive") {
|
|
2406
|
-
return ["rounded-xl", "border", "border-border", "bg-background"];
|
|
2426
|
+
return ["rounded-xl", "border border-solid", "border-border", "bg-background"];
|
|
2407
2427
|
}
|
|
2408
2428
|
if (this.variant === "data") {
|
|
2409
|
-
return ["rounded-md", "border", "border-border", "bg-background"];
|
|
2429
|
+
return ["rounded-md", "border border-solid", "border-border", "bg-background"];
|
|
2410
2430
|
}
|
|
2411
2431
|
return [];
|
|
2412
2432
|
}
|
|
@@ -2731,10 +2751,10 @@ class PdmDataTableComponent {
|
|
|
2731
2751
|
}
|
|
2732
2752
|
}
|
|
2733
2753
|
PdmDataTableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmDataTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2734
|
-
PdmDataTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmDataTableComponent, selector: "pdm-data-table", inputs: { className: "className", columns: "columns", responsiveStrategy: "responsiveStrategy", selectable: "selectable", showActions: "showActions", showFilter: "showFilter", showPagination: "showPagination", showColumnSelector: "showColumnSelector", filterPlaceholder: "filterPlaceholder", columnsLabel: "columnsLabel", previousLabel: "previousLabel", nextLabel: "nextLabel", emptyLabel: "emptyLabel", rowsSelectedLabel: "rowsSelectedLabel", statusLabel: "statusLabel", emailLabel: "emailLabel", amountLabel: "amountLabel", rows: "rows", page: "page", pageSize: "pageSize", query: "query", filterFn: "filterFn" }, outputs: { queryChange: "queryChange", rowAction: "rowAction", pageChange: "pageChange", selectionChange: "selectionChange", columnSort: "columnSort" }, ngImport: i0, template: "<section [ngClass]=\"['flex w-full flex-col', className]\">\n <!-- Toolbar: Filtro + Selector de columnas -->\n <div\n *ngIf=\"showFilter || showColumnSelector\"\n class=\"flex w-full flex-col gap-2 py-4 sm:flex-row sm:items-center\"\n >\n <input\n *ngIf=\"showFilter\"\n type=\"text\"\n [placeholder]=\"filterPlaceholder\"\n [value]=\"query\"\n (input)=\"onQueryInput($event)\"\n class=\"h-9 flex-1 appearance-none box-border rounded-md border border-input bg-transparent px-3 py-1 text-sm text-foreground shadow-sm placeholder:text-muted-foreground outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background\"\n />\n\n <button\n *ngIf=\"showColumnSelector\"\n type=\"button\"\n class=\"inline-flex h-9 appearance-none box-border items-center gap-2 rounded-md border border-input bg-background px-3 py-2 text-sm font-medium text-foreground shadow-sm whitespace-nowrap\"\n >\n <span>{{ columnsLabel }}</span>\n <svg\n viewBox=\"0 0 24 24\"\n class=\"h-4 w-4 text-foreground\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M7 10L12 15L17 10\"\n stroke=\"currentColor\"\n stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n ></path>\n </svg>\n </button>\n </div>\n\n <!-- Tabla con responsive -->\n <pdm-table\n variant=\"data\"\n [responsiveStrategy]=\"responsiveStrategy\"\n [fullBleed]=\"false\"\n >\n <thead>\n <tr>\n <!-- Columna de selecci\u00F3n -->\n <th *ngIf=\"selectable\" class=\"w-10 px-2 py-2 text-left font-medium\">\n <input\n type=\"checkbox\"\n (change)=\"onToggleAll($event)\"\n class=\"h-4 w-4 box-border rounded-sm border border-input accent-primary\"\n />\n </th>\n\n <!-- Columnas din\u00E1micas -->\n <th\n *ngFor=\"let column of effectiveColumns\"\n [ngClass]=\"getHeaderClass(column)\"\n [ngStyle]=\"getColumnStyle(column)\"\n >\n <!-- Header sortable -->\n <button\n *ngIf=\"column.sortable\"\n type=\"button\"\n (click)=\"onSort(column)\"\n class=\"inline-flex appearance-none box-border items-center gap-1 rounded-sm border-0 bg-transparent px-3 py-2 text-sm hover:underline\"\n >\n <span>{{ column.label }}</span>\n <svg\n viewBox=\"0 0 24 24\"\n class=\"h-4 w-4\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M8 6L4 10L8 14M16 18L20 14L16 10\"\n stroke=\"currentColor\"\n stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n ></path>\n </svg>\n </button>\n\n <!-- Header no sortable -->\n <span *ngIf=\"!column.sortable\">{{ column.label }}</span>\n </th>\n\n <!-- Columna de acciones -->\n <th *ngIf=\"showActions\" class=\"w-10 px-2 py-2\"></th>\n </tr>\n </thead>\n\n <tbody>\n <!-- Filas con datos -->\n <tr *ngFor=\"let row of pagedRows\">\n <!-- Celda de selecci\u00F3n -->\n <td *ngIf=\"selectable\" class=\"px-2 py-2\">\n <input\n type=\"checkbox\"\n [checked]=\"isSelected(row)\"\n (change)=\"onToggleRow(row, $event)\"\n class=\"h-4 w-4 box-border rounded-sm border border-input accent-primary\"\n />\n </td>\n\n <!-- Celdas din\u00E1micas -->\n <td\n *ngFor=\"let column of effectiveColumns\"\n [ngClass]=\"getCellClass(column)\"\n >\n <!-- Template personalizado si existe -->\n <ng-container *ngIf=\"column.cellTemplate; else defaultCell\">\n <ng-container\n *ngTemplateOutlet=\"\n column.cellTemplate;\n context: { $implicit: row, value: row[column.key] }\n \"\n >\n </ng-container>\n </ng-container>\n\n <!-- Renderizado default -->\n <ng-template #defaultCell>\n {{ getCellValue(row, column) }}\n </ng-template>\n </td>\n\n <!-- Celda de acciones -->\n <td *ngIf=\"showActions\" class=\"px-2 py-2\">\n <button\n type=\"button\"\n class=\"inline-flex h-8 w-8 appearance-none box-border items-center justify-center border-0 bg-transparent p-0 hover:text-foreground\"\n (click)=\"onAction(row)\"\n >\n <svg\n viewBox=\"0 0 24 24\"\n class=\"h-4 w-4\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <circle cx=\"6\" cy=\"12\" r=\"1.5\" fill=\"currentColor\"></circle>\n <circle cx=\"12\" cy=\"12\" r=\"1.5\" fill=\"currentColor\"></circle>\n <circle cx=\"18\" cy=\"12\" r=\"1.5\" fill=\"currentColor\"></circle>\n </svg>\n </button>\n </td>\n </tr>\n\n <!-- Fila vac\u00EDa -->\n <tr *ngIf=\"pagedRows.length === 0\">\n <td\n [attr.colspan]=\"\n effectiveColumns.length +\n (selectable ? 1 : 0) +\n (showActions ? 1 : 0)\n \"\n class=\"px-3 py-6 text-center text-sm text-muted-foreground\"\n >\n {{ emptyLabel }}\n </td>\n </tr>\n </tbody>\n </pdm-table>\n\n <!-- Footer: Info + Paginaci\u00F3n -->\n <div\n *ngIf=\"showPagination || selectable\"\n class=\"flex w-full flex-wrap items-center gap-2 py-4 sm:flex-nowrap\"\n >\n <p\n *ngIf=\"selectable\"\n class=\"m-0 flex-1 pr-2 text-sm text-muted-foreground whitespace-nowrap\"\n >\n {{ selectedCount }} of {{ rows.length }} {{ rowsSelectedLabel }}\n </p>\n\n <div *ngIf=\"showPagination\" class=\"flex items-center gap-2 ml-auto\">\n <span class=\"text-sm text-muted-foreground whitespace-nowrap\">\n Page {{ page }} of {{ totalPages }}\n </span>\n <button\n type=\"button\"\n class=\"h-9 appearance-none box-border rounded-md border border-input bg-background px-4 text-sm font-medium text-foreground shadow-sm ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50\"\n [disabled]=\"page <= 1\"\n (click)=\"previous()\"\n >\n {{ previousLabel }}\n </button>\n <button\n type=\"button\"\n class=\"h-9 appearance-none box-border rounded-md border border-input bg-background px-4 text-sm font-medium text-foreground shadow-sm ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50\"\n [disabled]=\"page >= totalPages\"\n (click)=\"next()\"\n >\n {{ nextLabel }}\n </button>\n </div>\n </div>\n</section>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: PdmTableComponent, selector: "pdm-table", inputs: ["variant", "responsiveStrategy", "className", "fullBleed"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2754
|
+
PdmDataTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmDataTableComponent, selector: "pdm-data-table", inputs: { className: "className", columns: "columns", responsiveStrategy: "responsiveStrategy", selectable: "selectable", showActions: "showActions", showFilter: "showFilter", showPagination: "showPagination", showColumnSelector: "showColumnSelector", filterPlaceholder: "filterPlaceholder", columnsLabel: "columnsLabel", previousLabel: "previousLabel", nextLabel: "nextLabel", emptyLabel: "emptyLabel", rowsSelectedLabel: "rowsSelectedLabel", statusLabel: "statusLabel", emailLabel: "emailLabel", amountLabel: "amountLabel", rows: "rows", page: "page", pageSize: "pageSize", query: "query", filterFn: "filterFn" }, outputs: { queryChange: "queryChange", rowAction: "rowAction", pageChange: "pageChange", selectionChange: "selectionChange", columnSort: "columnSort" }, ngImport: i0, template: "<section [ngClass]=\"['flex w-full flex-col', className]\">\n <!-- Toolbar: Filtro + Selector de columnas -->\n <div\n *ngIf=\"showFilter || showColumnSelector\"\n class=\"flex w-full flex-col gap-2 py-4 sm:flex-row sm:items-center\"\n >\n <input\n *ngIf=\"showFilter\"\n type=\"text\"\n [placeholder]=\"filterPlaceholder\"\n [value]=\"query\"\n (input)=\"onQueryInput($event)\"\n class=\"h-9 flex-1 appearance-none box-border rounded-md border border-solid border-input bg-transparent px-3 py-1 text-sm text-foreground shadow-sm placeholder:text-muted-foreground outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background\"\n />\n\n <button\n *ngIf=\"showColumnSelector\"\n type=\"button\"\n class=\"inline-flex h-9 appearance-none box-border items-center gap-2 rounded-md border border-solid border-input bg-background px-3 py-2 text-sm font-medium text-foreground shadow-sm whitespace-nowrap\"\n >\n <span>{{ columnsLabel }}</span>\n <svg\n viewBox=\"0 0 24 24\"\n class=\"h-4 w-4 text-foreground\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M7 10L12 15L17 10\"\n stroke=\"currentColor\"\n stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n ></path>\n </svg>\n </button>\n </div>\n\n <!-- Tabla con responsive -->\n <pdm-table\n variant=\"data\"\n [responsiveStrategy]=\"responsiveStrategy\"\n [fullBleed]=\"false\"\n >\n <thead>\n <tr>\n <!-- Columna de selecci\u00F3n -->\n <th *ngIf=\"selectable\" class=\"w-10 px-2 py-2 text-left font-medium\">\n <input\n type=\"checkbox\"\n (change)=\"onToggleAll($event)\"\n class=\"h-4 w-4 box-border rounded-sm border border-solid border-input accent-primary\"\n />\n </th>\n\n <!-- Columnas din\u00E1micas -->\n <th\n *ngFor=\"let column of effectiveColumns\"\n [ngClass]=\"getHeaderClass(column)\"\n [ngStyle]=\"getColumnStyle(column)\"\n >\n <!-- Header sortable -->\n <button\n *ngIf=\"column.sortable\"\n type=\"button\"\n (click)=\"onSort(column)\"\n class=\"inline-flex appearance-none box-border items-center gap-1 rounded-sm border-0 bg-transparent px-3 py-2 text-sm hover:underline\"\n >\n <span>{{ column.label }}</span>\n <svg\n viewBox=\"0 0 24 24\"\n class=\"h-4 w-4\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M8 6L4 10L8 14M16 18L20 14L16 10\"\n stroke=\"currentColor\"\n stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n ></path>\n </svg>\n </button>\n\n <!-- Header no sortable -->\n <span *ngIf=\"!column.sortable\">{{ column.label }}</span>\n </th>\n\n <!-- Columna de acciones -->\n <th *ngIf=\"showActions\" class=\"w-10 px-2 py-2\"></th>\n </tr>\n </thead>\n\n <tbody>\n <!-- Filas con datos -->\n <tr *ngFor=\"let row of pagedRows\">\n <!-- Celda de selecci\u00F3n -->\n <td *ngIf=\"selectable\" class=\"px-2 py-2\">\n <input\n type=\"checkbox\"\n [checked]=\"isSelected(row)\"\n (change)=\"onToggleRow(row, $event)\"\n class=\"h-4 w-4 box-border rounded-sm border border-solid border-input accent-primary\"\n />\n </td>\n\n <!-- Celdas din\u00E1micas -->\n <td\n *ngFor=\"let column of effectiveColumns\"\n [ngClass]=\"getCellClass(column)\"\n >\n <!-- Template personalizado si existe -->\n <ng-container *ngIf=\"column.cellTemplate; else defaultCell\">\n <ng-container\n *ngTemplateOutlet=\"\n column.cellTemplate;\n context: { $implicit: row, value: row[column.key] }\n \"\n >\n </ng-container>\n </ng-container>\n\n <!-- Renderizado default -->\n <ng-template #defaultCell>\n {{ getCellValue(row, column) }}\n </ng-template>\n </td>\n\n <!-- Celda de acciones -->\n <td *ngIf=\"showActions\" class=\"px-2 py-2\">\n <button\n type=\"button\"\n class=\"inline-flex h-8 w-8 appearance-none box-border items-center justify-center border-0 bg-transparent p-0 hover:text-foreground\"\n (click)=\"onAction(row)\"\n >\n <svg\n viewBox=\"0 0 24 24\"\n class=\"h-4 w-4\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <circle cx=\"6\" cy=\"12\" r=\"1.5\" fill=\"currentColor\"></circle>\n <circle cx=\"12\" cy=\"12\" r=\"1.5\" fill=\"currentColor\"></circle>\n <circle cx=\"18\" cy=\"12\" r=\"1.5\" fill=\"currentColor\"></circle>\n </svg>\n </button>\n </td>\n </tr>\n\n <!-- Fila vac\u00EDa -->\n <tr *ngIf=\"pagedRows.length === 0\">\n <td\n [attr.colspan]=\"\n effectiveColumns.length +\n (selectable ? 1 : 0) +\n (showActions ? 1 : 0)\n \"\n class=\"px-3 py-6 text-center text-sm text-muted-foreground\"\n >\n {{ emptyLabel }}\n </td>\n </tr>\n </tbody>\n </pdm-table>\n\n <!-- Footer: Info + Paginaci\u00F3n -->\n <div\n *ngIf=\"showPagination || selectable\"\n class=\"flex w-full flex-wrap items-center gap-2 py-4 sm:flex-nowrap\"\n >\n <p\n *ngIf=\"selectable\"\n class=\"m-0 flex-1 pr-2 text-sm text-muted-foreground whitespace-nowrap\"\n >\n {{ selectedCount }} of {{ rows.length }} {{ rowsSelectedLabel }}\n </p>\n\n <div *ngIf=\"showPagination\" class=\"flex items-center gap-2 ml-auto\">\n <span class=\"text-sm text-muted-foreground whitespace-nowrap\">\n Page {{ page }} of {{ totalPages }}\n </span>\n <button\n type=\"button\"\n class=\"h-9 appearance-none box-border rounded-md border border-solid border-input bg-background px-4 text-sm font-medium text-foreground shadow-sm ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50\"\n [disabled]=\"page <= 1\"\n (click)=\"previous()\"\n >\n {{ previousLabel }}\n </button>\n <button\n type=\"button\"\n class=\"h-9 appearance-none box-border rounded-md border border-solid border-input bg-background px-4 text-sm font-medium text-foreground shadow-sm ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50\"\n [disabled]=\"page >= totalPages\"\n (click)=\"next()\"\n >\n {{ nextLabel }}\n </button>\n </div>\n </div>\n</section>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: PdmTableComponent, selector: "pdm-table", inputs: ["variant", "responsiveStrategy", "className", "fullBleed"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2735
2755
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmDataTableComponent, decorators: [{
|
|
2736
2756
|
type: Component,
|
|
2737
|
-
args: [{ selector: 'pdm-data-table', changeDetection: ChangeDetectionStrategy.OnPush, template: "<section [ngClass]=\"['flex w-full flex-col', className]\">\n <!-- Toolbar: Filtro + Selector de columnas -->\n <div\n *ngIf=\"showFilter || showColumnSelector\"\n class=\"flex w-full flex-col gap-2 py-4 sm:flex-row sm:items-center\"\n >\n <input\n *ngIf=\"showFilter\"\n type=\"text\"\n [placeholder]=\"filterPlaceholder\"\n [value]=\"query\"\n (input)=\"onQueryInput($event)\"\n class=\"h-9 flex-1 appearance-none box-border rounded-md border border-input bg-transparent px-3 py-1 text-sm text-foreground shadow-sm placeholder:text-muted-foreground outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background\"\n />\n\n <button\n *ngIf=\"showColumnSelector\"\n type=\"button\"\n class=\"inline-flex h-9 appearance-none box-border items-center gap-2 rounded-md border border-input bg-background px-3 py-2 text-sm font-medium text-foreground shadow-sm whitespace-nowrap\"\n >\n <span>{{ columnsLabel }}</span>\n <svg\n viewBox=\"0 0 24 24\"\n class=\"h-4 w-4 text-foreground\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M7 10L12 15L17 10\"\n stroke=\"currentColor\"\n stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n ></path>\n </svg>\n </button>\n </div>\n\n <!-- Tabla con responsive -->\n <pdm-table\n variant=\"data\"\n [responsiveStrategy]=\"responsiveStrategy\"\n [fullBleed]=\"false\"\n >\n <thead>\n <tr>\n <!-- Columna de selecci\u00F3n -->\n <th *ngIf=\"selectable\" class=\"w-10 px-2 py-2 text-left font-medium\">\n <input\n type=\"checkbox\"\n (change)=\"onToggleAll($event)\"\n class=\"h-4 w-4 box-border rounded-sm border border-input accent-primary\"\n />\n </th>\n\n <!-- Columnas din\u00E1micas -->\n <th\n *ngFor=\"let column of effectiveColumns\"\n [ngClass]=\"getHeaderClass(column)\"\n [ngStyle]=\"getColumnStyle(column)\"\n >\n <!-- Header sortable -->\n <button\n *ngIf=\"column.sortable\"\n type=\"button\"\n (click)=\"onSort(column)\"\n class=\"inline-flex appearance-none box-border items-center gap-1 rounded-sm border-0 bg-transparent px-3 py-2 text-sm hover:underline\"\n >\n <span>{{ column.label }}</span>\n <svg\n viewBox=\"0 0 24 24\"\n class=\"h-4 w-4\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M8 6L4 10L8 14M16 18L20 14L16 10\"\n stroke=\"currentColor\"\n stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n ></path>\n </svg>\n </button>\n\n <!-- Header no sortable -->\n <span *ngIf=\"!column.sortable\">{{ column.label }}</span>\n </th>\n\n <!-- Columna de acciones -->\n <th *ngIf=\"showActions\" class=\"w-10 px-2 py-2\"></th>\n </tr>\n </thead>\n\n <tbody>\n <!-- Filas con datos -->\n <tr *ngFor=\"let row of pagedRows\">\n <!-- Celda de selecci\u00F3n -->\n <td *ngIf=\"selectable\" class=\"px-2 py-2\">\n <input\n type=\"checkbox\"\n [checked]=\"isSelected(row)\"\n (change)=\"onToggleRow(row, $event)\"\n class=\"h-4 w-4 box-border rounded-sm border border-input accent-primary\"\n />\n </td>\n\n <!-- Celdas din\u00E1micas -->\n <td\n *ngFor=\"let column of effectiveColumns\"\n [ngClass]=\"getCellClass(column)\"\n >\n <!-- Template personalizado si existe -->\n <ng-container *ngIf=\"column.cellTemplate; else defaultCell\">\n <ng-container\n *ngTemplateOutlet=\"\n column.cellTemplate;\n context: { $implicit: row, value: row[column.key] }\n \"\n >\n </ng-container>\n </ng-container>\n\n <!-- Renderizado default -->\n <ng-template #defaultCell>\n {{ getCellValue(row, column) }}\n </ng-template>\n </td>\n\n <!-- Celda de acciones -->\n <td *ngIf=\"showActions\" class=\"px-2 py-2\">\n <button\n type=\"button\"\n class=\"inline-flex h-8 w-8 appearance-none box-border items-center justify-center border-0 bg-transparent p-0 hover:text-foreground\"\n (click)=\"onAction(row)\"\n >\n <svg\n viewBox=\"0 0 24 24\"\n class=\"h-4 w-4\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <circle cx=\"6\" cy=\"12\" r=\"1.5\" fill=\"currentColor\"></circle>\n <circle cx=\"12\" cy=\"12\" r=\"1.5\" fill=\"currentColor\"></circle>\n <circle cx=\"18\" cy=\"12\" r=\"1.5\" fill=\"currentColor\"></circle>\n </svg>\n </button>\n </td>\n </tr>\n\n <!-- Fila vac\u00EDa -->\n <tr *ngIf=\"pagedRows.length === 0\">\n <td\n [attr.colspan]=\"\n effectiveColumns.length +\n (selectable ? 1 : 0) +\n (showActions ? 1 : 0)\n \"\n class=\"px-3 py-6 text-center text-sm text-muted-foreground\"\n >\n {{ emptyLabel }}\n </td>\n </tr>\n </tbody>\n </pdm-table>\n\n <!-- Footer: Info + Paginaci\u00F3n -->\n <div\n *ngIf=\"showPagination || selectable\"\n class=\"flex w-full flex-wrap items-center gap-2 py-4 sm:flex-nowrap\"\n >\n <p\n *ngIf=\"selectable\"\n class=\"m-0 flex-1 pr-2 text-sm text-muted-foreground whitespace-nowrap\"\n >\n {{ selectedCount }} of {{ rows.length }} {{ rowsSelectedLabel }}\n </p>\n\n <div *ngIf=\"showPagination\" class=\"flex items-center gap-2 ml-auto\">\n <span class=\"text-sm text-muted-foreground whitespace-nowrap\">\n Page {{ page }} of {{ totalPages }}\n </span>\n <button\n type=\"button\"\n class=\"h-9 appearance-none box-border rounded-md border border-input bg-background px-4 text-sm font-medium text-foreground shadow-sm ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50\"\n [disabled]=\"page <= 1\"\n (click)=\"previous()\"\n >\n {{ previousLabel }}\n </button>\n <button\n type=\"button\"\n class=\"h-9 appearance-none box-border rounded-md border border-input bg-background px-4 text-sm font-medium text-foreground shadow-sm ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50\"\n [disabled]=\"page >= totalPages\"\n (click)=\"next()\"\n >\n {{ nextLabel }}\n </button>\n </div>\n </div>\n</section>\n" }]
|
|
2757
|
+
args: [{ selector: 'pdm-data-table', changeDetection: ChangeDetectionStrategy.OnPush, template: "<section [ngClass]=\"['flex w-full flex-col', className]\">\n <!-- Toolbar: Filtro + Selector de columnas -->\n <div\n *ngIf=\"showFilter || showColumnSelector\"\n class=\"flex w-full flex-col gap-2 py-4 sm:flex-row sm:items-center\"\n >\n <input\n *ngIf=\"showFilter\"\n type=\"text\"\n [placeholder]=\"filterPlaceholder\"\n [value]=\"query\"\n (input)=\"onQueryInput($event)\"\n class=\"h-9 flex-1 appearance-none box-border rounded-md border border-solid border-input bg-transparent px-3 py-1 text-sm text-foreground shadow-sm placeholder:text-muted-foreground outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background\"\n />\n\n <button\n *ngIf=\"showColumnSelector\"\n type=\"button\"\n class=\"inline-flex h-9 appearance-none box-border items-center gap-2 rounded-md border border-solid border-input bg-background px-3 py-2 text-sm font-medium text-foreground shadow-sm whitespace-nowrap\"\n >\n <span>{{ columnsLabel }}</span>\n <svg\n viewBox=\"0 0 24 24\"\n class=\"h-4 w-4 text-foreground\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M7 10L12 15L17 10\"\n stroke=\"currentColor\"\n stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n ></path>\n </svg>\n </button>\n </div>\n\n <!-- Tabla con responsive -->\n <pdm-table\n variant=\"data\"\n [responsiveStrategy]=\"responsiveStrategy\"\n [fullBleed]=\"false\"\n >\n <thead>\n <tr>\n <!-- Columna de selecci\u00F3n -->\n <th *ngIf=\"selectable\" class=\"w-10 px-2 py-2 text-left font-medium\">\n <input\n type=\"checkbox\"\n (change)=\"onToggleAll($event)\"\n class=\"h-4 w-4 box-border rounded-sm border border-solid border-input accent-primary\"\n />\n </th>\n\n <!-- Columnas din\u00E1micas -->\n <th\n *ngFor=\"let column of effectiveColumns\"\n [ngClass]=\"getHeaderClass(column)\"\n [ngStyle]=\"getColumnStyle(column)\"\n >\n <!-- Header sortable -->\n <button\n *ngIf=\"column.sortable\"\n type=\"button\"\n (click)=\"onSort(column)\"\n class=\"inline-flex appearance-none box-border items-center gap-1 rounded-sm border-0 bg-transparent px-3 py-2 text-sm hover:underline\"\n >\n <span>{{ column.label }}</span>\n <svg\n viewBox=\"0 0 24 24\"\n class=\"h-4 w-4\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M8 6L4 10L8 14M16 18L20 14L16 10\"\n stroke=\"currentColor\"\n stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n ></path>\n </svg>\n </button>\n\n <!-- Header no sortable -->\n <span *ngIf=\"!column.sortable\">{{ column.label }}</span>\n </th>\n\n <!-- Columna de acciones -->\n <th *ngIf=\"showActions\" class=\"w-10 px-2 py-2\"></th>\n </tr>\n </thead>\n\n <tbody>\n <!-- Filas con datos -->\n <tr *ngFor=\"let row of pagedRows\">\n <!-- Celda de selecci\u00F3n -->\n <td *ngIf=\"selectable\" class=\"px-2 py-2\">\n <input\n type=\"checkbox\"\n [checked]=\"isSelected(row)\"\n (change)=\"onToggleRow(row, $event)\"\n class=\"h-4 w-4 box-border rounded-sm border border-solid border-input accent-primary\"\n />\n </td>\n\n <!-- Celdas din\u00E1micas -->\n <td\n *ngFor=\"let column of effectiveColumns\"\n [ngClass]=\"getCellClass(column)\"\n >\n <!-- Template personalizado si existe -->\n <ng-container *ngIf=\"column.cellTemplate; else defaultCell\">\n <ng-container\n *ngTemplateOutlet=\"\n column.cellTemplate;\n context: { $implicit: row, value: row[column.key] }\n \"\n >\n </ng-container>\n </ng-container>\n\n <!-- Renderizado default -->\n <ng-template #defaultCell>\n {{ getCellValue(row, column) }}\n </ng-template>\n </td>\n\n <!-- Celda de acciones -->\n <td *ngIf=\"showActions\" class=\"px-2 py-2\">\n <button\n type=\"button\"\n class=\"inline-flex h-8 w-8 appearance-none box-border items-center justify-center border-0 bg-transparent p-0 hover:text-foreground\"\n (click)=\"onAction(row)\"\n >\n <svg\n viewBox=\"0 0 24 24\"\n class=\"h-4 w-4\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <circle cx=\"6\" cy=\"12\" r=\"1.5\" fill=\"currentColor\"></circle>\n <circle cx=\"12\" cy=\"12\" r=\"1.5\" fill=\"currentColor\"></circle>\n <circle cx=\"18\" cy=\"12\" r=\"1.5\" fill=\"currentColor\"></circle>\n </svg>\n </button>\n </td>\n </tr>\n\n <!-- Fila vac\u00EDa -->\n <tr *ngIf=\"pagedRows.length === 0\">\n <td\n [attr.colspan]=\"\n effectiveColumns.length +\n (selectable ? 1 : 0) +\n (showActions ? 1 : 0)\n \"\n class=\"px-3 py-6 text-center text-sm text-muted-foreground\"\n >\n {{ emptyLabel }}\n </td>\n </tr>\n </tbody>\n </pdm-table>\n\n <!-- Footer: Info + Paginaci\u00F3n -->\n <div\n *ngIf=\"showPagination || selectable\"\n class=\"flex w-full flex-wrap items-center gap-2 py-4 sm:flex-nowrap\"\n >\n <p\n *ngIf=\"selectable\"\n class=\"m-0 flex-1 pr-2 text-sm text-muted-foreground whitespace-nowrap\"\n >\n {{ selectedCount }} of {{ rows.length }} {{ rowsSelectedLabel }}\n </p>\n\n <div *ngIf=\"showPagination\" class=\"flex items-center gap-2 ml-auto\">\n <span class=\"text-sm text-muted-foreground whitespace-nowrap\">\n Page {{ page }} of {{ totalPages }}\n </span>\n <button\n type=\"button\"\n class=\"h-9 appearance-none box-border rounded-md border border-solid border-input bg-background px-4 text-sm font-medium text-foreground shadow-sm ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50\"\n [disabled]=\"page <= 1\"\n (click)=\"previous()\"\n >\n {{ previousLabel }}\n </button>\n <button\n type=\"button\"\n class=\"h-9 appearance-none box-border rounded-md border border-solid border-input bg-background px-4 text-sm font-medium text-foreground shadow-sm ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50\"\n [disabled]=\"page >= totalPages\"\n (click)=\"next()\"\n >\n {{ nextLabel }}\n </button>\n </div>\n </div>\n</section>\n" }]
|
|
2738
2758
|
}], propDecorators: { className: [{
|
|
2739
2759
|
type: Input
|
|
2740
2760
|
}], columns: [{
|
|
@@ -2995,7 +3015,7 @@ class PdmDatePickerComponent {
|
|
|
2995
3015
|
get triggerClasses() {
|
|
2996
3016
|
const focusStyle = this._open || this.triggerFocused;
|
|
2997
3017
|
return [
|
|
2998
|
-
"border-input focus-visible:border-ring focus-visible:ring-2 focus-visible:ring-ring/50 aria-invalid:ring-2 aria-invalid:ring-destructive aria-invalid:border-destructive relative flex w-full appearance-none box-border items-center gap-2 overflow-hidden rounded-lg border bg-background px-3 py-[7.5px] text-left text-sm shadow-sm outline-none transition-colors",
|
|
3018
|
+
"border-input focus-visible:border-ring focus-visible:ring-2 focus-visible:ring-ring/50 aria-invalid:ring-2 aria-invalid:ring-destructive aria-invalid:border-destructive relative flex w-full appearance-none box-border items-center gap-2 overflow-hidden rounded-lg border border-solid bg-background px-3 py-[7.5px] text-left text-sm shadow-sm outline-none transition-colors",
|
|
2999
3019
|
"min-h-[36px] disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50",
|
|
3000
3020
|
focusStyle ? "border-ring ring-2 ring-ring/50" : "",
|
|
3001
3021
|
this.invalid ? "border-destructive ring-destructive/20" : "",
|
|
@@ -3445,7 +3465,7 @@ class PdmDialogComponent {
|
|
|
3445
3465
|
Z_INDEX.modal,
|
|
3446
3466
|
"flex",
|
|
3447
3467
|
"flex-col",
|
|
3448
|
-
"border",
|
|
3468
|
+
"border border-solid",
|
|
3449
3469
|
"border-border",
|
|
3450
3470
|
"bg-background",
|
|
3451
3471
|
"text-foreground",
|
|
@@ -3517,10 +3537,10 @@ class PdmDialogComponent {
|
|
|
3517
3537
|
}
|
|
3518
3538
|
}
|
|
3519
3539
|
PdmDialogComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3520
|
-
PdmDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmDialogComponent, selector: "pdm-dialog", inputs: { open: "open", variant: "variant", size: "size", title: "title", description: "description", closeOnBackdrop: "closeOnBackdrop", closeOnEsc: "closeOnEsc", showCloseButton: "showCloseButton", showHeader: "showHeader", showFooter: "showFooter", primaryActionText: "primaryActionText", secondaryActionText: "secondaryActionText", alignFooter: "alignFooter", headerClassName: "headerClassName", bodyClassName: "bodyClassName", footerClassName: "footerClassName", className: "className" }, outputs: { openChange: "openChange", primaryAction: "primaryAction", secondaryAction: "secondaryAction" }, host: { listeners: { "document:keydown.escape": "onEsc()" } }, ngImport: i0, template: "<div *ngIf=\"open\" [ngClass]=\"containerClassName\">\n <!-- Backdrop -->\n <div class=\"absolute inset-0 bg-foreground/30 backdrop-blur-sm\" (click)=\"onBackdropClick()\"></div>\n \n <!-- Dialog Panel -->\n <section role=\"dialog\" aria-modal=\"true\" [ngClass]=\"panelClassName\">\n <!-- Header -->\n <div *ngIf=\"showHeader\" [ngClass]=\"headerWrapperClassName\">\n <div class=\"min-w-0 flex-1\">\n <h2 class=\"m-0 text-lg font-semibold leading-none tracking-tight text-foreground\">{{ title }}</h2>\n <p *ngIf=\"description\" class=\"m-0 mt-2 text-sm text-muted-foreground\">{{ description }}</p>\n </div>\n <button\n *ngIf=\"showCloseButton\"\n type=\"button\"\n class=\"inline-flex h-6 w-6 flex-shrink-0 appearance-none box-border items-center justify-center rounded-sm border-0 bg-transparent p-0 text-foreground opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none\"\n (click)=\"close()\"\n aria-label=\"Close dialog\"\n >\n <svg viewBox=\"0 0 24 24\" class=\"h-4 w-4\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M6 6L18 18M18 6L6 18\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\"></path>\n </svg>\n </button>\n </div>\n\n <!-- Body -->\n <div [ngClass]=\"bodyWrapperClassName\">\n <ng-content></ng-content>\n </div>\n\n <!-- Footer -->\n <div *ngIf=\"showFooter\" [ngClass]=\"footerWrapperClassName\">\n <ng-container *ngIf=\"variant === 'custom-close'; else defaultActions\">\n <button\n type=\"button\"\n class=\"inline-flex h-9 w-full appearance-none box-border items-center justify-center rounded-md border border-input bg-background px-4 py-2 text-sm font-medium text-foreground shadow-sm sm:w-auto\"\n (click)=\"onSecondaryAction()\"\n >\n {{ secondaryActionText }}\n </button>\n </ng-container>\n\n <ng-template #defaultActions>\n <button\n type=\"button\"\n class=\"inline-flex h-9 w-full appearance-none box-border items-center justify-center rounded-md border border-input bg-background px-4 py-2 text-sm font-medium text-foreground shadow-sm sm:w-auto\"\n (click)=\"onSecondaryAction()\"\n >\n {{ secondaryActionText }}\n </button>\n <button\n type=\"button\"\n class=\"inline-flex h-9 w-full appearance-none box-border items-center justify-center rounded-md bg-primary px-4 py-2 text-sm font-medium text-primary-foreground shadow-sm sm:w-auto\"\n (click)=\"onPrimaryAction()\"\n >\n {{ primaryActionText }}\n </button>\n </ng-template>\n </div>\n </section>\n</div>\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
3540
|
+
PdmDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmDialogComponent, selector: "pdm-dialog", inputs: { open: "open", variant: "variant", size: "size", title: "title", description: "description", closeOnBackdrop: "closeOnBackdrop", closeOnEsc: "closeOnEsc", showCloseButton: "showCloseButton", showHeader: "showHeader", showFooter: "showFooter", primaryActionText: "primaryActionText", secondaryActionText: "secondaryActionText", alignFooter: "alignFooter", headerClassName: "headerClassName", bodyClassName: "bodyClassName", footerClassName: "footerClassName", className: "className" }, outputs: { openChange: "openChange", primaryAction: "primaryAction", secondaryAction: "secondaryAction" }, host: { listeners: { "document:keydown.escape": "onEsc()" } }, ngImport: i0, template: "<div *ngIf=\"open\" [ngClass]=\"containerClassName\">\n <!-- Backdrop -->\n <div class=\"absolute inset-0 bg-foreground/30 backdrop-blur-sm\" (click)=\"onBackdropClick()\"></div>\n \n <!-- Dialog Panel -->\n <section role=\"dialog\" aria-modal=\"true\" [ngClass]=\"panelClassName\">\n <!-- Header -->\n <div *ngIf=\"showHeader\" [ngClass]=\"headerWrapperClassName\">\n <div class=\"min-w-0 flex-1\">\n <h2 class=\"m-0 text-lg font-semibold leading-none tracking-tight text-foreground\">{{ title }}</h2>\n <p *ngIf=\"description\" class=\"m-0 mt-2 text-sm text-muted-foreground\">{{ description }}</p>\n </div>\n <button\n *ngIf=\"showCloseButton\"\n type=\"button\"\n class=\"inline-flex h-6 w-6 flex-shrink-0 appearance-none box-border items-center justify-center rounded-sm border-0 bg-transparent p-0 text-foreground opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none\"\n (click)=\"close()\"\n aria-label=\"Close dialog\"\n >\n <svg viewBox=\"0 0 24 24\" class=\"h-4 w-4\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M6 6L18 18M18 6L6 18\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\"></path>\n </svg>\n </button>\n </div>\n\n <!-- Body -->\n <div [ngClass]=\"bodyWrapperClassName\">\n <ng-content></ng-content>\n </div>\n\n <!-- Footer -->\n <div *ngIf=\"showFooter\" [ngClass]=\"footerWrapperClassName\">\n <ng-container *ngIf=\"variant === 'custom-close'; else defaultActions\">\n <button\n type=\"button\"\n class=\"inline-flex h-9 w-full appearance-none box-border items-center justify-center rounded-md border border-solid border-input bg-background px-4 py-2 text-sm font-medium text-foreground shadow-sm sm:w-auto\"\n (click)=\"onSecondaryAction()\"\n >\n {{ secondaryActionText }}\n </button>\n </ng-container>\n\n <ng-template #defaultActions>\n <button\n type=\"button\"\n class=\"inline-flex h-9 w-full appearance-none box-border items-center justify-center rounded-md border border-solid border-input bg-background px-4 py-2 text-sm font-medium text-foreground shadow-sm sm:w-auto\"\n (click)=\"onSecondaryAction()\"\n >\n {{ secondaryActionText }}\n </button>\n <button\n type=\"button\"\n class=\"inline-flex h-9 w-full appearance-none box-border items-center justify-center rounded-md bg-primary px-4 py-2 text-sm font-medium text-primary-foreground shadow-sm sm:w-auto\"\n (click)=\"onPrimaryAction()\"\n >\n {{ primaryActionText }}\n </button>\n </ng-template>\n </div>\n </section>\n</div>\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
3521
3541
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmDialogComponent, decorators: [{
|
|
3522
3542
|
type: Component,
|
|
3523
|
-
args: [{ selector: "pdm-dialog", changeDetection: ChangeDetectionStrategy.OnPush, template: "<div *ngIf=\"open\" [ngClass]=\"containerClassName\">\n <!-- Backdrop -->\n <div class=\"absolute inset-0 bg-foreground/30 backdrop-blur-sm\" (click)=\"onBackdropClick()\"></div>\n \n <!-- Dialog Panel -->\n <section role=\"dialog\" aria-modal=\"true\" [ngClass]=\"panelClassName\">\n <!-- Header -->\n <div *ngIf=\"showHeader\" [ngClass]=\"headerWrapperClassName\">\n <div class=\"min-w-0 flex-1\">\n <h2 class=\"m-0 text-lg font-semibold leading-none tracking-tight text-foreground\">{{ title }}</h2>\n <p *ngIf=\"description\" class=\"m-0 mt-2 text-sm text-muted-foreground\">{{ description }}</p>\n </div>\n <button\n *ngIf=\"showCloseButton\"\n type=\"button\"\n class=\"inline-flex h-6 w-6 flex-shrink-0 appearance-none box-border items-center justify-center rounded-sm border-0 bg-transparent p-0 text-foreground opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none\"\n (click)=\"close()\"\n aria-label=\"Close dialog\"\n >\n <svg viewBox=\"0 0 24 24\" class=\"h-4 w-4\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M6 6L18 18M18 6L6 18\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\"></path>\n </svg>\n </button>\n </div>\n\n <!-- Body -->\n <div [ngClass]=\"bodyWrapperClassName\">\n <ng-content></ng-content>\n </div>\n\n <!-- Footer -->\n <div *ngIf=\"showFooter\" [ngClass]=\"footerWrapperClassName\">\n <ng-container *ngIf=\"variant === 'custom-close'; else defaultActions\">\n <button\n type=\"button\"\n class=\"inline-flex h-9 w-full appearance-none box-border items-center justify-center rounded-md border border-input bg-background px-4 py-2 text-sm font-medium text-foreground shadow-sm sm:w-auto\"\n (click)=\"onSecondaryAction()\"\n >\n {{ secondaryActionText }}\n </button>\n </ng-container>\n\n <ng-template #defaultActions>\n <button\n type=\"button\"\n class=\"inline-flex h-9 w-full appearance-none box-border items-center justify-center rounded-md border border-input bg-background px-4 py-2 text-sm font-medium text-foreground shadow-sm sm:w-auto\"\n (click)=\"onSecondaryAction()\"\n >\n {{ secondaryActionText }}\n </button>\n <button\n type=\"button\"\n class=\"inline-flex h-9 w-full appearance-none box-border items-center justify-center rounded-md bg-primary px-4 py-2 text-sm font-medium text-primary-foreground shadow-sm sm:w-auto\"\n (click)=\"onPrimaryAction()\"\n >\n {{ primaryActionText }}\n </button>\n </ng-template>\n </div>\n </section>\n</div>\n", styles: [":host{display:block}\n"] }]
|
|
3543
|
+
args: [{ selector: "pdm-dialog", changeDetection: ChangeDetectionStrategy.OnPush, template: "<div *ngIf=\"open\" [ngClass]=\"containerClassName\">\n <!-- Backdrop -->\n <div class=\"absolute inset-0 bg-foreground/30 backdrop-blur-sm\" (click)=\"onBackdropClick()\"></div>\n \n <!-- Dialog Panel -->\n <section role=\"dialog\" aria-modal=\"true\" [ngClass]=\"panelClassName\">\n <!-- Header -->\n <div *ngIf=\"showHeader\" [ngClass]=\"headerWrapperClassName\">\n <div class=\"min-w-0 flex-1\">\n <h2 class=\"m-0 text-lg font-semibold leading-none tracking-tight text-foreground\">{{ title }}</h2>\n <p *ngIf=\"description\" class=\"m-0 mt-2 text-sm text-muted-foreground\">{{ description }}</p>\n </div>\n <button\n *ngIf=\"showCloseButton\"\n type=\"button\"\n class=\"inline-flex h-6 w-6 flex-shrink-0 appearance-none box-border items-center justify-center rounded-sm border-0 bg-transparent p-0 text-foreground opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none\"\n (click)=\"close()\"\n aria-label=\"Close dialog\"\n >\n <svg viewBox=\"0 0 24 24\" class=\"h-4 w-4\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M6 6L18 18M18 6L6 18\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\"></path>\n </svg>\n </button>\n </div>\n\n <!-- Body -->\n <div [ngClass]=\"bodyWrapperClassName\">\n <ng-content></ng-content>\n </div>\n\n <!-- Footer -->\n <div *ngIf=\"showFooter\" [ngClass]=\"footerWrapperClassName\">\n <ng-container *ngIf=\"variant === 'custom-close'; else defaultActions\">\n <button\n type=\"button\"\n class=\"inline-flex h-9 w-full appearance-none box-border items-center justify-center rounded-md border border-solid border-input bg-background px-4 py-2 text-sm font-medium text-foreground shadow-sm sm:w-auto\"\n (click)=\"onSecondaryAction()\"\n >\n {{ secondaryActionText }}\n </button>\n </ng-container>\n\n <ng-template #defaultActions>\n <button\n type=\"button\"\n class=\"inline-flex h-9 w-full appearance-none box-border items-center justify-center rounded-md border border-solid border-input bg-background px-4 py-2 text-sm font-medium text-foreground shadow-sm sm:w-auto\"\n (click)=\"onSecondaryAction()\"\n >\n {{ secondaryActionText }}\n </button>\n <button\n type=\"button\"\n class=\"inline-flex h-9 w-full appearance-none box-border items-center justify-center rounded-md bg-primary px-4 py-2 text-sm font-medium text-primary-foreground shadow-sm sm:w-auto\"\n (click)=\"onPrimaryAction()\"\n >\n {{ primaryActionText }}\n </button>\n </ng-template>\n </div>\n </section>\n</div>\n", styles: [":host{display:block}\n"] }]
|
|
3524
3544
|
}], propDecorators: { open: [{
|
|
3525
3545
|
type: Input
|
|
3526
3546
|
}], variant: [{
|
|
@@ -3642,10 +3662,10 @@ class PdmDraggableTableComponent {
|
|
|
3642
3662
|
}
|
|
3643
3663
|
getVariantWrapperClasses() {
|
|
3644
3664
|
if (this.variant === 'interactive') {
|
|
3645
|
-
return ['rounded-xl', 'border', 'border-border', 'bg-background'];
|
|
3665
|
+
return ['rounded-xl', 'border border-solid', 'border-border', 'bg-background'];
|
|
3646
3666
|
}
|
|
3647
3667
|
if (this.variant === 'data') {
|
|
3648
|
-
return ['rounded-md', 'border', 'border-border', 'bg-background'];
|
|
3668
|
+
return ['rounded-md', 'border border-solid', 'border-border', 'bg-background'];
|
|
3649
3669
|
}
|
|
3650
3670
|
return [];
|
|
3651
3671
|
}
|
|
@@ -4010,10 +4030,10 @@ class PdmDropdownMenuComponent {
|
|
|
4010
4030
|
}
|
|
4011
4031
|
}
|
|
4012
4032
|
PdmDropdownMenuComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmDropdownMenuComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i1$1.Overlay }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
4013
|
-
PdmDropdownMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmDropdownMenuComponent, selector: "pdm-dropdown-menu", inputs: { triggerText: "triggerText", variant: "variant", items: "items", closeOnSelect: "closeOnSelect", className: "className", panelClassName: "panelClassName", overlayOptions: "overlayOptions" }, outputs: { itemSelect: "itemSelect", itemsChange: "itemsChange" }, host: { listeners: { "document:keydown.escape": "onEsc()" } }, viewQueries: [{ propertyName: "triggerRef", first: true, predicate: ["triggerEl"], descendants: true }, { propertyName: "panelTemplateRef", first: true, predicate: ["panelTemplate"], descendants: true }], ngImport: i0, template: "<button\n #triggerEl\n type=\"button\"\n [ngClass]=\"[\n 'inline-flex h-9 appearance-none box-border items-center justify-center rounded-md border border-input bg-background px-4 py-2 text-sm font-medium text-foreground shadow-sm ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2',\n className\n ]\"\n [attr.aria-expanded]=\"open\"\n (click)=\"toggle()\"\n>\n {{ triggerText }}\n</button>\n\n<ng-template #panelTemplate>\n <div\n class=\"min-w-32 overflow-hidden rounded-md border border-border bg-popover p-1 text-popover-foreground shadow-md\"\n >\n <ng-container *ngFor=\"let item of resolvedItems\">\n <div *ngIf=\"item.type === 'separator'\" class=\"-mx-1 my-1 h-px bg-muted\"></div>\n\n <div\n *ngIf=\"item.type === 'label'\"\n [ngClass]=\"['px-2 py-1.5 text-sm font-semibold text-foreground', item.inset ? 'pl-8' : '']\"\n >\n {{ item.label }}\n </div>\n\n <button\n *ngIf=\"!item.type || item.type === 'item'\"\n type=\"button\"\n [disabled]=\"item.disabled\"\n [ngClass]=\"[\n 'relative flex w-full appearance-none box-border cursor-default select-none items-center gap-2 rounded-sm border-0 bg-transparent px-2 py-1.5 text-left text-sm text-foreground outline-none transition-colors hover:bg-accent hover:text-accent-foreground focus-visible:bg-accent focus-visible:text-accent-foreground disabled:pointer-events-none disabled:opacity-50',\n item.inset ? 'pl-8' : ''\n ]\"\n (click)=\"select(item)\"\n >\n <span class=\"inline-flex h-4 w-4 shrink-0 items-center justify-center\">\n <svg\n *ngIf=\"item.checked\"\n viewBox=\"0 0 24 24\"\n class=\"h-3.5 w-3.5 text-foreground\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path d=\"M5 12.5L9.2 16.7L19 7\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path>\n </svg>\n <span *ngIf=\"item.radioSelected\" class=\"h-2 w-2 rounded-full bg-foreground\"></span>\n </span>\n <span class=\"min-w-0 flex-1 truncate\">{{ item.label }}</span>\n <span *ngIf=\"item.shortcut\" class=\"text-xs text-muted-foreground\">{{ item.shortcut }}</span>\n <span *ngIf=\"item.showChevron\" class=\"text-sm text-muted-foreground\">\u203A</span>\n </button>\n </ng-container>\n </div>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
4033
|
+
PdmDropdownMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmDropdownMenuComponent, selector: "pdm-dropdown-menu", inputs: { triggerText: "triggerText", variant: "variant", items: "items", closeOnSelect: "closeOnSelect", className: "className", panelClassName: "panelClassName", overlayOptions: "overlayOptions" }, outputs: { itemSelect: "itemSelect", itemsChange: "itemsChange" }, host: { listeners: { "document:keydown.escape": "onEsc()" } }, viewQueries: [{ propertyName: "triggerRef", first: true, predicate: ["triggerEl"], descendants: true }, { propertyName: "panelTemplateRef", first: true, predicate: ["panelTemplate"], descendants: true }], ngImport: i0, template: "<button\n #triggerEl\n type=\"button\"\n [ngClass]=\"[\n 'inline-flex h-9 appearance-none box-border items-center justify-center rounded-md border border-solid border-input bg-background px-4 py-2 text-sm font-medium text-foreground shadow-sm ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2',\n className\n ]\"\n [attr.aria-expanded]=\"open\"\n (click)=\"toggle()\"\n>\n {{ triggerText }}\n</button>\n\n<ng-template #panelTemplate>\n <div\n class=\"min-w-32 overflow-hidden rounded-md border border-solid border-border bg-popover p-1 text-popover-foreground shadow-md\"\n >\n <ng-container *ngFor=\"let item of resolvedItems\">\n <div *ngIf=\"item.type === 'separator'\" class=\"-mx-1 my-1 h-px bg-muted\"></div>\n\n <div\n *ngIf=\"item.type === 'label'\"\n [ngClass]=\"['px-2 py-1.5 text-sm font-semibold text-foreground', item.inset ? 'pl-8' : '']\"\n >\n {{ item.label }}\n </div>\n\n <button\n *ngIf=\"!item.type || item.type === 'item'\"\n type=\"button\"\n [disabled]=\"item.disabled\"\n [ngClass]=\"[\n 'relative flex w-full appearance-none box-border cursor-default select-none items-center gap-2 rounded-sm border-0 bg-transparent px-2 py-1.5 text-left text-sm text-foreground outline-none transition-colors hover:bg-accent hover:text-accent-foreground focus-visible:bg-accent focus-visible:text-accent-foreground disabled:pointer-events-none disabled:opacity-50',\n item.inset ? 'pl-8' : ''\n ]\"\n (click)=\"select(item)\"\n >\n <span class=\"inline-flex h-4 w-4 shrink-0 items-center justify-center\">\n <svg\n *ngIf=\"item.checked\"\n viewBox=\"0 0 24 24\"\n class=\"h-3.5 w-3.5 text-foreground\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path d=\"M5 12.5L9.2 16.7L19 7\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path>\n </svg>\n <span *ngIf=\"item.radioSelected\" class=\"h-2 w-2 rounded-full bg-foreground\"></span>\n </span>\n <span class=\"min-w-0 flex-1 truncate\">{{ item.label }}</span>\n <span *ngIf=\"item.shortcut\" class=\"text-xs text-muted-foreground\">{{ item.shortcut }}</span>\n <span *ngIf=\"item.showChevron\" class=\"text-sm text-muted-foreground\">\u203A</span>\n </button>\n </ng-container>\n </div>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
4014
4034
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmDropdownMenuComponent, decorators: [{
|
|
4015
4035
|
type: Component,
|
|
4016
|
-
args: [{ selector: 'pdm-dropdown-menu', changeDetection: ChangeDetectionStrategy.OnPush, template: "<button\n #triggerEl\n type=\"button\"\n [ngClass]=\"[\n 'inline-flex h-9 appearance-none box-border items-center justify-center rounded-md border border-input bg-background px-4 py-2 text-sm font-medium text-foreground shadow-sm ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2',\n className\n ]\"\n [attr.aria-expanded]=\"open\"\n (click)=\"toggle()\"\n>\n {{ triggerText }}\n</button>\n\n<ng-template #panelTemplate>\n <div\n class=\"min-w-32 overflow-hidden rounded-md border border-border bg-popover p-1 text-popover-foreground shadow-md\"\n >\n <ng-container *ngFor=\"let item of resolvedItems\">\n <div *ngIf=\"item.type === 'separator'\" class=\"-mx-1 my-1 h-px bg-muted\"></div>\n\n <div\n *ngIf=\"item.type === 'label'\"\n [ngClass]=\"['px-2 py-1.5 text-sm font-semibold text-foreground', item.inset ? 'pl-8' : '']\"\n >\n {{ item.label }}\n </div>\n\n <button\n *ngIf=\"!item.type || item.type === 'item'\"\n type=\"button\"\n [disabled]=\"item.disabled\"\n [ngClass]=\"[\n 'relative flex w-full appearance-none box-border cursor-default select-none items-center gap-2 rounded-sm border-0 bg-transparent px-2 py-1.5 text-left text-sm text-foreground outline-none transition-colors hover:bg-accent hover:text-accent-foreground focus-visible:bg-accent focus-visible:text-accent-foreground disabled:pointer-events-none disabled:opacity-50',\n item.inset ? 'pl-8' : ''\n ]\"\n (click)=\"select(item)\"\n >\n <span class=\"inline-flex h-4 w-4 shrink-0 items-center justify-center\">\n <svg\n *ngIf=\"item.checked\"\n viewBox=\"0 0 24 24\"\n class=\"h-3.5 w-3.5 text-foreground\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path d=\"M5 12.5L9.2 16.7L19 7\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path>\n </svg>\n <span *ngIf=\"item.radioSelected\" class=\"h-2 w-2 rounded-full bg-foreground\"></span>\n </span>\n <span class=\"min-w-0 flex-1 truncate\">{{ item.label }}</span>\n <span *ngIf=\"item.shortcut\" class=\"text-xs text-muted-foreground\">{{ item.shortcut }}</span>\n <span *ngIf=\"item.showChevron\" class=\"text-sm text-muted-foreground\">\u203A</span>\n </button>\n </ng-container>\n </div>\n</ng-template>\n" }]
|
|
4036
|
+
args: [{ selector: 'pdm-dropdown-menu', changeDetection: ChangeDetectionStrategy.OnPush, template: "<button\n #triggerEl\n type=\"button\"\n [ngClass]=\"[\n 'inline-flex h-9 appearance-none box-border items-center justify-center rounded-md border border-solid border-input bg-background px-4 py-2 text-sm font-medium text-foreground shadow-sm ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2',\n className\n ]\"\n [attr.aria-expanded]=\"open\"\n (click)=\"toggle()\"\n>\n {{ triggerText }}\n</button>\n\n<ng-template #panelTemplate>\n <div\n class=\"min-w-32 overflow-hidden rounded-md border border-solid border-border bg-popover p-1 text-popover-foreground shadow-md\"\n >\n <ng-container *ngFor=\"let item of resolvedItems\">\n <div *ngIf=\"item.type === 'separator'\" class=\"-mx-1 my-1 h-px bg-muted\"></div>\n\n <div\n *ngIf=\"item.type === 'label'\"\n [ngClass]=\"['px-2 py-1.5 text-sm font-semibold text-foreground', item.inset ? 'pl-8' : '']\"\n >\n {{ item.label }}\n </div>\n\n <button\n *ngIf=\"!item.type || item.type === 'item'\"\n type=\"button\"\n [disabled]=\"item.disabled\"\n [ngClass]=\"[\n 'relative flex w-full appearance-none box-border cursor-default select-none items-center gap-2 rounded-sm border-0 bg-transparent px-2 py-1.5 text-left text-sm text-foreground outline-none transition-colors hover:bg-accent hover:text-accent-foreground focus-visible:bg-accent focus-visible:text-accent-foreground disabled:pointer-events-none disabled:opacity-50',\n item.inset ? 'pl-8' : ''\n ]\"\n (click)=\"select(item)\"\n >\n <span class=\"inline-flex h-4 w-4 shrink-0 items-center justify-center\">\n <svg\n *ngIf=\"item.checked\"\n viewBox=\"0 0 24 24\"\n class=\"h-3.5 w-3.5 text-foreground\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path d=\"M5 12.5L9.2 16.7L19 7\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path>\n </svg>\n <span *ngIf=\"item.radioSelected\" class=\"h-2 w-2 rounded-full bg-foreground\"></span>\n </span>\n <span class=\"min-w-0 flex-1 truncate\">{{ item.label }}</span>\n <span *ngIf=\"item.shortcut\" class=\"text-xs text-muted-foreground\">{{ item.shortcut }}</span>\n <span *ngIf=\"item.showChevron\" class=\"text-sm text-muted-foreground\">\u203A</span>\n </button>\n </ng-container>\n </div>\n</ng-template>\n" }]
|
|
4017
4037
|
}], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i1$1.Overlay }, { type: i0.ViewContainerRef }]; }, propDecorators: { triggerText: [{
|
|
4018
4038
|
type: Input
|
|
4019
4039
|
}], variant: [{
|
|
@@ -4147,7 +4167,7 @@ class PdmDrawerComponent {
|
|
|
4147
4167
|
const base = [
|
|
4148
4168
|
'absolute',
|
|
4149
4169
|
'bg-background',
|
|
4150
|
-
'border',
|
|
4170
|
+
'border border-solid',
|
|
4151
4171
|
'border-border',
|
|
4152
4172
|
'shadow-lg',
|
|
4153
4173
|
'overflow-auto'
|
|
@@ -4191,10 +4211,10 @@ class PdmDrawerComponent {
|
|
|
4191
4211
|
}
|
|
4192
4212
|
}
|
|
4193
4213
|
PdmDrawerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmDrawerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
4194
|
-
PdmDrawerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmDrawerComponent, selector: "pdm-drawer", inputs: { open: "open", position: "position", size: "size", variant: "variant", className: "className", title: "title", description: "description", showHandle: "showHandle", showCloseButton: "showCloseButton", closeOnEsc: "closeOnEsc", closeOnBackdropClick: "closeOnBackdropClick", value: "value", unit: "unit", decrementLabel: "decrementLabel", incrementLabel: "incrementLabel", primaryLabel: "primaryLabel", secondaryLabel: "secondaryLabel", profileTitle: "profileTitle", profileDescription: "profileDescription", nameLabel: "nameLabel", nameValue: "nameValue", usernameLabel: "usernameLabel", usernameValue: "usernameValue", responsivePrimaryLabel: "responsivePrimaryLabel", bars: "bars" }, outputs: { openChange: "openChange", primaryAction: "primaryAction", secondaryAction: "secondaryAction" }, host: { listeners: { "document:keydown.escape": "onEsc()" } }, ngImport: i0, template: "<div *ngIf=\"open\" [ngClass]=\"containerClassName\">\n <!-- Backdrop -->\n <div class=\"absolute inset-0 bg-foreground/30 backdrop-blur-sm\" (click)=\"onBackdropClick()\"></div>\n\n <!-- Panel -->\n <section [ngClass]=\"panelClassName\">\n <!-- Handle visual (solo para bottom) -->\n <div \n *ngIf=\"showHandle && position === 'bottom'\" \n class=\"mx-auto mb-4 mt-2 h-1 w-10 rounded-full bg-border\">\n </div>\n\n <!-- Header (opcional) -->\n <div *ngIf=\"title || description || showCloseButton\" class=\"flex items-start justify-between gap-4 p-6 pb-4\">\n <div *ngIf=\"title || description\" class=\"flex-1 min-w-0\">\n <h3 *ngIf=\"title\" class=\"m-0 text-lg font-semibold leading-none tracking-tight text-foreground\">\n {{ title }}\n </h3>\n <p *ngIf=\"description\" class=\"m-0 mt-1 text-sm text-muted-foreground\">\n {{ description }}\n </p>\n </div>\n \n <button\n *ngIf=\"showCloseButton\"\n type=\"button\"\n class=\"inline-flex h-6 w-6 flex-shrink-0 appearance-none box-border items-center justify-center rounded-sm border-0 bg-transparent p-0 text-foreground opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2\"\n (click)=\"close()\"\n aria-label=\"Close drawer\"\n >\n <svg viewBox=\"0 0 24 24\" class=\"h-4 w-4\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M6 6L18 18M18 6L6 18\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\"></path>\n </svg>\n </button>\n </div>\n\n <!-- Content -->\n <div class=\"px-6 pb-6\">\n <!-- Contenido gen\u00E9rico -->\n <ng-container *ngIf=\"!showLegacyContent\">\n <ng-content></ng-content>\n </ng-container>\n\n <!-- LEGACY: contenido espec\u00EDfico hardcodeado (backward compatibility) -->\n <ng-container *ngIf=\"showLegacyContent\">\n <!-- Variant: drawer -->\n <div *ngIf=\"variant === 'drawer'\" class=\"mx-auto flex max-w-sm flex-col items-center\">\n <div *ngIf=\"value !== ''\" class=\"mt-3 flex w-full items-center justify-center gap-4\">\n <button type=\"button\" class=\"inline-flex h-6 w-6 appearance-none box-border items-center justify-center rounded-full border border-border bg-transparent p-0 text-muted-foreground\">{{ decrementLabel }}</button>\n <div class=\"text-center\">\n <div class=\"text-5xl font-semibold leading-none text-foreground\">{{ value }}</div>\n <div *ngIf=\"unit\" class=\"mt-1 text-xs tracking-wide text-muted-foreground\">{{ unit }}</div>\n </div>\n <button type=\"button\" class=\"inline-flex h-6 w-6 appearance-none box-border items-center justify-center rounded-full border border-border bg-transparent p-0 text-muted-foreground\">{{ incrementLabel }}</button>\n </div>\n\n <div *ngIf=\"bars.length\" class=\"mt-3 flex h-14 w-full items-end gap-1\">\n <div *ngFor=\"let bar of bars\" class=\"flex-1 bg-foreground\" [style.height.px]=\"bar\"></div>\n </div>\n\n <button *ngIf=\"primaryLabel\" type=\"button\" class=\"mt-3 h-9 w-full appearance-none box-border rounded-md bg-primary text-sm font-medium text-primary-foreground\" (click)=\"onPrimaryAction()\">{{ primaryLabel }}</button>\n <button *ngIf=\"secondaryLabel\" type=\"button\" class=\"mt-2 h-9 w-full appearance-none box-border rounded-md border border-input bg-background text-sm font-medium text-foreground\" (click)=\"onSecondaryAction()\">{{ secondaryLabel }}</button>\n </div>\n\n <!-- Variant: responsive-dialog -->\n <div *ngIf=\"variant === 'responsive-dialog'\" class=\"flex flex-col gap-3\">\n <div *ngIf=\"nameLabel && nameValue\">\n <label class=\"mb-1 block text-xs font-medium text-foreground\">{{ nameLabel }}</label>\n <div class=\"h-8 rounded-md border border-border bg-background px-2 py-1 text-xs text-foreground\">{{ nameValue }}</div>\n </div>\n <div *ngIf=\"usernameLabel && usernameValue\">\n <label class=\"mb-1 block text-xs font-medium text-foreground\">{{ usernameLabel }}</label>\n <div class=\"h-8 rounded-md border border-border bg-background px-2 py-1 text-xs text-foreground\">{{ usernameValue }}</div>\n </div>\n\n <button *ngIf=\"responsivePrimaryLabel\" type=\"button\" class=\"mt-3 h-8 w-full appearance-none box-border rounded-md bg-primary text-xs font-medium text-primary-foreground\" (click)=\"onPrimaryAction()\">{{ responsivePrimaryLabel }}</button>\n </div>\n </ng-container>\n </div>\n </section>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
4214
|
+
PdmDrawerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmDrawerComponent, selector: "pdm-drawer", inputs: { open: "open", position: "position", size: "size", variant: "variant", className: "className", title: "title", description: "description", showHandle: "showHandle", showCloseButton: "showCloseButton", closeOnEsc: "closeOnEsc", closeOnBackdropClick: "closeOnBackdropClick", value: "value", unit: "unit", decrementLabel: "decrementLabel", incrementLabel: "incrementLabel", primaryLabel: "primaryLabel", secondaryLabel: "secondaryLabel", profileTitle: "profileTitle", profileDescription: "profileDescription", nameLabel: "nameLabel", nameValue: "nameValue", usernameLabel: "usernameLabel", usernameValue: "usernameValue", responsivePrimaryLabel: "responsivePrimaryLabel", bars: "bars" }, outputs: { openChange: "openChange", primaryAction: "primaryAction", secondaryAction: "secondaryAction" }, host: { listeners: { "document:keydown.escape": "onEsc()" } }, ngImport: i0, template: "<div *ngIf=\"open\" [ngClass]=\"containerClassName\">\n <!-- Backdrop -->\n <div class=\"absolute inset-0 bg-foreground/30 backdrop-blur-sm\" (click)=\"onBackdropClick()\"></div>\n\n <!-- Panel -->\n <section [ngClass]=\"panelClassName\">\n <!-- Handle visual (solo para bottom) -->\n <div \n *ngIf=\"showHandle && position === 'bottom'\" \n class=\"mx-auto mb-4 mt-2 h-1 w-10 rounded-full bg-border\">\n </div>\n\n <!-- Header (opcional) -->\n <div *ngIf=\"title || description || showCloseButton\" class=\"flex items-start justify-between gap-4 p-6 pb-4\">\n <div *ngIf=\"title || description\" class=\"flex-1 min-w-0\">\n <h3 *ngIf=\"title\" class=\"m-0 text-lg font-semibold leading-none tracking-tight text-foreground\">\n {{ title }}\n </h3>\n <p *ngIf=\"description\" class=\"m-0 mt-1 text-sm text-muted-foreground\">\n {{ description }}\n </p>\n </div>\n \n <button\n *ngIf=\"showCloseButton\"\n type=\"button\"\n class=\"inline-flex h-6 w-6 flex-shrink-0 appearance-none box-border items-center justify-center rounded-sm border-0 bg-transparent p-0 text-foreground opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2\"\n (click)=\"close()\"\n aria-label=\"Close drawer\"\n >\n <svg viewBox=\"0 0 24 24\" class=\"h-4 w-4\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M6 6L18 18M18 6L6 18\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\"></path>\n </svg>\n </button>\n </div>\n\n <!-- Content -->\n <div class=\"px-6 pb-6\">\n <!-- Contenido gen\u00E9rico -->\n <ng-container *ngIf=\"!showLegacyContent\">\n <ng-content></ng-content>\n </ng-container>\n\n <!-- LEGACY: contenido espec\u00EDfico hardcodeado (backward compatibility) -->\n <ng-container *ngIf=\"showLegacyContent\">\n <!-- Variant: drawer -->\n <div *ngIf=\"variant === 'drawer'\" class=\"mx-auto flex max-w-sm flex-col items-center\">\n <div *ngIf=\"value !== ''\" class=\"mt-3 flex w-full items-center justify-center gap-4\">\n <button type=\"button\" class=\"inline-flex h-6 w-6 appearance-none box-border items-center justify-center rounded-full border border-solid border-border bg-transparent p-0 text-muted-foreground\">{{ decrementLabel }}</button>\n <div class=\"text-center\">\n <div class=\"text-5xl font-semibold leading-none text-foreground\">{{ value }}</div>\n <div *ngIf=\"unit\" class=\"mt-1 text-xs tracking-wide text-muted-foreground\">{{ unit }}</div>\n </div>\n <button type=\"button\" class=\"inline-flex h-6 w-6 appearance-none box-border items-center justify-center rounded-full border border-solid border-border bg-transparent p-0 text-muted-foreground\">{{ incrementLabel }}</button>\n </div>\n\n <div *ngIf=\"bars.length\" class=\"mt-3 flex h-14 w-full items-end gap-1\">\n <div *ngFor=\"let bar of bars\" class=\"flex-1 bg-foreground\" [style.height.px]=\"bar\"></div>\n </div>\n\n <button *ngIf=\"primaryLabel\" type=\"button\" class=\"mt-3 h-9 w-full appearance-none box-border rounded-md bg-primary text-sm font-medium text-primary-foreground\" (click)=\"onPrimaryAction()\">{{ primaryLabel }}</button>\n <button *ngIf=\"secondaryLabel\" type=\"button\" class=\"mt-2 h-9 w-full appearance-none box-border rounded-md border border-solid border-input bg-background text-sm font-medium text-foreground\" (click)=\"onSecondaryAction()\">{{ secondaryLabel }}</button>\n </div>\n\n <!-- Variant: responsive-dialog -->\n <div *ngIf=\"variant === 'responsive-dialog'\" class=\"flex flex-col gap-3\">\n <div *ngIf=\"nameLabel && nameValue\">\n <label class=\"mb-1 block text-xs font-medium text-foreground\">{{ nameLabel }}</label>\n <div class=\"h-8 rounded-md border border-solid border-border bg-background px-2 py-1 text-xs text-foreground\">{{ nameValue }}</div>\n </div>\n <div *ngIf=\"usernameLabel && usernameValue\">\n <label class=\"mb-1 block text-xs font-medium text-foreground\">{{ usernameLabel }}</label>\n <div class=\"h-8 rounded-md border border-solid border-border bg-background px-2 py-1 text-xs text-foreground\">{{ usernameValue }}</div>\n </div>\n\n <button *ngIf=\"responsivePrimaryLabel\" type=\"button\" class=\"mt-3 h-8 w-full appearance-none box-border rounded-md bg-primary text-xs font-medium text-primary-foreground\" (click)=\"onPrimaryAction()\">{{ responsivePrimaryLabel }}</button>\n </div>\n </ng-container>\n </div>\n </section>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
4195
4215
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmDrawerComponent, decorators: [{
|
|
4196
4216
|
type: Component,
|
|
4197
|
-
args: [{ selector: 'pdm-drawer', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div *ngIf=\"open\" [ngClass]=\"containerClassName\">\n <!-- Backdrop -->\n <div class=\"absolute inset-0 bg-foreground/30 backdrop-blur-sm\" (click)=\"onBackdropClick()\"></div>\n\n <!-- Panel -->\n <section [ngClass]=\"panelClassName\">\n <!-- Handle visual (solo para bottom) -->\n <div \n *ngIf=\"showHandle && position === 'bottom'\" \n class=\"mx-auto mb-4 mt-2 h-1 w-10 rounded-full bg-border\">\n </div>\n\n <!-- Header (opcional) -->\n <div *ngIf=\"title || description || showCloseButton\" class=\"flex items-start justify-between gap-4 p-6 pb-4\">\n <div *ngIf=\"title || description\" class=\"flex-1 min-w-0\">\n <h3 *ngIf=\"title\" class=\"m-0 text-lg font-semibold leading-none tracking-tight text-foreground\">\n {{ title }}\n </h3>\n <p *ngIf=\"description\" class=\"m-0 mt-1 text-sm text-muted-foreground\">\n {{ description }}\n </p>\n </div>\n \n <button\n *ngIf=\"showCloseButton\"\n type=\"button\"\n class=\"inline-flex h-6 w-6 flex-shrink-0 appearance-none box-border items-center justify-center rounded-sm border-0 bg-transparent p-0 text-foreground opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2\"\n (click)=\"close()\"\n aria-label=\"Close drawer\"\n >\n <svg viewBox=\"0 0 24 24\" class=\"h-4 w-4\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M6 6L18 18M18 6L6 18\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\"></path>\n </svg>\n </button>\n </div>\n\n <!-- Content -->\n <div class=\"px-6 pb-6\">\n <!-- Contenido gen\u00E9rico -->\n <ng-container *ngIf=\"!showLegacyContent\">\n <ng-content></ng-content>\n </ng-container>\n\n <!-- LEGACY: contenido espec\u00EDfico hardcodeado (backward compatibility) -->\n <ng-container *ngIf=\"showLegacyContent\">\n <!-- Variant: drawer -->\n <div *ngIf=\"variant === 'drawer'\" class=\"mx-auto flex max-w-sm flex-col items-center\">\n <div *ngIf=\"value !== ''\" class=\"mt-3 flex w-full items-center justify-center gap-4\">\n <button type=\"button\" class=\"inline-flex h-6 w-6 appearance-none box-border items-center justify-center rounded-full border border-border bg-transparent p-0 text-muted-foreground\">{{ decrementLabel }}</button>\n <div class=\"text-center\">\n <div class=\"text-5xl font-semibold leading-none text-foreground\">{{ value }}</div>\n <div *ngIf=\"unit\" class=\"mt-1 text-xs tracking-wide text-muted-foreground\">{{ unit }}</div>\n </div>\n <button type=\"button\" class=\"inline-flex h-6 w-6 appearance-none box-border items-center justify-center rounded-full border border-border bg-transparent p-0 text-muted-foreground\">{{ incrementLabel }}</button>\n </div>\n\n <div *ngIf=\"bars.length\" class=\"mt-3 flex h-14 w-full items-end gap-1\">\n <div *ngFor=\"let bar of bars\" class=\"flex-1 bg-foreground\" [style.height.px]=\"bar\"></div>\n </div>\n\n <button *ngIf=\"primaryLabel\" type=\"button\" class=\"mt-3 h-9 w-full appearance-none box-border rounded-md bg-primary text-sm font-medium text-primary-foreground\" (click)=\"onPrimaryAction()\">{{ primaryLabel }}</button>\n <button *ngIf=\"secondaryLabel\" type=\"button\" class=\"mt-2 h-9 w-full appearance-none box-border rounded-md border border-input bg-background text-sm font-medium text-foreground\" (click)=\"onSecondaryAction()\">{{ secondaryLabel }}</button>\n </div>\n\n <!-- Variant: responsive-dialog -->\n <div *ngIf=\"variant === 'responsive-dialog'\" class=\"flex flex-col gap-3\">\n <div *ngIf=\"nameLabel && nameValue\">\n <label class=\"mb-1 block text-xs font-medium text-foreground\">{{ nameLabel }}</label>\n <div class=\"h-8 rounded-md border border-border bg-background px-2 py-1 text-xs text-foreground\">{{ nameValue }}</div>\n </div>\n <div *ngIf=\"usernameLabel && usernameValue\">\n <label class=\"mb-1 block text-xs font-medium text-foreground\">{{ usernameLabel }}</label>\n <div class=\"h-8 rounded-md border border-border bg-background px-2 py-1 text-xs text-foreground\">{{ usernameValue }}</div>\n </div>\n\n <button *ngIf=\"responsivePrimaryLabel\" type=\"button\" class=\"mt-3 h-8 w-full appearance-none box-border rounded-md bg-primary text-xs font-medium text-primary-foreground\" (click)=\"onPrimaryAction()\">{{ responsivePrimaryLabel }}</button>\n </div>\n </ng-container>\n </div>\n </section>\n</div>\n" }]
|
|
4217
|
+
args: [{ selector: 'pdm-drawer', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div *ngIf=\"open\" [ngClass]=\"containerClassName\">\n <!-- Backdrop -->\n <div class=\"absolute inset-0 bg-foreground/30 backdrop-blur-sm\" (click)=\"onBackdropClick()\"></div>\n\n <!-- Panel -->\n <section [ngClass]=\"panelClassName\">\n <!-- Handle visual (solo para bottom) -->\n <div \n *ngIf=\"showHandle && position === 'bottom'\" \n class=\"mx-auto mb-4 mt-2 h-1 w-10 rounded-full bg-border\">\n </div>\n\n <!-- Header (opcional) -->\n <div *ngIf=\"title || description || showCloseButton\" class=\"flex items-start justify-between gap-4 p-6 pb-4\">\n <div *ngIf=\"title || description\" class=\"flex-1 min-w-0\">\n <h3 *ngIf=\"title\" class=\"m-0 text-lg font-semibold leading-none tracking-tight text-foreground\">\n {{ title }}\n </h3>\n <p *ngIf=\"description\" class=\"m-0 mt-1 text-sm text-muted-foreground\">\n {{ description }}\n </p>\n </div>\n \n <button\n *ngIf=\"showCloseButton\"\n type=\"button\"\n class=\"inline-flex h-6 w-6 flex-shrink-0 appearance-none box-border items-center justify-center rounded-sm border-0 bg-transparent p-0 text-foreground opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2\"\n (click)=\"close()\"\n aria-label=\"Close drawer\"\n >\n <svg viewBox=\"0 0 24 24\" class=\"h-4 w-4\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M6 6L18 18M18 6L6 18\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\"></path>\n </svg>\n </button>\n </div>\n\n <!-- Content -->\n <div class=\"px-6 pb-6\">\n <!-- Contenido gen\u00E9rico -->\n <ng-container *ngIf=\"!showLegacyContent\">\n <ng-content></ng-content>\n </ng-container>\n\n <!-- LEGACY: contenido espec\u00EDfico hardcodeado (backward compatibility) -->\n <ng-container *ngIf=\"showLegacyContent\">\n <!-- Variant: drawer -->\n <div *ngIf=\"variant === 'drawer'\" class=\"mx-auto flex max-w-sm flex-col items-center\">\n <div *ngIf=\"value !== ''\" class=\"mt-3 flex w-full items-center justify-center gap-4\">\n <button type=\"button\" class=\"inline-flex h-6 w-6 appearance-none box-border items-center justify-center rounded-full border border-solid border-border bg-transparent p-0 text-muted-foreground\">{{ decrementLabel }}</button>\n <div class=\"text-center\">\n <div class=\"text-5xl font-semibold leading-none text-foreground\">{{ value }}</div>\n <div *ngIf=\"unit\" class=\"mt-1 text-xs tracking-wide text-muted-foreground\">{{ unit }}</div>\n </div>\n <button type=\"button\" class=\"inline-flex h-6 w-6 appearance-none box-border items-center justify-center rounded-full border border-solid border-border bg-transparent p-0 text-muted-foreground\">{{ incrementLabel }}</button>\n </div>\n\n <div *ngIf=\"bars.length\" class=\"mt-3 flex h-14 w-full items-end gap-1\">\n <div *ngFor=\"let bar of bars\" class=\"flex-1 bg-foreground\" [style.height.px]=\"bar\"></div>\n </div>\n\n <button *ngIf=\"primaryLabel\" type=\"button\" class=\"mt-3 h-9 w-full appearance-none box-border rounded-md bg-primary text-sm font-medium text-primary-foreground\" (click)=\"onPrimaryAction()\">{{ primaryLabel }}</button>\n <button *ngIf=\"secondaryLabel\" type=\"button\" class=\"mt-2 h-9 w-full appearance-none box-border rounded-md border border-solid border-input bg-background text-sm font-medium text-foreground\" (click)=\"onSecondaryAction()\">{{ secondaryLabel }}</button>\n </div>\n\n <!-- Variant: responsive-dialog -->\n <div *ngIf=\"variant === 'responsive-dialog'\" class=\"flex flex-col gap-3\">\n <div *ngIf=\"nameLabel && nameValue\">\n <label class=\"mb-1 block text-xs font-medium text-foreground\">{{ nameLabel }}</label>\n <div class=\"h-8 rounded-md border border-solid border-border bg-background px-2 py-1 text-xs text-foreground\">{{ nameValue }}</div>\n </div>\n <div *ngIf=\"usernameLabel && usernameValue\">\n <label class=\"mb-1 block text-xs font-medium text-foreground\">{{ usernameLabel }}</label>\n <div class=\"h-8 rounded-md border border-solid border-border bg-background px-2 py-1 text-xs text-foreground\">{{ usernameValue }}</div>\n </div>\n\n <button *ngIf=\"responsivePrimaryLabel\" type=\"button\" class=\"mt-3 h-8 w-full appearance-none box-border rounded-md bg-primary text-xs font-medium text-primary-foreground\" (click)=\"onPrimaryAction()\">{{ responsivePrimaryLabel }}</button>\n </div>\n </ng-container>\n </div>\n </section>\n</div>\n" }]
|
|
4198
4218
|
}], propDecorators: { open: [{
|
|
4199
4219
|
type: Input
|
|
4200
4220
|
}], position: [{
|
|
@@ -4272,7 +4292,7 @@ class PdmEmptyComponent {
|
|
|
4272
4292
|
}
|
|
4273
4293
|
get containerClass() {
|
|
4274
4294
|
if (this.variant === 'outline') {
|
|
4275
|
-
return 'border border-dashed border-border rounded-[12px]';
|
|
4295
|
+
return 'border border-solid border-dashed border-border rounded-[12px]';
|
|
4276
4296
|
}
|
|
4277
4297
|
if (this.variant === 'background') {
|
|
4278
4298
|
return 'rounded-[12px] bg-muted';
|
|
@@ -4538,10 +4558,10 @@ class PdmHoverCardComponent {
|
|
|
4538
4558
|
}
|
|
4539
4559
|
}
|
|
4540
4560
|
PdmHoverCardComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmHoverCardComponent, deps: [{ token: i1$1.Overlay }, { token: i0.ViewContainerRef }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
4541
|
-
PdmHoverCardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmHoverCardComponent, selector: "pdm-hover-card", inputs: { className: "className", panelClassName: "panelClassName", side: "side", align: "align", panelWidth: "panelWidth" }, host: { listeners: { "mouseenter": "onMouseEnter()", "mouseleave": "onMouseLeave()", "focusin": "onFocusIn()", "focusout": "onFocusOut()" } }, viewQueries: [{ propertyName: "panelTemplateRef", first: true, predicate: ["panelTemplate"], descendants: true }], ngImport: i0, template: "<div\n class=\"relative inline-flex\"\n [ngClass]=\"className\"\n (mouseenter)=\"onMouseEnter()\"\n (mouseleave)=\"onMouseLeave()\"\n (focusin)=\"onFocusIn()\"\n (focusout)=\"onFocusOut()\"\n>\n <div>\n <ng-content select=\"[pdmHoverTrigger]\"></ng-content>\n </div>\n\n <!-- Template for CDK Overlay -->\n <ng-template #panelTemplate>\n <section\n [style.width.px]=\"panelWidth\"\n class=\"rounded-md border border-border bg-popover p-4 text-popover-foreground shadow-md\"\n >\n <ng-content select=\"[pdmHoverContent]\"></ng-content>\n </section>\n </ng-template>\n</div>\n", styles: [":host{display:inline-flex}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
4561
|
+
PdmHoverCardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmHoverCardComponent, selector: "pdm-hover-card", inputs: { className: "className", panelClassName: "panelClassName", side: "side", align: "align", panelWidth: "panelWidth" }, host: { listeners: { "mouseenter": "onMouseEnter()", "mouseleave": "onMouseLeave()", "focusin": "onFocusIn()", "focusout": "onFocusOut()" } }, viewQueries: [{ propertyName: "panelTemplateRef", first: true, predicate: ["panelTemplate"], descendants: true }], ngImport: i0, template: "<div\n class=\"relative inline-flex\"\n [ngClass]=\"className\"\n (mouseenter)=\"onMouseEnter()\"\n (mouseleave)=\"onMouseLeave()\"\n (focusin)=\"onFocusIn()\"\n (focusout)=\"onFocusOut()\"\n>\n <div>\n <ng-content select=\"[pdmHoverTrigger]\"></ng-content>\n </div>\n\n <!-- Template for CDK Overlay -->\n <ng-template #panelTemplate>\n <section\n [style.width.px]=\"panelWidth\"\n class=\"rounded-md border border-solid border-border bg-popover p-4 text-popover-foreground shadow-md\"\n >\n <ng-content select=\"[pdmHoverContent]\"></ng-content>\n </section>\n </ng-template>\n</div>\n", styles: [":host{display:inline-flex}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
4542
4562
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmHoverCardComponent, decorators: [{
|
|
4543
4563
|
type: Component,
|
|
4544
|
-
args: [{ selector: "pdm-hover-card", changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n class=\"relative inline-flex\"\n [ngClass]=\"className\"\n (mouseenter)=\"onMouseEnter()\"\n (mouseleave)=\"onMouseLeave()\"\n (focusin)=\"onFocusIn()\"\n (focusout)=\"onFocusOut()\"\n>\n <div>\n <ng-content select=\"[pdmHoverTrigger]\"></ng-content>\n </div>\n\n <!-- Template for CDK Overlay -->\n <ng-template #panelTemplate>\n <section\n [style.width.px]=\"panelWidth\"\n class=\"rounded-md border border-border bg-popover p-4 text-popover-foreground shadow-md\"\n >\n <ng-content select=\"[pdmHoverContent]\"></ng-content>\n </section>\n </ng-template>\n</div>\n", styles: [":host{display:inline-flex}\n"] }]
|
|
4564
|
+
args: [{ selector: "pdm-hover-card", changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n class=\"relative inline-flex\"\n [ngClass]=\"className\"\n (mouseenter)=\"onMouseEnter()\"\n (mouseleave)=\"onMouseLeave()\"\n (focusin)=\"onFocusIn()\"\n (focusout)=\"onFocusOut()\"\n>\n <div>\n <ng-content select=\"[pdmHoverTrigger]\"></ng-content>\n </div>\n\n <!-- Template for CDK Overlay -->\n <ng-template #panelTemplate>\n <section\n [style.width.px]=\"panelWidth\"\n class=\"rounded-md border border-solid border-border bg-popover p-4 text-popover-foreground shadow-md\"\n >\n <ng-content select=\"[pdmHoverContent]\"></ng-content>\n </section>\n </ng-template>\n</div>\n", styles: [":host{display:inline-flex}\n"] }]
|
|
4545
4565
|
}], ctorParameters: function () { return [{ type: i1$1.Overlay }, { type: i0.ViewContainerRef }, { type: i0.ElementRef }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { className: [{
|
|
4546
4566
|
type: Input
|
|
4547
4567
|
}], panelClassName: [{
|
|
@@ -4617,10 +4637,10 @@ class PdmInputComponent {
|
|
|
4617
4637
|
}
|
|
4618
4638
|
}
|
|
4619
4639
|
PdmInputComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
4620
|
-
PdmInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmInputComponent, selector: "pdm-input", inputs: { id: "id", type: "type", value: "value", placeholder: "placeholder", disabled: "disabled", readonly: "readonly", required: "required", invalid: "invalid", size: "size", roundness: "roundness", className: "className", inputClassName: "inputClassName", label: "label", helperText: "helperText", errorText: "errorText" }, outputs: { valueChange: "valueChange", blurred: "blurred" }, ngImport: i0, template: "<div [ngClass]=\"['grid w-full gap-3', className]\">\n <label\n *ngIf=\"label\"\n [attr.for]=\"id\"\n [ngClass]=\"[\n 'text-sm font-medium leading-none',\n invalid ? 'text-destructive' : 'text-foreground',\n ]\"\n >{{ label }}</label\n >\n <input\n [id]=\"id\"\n [type]=\"type\"\n [value]=\"value\"\n [placeholder]=\"placeholder\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [required]=\"required\"\n [attr.aria-invalid]=\"invalid\"\n [ngClass]=\"[\n 'border-input focus-visible:border-ring focus-visible:ring-2 focus-visible:ring-ring/50 aria-invalid:ring-2 aria-invalid:ring-destructive aria-invalid:border-destructive aria-invalid:placeholder:text-destructive/70 placeholder:text-muted-foreground w-full min-w-0 appearance-none box-border rounded-lg border bg-transparent px-3 py-1 text-sm shadow-sm transition-colors outline-none file:inline-flex file:h-6 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50',\n size === 'large' ? 'h-10 px-4 text-sm' : '',\n size === 'regular' ? 'h-9 px-3 text-sm' : '',\n size === 'small' ? 'h-8 px-2 text-sm' : '',\n size === 'mini' ? 'h-6 px-1.5 text-xs' : '',\n roundness === 'round' ? 'rounded-full' : 'rounded-lg',\n type === 'file' ? 'text-sm' : 'text-foreground',\n inputClassName,\n ]\"\n (input)=\"onInput($event)\"\n (blur)=\"onBlur($event)\"\n />\n <p *ngIf=\"!invalid && helperText\" class=\"m-0 text-sm text-muted-foreground\">\n {{ helperText }}\n </p>\n <p *ngIf=\"invalid && errorText\" class=\"m-0 text-sm text-destructive\">\n {{ errorText }}\n </p>\n</div>\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
4640
|
+
PdmInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmInputComponent, selector: "pdm-input", inputs: { id: "id", type: "type", value: "value", placeholder: "placeholder", disabled: "disabled", readonly: "readonly", required: "required", invalid: "invalid", size: "size", roundness: "roundness", className: "className", inputClassName: "inputClassName", label: "label", helperText: "helperText", errorText: "errorText" }, outputs: { valueChange: "valueChange", blurred: "blurred" }, ngImport: i0, template: "<div [ngClass]=\"['grid w-full gap-3', className]\">\n <label\n *ngIf=\"label\"\n [attr.for]=\"id\"\n [ngClass]=\"[\n 'text-sm font-medium leading-none',\n invalid ? 'text-destructive' : 'text-foreground',\n ]\"\n >{{ label }}</label\n >\n <input\n [id]=\"id\"\n [type]=\"type\"\n [value]=\"value\"\n [placeholder]=\"placeholder\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [required]=\"required\"\n [attr.aria-invalid]=\"invalid\"\n [ngClass]=\"[\n 'border-input focus-visible:border-ring focus-visible:ring-2 focus-visible:ring-ring/50 aria-invalid:ring-2 aria-invalid:ring-destructive aria-invalid:border-destructive aria-invalid:placeholder:text-destructive/70 placeholder:text-muted-foreground w-full min-w-0 appearance-none box-border rounded-lg border border-solid bg-transparent px-3 py-1 text-sm shadow-sm transition-colors outline-none file:inline-flex file:h-6 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50',\n size === 'large' ? 'h-10 px-4 text-sm' : '',\n size === 'regular' ? 'h-9 px-3 text-sm' : '',\n size === 'small' ? 'h-8 px-2 text-sm' : '',\n size === 'mini' ? 'h-6 px-1.5 text-xs' : '',\n roundness === 'round' ? 'rounded-full' : 'rounded-lg',\n type === 'file' ? 'text-sm' : 'text-foreground',\n inputClassName,\n ]\"\n (input)=\"onInput($event)\"\n (blur)=\"onBlur($event)\"\n />\n <p *ngIf=\"!invalid && helperText\" class=\"m-0 text-sm text-muted-foreground\">\n {{ helperText }}\n </p>\n <p *ngIf=\"invalid && errorText\" class=\"m-0 text-sm text-destructive\">\n {{ errorText }}\n </p>\n</div>\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
4621
4641
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmInputComponent, decorators: [{
|
|
4622
4642
|
type: Component,
|
|
4623
|
-
args: [{ selector: "pdm-input", changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [ngClass]=\"['grid w-full gap-3', className]\">\n <label\n *ngIf=\"label\"\n [attr.for]=\"id\"\n [ngClass]=\"[\n 'text-sm font-medium leading-none',\n invalid ? 'text-destructive' : 'text-foreground',\n ]\"\n >{{ label }}</label\n >\n <input\n [id]=\"id\"\n [type]=\"type\"\n [value]=\"value\"\n [placeholder]=\"placeholder\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [required]=\"required\"\n [attr.aria-invalid]=\"invalid\"\n [ngClass]=\"[\n 'border-input focus-visible:border-ring focus-visible:ring-2 focus-visible:ring-ring/50 aria-invalid:ring-2 aria-invalid:ring-destructive aria-invalid:border-destructive aria-invalid:placeholder:text-destructive/70 placeholder:text-muted-foreground w-full min-w-0 appearance-none box-border rounded-lg border bg-transparent px-3 py-1 text-sm shadow-sm transition-colors outline-none file:inline-flex file:h-6 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50',\n size === 'large' ? 'h-10 px-4 text-sm' : '',\n size === 'regular' ? 'h-9 px-3 text-sm' : '',\n size === 'small' ? 'h-8 px-2 text-sm' : '',\n size === 'mini' ? 'h-6 px-1.5 text-xs' : '',\n roundness === 'round' ? 'rounded-full' : 'rounded-lg',\n type === 'file' ? 'text-sm' : 'text-foreground',\n inputClassName,\n ]\"\n (input)=\"onInput($event)\"\n (blur)=\"onBlur($event)\"\n />\n <p *ngIf=\"!invalid && helperText\" class=\"m-0 text-sm text-muted-foreground\">\n {{ helperText }}\n </p>\n <p *ngIf=\"invalid && errorText\" class=\"m-0 text-sm text-destructive\">\n {{ errorText }}\n </p>\n</div>\n", styles: [":host{display:block}\n"] }]
|
|
4643
|
+
args: [{ selector: "pdm-input", changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [ngClass]=\"['grid w-full gap-3', className]\">\n <label\n *ngIf=\"label\"\n [attr.for]=\"id\"\n [ngClass]=\"[\n 'text-sm font-medium leading-none',\n invalid ? 'text-destructive' : 'text-foreground',\n ]\"\n >{{ label }}</label\n >\n <input\n [id]=\"id\"\n [type]=\"type\"\n [value]=\"value\"\n [placeholder]=\"placeholder\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [required]=\"required\"\n [attr.aria-invalid]=\"invalid\"\n [ngClass]=\"[\n 'border-input focus-visible:border-ring focus-visible:ring-2 focus-visible:ring-ring/50 aria-invalid:ring-2 aria-invalid:ring-destructive aria-invalid:border-destructive aria-invalid:placeholder:text-destructive/70 placeholder:text-muted-foreground w-full min-w-0 appearance-none box-border rounded-lg border border-solid bg-transparent px-3 py-1 text-sm shadow-sm transition-colors outline-none file:inline-flex file:h-6 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50',\n size === 'large' ? 'h-10 px-4 text-sm' : '',\n size === 'regular' ? 'h-9 px-3 text-sm' : '',\n size === 'small' ? 'h-8 px-2 text-sm' : '',\n size === 'mini' ? 'h-6 px-1.5 text-xs' : '',\n roundness === 'round' ? 'rounded-full' : 'rounded-lg',\n type === 'file' ? 'text-sm' : 'text-foreground',\n inputClassName,\n ]\"\n (input)=\"onInput($event)\"\n (blur)=\"onBlur($event)\"\n />\n <p *ngIf=\"!invalid && helperText\" class=\"m-0 text-sm text-muted-foreground\">\n {{ helperText }}\n </p>\n <p *ngIf=\"invalid && errorText\" class=\"m-0 text-sm text-destructive\">\n {{ errorText }}\n </p>\n</div>\n", styles: [":host{display:block}\n"] }]
|
|
4624
4644
|
}], propDecorators: { id: [{
|
|
4625
4645
|
type: Input
|
|
4626
4646
|
}], type: [{
|
|
@@ -4694,10 +4714,10 @@ class PdmInputPasswordComponent {
|
|
|
4694
4714
|
}
|
|
4695
4715
|
}
|
|
4696
4716
|
PdmInputPasswordComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmInputPasswordComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
4697
|
-
PdmInputPasswordComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmInputPasswordComponent, selector: "pdm-input-password", inputs: { id: "id", value: "value", placeholder: "placeholder", disabled: "disabled", readonly: "readonly", required: "required", invalid: "invalid", size: "size", roundness: "roundness", className: "className", inputClassName: "inputClassName", label: "label", helperText: "helperText", errorText: "errorText" }, outputs: { valueChange: "valueChange", blurred: "blurred" }, ngImport: i0, template: "<div [ngClass]=\"['grid w-full gap-3', className]\">\n <label\n *ngIf=\"label\"\n [attr.for]=\"id\"\n [ngClass]=\"[\n 'text-sm font-medium leading-none',\n invalid ? 'text-destructive' : 'text-foreground',\n ]\"\n >{{ label }}</label\n >\n <div class=\"relative\">\n <input\n [id]=\"id\"\n [type]=\"inputType\"\n [value]=\"value\"\n [placeholder]=\"placeholder\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [required]=\"required\"\n [attr.aria-invalid]=\"invalid\"\n [ngClass]=\"[\n 'border-input focus-visible:border-ring focus-visible:ring-2 focus-visible:ring-ring/50 aria-invalid:ring-2 aria-invalid:ring-destructive aria-invalid:border-destructive aria-invalid:placeholder:text-destructive/70 file:text-foreground placeholder:text-muted-foreground w-full min-w-0 appearance-none box-border rounded-lg border bg-transparent px-3 py-1 pr-10 text-sm shadow-sm transition-colors outline-none file:inline-flex file:h-6 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50',\n size === 'large' ? 'h-10 px-4 text-sm' : '',\n size === 'regular' ? 'h-9 px-3 text-sm' : '',\n size === 'small' ? 'h-8 px-2 text-sm' : '',\n size === 'mini' ? 'h-6 px-1.5 text-xs' : '',\n roundness === 'round' ? 'rounded-full' : 'rounded-lg',\n 'text-foreground',\n inputClassName,\n ]\"\n (input)=\"onInput($event)\"\n (blur)=\"onBlur($event)\"\n />\n <button\n type=\"button\"\n class=\"absolute right-2 top-1/2 inline-flex h-6 w-6 -translate-y-1/2 appearance-none box-border items-center justify-center rounded border-0 bg-transparent p-0 text-muted-foreground outline-none transition-colors hover:text-foreground focus:outline-none focus-visible:ring-2 focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-60\"\n [disabled]=\"disabled\"\n [attr.aria-label]=\"showPassword ? 'Hide password' : 'Show password'\"\n (click)=\"toggleVisibility()\"\n >\n <svg\n *ngIf=\"!showPassword\"\n aria-hidden=\"true\"\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n class=\"h-4 w-4\"\n >\n <path\n d=\"M2.062 12.348a1 1 0 0 1 0-.696 10.75 10.75 0 0 1 19.876 0 1 1 0 0 1 0 .696 10.75 10.75 0 0 1-19.876 0\"\n ></path>\n <circle cx=\"12\" cy=\"12\" r=\"3\"></circle>\n </svg>\n <svg\n *ngIf=\"showPassword\"\n aria-hidden=\"true\"\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n class=\"h-4 w-4\"\n >\n <path d=\"M3 3l18 18\"></path>\n <path d=\"M10.58 10.58a2 2 0 1 0 2.83 2.83\"></path>\n <path\n d=\"M9.88 5.09A10.94 10.94 0 0 1 12 4.91c5.05 0 9.27 3.11 10.6 7.09a1 1 0 0 1 0 .64 11.9 11.9 0 0 1-1.84 3.2\"\n ></path>\n <path\n d=\"M6.61 6.61A11.81 11.81 0 0 0 1.4 12a1 1 0 0 0 0 .64 11.83 11.83 0 0 0 8.79 7.54\"\n ></path>\n </svg>\n </button>\n </div>\n <p *ngIf=\"!invalid && helperText\" class=\"m-0 text-sm text-muted-foreground\">\n {{ helperText }}\n </p>\n <p *ngIf=\"invalid && errorText\" class=\"m-0 text-sm text-destructive\">\n {{ errorText }}\n </p>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
4717
|
+
PdmInputPasswordComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmInputPasswordComponent, selector: "pdm-input-password", inputs: { id: "id", value: "value", placeholder: "placeholder", disabled: "disabled", readonly: "readonly", required: "required", invalid: "invalid", size: "size", roundness: "roundness", className: "className", inputClassName: "inputClassName", label: "label", helperText: "helperText", errorText: "errorText" }, outputs: { valueChange: "valueChange", blurred: "blurred" }, ngImport: i0, template: "<div [ngClass]=\"['grid w-full gap-3', className]\">\n <label\n *ngIf=\"label\"\n [attr.for]=\"id\"\n [ngClass]=\"[\n 'text-sm font-medium leading-none',\n invalid ? 'text-destructive' : 'text-foreground',\n ]\"\n >{{ label }}</label\n >\n <div class=\"relative\">\n <input\n [id]=\"id\"\n [type]=\"inputType\"\n [value]=\"value\"\n [placeholder]=\"placeholder\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [required]=\"required\"\n [attr.aria-invalid]=\"invalid\"\n [ngClass]=\"[\n 'border-input focus-visible:border-ring focus-visible:ring-2 focus-visible:ring-ring/50 aria-invalid:ring-2 aria-invalid:ring-destructive aria-invalid:border-destructive aria-invalid:placeholder:text-destructive/70 file:text-foreground placeholder:text-muted-foreground w-full min-w-0 appearance-none box-border rounded-lg border border-solid bg-transparent px-3 py-1 pr-10 text-sm shadow-sm transition-colors outline-none file:inline-flex file:h-6 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50',\n size === 'large' ? 'h-10 px-4 text-sm' : '',\n size === 'regular' ? 'h-9 px-3 text-sm' : '',\n size === 'small' ? 'h-8 px-2 text-sm' : '',\n size === 'mini' ? 'h-6 px-1.5 text-xs' : '',\n roundness === 'round' ? 'rounded-full' : 'rounded-lg',\n 'text-foreground',\n inputClassName,\n ]\"\n (input)=\"onInput($event)\"\n (blur)=\"onBlur($event)\"\n />\n <button\n type=\"button\"\n class=\"absolute right-2 top-1/2 inline-flex h-6 w-6 -translate-y-1/2 appearance-none box-border items-center justify-center rounded border-0 bg-transparent p-0 text-muted-foreground outline-none transition-colors hover:text-foreground focus:outline-none focus-visible:ring-2 focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-60\"\n [disabled]=\"disabled\"\n [attr.aria-label]=\"showPassword ? 'Hide password' : 'Show password'\"\n (click)=\"toggleVisibility()\"\n >\n <svg\n *ngIf=\"!showPassword\"\n aria-hidden=\"true\"\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n class=\"h-4 w-4\"\n >\n <path\n d=\"M2.062 12.348a1 1 0 0 1 0-.696 10.75 10.75 0 0 1 19.876 0 1 1 0 0 1 0 .696 10.75 10.75 0 0 1-19.876 0\"\n ></path>\n <circle cx=\"12\" cy=\"12\" r=\"3\"></circle>\n </svg>\n <svg\n *ngIf=\"showPassword\"\n aria-hidden=\"true\"\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n class=\"h-4 w-4\"\n >\n <path d=\"M3 3l18 18\"></path>\n <path d=\"M10.58 10.58a2 2 0 1 0 2.83 2.83\"></path>\n <path\n d=\"M9.88 5.09A10.94 10.94 0 0 1 12 4.91c5.05 0 9.27 3.11 10.6 7.09a1 1 0 0 1 0 .64 11.9 11.9 0 0 1-1.84 3.2\"\n ></path>\n <path\n d=\"M6.61 6.61A11.81 11.81 0 0 0 1.4 12a1 1 0 0 0 0 .64 11.83 11.83 0 0 0 8.79 7.54\"\n ></path>\n </svg>\n </button>\n </div>\n <p *ngIf=\"!invalid && helperText\" class=\"m-0 text-sm text-muted-foreground\">\n {{ helperText }}\n </p>\n <p *ngIf=\"invalid && errorText\" class=\"m-0 text-sm text-destructive\">\n {{ errorText }}\n </p>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
4698
4718
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmInputPasswordComponent, decorators: [{
|
|
4699
4719
|
type: Component,
|
|
4700
|
-
args: [{ selector: 'pdm-input-password', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [ngClass]=\"['grid w-full gap-3', className]\">\n <label\n *ngIf=\"label\"\n [attr.for]=\"id\"\n [ngClass]=\"[\n 'text-sm font-medium leading-none',\n invalid ? 'text-destructive' : 'text-foreground',\n ]\"\n >{{ label }}</label\n >\n <div class=\"relative\">\n <input\n [id]=\"id\"\n [type]=\"inputType\"\n [value]=\"value\"\n [placeholder]=\"placeholder\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [required]=\"required\"\n [attr.aria-invalid]=\"invalid\"\n [ngClass]=\"[\n 'border-input focus-visible:border-ring focus-visible:ring-2 focus-visible:ring-ring/50 aria-invalid:ring-2 aria-invalid:ring-destructive aria-invalid:border-destructive aria-invalid:placeholder:text-destructive/70 file:text-foreground placeholder:text-muted-foreground w-full min-w-0 appearance-none box-border rounded-lg border bg-transparent px-3 py-1 pr-10 text-sm shadow-sm transition-colors outline-none file:inline-flex file:h-6 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50',\n size === 'large' ? 'h-10 px-4 text-sm' : '',\n size === 'regular' ? 'h-9 px-3 text-sm' : '',\n size === 'small' ? 'h-8 px-2 text-sm' : '',\n size === 'mini' ? 'h-6 px-1.5 text-xs' : '',\n roundness === 'round' ? 'rounded-full' : 'rounded-lg',\n 'text-foreground',\n inputClassName,\n ]\"\n (input)=\"onInput($event)\"\n (blur)=\"onBlur($event)\"\n />\n <button\n type=\"button\"\n class=\"absolute right-2 top-1/2 inline-flex h-6 w-6 -translate-y-1/2 appearance-none box-border items-center justify-center rounded border-0 bg-transparent p-0 text-muted-foreground outline-none transition-colors hover:text-foreground focus:outline-none focus-visible:ring-2 focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-60\"\n [disabled]=\"disabled\"\n [attr.aria-label]=\"showPassword ? 'Hide password' : 'Show password'\"\n (click)=\"toggleVisibility()\"\n >\n <svg\n *ngIf=\"!showPassword\"\n aria-hidden=\"true\"\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n class=\"h-4 w-4\"\n >\n <path\n d=\"M2.062 12.348a1 1 0 0 1 0-.696 10.75 10.75 0 0 1 19.876 0 1 1 0 0 1 0 .696 10.75 10.75 0 0 1-19.876 0\"\n ></path>\n <circle cx=\"12\" cy=\"12\" r=\"3\"></circle>\n </svg>\n <svg\n *ngIf=\"showPassword\"\n aria-hidden=\"true\"\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n class=\"h-4 w-4\"\n >\n <path d=\"M3 3l18 18\"></path>\n <path d=\"M10.58 10.58a2 2 0 1 0 2.83 2.83\"></path>\n <path\n d=\"M9.88 5.09A10.94 10.94 0 0 1 12 4.91c5.05 0 9.27 3.11 10.6 7.09a1 1 0 0 1 0 .64 11.9 11.9 0 0 1-1.84 3.2\"\n ></path>\n <path\n d=\"M6.61 6.61A11.81 11.81 0 0 0 1.4 12a1 1 0 0 0 0 .64 11.83 11.83 0 0 0 8.79 7.54\"\n ></path>\n </svg>\n </button>\n </div>\n <p *ngIf=\"!invalid && helperText\" class=\"m-0 text-sm text-muted-foreground\">\n {{ helperText }}\n </p>\n <p *ngIf=\"invalid && errorText\" class=\"m-0 text-sm text-destructive\">\n {{ errorText }}\n </p>\n</div>\n" }]
|
|
4720
|
+
args: [{ selector: 'pdm-input-password', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [ngClass]=\"['grid w-full gap-3', className]\">\n <label\n *ngIf=\"label\"\n [attr.for]=\"id\"\n [ngClass]=\"[\n 'text-sm font-medium leading-none',\n invalid ? 'text-destructive' : 'text-foreground',\n ]\"\n >{{ label }}</label\n >\n <div class=\"relative\">\n <input\n [id]=\"id\"\n [type]=\"inputType\"\n [value]=\"value\"\n [placeholder]=\"placeholder\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [required]=\"required\"\n [attr.aria-invalid]=\"invalid\"\n [ngClass]=\"[\n 'border-input focus-visible:border-ring focus-visible:ring-2 focus-visible:ring-ring/50 aria-invalid:ring-2 aria-invalid:ring-destructive aria-invalid:border-destructive aria-invalid:placeholder:text-destructive/70 file:text-foreground placeholder:text-muted-foreground w-full min-w-0 appearance-none box-border rounded-lg border border-solid bg-transparent px-3 py-1 pr-10 text-sm shadow-sm transition-colors outline-none file:inline-flex file:h-6 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50',\n size === 'large' ? 'h-10 px-4 text-sm' : '',\n size === 'regular' ? 'h-9 px-3 text-sm' : '',\n size === 'small' ? 'h-8 px-2 text-sm' : '',\n size === 'mini' ? 'h-6 px-1.5 text-xs' : '',\n roundness === 'round' ? 'rounded-full' : 'rounded-lg',\n 'text-foreground',\n inputClassName,\n ]\"\n (input)=\"onInput($event)\"\n (blur)=\"onBlur($event)\"\n />\n <button\n type=\"button\"\n class=\"absolute right-2 top-1/2 inline-flex h-6 w-6 -translate-y-1/2 appearance-none box-border items-center justify-center rounded border-0 bg-transparent p-0 text-muted-foreground outline-none transition-colors hover:text-foreground focus:outline-none focus-visible:ring-2 focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-60\"\n [disabled]=\"disabled\"\n [attr.aria-label]=\"showPassword ? 'Hide password' : 'Show password'\"\n (click)=\"toggleVisibility()\"\n >\n <svg\n *ngIf=\"!showPassword\"\n aria-hidden=\"true\"\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n class=\"h-4 w-4\"\n >\n <path\n d=\"M2.062 12.348a1 1 0 0 1 0-.696 10.75 10.75 0 0 1 19.876 0 1 1 0 0 1 0 .696 10.75 10.75 0 0 1-19.876 0\"\n ></path>\n <circle cx=\"12\" cy=\"12\" r=\"3\"></circle>\n </svg>\n <svg\n *ngIf=\"showPassword\"\n aria-hidden=\"true\"\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n class=\"h-4 w-4\"\n >\n <path d=\"M3 3l18 18\"></path>\n <path d=\"M10.58 10.58a2 2 0 1 0 2.83 2.83\"></path>\n <path\n d=\"M9.88 5.09A10.94 10.94 0 0 1 12 4.91c5.05 0 9.27 3.11 10.6 7.09a1 1 0 0 1 0 .64 11.9 11.9 0 0 1-1.84 3.2\"\n ></path>\n <path\n d=\"M6.61 6.61A11.81 11.81 0 0 0 1.4 12a1 1 0 0 0 0 .64 11.83 11.83 0 0 0 8.79 7.54\"\n ></path>\n </svg>\n </button>\n </div>\n <p *ngIf=\"!invalid && helperText\" class=\"m-0 text-sm text-muted-foreground\">\n {{ helperText }}\n </p>\n <p *ngIf=\"invalid && errorText\" class=\"m-0 text-sm text-destructive\">\n {{ errorText }}\n </p>\n</div>\n" }]
|
|
4701
4721
|
}], propDecorators: { id: [{
|
|
4702
4722
|
type: Input
|
|
4703
4723
|
}], value: [{
|
|
@@ -4757,10 +4777,10 @@ class PdmInputGroupComponent {
|
|
|
4757
4777
|
}
|
|
4758
4778
|
}
|
|
4759
4779
|
PdmInputGroupComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmInputGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
4760
|
-
PdmInputGroupComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmInputGroupComponent, selector: "pdm-input-group", inputs: { id: "id", type: "type", value: "value", placeholder: "placeholder", disabled: "disabled", invalid: "invalid", prefixText: "prefixText", suffixText: "suffixText", prefixIcon: "prefixIcon", suffixIcon: "suffixIcon", buttonText: "buttonText", className: "className" }, outputs: { valueChange: "valueChange", buttonClick: "buttonClick" }, ngImport: i0, template: "<div\n [ngClass]=\"[\n 'flex w-full flex-col items-stretch gap-2 sm:flex-row sm:items-center',\n disabled ? 'opacity-50' : '',\n className,\n ]\"\n>\n <div\n [ngClass]=\"[\n 'flex h-9 min-w-0 flex-1 box-border items-center overflow-hidden rounded-md border border-input bg-transparent px-3 py-1 text-sm text-foreground shadow-sm transition-colors focus-within:border-ring focus-within:ring-2 focus-within:ring-ring/50',\n invalid ? 'border-destructive focus-within:ring-destructive' : '',\n disabled ? 'cursor-not-allowed' : '',\n ]\"\n >\n <div\n *ngIf=\"prefixText || prefixIcon\"\n class=\"inline-flex h-full shrink-0 items-center gap-2 pr-2 text-sm text-muted-foreground\"\n >\n <pdm-icon *ngIf=\"prefixIcon\" [name]=\"prefixIcon\" [size]=\"16\"></pdm-icon>\n <span *ngIf=\"prefixText\">{{ prefixText }}</span>\n <ng-content select=\"[pdmInputGroupPrefix]\"></ng-content>\n </div>\n\n <input\n [id]=\"id\"\n [type]=\"type\"\n [value]=\"value\"\n [placeholder]=\"placeholder\"\n [disabled]=\"disabled\"\n [attr.aria-invalid]=\"invalid\"\n [ngClass]=\"[\n 'h-full min-w-0 flex-1 appearance-none box-border border-0 bg-transparent p-0 text-sm text-foreground outline-none placeholder:text-muted-foreground aria-invalid:placeholder:text-destructive/70',\n type === 'file'\n ? 'text-sm file:mr-2 file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground'\n : '',\n ]\"\n (input)=\"onInput($event)\"\n />\n\n <div\n *ngIf=\"!buttonText && (suffixText || suffixIcon)\"\n class=\"inline-flex h-full shrink-0 items-center gap-2 pl-2 text-sm text-muted-foreground\"\n >\n <pdm-icon *ngIf=\"suffixIcon\" [name]=\"suffixIcon\" [size]=\"16\"></pdm-icon>\n <span *ngIf=\"suffixText\" class=\"font-medium\">{{ suffixText }}</span>\n <ng-content select=\"[pdmInputGroupSuffix]\"></ng-content>\n </div>\n </div>\n\n <button\n *ngIf=\"buttonText\"\n type=\"button\"\n [disabled]=\"disabled\"\n class=\"inline-flex h-9 w-full shrink-0 appearance-none box-border items-center justify-center rounded-md border border-input bg-background px-4 py-2 text-sm font-medium text-foreground shadow-sm outline-none transition-colors focus-visible:ring-2 focus-visible:ring-ring/50 disabled:cursor-not-allowed sm:w-auto\"\n (click)=\"onButtonClick($event)\"\n >\n {{ buttonText }}\n </button>\n</div>\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: PdmIconComponent, selector: "pdm-icon", inputs: ["name", "library", "assetUrl", "size", "strokeWidth", "className", "ariaLabel", "decorative"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
4780
|
+
PdmInputGroupComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmInputGroupComponent, selector: "pdm-input-group", inputs: { id: "id", type: "type", value: "value", placeholder: "placeholder", disabled: "disabled", invalid: "invalid", prefixText: "prefixText", suffixText: "suffixText", prefixIcon: "prefixIcon", suffixIcon: "suffixIcon", buttonText: "buttonText", className: "className" }, outputs: { valueChange: "valueChange", buttonClick: "buttonClick" }, ngImport: i0, template: "<div\n [ngClass]=\"[\n 'flex w-full flex-col items-stretch gap-2 sm:flex-row sm:items-center',\n disabled ? 'opacity-50' : '',\n className,\n ]\"\n>\n <div\n [ngClass]=\"[\n 'flex h-9 min-w-0 flex-1 box-border items-center overflow-hidden rounded-md border border-solid border-input bg-transparent px-3 py-1 text-sm text-foreground shadow-sm transition-colors focus-within:border-ring focus-within:ring-2 focus-within:ring-ring/50',\n invalid ? 'border-destructive focus-within:ring-destructive' : '',\n disabled ? 'cursor-not-allowed' : '',\n ]\"\n >\n <div\n *ngIf=\"prefixText || prefixIcon\"\n class=\"inline-flex h-full shrink-0 items-center gap-2 pr-2 text-sm text-muted-foreground\"\n >\n <pdm-icon *ngIf=\"prefixIcon\" [name]=\"prefixIcon\" [size]=\"16\"></pdm-icon>\n <span *ngIf=\"prefixText\">{{ prefixText }}</span>\n <ng-content select=\"[pdmInputGroupPrefix]\"></ng-content>\n </div>\n\n <input\n [id]=\"id\"\n [type]=\"type\"\n [value]=\"value\"\n [placeholder]=\"placeholder\"\n [disabled]=\"disabled\"\n [attr.aria-invalid]=\"invalid\"\n [ngClass]=\"[\n 'h-full min-w-0 flex-1 appearance-none box-border border-0 bg-transparent p-0 text-sm text-foreground outline-none placeholder:text-muted-foreground aria-invalid:placeholder:text-destructive/70',\n type === 'file'\n ? 'text-sm file:mr-2 file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground'\n : '',\n ]\"\n (input)=\"onInput($event)\"\n />\n\n <div\n *ngIf=\"!buttonText && (suffixText || suffixIcon)\"\n class=\"inline-flex h-full shrink-0 items-center gap-2 pl-2 text-sm text-muted-foreground\"\n >\n <pdm-icon *ngIf=\"suffixIcon\" [name]=\"suffixIcon\" [size]=\"16\"></pdm-icon>\n <span *ngIf=\"suffixText\" class=\"font-medium\">{{ suffixText }}</span>\n <ng-content select=\"[pdmInputGroupSuffix]\"></ng-content>\n </div>\n </div>\n\n <button\n *ngIf=\"buttonText\"\n type=\"button\"\n [disabled]=\"disabled\"\n class=\"inline-flex h-9 w-full shrink-0 appearance-none box-border items-center justify-center rounded-md border border-solid border-input bg-background px-4 py-2 text-sm font-medium text-foreground shadow-sm outline-none transition-colors focus-visible:ring-2 focus-visible:ring-ring/50 disabled:cursor-not-allowed sm:w-auto\"\n (click)=\"onButtonClick($event)\"\n >\n {{ buttonText }}\n </button>\n</div>\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: PdmIconComponent, selector: "pdm-icon", inputs: ["name", "library", "assetUrl", "size", "strokeWidth", "className", "ariaLabel", "decorative"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
4761
4781
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmInputGroupComponent, decorators: [{
|
|
4762
4782
|
type: Component,
|
|
4763
|
-
args: [{ selector: "pdm-input-group", changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n [ngClass]=\"[\n 'flex w-full flex-col items-stretch gap-2 sm:flex-row sm:items-center',\n disabled ? 'opacity-50' : '',\n className,\n ]\"\n>\n <div\n [ngClass]=\"[\n 'flex h-9 min-w-0 flex-1 box-border items-center overflow-hidden rounded-md border border-input bg-transparent px-3 py-1 text-sm text-foreground shadow-sm transition-colors focus-within:border-ring focus-within:ring-2 focus-within:ring-ring/50',\n invalid ? 'border-destructive focus-within:ring-destructive' : '',\n disabled ? 'cursor-not-allowed' : '',\n ]\"\n >\n <div\n *ngIf=\"prefixText || prefixIcon\"\n class=\"inline-flex h-full shrink-0 items-center gap-2 pr-2 text-sm text-muted-foreground\"\n >\n <pdm-icon *ngIf=\"prefixIcon\" [name]=\"prefixIcon\" [size]=\"16\"></pdm-icon>\n <span *ngIf=\"prefixText\">{{ prefixText }}</span>\n <ng-content select=\"[pdmInputGroupPrefix]\"></ng-content>\n </div>\n\n <input\n [id]=\"id\"\n [type]=\"type\"\n [value]=\"value\"\n [placeholder]=\"placeholder\"\n [disabled]=\"disabled\"\n [attr.aria-invalid]=\"invalid\"\n [ngClass]=\"[\n 'h-full min-w-0 flex-1 appearance-none box-border border-0 bg-transparent p-0 text-sm text-foreground outline-none placeholder:text-muted-foreground aria-invalid:placeholder:text-destructive/70',\n type === 'file'\n ? 'text-sm file:mr-2 file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground'\n : '',\n ]\"\n (input)=\"onInput($event)\"\n />\n\n <div\n *ngIf=\"!buttonText && (suffixText || suffixIcon)\"\n class=\"inline-flex h-full shrink-0 items-center gap-2 pl-2 text-sm text-muted-foreground\"\n >\n <pdm-icon *ngIf=\"suffixIcon\" [name]=\"suffixIcon\" [size]=\"16\"></pdm-icon>\n <span *ngIf=\"suffixText\" class=\"font-medium\">{{ suffixText }}</span>\n <ng-content select=\"[pdmInputGroupSuffix]\"></ng-content>\n </div>\n </div>\n\n <button\n *ngIf=\"buttonText\"\n type=\"button\"\n [disabled]=\"disabled\"\n class=\"inline-flex h-9 w-full shrink-0 appearance-none box-border items-center justify-center rounded-md border border-input bg-background px-4 py-2 text-sm font-medium text-foreground shadow-sm outline-none transition-colors focus-visible:ring-2 focus-visible:ring-ring/50 disabled:cursor-not-allowed sm:w-auto\"\n (click)=\"onButtonClick($event)\"\n >\n {{ buttonText }}\n </button>\n</div>\n", styles: [":host{display:block}\n"] }]
|
|
4783
|
+
args: [{ selector: "pdm-input-group", changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n [ngClass]=\"[\n 'flex w-full flex-col items-stretch gap-2 sm:flex-row sm:items-center',\n disabled ? 'opacity-50' : '',\n className,\n ]\"\n>\n <div\n [ngClass]=\"[\n 'flex h-9 min-w-0 flex-1 box-border items-center overflow-hidden rounded-md border border-solid border-input bg-transparent px-3 py-1 text-sm text-foreground shadow-sm transition-colors focus-within:border-ring focus-within:ring-2 focus-within:ring-ring/50',\n invalid ? 'border-destructive focus-within:ring-destructive' : '',\n disabled ? 'cursor-not-allowed' : '',\n ]\"\n >\n <div\n *ngIf=\"prefixText || prefixIcon\"\n class=\"inline-flex h-full shrink-0 items-center gap-2 pr-2 text-sm text-muted-foreground\"\n >\n <pdm-icon *ngIf=\"prefixIcon\" [name]=\"prefixIcon\" [size]=\"16\"></pdm-icon>\n <span *ngIf=\"prefixText\">{{ prefixText }}</span>\n <ng-content select=\"[pdmInputGroupPrefix]\"></ng-content>\n </div>\n\n <input\n [id]=\"id\"\n [type]=\"type\"\n [value]=\"value\"\n [placeholder]=\"placeholder\"\n [disabled]=\"disabled\"\n [attr.aria-invalid]=\"invalid\"\n [ngClass]=\"[\n 'h-full min-w-0 flex-1 appearance-none box-border border-0 bg-transparent p-0 text-sm text-foreground outline-none placeholder:text-muted-foreground aria-invalid:placeholder:text-destructive/70',\n type === 'file'\n ? 'text-sm file:mr-2 file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground'\n : '',\n ]\"\n (input)=\"onInput($event)\"\n />\n\n <div\n *ngIf=\"!buttonText && (suffixText || suffixIcon)\"\n class=\"inline-flex h-full shrink-0 items-center gap-2 pl-2 text-sm text-muted-foreground\"\n >\n <pdm-icon *ngIf=\"suffixIcon\" [name]=\"suffixIcon\" [size]=\"16\"></pdm-icon>\n <span *ngIf=\"suffixText\" class=\"font-medium\">{{ suffixText }}</span>\n <ng-content select=\"[pdmInputGroupSuffix]\"></ng-content>\n </div>\n </div>\n\n <button\n *ngIf=\"buttonText\"\n type=\"button\"\n [disabled]=\"disabled\"\n class=\"inline-flex h-9 w-full shrink-0 appearance-none box-border items-center justify-center rounded-md border border-solid border-input bg-background px-4 py-2 text-sm font-medium text-foreground shadow-sm outline-none transition-colors focus-visible:ring-2 focus-visible:ring-ring/50 disabled:cursor-not-allowed sm:w-auto\"\n (click)=\"onButtonClick($event)\"\n >\n {{ buttonText }}\n </button>\n</div>\n", styles: [":host{display:block}\n"] }]
|
|
4764
4784
|
}], propDecorators: { id: [{
|
|
4765
4785
|
type: Input
|
|
4766
4786
|
}], type: [{
|
|
@@ -4851,7 +4871,7 @@ class PdmInputOtpComponent {
|
|
|
4851
4871
|
}
|
|
4852
4872
|
getInputClasses(index) {
|
|
4853
4873
|
const classes = [
|
|
4854
|
-
"h-9 w-9 appearance-none box-border border bg-background text-center text-sm font-normal text-foreground outline-none transition focus:outline-none focus-visible:outline-none",
|
|
4874
|
+
"h-9 w-9 appearance-none box-border border border-solid bg-background text-center text-sm font-normal text-foreground outline-none transition focus:outline-none focus-visible:outline-none",
|
|
4855
4875
|
"shadow-sm",
|
|
4856
4876
|
"focus:border-input focus:ring-1 focus:ring-primary/30",
|
|
4857
4877
|
"disabled:cursor-not-allowed disabled:opacity-50",
|
|
@@ -4940,10 +4960,10 @@ class PdmKbdComponent {
|
|
|
4940
4960
|
}
|
|
4941
4961
|
}
|
|
4942
4962
|
PdmKbdComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmKbdComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
4943
|
-
PdmKbdComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmKbdComponent, selector: "pdm-kbd", inputs: { className: "className" }, ngImport: i0, template: "<kbd [ngClass]=\"['inline-flex h-6 min-w-6 items-center justify-center rounded-md border border-border bg-muted px-1.5 font-mono text-xs font-medium text-muted-foreground', className]\">\n <ng-content></ng-content>\n</kbd>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
4963
|
+
PdmKbdComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmKbdComponent, selector: "pdm-kbd", inputs: { className: "className" }, ngImport: i0, template: "<kbd [ngClass]=\"['inline-flex h-6 min-w-6 items-center justify-center rounded-md border border-solid border-border bg-muted px-1.5 font-mono text-xs font-medium text-muted-foreground', className]\">\n <ng-content></ng-content>\n</kbd>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
4944
4964
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmKbdComponent, decorators: [{
|
|
4945
4965
|
type: Component,
|
|
4946
|
-
args: [{ selector: 'pdm-kbd', changeDetection: ChangeDetectionStrategy.OnPush, template: "<kbd [ngClass]=\"['inline-flex h-6 min-w-6 items-center justify-center rounded-md border border-border bg-muted px-1.5 font-mono text-xs font-medium text-muted-foreground', className]\">\n <ng-content></ng-content>\n</kbd>\n" }]
|
|
4966
|
+
args: [{ selector: 'pdm-kbd', changeDetection: ChangeDetectionStrategy.OnPush, template: "<kbd [ngClass]=\"['inline-flex h-6 min-w-6 items-center justify-center rounded-md border border-solid border-border bg-muted px-1.5 font-mono text-xs font-medium text-muted-foreground', className]\">\n <ng-content></ng-content>\n</kbd>\n" }]
|
|
4947
4967
|
}], propDecorators: { className: [{
|
|
4948
4968
|
type: Input
|
|
4949
4969
|
}] } });
|
|
@@ -5063,10 +5083,10 @@ class PdmMenubarComponent {
|
|
|
5063
5083
|
}
|
|
5064
5084
|
}
|
|
5065
5085
|
PdmMenubarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmMenubarComponent, deps: [{ token: i1$1.Overlay }, { token: i0.ViewContainerRef }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
5066
|
-
PdmMenubarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmMenubarComponent, selector: "pdm-menubar", inputs: { menus: "menus", className: "className", panelClassName: "panelClassName" }, outputs: { itemSelect: "itemSelect" }, host: { listeners: { "document:click": "onDocumentClickOrEsc()", "document:keydown.escape": "onDocumentClickOrEsc()" } }, viewQueries: [{ propertyName: "menuTemplateRef", first: true, predicate: ["menuTemplate"], descendants: true }], ngImport: i0, template: "<nav\n role=\"menubar\"\n [ngClass]=\"[\n 'inline-flex h-9 items-center gap-0.5 rounded-md border border-border bg-background p-1 shadow-sm',\n className,\n ]\"\n>\n <div *ngFor=\"let menu of menus; let i = index\" class=\"relative\">\n <button\n type=\"button\"\n class=\"inline-flex h-7 appearance-none box-border items-center rounded-sm border-0 bg-transparent px-3 text-sm text-foreground hover:bg-accent focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background\"\n [attr.aria-expanded]=\"openIndex === i\"\n (click)=\"toggle(i, $event)\"\n >\n {{ menu.label }}\n </button>\n </div>\n\n <!-- Template for CDK Overlay -->\n <ng-template #menuTemplate>\n <div\n class=\"min-w-40 rounded-md border border-border bg-popover p-1 text-popover-foreground shadow-md sm:min-w-48\"\n >\n <button\n *ngFor=\"let item of menus[openIndex]?.items || []\"\n type=\"button\"\n [disabled]=\"item.disabled || !item.value\"\n class=\"relative flex w-full appearance-none box-border cursor-default select-none items-center rounded-sm border-0 bg-transparent px-2 py-1.5 text-sm outline-none transition-colors hover:bg-accent hover:text-accent-foreground focus-visible:bg-accent focus-visible:text-accent-foreground disabled:pointer-events-none disabled:opacity-50\"\n (click)=\"selectItem(item)\"\n >\n {{ item.label }}\n </button>\n </div>\n </ng-template>\n</nav>\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
5086
|
+
PdmMenubarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmMenubarComponent, selector: "pdm-menubar", inputs: { menus: "menus", className: "className", panelClassName: "panelClassName" }, outputs: { itemSelect: "itemSelect" }, host: { listeners: { "document:click": "onDocumentClickOrEsc()", "document:keydown.escape": "onDocumentClickOrEsc()" } }, viewQueries: [{ propertyName: "menuTemplateRef", first: true, predicate: ["menuTemplate"], descendants: true }], ngImport: i0, template: "<nav\n role=\"menubar\"\n [ngClass]=\"[\n 'inline-flex h-9 items-center gap-0.5 rounded-md border border-solid border-border bg-background p-1 shadow-sm',\n className,\n ]\"\n>\n <div *ngFor=\"let menu of menus; let i = index\" class=\"relative\">\n <button\n type=\"button\"\n class=\"inline-flex h-7 appearance-none box-border items-center rounded-sm border-0 bg-transparent px-3 text-sm text-foreground hover:bg-accent focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background\"\n [attr.aria-expanded]=\"openIndex === i\"\n (click)=\"toggle(i, $event)\"\n >\n {{ menu.label }}\n </button>\n </div>\n\n <!-- Template for CDK Overlay -->\n <ng-template #menuTemplate>\n <div\n class=\"min-w-40 rounded-md border border-solid border-border bg-popover p-1 text-popover-foreground shadow-md sm:min-w-48\"\n >\n <button\n *ngFor=\"let item of menus[openIndex]?.items || []\"\n type=\"button\"\n [disabled]=\"item.disabled || !item.value\"\n class=\"relative flex w-full appearance-none box-border cursor-default select-none items-center rounded-sm border-0 bg-transparent px-2 py-1.5 text-sm outline-none transition-colors hover:bg-accent hover:text-accent-foreground focus-visible:bg-accent focus-visible:text-accent-foreground disabled:pointer-events-none disabled:opacity-50\"\n (click)=\"selectItem(item)\"\n >\n {{ item.label }}\n </button>\n </div>\n </ng-template>\n</nav>\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
5067
5087
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmMenubarComponent, decorators: [{
|
|
5068
5088
|
type: Component,
|
|
5069
|
-
args: [{ selector: "pdm-menubar", changeDetection: ChangeDetectionStrategy.OnPush, template: "<nav\n role=\"menubar\"\n [ngClass]=\"[\n 'inline-flex h-9 items-center gap-0.5 rounded-md border border-border bg-background p-1 shadow-sm',\n className,\n ]\"\n>\n <div *ngFor=\"let menu of menus; let i = index\" class=\"relative\">\n <button\n type=\"button\"\n class=\"inline-flex h-7 appearance-none box-border items-center rounded-sm border-0 bg-transparent px-3 text-sm text-foreground hover:bg-accent focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background\"\n [attr.aria-expanded]=\"openIndex === i\"\n (click)=\"toggle(i, $event)\"\n >\n {{ menu.label }}\n </button>\n </div>\n\n <!-- Template for CDK Overlay -->\n <ng-template #menuTemplate>\n <div\n class=\"min-w-40 rounded-md border border-border bg-popover p-1 text-popover-foreground shadow-md sm:min-w-48\"\n >\n <button\n *ngFor=\"let item of menus[openIndex]?.items || []\"\n type=\"button\"\n [disabled]=\"item.disabled || !item.value\"\n class=\"relative flex w-full appearance-none box-border cursor-default select-none items-center rounded-sm border-0 bg-transparent px-2 py-1.5 text-sm outline-none transition-colors hover:bg-accent hover:text-accent-foreground focus-visible:bg-accent focus-visible:text-accent-foreground disabled:pointer-events-none disabled:opacity-50\"\n (click)=\"selectItem(item)\"\n >\n {{ item.label }}\n </button>\n </div>\n </ng-template>\n</nav>\n", styles: [":host{display:block}\n"] }]
|
|
5089
|
+
args: [{ selector: "pdm-menubar", changeDetection: ChangeDetectionStrategy.OnPush, template: "<nav\n role=\"menubar\"\n [ngClass]=\"[\n 'inline-flex h-9 items-center gap-0.5 rounded-md border border-solid border-border bg-background p-1 shadow-sm',\n className,\n ]\"\n>\n <div *ngFor=\"let menu of menus; let i = index\" class=\"relative\">\n <button\n type=\"button\"\n class=\"inline-flex h-7 appearance-none box-border items-center rounded-sm border-0 bg-transparent px-3 text-sm text-foreground hover:bg-accent focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background\"\n [attr.aria-expanded]=\"openIndex === i\"\n (click)=\"toggle(i, $event)\"\n >\n {{ menu.label }}\n </button>\n </div>\n\n <!-- Template for CDK Overlay -->\n <ng-template #menuTemplate>\n <div\n class=\"min-w-40 rounded-md border border-solid border-border bg-popover p-1 text-popover-foreground shadow-md sm:min-w-48\"\n >\n <button\n *ngFor=\"let item of menus[openIndex]?.items || []\"\n type=\"button\"\n [disabled]=\"item.disabled || !item.value\"\n class=\"relative flex w-full appearance-none box-border cursor-default select-none items-center rounded-sm border-0 bg-transparent px-2 py-1.5 text-sm outline-none transition-colors hover:bg-accent hover:text-accent-foreground focus-visible:bg-accent focus-visible:text-accent-foreground disabled:pointer-events-none disabled:opacity-50\"\n (click)=\"selectItem(item)\"\n >\n {{ item.label }}\n </button>\n </div>\n </ng-template>\n</nav>\n", styles: [":host{display:block}\n"] }]
|
|
5070
5090
|
}], ctorParameters: function () { return [{ type: i1$1.Overlay }, { type: i0.ViewContainerRef }, { type: i0.ElementRef }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { menus: [{
|
|
5071
5091
|
type: Input
|
|
5072
5092
|
}], className: [{
|
|
@@ -5102,10 +5122,10 @@ class PdmNativeSelectComponent {
|
|
|
5102
5122
|
}
|
|
5103
5123
|
}
|
|
5104
5124
|
PdmNativeSelectComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmNativeSelectComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
5105
|
-
PdmNativeSelectComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmNativeSelectComponent, selector: "pdm-native-select", inputs: { id: "id", value: "value", disabled: "disabled", invalid: "invalid", options: "options", placeholder: "placeholder", className: "className" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "<div class=\"relative\" [ngClass]=\"className\">\n <select\n [id]=\"id\"\n [value]=\"value\"\n [disabled]=\"disabled\"\n [attr.aria-invalid]=\"invalid\"\n (change)=\"onChange($event)\"\n [ngClass]=\"[\n 'border-input focus-visible:border-ring focus-visible:ring-2 focus-visible:ring-ring/50 aria-invalid:ring-2 aria-invalid:ring-destructive aria-invalid:border-destructive aria-invalid:placeholder:text-destructive/70 flex h-9 w-full appearance-none box-border rounded-md border bg-transparent px-3 py-2 pr-9 text-sm shadow-sm outline-none disabled:cursor-not-allowed disabled:opacity-50'\n ]\"\n >\n <option value=\"\" disabled>{{ placeholder }}</option>\n <option *ngFor=\"let option of options\" [value]=\"option.value\" [disabled]=\"option.disabled\">{{ option.label }}</option>\n </select>\n <pdm-icon className=\"pointer-events-none absolute right-3 top-1/2 -translate-y-1/2 text-muted-foreground\" name=\"chevron-down\" [size]=\"16\"></pdm-icon>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: PdmIconComponent, selector: "pdm-icon", inputs: ["name", "library", "assetUrl", "size", "strokeWidth", "className", "ariaLabel", "decorative"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
5125
|
+
PdmNativeSelectComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmNativeSelectComponent, selector: "pdm-native-select", inputs: { id: "id", value: "value", disabled: "disabled", invalid: "invalid", options: "options", placeholder: "placeholder", className: "className" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "<div class=\"relative\" [ngClass]=\"className\">\n <select\n [id]=\"id\"\n [value]=\"value\"\n [disabled]=\"disabled\"\n [attr.aria-invalid]=\"invalid\"\n (change)=\"onChange($event)\"\n [ngClass]=\"[\n 'border-input focus-visible:border-ring focus-visible:ring-2 focus-visible:ring-ring/50 aria-invalid:ring-2 aria-invalid:ring-destructive aria-invalid:border-destructive aria-invalid:placeholder:text-destructive/70 flex h-9 w-full appearance-none box-border rounded-md border border-solid bg-transparent px-3 py-2 pr-9 text-sm shadow-sm outline-none disabled:cursor-not-allowed disabled:opacity-50'\n ]\"\n >\n <option value=\"\" disabled>{{ placeholder }}</option>\n <option *ngFor=\"let option of options\" [value]=\"option.value\" [disabled]=\"option.disabled\">{{ option.label }}</option>\n </select>\n <pdm-icon className=\"pointer-events-none absolute right-3 top-1/2 -translate-y-1/2 text-muted-foreground\" name=\"chevron-down\" [size]=\"16\"></pdm-icon>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: PdmIconComponent, selector: "pdm-icon", inputs: ["name", "library", "assetUrl", "size", "strokeWidth", "className", "ariaLabel", "decorative"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
5106
5126
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmNativeSelectComponent, decorators: [{
|
|
5107
5127
|
type: Component,
|
|
5108
|
-
args: [{ selector: 'pdm-native-select', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"relative\" [ngClass]=\"className\">\n <select\n [id]=\"id\"\n [value]=\"value\"\n [disabled]=\"disabled\"\n [attr.aria-invalid]=\"invalid\"\n (change)=\"onChange($event)\"\n [ngClass]=\"[\n 'border-input focus-visible:border-ring focus-visible:ring-2 focus-visible:ring-ring/50 aria-invalid:ring-2 aria-invalid:ring-destructive aria-invalid:border-destructive aria-invalid:placeholder:text-destructive/70 flex h-9 w-full appearance-none box-border rounded-md border bg-transparent px-3 py-2 pr-9 text-sm shadow-sm outline-none disabled:cursor-not-allowed disabled:opacity-50'\n ]\"\n >\n <option value=\"\" disabled>{{ placeholder }}</option>\n <option *ngFor=\"let option of options\" [value]=\"option.value\" [disabled]=\"option.disabled\">{{ option.label }}</option>\n </select>\n <pdm-icon className=\"pointer-events-none absolute right-3 top-1/2 -translate-y-1/2 text-muted-foreground\" name=\"chevron-down\" [size]=\"16\"></pdm-icon>\n</div>\n" }]
|
|
5128
|
+
args: [{ selector: 'pdm-native-select', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"relative\" [ngClass]=\"className\">\n <select\n [id]=\"id\"\n [value]=\"value\"\n [disabled]=\"disabled\"\n [attr.aria-invalid]=\"invalid\"\n (change)=\"onChange($event)\"\n [ngClass]=\"[\n 'border-input focus-visible:border-ring focus-visible:ring-2 focus-visible:ring-ring/50 aria-invalid:ring-2 aria-invalid:ring-destructive aria-invalid:border-destructive aria-invalid:placeholder:text-destructive/70 flex h-9 w-full appearance-none box-border rounded-md border border-solid bg-transparent px-3 py-2 pr-9 text-sm shadow-sm outline-none disabled:cursor-not-allowed disabled:opacity-50'\n ]\"\n >\n <option value=\"\" disabled>{{ placeholder }}</option>\n <option *ngFor=\"let option of options\" [value]=\"option.value\" [disabled]=\"option.disabled\">{{ option.label }}</option>\n </select>\n <pdm-icon className=\"pointer-events-none absolute right-3 top-1/2 -translate-y-1/2 text-muted-foreground\" name=\"chevron-down\" [size]=\"16\"></pdm-icon>\n</div>\n" }]
|
|
5109
5129
|
}], propDecorators: { id: [{
|
|
5110
5130
|
type: Input
|
|
5111
5131
|
}], value: [{
|
|
@@ -5416,10 +5436,10 @@ class PdmSelectComponent {
|
|
|
5416
5436
|
}
|
|
5417
5437
|
}
|
|
5418
5438
|
PdmSelectComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmSelectComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$1.Overlay }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
5419
|
-
PdmSelectComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmSelectComponent, selector: "pdm-select", inputs: { id: "id", value: "value", options: "options", disabled: "disabled", invalid: "invalid", className: "className", placeholder: "placeholder", overlayOptions: "overlayOptions" }, outputs: { valueChange: "valueChange" }, host: { listeners: { "document:keydown.escape": "onEscape()" } }, queries: [{ propertyName: "projectedOptions", predicate: PdmSelectOptionDirective }], viewQueries: [{ propertyName: "triggerRef", first: true, predicate: ["triggerEl"], descendants: true }, { propertyName: "panelTemplateRef", first: true, predicate: ["panelTemplate"], descendants: true }], ngImport: i0, template: "<div [ngClass]=\"['relative', className || 'w-full']\">\n <button\n #triggerEl\n type=\"button\"\n [id]=\"id\"\n [disabled]=\"disabled\"\n [attr.aria-invalid]=\"invalid\"\n [attr.aria-expanded]=\"open\"\n [attr.data-state]=\"open ? 'open' : 'closed'\"\n aria-haspopup=\"listbox\"\n (click)=\"toggle()\"\n [ngClass]=\"[\n 'border-input focus-visible:border-ring focus-visible:ring-2 focus-visible:ring-ring/50 aria-invalid:ring-2 aria-invalid:ring-destructive aria-invalid:border-destructive flex h-9 w-full appearance-none box-border items-center justify-between rounded-md border bg-background px-3 py-2 text-sm shadow-sm outline-none disabled:cursor-not-allowed disabled:opacity-50',\n ]\"\n >\n <span\n [ngClass]=\"[\n 'min-w-0 flex-1 truncate text-left leading-5',\n selectedOption\n ? 'font-medium text-foreground'\n : 'font-normal text-muted-foreground',\n ]\"\n >\n {{ selectedLabel }}\n </span>\n <pdm-icon\n name=\"chevron-down\"\n [size]=\"16\"\n className=\"shrink-0 text-muted-foreground\"\n ></pdm-icon>\n </button>\n\n <!-- Hidden native select kept for screen-reader / form fallback -->\n <select\n class=\"sr-only\"\n tabindex=\"-1\"\n aria-hidden=\"true\"\n [value]=\"value\"\n (change)=\"onChange($event)\"\n >\n <option\n *ngFor=\"let option of resolvedOptions\"\n [value]=\"option.value\"\n [disabled]=\"option.disabled\"\n >\n {{ option.label }}\n </option>\n </select>\n\n <!-- Slot for content-projected pdm-select-option elements (hidden from layout) -->\n <span class=\"hidden\">\n <ng-content select=\"pdm-select-option\"></ng-content>\n </span>\n</div>\n\n<ng-template #panelTemplate>\n <div\n role=\"listbox\"\n [attr.aria-labelledby]=\"id || null\"\n class=\"w-full overflow-y-auto rounded-md border border-border bg-popover p-1 text-popover-foreground shadow-md max-h-96\"\n >\n <button\n *ngFor=\"let option of resolvedOptions\"\n type=\"button\"\n role=\"option\"\n [attr.aria-selected]=\"option.value === value\"\n [disabled]=\"option.disabled\"\n (click)=\"selectOption(option)\"\n [ngClass]=\"[\n 'flex w-full appearance-none box-border items-center justify-between rounded-sm border-0 bg-transparent px-2 py-1.5 text-left text-sm outline-none transition-colors',\n option.disabled\n ? 'cursor-not-allowed opacity-50'\n : 'hover:bg-accent hover:text-accent-foreground focus-visible:bg-accent focus-visible:text-accent-foreground',\n option.value === value ? 'text-foreground' : '',\n ]\"\n >\n <span class=\"min-w-0 flex-1 truncate leading-5\">{{ option.label }}</span>\n <span\n *ngIf=\"option.value === value\"\n class=\"ml-2 flex shrink-0 items-center justify-end\"\n >\n <pdm-icon\n name=\"check\"\n [size]=\"16\"\n className=\"shrink-0 text-current\"\n ></pdm-icon>\n </span>\n </button>\n </div>\n</ng-template>\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: PdmIconComponent, selector: "pdm-icon", inputs: ["name", "library", "assetUrl", "size", "strokeWidth", "className", "ariaLabel", "decorative"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
5439
|
+
PdmSelectComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmSelectComponent, selector: "pdm-select", inputs: { id: "id", value: "value", options: "options", disabled: "disabled", invalid: "invalid", className: "className", placeholder: "placeholder", overlayOptions: "overlayOptions" }, outputs: { valueChange: "valueChange" }, host: { listeners: { "document:keydown.escape": "onEscape()" } }, queries: [{ propertyName: "projectedOptions", predicate: PdmSelectOptionDirective }], viewQueries: [{ propertyName: "triggerRef", first: true, predicate: ["triggerEl"], descendants: true }, { propertyName: "panelTemplateRef", first: true, predicate: ["panelTemplate"], descendants: true }], ngImport: i0, template: "<div [ngClass]=\"['relative', className || 'w-full']\">\n <button\n #triggerEl\n type=\"button\"\n [id]=\"id\"\n [disabled]=\"disabled\"\n [attr.aria-invalid]=\"invalid\"\n [attr.aria-expanded]=\"open\"\n [attr.data-state]=\"open ? 'open' : 'closed'\"\n aria-haspopup=\"listbox\"\n (click)=\"toggle()\"\n [ngClass]=\"[\n 'border-input focus-visible:border-ring focus-visible:ring-2 focus-visible:ring-ring/50 aria-invalid:ring-2 aria-invalid:ring-destructive aria-invalid:border-destructive flex h-9 w-full appearance-none box-border items-center justify-between rounded-md border border-solid bg-background px-3 py-2 text-sm shadow-sm outline-none disabled:cursor-not-allowed disabled:opacity-50',\n ]\"\n >\n <span\n [ngClass]=\"[\n 'min-w-0 flex-1 truncate text-left leading-5',\n selectedOption\n ? 'font-medium text-foreground'\n : 'font-normal text-muted-foreground',\n ]\"\n >\n {{ selectedLabel }}\n </span>\n <pdm-icon\n name=\"chevron-down\"\n [size]=\"16\"\n className=\"shrink-0 text-muted-foreground\"\n ></pdm-icon>\n </button>\n\n <!-- Hidden native select kept for screen-reader / form fallback -->\n <select\n class=\"sr-only\"\n tabindex=\"-1\"\n aria-hidden=\"true\"\n [value]=\"value\"\n (change)=\"onChange($event)\"\n >\n <option\n *ngFor=\"let option of resolvedOptions\"\n [value]=\"option.value\"\n [disabled]=\"option.disabled\"\n >\n {{ option.label }}\n </option>\n </select>\n\n <!-- Slot for content-projected pdm-select-option elements (hidden from layout) -->\n <span class=\"hidden\">\n <ng-content select=\"pdm-select-option\"></ng-content>\n </span>\n</div>\n\n<ng-template #panelTemplate>\n <div\n role=\"listbox\"\n [attr.aria-labelledby]=\"id || null\"\n class=\"w-full overflow-y-auto rounded-md border border-solid border-border bg-popover p-1 text-popover-foreground shadow-md max-h-96\"\n >\n <button\n *ngFor=\"let option of resolvedOptions\"\n type=\"button\"\n role=\"option\"\n [attr.aria-selected]=\"option.value === value\"\n [disabled]=\"option.disabled\"\n (click)=\"selectOption(option)\"\n [ngClass]=\"[\n 'flex w-full appearance-none box-border items-center justify-between rounded-sm border-0 bg-transparent px-2 py-1.5 text-left text-sm outline-none transition-colors',\n option.disabled\n ? 'cursor-not-allowed opacity-50'\n : 'hover:bg-accent hover:text-accent-foreground focus-visible:bg-accent focus-visible:text-accent-foreground',\n option.value === value ? 'text-foreground' : '',\n ]\"\n >\n <span class=\"min-w-0 flex-1 truncate leading-5\">{{ option.label }}</span>\n <span\n *ngIf=\"option.value === value\"\n class=\"ml-2 flex shrink-0 items-center justify-end\"\n >\n <pdm-icon\n name=\"check\"\n [size]=\"16\"\n className=\"shrink-0 text-current\"\n ></pdm-icon>\n </span>\n </button>\n </div>\n</ng-template>\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: PdmIconComponent, selector: "pdm-icon", inputs: ["name", "library", "assetUrl", "size", "strokeWidth", "className", "ariaLabel", "decorative"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
5420
5440
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmSelectComponent, decorators: [{
|
|
5421
5441
|
type: Component,
|
|
5422
|
-
args: [{ selector: "pdm-select", changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [ngClass]=\"['relative', className || 'w-full']\">\n <button\n #triggerEl\n type=\"button\"\n [id]=\"id\"\n [disabled]=\"disabled\"\n [attr.aria-invalid]=\"invalid\"\n [attr.aria-expanded]=\"open\"\n [attr.data-state]=\"open ? 'open' : 'closed'\"\n aria-haspopup=\"listbox\"\n (click)=\"toggle()\"\n [ngClass]=\"[\n 'border-input focus-visible:border-ring focus-visible:ring-2 focus-visible:ring-ring/50 aria-invalid:ring-2 aria-invalid:ring-destructive aria-invalid:border-destructive flex h-9 w-full appearance-none box-border items-center justify-between rounded-md border bg-background px-3 py-2 text-sm shadow-sm outline-none disabled:cursor-not-allowed disabled:opacity-50',\n ]\"\n >\n <span\n [ngClass]=\"[\n 'min-w-0 flex-1 truncate text-left leading-5',\n selectedOption\n ? 'font-medium text-foreground'\n : 'font-normal text-muted-foreground',\n ]\"\n >\n {{ selectedLabel }}\n </span>\n <pdm-icon\n name=\"chevron-down\"\n [size]=\"16\"\n className=\"shrink-0 text-muted-foreground\"\n ></pdm-icon>\n </button>\n\n <!-- Hidden native select kept for screen-reader / form fallback -->\n <select\n class=\"sr-only\"\n tabindex=\"-1\"\n aria-hidden=\"true\"\n [value]=\"value\"\n (change)=\"onChange($event)\"\n >\n <option\n *ngFor=\"let option of resolvedOptions\"\n [value]=\"option.value\"\n [disabled]=\"option.disabled\"\n >\n {{ option.label }}\n </option>\n </select>\n\n <!-- Slot for content-projected pdm-select-option elements (hidden from layout) -->\n <span class=\"hidden\">\n <ng-content select=\"pdm-select-option\"></ng-content>\n </span>\n</div>\n\n<ng-template #panelTemplate>\n <div\n role=\"listbox\"\n [attr.aria-labelledby]=\"id || null\"\n class=\"w-full overflow-y-auto rounded-md border border-border bg-popover p-1 text-popover-foreground shadow-md max-h-96\"\n >\n <button\n *ngFor=\"let option of resolvedOptions\"\n type=\"button\"\n role=\"option\"\n [attr.aria-selected]=\"option.value === value\"\n [disabled]=\"option.disabled\"\n (click)=\"selectOption(option)\"\n [ngClass]=\"[\n 'flex w-full appearance-none box-border items-center justify-between rounded-sm border-0 bg-transparent px-2 py-1.5 text-left text-sm outline-none transition-colors',\n option.disabled\n ? 'cursor-not-allowed opacity-50'\n : 'hover:bg-accent hover:text-accent-foreground focus-visible:bg-accent focus-visible:text-accent-foreground',\n option.value === value ? 'text-foreground' : '',\n ]\"\n >\n <span class=\"min-w-0 flex-1 truncate leading-5\">{{ option.label }}</span>\n <span\n *ngIf=\"option.value === value\"\n class=\"ml-2 flex shrink-0 items-center justify-end\"\n >\n <pdm-icon\n name=\"check\"\n [size]=\"16\"\n className=\"shrink-0 text-current\"\n ></pdm-icon>\n </span>\n </button>\n </div>\n</ng-template>\n", styles: [":host{display:block}\n"] }]
|
|
5442
|
+
args: [{ selector: "pdm-select", changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [ngClass]=\"['relative', className || 'w-full']\">\n <button\n #triggerEl\n type=\"button\"\n [id]=\"id\"\n [disabled]=\"disabled\"\n [attr.aria-invalid]=\"invalid\"\n [attr.aria-expanded]=\"open\"\n [attr.data-state]=\"open ? 'open' : 'closed'\"\n aria-haspopup=\"listbox\"\n (click)=\"toggle()\"\n [ngClass]=\"[\n 'border-input focus-visible:border-ring focus-visible:ring-2 focus-visible:ring-ring/50 aria-invalid:ring-2 aria-invalid:ring-destructive aria-invalid:border-destructive flex h-9 w-full appearance-none box-border items-center justify-between rounded-md border border-solid bg-background px-3 py-2 text-sm shadow-sm outline-none disabled:cursor-not-allowed disabled:opacity-50',\n ]\"\n >\n <span\n [ngClass]=\"[\n 'min-w-0 flex-1 truncate text-left leading-5',\n selectedOption\n ? 'font-medium text-foreground'\n : 'font-normal text-muted-foreground',\n ]\"\n >\n {{ selectedLabel }}\n </span>\n <pdm-icon\n name=\"chevron-down\"\n [size]=\"16\"\n className=\"shrink-0 text-muted-foreground\"\n ></pdm-icon>\n </button>\n\n <!-- Hidden native select kept for screen-reader / form fallback -->\n <select\n class=\"sr-only\"\n tabindex=\"-1\"\n aria-hidden=\"true\"\n [value]=\"value\"\n (change)=\"onChange($event)\"\n >\n <option\n *ngFor=\"let option of resolvedOptions\"\n [value]=\"option.value\"\n [disabled]=\"option.disabled\"\n >\n {{ option.label }}\n </option>\n </select>\n\n <!-- Slot for content-projected pdm-select-option elements (hidden from layout) -->\n <span class=\"hidden\">\n <ng-content select=\"pdm-select-option\"></ng-content>\n </span>\n</div>\n\n<ng-template #panelTemplate>\n <div\n role=\"listbox\"\n [attr.aria-labelledby]=\"id || null\"\n class=\"w-full overflow-y-auto rounded-md border border-solid border-border bg-popover p-1 text-popover-foreground shadow-md max-h-96\"\n >\n <button\n *ngFor=\"let option of resolvedOptions\"\n type=\"button\"\n role=\"option\"\n [attr.aria-selected]=\"option.value === value\"\n [disabled]=\"option.disabled\"\n (click)=\"selectOption(option)\"\n [ngClass]=\"[\n 'flex w-full appearance-none box-border items-center justify-between rounded-sm border-0 bg-transparent px-2 py-1.5 text-left text-sm outline-none transition-colors',\n option.disabled\n ? 'cursor-not-allowed opacity-50'\n : 'hover:bg-accent hover:text-accent-foreground focus-visible:bg-accent focus-visible:text-accent-foreground',\n option.value === value ? 'text-foreground' : '',\n ]\"\n >\n <span class=\"min-w-0 flex-1 truncate leading-5\">{{ option.label }}</span>\n <span\n *ngIf=\"option.value === value\"\n class=\"ml-2 flex shrink-0 items-center justify-end\"\n >\n <pdm-icon\n name=\"check\"\n [size]=\"16\"\n className=\"shrink-0 text-current\"\n ></pdm-icon>\n </span>\n </button>\n </div>\n</ng-template>\n", styles: [":host{display:block}\n"] }]
|
|
5423
5443
|
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i1$1.Overlay }, { type: i0.ViewContainerRef }]; }, propDecorators: { id: [{
|
|
5424
5444
|
type: Input
|
|
5425
5445
|
}], value: [{
|
|
@@ -5495,10 +5515,10 @@ class PdmPaginationComponent {
|
|
|
5495
5515
|
}
|
|
5496
5516
|
}
|
|
5497
5517
|
PdmPaginationComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmPaginationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
5498
|
-
PdmPaginationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmPaginationComponent, selector: "pdm-pagination", inputs: { page: "page", pageCount: "pageCount", maxVisible: "maxVisible", className: "className", rowsPerPageLabel: "rowsPerPageLabel", rowsPerPage: "rowsPerPage", rowsPerPageOptions: "rowsPerPageOptions" }, outputs: { pageChange: "pageChange", rowsPerPageChange: "rowsPerPageChange" }, ngImport: i0, template: "<nav\n aria-label=\"Pagination\"\n [ngClass]=\"[\n 'mx-auto flex w-full flex-wrap items-center justify-center gap-4',\n className,\n ]\"\n>\n <div class=\"flex items-center gap-3\" *ngIf=\"rowsPerPageOptions.length > 0\">\n <span class=\"text-sm font-medium text-foreground\">{{\n rowsPerPageLabel\n }}</span>\n <pdm-select\n [value]=\"rowsPerPageValue\"\n [options]=\"rowsPerPageSelectOptions\"\n [placeholder]=\"rowsPerPageValue\"\n className=\"w-[100px] sm:w-[120px]\"\n (valueChange)=\"onRowsPerPageChangeValue($event)\"\n ></pdm-select>\n </div>\n\n <ul class=\"m-0 flex list-none items-center gap-1 p-0\">\n <li>\n <button\n type=\"button\"\n class=\"inline-flex h-9 appearance-none box-border items-center justify-center gap-1 rounded-md border-0 bg-transparent px-2 text-sm text-foreground hover:bg-accent disabled:opacity-50 ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2\"\n [disabled]=\"page <= 1\"\n (click)=\"setPage(page - 1)\"\n >\n <pdm-icon name=\"chevron-left\" [size]=\"14\"></pdm-icon>\n Previous\n </button>\n </li>\n <li *ngFor=\"let pageNumber of visiblePages\">\n <ng-container *ngIf=\"pageNumber === 'ellipsis'; else pageButton\">\n <span\n class=\"inline-flex h-9 min-w-9 items-center justify-center px-2 text-sm text-muted-foreground\"\n >...</span\n >\n </ng-container>\n <ng-template #pageButton>\n <button\n type=\"button\"\n [ngClass]=\"[\n 'inline-flex h-9 min-w-9 items-center justify-center rounded-md px-2 text-sm ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2',\n pageNumber === page\n ? 'appearance-none box-border border border-border bg-muted text-foreground shadow-sm'\n : 'appearance-none box-border border-0 bg-transparent text-foreground hover:bg-accent hover:text-accent-foreground',\n ]\"\n (click)=\"setPage(+pageNumber)\"\n >\n {{ pageNumber }}\n </button>\n </ng-template>\n </li>\n <li>\n <button\n type=\"button\"\n class=\"inline-flex h-9 appearance-none box-border items-center justify-center gap-1 rounded-md border-0 bg-transparent px-2 text-sm text-foreground hover:bg-accent disabled:opacity-50 ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2\"\n [disabled]=\"page >= pageCount\"\n (click)=\"setPage(page + 1)\"\n >\n Next\n <pdm-icon name=\"chevron-right\" [size]=\"14\"></pdm-icon>\n </button>\n </li>\n </ul>\n</nav>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: PdmIconComponent, selector: "pdm-icon", inputs: ["name", "library", "assetUrl", "size", "strokeWidth", "className", "ariaLabel", "decorative"] }, { kind: "component", type: PdmSelectComponent, selector: "pdm-select", inputs: ["id", "value", "options", "disabled", "invalid", "className", "placeholder", "overlayOptions"], outputs: ["valueChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
5518
|
+
PdmPaginationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmPaginationComponent, selector: "pdm-pagination", inputs: { page: "page", pageCount: "pageCount", maxVisible: "maxVisible", className: "className", rowsPerPageLabel: "rowsPerPageLabel", rowsPerPage: "rowsPerPage", rowsPerPageOptions: "rowsPerPageOptions" }, outputs: { pageChange: "pageChange", rowsPerPageChange: "rowsPerPageChange" }, ngImport: i0, template: "<nav\n aria-label=\"Pagination\"\n [ngClass]=\"[\n 'mx-auto flex w-full flex-wrap items-center justify-center gap-4',\n className,\n ]\"\n>\n <div class=\"flex items-center gap-3\" *ngIf=\"rowsPerPageOptions.length > 0\">\n <span class=\"text-sm font-medium text-foreground\">{{\n rowsPerPageLabel\n }}</span>\n <pdm-select\n [value]=\"rowsPerPageValue\"\n [options]=\"rowsPerPageSelectOptions\"\n [placeholder]=\"rowsPerPageValue\"\n className=\"w-[100px] sm:w-[120px]\"\n (valueChange)=\"onRowsPerPageChangeValue($event)\"\n ></pdm-select>\n </div>\n\n <ul class=\"m-0 flex list-none items-center gap-1 p-0\">\n <li>\n <button\n type=\"button\"\n class=\"inline-flex h-9 appearance-none box-border items-center justify-center gap-1 rounded-md border-0 bg-transparent px-2 text-sm text-foreground hover:bg-accent disabled:opacity-50 ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2\"\n [disabled]=\"page <= 1\"\n (click)=\"setPage(page - 1)\"\n >\n <pdm-icon name=\"chevron-left\" [size]=\"14\"></pdm-icon>\n Previous\n </button>\n </li>\n <li *ngFor=\"let pageNumber of visiblePages\">\n <ng-container *ngIf=\"pageNumber === 'ellipsis'; else pageButton\">\n <span\n class=\"inline-flex h-9 min-w-9 items-center justify-center px-2 text-sm text-muted-foreground\"\n >...</span\n >\n </ng-container>\n <ng-template #pageButton>\n <button\n type=\"button\"\n [ngClass]=\"[\n 'inline-flex h-9 min-w-9 items-center justify-center rounded-md px-2 text-sm ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2',\n pageNumber === page\n ? 'appearance-none box-border border border-solid border-border bg-muted text-foreground shadow-sm'\n : 'appearance-none box-border border-0 bg-transparent text-foreground hover:bg-accent hover:text-accent-foreground',\n ]\"\n (click)=\"setPage(+pageNumber)\"\n >\n {{ pageNumber }}\n </button>\n </ng-template>\n </li>\n <li>\n <button\n type=\"button\"\n class=\"inline-flex h-9 appearance-none box-border items-center justify-center gap-1 rounded-md border-0 bg-transparent px-2 text-sm text-foreground hover:bg-accent disabled:opacity-50 ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2\"\n [disabled]=\"page >= pageCount\"\n (click)=\"setPage(page + 1)\"\n >\n Next\n <pdm-icon name=\"chevron-right\" [size]=\"14\"></pdm-icon>\n </button>\n </li>\n </ul>\n</nav>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: PdmIconComponent, selector: "pdm-icon", inputs: ["name", "library", "assetUrl", "size", "strokeWidth", "className", "ariaLabel", "decorative"] }, { kind: "component", type: PdmSelectComponent, selector: "pdm-select", inputs: ["id", "value", "options", "disabled", "invalid", "className", "placeholder", "overlayOptions"], outputs: ["valueChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
5499
5519
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmPaginationComponent, decorators: [{
|
|
5500
5520
|
type: Component,
|
|
5501
|
-
args: [{ selector: 'pdm-pagination', changeDetection: ChangeDetectionStrategy.OnPush, template: "<nav\n aria-label=\"Pagination\"\n [ngClass]=\"[\n 'mx-auto flex w-full flex-wrap items-center justify-center gap-4',\n className,\n ]\"\n>\n <div class=\"flex items-center gap-3\" *ngIf=\"rowsPerPageOptions.length > 0\">\n <span class=\"text-sm font-medium text-foreground\">{{\n rowsPerPageLabel\n }}</span>\n <pdm-select\n [value]=\"rowsPerPageValue\"\n [options]=\"rowsPerPageSelectOptions\"\n [placeholder]=\"rowsPerPageValue\"\n className=\"w-[100px] sm:w-[120px]\"\n (valueChange)=\"onRowsPerPageChangeValue($event)\"\n ></pdm-select>\n </div>\n\n <ul class=\"m-0 flex list-none items-center gap-1 p-0\">\n <li>\n <button\n type=\"button\"\n class=\"inline-flex h-9 appearance-none box-border items-center justify-center gap-1 rounded-md border-0 bg-transparent px-2 text-sm text-foreground hover:bg-accent disabled:opacity-50 ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2\"\n [disabled]=\"page <= 1\"\n (click)=\"setPage(page - 1)\"\n >\n <pdm-icon name=\"chevron-left\" [size]=\"14\"></pdm-icon>\n Previous\n </button>\n </li>\n <li *ngFor=\"let pageNumber of visiblePages\">\n <ng-container *ngIf=\"pageNumber === 'ellipsis'; else pageButton\">\n <span\n class=\"inline-flex h-9 min-w-9 items-center justify-center px-2 text-sm text-muted-foreground\"\n >...</span\n >\n </ng-container>\n <ng-template #pageButton>\n <button\n type=\"button\"\n [ngClass]=\"[\n 'inline-flex h-9 min-w-9 items-center justify-center rounded-md px-2 text-sm ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2',\n pageNumber === page\n ? 'appearance-none box-border border border-border bg-muted text-foreground shadow-sm'\n : 'appearance-none box-border border-0 bg-transparent text-foreground hover:bg-accent hover:text-accent-foreground',\n ]\"\n (click)=\"setPage(+pageNumber)\"\n >\n {{ pageNumber }}\n </button>\n </ng-template>\n </li>\n <li>\n <button\n type=\"button\"\n class=\"inline-flex h-9 appearance-none box-border items-center justify-center gap-1 rounded-md border-0 bg-transparent px-2 text-sm text-foreground hover:bg-accent disabled:opacity-50 ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2\"\n [disabled]=\"page >= pageCount\"\n (click)=\"setPage(page + 1)\"\n >\n Next\n <pdm-icon name=\"chevron-right\" [size]=\"14\"></pdm-icon>\n </button>\n </li>\n </ul>\n</nav>\n" }]
|
|
5521
|
+
args: [{ selector: 'pdm-pagination', changeDetection: ChangeDetectionStrategy.OnPush, template: "<nav\n aria-label=\"Pagination\"\n [ngClass]=\"[\n 'mx-auto flex w-full flex-wrap items-center justify-center gap-4',\n className,\n ]\"\n>\n <div class=\"flex items-center gap-3\" *ngIf=\"rowsPerPageOptions.length > 0\">\n <span class=\"text-sm font-medium text-foreground\">{{\n rowsPerPageLabel\n }}</span>\n <pdm-select\n [value]=\"rowsPerPageValue\"\n [options]=\"rowsPerPageSelectOptions\"\n [placeholder]=\"rowsPerPageValue\"\n className=\"w-[100px] sm:w-[120px]\"\n (valueChange)=\"onRowsPerPageChangeValue($event)\"\n ></pdm-select>\n </div>\n\n <ul class=\"m-0 flex list-none items-center gap-1 p-0\">\n <li>\n <button\n type=\"button\"\n class=\"inline-flex h-9 appearance-none box-border items-center justify-center gap-1 rounded-md border-0 bg-transparent px-2 text-sm text-foreground hover:bg-accent disabled:opacity-50 ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2\"\n [disabled]=\"page <= 1\"\n (click)=\"setPage(page - 1)\"\n >\n <pdm-icon name=\"chevron-left\" [size]=\"14\"></pdm-icon>\n Previous\n </button>\n </li>\n <li *ngFor=\"let pageNumber of visiblePages\">\n <ng-container *ngIf=\"pageNumber === 'ellipsis'; else pageButton\">\n <span\n class=\"inline-flex h-9 min-w-9 items-center justify-center px-2 text-sm text-muted-foreground\"\n >...</span\n >\n </ng-container>\n <ng-template #pageButton>\n <button\n type=\"button\"\n [ngClass]=\"[\n 'inline-flex h-9 min-w-9 items-center justify-center rounded-md px-2 text-sm ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2',\n pageNumber === page\n ? 'appearance-none box-border border border-solid border-border bg-muted text-foreground shadow-sm'\n : 'appearance-none box-border border-0 bg-transparent text-foreground hover:bg-accent hover:text-accent-foreground',\n ]\"\n (click)=\"setPage(+pageNumber)\"\n >\n {{ pageNumber }}\n </button>\n </ng-template>\n </li>\n <li>\n <button\n type=\"button\"\n class=\"inline-flex h-9 appearance-none box-border items-center justify-center gap-1 rounded-md border-0 bg-transparent px-2 text-sm text-foreground hover:bg-accent disabled:opacity-50 ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2\"\n [disabled]=\"page >= pageCount\"\n (click)=\"setPage(page + 1)\"\n >\n Next\n <pdm-icon name=\"chevron-right\" [size]=\"14\"></pdm-icon>\n </button>\n </li>\n </ul>\n</nav>\n" }]
|
|
5502
5522
|
}], propDecorators: { page: [{
|
|
5503
5523
|
type: Input
|
|
5504
5524
|
}], pageCount: [{
|
|
@@ -5649,10 +5669,10 @@ class PdmPopoverComponent {
|
|
|
5649
5669
|
}
|
|
5650
5670
|
}
|
|
5651
5671
|
PdmPopoverComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmPopoverComponent, deps: [{ token: i1$1.Overlay }, { token: i0.ViewContainerRef }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
5652
|
-
PdmPopoverComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmPopoverComponent, selector: "pdm-popover", inputs: { triggerText: "triggerText", className: "className", panelClassName: "panelClassName", showTrigger: "showTrigger", open: "open" }, outputs: { openChange: "openChange" }, host: { listeners: { "document:keydown.escape": "onEsc()" } }, viewQueries: [{ propertyName: "triggerRef", first: true, predicate: ["triggerEl"], descendants: true }, { propertyName: "panelTemplateRef", first: true, predicate: ["panelTemplate"], descendants: true }], ngImport: i0, template: "<div class=\"relative inline-block\" [ngClass]=\"className\">\n <button\n #triggerEl\n *ngIf=\"showTrigger\"\n type=\"button\"\n class=\"inline-flex h-9 appearance-none box-border items-center justify-center rounded-md border border-input bg-background px-3 text-sm font-medium text-foreground shadow-sm\"\n [attr.aria-expanded]=\"open\"\n [attr.aria-haspopup]=\"'dialog'\"\n (click)=\"toggle()\"\n >\n {{ triggerText }}\n </button>\n\n <!-- Trigger slot for custom trigger -->\n <ng-content select=\"[pdmPopoverTrigger]\"></ng-content>\n\n <!-- Template for CDK Overlay -->\n <ng-template #panelTemplate>\n <div\n class=\"min-w-80 rounded-md border border-border bg-popover p-4 text-popover-foreground shadow-md\"\n >\n <ng-content></ng-content>\n </div>\n </ng-template>\n</div>\n", styles: [":host{display:inline-block}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
5672
|
+
PdmPopoverComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmPopoverComponent, selector: "pdm-popover", inputs: { triggerText: "triggerText", className: "className", panelClassName: "panelClassName", showTrigger: "showTrigger", open: "open" }, outputs: { openChange: "openChange" }, host: { listeners: { "document:keydown.escape": "onEsc()" } }, viewQueries: [{ propertyName: "triggerRef", first: true, predicate: ["triggerEl"], descendants: true }, { propertyName: "panelTemplateRef", first: true, predicate: ["panelTemplate"], descendants: true }], ngImport: i0, template: "<div class=\"relative inline-block\" [ngClass]=\"className\">\n <button\n #triggerEl\n *ngIf=\"showTrigger\"\n type=\"button\"\n class=\"inline-flex h-9 appearance-none box-border items-center justify-center rounded-md border border-solid border-input bg-background px-3 text-sm font-medium text-foreground shadow-sm\"\n [attr.aria-expanded]=\"open\"\n [attr.aria-haspopup]=\"'dialog'\"\n (click)=\"toggle()\"\n >\n {{ triggerText }}\n </button>\n\n <!-- Trigger slot for custom trigger -->\n <ng-content select=\"[pdmPopoverTrigger]\"></ng-content>\n\n <!-- Template for CDK Overlay -->\n <ng-template #panelTemplate>\n <div\n class=\"min-w-80 rounded-md border border-solid border-border bg-popover p-4 text-popover-foreground shadow-md\"\n >\n <ng-content></ng-content>\n </div>\n </ng-template>\n</div>\n", styles: [":host{display:inline-block}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
5653
5673
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmPopoverComponent, decorators: [{
|
|
5654
5674
|
type: Component,
|
|
5655
|
-
args: [{ selector: "pdm-popover", changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"relative inline-block\" [ngClass]=\"className\">\n <button\n #triggerEl\n *ngIf=\"showTrigger\"\n type=\"button\"\n class=\"inline-flex h-9 appearance-none box-border items-center justify-center rounded-md border border-input bg-background px-3 text-sm font-medium text-foreground shadow-sm\"\n [attr.aria-expanded]=\"open\"\n [attr.aria-haspopup]=\"'dialog'\"\n (click)=\"toggle()\"\n >\n {{ triggerText }}\n </button>\n\n <!-- Trigger slot for custom trigger -->\n <ng-content select=\"[pdmPopoverTrigger]\"></ng-content>\n\n <!-- Template for CDK Overlay -->\n <ng-template #panelTemplate>\n <div\n class=\"min-w-80 rounded-md border border-border bg-popover p-4 text-popover-foreground shadow-md\"\n >\n <ng-content></ng-content>\n </div>\n </ng-template>\n</div>\n", styles: [":host{display:inline-block}\n"] }]
|
|
5675
|
+
args: [{ selector: "pdm-popover", changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"relative inline-block\" [ngClass]=\"className\">\n <button\n #triggerEl\n *ngIf=\"showTrigger\"\n type=\"button\"\n class=\"inline-flex h-9 appearance-none box-border items-center justify-center rounded-md border border-solid border-input bg-background px-3 text-sm font-medium text-foreground shadow-sm\"\n [attr.aria-expanded]=\"open\"\n [attr.aria-haspopup]=\"'dialog'\"\n (click)=\"toggle()\"\n >\n {{ triggerText }}\n </button>\n\n <!-- Trigger slot for custom trigger -->\n <ng-content select=\"[pdmPopoverTrigger]\"></ng-content>\n\n <!-- Template for CDK Overlay -->\n <ng-template #panelTemplate>\n <div\n class=\"min-w-80 rounded-md border border-solid border-border bg-popover p-4 text-popover-foreground shadow-md\"\n >\n <ng-content></ng-content>\n </div>\n </ng-template>\n</div>\n", styles: [":host{display:inline-block}\n"] }]
|
|
5656
5676
|
}], ctorParameters: function () { return [{ type: i1$1.Overlay }, { type: i0.ViewContainerRef }, { type: i0.ElementRef }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { triggerText: [{
|
|
5657
5677
|
type: Input
|
|
5658
5678
|
}], className: [{
|
|
@@ -5723,10 +5743,10 @@ class PdmRadioGroupComponent {
|
|
|
5723
5743
|
}
|
|
5724
5744
|
}
|
|
5725
5745
|
PdmRadioGroupComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmRadioGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
5726
|
-
PdmRadioGroupComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmRadioGroupComponent, selector: "pdm-radio-group", inputs: { name: "name", value: "value", options: "options", direction: "direction", className: "className" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "<div\n role=\"radiogroup\"\n [ngClass]=\"[\n 'gap-2 text-sm',\n direction === 'horizontal' ? 'inline-flex items-center' : 'grid',\n className\n ]\"\n>\n <label *ngFor=\"let option of options\" [attr.for]=\"optionId(option)\" class=\"inline-flex cursor-pointer items-center gap-2\">\n <input\n [id]=\"optionId(option)\"\n type=\"radio\"\n [name]=\"name\"\n [value]=\"option.value\"\n [checked]=\"value === option.value\"\n [disabled]=\"option.disabled\"\n class=\"peer sr-only\"\n (change)=\"onChange($event)\"\n />\n <span class=\"relative block h-4 w-4 rounded-full border border-input bg-background peer-checked:border-primary peer-focus-visible:ring-2 peer-focus-visible:ring-ring peer-focus-visible:ring-offset-2 peer-focus-visible:ring-offset-background\">\n <span class=\"absolute left-1/2 top-1/2 hidden h-2 w-2 -translate-x-1/2 -translate-y-1/2 rounded-full bg-primary peer-checked:block\"></span>\n </span>\n <span class=\"text-foreground\">{{ option.label }}</span>\n </label>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
5746
|
+
PdmRadioGroupComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmRadioGroupComponent, selector: "pdm-radio-group", inputs: { name: "name", value: "value", options: "options", direction: "direction", className: "className" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "<div\n role=\"radiogroup\"\n [ngClass]=\"[\n 'gap-2 text-sm',\n direction === 'horizontal' ? 'inline-flex items-center' : 'grid',\n className\n ]\"\n>\n <label *ngFor=\"let option of options\" [attr.for]=\"optionId(option)\" class=\"inline-flex cursor-pointer items-center gap-2\">\n <input\n [id]=\"optionId(option)\"\n type=\"radio\"\n [name]=\"name\"\n [value]=\"option.value\"\n [checked]=\"value === option.value\"\n [disabled]=\"option.disabled\"\n class=\"peer sr-only\"\n (change)=\"onChange($event)\"\n />\n <span class=\"relative block h-4 w-4 rounded-full border border-solid border-input bg-background peer-checked:border-primary peer-focus-visible:ring-2 peer-focus-visible:ring-ring peer-focus-visible:ring-offset-2 peer-focus-visible:ring-offset-background\">\n <span class=\"absolute left-1/2 top-1/2 hidden h-2 w-2 -translate-x-1/2 -translate-y-1/2 rounded-full bg-primary peer-checked:block\"></span>\n </span>\n <span class=\"text-foreground\">{{ option.label }}</span>\n </label>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
5727
5747
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmRadioGroupComponent, decorators: [{
|
|
5728
5748
|
type: Component,
|
|
5729
|
-
args: [{ selector: 'pdm-radio-group', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n role=\"radiogroup\"\n [ngClass]=\"[\n 'gap-2 text-sm',\n direction === 'horizontal' ? 'inline-flex items-center' : 'grid',\n className\n ]\"\n>\n <label *ngFor=\"let option of options\" [attr.for]=\"optionId(option)\" class=\"inline-flex cursor-pointer items-center gap-2\">\n <input\n [id]=\"optionId(option)\"\n type=\"radio\"\n [name]=\"name\"\n [value]=\"option.value\"\n [checked]=\"value === option.value\"\n [disabled]=\"option.disabled\"\n class=\"peer sr-only\"\n (change)=\"onChange($event)\"\n />\n <span class=\"relative block h-4 w-4 rounded-full border border-input bg-background peer-checked:border-primary peer-focus-visible:ring-2 peer-focus-visible:ring-ring peer-focus-visible:ring-offset-2 peer-focus-visible:ring-offset-background\">\n <span class=\"absolute left-1/2 top-1/2 hidden h-2 w-2 -translate-x-1/2 -translate-y-1/2 rounded-full bg-primary peer-checked:block\"></span>\n </span>\n <span class=\"text-foreground\">{{ option.label }}</span>\n </label>\n</div>\n" }]
|
|
5749
|
+
args: [{ selector: 'pdm-radio-group', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n role=\"radiogroup\"\n [ngClass]=\"[\n 'gap-2 text-sm',\n direction === 'horizontal' ? 'inline-flex items-center' : 'grid',\n className\n ]\"\n>\n <label *ngFor=\"let option of options\" [attr.for]=\"optionId(option)\" class=\"inline-flex cursor-pointer items-center gap-2\">\n <input\n [id]=\"optionId(option)\"\n type=\"radio\"\n [name]=\"name\"\n [value]=\"option.value\"\n [checked]=\"value === option.value\"\n [disabled]=\"option.disabled\"\n class=\"peer sr-only\"\n (change)=\"onChange($event)\"\n />\n <span class=\"relative block h-4 w-4 rounded-full border border-solid border-input bg-background peer-checked:border-primary peer-focus-visible:ring-2 peer-focus-visible:ring-ring peer-focus-visible:ring-offset-2 peer-focus-visible:ring-offset-background\">\n <span class=\"absolute left-1/2 top-1/2 hidden h-2 w-2 -translate-x-1/2 -translate-y-1/2 rounded-full bg-primary peer-checked:block\"></span>\n </span>\n <span class=\"text-foreground\">{{ option.label }}</span>\n </label>\n</div>\n" }]
|
|
5730
5750
|
}], propDecorators: { name: [{
|
|
5731
5751
|
type: Input
|
|
5732
5752
|
}], value: [{
|
|
@@ -5748,10 +5768,10 @@ class PdmScrollAreaComponent {
|
|
|
5748
5768
|
}
|
|
5749
5769
|
}
|
|
5750
5770
|
PdmScrollAreaComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmScrollAreaComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
5751
|
-
PdmScrollAreaComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmScrollAreaComponent, selector: "pdm-scroll-area", inputs: { maxHeight: "maxHeight", className: "className" }, ngImport: i0, template: "<div [style.maxHeight]=\"maxHeight\" [ngClass]=\"['relative overflow-auto rounded-md border border-border', className]\">\n <div class=\"p-3\">\n <ng-content></ng-content>\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
5771
|
+
PdmScrollAreaComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmScrollAreaComponent, selector: "pdm-scroll-area", inputs: { maxHeight: "maxHeight", className: "className" }, ngImport: i0, template: "<div [style.maxHeight]=\"maxHeight\" [ngClass]=\"['relative overflow-auto rounded-md border border-solid border-border', className]\">\n <div class=\"p-3\">\n <ng-content></ng-content>\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
5752
5772
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmScrollAreaComponent, decorators: [{
|
|
5753
5773
|
type: Component,
|
|
5754
|
-
args: [{ selector: 'pdm-scroll-area', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [style.maxHeight]=\"maxHeight\" [ngClass]=\"['relative overflow-auto rounded-md border border-border', className]\">\n <div class=\"p-3\">\n <ng-content></ng-content>\n </div>\n</div>\n" }]
|
|
5774
|
+
args: [{ selector: 'pdm-scroll-area', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [style.maxHeight]=\"maxHeight\" [ngClass]=\"['relative overflow-auto rounded-md border border-solid border-border', className]\">\n <div class=\"p-3\">\n <ng-content></ng-content>\n </div>\n</div>\n" }]
|
|
5755
5775
|
}], propDecorators: { maxHeight: [{
|
|
5756
5776
|
type: Input
|
|
5757
5777
|
}], className: [{
|
|
@@ -5870,10 +5890,10 @@ class PdmSheetComponent {
|
|
|
5870
5890
|
}
|
|
5871
5891
|
}
|
|
5872
5892
|
PdmSheetComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmSheetComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
5873
|
-
PdmSheetComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmSheetComponent, selector: "pdm-sheet", inputs: { open: "open", side: "side", size: "size", className: "className", closeOnEsc: "closeOnEsc", closeOnBackdropClick: "closeOnBackdropClick" }, outputs: { openChange: "openChange" }, host: { listeners: { "document:keydown.escape": "onEsc()" } }, ngImport: i0, template: "<div *ngIf=\"open\" class=\"fixed inset-0 z-50\">\n <button type=\"button\" class=\"absolute inset-0 appearance-none box-border border-0 bg-foreground/80 p-0\" aria-label=\"Close sheet\" (click)=\"onBackdropClick()\"></button>\n\n <section [ngClass]=\"['absolute z-[60] border border-border bg-background p-6 shadow-lg', panelClass, className]\" role=\"dialog\" aria-modal=\"true\">\n <button type=\"button\" class=\"absolute right-3 top-3 appearance-none box-border rounded-sm border-0 bg-transparent p-0 opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none\" (click)=\"close()\">\n <pdm-icon name=\"x\" [size]=\"16\"></pdm-icon>\n </button>\n <ng-content></ng-content>\n </section>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: PdmIconComponent, selector: "pdm-icon", inputs: ["name", "library", "assetUrl", "size", "strokeWidth", "className", "ariaLabel", "decorative"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
5893
|
+
PdmSheetComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmSheetComponent, selector: "pdm-sheet", inputs: { open: "open", side: "side", size: "size", className: "className", closeOnEsc: "closeOnEsc", closeOnBackdropClick: "closeOnBackdropClick" }, outputs: { openChange: "openChange" }, host: { listeners: { "document:keydown.escape": "onEsc()" } }, ngImport: i0, template: "<div *ngIf=\"open\" class=\"fixed inset-0 z-50\">\n <button type=\"button\" class=\"absolute inset-0 appearance-none box-border border-0 bg-foreground/80 p-0\" aria-label=\"Close sheet\" (click)=\"onBackdropClick()\"></button>\n\n <section [ngClass]=\"['absolute z-[60] border border-solid border-border bg-background p-6 shadow-lg', panelClass, className]\" role=\"dialog\" aria-modal=\"true\">\n <button type=\"button\" class=\"absolute right-3 top-3 appearance-none box-border rounded-sm border-0 bg-transparent p-0 opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none\" (click)=\"close()\">\n <pdm-icon name=\"x\" [size]=\"16\"></pdm-icon>\n </button>\n <ng-content></ng-content>\n </section>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: PdmIconComponent, selector: "pdm-icon", inputs: ["name", "library", "assetUrl", "size", "strokeWidth", "className", "ariaLabel", "decorative"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
5874
5894
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmSheetComponent, decorators: [{
|
|
5875
5895
|
type: Component,
|
|
5876
|
-
args: [{ selector: 'pdm-sheet', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div *ngIf=\"open\" class=\"fixed inset-0 z-50\">\n <button type=\"button\" class=\"absolute inset-0 appearance-none box-border border-0 bg-foreground/80 p-0\" aria-label=\"Close sheet\" (click)=\"onBackdropClick()\"></button>\n\n <section [ngClass]=\"['absolute z-[60] border border-border bg-background p-6 shadow-lg', panelClass, className]\" role=\"dialog\" aria-modal=\"true\">\n <button type=\"button\" class=\"absolute right-3 top-3 appearance-none box-border rounded-sm border-0 bg-transparent p-0 opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none\" (click)=\"close()\">\n <pdm-icon name=\"x\" [size]=\"16\"></pdm-icon>\n </button>\n <ng-content></ng-content>\n </section>\n</div>\n" }]
|
|
5896
|
+
args: [{ selector: 'pdm-sheet', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div *ngIf=\"open\" class=\"fixed inset-0 z-50\">\n <button type=\"button\" class=\"absolute inset-0 appearance-none box-border border-0 bg-foreground/80 p-0\" aria-label=\"Close sheet\" (click)=\"onBackdropClick()\"></button>\n\n <section [ngClass]=\"['absolute z-[60] border border-solid border-border bg-background p-6 shadow-lg', panelClass, className]\" role=\"dialog\" aria-modal=\"true\">\n <button type=\"button\" class=\"absolute right-3 top-3 appearance-none box-border rounded-sm border-0 bg-transparent p-0 opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none\" (click)=\"close()\">\n <pdm-icon name=\"x\" [size]=\"16\"></pdm-icon>\n </button>\n <ng-content></ng-content>\n </section>\n</div>\n" }]
|
|
5877
5897
|
}], propDecorators: { open: [{
|
|
5878
5898
|
type: Input
|
|
5879
5899
|
}], side: [{
|
|
@@ -5994,10 +6014,10 @@ class PdmSliderComponent {
|
|
|
5994
6014
|
}
|
|
5995
6015
|
}
|
|
5996
6016
|
PdmSliderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmSliderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
5997
|
-
PdmSliderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmSliderComponent, selector: "pdm-slider", inputs: { min: "min", max: "max", step: "step", value: "value", disabled: "disabled", className: "className" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "<div [ngClass]=\"['relative h-5 w-full', className]\">\n <div\n class=\"absolute left-0 right-0 top-1/2 h-1 -translate-y-1/2 rounded-full bg-muted\"\n ></div>\n <div\n class=\"absolute left-0 top-1/2 h-1 -translate-y-1/2 rounded-full bg-foreground\"\n [style.width.%]=\"percentage\"\n ></div>\n <div\n class=\"absolute top-1/2 h-4 w-4 -translate-x-1/2 -translate-y-1/2 rounded-full border border-foreground bg-background shadow-sm\"\n [style.left.%]=\"percentage\"\n ></div>\n <input\n type=\"range\"\n [min]=\"min\"\n [max]=\"max\"\n [step]=\"step\"\n [value]=\"value\"\n [disabled]=\"disabled\"\n class=\"absolute inset-0 h-full w-full appearance-none box-border cursor-pointer opacity-0 disabled:cursor-not-allowed\"\n (input)=\"onInput($event)\"\n />\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
6017
|
+
PdmSliderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmSliderComponent, selector: "pdm-slider", inputs: { min: "min", max: "max", step: "step", value: "value", disabled: "disabled", className: "className" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "<div [ngClass]=\"['relative h-5 w-full', className]\">\n <div\n class=\"absolute left-0 right-0 top-1/2 h-1 -translate-y-1/2 rounded-full bg-muted\"\n ></div>\n <div\n class=\"absolute left-0 top-1/2 h-1 -translate-y-1/2 rounded-full bg-foreground\"\n [style.width.%]=\"percentage\"\n ></div>\n <div\n class=\"absolute top-1/2 h-4 w-4 -translate-x-1/2 -translate-y-1/2 rounded-full border border-solid border-foreground bg-background shadow-sm\"\n [style.left.%]=\"percentage\"\n ></div>\n <input\n type=\"range\"\n [min]=\"min\"\n [max]=\"max\"\n [step]=\"step\"\n [value]=\"value\"\n [disabled]=\"disabled\"\n class=\"absolute inset-0 h-full w-full appearance-none box-border cursor-pointer opacity-0 disabled:cursor-not-allowed\"\n (input)=\"onInput($event)\"\n />\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
5998
6018
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmSliderComponent, decorators: [{
|
|
5999
6019
|
type: Component,
|
|
6000
|
-
args: [{ selector: 'pdm-slider', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [ngClass]=\"['relative h-5 w-full', className]\">\n <div\n class=\"absolute left-0 right-0 top-1/2 h-1 -translate-y-1/2 rounded-full bg-muted\"\n ></div>\n <div\n class=\"absolute left-0 top-1/2 h-1 -translate-y-1/2 rounded-full bg-foreground\"\n [style.width.%]=\"percentage\"\n ></div>\n <div\n class=\"absolute top-1/2 h-4 w-4 -translate-x-1/2 -translate-y-1/2 rounded-full border border-foreground bg-background shadow-sm\"\n [style.left.%]=\"percentage\"\n ></div>\n <input\n type=\"range\"\n [min]=\"min\"\n [max]=\"max\"\n [step]=\"step\"\n [value]=\"value\"\n [disabled]=\"disabled\"\n class=\"absolute inset-0 h-full w-full appearance-none box-border cursor-pointer opacity-0 disabled:cursor-not-allowed\"\n (input)=\"onInput($event)\"\n />\n</div>\n" }]
|
|
6020
|
+
args: [{ selector: 'pdm-slider', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [ngClass]=\"['relative h-5 w-full', className]\">\n <div\n class=\"absolute left-0 right-0 top-1/2 h-1 -translate-y-1/2 rounded-full bg-muted\"\n ></div>\n <div\n class=\"absolute left-0 top-1/2 h-1 -translate-y-1/2 rounded-full bg-foreground\"\n [style.width.%]=\"percentage\"\n ></div>\n <div\n class=\"absolute top-1/2 h-4 w-4 -translate-x-1/2 -translate-y-1/2 rounded-full border border-solid border-foreground bg-background shadow-sm\"\n [style.left.%]=\"percentage\"\n ></div>\n <input\n type=\"range\"\n [min]=\"min\"\n [max]=\"max\"\n [step]=\"step\"\n [value]=\"value\"\n [disabled]=\"disabled\"\n class=\"absolute inset-0 h-full w-full appearance-none box-border cursor-pointer opacity-0 disabled:cursor-not-allowed\"\n (input)=\"onInput($event)\"\n />\n</div>\n" }]
|
|
6001
6021
|
}], propDecorators: { min: [{
|
|
6002
6022
|
type: Input
|
|
6003
6023
|
}], max: [{
|
|
@@ -6033,10 +6053,10 @@ class PdmSonnerComponent {
|
|
|
6033
6053
|
}
|
|
6034
6054
|
}
|
|
6035
6055
|
PdmSonnerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmSonnerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
6036
|
-
PdmSonnerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmSonnerComponent, selector: "pdm-sonner", inputs: { title: "title", description: "description", tone: "tone", className: "className" }, outputs: { dismissed: "dismissed" }, ngImport: i0, template: "<div [ngClass]=\"['flex w-full max-w-sm items-start gap-3 rounded-lg border p-4 shadow-lg', toneClass, className]\" role=\"status\" aria-live=\"polite\">\n <div class=\"grid gap-0.5\">\n <p *ngIf=\"title\" class=\"m-0 text-sm font-semibold\">{{ title }}</p>\n <p *ngIf=\"description\" class=\"m-0 text-sm opacity-90\">{{ description }}</p>\n <ng-content></ng-content>\n </div>\n <button type=\"button\" class=\"ml-auto appearance-none box-border rounded-sm border-0 bg-transparent p-0 opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none\" (click)=\"dismissed.emit()\" aria-label=\"Dismiss\">\n <pdm-icon name=\"x\" [size]=\"14\"></pdm-icon>\n </button>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: PdmIconComponent, selector: "pdm-icon", inputs: ["name", "library", "assetUrl", "size", "strokeWidth", "className", "ariaLabel", "decorative"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
6056
|
+
PdmSonnerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmSonnerComponent, selector: "pdm-sonner", inputs: { title: "title", description: "description", tone: "tone", className: "className" }, outputs: { dismissed: "dismissed" }, ngImport: i0, template: "<div [ngClass]=\"['flex w-full max-w-sm items-start gap-3 rounded-lg border border-solid p-4 shadow-lg', toneClass, className]\" role=\"status\" aria-live=\"polite\">\n <div class=\"grid gap-0.5\">\n <p *ngIf=\"title\" class=\"m-0 text-sm font-semibold\">{{ title }}</p>\n <p *ngIf=\"description\" class=\"m-0 text-sm opacity-90\">{{ description }}</p>\n <ng-content></ng-content>\n </div>\n <button type=\"button\" class=\"ml-auto appearance-none box-border rounded-sm border-0 bg-transparent p-0 opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none\" (click)=\"dismissed.emit()\" aria-label=\"Dismiss\">\n <pdm-icon name=\"x\" [size]=\"14\"></pdm-icon>\n </button>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: PdmIconComponent, selector: "pdm-icon", inputs: ["name", "library", "assetUrl", "size", "strokeWidth", "className", "ariaLabel", "decorative"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
6037
6057
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmSonnerComponent, decorators: [{
|
|
6038
6058
|
type: Component,
|
|
6039
|
-
args: [{ selector: 'pdm-sonner', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [ngClass]=\"['flex w-full max-w-sm items-start gap-3 rounded-lg border p-4 shadow-lg', toneClass, className]\" role=\"status\" aria-live=\"polite\">\n <div class=\"grid gap-0.5\">\n <p *ngIf=\"title\" class=\"m-0 text-sm font-semibold\">{{ title }}</p>\n <p *ngIf=\"description\" class=\"m-0 text-sm opacity-90\">{{ description }}</p>\n <ng-content></ng-content>\n </div>\n <button type=\"button\" class=\"ml-auto appearance-none box-border rounded-sm border-0 bg-transparent p-0 opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none\" (click)=\"dismissed.emit()\" aria-label=\"Dismiss\">\n <pdm-icon name=\"x\" [size]=\"14\"></pdm-icon>\n </button>\n</div>\n" }]
|
|
6059
|
+
args: [{ selector: 'pdm-sonner', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [ngClass]=\"['flex w-full max-w-sm items-start gap-3 rounded-lg border border-solid p-4 shadow-lg', toneClass, className]\" role=\"status\" aria-live=\"polite\">\n <div class=\"grid gap-0.5\">\n <p *ngIf=\"title\" class=\"m-0 text-sm font-semibold\">{{ title }}</p>\n <p *ngIf=\"description\" class=\"m-0 text-sm opacity-90\">{{ description }}</p>\n <ng-content></ng-content>\n </div>\n <button type=\"button\" class=\"ml-auto appearance-none box-border rounded-sm border-0 bg-transparent p-0 opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none\" (click)=\"dismissed.emit()\" aria-label=\"Dismiss\">\n <pdm-icon name=\"x\" [size]=\"14\"></pdm-icon>\n </button>\n</div>\n" }]
|
|
6040
6060
|
}], propDecorators: { title: [{
|
|
6041
6061
|
type: Input
|
|
6042
6062
|
}], description: [{
|
|
@@ -6079,7 +6099,7 @@ class PdmSwitchComponent {
|
|
|
6079
6099
|
}
|
|
6080
6100
|
get rootClasses() {
|
|
6081
6101
|
return [
|
|
6082
|
-
"peer relative inline-flex appearance-none box-border shrink-0 items-center justify-start rounded-full border border-transparent p-0 outline-none transition-all focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50",
|
|
6102
|
+
"peer relative inline-flex appearance-none box-border shrink-0 items-center justify-start rounded-full border border-solid border-transparent p-0 outline-none transition-all focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50",
|
|
6083
6103
|
this.size === "sm" ? "h-[14px] w-[24px]" : "h-[18.4px] w-[32px]",
|
|
6084
6104
|
this.checked ? "bg-primary" : "bg-input dark:bg-input/80",
|
|
6085
6105
|
];
|
|
@@ -6138,10 +6158,10 @@ class PdmTabsComponent {
|
|
|
6138
6158
|
}
|
|
6139
6159
|
}
|
|
6140
6160
|
PdmTabsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmTabsComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
6141
|
-
PdmTabsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmTabsComponent, selector: "pdm-tabs", inputs: { items: "items", value: "value", className: "className" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "<div [ngClass]=\"['w-full', className]\">\n <div\n role=\"tablist\"\n class=\"inline-flex h-8 w-full items-center overflow-x-auto scrollbar-thin rounded-lg bg-muted p-[3px] text-muted-foreground md:w-fit\"\n >\n <button\n *ngFor=\"let item of items\"\n role=\"tab\"\n [attr.aria-selected]=\"value === item.value\"\n [disabled]=\"item.disabled\"\n [ngClass]=\"[\n 'relative inline-flex h-[calc(100%-1px)] appearance-none box-border flex-1 items-center justify-center gap-1.5 whitespace-nowrap rounded-md border border-transparent px-3 py-0.5 text-sm font-medium transition-all focus-visible:border-ring focus-visible:outline-none focus-visible:outline-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:pointer-events-none disabled:opacity-50 md:flex-initial md:px-4',\n value === item.value ? 'bg-background text-foreground shadow-sm' : 'bg-transparent text-muted-foreground'\n ]\"\n (click)=\"select(item)\"\n type=\"button\"\n >\n {{ item.label }}\n </button>\n </div>\n <div class=\"mt-4\">\n <ng-content></ng-content>\n </div>\n</div>\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
6161
|
+
PdmTabsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmTabsComponent, selector: "pdm-tabs", inputs: { items: "items", value: "value", className: "className" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "<div [ngClass]=\"['w-full', className]\">\n <div\n role=\"tablist\"\n class=\"inline-flex h-8 w-full items-center overflow-x-auto scrollbar-thin rounded-lg bg-muted p-[3px] text-muted-foreground md:w-fit\"\n >\n <button\n *ngFor=\"let item of items\"\n role=\"tab\"\n [attr.aria-selected]=\"value === item.value\"\n [disabled]=\"item.disabled\"\n [ngClass]=\"[\n 'relative inline-flex h-[calc(100%-1px)] appearance-none box-border flex-1 items-center justify-center gap-1.5 whitespace-nowrap rounded-md border border-solid border-transparent px-3 py-0.5 text-sm font-medium transition-all focus-visible:border-ring focus-visible:outline-none focus-visible:outline-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:pointer-events-none disabled:opacity-50 md:flex-initial md:px-4',\n value === item.value ? 'bg-background text-foreground shadow-sm' : 'bg-transparent text-muted-foreground'\n ]\"\n (click)=\"select(item)\"\n type=\"button\"\n >\n {{ item.label }}\n </button>\n </div>\n <div class=\"mt-4\">\n <ng-content></ng-content>\n </div>\n</div>\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
6142
6162
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmTabsComponent, decorators: [{
|
|
6143
6163
|
type: Component,
|
|
6144
|
-
args: [{ selector: "pdm-tabs", changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [ngClass]=\"['w-full', className]\">\n <div\n role=\"tablist\"\n class=\"inline-flex h-8 w-full items-center overflow-x-auto scrollbar-thin rounded-lg bg-muted p-[3px] text-muted-foreground md:w-fit\"\n >\n <button\n *ngFor=\"let item of items\"\n role=\"tab\"\n [attr.aria-selected]=\"value === item.value\"\n [disabled]=\"item.disabled\"\n [ngClass]=\"[\n 'relative inline-flex h-[calc(100%-1px)] appearance-none box-border flex-1 items-center justify-center gap-1.5 whitespace-nowrap rounded-md border border-transparent px-3 py-0.5 text-sm font-medium transition-all focus-visible:border-ring focus-visible:outline-none focus-visible:outline-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:pointer-events-none disabled:opacity-50 md:flex-initial md:px-4',\n value === item.value ? 'bg-background text-foreground shadow-sm' : 'bg-transparent text-muted-foreground'\n ]\"\n (click)=\"select(item)\"\n type=\"button\"\n >\n {{ item.label }}\n </button>\n </div>\n <div class=\"mt-4\">\n <ng-content></ng-content>\n </div>\n</div>\n", styles: [":host{display:block}\n"] }]
|
|
6164
|
+
args: [{ selector: "pdm-tabs", changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [ngClass]=\"['w-full', className]\">\n <div\n role=\"tablist\"\n class=\"inline-flex h-8 w-full items-center overflow-x-auto scrollbar-thin rounded-lg bg-muted p-[3px] text-muted-foreground md:w-fit\"\n >\n <button\n *ngFor=\"let item of items\"\n role=\"tab\"\n [attr.aria-selected]=\"value === item.value\"\n [disabled]=\"item.disabled\"\n [ngClass]=\"[\n 'relative inline-flex h-[calc(100%-1px)] appearance-none box-border flex-1 items-center justify-center gap-1.5 whitespace-nowrap rounded-md border border-solid border-transparent px-3 py-0.5 text-sm font-medium transition-all focus-visible:border-ring focus-visible:outline-none focus-visible:outline-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:pointer-events-none disabled:opacity-50 md:flex-initial md:px-4',\n value === item.value ? 'bg-background text-foreground shadow-sm' : 'bg-transparent text-muted-foreground'\n ]\"\n (click)=\"select(item)\"\n type=\"button\"\n >\n {{ item.label }}\n </button>\n </div>\n <div class=\"mt-4\">\n <ng-content></ng-content>\n </div>\n</div>\n", styles: [":host{display:block}\n"] }]
|
|
6145
6165
|
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { items: [{
|
|
6146
6166
|
type: Input
|
|
6147
6167
|
}], value: [{
|
|
@@ -6174,10 +6194,10 @@ class PdmTextareaComponent {
|
|
|
6174
6194
|
}
|
|
6175
6195
|
}
|
|
6176
6196
|
PdmTextareaComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmTextareaComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
6177
|
-
PdmTextareaComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmTextareaComponent, selector: "pdm-textarea", inputs: { id: "id", value: "value", placeholder: "placeholder", rows: "rows", disabled: "disabled", readonly: "readonly", required: "required", invalid: "invalid", className: "className", textareaClassName: "textareaClassName", label: "label", helperText: "helperText", errorText: "errorText" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "<div [ngClass]=\"['grid w-full gap-2', className]\">\n <label\n *ngIf=\"label\"\n [attr.for]=\"id\"\n [ngClass]=\"[\n 'text-sm font-medium leading-none',\n invalid ? 'text-destructive' : 'text-foreground',\n ]\"\n >{{ label }}</label\n >\n <textarea\n [id]=\"id\"\n [rows]=\"rows\"\n [value]=\"value\"\n [placeholder]=\"placeholder\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [required]=\"required\"\n [attr.aria-invalid]=\"invalid\"\n [ngClass]=\"[\n 'border-input focus-visible:border-ring focus-visible:ring-2 focus-visible:ring-ring/50 aria-invalid:ring-2 aria-invalid:ring-destructive aria-invalid:border-destructive aria-invalid:placeholder:text-destructive/70 placeholder:text-muted-foreground flex min-h-20 w-full appearance-none box-border rounded-md border bg-transparent px-3 py-2 text-sm shadow-sm outline-none disabled:cursor-not-allowed disabled:opacity-50',\n textareaClassName,\n ]\"\n (input)=\"onInput($event)\"\n ></textarea>\n <p *ngIf=\"!invalid && helperText\" class=\"m-0 text-sm text-muted-foreground\">\n {{ helperText }}\n </p>\n <p *ngIf=\"invalid && errorText\" class=\"m-0 text-sm text-destructive\">\n {{ errorText }}\n </p>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
6197
|
+
PdmTextareaComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmTextareaComponent, selector: "pdm-textarea", inputs: { id: "id", value: "value", placeholder: "placeholder", rows: "rows", disabled: "disabled", readonly: "readonly", required: "required", invalid: "invalid", className: "className", textareaClassName: "textareaClassName", label: "label", helperText: "helperText", errorText: "errorText" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "<div [ngClass]=\"['grid w-full gap-2', className]\">\n <label\n *ngIf=\"label\"\n [attr.for]=\"id\"\n [ngClass]=\"[\n 'text-sm font-medium leading-none',\n invalid ? 'text-destructive' : 'text-foreground',\n ]\"\n >{{ label }}</label\n >\n <textarea\n [id]=\"id\"\n [rows]=\"rows\"\n [value]=\"value\"\n [placeholder]=\"placeholder\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [required]=\"required\"\n [attr.aria-invalid]=\"invalid\"\n [ngClass]=\"[\n 'border-input focus-visible:border-ring focus-visible:ring-2 focus-visible:ring-ring/50 aria-invalid:ring-2 aria-invalid:ring-destructive aria-invalid:border-destructive aria-invalid:placeholder:text-destructive/70 placeholder:text-muted-foreground flex min-h-20 w-full appearance-none box-border rounded-md border border-solid bg-transparent px-3 py-2 text-sm shadow-sm outline-none disabled:cursor-not-allowed disabled:opacity-50',\n textareaClassName,\n ]\"\n (input)=\"onInput($event)\"\n ></textarea>\n <p *ngIf=\"!invalid && helperText\" class=\"m-0 text-sm text-muted-foreground\">\n {{ helperText }}\n </p>\n <p *ngIf=\"invalid && errorText\" class=\"m-0 text-sm text-destructive\">\n {{ errorText }}\n </p>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
6178
6198
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmTextareaComponent, decorators: [{
|
|
6179
6199
|
type: Component,
|
|
6180
|
-
args: [{ selector: 'pdm-textarea', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [ngClass]=\"['grid w-full gap-2', className]\">\n <label\n *ngIf=\"label\"\n [attr.for]=\"id\"\n [ngClass]=\"[\n 'text-sm font-medium leading-none',\n invalid ? 'text-destructive' : 'text-foreground',\n ]\"\n >{{ label }}</label\n >\n <textarea\n [id]=\"id\"\n [rows]=\"rows\"\n [value]=\"value\"\n [placeholder]=\"placeholder\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [required]=\"required\"\n [attr.aria-invalid]=\"invalid\"\n [ngClass]=\"[\n 'border-input focus-visible:border-ring focus-visible:ring-2 focus-visible:ring-ring/50 aria-invalid:ring-2 aria-invalid:ring-destructive aria-invalid:border-destructive aria-invalid:placeholder:text-destructive/70 placeholder:text-muted-foreground flex min-h-20 w-full appearance-none box-border rounded-md border bg-transparent px-3 py-2 text-sm shadow-sm outline-none disabled:cursor-not-allowed disabled:opacity-50',\n textareaClassName,\n ]\"\n (input)=\"onInput($event)\"\n ></textarea>\n <p *ngIf=\"!invalid && helperText\" class=\"m-0 text-sm text-muted-foreground\">\n {{ helperText }}\n </p>\n <p *ngIf=\"invalid && errorText\" class=\"m-0 text-sm text-destructive\">\n {{ errorText }}\n </p>\n</div>\n" }]
|
|
6200
|
+
args: [{ selector: 'pdm-textarea', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [ngClass]=\"['grid w-full gap-2', className]\">\n <label\n *ngIf=\"label\"\n [attr.for]=\"id\"\n [ngClass]=\"[\n 'text-sm font-medium leading-none',\n invalid ? 'text-destructive' : 'text-foreground',\n ]\"\n >{{ label }}</label\n >\n <textarea\n [id]=\"id\"\n [rows]=\"rows\"\n [value]=\"value\"\n [placeholder]=\"placeholder\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [required]=\"required\"\n [attr.aria-invalid]=\"invalid\"\n [ngClass]=\"[\n 'border-input focus-visible:border-ring focus-visible:ring-2 focus-visible:ring-ring/50 aria-invalid:ring-2 aria-invalid:ring-destructive aria-invalid:border-destructive aria-invalid:placeholder:text-destructive/70 placeholder:text-muted-foreground flex min-h-20 w-full appearance-none box-border rounded-md border border-solid bg-transparent px-3 py-2 text-sm shadow-sm outline-none disabled:cursor-not-allowed disabled:opacity-50',\n textareaClassName,\n ]\"\n (input)=\"onInput($event)\"\n ></textarea>\n <p *ngIf=\"!invalid && helperText\" class=\"m-0 text-sm text-muted-foreground\">\n {{ helperText }}\n </p>\n <p *ngIf=\"invalid && errorText\" class=\"m-0 text-sm text-destructive\">\n {{ errorText }}\n </p>\n</div>\n" }]
|
|
6181
6201
|
}], propDecorators: { id: [{
|
|
6182
6202
|
type: Input
|
|
6183
6203
|
}], value: [{
|
|
@@ -6260,10 +6280,10 @@ class PdmToggleGroupComponent {
|
|
|
6260
6280
|
}
|
|
6261
6281
|
}
|
|
6262
6282
|
PdmToggleGroupComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmToggleGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
6263
|
-
PdmToggleGroupComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmToggleGroupComponent, selector: "pdm-toggle-group", inputs: { items: "items", value: "value", className: "className" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "<div\n [ngClass]=\"[\n 'flex flex-wrap items-center rounded-md border border-border p-1 gap-1',\n className,\n ]\"\n role=\"group\"\n>\n <button\n *ngFor=\"let item of items\"\n type=\"button\"\n [disabled]=\"item.disabled\"\n [attr.aria-pressed]=\"item.value === value\"\n [ngClass]=\"[\n 'inline-flex h-8 appearance-none box-border items-center justify-center rounded-sm border-0 bg-transparent px-2.5 text-sm font-medium transition-colors disabled:pointer-events-none disabled:opacity-50 ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2',\n item.value === value\n ? 'bg-accent text-accent-foreground'\n : 'text-foreground hover:bg-accent hover:text-accent-foreground',\n ]\"\n (click)=\"onSelect(item.value, item.disabled)\"\n >\n {{ item.label }}\n </button>\n</div>\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
6283
|
+
PdmToggleGroupComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PdmToggleGroupComponent, selector: "pdm-toggle-group", inputs: { items: "items", value: "value", className: "className" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "<div\n [ngClass]=\"[\n 'flex flex-wrap items-center rounded-md border border-solid border-border p-1 gap-1',\n className,\n ]\"\n role=\"group\"\n>\n <button\n *ngFor=\"let item of items\"\n type=\"button\"\n [disabled]=\"item.disabled\"\n [attr.aria-pressed]=\"item.value === value\"\n [ngClass]=\"[\n 'inline-flex h-8 appearance-none box-border items-center justify-center rounded-sm border-0 bg-transparent px-2.5 text-sm font-medium transition-colors disabled:pointer-events-none disabled:opacity-50 ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2',\n item.value === value\n ? 'bg-accent text-accent-foreground'\n : 'text-foreground hover:bg-accent hover:text-accent-foreground',\n ]\"\n (click)=\"onSelect(item.value, item.disabled)\"\n >\n {{ item.label }}\n </button>\n</div>\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
6264
6284
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PdmToggleGroupComponent, decorators: [{
|
|
6265
6285
|
type: Component,
|
|
6266
|
-
args: [{ selector: "pdm-toggle-group", changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n [ngClass]=\"[\n 'flex flex-wrap items-center rounded-md border border-border p-1 gap-1',\n className,\n ]\"\n role=\"group\"\n>\n <button\n *ngFor=\"let item of items\"\n type=\"button\"\n [disabled]=\"item.disabled\"\n [attr.aria-pressed]=\"item.value === value\"\n [ngClass]=\"[\n 'inline-flex h-8 appearance-none box-border items-center justify-center rounded-sm border-0 bg-transparent px-2.5 text-sm font-medium transition-colors disabled:pointer-events-none disabled:opacity-50 ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2',\n item.value === value\n ? 'bg-accent text-accent-foreground'\n : 'text-foreground hover:bg-accent hover:text-accent-foreground',\n ]\"\n (click)=\"onSelect(item.value, item.disabled)\"\n >\n {{ item.label }}\n </button>\n</div>\n", styles: [":host{display:block}\n"] }]
|
|
6286
|
+
args: [{ selector: "pdm-toggle-group", changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n [ngClass]=\"[\n 'flex flex-wrap items-center rounded-md border border-solid border-border p-1 gap-1',\n className,\n ]\"\n role=\"group\"\n>\n <button\n *ngFor=\"let item of items\"\n type=\"button\"\n [disabled]=\"item.disabled\"\n [attr.aria-pressed]=\"item.value === value\"\n [ngClass]=\"[\n 'inline-flex h-8 appearance-none box-border items-center justify-center rounded-sm border-0 bg-transparent px-2.5 text-sm font-medium transition-colors disabled:pointer-events-none disabled:opacity-50 ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2',\n item.value === value\n ? 'bg-accent text-accent-foreground'\n : 'text-foreground hover:bg-accent hover:text-accent-foreground',\n ]\"\n (click)=\"onSelect(item.value, item.disabled)\"\n >\n {{ item.label }}\n </button>\n</div>\n", styles: [":host{display:block}\n"] }]
|
|
6267
6287
|
}], propDecorators: { items: [{
|
|
6268
6288
|
type: Input
|
|
6269
6289
|
}], value: [{
|