nath-angular-ui 0.4.1 → 0.5.0
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.
|
@@ -4,7 +4,7 @@ import * as i1 from '@angular/common';
|
|
|
4
4
|
import { CommonModule, NgTemplateOutlet, DOCUMENT, NgStyle, NgClass, KeyValuePipe } from '@angular/common';
|
|
5
5
|
import * as i2 from '@angular/cdk/overlay';
|
|
6
6
|
import { OverlayModule } from '@angular/cdk/overlay';
|
|
7
|
-
import { LucideX, LucideChevronDown, isLucideIconComponent, LucideDynamicIcon, LucideMinimize2, LucideMaximize2, LucideEye, LucideLoaderCircle, LucideSquare, LucideSquareCheck, LucideInbox, LucideChevronRight, LucideChevronsRight, LucideChevronLeft, LucideChevronsLeft, LucideCircle, LucideArrowUp, LucideArrowDown, LucideArrowUp01, LucideArrowDown01, LucideArrowUpAZ, LucideArrowDownAZ, LucideMoon, LucideSun, LucideCircleCheck, LucideCircleAlert, LucideInfo, LucideTriangleAlert } from '@lucide/angular';
|
|
7
|
+
import { LucideX, LucideChevronDown, isLucideIconComponent, LucideDynamicIcon, LucideHouse, LucideMinimize2, LucideMaximize2, LucideEye, LucideLoaderCircle, LucideSquare, LucideSquareCheck, LucideInbox, LucideChevronRight, LucideChevronsRight, LucideChevronLeft, LucideChevronsLeft, LucideCircle, LucideArrowUp, LucideArrowDown, LucideArrowUp01, LucideArrowDown01, LucideArrowUpAZ, LucideArrowDownAZ, LucideMoon, LucideSun, LucideCircleCheck, LucideCircleAlert, LucideInfo, LucideTriangleAlert } from '@lucide/angular';
|
|
8
8
|
import * as i1$1 from '@angular/router';
|
|
9
9
|
import { RouterModule, Router, NavigationEnd, RouterLink, RouterLinkActive } from '@angular/router';
|
|
10
10
|
import * as i1$2 from '@angular/forms';
|
|
@@ -306,11 +306,22 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
|
|
|
306
306
|
}], ctorParameters: () => [], propDecorators: { mode: [{ type: i0.Input, args: [{ isSignal: true, alias: "mode", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], allowIndeterminate: [{ type: i0.Input, args: [{ isSignal: true, alias: "allowIndeterminate", required: false }] }], inputId: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputId", required: false }] }], styleClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "styleClass", required: false }] }], yesLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "yesLabel", required: false }] }], noLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "noLabel", required: false }] }], indeterminateLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "indeterminateLabel", required: false }] }], icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], toggled: [{ type: i0.Output, args: ["toggled"] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }, { type: i0.Output, args: ["disabledChange"] }], checkboxRef: [{ type: i0.ViewChild, args: ['checkboxElement', { isSignal: true }] }] } });
|
|
307
307
|
|
|
308
308
|
class BreadcrumbService {
|
|
309
|
+
// A private writable signal holding the home item which will always be visible, if any
|
|
310
|
+
_home = signal(null, /* @ts-ignore */
|
|
311
|
+
...(ngDevMode ? [{ debugName: "_home" }] : /* istanbul ignore next */ []));
|
|
309
312
|
// A private writable signal holding the current breadcrumbs array
|
|
310
313
|
_breadcrumbs = signal([], /* @ts-ignore */
|
|
311
314
|
...(ngDevMode ? [{ debugName: "_breadcrumbs" }] : /* istanbul ignore next */ []));
|
|
312
|
-
// Expose as a read-only
|
|
315
|
+
// Expose as a read-only signals so components can only read, not mutate directly
|
|
316
|
+
home = this._home.asReadonly();
|
|
313
317
|
breadcrumbs = this._breadcrumbs.asReadonly();
|
|
318
|
+
/**
|
|
319
|
+
* Set the home item
|
|
320
|
+
* @param crumb The home item
|
|
321
|
+
*/
|
|
322
|
+
setHome(crumb) {
|
|
323
|
+
this._home.set(crumb);
|
|
324
|
+
}
|
|
314
325
|
/**
|
|
315
326
|
* Set the breadcrumbs for the current view.
|
|
316
327
|
* @param crumbs Array of breadcrumbs items
|
|
@@ -340,13 +351,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
|
|
|
340
351
|
class NathBreadcrumbs {
|
|
341
352
|
breadcrumbService = inject(BreadcrumbService);
|
|
342
353
|
// Directly expose the read-only signal to the template
|
|
354
|
+
home = this.breadcrumbService.home;
|
|
343
355
|
breadcrumbs = this.breadcrumbService.breadcrumbs;
|
|
344
356
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: NathBreadcrumbs, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
345
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: NathBreadcrumbs, isStandalone: true, selector: "nath-breadcrumbs", ngImport: i0, template: "@if (breadcrumbs().length > 0) {\
|
|
357
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: NathBreadcrumbs, isStandalone: true, selector: "nath-breadcrumbs", ngImport: i0, template: "@if (home() || breadcrumbs().length > 0) {\n <nav aria-label=\"breadcrumb\" class=\"nath-breadcrumb-container\">\n <ol class=\"nath-breadcrumb-list\">\n @let h = home();\n @if (h) {\n <li class=\"nath-breadcrumb-item\">\n @if (h.routerLink) {\n <a\n class=\"nath-breadcrumb-link\"\n [routerLink]=\"h.routerLink\"\n [queryParams]=\"h.queryParams\"\n [routerLinkActive]=\"h.routerLinkActive ?? []\"\n [routerLinkActiveOptions]=\"h.routerLinkActiveOptions ?? { exact: false }\"\n ><svg lucideHouse [size]=\"16\"\n /></a>\n } @else {\n <span class=\"nath-breadcrumb-current\" aria-current=\"page\"\n ><svg lucideHouse [size]=\"16\"\n /></span>\n }\n </li>\n }\n @for (crumb of breadcrumbs(); track crumb.label; let last = $last) {\n <li class=\"nath-breadcrumb-item\" [class.is-active]=\"last\">\n @if (crumb.routerLink && !last) {\n <a\n class=\"nath-breadcrumb-link\"\n [routerLink]=\"crumb.routerLink\"\n [queryParams]=\"crumb.queryParams\"\n [routerLinkActive]=\"crumb.routerLinkActive ?? []\"\n [routerLinkActiveOptions]=\"crumb.routerLinkActiveOptions ?? { exact: false }\"\n >{{ crumb.label }}</a\n >\n } @else {\n <span class=\"nath-breadcrumb-current\" aria-current=\"page\">{{ crumb.label }}</span>\n }\n </li>\n }\n </ol>\n </nav>\n}\n", styles: ["nath-breadcrumbs,.nath-breadcrumbs-theme{--nath-breadcrumb-gap: .5rem;--nath-breadcrumb-padding-y: 1rem;--nath-breadcrumb-separator: \"/\";--nath-breadcrumb-separator-margin: .5rem;--nath-breadcrumb-separator-color: #a1a1aa;--nath-breadcrumb-link-color: #3b82f6;--nath-breadcrumb-link-hover-color: #2563eb;--nath-breadcrumb-active-color: #6c757d;--nath-breadcrumb-active-font-weight: 500}.dark nath-breadcrumbs,.dark .nath-breadcrumbs-theme{--nath-breadcrumb-separator-color: #52525b;--nath-breadcrumb-link-color: #60a5fa;--nath-breadcrumb-link-hover-color: #93c5fd;--nath-breadcrumb-active-color: #a1a1aa}.nath-breadcrumb-container{display:block}.nath-breadcrumb-list{display:flex;flex-wrap:wrap;align-items:center;gap:var(--nath-breadcrumb-gap);padding-top:var(--nath-breadcrumb-padding-y);padding-bottom:var(--nath-breadcrumb-padding-y);list-style:none;margin:0}.nath-breadcrumb-item{display:flex;align-items:center}.nath-breadcrumb-item:not(:last-child):after{content:var(--nath-breadcrumb-separator);margin-left:var(--nath-breadcrumb-separator-margin);color:var(--nath-breadcrumb-separator-color)}.nath-breadcrumb-link{color:var(--nath-breadcrumb-link-color);text-decoration:none;transition:color .2s ease-in-out}.nath-breadcrumb-link:hover{color:var(--nath-breadcrumb-link-hover-color);text-decoration:underline}.nath-breadcrumb-current{color:var(--nath-breadcrumb-active-color);font-weight:var(--nath-breadcrumb-active-font-weight)}\n"], dependencies: [{ kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "browserUrl", "routerLink"] }, { kind: "directive", type: i1$1.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "component", type: LucideHouse, selector: "svg[lucideHouse], svg[lucideHome]" }], encapsulation: i0.ViewEncapsulation.None });
|
|
346
358
|
}
|
|
347
359
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: NathBreadcrumbs, decorators: [{
|
|
348
360
|
type: Component,
|
|
349
|
-
args: [{ selector: 'nath-breadcrumbs', imports: [RouterModule], encapsulation: ViewEncapsulation.None, template: "@if (breadcrumbs().length > 0) {\
|
|
361
|
+
args: [{ selector: 'nath-breadcrumbs', imports: [RouterModule, LucideHouse], encapsulation: ViewEncapsulation.None, template: "@if (home() || breadcrumbs().length > 0) {\n <nav aria-label=\"breadcrumb\" class=\"nath-breadcrumb-container\">\n <ol class=\"nath-breadcrumb-list\">\n @let h = home();\n @if (h) {\n <li class=\"nath-breadcrumb-item\">\n @if (h.routerLink) {\n <a\n class=\"nath-breadcrumb-link\"\n [routerLink]=\"h.routerLink\"\n [queryParams]=\"h.queryParams\"\n [routerLinkActive]=\"h.routerLinkActive ?? []\"\n [routerLinkActiveOptions]=\"h.routerLinkActiveOptions ?? { exact: false }\"\n ><svg lucideHouse [size]=\"16\"\n /></a>\n } @else {\n <span class=\"nath-breadcrumb-current\" aria-current=\"page\"\n ><svg lucideHouse [size]=\"16\"\n /></span>\n }\n </li>\n }\n @for (crumb of breadcrumbs(); track crumb.label; let last = $last) {\n <li class=\"nath-breadcrumb-item\" [class.is-active]=\"last\">\n @if (crumb.routerLink && !last) {\n <a\n class=\"nath-breadcrumb-link\"\n [routerLink]=\"crumb.routerLink\"\n [queryParams]=\"crumb.queryParams\"\n [routerLinkActive]=\"crumb.routerLinkActive ?? []\"\n [routerLinkActiveOptions]=\"crumb.routerLinkActiveOptions ?? { exact: false }\"\n >{{ crumb.label }}</a\n >\n } @else {\n <span class=\"nath-breadcrumb-current\" aria-current=\"page\">{{ crumb.label }}</span>\n }\n </li>\n }\n </ol>\n </nav>\n}\n", styles: ["nath-breadcrumbs,.nath-breadcrumbs-theme{--nath-breadcrumb-gap: .5rem;--nath-breadcrumb-padding-y: 1rem;--nath-breadcrumb-separator: \"/\";--nath-breadcrumb-separator-margin: .5rem;--nath-breadcrumb-separator-color: #a1a1aa;--nath-breadcrumb-link-color: #3b82f6;--nath-breadcrumb-link-hover-color: #2563eb;--nath-breadcrumb-active-color: #6c757d;--nath-breadcrumb-active-font-weight: 500}.dark nath-breadcrumbs,.dark .nath-breadcrumbs-theme{--nath-breadcrumb-separator-color: #52525b;--nath-breadcrumb-link-color: #60a5fa;--nath-breadcrumb-link-hover-color: #93c5fd;--nath-breadcrumb-active-color: #a1a1aa}.nath-breadcrumb-container{display:block}.nath-breadcrumb-list{display:flex;flex-wrap:wrap;align-items:center;gap:var(--nath-breadcrumb-gap);padding-top:var(--nath-breadcrumb-padding-y);padding-bottom:var(--nath-breadcrumb-padding-y);list-style:none;margin:0}.nath-breadcrumb-item{display:flex;align-items:center}.nath-breadcrumb-item:not(:last-child):after{content:var(--nath-breadcrumb-separator);margin-left:var(--nath-breadcrumb-separator-margin);color:var(--nath-breadcrumb-separator-color)}.nath-breadcrumb-link{color:var(--nath-breadcrumb-link-color);text-decoration:none;transition:color .2s ease-in-out}.nath-breadcrumb-link:hover{color:var(--nath-breadcrumb-link-hover-color);text-decoration:underline}.nath-breadcrumb-current{color:var(--nath-breadcrumb-active-color);font-weight:var(--nath-breadcrumb-active-font-weight)}\n"] }]
|
|
350
362
|
}] });
|
|
351
363
|
|
|
352
364
|
class CodeFileTabNamePipe {
|
|
@@ -501,7 +513,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
|
|
|
501
513
|
}], ctorParameters: () => [], propDecorators: { withTime: [{ type: i0.Input, args: [{ isSignal: true, alias: "withTime", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], inputId: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputId", required: false }] }], language: [{ type: i0.Input, args: [{ isSignal: true, alias: "language", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], touched: [{ type: i0.Input, args: [{ isSignal: true, alias: "touched", required: false }] }, { type: i0.Output, args: ["touchedChange"] }], dirty: [{ type: i0.Input, args: [{ isSignal: true, alias: "dirty", required: false }] }, { type: i0.Output, args: ["dirtyChange"] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], dateInputValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "dateInputValue", required: false }] }, { type: i0.Output, args: ["dateInputValueChange"] }], dateTimeInputValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "dateTimeInputValue", required: false }] }, { type: i0.Output, args: ["dateTimeInputValueChange"] }] } });
|
|
502
514
|
|
|
503
515
|
const DIALOG_DATA = new InjectionToken('DIALOG_DATA');
|
|
504
|
-
class
|
|
516
|
+
class NathDialogRef {
|
|
505
517
|
_afterClosed = signal(undefined, /* @ts-ignore */
|
|
506
518
|
...(ngDevMode ? [{ debugName: "_afterClosed" }] : /* istanbul ignore next */ []));
|
|
507
519
|
afterClosedSignal = this._afterClosed.asReadonly();
|
|
@@ -530,7 +542,7 @@ class DialogRef {
|
|
|
530
542
|
|
|
531
543
|
class NathDialogContainer extends BasePortalOutlet {
|
|
532
544
|
portalOutlet = viewChild.required(CdkPortalOutlet);
|
|
533
|
-
dialogRef = inject(
|
|
545
|
+
dialogRef = inject(NathDialogRef);
|
|
534
546
|
// Exposed updatable signals
|
|
535
547
|
header = signal(undefined, /* @ts-ignore */
|
|
536
548
|
...(ngDevMode ? [{ debugName: "header" }] : /* istanbul ignore next */ []));
|
|
@@ -653,13 +665,13 @@ class NathDialogService {
|
|
|
653
665
|
.subscribe(() => this.closeAll());
|
|
654
666
|
}
|
|
655
667
|
open(content, config) {
|
|
656
|
-
const dialogRef = new
|
|
668
|
+
const dialogRef = new NathDialogRef({
|
|
657
669
|
injector: this.injector,
|
|
658
670
|
onClose: () => this.destroyDialog(containerRef, bodyElement),
|
|
659
671
|
});
|
|
660
672
|
const customInjector = Injector.create({
|
|
661
673
|
providers: [
|
|
662
|
-
{ provide:
|
|
674
|
+
{ provide: NathDialogRef, useValue: dialogRef },
|
|
663
675
|
{ provide: DIALOG_DATA, useValue: config.data },
|
|
664
676
|
],
|
|
665
677
|
parent: this.injector,
|
|
@@ -720,7 +732,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
|
|
|
720
732
|
}], ctorParameters: () => [] });
|
|
721
733
|
|
|
722
734
|
class NathConfirmationDialog {
|
|
723
|
-
dialogRef = inject(
|
|
735
|
+
dialogRef = inject(NathDialogRef);
|
|
724
736
|
config = inject(DIALOG_DATA);
|
|
725
737
|
// Fallback default buttons if none are provided
|
|
726
738
|
get buttons() {
|
|
@@ -821,7 +833,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
|
|
|
821
833
|
`, encapsulation: ViewEncapsulation.None, styles: ["nath-dialog-container,.nath-dialog-theme{--nath-dialog-bg: #ffffff;--nath-dialog-border: var(--color-zinc-200, oklch(92% .004 286.32));--nath-dialog-radius: .75rem;--nath-dialog-shadow: 0 20px 25px -5px rgba(0, 0, 0, .1), 0 10px 10px -5px rgba(0, 0, 0, .04);--nath-dialog-mask-bg: rgba(0, 0, 0, .4);--nath-dialog-mask-blur: 4px;--nath-dialog-header-border: var(--color-zinc-100, oklch(96.7% .001 286.375));--nath-dialog-text-main: var(--color-zinc-900, oklch(21% .006 285.885));--nath-dialog-text-muted: var(--color-zinc-500, oklch(55.2% .016 285.938));--nath-dialog-text-title: var(--color-zinc-900, oklch(21% .006 285.885));--nath-dialog-btn-hover-bg: var(--color-zinc-100, oklch(96.7% .001 286.375));--nath-dialog-btn-icon-color: var(--color-zinc-400, oklch(70.5% .015 286.067));--nath-dialog-btn-icon-hover: var(--color-zinc-600, oklch(44.2% .017 285.786));--nath-dialog-btn-default-bg: var(--color-zinc-100, oklch(96.7% .001 286.375));--nath-dialog-btn-default-text: var(--color-zinc-800, oklch(27.4% .006 286.033));--nath-dialog-btn-default-hover: var(--color-zinc-200, oklch(92% .004 286.32))}.dark nath-dialog-container,.dark .nath-dialog-theme{--nath-dialog-bg: var(--color-zinc-900, oklch(14.1% .005 285.823));--nath-dialog-border: var(--color-zinc-800, oklch(27.4% .006 286.033));--nath-dialog-header-border: var(--color-zinc-800, oklch(27.4% .006 286.033));--nath-dialog-text-main: var(--color-zinc-100, oklch(96.7% .001 286.375));--nath-dialog-text-muted: var(--color-zinc-400, oklch(70.5% .015 286.067));--nath-dialog-text-title: #ffffff;--nath-dialog-btn-hover-bg: var(--color-zinc-800, oklch(27.4% .006 286.033));--nath-dialog-btn-icon-hover: var(--color-zinc-200, oklch(92% .004 286.32));--nath-dialog-btn-default-bg: var(--color-zinc-800, oklch(27.4% .006 286.033));--nath-dialog-btn-default-text: var(--color-zinc-200, oklch(92% .004 286.32));--nath-dialog-btn-default-hover: var(--color-zinc-700, oklch(37% .013 285.805))}nath-dialog-container{display:contents}.nath-dialog-mask{position:fixed;inset:0;z-index:50;background-color:var(--nath-dialog-mask-bg);-webkit-backdrop-filter:blur(var(--nath-dialog-mask-blur));backdrop-filter:blur(var(--nath-dialog-mask-blur));display:flex;align-items:center;justify-content:center;padding:1rem}.nath-dialog-window{background-color:var(--nath-dialog-bg);color:var(--nath-dialog-text-main);border:1px solid var(--nath-dialog-border);border-radius:var(--nath-dialog-radius);box-shadow:var(--nath-dialog-shadow);max-width:90vw;max-height:90vh;display:flex;flex-direction:column;pointer-events:auto;cursor:default;overflow:hidden}.nath-dialog-header{display:flex;justify-content:space-between;align-items:center;padding:1rem 1.5rem;border-bottom:1px solid var(--nath-dialog-header-border);cursor:move;-webkit-user-select:none;user-select:none;flex-shrink:0}.nath-dialog-title{font-size:1.125rem;font-weight:600;line-height:1.75rem;letter-spacing:-.025em;color:var(--nath-dialog-text-title);margin:0}.nath-dialog-header-actions{display:flex;gap:.5rem}.nath-dialog-action-btn{color:var(--nath-dialog-btn-icon-color);border-radius:.5rem;padding:.25rem;transition:colors .2s;cursor:pointer;background:transparent;border:none;display:flex;align-items:center;justify-content:center}.nath-dialog-action-btn:hover{color:var(--nath-dialog-btn-icon-hover);background-color:var(--nath-dialog-btn-hover-bg)}.nath-dialog-body{padding:1rem;overflow-y:auto;flex-grow:1}.nath-dialog-footer{padding:1rem;display:flex;justify-content:end;gap:1rem;position:sticky;bottom:-1px;background-color:var(--nath-dialog-bg)}.nath-dialog-btn{padding:.5rem 1rem;font-size:.875rem;font-weight:500;border-radius:.5rem;transition:colors .2s;cursor:pointer;border:none;display:inline-flex;align-items:center;justify-content:center}.nath-dialog-btn--default{background-color:var(--nath-dialog-btn-default-bg);color:var(--nath-dialog-btn-default-text)}.nath-dialog-btn--default:hover{background-color:var(--nath-dialog-btn-default-hover)}.nath-dialog-window.dialog-maximized{max-width:100vw!important;max-height:100vh!important;width:100vw!important;height:100vh!important;border-radius:0!important;transform:none!important}.nath-dialog-content-text{font-size:.875rem;color:var(--nath-dialog-text-muted)}.nath-confirmation-dialog{display:flex;flex-direction:column;gap:1rem}\n"] }]
|
|
822
834
|
}] });
|
|
823
835
|
|
|
824
|
-
class
|
|
836
|
+
class NathConfirmationService {
|
|
825
837
|
dialogService = inject(NathDialogService);
|
|
826
838
|
/** Spawns a type-safe confirmation window */
|
|
827
839
|
confirm(config) {
|
|
@@ -831,10 +843,10 @@ class ConfirmationService {
|
|
|
831
843
|
data: config,
|
|
832
844
|
});
|
|
833
845
|
}
|
|
834
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type:
|
|
835
|
-
static ɵprov = i0.ɵɵngDeclareService({ minVersion: "22.0.0", version: "22.0.5", ngImport: i0, type:
|
|
846
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: NathConfirmationService, deps: [], target: i0.ɵɵFactoryTarget.Service });
|
|
847
|
+
static ɵprov = i0.ɵɵngDeclareService({ minVersion: "22.0.0", version: "22.0.5", ngImport: i0, type: NathConfirmationService });
|
|
836
848
|
}
|
|
837
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type:
|
|
849
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: NathConfirmationService, decorators: [{
|
|
838
850
|
type: Service
|
|
839
851
|
}] });
|
|
840
852
|
|
|
@@ -2570,37 +2582,93 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
|
|
|
2570
2582
|
|
|
2571
2583
|
class NathPaginatedView {
|
|
2572
2584
|
// Two-way Model Signals
|
|
2585
|
+
/**
|
|
2586
|
+
* Page number (required)
|
|
2587
|
+
* Indexed from 1
|
|
2588
|
+
*/
|
|
2573
2589
|
page = model.required(/* @ts-ignore */
|
|
2574
2590
|
...(ngDevMode ? [{ debugName: "page" }] : /* istanbul ignore next */ []));
|
|
2591
|
+
/**
|
|
2592
|
+
* Number of items per page
|
|
2593
|
+
* @default 10
|
|
2594
|
+
*/
|
|
2575
2595
|
pageSize = model(10, /* @ts-ignore */
|
|
2576
2596
|
...(ngDevMode ? [{ debugName: "pageSize" }] : /* istanbul ignore next */ []));
|
|
2597
|
+
/**
|
|
2598
|
+
* Model of selected items (also available in the let-selection="selection" context)
|
|
2599
|
+
* @default []
|
|
2600
|
+
*/
|
|
2577
2601
|
selectedItems = model([], /* @ts-ignore */
|
|
2578
2602
|
...(ngDevMode ? [{ debugName: "selectedItems" }] : /* istanbul ignore next */ []));
|
|
2579
2603
|
// Inputs
|
|
2604
|
+
/**
|
|
2605
|
+
* Mode for pagination (client or server)
|
|
2606
|
+
* @default 'client'
|
|
2607
|
+
*/
|
|
2580
2608
|
mode = input('client', /* @ts-ignore */
|
|
2581
2609
|
...(ngDevMode ? [{ debugName: "mode" }] : /* istanbul ignore next */ []));
|
|
2610
|
+
/**
|
|
2611
|
+
* Array of items to display
|
|
2612
|
+
* @required
|
|
2613
|
+
*/
|
|
2582
2614
|
items = input.required(/* @ts-ignore */
|
|
2583
2615
|
...(ngDevMode ? [{ debugName: "items" }] : /* istanbul ignore next */ []));
|
|
2616
|
+
/**
|
|
2617
|
+
* Total number of items
|
|
2618
|
+
* @default null
|
|
2619
|
+
*/
|
|
2584
2620
|
totalItems = input(null, /* @ts-ignore */
|
|
2585
2621
|
...(ngDevMode ? [{ debugName: "totalItems" }] : /* istanbul ignore next */ []));
|
|
2622
|
+
/**
|
|
2623
|
+
* Array of options for the page size
|
|
2624
|
+
* @default [10, 20, 50, 100]
|
|
2625
|
+
*/
|
|
2586
2626
|
pageSizeOptions = input([10, 20, 50, 100], /* @ts-ignore */
|
|
2587
2627
|
...(ngDevMode ? [{ debugName: "pageSizeOptions" }] : /* istanbul ignore next */ []));
|
|
2628
|
+
/**
|
|
2629
|
+
* Whether to disable the paginator
|
|
2630
|
+
* @default false
|
|
2631
|
+
*/
|
|
2588
2632
|
disabled = input(false, /* @ts-ignore */
|
|
2589
2633
|
...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
|
|
2634
|
+
/**
|
|
2635
|
+
* Whether to show the bottom paginator
|
|
2636
|
+
* @default true
|
|
2637
|
+
*/
|
|
2590
2638
|
showBottomPaginator = input(true, /* @ts-ignore */
|
|
2591
2639
|
...(ngDevMode ? [{ debugName: "showBottomPaginator" }] : /* istanbul ignore next */ []));
|
|
2640
|
+
/**
|
|
2641
|
+
* Message to display when no results are found
|
|
2642
|
+
* @default 'No results found'
|
|
2643
|
+
*/
|
|
2592
2644
|
emptyMessage = input('No results found', /* @ts-ignore */
|
|
2593
2645
|
...(ngDevMode ? [{ debugName: "emptyMessage" }] : /* istanbul ignore next */ []));
|
|
2646
|
+
/**
|
|
2647
|
+
* Whether to show a loading overlay
|
|
2648
|
+
* @default false
|
|
2649
|
+
*/
|
|
2594
2650
|
loading = input(false, /* @ts-ignore */
|
|
2595
2651
|
...(ngDevMode ? [{ debugName: "loading" }] : /* istanbul ignore next */ []));
|
|
2596
|
-
|
|
2597
|
-
|
|
2598
|
-
|
|
2652
|
+
/**
|
|
2653
|
+
* Whether to persist selection across page changes
|
|
2654
|
+
* @default false
|
|
2655
|
+
*/
|
|
2599
2656
|
persistSelection = input(false, /* @ts-ignore */
|
|
2600
2657
|
...(ngDevMode ? [{ debugName: "persistSelection" }] : /* istanbul ignore next */ []));
|
|
2658
|
+
/**
|
|
2659
|
+
* Function or key to track items by
|
|
2660
|
+
* @default 'id'
|
|
2661
|
+
*/
|
|
2601
2662
|
trackBy = input('id', /* @ts-ignore */
|
|
2602
2663
|
...(ngDevMode ? [{ debugName: "trackBy" }] : /* istanbul ignore next */ []));
|
|
2664
|
+
/**
|
|
2665
|
+
* Paginator change event
|
|
2666
|
+
*/
|
|
2603
2667
|
paginatorChange = output();
|
|
2668
|
+
/**
|
|
2669
|
+
* Expanded items (also available in the let-expansion="expansion" context)
|
|
2670
|
+
* @default []
|
|
2671
|
+
*/
|
|
2604
2672
|
expandedItems = signal([], /* @ts-ignore */
|
|
2605
2673
|
...(ngDevMode ? [{ debugName: "expandedItems" }] : /* istanbul ignore next */ []));
|
|
2606
2674
|
constructor() {
|
|
@@ -2779,7 +2847,7 @@ class NathPaginatedView {
|
|
|
2779
2847
|
}
|
|
2780
2848
|
}
|
|
2781
2849
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: NathPaginatedView, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2782
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: NathPaginatedView, isStandalone: true, selector: "nath-paginated-view", inputs: { page: { classPropertyName: "page", publicName: "page", isSignal: true, isRequired: true, transformFunction: null }, pageSize: { classPropertyName: "pageSize", publicName: "pageSize", isSignal: true, isRequired: false, transformFunction: null }, selectedItems: { classPropertyName: "selectedItems", publicName: "selectedItems", isSignal: true, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: true, transformFunction: null }, totalItems: { classPropertyName: "totalItems", publicName: "totalItems", isSignal: true, isRequired: false, transformFunction: null }, pageSizeOptions: { classPropertyName: "pageSizeOptions", publicName: "pageSizeOptions", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, showBottomPaginator: { classPropertyName: "showBottomPaginator", publicName: "showBottomPaginator", isSignal: true, isRequired: false, transformFunction: null }, emptyMessage: { classPropertyName: "emptyMessage", publicName: "emptyMessage", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null },
|
|
2850
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: NathPaginatedView, isStandalone: true, selector: "nath-paginated-view", inputs: { page: { classPropertyName: "page", publicName: "page", isSignal: true, isRequired: true, transformFunction: null }, pageSize: { classPropertyName: "pageSize", publicName: "pageSize", isSignal: true, isRequired: false, transformFunction: null }, selectedItems: { classPropertyName: "selectedItems", publicName: "selectedItems", isSignal: true, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: true, transformFunction: null }, totalItems: { classPropertyName: "totalItems", publicName: "totalItems", isSignal: true, isRequired: false, transformFunction: null }, pageSizeOptions: { classPropertyName: "pageSizeOptions", publicName: "pageSizeOptions", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, showBottomPaginator: { classPropertyName: "showBottomPaginator", publicName: "showBottomPaginator", isSignal: true, isRequired: false, transformFunction: null }, emptyMessage: { classPropertyName: "emptyMessage", publicName: "emptyMessage", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, persistSelection: { classPropertyName: "persistSelection", publicName: "persistSelection", isSignal: true, isRequired: false, transformFunction: null }, trackBy: { classPropertyName: "trackBy", publicName: "trackBy", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { page: "pageChange", pageSize: "pageSizeChange", selectedItems: "selectedItemsChange", paginatorChange: "paginatorChange" }, host: { classAttribute: "nath-paginated-view-host" }, queries: [{ propertyName: "contentTpl", first: true, predicate: TemplateRef, descendants: true, isSignal: true }, { propertyName: "paginatorLeftTpl", first: true, predicate: ["paginatorLeft"], descendants: true, isSignal: true }], ngImport: i0, template: `
|
|
2783
2851
|
<ng-template #paginatorTpl let-position="position">
|
|
2784
2852
|
<div
|
|
2785
2853
|
class="nath-paginated-view-paginator-container"
|
|
@@ -2892,7 +2960,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
|
|
|
2892
2960
|
`, encapsulation: ViewEncapsulation.None, host: {
|
|
2893
2961
|
class: 'nath-paginated-view-host',
|
|
2894
2962
|
}, styles: ["nath-paginated-view,.nath-paginated-view-theme{--nath-paginated-view-bg: transparent;--nath-paginated-view-overlay-bg: rgba(0, 0, 0, .5);--nath-paginated-view-loader-color: #000000;--nath-paginated-view-empty-text: var(--color-gray-500, oklch(55.1% .027 264.364));--nath-paginated-view-paginator-bg: transparent}.dark nath-paginated-view,.dark .nath-paginated-view-theme{--nath-paginated-view-loader-color: #ffffff;--nath-paginated-view-empty-text: var(--color-zinc-400, oklch(70.5% .015 286.067));--nath-paginated-view-paginator-bg: transparent}.nath-paginated-view-host{display:block;position:relative;width:100%}.nath-paginated-view-paginator-container{position:sticky;display:flex;align-items:center;gap:1rem;justify-content:space-between;padding-top:.25rem;padding-bottom:.25rem;background-color:var(--nath-paginated-view-paginator-bg);z-index:10;width:100%}.nath-paginated-view-paginator-container.is-top{top:0}.nath-paginated-view-paginator-container.is-bottom{bottom:0}.nath-paginated-view-empty{padding:1rem;display:flex;flex-direction:column;align-items:center;color:var(--nath-paginated-view-empty-text)}.nath-paginated-view-loading-overlay{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;background-color:var(--nath-paginated-view-overlay-bg);z-index:20}.nath-paginated-view-loader{color:var(--nath-paginated-view-loader-color)}\n"] }]
|
|
2895
|
-
}], ctorParameters: () => [], propDecorators: { page: [{ type: i0.Input, args: [{ isSignal: true, alias: "page", required: true }] }, { type: i0.Output, args: ["pageChange"] }], pageSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "pageSize", required: false }] }, { type: i0.Output, args: ["pageSizeChange"] }], selectedItems: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectedItems", required: false }] }, { type: i0.Output, args: ["selectedItemsChange"] }], mode: [{ type: i0.Input, args: [{ isSignal: true, alias: "mode", required: false }] }], items: [{ type: i0.Input, args: [{ isSignal: true, alias: "items", required: true }] }], totalItems: [{ type: i0.Input, args: [{ isSignal: true, alias: "totalItems", required: false }] }], pageSizeOptions: [{ type: i0.Input, args: [{ isSignal: true, alias: "pageSizeOptions", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], showBottomPaginator: [{ type: i0.Input, args: [{ isSignal: true, alias: "showBottomPaginator", required: false }] }], emptyMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyMessage", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }],
|
|
2963
|
+
}], ctorParameters: () => [], propDecorators: { page: [{ type: i0.Input, args: [{ isSignal: true, alias: "page", required: true }] }, { type: i0.Output, args: ["pageChange"] }], pageSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "pageSize", required: false }] }, { type: i0.Output, args: ["pageSizeChange"] }], selectedItems: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectedItems", required: false }] }, { type: i0.Output, args: ["selectedItemsChange"] }], mode: [{ type: i0.Input, args: [{ isSignal: true, alias: "mode", required: false }] }], items: [{ type: i0.Input, args: [{ isSignal: true, alias: "items", required: true }] }], totalItems: [{ type: i0.Input, args: [{ isSignal: true, alias: "totalItems", required: false }] }], pageSizeOptions: [{ type: i0.Input, args: [{ isSignal: true, alias: "pageSizeOptions", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], showBottomPaginator: [{ type: i0.Input, args: [{ isSignal: true, alias: "showBottomPaginator", required: false }] }], emptyMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyMessage", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], persistSelection: [{ type: i0.Input, args: [{ isSignal: true, alias: "persistSelection", required: false }] }], trackBy: [{ type: i0.Input, args: [{ isSignal: true, alias: "trackBy", required: false }] }], paginatorChange: [{ type: i0.Output, args: ["paginatorChange"] }], contentTpl: [{ type: i0.ContentChild, args: [i0.forwardRef(() => TemplateRef), { isSignal: true }] }], paginatorLeftTpl: [{ type: i0.ContentChild, args: ['paginatorLeft', { isSignal: true }] }] } });
|
|
2896
2964
|
|
|
2897
2965
|
class NathPanel {
|
|
2898
2966
|
header = input('', /* @ts-ignore */
|
|
@@ -5521,5 +5589,5 @@ function isSortOrderValid(order) {
|
|
|
5521
5589
|
* Generated bundle index. Do not edit.
|
|
5522
5590
|
*/
|
|
5523
5591
|
|
|
5524
|
-
export { BreadcrumbService,
|
|
5592
|
+
export { BreadcrumbService, DARK_THEME_CLASS, DIALOG_DATA, NathAutocomplete, NathBooleanControl, NathBreadcrumbs, NathCodeViewer, NathConfirmationDialog, NathConfirmationService, NathDatepicker, NathDialogContainer, NathDialogRef, NathDialogService, NathDrawer, NathFileUpload, NathFloatingLabel, NathFormField, NathImagePreview, NathMenu, NathMenuList, NathMultiselect, NathPaginatedView, NathPaginator, NathPanel, NathPickList, NathProgressBar, NathProgressCircle, NathRadioButtonGroup, NathRatingHeart, NathRatingInput, NathSelect, NathShowErrors, NathSkeleton, NathSlider, NathSortIcon, NathSplitButton, NathTabs, NathThemeSwitch, NathToastContainer, NathToc, NathTooltipContainer, NathTooltipDirective, ORDER, RATING_MAP, THEME_CONFIG, TabDirective, TabPanelDirective, ThemeService, ToastService, getRatingColor, hasRequiredValidator, isRequired, isSortOrderValid, isTruthy, next, provideThemeConfig, rangeMinMax, rangeNotMinMax, validateAllFormFields };
|
|
5525
5593
|
//# sourceMappingURL=nath-angular-ui.mjs.map
|