mn-angular-lib 1.0.94 → 1.0.95
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.
|
@@ -4480,10 +4480,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImpor
|
|
|
4480
4480
|
* renders: skeleton placeholders ({@link LOADING}), the rows or empty state
|
|
4481
4481
|
* ({@link RETRIEVED}), or an error placeholder ({@link ERROR}).
|
|
4482
4482
|
*
|
|
4483
|
-
*
|
|
4484
|
-
*
|
|
4485
|
-
*
|
|
4486
|
-
* component runs change detection and re-reads the new state.
|
|
4483
|
+
* Because the components are zoneless and OnPush, a consumer that flips `state`
|
|
4484
|
+
* to `ERROR` (or `RETRIEVED`) must also emit on `dataRows` (e.g. `dataRows.next([])`)
|
|
4485
|
+
* so the component runs change detection and re-reads the new state.
|
|
4487
4486
|
*/
|
|
4488
4487
|
var MnCollectionState;
|
|
4489
4488
|
(function (MnCollectionState) {
|
|
@@ -4520,7 +4519,7 @@ class MnCollectionBase {
|
|
|
4520
4519
|
* Measured pixel height of the body container, applied as a `min-height` floor
|
|
4521
4520
|
* while a server reload is in flight so the container can't collapse when the
|
|
4522
4521
|
* data rows are swapped for skeletons. Released in {@link ngDoCheck} the moment
|
|
4523
|
-
*
|
|
4522
|
+
* the loading state clears. `0` means no lock.
|
|
4524
4523
|
*/
|
|
4525
4524
|
lockedMinHeight = 0;
|
|
4526
4525
|
/**
|
|
@@ -4565,14 +4564,11 @@ class MnCollectionBase {
|
|
|
4565
4564
|
// ── Data lifecycle state ──
|
|
4566
4565
|
/**
|
|
4567
4566
|
* Single source of truth for the data lifecycle: the explicit
|
|
4568
|
-
* {@link MnCollectionDataSource.state}
|
|
4569
|
-
*
|
|
4570
|
-
* loading check routes through this so both APIs stay in lockstep.
|
|
4567
|
+
* {@link MnCollectionDataSource.state}, defaulting to RETRIEVED when unset.
|
|
4568
|
+
* Every internal loading check routes through this.
|
|
4571
4569
|
*/
|
|
4572
4570
|
get collectionState() {
|
|
4573
|
-
|
|
4574
|
-
return this.dataSource.state;
|
|
4575
|
-
return this.dataSource.isDataLoading ? MnCollectionState.LOADING : MnCollectionState.RETRIEVED;
|
|
4571
|
+
return this.dataSource.state ?? MnCollectionState.RETRIEVED;
|
|
4576
4572
|
}
|
|
4577
4573
|
/** Whether the collection is currently loading (skeleton placeholders shown). */
|
|
4578
4574
|
get isLoadingState() {
|
|
@@ -8467,6 +8463,13 @@ class MnTabComponent {
|
|
|
8467
8463
|
activeChange = new EventEmitter();
|
|
8468
8464
|
/** The currently active tab item. */
|
|
8469
8465
|
currentActive;
|
|
8466
|
+
/**
|
|
8467
|
+
* Whether the tab bar is loading and should render skeleton tabs, from
|
|
8468
|
+
* {@link MnTabDataSource.state}.
|
|
8469
|
+
*/
|
|
8470
|
+
get isLoadingState() {
|
|
8471
|
+
return this.dataSource.state === MnCollectionState.LOADING;
|
|
8472
|
+
}
|
|
8470
8473
|
/**
|
|
8471
8474
|
* Index array sizing the loading skeleton: `skeletonCount` when provided,
|
|
8472
8475
|
* otherwise the number of known items, falling back to a default when none.
|
|
@@ -8529,11 +8532,11 @@ class MnTabComponent {
|
|
|
8529
8532
|
this.currentActive = items[index];
|
|
8530
8533
|
}
|
|
8531
8534
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: MnTabComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
8532
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.3", type: MnTabComponent, isStandalone: true, selector: "mn-tab", inputs: { dataSource: "dataSource", scrollable: "scrollable", justified: "justified" }, outputs: { activeChange: "activeChange" }, ngImport: i0, template: "<div class=\"mb-10\">\n <div\n class=\"flex justify-start scrollbar-hide\"\n [class.overflow-x-auto]=\"scrollable\"\n [class.overflow-y-hidden]=\"scrollable\"\n >\n <div\n role=\"tablist\"\n class=\"tabs flex flex-nowrap -mb-[1px] border-b border-base-300\"\n [class.w-full]=\"justified\"\n >\n @if (
|
|
8535
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.3", type: MnTabComponent, isStandalone: true, selector: "mn-tab", inputs: { dataSource: "dataSource", scrollable: "scrollable", justified: "justified" }, outputs: { activeChange: "activeChange" }, ngImport: i0, template: "<div class=\"mb-10\">\n <div\n class=\"flex justify-start scrollbar-hide\"\n [class.overflow-x-auto]=\"scrollable\"\n [class.overflow-y-hidden]=\"scrollable\"\n >\n <div\n role=\"tablist\"\n class=\"tabs flex flex-nowrap -mb-[1px] border-b border-base-300\"\n [class.w-full]=\"justified\"\n >\n @if (isLoadingState) {\n @for (i of skeletonTabs; track i) {\n <div\n [class.flex-1]=\"justified\"\n class=\"tab px-4 py-2 border-b-2 border-transparent flex items-center justify-center\"\n >\n <mn-skeleton [data]=\"{ shape: 'rectangle', width: '4.5rem', height: '1rem' }\"></mn-skeleton>\n </div>\n }\n } @else {\n @for (item of dataSource.items; track item.label) {\n <div\n (click)=\"setActive(item)\"\n (keyup.enter)=\"setActive(item)\"\n (keyup.space)=\"setActive(item)\"\n [attr.aria-selected]=\"currentActive === item\"\n [class.border-primary]=\"currentActive === item\"\n [class.border-transparent]=\"currentActive !== item\"\n [class.flex-1]=\"justified\"\n [class.font-bold]=\"currentActive === item\"\n [class.text-base-content]=\"currentActive !== item\"\n [class.text-primary]=\"currentActive === item\"\n class=\"tab px-4 py-2 border-b-2 cursor-pointer select-none transition-colors whitespace-nowrap text-center flex items-center gap-2\"\n role=\"tab\"\n tabindex=\"0\"\n >\n {{ item.label | mnTranslate }}\n @let badge = getBadge(item);\n @if (badge && badge > 0) {\n <span [data]=\"{ size: 'sm', color: 'accent', variant: 'fill' }\" mnBadge>{{ badge }}</span>\n }\n </div>\n }\n }\n </div>\n </div>\n</div>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: MnBadge, selector: "span[mnBadge]", inputs: ["data"] }, { kind: "component", type: MnSkeleton, selector: "mn-skeleton", inputs: ["data"] }, { kind: "pipe", type: MnTranslatePipe, name: "mnTranslate" }] });
|
|
8533
8536
|
}
|
|
8534
8537
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: MnTabComponent, decorators: [{
|
|
8535
8538
|
type: Component,
|
|
8536
|
-
args: [{ selector: 'mn-tab', standalone: true, imports: [MnTranslatePipe, CommonModule, MnBadge, MnSkeleton], template: "<div class=\"mb-10\">\n <div\n class=\"flex justify-start scrollbar-hide\"\n [class.overflow-x-auto]=\"scrollable\"\n [class.overflow-y-hidden]=\"scrollable\"\n >\n <div\n role=\"tablist\"\n class=\"tabs flex flex-nowrap -mb-[1px] border-b border-base-300\"\n [class.w-full]=\"justified\"\n >\n @if (
|
|
8539
|
+
args: [{ selector: 'mn-tab', standalone: true, imports: [MnTranslatePipe, CommonModule, MnBadge, MnSkeleton], template: "<div class=\"mb-10\">\n <div\n class=\"flex justify-start scrollbar-hide\"\n [class.overflow-x-auto]=\"scrollable\"\n [class.overflow-y-hidden]=\"scrollable\"\n >\n <div\n role=\"tablist\"\n class=\"tabs flex flex-nowrap -mb-[1px] border-b border-base-300\"\n [class.w-full]=\"justified\"\n >\n @if (isLoadingState) {\n @for (i of skeletonTabs; track i) {\n <div\n [class.flex-1]=\"justified\"\n class=\"tab px-4 py-2 border-b-2 border-transparent flex items-center justify-center\"\n >\n <mn-skeleton [data]=\"{ shape: 'rectangle', width: '4.5rem', height: '1rem' }\"></mn-skeleton>\n </div>\n }\n } @else {\n @for (item of dataSource.items; track item.label) {\n <div\n (click)=\"setActive(item)\"\n (keyup.enter)=\"setActive(item)\"\n (keyup.space)=\"setActive(item)\"\n [attr.aria-selected]=\"currentActive === item\"\n [class.border-primary]=\"currentActive === item\"\n [class.border-transparent]=\"currentActive !== item\"\n [class.flex-1]=\"justified\"\n [class.font-bold]=\"currentActive === item\"\n [class.text-base-content]=\"currentActive !== item\"\n [class.text-primary]=\"currentActive === item\"\n class=\"tab px-4 py-2 border-b-2 cursor-pointer select-none transition-colors whitespace-nowrap text-center flex items-center gap-2\"\n role=\"tab\"\n tabindex=\"0\"\n >\n {{ item.label | mnTranslate }}\n @let badge = getBadge(item);\n @if (badge && badge > 0) {\n <span [data]=\"{ size: 'sm', color: 'accent', variant: 'fill' }\" mnBadge>{{ badge }}</span>\n }\n </div>\n }\n }\n </div>\n </div>\n</div>\n" }]
|
|
8537
8540
|
}], propDecorators: { dataSource: [{
|
|
8538
8541
|
type: Input
|
|
8539
8542
|
}], scrollable: [{
|