@magmonium/one 0.3.13 → 0.4.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.
- package/assets/button_groups/notification_actions.json +5 -0
- package/assets/buttons/accept_notification.json +4 -0
- package/assets/buttons/login_new_user.json +4 -0
- package/assets/buttons/search_result.json +4 -0
- package/assets/fields/comment_text.json +6 -0
- package/assets/i18n/en.json +23 -0
- package/assets/index.json +1 -1
- package/fesm2022/{magmonium-one-image-editor-C7CEM4H4.mjs → magmonium-one-image-editor-BjCvZ9rH.mjs} +2 -2
- package/fesm2022/{magmonium-one-image-editor-C7CEM4H4.mjs.map → magmonium-one-image-editor-BjCvZ9rH.mjs.map} +1 -1
- package/fesm2022/{magmonium-one-magmonium-one-hJWPaKsU.mjs → magmonium-one-magmonium-one-B5qzsrNB.mjs} +1741 -1109
- package/fesm2022/magmonium-one-magmonium-one-B5qzsrNB.mjs.map +1 -0
- package/fesm2022/{magmonium-one-otp-8373mtJP.mjs → magmonium-one-otp-BwXKEaEg.mjs} +2 -2
- package/fesm2022/{magmonium-one-otp-8373mtJP.mjs.map → magmonium-one-otp-BwXKEaEg.mjs.map} +1 -1
- package/fesm2022/{magmonium-one-password-DajHayGu.mjs → magmonium-one-password-CyHOns1l.mjs} +2 -2
- package/fesm2022/{magmonium-one-password-DajHayGu.mjs.map → magmonium-one-password-CyHOns1l.mjs.map} +1 -1
- package/fesm2022/{magmonium-one-toggle-DJwF5ohL.mjs → magmonium-one-toggle-CpMURu38.mjs} +2 -2
- package/fesm2022/{magmonium-one-toggle-DJwF5ohL.mjs.map → magmonium-one-toggle-CpMURu38.mjs.map} +1 -1
- package/fesm2022/magmonium-one.mjs +1 -1
- package/package.json +1 -1
- package/types/magmonium-one.d.ts +192 -56
- package/fesm2022/magmonium-one-magmonium-one-hJWPaKsU.mjs.map +0 -1
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { InjectionToken, inject, Injectable,
|
|
2
|
+
import { InjectionToken, signal, inject, Injectable, computed, DestroyRef, DOCUMENT, ApplicationRef, RendererFactory2, createComponent, EnvironmentInjector, Pipe, ChangeDetectorRef, untracked, ElementRef, afterNextRender, input, ChangeDetectionStrategy, Component, effect, Injector, reflectComponentType, inputBinding, model, HostListener, Renderer2, Directive, output, viewChild, ViewEncapsulation, forwardRef, runInInjectionContext, contentChild, TemplateRef, ViewContainerRef, outputBinding, linkedSignal, afterRenderEffect, Input, booleanAttribute, HostAttributeToken, viewChildren, afterEveryRender, EventEmitter, Output, ViewChild, ContentChild, provideZonelessChangeDetection, makeEnvironmentProviders, HostBinding, provideAppInitializer, provideBrowserGlobalErrorListeners, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
|
|
3
3
|
import { HttpClient, HttpParams, HttpErrorResponse, provideHttpClient, withFetch, withInterceptors } from '@angular/common/http';
|
|
4
|
-
import { firstValueFrom, of, tap, catchError, throwError, shareReplay, finalize, forkJoin, map, Observable, pipe, interval, fromEvent, switchMap as switchMap$1, filter, EMPTY,
|
|
4
|
+
import { firstValueFrom, of, tap, catchError, throwError, shareReplay, finalize, forkJoin, map, Observable, pipe, interval, fromEvent, switchMap as switchMap$1, filter, Subject, EMPTY, from, combineLatest, race, take, startWith } from 'rxjs';
|
|
5
5
|
import { rxResource, toObservable, toSignal, takeUntilDestroyed } from '@angular/core/rxjs-interop';
|
|
6
6
|
import { signalStore, withState, withMethods, patchState, withHooks, withComputed, withProps } from '@ngrx/signals';
|
|
7
7
|
import { rxMethod } from '@ngrx/signals/rxjs-interop';
|
|
@@ -102,6 +102,13 @@ const NAV_STORE_REF = new InjectionToken('NAV_STORE_REF');
|
|
|
102
102
|
const MODAL_STORE_REF = new InjectionToken('MODAL_STORE_REF');
|
|
103
103
|
const USER_STORE_REF = new InjectionToken('USER_STORE_REF');
|
|
104
104
|
const APP_CONTEXT_REF = new InjectionToken('APP_CONTEXT_REF');
|
|
105
|
+
/**
|
|
106
|
+
* This application's own AppLink. `root` is per bootstrapped app, so a Remote
|
|
107
|
+
* never reads its host's — unlike NavStore's `appLink`, which is the host's
|
|
108
|
+
* active app. The interceptor names the App in `X-Mag-App` with it (api ADR
|
|
109
|
+
* 0007) and init asks for Agreement to it.
|
|
110
|
+
*/
|
|
111
|
+
const APP_LINK = new InjectionToken('APP_LINK', { providedIn: 'root', factory: () => signal(undefined) });
|
|
105
112
|
const IS_SIDE_PANEL = new InjectionToken('IS_SIDE_PANEL');
|
|
106
113
|
// SVG markup supplied by name from memory instead of fetched as an asset.
|
|
107
114
|
// `m-icon` reads it before its own resource, so a glyph that exists only in a
|
|
@@ -3212,8 +3219,15 @@ const NotificationStore = signalStore({ providedIn: 'root' }, withState(initialN
|
|
|
3212
3219
|
},
|
|
3213
3220
|
notify: (notification) => {
|
|
3214
3221
|
const id = notification.id ?? generateId();
|
|
3215
|
-
const
|
|
3216
|
-
const exists = !!
|
|
3222
|
+
const existing = state.notificationMap()[id];
|
|
3223
|
+
const exists = !!existing;
|
|
3224
|
+
// An upsert keeps what the User did to the row unless the caller says
|
|
3225
|
+
// otherwise: a re-raised Violation stays read (ADR 0157).
|
|
3226
|
+
const newNotification = {
|
|
3227
|
+
...notification,
|
|
3228
|
+
id,
|
|
3229
|
+
read: notification.read ?? existing?.read,
|
|
3230
|
+
};
|
|
3217
3231
|
patchState(state, {
|
|
3218
3232
|
notifications: exists
|
|
3219
3233
|
? state.notifications()
|
|
@@ -3222,7 +3236,7 @@ const NotificationStore = signalStore({ providedIn: 'root' }, withState(initialN
|
|
|
3222
3236
|
...state.notificationMap(),
|
|
3223
3237
|
[id]: newNotification,
|
|
3224
3238
|
},
|
|
3225
|
-
popupNotifications: exists
|
|
3239
|
+
popupNotifications: exists || notification.silent
|
|
3226
3240
|
? state.popupNotifications()
|
|
3227
3241
|
: [id, ...state.popupNotifications()],
|
|
3228
3242
|
});
|
|
@@ -3261,7 +3275,9 @@ const NotificationStore = signalStore({ providedIn: 'root' }, withState(initialN
|
|
|
3261
3275
|
state.notifications().forEach((id) => {
|
|
3262
3276
|
const notification = updatedMap[id];
|
|
3263
3277
|
if (notification) {
|
|
3264
|
-
|
|
3278
|
+
// A persistent error stands until what raised it withdraws it — a
|
|
3279
|
+
// blocking Violation (ADR 0157) — so it is read, not cleared.
|
|
3280
|
+
if (notification.severity === 'error' && !notification.persistent) {
|
|
3265
3281
|
toRemove.push(id);
|
|
3266
3282
|
}
|
|
3267
3283
|
else {
|
|
@@ -3505,7 +3521,7 @@ params) => {
|
|
|
3505
3521
|
(murl.length > 0 &&
|
|
3506
3522
|
anchor.navId.startsWith(`${urlNavId}${NAV_ID_SEP}`)))
|
|
3507
3523
|
? anchor.path
|
|
3508
|
-
:
|
|
3524
|
+
: fillRoutePath(urlNavId, navMap, params);
|
|
3509
3525
|
// Always keeps the leading `/`: a bare `|search` is a *relative* URL and
|
|
3510
3526
|
// would resolve against the current directory (ADR 0013).
|
|
3511
3527
|
const base = path === URL_SEP ? URL_SEP : path.replace(/\/$/, '');
|
|
@@ -3515,6 +3531,22 @@ params) => {
|
|
|
3515
3531
|
const fillParams = (path, params) => params
|
|
3516
3532
|
? path.replace(/:([a-zA-Z0-9_]+)/g, (match, name) => params[name] !== undefined ? String(params[name]) : match)
|
|
3517
3533
|
: path;
|
|
3534
|
+
/**
|
|
3535
|
+
* A Url NavId's route path with its params filled — and, for a NavTail, the
|
|
3536
|
+
* rest appended as its tail value names it, separators kept, since the tail is
|
|
3537
|
+
* every segment below the Nav and not one (m-one-ui CONTEXT.md NavTail). No
|
|
3538
|
+
* tail value is no rest: the Nav's own address.
|
|
3539
|
+
*/
|
|
3540
|
+
const fillRoutePath = (navId, navMap, params) => {
|
|
3541
|
+
const path = fillParams(navIdToRoutePath(navId, navMap), params);
|
|
3542
|
+
const tailName = navMap[navId]?.tail;
|
|
3543
|
+
const rest = tailName && params?.[tailName] !== undefined
|
|
3544
|
+
? String(params[tailName]).replace(/^\/+/, '')
|
|
3545
|
+
: '';
|
|
3546
|
+
if (!rest)
|
|
3547
|
+
return path;
|
|
3548
|
+
return path === URL_SEP ? `${URL_SEP}${rest}` : `${path}${URL_SEP}${rest}`;
|
|
3549
|
+
};
|
|
3518
3550
|
/**
|
|
3519
3551
|
* Splits a location into its route path and its Murl segments. Accepts the
|
|
3520
3552
|
* percent-encoded form too, because `|` is not URL-unreserved and any encoder
|
|
@@ -4457,25 +4489,42 @@ const NavStore = signalStore({ providedIn: 'root' }, withState(initialState$3),
|
|
|
4457
4489
|
.filter((m) => m.createMenu &&
|
|
4458
4490
|
(m.urlMode === 'tail' ||
|
|
4459
4491
|
(m.urlMode === 'outlet' && outlets.includes(m.name))))
|
|
4460
|
-
.map((m) => ({
|
|
4492
|
+
.map((m) => ({
|
|
4493
|
+
name: m.name,
|
|
4494
|
+
appNavId: m.appNavId,
|
|
4495
|
+
link: m.link,
|
|
4496
|
+
urlMode: m.urlMode,
|
|
4497
|
+
}));
|
|
4461
4498
|
const unclaimed = outlets
|
|
4462
4499
|
.filter((name) => !store.mounts()[name])
|
|
4463
4500
|
.map((name) => ({
|
|
4464
4501
|
name,
|
|
4465
4502
|
appNavId: `root_app_${name}`,
|
|
4466
4503
|
link: undefined,
|
|
4504
|
+
urlMode: 'outlet',
|
|
4467
4505
|
}));
|
|
4468
4506
|
return [...listed, ...unclaimed];
|
|
4469
4507
|
}, ...(ngDevMode ? [{ debugName: "menuMounts" }] : /* istanbul ignore next */ []));
|
|
4470
|
-
/**
|
|
4508
|
+
/**
|
|
4509
|
+
* The map the menu reads: the tree, with each listed app hung where the
|
|
4510
|
+
* User reaches it. A `tail` app stands on the Nav that routes its AppLink —
|
|
4511
|
+
* `root_app` for `/app/<link>` — so its node is that Nav's child; listing it
|
|
4512
|
+
* at root too drew one app twice. A side app's segment belongs to no Nav,
|
|
4513
|
+
* and neither does a tail app whose host Nav the tree does not hold, so
|
|
4514
|
+
* those hang under root (ADR 0038).
|
|
4515
|
+
*/
|
|
4471
4516
|
const menuNavMap = computed(() => {
|
|
4472
4517
|
const navMap = store.navMap();
|
|
4473
4518
|
const listed = menuMounts();
|
|
4474
4519
|
if (!listed.length)
|
|
4475
4520
|
return navMap;
|
|
4476
4521
|
const configs = store.wcConfigMap();
|
|
4477
|
-
const
|
|
4478
|
-
|
|
4522
|
+
const parentOf = ({ appNavId, urlMode, }) => {
|
|
4523
|
+
const host = parentNavId(appNavId);
|
|
4524
|
+
return urlMode === 'tail' && host && navMap[host] ? host : ROOT_NAV$1;
|
|
4525
|
+
};
|
|
4526
|
+
const extra = listed.map((mount) => {
|
|
4527
|
+
const { name, appNavId, link } = mount;
|
|
4479
4528
|
const fetched = navMap[appNavId];
|
|
4480
4529
|
const config = link ? configs[link] : undefined;
|
|
4481
4530
|
const node = {
|
|
@@ -4484,18 +4533,31 @@ const NavStore = signalStore({ providedIn: 'root' }, withState(initialState$3),
|
|
|
4484
4533
|
title: config?.app ?? fetched?.title ?? name,
|
|
4485
4534
|
...(config?.logo ? { logo: config.logo } : {}),
|
|
4486
4535
|
};
|
|
4487
|
-
return node;
|
|
4536
|
+
return { node, parent: parentOf(mount) };
|
|
4488
4537
|
});
|
|
4538
|
+
// A host Nav that declares no children lists its own by NavId prefix,
|
|
4539
|
+
// which already finds the node — declaring it alone would hide every
|
|
4540
|
+
// sibling that prefix found. Root always declares.
|
|
4541
|
+
const parents = [...new Set(extra.map(({ parent }) => parent))].filter((id) => id === ROOT_NAV$1 || !!navMap[id]?.children?.length);
|
|
4489
4542
|
return {
|
|
4490
4543
|
...navMap,
|
|
4491
|
-
...Object.fromEntries(extra.map((node) => [node.navId, node])),
|
|
4492
|
-
|
|
4493
|
-
|
|
4494
|
-
|
|
4495
|
-
|
|
4496
|
-
|
|
4497
|
-
|
|
4498
|
-
|
|
4544
|
+
...Object.fromEntries(extra.map(({ node }) => [node.navId, node])),
|
|
4545
|
+
...Object.fromEntries(parents.map((parentId) => {
|
|
4546
|
+
const parent = navMap[parentId];
|
|
4547
|
+
const hung = extra
|
|
4548
|
+
.filter(({ parent: p }) => p === parentId)
|
|
4549
|
+
.map(({ node }) => node.navId);
|
|
4550
|
+
return [
|
|
4551
|
+
parentId,
|
|
4552
|
+
{
|
|
4553
|
+
...parent,
|
|
4554
|
+
children: [
|
|
4555
|
+
...(parent?.children ?? []).filter((id) => !hung.includes(id)),
|
|
4556
|
+
...hung,
|
|
4557
|
+
],
|
|
4558
|
+
},
|
|
4559
|
+
];
|
|
4560
|
+
})),
|
|
4499
4561
|
};
|
|
4500
4562
|
}, ...(ngDevMode ? [{ debugName: "menuNavMap" }] : /* istanbul ignore next */ []));
|
|
4501
4563
|
const hasMurl = computed(() => store.murl().length > 0, ...(ngDevMode ? [{ debugName: "hasMurl" }] : /* istanbul ignore next */ []));
|
|
@@ -4552,6 +4614,17 @@ const NavStore = signalStore({ providedIn: 'root' }, withState(initialState$3),
|
|
|
4552
4614
|
return undefined;
|
|
4553
4615
|
};
|
|
4554
4616
|
const widgetEntry = computed(() => firstEntry(widgetNavIds()), ...(ngDevMode ? [{ debugName: "widgetEntry" }] : /* istanbul ignore next */ []));
|
|
4617
|
+
/**
|
|
4618
|
+
* The instances the panel is drawn for: the Browse's while one is open —
|
|
4619
|
+
* the Router still describes the Page behind the panel, not the Nav the
|
|
4620
|
+
* User is looking into — and the Router's otherwise (CONTEXT.md Browse).
|
|
4621
|
+
*/
|
|
4622
|
+
const panelParams = computed(() => store.menuNavId()
|
|
4623
|
+
? Object.fromEntries(Object.entries(store.menuParams() ?? {}).map(([name, value]) => [
|
|
4624
|
+
name,
|
|
4625
|
+
String(value),
|
|
4626
|
+
]))
|
|
4627
|
+
: store.routeParams(), ...(ngDevMode ? [{ debugName: "panelParams" }] : /* istanbul ignore next */ []));
|
|
4555
4628
|
/**
|
|
4556
4629
|
* Every `dynamic` Nav with a NavRowSource behind it, resolved. Walks the
|
|
4557
4630
|
* whole map rather than the open panel's own descent: the rows are drawn by
|
|
@@ -4560,30 +4633,23 @@ const NavStore = signalStore({ providedIn: 'root' }, withState(initialState$3),
|
|
|
4560
4633
|
*/
|
|
4561
4634
|
const dynamicRows = computed(() => {
|
|
4562
4635
|
const out = {};
|
|
4636
|
+
const params = panelParams();
|
|
4563
4637
|
for (const nav of Object.values(store.navMap())) {
|
|
4564
4638
|
if (nav.presentation !== 'dynamic')
|
|
4565
4639
|
continue;
|
|
4566
4640
|
const hit = entryAt(nav.navId);
|
|
4567
4641
|
if (!hit || !isNavRowsConfig(hit.entry))
|
|
4568
4642
|
continue;
|
|
4643
|
+
const rows = hit.entry.navRowsFor
|
|
4644
|
+
? hit.entry.navRowsFor(params)
|
|
4645
|
+
: hit.entry.navRows();
|
|
4569
4646
|
out[nav.navId] = {
|
|
4570
|
-
rows:
|
|
4647
|
+
rows: rows ?? [],
|
|
4571
4648
|
loading: hit.entry.loading?.(),
|
|
4572
4649
|
};
|
|
4573
4650
|
}
|
|
4574
4651
|
return out;
|
|
4575
4652
|
}, ...(ngDevMode ? [{ debugName: "dynamicRows" }] : /* istanbul ignore next */ []));
|
|
4576
|
-
/**
|
|
4577
|
-
* The instances the panel is drawn for: the Browse's while one is open —
|
|
4578
|
-
* the Router still describes the Page behind the panel, not the Nav the
|
|
4579
|
-
* User is looking into — and the Router's otherwise (CONTEXT.md Browse).
|
|
4580
|
-
*/
|
|
4581
|
-
const panelParams = computed(() => store.menuNavId()
|
|
4582
|
-
? Object.fromEntries(Object.entries(store.menuParams() ?? {}).map(([name, value]) => [
|
|
4583
|
-
name,
|
|
4584
|
-
String(value),
|
|
4585
|
-
]))
|
|
4586
|
-
: store.routeParams(), ...(ngDevMode ? [{ debugName: "panelParams" }] : /* istanbul ignore next */ []));
|
|
4587
4653
|
/**
|
|
4588
4654
|
* Every `dynamic` Nav with a NavInstanceSource behind it, resolved against
|
|
4589
4655
|
* the parameters the panel is drawn for (ADR 0030) — a Browse's own, so the
|
|
@@ -4872,32 +4938,37 @@ const NavStore = signalStore({ providedIn: 'root' }, withState(initialState$3),
|
|
|
4872
4938
|
* page rather than stepping out one Murl at a time (ADR 0013).
|
|
4873
4939
|
*
|
|
4874
4940
|
* `keepPanel` is for the AppLogo: home navigation while the menu is open
|
|
4875
|
-
* must not clear `navOpenedByUser`, so the panel stays up on root.
|
|
4941
|
+
* must not clear `navOpenedByUser`, so the panel stays up on root. It also
|
|
4942
|
+
* raises a closed panel — a gesture whose landing is read from its panel,
|
|
4943
|
+
* as the editor's CodeTree is. Applied ahead of a mount's own move too:
|
|
4944
|
+
* the host's path changes all the same once the mount reports.
|
|
4876
4945
|
*/
|
|
4877
4946
|
const goToNav = (navId, params, options) => {
|
|
4947
|
+
const willOpen = untracked(() => splitNavId(navId, store.navMap()).murl.length > 0);
|
|
4948
|
+
if (options?.keepPanel && !willOpen) {
|
|
4949
|
+
patchState(store, {
|
|
4950
|
+
navOpenedByUser: true,
|
|
4951
|
+
keepPanelOnPathChange: true,
|
|
4952
|
+
});
|
|
4953
|
+
}
|
|
4878
4954
|
// A side app's own Nav moves that app; it reports, and its m-remote
|
|
4879
4955
|
// writes the URL through `out` — one write path, not two.
|
|
4880
4956
|
const mount = mountOf(navId);
|
|
4881
4957
|
if (mount?.navigate) {
|
|
4882
4958
|
const map = untracked(() => store.navMap());
|
|
4883
4959
|
const own = navIdToRoutePath(mount.appNavId, map);
|
|
4884
|
-
const full =
|
|
4885
|
-
mount.navigate(full.slice(own === URL_SEP ? 1 : own.length + 1)
|
|
4960
|
+
const full = fillRoutePath(navId, map, params);
|
|
4961
|
+
mount.navigate(full.slice(own === URL_SEP ? 1 : own.length + 1), {
|
|
4962
|
+
replaceUrl: !!options?.replaceUrl,
|
|
4963
|
+
});
|
|
4886
4964
|
return;
|
|
4887
4965
|
}
|
|
4888
4966
|
const wasOpen = untracked(() => store.hasMurl());
|
|
4889
4967
|
patchState(store, { menuNavId: undefined });
|
|
4890
4968
|
const address = addressFor(navId, params);
|
|
4891
|
-
const willOpen = untracked(() => splitNavId(navId, store.navMap()).murl.length > 0);
|
|
4892
4969
|
if (willOpen && !wasOpen) {
|
|
4893
4970
|
patchState(store, { panelPushed: true });
|
|
4894
4971
|
}
|
|
4895
|
-
if (options?.keepPanel && !willOpen) {
|
|
4896
|
-
patchState(store, {
|
|
4897
|
-
navOpenedByUser: true,
|
|
4898
|
-
keepPanelOnPathChange: true,
|
|
4899
|
-
});
|
|
4900
|
-
}
|
|
4901
4972
|
router.navigateByUrl(address, {
|
|
4902
4973
|
replaceUrl: !!options?.replaceUrl || (wasOpen && willOpen),
|
|
4903
4974
|
});
|
|
@@ -4917,20 +4988,55 @@ const NavStore = signalStore({ providedIn: 'root' }, withState(initialState$3),
|
|
|
4917
4988
|
}
|
|
4918
4989
|
return navId;
|
|
4919
4990
|
};
|
|
4920
|
-
/**
|
|
4921
|
-
|
|
4991
|
+
/**
|
|
4992
|
+
* The route parameter one Nav contributes, read off the map — a static
|
|
4993
|
+
* NavTail's being its tail, the only value it carries.
|
|
4994
|
+
*/
|
|
4995
|
+
const paramNameOf = (navId) => {
|
|
4996
|
+
const nav = untracked(() => store.navMap())[knownNavId(navId)];
|
|
4997
|
+
return nav?.tail && nav.presentation !== 'dynamic'
|
|
4998
|
+
? nav.tail
|
|
4999
|
+
: navParamOf(nav);
|
|
5000
|
+
};
|
|
4922
5001
|
/**
|
|
4923
5002
|
* Follows a NavRef whose dynamic segments are keyed by the *Nav* that
|
|
4924
5003
|
* contributes each one rather than by its parameter name (m-one-ui
|
|
4925
5004
|
* CONTEXT.md OutcomeNav). The map is what knows the names, so a NavParam
|
|
4926
5005
|
* renamed after the caller was emitted still fills the right segment.
|
|
5006
|
+
*
|
|
5007
|
+
* The map holds only the Nav stood on, its chain and its children, so a
|
|
5008
|
+
* target further down is fetched first: addressed from a partial map, an
|
|
5009
|
+
* unknown Nav contributes its own segment where its value belongs.
|
|
4927
5010
|
*/
|
|
4928
5011
|
const followNav = (navId, byNav, options) => {
|
|
4929
|
-
const
|
|
4930
|
-
|
|
4931
|
-
|
|
4932
|
-
|
|
4933
|
-
|
|
5012
|
+
const follow = () => {
|
|
5013
|
+
const entries = Object.entries(byNav ?? {});
|
|
5014
|
+
const params = entries.length
|
|
5015
|
+
? Object.fromEntries(entries.map(([id, value]) => [paramNameOf(id), value]))
|
|
5016
|
+
: undefined;
|
|
5017
|
+
goToNav(knownNavId(navId), params, options);
|
|
5018
|
+
};
|
|
5019
|
+
const target = knownNavId(navId);
|
|
5020
|
+
const map = untracked(() => store.navMap());
|
|
5021
|
+
if (navIdChain(target).every((id) => map[id]))
|
|
5022
|
+
return follow();
|
|
5023
|
+
getNavService
|
|
5024
|
+
.getNav(target, map, {
|
|
5025
|
+
appNavId: untracked(() => store.appNavId()),
|
|
5026
|
+
appLink: untracked(() => store.appLink()),
|
|
5027
|
+
mounts: untracked(() => store.allMounts()),
|
|
5028
|
+
})
|
|
5029
|
+
.subscribe({
|
|
5030
|
+
next: (delta) => {
|
|
5031
|
+
if (!Object.keys(delta).length)
|
|
5032
|
+
return;
|
|
5033
|
+
patchState(store, (state) => ({
|
|
5034
|
+
navMap: { ...state.navMap, ...delta },
|
|
5035
|
+
}));
|
|
5036
|
+
},
|
|
5037
|
+
complete: follow,
|
|
5038
|
+
error: follow,
|
|
5039
|
+
});
|
|
4934
5040
|
};
|
|
4935
5041
|
/** The current value of the parameter one dynamic Nav contributes. */
|
|
4936
5042
|
const routeParamOf = (navId) => untracked(() => store.routeParams())[paramNameOf(navId)];
|
|
@@ -5031,9 +5137,19 @@ const NavStore = signalStore({ providedIn: 'root' }, withState(initialState$3),
|
|
|
5031
5137
|
const standsOn = (navId, params) => !untracked(() => splitNavId(navId, store.navMap())).murl.length &&
|
|
5032
5138
|
untracked(() => addressFor(navId, params)) ===
|
|
5033
5139
|
untracked(() => store.path());
|
|
5034
|
-
|
|
5035
|
-
|
|
5036
|
-
|
|
5140
|
+
/**
|
|
5141
|
+
* A row naming the Page already stood on only closes the panel — unless it
|
|
5142
|
+
* asks to keep it, when the panel is what it came for and is raised.
|
|
5143
|
+
*/
|
|
5144
|
+
const setSelected = (navId, params, options) => {
|
|
5145
|
+
if (!navId)
|
|
5146
|
+
return closePanel();
|
|
5147
|
+
if (!standsOn(navId, params))
|
|
5148
|
+
return goToNav(navId, params, options);
|
|
5149
|
+
if (!options?.keepPanel)
|
|
5150
|
+
return closePanel();
|
|
5151
|
+
patchState(store, { navOpenedByUser: true, menuNavId: undefined });
|
|
5152
|
+
};
|
|
5037
5153
|
/**
|
|
5038
5154
|
* The one click that derives its own target instead of naming one. With no
|
|
5039
5155
|
* default Murl it opens the panel without touching the address — that state
|
|
@@ -5068,9 +5184,11 @@ const NavStore = signalStore({ providedIn: 'root' }, withState(initialState$3),
|
|
|
5068
5184
|
const setAppLink = (appLink, appNavId) => {
|
|
5069
5185
|
patchState(store, {
|
|
5070
5186
|
appLink,
|
|
5071
|
-
|
|
5072
|
-
|
|
5073
|
-
|
|
5187
|
+
// Only a host names where the app is mounted (m-ui's slot). A
|
|
5188
|
+
// standalone app sets its link for its WC config alone: defaulting to
|
|
5189
|
+
// the route made it a Remote mounted at `root`, and every Nav fetched
|
|
5190
|
+
// after that went to the WC bundle rather than to its own assets.
|
|
5191
|
+
appNavId: appLink ? appNavId : undefined,
|
|
5074
5192
|
});
|
|
5075
5193
|
loadWcConfig(appLink);
|
|
5076
5194
|
};
|
|
@@ -5322,78 +5440,457 @@ const NavStore = signalStore({ providedIn: 'root' }, withState(initialState$3),
|
|
|
5322
5440
|
};
|
|
5323
5441
|
}));
|
|
5324
5442
|
|
|
5325
|
-
function
|
|
5326
|
-
return ()
|
|
5327
|
-
|
|
5328
|
-
|
|
5329
|
-
|
|
5330
|
-
|
|
5331
|
-
|
|
5332
|
-
|
|
5333
|
-
|
|
5334
|
-
|
|
5335
|
-
|
|
5336
|
-
|
|
5337
|
-
|
|
5338
|
-
|
|
5339
|
-
|
|
5443
|
+
function getUniqueId() {
|
|
5444
|
+
return Date.now().toString(36) + Math.random().toString(36).substr(2);
|
|
5445
|
+
}
|
|
5446
|
+
|
|
5447
|
+
const MODAL_COMPONENT = new InjectionToken('MODAL_COMPONENT');
|
|
5448
|
+
const PANEL_COMPONENT = new InjectionToken('PANEL_COMPONENT');
|
|
5449
|
+
const CONFIRM_COMPONENT = new InjectionToken('CONFIRM_COMPONENT');
|
|
5450
|
+
/**
|
|
5451
|
+
* The body an overlay opened by name is filled with — what `mModal` and
|
|
5452
|
+
* `mSidePanel` already build by hand, reached through a token here so
|
|
5453
|
+
* `ModalStore.openScreen` can build the same thing without importing the
|
|
5454
|
+
* component into the store (the reason the three above are tokens).
|
|
5455
|
+
*/
|
|
5456
|
+
const OVERLAY_BODY_COMPONENT = new InjectionToken('OVERLAY_BODY_COMPONENT');
|
|
5457
|
+
|
|
5458
|
+
const MODAL_REF = new InjectionToken('MODAL_REF');
|
|
5459
|
+
class ModalRef {
|
|
5460
|
+
closeCallback;
|
|
5461
|
+
changeCallback;
|
|
5462
|
+
/** Commit a result and dismiss (single-pick, confirm, …). */
|
|
5463
|
+
close(result) {
|
|
5464
|
+
this.closeCallback?.(result);
|
|
5465
|
+
}
|
|
5466
|
+
/**
|
|
5467
|
+
* Commit a result without dismissing. Multi-pick panels use this so each
|
|
5468
|
+
* tick updates the field while the panel stays open.
|
|
5469
|
+
*/
|
|
5470
|
+
change(result) {
|
|
5471
|
+
this.changeCallback?.(result);
|
|
5472
|
+
}
|
|
5473
|
+
onClose(callback) {
|
|
5474
|
+
this.closeCallback = callback;
|
|
5475
|
+
}
|
|
5476
|
+
onChange(callback) {
|
|
5477
|
+
this.changeCallback = callback;
|
|
5478
|
+
}
|
|
5479
|
+
}
|
|
5480
|
+
|
|
5481
|
+
/**
|
|
5482
|
+
* A DockedPanel takes the viewport edge and displaces the older SidePanel inboard.
|
|
5483
|
+
* Docking is desktop-only and requires the page to stay readable behind both panels.
|
|
5484
|
+
* See ADR 0004.
|
|
5485
|
+
*/
|
|
5486
|
+
const DOCK_MIN_PAGE_REMAINDER = 320;
|
|
5487
|
+
const DOCK_TRANSITION = '300ms cubic-bezier(0.2, 0, 0, 1)';
|
|
5488
|
+
const DEFAULT_PANEL_WIDTH = '400px';
|
|
5489
|
+
/**
|
|
5490
|
+
* Reads a px panel width. Any other unit is undockable — the displacement offset
|
|
5491
|
+
* must be known before the panel exists in the DOM.
|
|
5492
|
+
*/
|
|
5493
|
+
const parsePanelWidth = (width) => {
|
|
5494
|
+
if (!width?.endsWith('px')) {
|
|
5495
|
+
return undefined;
|
|
5496
|
+
}
|
|
5497
|
+
const value = Number.parseFloat(width);
|
|
5498
|
+
return Number.isFinite(value) ? value : undefined;
|
|
5499
|
+
};
|
|
5500
|
+
/**
|
|
5501
|
+
* A CSS length as a panel needs it. An authored width is free text — the
|
|
5502
|
+
* Screen editor takes `400` as readily as `400px` — and a unitless number is
|
|
5503
|
+
* not a length: the browser drops the declaration and the panel collapses to
|
|
5504
|
+
* its content. A bare number means px, which is what every other authored
|
|
5505
|
+
* dimension in the library already assumes; anything carrying a unit, a
|
|
5506
|
+
* percentage or a `calc()` is passed through untouched.
|
|
5507
|
+
*/
|
|
5508
|
+
const panelCssLength = (value) => {
|
|
5509
|
+
const trimmed = value?.trim();
|
|
5510
|
+
if (!trimmed)
|
|
5511
|
+
return undefined;
|
|
5512
|
+
return /^-?\d*\.?\d+$/.test(trimmed) ? `${trimmed}px` : trimmed;
|
|
5513
|
+
};
|
|
5514
|
+
const hasRoomToDock = (baseWidth, panelWidth, viewportWidth) => {
|
|
5515
|
+
const base = parsePanelWidth(baseWidth);
|
|
5516
|
+
const panel = parsePanelWidth(panelWidth);
|
|
5517
|
+
if (base === undefined || panel === undefined) {
|
|
5518
|
+
return false;
|
|
5519
|
+
}
|
|
5520
|
+
return viewportWidth - (base + panel) >= DOCK_MIN_PAGE_REMAINDER;
|
|
5521
|
+
};
|
|
5522
|
+
|
|
5523
|
+
const initialModalState = {
|
|
5524
|
+
modalTriggerMap: {},
|
|
5525
|
+
className: 'modal',
|
|
5526
|
+
parentClassName: 'modals',
|
|
5527
|
+
activeModal: undefined,
|
|
5528
|
+
panelTriggerMap: {},
|
|
5529
|
+
panelClassName: 'panel',
|
|
5530
|
+
panelParentClassName: 'panels',
|
|
5531
|
+
activePanel: undefined,
|
|
5532
|
+
};
|
|
5533
|
+
const ModalStore = signalStore({ providedIn: 'root' }, withState(initialModalState), withMethods((state, domService = inject(DomService), deviceService = inject(DeviceService)) => {
|
|
5534
|
+
// Every modal that has gone, by id. A modal is dismissed from two places —
|
|
5535
|
+
// its own close affordance and this store — and only one of those runs
|
|
5536
|
+
// through a ModalRef, so a caller waiting on an answer would otherwise wait
|
|
5537
|
+
// forever on the other.
|
|
5538
|
+
const closed = new Subject();
|
|
5539
|
+
const modalComp = inject(MODAL_COMPONENT);
|
|
5540
|
+
const panelComp = inject(PANEL_COMPONENT);
|
|
5541
|
+
const confirmComp = inject(CONFIRM_COMPONENT);
|
|
5542
|
+
const overlayBodyComp = inject(OVERLAY_BODY_COMPONENT);
|
|
5543
|
+
const open = (modalTrigger) => {
|
|
5544
|
+
const id = modalTrigger.id ?? getUniqueId();
|
|
5545
|
+
const modalComponentRef = domService.create({
|
|
5546
|
+
component: modalComp,
|
|
5547
|
+
className: state.className(),
|
|
5548
|
+
id,
|
|
5549
|
+
parentClassName: state.parentClassName(),
|
|
5550
|
+
bindings: [
|
|
5551
|
+
inputBinding('name', () => modalTrigger.name),
|
|
5552
|
+
inputBinding('component', () => modalTrigger.component),
|
|
5553
|
+
inputBinding('bindings', () => modalTrigger.bindings),
|
|
5554
|
+
inputBinding('providers', () => modalTrigger.providers),
|
|
5555
|
+
inputBinding('one', () => modalTrigger.one ?? false),
|
|
5556
|
+
inputBinding('instanceId', () => id),
|
|
5557
|
+
inputBinding('config', () => modalTrigger.config),
|
|
5558
|
+
],
|
|
5559
|
+
});
|
|
5560
|
+
patchState(state, {
|
|
5561
|
+
modalTriggerMap: {
|
|
5562
|
+
...state.modalTriggerMap(),
|
|
5563
|
+
[id]: {
|
|
5564
|
+
...modalTrigger,
|
|
5565
|
+
ref: modalComponentRef,
|
|
5566
|
+
},
|
|
5567
|
+
},
|
|
5568
|
+
activeModal: id,
|
|
5569
|
+
});
|
|
5570
|
+
return id;
|
|
5571
|
+
};
|
|
5572
|
+
const close = (id) => {
|
|
5573
|
+
const modalId = id ?? state.activeModal();
|
|
5574
|
+
const modalTriggerMap = state.modalTriggerMap();
|
|
5575
|
+
if (!modalId) {
|
|
5576
|
+
return;
|
|
5340
5577
|
}
|
|
5341
|
-
|
|
5342
|
-
|
|
5578
|
+
// A modal that has already gone. Closing it again is what a body and its
|
|
5579
|
+
// own close affordance both doing their job looks like (ADR 0031), and
|
|
5580
|
+
// the state patch below would hand `activeModal` to somebody else's
|
|
5581
|
+
// overlay, so the second call answers nothing.
|
|
5582
|
+
if (id && !modalTriggerMap[id]) {
|
|
5583
|
+
return;
|
|
5343
5584
|
}
|
|
5344
|
-
|
|
5345
|
-
|
|
5346
|
-
|
|
5347
|
-
|
|
5585
|
+
domService.destroy({
|
|
5586
|
+
componentRef: modalTriggerMap[modalId]?.ref,
|
|
5587
|
+
parentClassName: state.parentClassName(),
|
|
5588
|
+
id: modalId,
|
|
5589
|
+
});
|
|
5590
|
+
delete modalTriggerMap[modalId];
|
|
5591
|
+
const remaining = Object.keys(modalTriggerMap);
|
|
5592
|
+
patchState(state, {
|
|
5593
|
+
modalTriggerMap: { ...modalTriggerMap },
|
|
5594
|
+
activeModal: remaining.length
|
|
5595
|
+
? remaining[remaining.length - 1]
|
|
5596
|
+
: undefined,
|
|
5597
|
+
});
|
|
5598
|
+
closed.next(modalId);
|
|
5599
|
+
};
|
|
5600
|
+
/**
|
|
5601
|
+
* The panel a dock request would displace: whatever currently holds the edge.
|
|
5602
|
+
* Docking is decided once, at open — never re-evaluated on resize (ADR 0004).
|
|
5603
|
+
*/
|
|
5604
|
+
const resolveDockTarget = (side, width) => {
|
|
5605
|
+
if (!deviceService.isDesktop()) {
|
|
5606
|
+
return undefined;
|
|
5348
5607
|
}
|
|
5349
|
-
|
|
5350
|
-
const
|
|
5351
|
-
|
|
5352
|
-
|
|
5353
|
-
|
|
5354
|
-
|
|
5355
|
-
|
|
5356
|
-
|
|
5357
|
-
|
|
5358
|
-
|
|
5359
|
-
|
|
5360
|
-
|
|
5361
|
-
|
|
5362
|
-
|
|
5363
|
-
|
|
5364
|
-
|
|
5365
|
-
|
|
5366
|
-
|
|
5367
|
-
|
|
5368
|
-
|
|
5369
|
-
|
|
5370
|
-
|
|
5371
|
-
|
|
5372
|
-
|
|
5373
|
-
|
|
5374
|
-
|
|
5375
|
-
|
|
5376
|
-
|
|
5377
|
-
|
|
5608
|
+
const baseId = state.activePanel();
|
|
5609
|
+
const base = baseId ? state.panelTriggerMap()[baseId] : undefined;
|
|
5610
|
+
if (!baseId || !base || (base.side ?? 'right') !== side) {
|
|
5611
|
+
return undefined;
|
|
5612
|
+
}
|
|
5613
|
+
const viewportWidth = typeof window === 'undefined' ? 0 : window.innerWidth;
|
|
5614
|
+
return hasRoomToDock(base.width, width, viewportWidth)
|
|
5615
|
+
? baseId
|
|
5616
|
+
: undefined;
|
|
5617
|
+
};
|
|
5618
|
+
const openPanel = (panelTrigger) => {
|
|
5619
|
+
const id = panelTrigger.id ?? getUniqueId();
|
|
5620
|
+
const side = panelTrigger.side ?? 'right';
|
|
5621
|
+
// Authored free text, made a CSS length: a unitless `400` is dropped by
|
|
5622
|
+
// the browser and the panel opens at the width of its own content.
|
|
5623
|
+
const width = panelCssLength(panelTrigger.width) ?? DEFAULT_PANEL_WIDTH;
|
|
5624
|
+
const height = panelCssLength(panelTrigger.height);
|
|
5625
|
+
const isMobile = deviceService.isMobile();
|
|
5626
|
+
if (panelTrigger.dock) {
|
|
5627
|
+
const activeId = state.activePanel();
|
|
5628
|
+
// Max two panels: a further dock request replaces the current DockedPanel,
|
|
5629
|
+
// which restores the panel underneath to the edge before we displace it again.
|
|
5630
|
+
if (activeId && state.panelTriggerMap()[activeId]?.dockedOver) {
|
|
5631
|
+
closePanel(activeId);
|
|
5632
|
+
}
|
|
5633
|
+
}
|
|
5634
|
+
const dockedOver = panelTrigger.dock
|
|
5635
|
+
? resolveDockTarget(side, width)
|
|
5636
|
+
: undefined;
|
|
5637
|
+
const styles = isMobile
|
|
5638
|
+
? {
|
|
5639
|
+
position: 'fixed',
|
|
5640
|
+
bottom: '0',
|
|
5641
|
+
left: '0',
|
|
5642
|
+
width: '100%',
|
|
5643
|
+
height: '90%',
|
|
5644
|
+
zIndex: '1000',
|
|
5645
|
+
}
|
|
5646
|
+
: {
|
|
5647
|
+
position: 'fixed',
|
|
5648
|
+
top: '0',
|
|
5649
|
+
bottom: '0',
|
|
5650
|
+
[side]: '0',
|
|
5651
|
+
width,
|
|
5652
|
+
zIndex: '1000',
|
|
5653
|
+
transition: `${side} ${DOCK_TRANSITION}`,
|
|
5654
|
+
};
|
|
5655
|
+
const panelComponentRef = domService.create({
|
|
5656
|
+
component: panelComp,
|
|
5657
|
+
className: `${state.panelClassName()} panel--${side}`,
|
|
5658
|
+
id,
|
|
5659
|
+
parentClassName: state.panelParentClassName(),
|
|
5660
|
+
styles,
|
|
5661
|
+
bindings: [
|
|
5662
|
+
inputBinding('component', () => panelTrigger.component),
|
|
5663
|
+
inputBinding('bindings', () => panelTrigger.bindings),
|
|
5664
|
+
inputBinding('providers', () => panelTrigger.providers),
|
|
5665
|
+
inputBinding('side', () => side),
|
|
5666
|
+
inputBinding('instanceId', () => id),
|
|
5667
|
+
inputBinding('docked', () => !!state.panelTriggerMap()[id]?.dockedOver),
|
|
5668
|
+
inputBinding('height', () => height),
|
|
5669
|
+
inputBinding('closeProhibited', () => !!panelTrigger.closeProhibited),
|
|
5670
|
+
],
|
|
5671
|
+
});
|
|
5672
|
+
if (dockedOver) {
|
|
5673
|
+
domService.updateStyleById({
|
|
5674
|
+
id: dockedOver,
|
|
5675
|
+
parentClassName: state.panelParentClassName(),
|
|
5676
|
+
styles: { [side]: width },
|
|
5378
5677
|
});
|
|
5379
5678
|
}
|
|
5380
|
-
|
|
5381
|
-
|
|
5382
|
-
|
|
5383
|
-
|
|
5384
|
-
|
|
5679
|
+
patchState(state, {
|
|
5680
|
+
panelTriggerMap: {
|
|
5681
|
+
...state.panelTriggerMap(),
|
|
5682
|
+
[id]: {
|
|
5683
|
+
...panelTrigger,
|
|
5684
|
+
side,
|
|
5685
|
+
width,
|
|
5686
|
+
dockedOver,
|
|
5687
|
+
ref: panelComponentRef,
|
|
5688
|
+
},
|
|
5689
|
+
},
|
|
5690
|
+
activePanel: id,
|
|
5691
|
+
});
|
|
5692
|
+
return id;
|
|
5693
|
+
};
|
|
5694
|
+
const closePanel = (id) => {
|
|
5695
|
+
const panelId = id ?? state.activePanel();
|
|
5696
|
+
const panelTriggerMap = state.panelTriggerMap();
|
|
5697
|
+
if (!panelId) {
|
|
5698
|
+
return;
|
|
5385
5699
|
}
|
|
5386
|
-
//
|
|
5387
|
-
|
|
5388
|
-
|
|
5389
|
-
|
|
5390
|
-
|
|
5391
|
-
|
|
5392
|
-
|
|
5393
|
-
|
|
5394
|
-
|
|
5700
|
+
// A panel that has already gone — `close`'s reason, and here it would
|
|
5701
|
+
// also promote a DockedPanel a second time.
|
|
5702
|
+
if (id && !panelTriggerMap[id]) {
|
|
5703
|
+
return;
|
|
5704
|
+
}
|
|
5705
|
+
const closing = panelTriggerMap[panelId];
|
|
5706
|
+
domService.destroy({
|
|
5707
|
+
componentRef: closing?.ref,
|
|
5708
|
+
parentClassName: state.panelParentClassName(),
|
|
5709
|
+
id: panelId,
|
|
5710
|
+
});
|
|
5711
|
+
delete panelTriggerMap[panelId];
|
|
5712
|
+
// Closing a DockedPanel returns the panel it displaced to the edge.
|
|
5713
|
+
if (closing?.dockedOver && panelTriggerMap[closing.dockedOver]) {
|
|
5714
|
+
domService.updateStyleById({
|
|
5715
|
+
id: closing.dockedOver,
|
|
5716
|
+
parentClassName: state.panelParentClassName(),
|
|
5717
|
+
styles: { [closing.side ?? 'right']: '0' },
|
|
5718
|
+
});
|
|
5719
|
+
}
|
|
5720
|
+
// Closing a displaced panel promotes its DockedPanel: already at the edge,
|
|
5721
|
+
// so nothing moves — its seam just goes dashed -> solid.
|
|
5722
|
+
const promotedId = Object.keys(panelTriggerMap).find((key) => panelTriggerMap[key]?.dockedOver === panelId);
|
|
5723
|
+
if (promotedId) {
|
|
5724
|
+
panelTriggerMap[promotedId] = {
|
|
5725
|
+
...panelTriggerMap[promotedId],
|
|
5726
|
+
dockedOver: undefined,
|
|
5727
|
+
};
|
|
5728
|
+
}
|
|
5729
|
+
const remaining = Object.keys(panelTriggerMap);
|
|
5730
|
+
patchState(state, {
|
|
5731
|
+
panelTriggerMap: { ...panelTriggerMap },
|
|
5732
|
+
activePanel: remaining.length
|
|
5733
|
+
? remaining[remaining.length - 1]
|
|
5734
|
+
: undefined,
|
|
5735
|
+
});
|
|
5395
5736
|
};
|
|
5396
|
-
|
|
5737
|
+
const cleanupOnClose = rxMethod(pipe(filter((modalMap) => !Object.keys(modalMap).length), tap(() => {
|
|
5738
|
+
domService.cleanup(state.parentClassName());
|
|
5739
|
+
})));
|
|
5740
|
+
const cleanupPanelsOnClose = rxMethod(pipe(filter((panelMap) => !Object.keys(panelMap).length), tap(() => {
|
|
5741
|
+
domService.cleanup(state.panelParentClassName());
|
|
5742
|
+
})));
|
|
5743
|
+
/**
|
|
5744
|
+
* The question as a value: subscribing asks it, and the single emission is
|
|
5745
|
+
* the answer — `true` for the commit, `false` for a refusal and for a
|
|
5746
|
+
* dismissal, which is a refusal by another route. Completes with that
|
|
5747
|
+
* emission, so a `switchMap` over it moves on rather than holding the
|
|
5748
|
+
* modal's answer open.
|
|
5749
|
+
*
|
|
5750
|
+
* Unsubscribing before it answers takes the modal away with it: the caller
|
|
5751
|
+
* that asked is gone, and a dialog nothing is waiting on is a dialog whose
|
|
5752
|
+
* answer lands nowhere.
|
|
5753
|
+
*/
|
|
5754
|
+
const ask = (opts) => new Observable((subscriber) => {
|
|
5755
|
+
const modalRef = new ModalRef();
|
|
5756
|
+
let settled = false;
|
|
5757
|
+
let id = '';
|
|
5758
|
+
const settle = (result, dismiss) => {
|
|
5759
|
+
if (settled)
|
|
5760
|
+
return;
|
|
5761
|
+
settled = true;
|
|
5762
|
+
watch.unsubscribe();
|
|
5763
|
+
if (dismiss)
|
|
5764
|
+
close(id);
|
|
5765
|
+
subscriber.next(result);
|
|
5766
|
+
subscriber.complete();
|
|
5767
|
+
};
|
|
5768
|
+
const watch = closed
|
|
5769
|
+
.pipe(filter((closedId) => closedId === id))
|
|
5770
|
+
.subscribe(() => settle(false, false));
|
|
5771
|
+
id = open({
|
|
5772
|
+
component: confirmComp,
|
|
5773
|
+
providers: [{ provide: MODAL_REF, useValue: modalRef }],
|
|
5774
|
+
bindings: [
|
|
5775
|
+
inputBinding('header', () => opts.header ?? ''),
|
|
5776
|
+
inputBinding('body', () => opts.body ?? ''),
|
|
5777
|
+
inputBinding('params', () => opts.params ?? {}),
|
|
5778
|
+
inputBinding('type', () => opts.type ?? 'info'),
|
|
5779
|
+
inputBinding('kind', () => opts.kind ?? 'yes'),
|
|
5780
|
+
inputBinding('confirmLabel', () => opts.confirmLabel ?? ''),
|
|
5781
|
+
inputBinding('cancelLabel', () => opts.cancelLabel ?? ''),
|
|
5782
|
+
],
|
|
5783
|
+
});
|
|
5784
|
+
modalRef.onClose((result) => settle(!!result, true));
|
|
5785
|
+
return () => {
|
|
5786
|
+
if (settled)
|
|
5787
|
+
return;
|
|
5788
|
+
settled = true;
|
|
5789
|
+
watch.unsubscribe();
|
|
5790
|
+
close(id);
|
|
5791
|
+
};
|
|
5792
|
+
});
|
|
5793
|
+
/**
|
|
5794
|
+
* Opens one Screen as an overlay and hands it its inputs — what a
|
|
5795
|
+
* generated FeatureStore calls where a Control's `mModal` would be the
|
|
5796
|
+
* drawn answer (m-one-ui OpenScreen).
|
|
5797
|
+
*
|
|
5798
|
+
* The same body the two directives build, reached the same way: the widget
|
|
5799
|
+
* is loaded on first open, so nothing it names is in the initial bundle.
|
|
5800
|
+
* Returns the overlay's own id and waits for nothing — the caller is a
|
|
5801
|
+
* `tap` inside a request pipe, and a store that held its emission open
|
|
5802
|
+
* until a panel closed would be answering for a gesture nobody made.
|
|
5803
|
+
*/
|
|
5804
|
+
const openScreen = (trigger) => {
|
|
5805
|
+
const bindings = [
|
|
5806
|
+
inputBinding('widget', () => trigger.widget),
|
|
5807
|
+
inputBinding('inputs', () => trigger.inputs ?? {}),
|
|
5808
|
+
// The body binds these onto the Screen it creates (ADR 0033). A
|
|
5809
|
+
// Screen the opener listens to nothing of hands an empty record,
|
|
5810
|
+
// which binds nothing at all.
|
|
5811
|
+
inputBinding('outputs', () => trigger.outputs ?? {}),
|
|
5812
|
+
];
|
|
5813
|
+
// Its own ModalRef, the way each directive mints one: the body closes
|
|
5814
|
+
// itself through this. Nothing here listens for the *result* — a store
|
|
5815
|
+
// has nowhere to put a panel's answer — but the close dismisses, which is
|
|
5816
|
+
// the whole of what a body opened this way can ask for (ADR 0031).
|
|
5817
|
+
const modalRef = new ModalRef();
|
|
5818
|
+
// What the body answered reaches the caller either way (ADR 0031): a
|
|
5819
|
+
// `change` reports and the overlay stays, a `close` reports and then it
|
|
5820
|
+
// goes. The order on a close is deliberate — a handler that reads the
|
|
5821
|
+
// Screen it opened must run while that Screen is still there.
|
|
5822
|
+
modalRef.onChange((result) => trigger.onResult?.(result));
|
|
5823
|
+
const providers = [{ provide: MODAL_REF, useValue: modalRef }];
|
|
5824
|
+
if (trigger.as === 'side_panel') {
|
|
5825
|
+
const panelId = openPanel({
|
|
5826
|
+
component: overlayBodyComp,
|
|
5827
|
+
bindings,
|
|
5828
|
+
providers,
|
|
5829
|
+
side: trigger.side,
|
|
5830
|
+
width: trigger.width,
|
|
5831
|
+
height: trigger.height,
|
|
5832
|
+
dock: trigger.dock,
|
|
5833
|
+
closeProhibited: trigger.closeProhibited,
|
|
5834
|
+
});
|
|
5835
|
+
modalRef.onClose((result) => {
|
|
5836
|
+
trigger.onResult?.(result);
|
|
5837
|
+
closePanel(panelId);
|
|
5838
|
+
});
|
|
5839
|
+
return panelId;
|
|
5840
|
+
}
|
|
5841
|
+
const modalId = open({
|
|
5842
|
+
component: overlayBodyComp,
|
|
5843
|
+
bindings,
|
|
5844
|
+
providers,
|
|
5845
|
+
config: trigger.config,
|
|
5846
|
+
});
|
|
5847
|
+
modalRef.onClose((result) => {
|
|
5848
|
+
trigger.onResult?.(result);
|
|
5849
|
+
close(modalId);
|
|
5850
|
+
});
|
|
5851
|
+
return modalId;
|
|
5852
|
+
};
|
|
5853
|
+
/**
|
|
5854
|
+
* Closes the overlay with this id, whichever kind it is — what a caller
|
|
5855
|
+
* holding only what `openScreen` returned can say (ADR 0031). Nothing for
|
|
5856
|
+
* an id nothing answers to, which is what a body that already closed itself
|
|
5857
|
+
* leaves behind.
|
|
5858
|
+
*/
|
|
5859
|
+
const dismiss = (id) => {
|
|
5860
|
+
if (state.modalTriggerMap()[id]) {
|
|
5861
|
+
close(id);
|
|
5862
|
+
return;
|
|
5863
|
+
}
|
|
5864
|
+
if (state.panelTriggerMap()[id])
|
|
5865
|
+
closePanel(id);
|
|
5866
|
+
};
|
|
5867
|
+
// The callback form, kept for every caller drawn against it. One
|
|
5868
|
+
// implementation underneath: a refusal runs nothing, which is what an
|
|
5869
|
+
// `onConfirm` that never fires already meant.
|
|
5870
|
+
const confirm = (opts, onConfirm) => {
|
|
5871
|
+
ask(opts).subscribe((result) => {
|
|
5872
|
+
if (result)
|
|
5873
|
+
onConfirm();
|
|
5874
|
+
});
|
|
5875
|
+
};
|
|
5876
|
+
return {
|
|
5877
|
+
open,
|
|
5878
|
+
close,
|
|
5879
|
+
dismiss,
|
|
5880
|
+
ask,
|
|
5881
|
+
confirm,
|
|
5882
|
+
openScreen,
|
|
5883
|
+
openPanel,
|
|
5884
|
+
closePanel,
|
|
5885
|
+
cleanupOnClose,
|
|
5886
|
+
cleanupPanelsOnClose,
|
|
5887
|
+
};
|
|
5888
|
+
}), withHooks({
|
|
5889
|
+
onInit({ cleanupOnClose, modalTriggerMap, cleanupPanelsOnClose, panelTriggerMap, }) {
|
|
5890
|
+
cleanupOnClose(modalTriggerMap);
|
|
5891
|
+
cleanupPanelsOnClose(panelTriggerMap);
|
|
5892
|
+
},
|
|
5893
|
+
}));
|
|
5397
5894
|
|
|
5398
5895
|
const MAGMONIUM = `
|
|
5399
5896
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="-15 -15 120 165">
|
|
@@ -6939,124 +7436,810 @@ class ButtonComponent extends ReactiveElementComponent {
|
|
|
6939
7436
|
if (isPrimary && color === 'inverseText') {
|
|
6940
7437
|
return resolvePallet('mm', this.themeStore.color()).color;
|
|
6941
7438
|
}
|
|
6942
|
-
const pallet = resolvePallet(color, this.themeStore.color());
|
|
6943
|
-
return isPrimary ? pallet.contrastColor : pallet.color;
|
|
6944
|
-
}, ...(ngDevMode ? [{ debugName: "buttonColor" }] : /* istanbul ignore next */ []));
|
|
6945
|
-
constructor() {
|
|
6946
|
-
super();
|
|
6947
|
-
effect(() => {
|
|
6948
|
-
const isPrimary = this.isPrimary();
|
|
6949
|
-
const colorInput = this.colorInput();
|
|
6950
|
-
const el = this.elementRef.nativeElement;
|
|
6951
|
-
if (isPrimary && colorInput === 'inverseText') {
|
|
6952
|
-
el.style.setProperty('--m-button-color-contrast', this.buttonColor());
|
|
6953
|
-
el.style.setProperty('--m-one-button-color-contrast', this.buttonColor());
|
|
6954
|
-
}
|
|
6955
|
-
});
|
|
7439
|
+
const pallet = resolvePallet(color, this.themeStore.color());
|
|
7440
|
+
return isPrimary ? pallet.contrastColor : pallet.color;
|
|
7441
|
+
}, ...(ngDevMode ? [{ debugName: "buttonColor" }] : /* istanbul ignore next */ []));
|
|
7442
|
+
constructor() {
|
|
7443
|
+
super();
|
|
7444
|
+
effect(() => {
|
|
7445
|
+
const isPrimary = this.isPrimary();
|
|
7446
|
+
const colorInput = this.colorInput();
|
|
7447
|
+
const el = this.elementRef.nativeElement;
|
|
7448
|
+
if (isPrimary && colorInput === 'inverseText') {
|
|
7449
|
+
el.style.setProperty('--m-button-color-contrast', this.buttonColor());
|
|
7450
|
+
el.style.setProperty('--m-one-button-color-contrast', this.buttonColor());
|
|
7451
|
+
}
|
|
7452
|
+
});
|
|
7453
|
+
}
|
|
7454
|
+
buttonIcon = computed(() => {
|
|
7455
|
+
const name = this.config()?.icon;
|
|
7456
|
+
if (!name) {
|
|
7457
|
+
return undefined;
|
|
7458
|
+
}
|
|
7459
|
+
return {
|
|
7460
|
+
name: this.config()?.icon,
|
|
7461
|
+
color: this.buttonColor(),
|
|
7462
|
+
baseUrl: this.baseUrl(),
|
|
7463
|
+
remote: this.remote() ?? this.config()?.remote,
|
|
7464
|
+
};
|
|
7465
|
+
}, ...(ngDevMode ? [{ debugName: "buttonIcon" }] : /* istanbul ignore next */ []));
|
|
7466
|
+
overrideProperty = computed(() => {
|
|
7467
|
+
const button = {};
|
|
7468
|
+
// The rest of what a `buttons/<name>.yml` carries, so a one-off Button
|
|
7469
|
+
// needs no file (ADR 0010). An omitted attribute is skipped rather than
|
|
7470
|
+
// written as undefined — writing it would blank whatever the asset set.
|
|
7471
|
+
const put = (key, value) => {
|
|
7472
|
+
if (value !== undefined)
|
|
7473
|
+
button[key] = value;
|
|
7474
|
+
};
|
|
7475
|
+
put('label', this.label());
|
|
7476
|
+
put('icon', this.icon());
|
|
7477
|
+
put('imgSrc', this.imgSrc());
|
|
7478
|
+
put('tabindex', toAttrNumber(this.tabindex()));
|
|
7479
|
+
put('noTranslate', toAttrBool(this.noTranslate()));
|
|
7480
|
+
put('params', this.params());
|
|
7481
|
+
put('isRightIcon', toAttrBool(this.isRightIcon()));
|
|
7482
|
+
put('iconOnly', toAttrBool(this.iconOnly()));
|
|
7483
|
+
put('stacked', toAttrBool(this.stacked()));
|
|
7484
|
+
put('nonClickable', toAttrBool(this.nonClickable()));
|
|
7485
|
+
put('inverted', toAttrBool(this.inverted()));
|
|
7486
|
+
put('isSubmit', toAttrBool(this.isSubmit()));
|
|
7487
|
+
if (this.color()) {
|
|
7488
|
+
button['color'] = this.color();
|
|
7489
|
+
}
|
|
7490
|
+
if (this.labelClass()) {
|
|
7491
|
+
button['labelClass'] = this.labelClass();
|
|
7492
|
+
}
|
|
7493
|
+
if (typeof this.fullWidth() !== 'undefined') {
|
|
7494
|
+
button['fullWidth'] = toAttrBool(this.fullWidth());
|
|
7495
|
+
}
|
|
7496
|
+
if (this.nav()) {
|
|
7497
|
+
button['nav'] = this.nav();
|
|
7498
|
+
}
|
|
7499
|
+
if (this.navParams()) {
|
|
7500
|
+
button['navParams'] = this.navParams();
|
|
7501
|
+
}
|
|
7502
|
+
if (this.href()) {
|
|
7503
|
+
button['href'] = this.href();
|
|
7504
|
+
}
|
|
7505
|
+
if (typeof this.disabled() !== 'undefined') {
|
|
7506
|
+
button['disabled'] = this.disabled();
|
|
7507
|
+
}
|
|
7508
|
+
if (this.variant()) {
|
|
7509
|
+
button['variant'] = this.variant();
|
|
7510
|
+
}
|
|
7511
|
+
// Force primary and clear ghost if the color is 'inverse' or 'inverseText', unless explicitly ghost or secondary
|
|
7512
|
+
const finalColor = button.color || this.config()?.color;
|
|
7513
|
+
const isExplicitGhost = button.variant === 'ghost' || this.config()?.variant === 'ghost';
|
|
7514
|
+
const isExplicitSecondary = button.variant === 'secondary' ||
|
|
7515
|
+
this.config()?.variant === 'secondary';
|
|
7516
|
+
if ((finalColor === 'inverse' || finalColor === 'inverseText') &&
|
|
7517
|
+
!isExplicitGhost &&
|
|
7518
|
+
!isExplicitSecondary) {
|
|
7519
|
+
button['color'] = 'inverseText';
|
|
7520
|
+
button['variant'] = 'primary';
|
|
7521
|
+
}
|
|
7522
|
+
else if (finalColor === 'inverse') {
|
|
7523
|
+
button['color'] = 'inverseText';
|
|
7524
|
+
}
|
|
7525
|
+
if (this.config()?.nav || this.nav()) {
|
|
7526
|
+
button['variant'] = this.isMurlActive() ? undefined : 'ghost';
|
|
7527
|
+
}
|
|
7528
|
+
return button;
|
|
7529
|
+
}, ...(ngDevMode ? [{ debugName: "overrideProperty" }] : /* istanbul ignore next */ []));
|
|
7530
|
+
resolveComponentOverrides() {
|
|
7531
|
+
return this.overrideProperty();
|
|
7532
|
+
}
|
|
7533
|
+
onClick() {
|
|
7534
|
+
if (this.isFormSubmit()) {
|
|
7535
|
+
// Called rather than left to a native `type="submit"`: the `<form>` is
|
|
7536
|
+
// only an ancestor while nothing re-projects this Button out of it.
|
|
7537
|
+
this.sectionForm?.submit();
|
|
7538
|
+
}
|
|
7539
|
+
this.clicked.emit(this.config());
|
|
7540
|
+
}
|
|
7541
|
+
formatBadgeCount = (count, max = 99) => formatBadgeCount(count, max);
|
|
7542
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: ButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
7543
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: ButtonComponent, isStandalone: true, selector: "m-button,m-one-button", inputs: { config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, labelClass: { classPropertyName: "labelClass", publicName: "labelClass", isSignal: true, isRequired: false, transformFunction: null }, fullWidth: { classPropertyName: "fullWidth", publicName: "fullWidth", isSignal: true, isRequired: false, transformFunction: null }, nav: { classPropertyName: "nav", publicName: "nav", isSignal: true, isRequired: false, transformFunction: null }, navParams: { classPropertyName: "navParams", publicName: "navParams", isSignal: true, isRequired: false, transformFunction: null }, href: { classPropertyName: "href", publicName: "href", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, baseUrl: { classPropertyName: "baseUrl", publicName: "baseUrl", isSignal: true, isRequired: false, transformFunction: null }, one: { classPropertyName: "one", publicName: "one", isSignal: true, isRequired: false, transformFunction: null }, remote: { classPropertyName: "remote", publicName: "remote", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, noTranslate: { classPropertyName: "noTranslate", publicName: "noTranslate", isSignal: true, isRequired: false, transformFunction: null }, params: { classPropertyName: "params", publicName: "params", isSignal: true, isRequired: false, transformFunction: null }, noNative: { classPropertyName: "noNative", publicName: "noNative", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, isRightIcon: { classPropertyName: "isRightIcon", publicName: "isRightIcon", isSignal: true, isRequired: false, transformFunction: null }, iconOnly: { classPropertyName: "iconOnly", publicName: "iconOnly", isSignal: true, isRequired: false, transformFunction: null }, stacked: { classPropertyName: "stacked", publicName: "stacked", isSignal: true, isRequired: false, transformFunction: null }, imgSrc: { classPropertyName: "imgSrc", publicName: "imgSrc", isSignal: true, isRequired: false, transformFunction: null }, nonClickable: { classPropertyName: "nonClickable", publicName: "nonClickable", isSignal: true, isRequired: false, transformFunction: null }, inverted: { classPropertyName: "inverted", publicName: "inverted", isSignal: true, isRequired: false, transformFunction: null }, isSubmit: { classPropertyName: "isSubmit", publicName: "isSubmit", isSignal: true, isRequired: false, transformFunction: null }, tabindex: { classPropertyName: "tabindex", publicName: "tabindex", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { config: "configChange", clicked: "clicked" }, viewQueries: [{ propertyName: "button", first: true, predicate: ["button"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "@if (config(); as config) {\n <!-- One branch for every in-app target: `mRef` names a NavId and the store\n reads the NavKind off that node to decide route vs panel (ADR 0014). -->\n @if (config.nav) {\n @if (!noNative()) {\n <button\n type=\"button\"\n class=\"{{ className() }}\"\n [attr.data-testid]=\"config.name + '-btn'\"\n [attr.tabindex]=\"config.tabindex\"\n [disabled]=\"config.disabled\"\n [mRef]=\"config.nav\"\n [mRefParams]=\"config.navParams\"\n [attr.aria-label]=\"config.noTranslate ? config.label : (config.label | translate: config.params)\"\n mRefLinkActive=\"tab\"\n (keydown.enter)=\"onClick()\"\n (click)=\"onClick()\"\n #button\n >\n <ng-container *ngTemplateOutlet=\"buttonContent; context: { button: config }\"></ng-container>\n </button>\n } @else {\n <div\n role=\"button\"\n [attr.tabindex]=\"config.tabindex ?? 0\"\n class=\"non-native {{ className() }}\"\n [attr.data-testid]=\"config.name + '-btn'\"\n [attr.aria-label]=\"config.noTranslate ? config.label : (config.label | translate: config.params)\"\n [attr.aria-disabled]=\"config.disabled ? 'true' : 'false'\"\n (keydown.enter)=\"onClick()\"\n (click)=\"onClick()\"\n #button\n >\n <ng-container *ngTemplateOutlet=\"buttonContent; context: { button: config }\"></ng-container>\n </div>\n }\n } @else if (config.href) {\n <a\n class=\"{{ className() }}\"\n [attr.data-testid]=\"config.name + '-btn'\"\n [attr.tabindex]=\"config.tabindex\"\n [href]=\"config.href\"\n [attr.aria-label]=\"config.noTranslate ? config.label : (config.label | translate: config.params)\"\n (click)=\"onClick()\"\n #button\n >\n <ng-container *ngTemplateOutlet=\"buttonContent; context: { button: config }\"></ng-container>\n </a>\n } @else {\n @if (!noNative()) {\n <button\n type=\"button\"\n class=\"{{ className() }}\"\n [attr.data-testid]=\"config.name + '-btn'\"\n [attr.tabindex]=\"config.tabindex\"\n [disabled]=\"isDisabled()\"\n [attr.aria-label]=\"config.noTranslate ? config.label : (config.label | translate: config.params)\"\n (keydown.enter)=\"onClick()\"\n (click)=\"onClick()\"\n #button\n >\n <ng-container *ngTemplateOutlet=\"buttonContent; context: { button: config }\"></ng-container>\n </button>\n } @else {\n <div\n role=\"button\"\n [attr.tabindex]=\"config.tabindex ?? 0\"\n class=\"non-native {{ className() }}\"\n [attr.data-testid]=\"config.name + '-btn'\"\n [attr.aria-label]=\"config.noTranslate ? config.label : (config.label | translate: config.params)\"\n [attr.aria-disabled]=\"isDisabled() ? 'true' : 'false'\"\n (keydown.enter)=\"onClick()\"\n (click)=\"onClick()\"\n #button\n >\n <ng-container *ngTemplateOutlet=\"buttonContent; context: { button: config }\"></ng-container>\n </div>\n }\n }\n}\n\n<ng-template #buttonContent let-button=\"button\">\n @if (button.imgSrc) {\n <div class=\"button-icon button-icon--img\">\n <m-img [src]=\"button.imgSrc\" [remote]=\"button.remote\" [alt]=\"button.label || button.name || ''\" />\n @if (button.badge && button.badge.count) {\n <m-badge\n [config]=\"{ variant: button.badge.variant ?? 'danger', position: 'absolute' }\"\n >{{ formatBadgeCount(button.badge.count) }}</m-badge\n >\n }\n </div>\n } @else if (buttonIcon(); as icon) {\n <div class=\"button-icon\">\n @if (isFromOne()) {\n <m-one-icon [config]=\"icon\" />\n } @else {\n <m-icon [config]=\"icon\" />\n }\n @if (button.badge && button.badge.count) {\n <m-badge\n [config]=\"{ variant: button.badge.variant ?? 'danger', position: 'absolute' }\"\n >{{ formatBadgeCount(button.badge.count) }}</m-badge\n >\n }\n </div>\n }\n @if (button.label && !button.iconOnly) {\n <span class=\"button-label {{ button.labelClass || '' }}\">\n {{ button.noTranslate ? button.label : (button.label | translate: button.params) }}\n </span>\n }\n @if (!buttonIcon() && button.badge && button.badge.count) {\n <m-badge [config]=\"{ variant: button.badge.variant ?? 'danger', position: 'static' }\">{{\n formatBadgeCount(button.badge.count)\n }}</m-badge>\n }\n</ng-template>\n", styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}:host{display:inline-flex;align-items:center;justify-content:center;vertical-align:middle;box-sizing:border-box;overflow:hidden;transition:box-shadow .15s ease;--m-btn-size: var(--m-button-size, 1em);--m-btn-color: var(--m-button-color, var(--m-one-button-color, var(--m-mm)));--m-btn-color-contrast: var(--m-button-color-contrast, var(--m-one-button-color-contrast, #ffffff));--m-btn-color-opposite: var(--m-button-color-opposite, var(--m-one-button-color-opposite, #e1b941));--m-btn-h: calc(var(--m-btn-size) * 2.25);width:var(--m-button-width, var(--m-one-button-width, auto));min-width:0;height:var(--m-btn-h);font-size:var(--m-btn-size)}:host-context(.inverse),:host-context(.tabs-inverse),:host.inverse{--m-btn-color: var(--m-button-color, var(--m-one-button-color, var(--m-inverse-text)))}:host:has(.full-width){display:flex;width:100%}:host:has(.full-width) button .button-label{white-space:normal;overflow:visible;text-overflow:clip;word-break:break-word}:host:has(.only-icon),:host:has(.toggle){width:var(--m-btn-h);min-width:var(--m-btn-h)}:host:has(.has-badge){overflow:visible}:host:has(.stacked),:host:has(.toggle){height:auto}button:not(.get):not(.toggle){height:calc(var(--input-size, var(--m-btn-size)) * 2);min-height:calc(var(--input-size, var(--m-btn-size)) * 2);border-width:max(1px,var(--input-size, var(--m-btn-size)) * .0625);border-radius:calc(var(--input-size, var(--m-btn-size)) * .4);padding:calc(var(--input-size, var(--m-btn-size)) * .5) calc(var(--input-size, var(--m-btn-size)) * .5);gap:calc(var(--input-size, var(--m-btn-size)) * .375);font-size:var(--input-size, var(--m-btn-size));border-color:var(--m-btn-color);transition:border-color .2s ease,box-shadow .2s ease,background-color .2s ease,opacity .2s ease}button:not(.get):not(.toggle):hover:not(:disabled){background-color:color-mix(in srgb,var(--m-btn-color) 6%,transparent)}button:not(.get):not(.toggle):disabled{opacity:.6;cursor:not-allowed}button:not(.get):not(.toggle){height:auto;padding:calc(var(--m-btn-size) * .625) calc(var(--m-btn-size) * 1.25);gap:calc(var(--m-btn-size) * .375);border-style:solid;display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;font-family:inherit;cursor:pointer;appearance:none;width:100%;height:100%;min-height:0;padding:0 calc(var(--m-btn-size) * 1.25);border-width:var(--m-button-border-width, 1px);border-radius:var(--m-button-radius, calc(var(--m-btn-size) * .5));color:var(--m-btn-color);font-weight:300;line-height:1;-webkit-user-select:none;user-select:none;position:relative;outline:none;box-shadow:var(--m-button-shadow, var(--m-one-button-shadow, none));transition:filter .15s ease,background .15s ease}button:not(.get):not(.toggle):hover:not(:disabled){filter:brightness(1.04)}button:not(.get):not(.toggle):focus-visible:not(:disabled){outline:2px solid color-mix(in srgb,var(--m-focus) 45%,transparent);outline-offset:-2px}button:not(.get):not(.toggle):active:not(:disabled){transform:scale(.97)}button:not(.get):not(.toggle):disabled{opacity:.35;cursor:not-allowed;pointer-events:none;filter:grayscale(80%)}button:not(.get):not(.toggle).read-only{pointer-events:none!important;cursor:default!important;transform:none!important;box-shadow:none!important;background:transparent!important;border-color:transparent!important;opacity:1!important}button:not(.get):not(.toggle).read-only .button-icon{transform:none!important;color:inherit!important}button:not(.get):not(.toggle).primary{background:var(--m-btn-color);border-color:var(--m-btn-color);color:var(--m-btn-color-contrast)}button:not(.get):not(.toggle).primary:hover:not(:disabled){filter:none;background:color-mix(in srgb,var(--m-btn-color) 88%,black);border-color:color-mix(in srgb,var(--m-btn-color) 88%,black)}button:not(.get):not(.toggle).primary:active:not(:disabled){filter:brightness(.94);transform:scale(.97)}button:not(.get):not(.toggle).ghost:not(.primary):not(.tab){background:transparent;border-color:transparent;color:var(--m-btn-color);box-shadow:none}button:not(.get):not(.toggle).ghost:not(.primary):not(.tab):hover:not(:disabled){filter:none;background:color-mix(in srgb,var(--m-btn-color) 8%,transparent)}button:not(.get):not(.toggle).ghost:not(.primary):not(.tab):active:not(:disabled){background:color-mix(in srgb,var(--m-btn-color) 14%,transparent);transform:scale(.97)}button:not(.get):not(.toggle).ghost:not(.primary):not(.tab).secondary{border:var(--m-button-border-width, 1px) solid color-mix(in srgb,var(--m-btn-color) 15%,transparent)}button:not(.get):not(.toggle).ghost:not(.primary):not(.tab).secondary:hover:not(:disabled){filter:none;border-color:color-mix(in srgb,var(--m-btn-color) 40%,transparent);background:color-mix(in srgb,var(--m-btn-color) 6%,transparent)}button:not(.get):not(.toggle).ghost:not(.primary):not(.tab).secondary:active:not(:disabled){border-color:color-mix(in srgb,var(--m-btn-color) 50%,transparent);background:color-mix(in srgb,var(--m-btn-color) 12%,transparent)}button:not(.get):not(.toggle).secondary:not(.primary):not(.ghost){background:transparent;border-color:var(--m-btn-color);color:var(--m-btn-color)}button:not(.get):not(.toggle).secondary:not(.primary):not(.ghost):hover:not(:disabled){filter:none;background:color-mix(in srgb,var(--m-btn-color) 8%,transparent)}button:not(.get):not(.toggle).secondary:not(.primary):not(.ghost):active:not(:disabled){background:color-mix(in srgb,var(--m-btn-color) 14%,transparent);transform:scale(.97)}button:not(.get):not(.toggle).tab{background:var(--m-backdrop-border);border-color:var(--m-backdrop-border);color:var(--m-btn-color)}button:not(.get):not(.toggle).tab:hover:not(:disabled){background:color-mix(in srgb,var(--m-backdrop-border) 82%,black);border-color:color-mix(in srgb,var(--m-backdrop-border) 82%,black);filter:none}button:not(.get):not(.toggle).tab:active:not(:disabled){background:color-mix(in srgb,var(--m-backdrop-border) 70%,black);border-color:color-mix(in srgb,var(--m-backdrop-border) 70%,black);transform:scale(.97)}button:not(.get):not(.toggle).segmented .button-icon,button:not(.get):not(.toggle).badge-accent .button-icon,button:not(.get):not(.toggle).with-right-icon .button-icon{display:inline-flex;align-items:center;justify-content:center;color:var(--m-btn-color-opposite);order:1}button:not(.get):not(.toggle).segmented .button-label,button:not(.get):not(.toggle).badge-accent .button-label,button:not(.get):not(.toggle).with-right-icon .button-label{order:-1}button:not(.get):not(.toggle).segmented.primary .button-icon,button:not(.get):not(.toggle).badge-accent.primary .button-icon,button:not(.get):not(.toggle).with-right-icon.primary .button-icon{color:var(--m-btn-color-opposite)}button:not(.get):not(.toggle).with-left-icon .button-icon{order:-1}button:not(.get):not(.toggle).with-left-icon .button-label{order:1}button:not(.get):not(.toggle).stacked{flex-direction:column;gap:calc(var(--m-btn-size) * .3);height:auto;min-height:var(--m-btn-h);padding:calc(var(--m-btn-size) * .625) calc(var(--m-btn-size) * .875)}button:not(.get):not(.toggle).stacked .button-label{font-size:calc(var(--m-btn-size) * .8)}button:not(.get):not(.toggle).only-icon{padding:0;border-width:var(--m-button-border-width, 1px);aspect-ratio:1;display:inline-flex;align-items:center;justify-content:center}button:not(.get):not(.toggle).only-icon m-icon,button:not(.get):not(.toggle).only-icon m-one-icon{display:inline-flex}m-badge{--m-badge-height: 1.5em;--m-badge-min-width: 1.5em;--m-badge-padding: 0 .3em;--m-badge-gap: .1em}.button-label{display:inline-flex;align-items:center;line-height:normal;font-size:inherit;min-width:0;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.button-icon{position:relative;display:inline-flex;align-items:center;justify-content:center}.button-icon--img{width:calc(var(--m-btn-size) * 1.75);height:calc(var(--m-btn-size) * 1.75);overflow:hidden}.button-icon--img m-img{width:100%;height:100%;display:block}.get{appearance:none;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;height:var(--m-btn-h);padding:0 min(var(--m-btn-size) * 1.75,2rem);border-radius:4px;background:linear-gradient(135deg,var(--m-mm),var(--m-focus),var(--m-success),var(--m-mm));background-size:200% auto;color:#fff;font-size:calc(var(--m-btn-size) * .8);font-weight:300;letter-spacing:.06em;text-transform:uppercase;border:none;cursor:pointer;white-space:nowrap;line-height:1;transition:background-position .2s ease,transform .15s ease}.get:hover{background-position:right center}.get:focus-visible{outline:2px solid color-mix(in srgb,var(--m-focus) 45%,transparent);outline-offset:-2px}.get:active{transform:scale(.97)}.toggle{appearance:none;display:inline-flex;align-items:center;justify-content:center;width:100%;height:100%;border:none;background:transparent;padding:0 min(var(--m-btn-size),1.25rem);border-radius:var(--m-button-radius, calc(var(--m-btn-size) * .375));box-shadow:none;color:var(--m-btn-color, var(--m-text-secondary));opacity:.65;font-family:inherit;font-size:var(--m-btn-size);font-weight:300;cursor:pointer;box-sizing:border-box;-webkit-user-select:none;user-select:none;transition:background .15s ease,color .15s ease,opacity .15s ease;min-width:0}.toggle .button-icon{flex-shrink:0}.toggle .button-label{display:inline-block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;min-width:0}.toggle:hover:not(:disabled){background:var(--m-button-hover-background, color-mix(in srgb, var(--m-focus) 8%, transparent));color:var(--m-button-hover-color, var(--m-text));opacity:1}.toggle:focus-visible:not(:disabled){outline:2px solid color-mix(in srgb,var(--m-focus) 45%,transparent);outline-offset:-2px;opacity:1}.toggle.primary{background:var(--m-button-active-background, var(--m-mm));color:var(--m-button-active-color, #ffffff);opacity:1}.toggle.primary:hover:not(:disabled){background:var(--m-button-active-background, var(--m-mm));color:var(--m-button-active-color, #ffffff);opacity:1}.toggle.primary:active:not(:disabled){transform:scale(.97)}.non-native:not(.get):not(.toggle){appearance:none;display:inline-flex;align-items:center;justify-content:center;width:100%;height:100%;min-height:0;padding:0 calc(var(--m-btn-size) * 1.25);border-width:2px;border-radius:4px;color:var(--m-btn-color);font-weight:300;line-height:1;-webkit-user-select:none;user-select:none;position:relative;outline:none;box-shadow:var(--m-button-shadow, var(--m-one-button-shadow, none));transition:filter .15s ease,background .15s ease}.non-native:not(.get):not(.toggle):hover:not([aria-disabled=true]){filter:brightness(1.04)}.non-native:not(.get):not(.toggle):focus-visible:not([aria-disabled=true]){outline:2px solid color-mix(in srgb,var(--m-focus) 45%,transparent);outline-offset:-2px}.non-native:not(.get):not(.toggle):active:not([aria-disabled=true]){transform:scale(.97)}.non-native:not(.get):not(.toggle)[aria-disabled=true]{opacity:.35;cursor:not-allowed;pointer-events:none;filter:grayscale(80%)}.non-native:not(.get):not(.toggle).primary{background:var(--m-btn-color);border-color:var(--m-btn-color);color:var(--m-btn-color-contrast)}.non-native:not(.get):not(.toggle).primary:hover:not([aria-disabled=true]){filter:none;background:color-mix(in srgb,var(--m-btn-color) 88%,black);border-color:color-mix(in srgb,var(--m-btn-color) 88%,black)}.non-native:not(.get):not(.toggle).primary:active:not([aria-disabled=true]){filter:brightness(.94);transform:scale(.97)}.non-native:not(.get):not(.toggle).ghost:not(.primary):not(.tab){background:transparent;border-color:transparent;color:var(--m-btn-color);box-shadow:none}.non-native:not(.get):not(.toggle).ghost:not(.primary):not(.tab):hover:not([aria-disabled=true]){filter:none;background:color-mix(in srgb,var(--m-btn-color) 8%,transparent)}.non-native:not(.get):not(.toggle).ghost:not(.primary):not(.tab):active:not([aria-disabled=true]){background:color-mix(in srgb,var(--m-btn-color) 14%,transparent);transform:scale(.97)}.non-native:not(.get):not(.toggle):disabled{opacity:.3;cursor:not-allowed}@container togglegroup (max-width: 320px){.non-native:not(.get):not(.toggle).with-left-icon .button-label,.non-native:not(.get):not(.toggle).with-right-icon .button-label{display:none!important}}@media(max-width:600px){.non-native:not(.get):not(.toggle).with-left-icon .button-label,.non-native:not(.get):not(.toggle).with-right-icon .button-label{display:none!important}}\n"], dependencies: [{ kind: "component", type: i0.forwardRef(() => IconComponent), selector: "m-icon, m-one-icon", inputs: ["config", "name", "color", "size", "one", "baseUrl", "remote"], outputs: ["configChange"] }, { kind: "component", type: i0.forwardRef(() => BadgeComponent), selector: "m-badge", inputs: ["config"], outputs: ["configChange"] }, { kind: "ngmodule", type: i0.forwardRef(() => RouterModule) }, { kind: "directive", type: i0.forwardRef(() => MRefDirective), selector: "[mRef]", inputs: ["mRef", "mRefLinkActive", "mRefToggle", "mRefParams"] }, { kind: "directive", type: i0.forwardRef(() => NgTemplateOutlet), selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i0.forwardRef(() => ImgComponent), selector: "m-img", inputs: ["src", "data", "dataType", "alt", "priority", "fill", "width", "height", "remote", "ngSrcset", "sizes"] }, { kind: "pipe", type: i0.forwardRef(() => TranslatePipe), name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
7544
|
+
}
|
|
7545
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: ButtonComponent, decorators: [{
|
|
7546
|
+
type: Component,
|
|
7547
|
+
args: [{ selector: 'm-button,m-one-button', imports: [
|
|
7548
|
+
forwardRef(() => TranslatePipe),
|
|
7549
|
+
forwardRef(() => IconComponent),
|
|
7550
|
+
forwardRef(() => BadgeComponent),
|
|
7551
|
+
RouterModule,
|
|
7552
|
+
MRefDirective,
|
|
7553
|
+
forwardRef(() => NgTemplateOutlet),
|
|
7554
|
+
forwardRef(() => ImgComponent),
|
|
7555
|
+
], encapsulation: ViewEncapsulation.Emulated, changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (config(); as config) {\n <!-- One branch for every in-app target: `mRef` names a NavId and the store\n reads the NavKind off that node to decide route vs panel (ADR 0014). -->\n @if (config.nav) {\n @if (!noNative()) {\n <button\n type=\"button\"\n class=\"{{ className() }}\"\n [attr.data-testid]=\"config.name + '-btn'\"\n [attr.tabindex]=\"config.tabindex\"\n [disabled]=\"config.disabled\"\n [mRef]=\"config.nav\"\n [mRefParams]=\"config.navParams\"\n [attr.aria-label]=\"config.noTranslate ? config.label : (config.label | translate: config.params)\"\n mRefLinkActive=\"tab\"\n (keydown.enter)=\"onClick()\"\n (click)=\"onClick()\"\n #button\n >\n <ng-container *ngTemplateOutlet=\"buttonContent; context: { button: config }\"></ng-container>\n </button>\n } @else {\n <div\n role=\"button\"\n [attr.tabindex]=\"config.tabindex ?? 0\"\n class=\"non-native {{ className() }}\"\n [attr.data-testid]=\"config.name + '-btn'\"\n [attr.aria-label]=\"config.noTranslate ? config.label : (config.label | translate: config.params)\"\n [attr.aria-disabled]=\"config.disabled ? 'true' : 'false'\"\n (keydown.enter)=\"onClick()\"\n (click)=\"onClick()\"\n #button\n >\n <ng-container *ngTemplateOutlet=\"buttonContent; context: { button: config }\"></ng-container>\n </div>\n }\n } @else if (config.href) {\n <a\n class=\"{{ className() }}\"\n [attr.data-testid]=\"config.name + '-btn'\"\n [attr.tabindex]=\"config.tabindex\"\n [href]=\"config.href\"\n [attr.aria-label]=\"config.noTranslate ? config.label : (config.label | translate: config.params)\"\n (click)=\"onClick()\"\n #button\n >\n <ng-container *ngTemplateOutlet=\"buttonContent; context: { button: config }\"></ng-container>\n </a>\n } @else {\n @if (!noNative()) {\n <button\n type=\"button\"\n class=\"{{ className() }}\"\n [attr.data-testid]=\"config.name + '-btn'\"\n [attr.tabindex]=\"config.tabindex\"\n [disabled]=\"isDisabled()\"\n [attr.aria-label]=\"config.noTranslate ? config.label : (config.label | translate: config.params)\"\n (keydown.enter)=\"onClick()\"\n (click)=\"onClick()\"\n #button\n >\n <ng-container *ngTemplateOutlet=\"buttonContent; context: { button: config }\"></ng-container>\n </button>\n } @else {\n <div\n role=\"button\"\n [attr.tabindex]=\"config.tabindex ?? 0\"\n class=\"non-native {{ className() }}\"\n [attr.data-testid]=\"config.name + '-btn'\"\n [attr.aria-label]=\"config.noTranslate ? config.label : (config.label | translate: config.params)\"\n [attr.aria-disabled]=\"isDisabled() ? 'true' : 'false'\"\n (keydown.enter)=\"onClick()\"\n (click)=\"onClick()\"\n #button\n >\n <ng-container *ngTemplateOutlet=\"buttonContent; context: { button: config }\"></ng-container>\n </div>\n }\n }\n}\n\n<ng-template #buttonContent let-button=\"button\">\n @if (button.imgSrc) {\n <div class=\"button-icon button-icon--img\">\n <m-img [src]=\"button.imgSrc\" [remote]=\"button.remote\" [alt]=\"button.label || button.name || ''\" />\n @if (button.badge && button.badge.count) {\n <m-badge\n [config]=\"{ variant: button.badge.variant ?? 'danger', position: 'absolute' }\"\n >{{ formatBadgeCount(button.badge.count) }}</m-badge\n >\n }\n </div>\n } @else if (buttonIcon(); as icon) {\n <div class=\"button-icon\">\n @if (isFromOne()) {\n <m-one-icon [config]=\"icon\" />\n } @else {\n <m-icon [config]=\"icon\" />\n }\n @if (button.badge && button.badge.count) {\n <m-badge\n [config]=\"{ variant: button.badge.variant ?? 'danger', position: 'absolute' }\"\n >{{ formatBadgeCount(button.badge.count) }}</m-badge\n >\n }\n </div>\n }\n @if (button.label && !button.iconOnly) {\n <span class=\"button-label {{ button.labelClass || '' }}\">\n {{ button.noTranslate ? button.label : (button.label | translate: button.params) }}\n </span>\n }\n @if (!buttonIcon() && button.badge && button.badge.count) {\n <m-badge [config]=\"{ variant: button.badge.variant ?? 'danger', position: 'static' }\">{{\n formatBadgeCount(button.badge.count)\n }}</m-badge>\n }\n</ng-template>\n", styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}:host{display:inline-flex;align-items:center;justify-content:center;vertical-align:middle;box-sizing:border-box;overflow:hidden;transition:box-shadow .15s ease;--m-btn-size: var(--m-button-size, 1em);--m-btn-color: var(--m-button-color, var(--m-one-button-color, var(--m-mm)));--m-btn-color-contrast: var(--m-button-color-contrast, var(--m-one-button-color-contrast, #ffffff));--m-btn-color-opposite: var(--m-button-color-opposite, var(--m-one-button-color-opposite, #e1b941));--m-btn-h: calc(var(--m-btn-size) * 2.25);width:var(--m-button-width, var(--m-one-button-width, auto));min-width:0;height:var(--m-btn-h);font-size:var(--m-btn-size)}:host-context(.inverse),:host-context(.tabs-inverse),:host.inverse{--m-btn-color: var(--m-button-color, var(--m-one-button-color, var(--m-inverse-text)))}:host:has(.full-width){display:flex;width:100%}:host:has(.full-width) button .button-label{white-space:normal;overflow:visible;text-overflow:clip;word-break:break-word}:host:has(.only-icon),:host:has(.toggle){width:var(--m-btn-h);min-width:var(--m-btn-h)}:host:has(.has-badge){overflow:visible}:host:has(.stacked),:host:has(.toggle){height:auto}button:not(.get):not(.toggle){height:calc(var(--input-size, var(--m-btn-size)) * 2);min-height:calc(var(--input-size, var(--m-btn-size)) * 2);border-width:max(1px,var(--input-size, var(--m-btn-size)) * .0625);border-radius:calc(var(--input-size, var(--m-btn-size)) * .4);padding:calc(var(--input-size, var(--m-btn-size)) * .5) calc(var(--input-size, var(--m-btn-size)) * .5);gap:calc(var(--input-size, var(--m-btn-size)) * .375);font-size:var(--input-size, var(--m-btn-size));border-color:var(--m-btn-color);transition:border-color .2s ease,box-shadow .2s ease,background-color .2s ease,opacity .2s ease}button:not(.get):not(.toggle):hover:not(:disabled){background-color:color-mix(in srgb,var(--m-btn-color) 6%,transparent)}button:not(.get):not(.toggle):disabled{opacity:.6;cursor:not-allowed}button:not(.get):not(.toggle){height:auto;padding:calc(var(--m-btn-size) * .625) calc(var(--m-btn-size) * 1.25);gap:calc(var(--m-btn-size) * .375);border-style:solid;display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;font-family:inherit;cursor:pointer;appearance:none;width:100%;height:100%;min-height:0;padding:0 calc(var(--m-btn-size) * 1.25);border-width:var(--m-button-border-width, 1px);border-radius:var(--m-button-radius, calc(var(--m-btn-size) * .5));color:var(--m-btn-color);font-weight:300;line-height:1;-webkit-user-select:none;user-select:none;position:relative;outline:none;box-shadow:var(--m-button-shadow, var(--m-one-button-shadow, none));transition:filter .15s ease,background .15s ease}button:not(.get):not(.toggle):hover:not(:disabled){filter:brightness(1.04)}button:not(.get):not(.toggle):focus-visible:not(:disabled){outline:2px solid color-mix(in srgb,var(--m-focus) 45%,transparent);outline-offset:-2px}button:not(.get):not(.toggle):active:not(:disabled){transform:scale(.97)}button:not(.get):not(.toggle):disabled{opacity:.35;cursor:not-allowed;pointer-events:none;filter:grayscale(80%)}button:not(.get):not(.toggle).read-only{pointer-events:none!important;cursor:default!important;transform:none!important;box-shadow:none!important;background:transparent!important;border-color:transparent!important;opacity:1!important}button:not(.get):not(.toggle).read-only .button-icon{transform:none!important;color:inherit!important}button:not(.get):not(.toggle).primary{background:var(--m-btn-color);border-color:var(--m-btn-color);color:var(--m-btn-color-contrast)}button:not(.get):not(.toggle).primary:hover:not(:disabled){filter:none;background:color-mix(in srgb,var(--m-btn-color) 88%,black);border-color:color-mix(in srgb,var(--m-btn-color) 88%,black)}button:not(.get):not(.toggle).primary:active:not(:disabled){filter:brightness(.94);transform:scale(.97)}button:not(.get):not(.toggle).ghost:not(.primary):not(.tab){background:transparent;border-color:transparent;color:var(--m-btn-color);box-shadow:none}button:not(.get):not(.toggle).ghost:not(.primary):not(.tab):hover:not(:disabled){filter:none;background:color-mix(in srgb,var(--m-btn-color) 8%,transparent)}button:not(.get):not(.toggle).ghost:not(.primary):not(.tab):active:not(:disabled){background:color-mix(in srgb,var(--m-btn-color) 14%,transparent);transform:scale(.97)}button:not(.get):not(.toggle).ghost:not(.primary):not(.tab).secondary{border:var(--m-button-border-width, 1px) solid color-mix(in srgb,var(--m-btn-color) 15%,transparent)}button:not(.get):not(.toggle).ghost:not(.primary):not(.tab).secondary:hover:not(:disabled){filter:none;border-color:color-mix(in srgb,var(--m-btn-color) 40%,transparent);background:color-mix(in srgb,var(--m-btn-color) 6%,transparent)}button:not(.get):not(.toggle).ghost:not(.primary):not(.tab).secondary:active:not(:disabled){border-color:color-mix(in srgb,var(--m-btn-color) 50%,transparent);background:color-mix(in srgb,var(--m-btn-color) 12%,transparent)}button:not(.get):not(.toggle).secondary:not(.primary):not(.ghost){background:transparent;border-color:var(--m-btn-color);color:var(--m-btn-color)}button:not(.get):not(.toggle).secondary:not(.primary):not(.ghost):hover:not(:disabled){filter:none;background:color-mix(in srgb,var(--m-btn-color) 8%,transparent)}button:not(.get):not(.toggle).secondary:not(.primary):not(.ghost):active:not(:disabled){background:color-mix(in srgb,var(--m-btn-color) 14%,transparent);transform:scale(.97)}button:not(.get):not(.toggle).tab{background:var(--m-backdrop-border);border-color:var(--m-backdrop-border);color:var(--m-btn-color)}button:not(.get):not(.toggle).tab:hover:not(:disabled){background:color-mix(in srgb,var(--m-backdrop-border) 82%,black);border-color:color-mix(in srgb,var(--m-backdrop-border) 82%,black);filter:none}button:not(.get):not(.toggle).tab:active:not(:disabled){background:color-mix(in srgb,var(--m-backdrop-border) 70%,black);border-color:color-mix(in srgb,var(--m-backdrop-border) 70%,black);transform:scale(.97)}button:not(.get):not(.toggle).segmented .button-icon,button:not(.get):not(.toggle).badge-accent .button-icon,button:not(.get):not(.toggle).with-right-icon .button-icon{display:inline-flex;align-items:center;justify-content:center;color:var(--m-btn-color-opposite);order:1}button:not(.get):not(.toggle).segmented .button-label,button:not(.get):not(.toggle).badge-accent .button-label,button:not(.get):not(.toggle).with-right-icon .button-label{order:-1}button:not(.get):not(.toggle).segmented.primary .button-icon,button:not(.get):not(.toggle).badge-accent.primary .button-icon,button:not(.get):not(.toggle).with-right-icon.primary .button-icon{color:var(--m-btn-color-opposite)}button:not(.get):not(.toggle).with-left-icon .button-icon{order:-1}button:not(.get):not(.toggle).with-left-icon .button-label{order:1}button:not(.get):not(.toggle).stacked{flex-direction:column;gap:calc(var(--m-btn-size) * .3);height:auto;min-height:var(--m-btn-h);padding:calc(var(--m-btn-size) * .625) calc(var(--m-btn-size) * .875)}button:not(.get):not(.toggle).stacked .button-label{font-size:calc(var(--m-btn-size) * .8)}button:not(.get):not(.toggle).only-icon{padding:0;border-width:var(--m-button-border-width, 1px);aspect-ratio:1;display:inline-flex;align-items:center;justify-content:center}button:not(.get):not(.toggle).only-icon m-icon,button:not(.get):not(.toggle).only-icon m-one-icon{display:inline-flex}m-badge{--m-badge-height: 1.5em;--m-badge-min-width: 1.5em;--m-badge-padding: 0 .3em;--m-badge-gap: .1em}.button-label{display:inline-flex;align-items:center;line-height:normal;font-size:inherit;min-width:0;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.button-icon{position:relative;display:inline-flex;align-items:center;justify-content:center}.button-icon--img{width:calc(var(--m-btn-size) * 1.75);height:calc(var(--m-btn-size) * 1.75);overflow:hidden}.button-icon--img m-img{width:100%;height:100%;display:block}.get{appearance:none;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;height:var(--m-btn-h);padding:0 min(var(--m-btn-size) * 1.75,2rem);border-radius:4px;background:linear-gradient(135deg,var(--m-mm),var(--m-focus),var(--m-success),var(--m-mm));background-size:200% auto;color:#fff;font-size:calc(var(--m-btn-size) * .8);font-weight:300;letter-spacing:.06em;text-transform:uppercase;border:none;cursor:pointer;white-space:nowrap;line-height:1;transition:background-position .2s ease,transform .15s ease}.get:hover{background-position:right center}.get:focus-visible{outline:2px solid color-mix(in srgb,var(--m-focus) 45%,transparent);outline-offset:-2px}.get:active{transform:scale(.97)}.toggle{appearance:none;display:inline-flex;align-items:center;justify-content:center;width:100%;height:100%;border:none;background:transparent;padding:0 min(var(--m-btn-size),1.25rem);border-radius:var(--m-button-radius, calc(var(--m-btn-size) * .375));box-shadow:none;color:var(--m-btn-color, var(--m-text-secondary));opacity:.65;font-family:inherit;font-size:var(--m-btn-size);font-weight:300;cursor:pointer;box-sizing:border-box;-webkit-user-select:none;user-select:none;transition:background .15s ease,color .15s ease,opacity .15s ease;min-width:0}.toggle .button-icon{flex-shrink:0}.toggle .button-label{display:inline-block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;min-width:0}.toggle:hover:not(:disabled){background:var(--m-button-hover-background, color-mix(in srgb, var(--m-focus) 8%, transparent));color:var(--m-button-hover-color, var(--m-text));opacity:1}.toggle:focus-visible:not(:disabled){outline:2px solid color-mix(in srgb,var(--m-focus) 45%,transparent);outline-offset:-2px;opacity:1}.toggle.primary{background:var(--m-button-active-background, var(--m-mm));color:var(--m-button-active-color, #ffffff);opacity:1}.toggle.primary:hover:not(:disabled){background:var(--m-button-active-background, var(--m-mm));color:var(--m-button-active-color, #ffffff);opacity:1}.toggle.primary:active:not(:disabled){transform:scale(.97)}.non-native:not(.get):not(.toggle){appearance:none;display:inline-flex;align-items:center;justify-content:center;width:100%;height:100%;min-height:0;padding:0 calc(var(--m-btn-size) * 1.25);border-width:2px;border-radius:4px;color:var(--m-btn-color);font-weight:300;line-height:1;-webkit-user-select:none;user-select:none;position:relative;outline:none;box-shadow:var(--m-button-shadow, var(--m-one-button-shadow, none));transition:filter .15s ease,background .15s ease}.non-native:not(.get):not(.toggle):hover:not([aria-disabled=true]){filter:brightness(1.04)}.non-native:not(.get):not(.toggle):focus-visible:not([aria-disabled=true]){outline:2px solid color-mix(in srgb,var(--m-focus) 45%,transparent);outline-offset:-2px}.non-native:not(.get):not(.toggle):active:not([aria-disabled=true]){transform:scale(.97)}.non-native:not(.get):not(.toggle)[aria-disabled=true]{opacity:.35;cursor:not-allowed;pointer-events:none;filter:grayscale(80%)}.non-native:not(.get):not(.toggle).primary{background:var(--m-btn-color);border-color:var(--m-btn-color);color:var(--m-btn-color-contrast)}.non-native:not(.get):not(.toggle).primary:hover:not([aria-disabled=true]){filter:none;background:color-mix(in srgb,var(--m-btn-color) 88%,black);border-color:color-mix(in srgb,var(--m-btn-color) 88%,black)}.non-native:not(.get):not(.toggle).primary:active:not([aria-disabled=true]){filter:brightness(.94);transform:scale(.97)}.non-native:not(.get):not(.toggle).ghost:not(.primary):not(.tab){background:transparent;border-color:transparent;color:var(--m-btn-color);box-shadow:none}.non-native:not(.get):not(.toggle).ghost:not(.primary):not(.tab):hover:not([aria-disabled=true]){filter:none;background:color-mix(in srgb,var(--m-btn-color) 8%,transparent)}.non-native:not(.get):not(.toggle).ghost:not(.primary):not(.tab):active:not([aria-disabled=true]){background:color-mix(in srgb,var(--m-btn-color) 14%,transparent);transform:scale(.97)}.non-native:not(.get):not(.toggle):disabled{opacity:.3;cursor:not-allowed}@container togglegroup (max-width: 320px){.non-native:not(.get):not(.toggle).with-left-icon .button-label,.non-native:not(.get):not(.toggle).with-right-icon .button-label{display:none!important}}@media(max-width:600px){.non-native:not(.get):not(.toggle).with-left-icon .button-label,.non-native:not(.get):not(.toggle).with-right-icon .button-label{display:none!important}}\n"] }]
|
|
7556
|
+
}], ctorParameters: () => [], propDecorators: { config: [{ type: i0.Input, args: [{ isSignal: true, alias: "config", required: false }] }, { type: i0.Output, args: ["configChange"] }], color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }], labelClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelClass", required: false }] }], fullWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "fullWidth", required: false }] }], nav: [{ type: i0.Input, args: [{ isSignal: true, alias: "nav", required: false }] }], navParams: [{ type: i0.Input, args: [{ isSignal: true, alias: "navParams", required: false }] }], href: [{ type: i0.Input, args: [{ isSignal: true, alias: "href", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: false }] }], baseUrl: [{ type: i0.Input, args: [{ isSignal: true, alias: "baseUrl", required: false }] }], one: [{ type: i0.Input, args: [{ isSignal: true, alias: "one", required: false }] }], remote: [{ type: i0.Input, args: [{ isSignal: true, alias: "remote", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], noTranslate: [{ type: i0.Input, args: [{ isSignal: true, alias: "noTranslate", required: false }] }], params: [{ type: i0.Input, args: [{ isSignal: true, alias: "params", required: false }] }], noNative: [{ type: i0.Input, args: [{ isSignal: true, alias: "noNative", required: false }] }], icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], isRightIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "isRightIcon", required: false }] }], iconOnly: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconOnly", required: false }] }], stacked: [{ type: i0.Input, args: [{ isSignal: true, alias: "stacked", required: false }] }], imgSrc: [{ type: i0.Input, args: [{ isSignal: true, alias: "imgSrc", required: false }] }], nonClickable: [{ type: i0.Input, args: [{ isSignal: true, alias: "nonClickable", required: false }] }], inverted: [{ type: i0.Input, args: [{ isSignal: true, alias: "inverted", required: false }] }], isSubmit: [{ type: i0.Input, args: [{ isSignal: true, alias: "isSubmit", required: false }] }], tabindex: [{ type: i0.Input, args: [{ isSignal: true, alias: "tabindex", required: false }] }], clicked: [{ type: i0.Output, args: ["clicked"] }], button: [{ type: i0.ViewChild, args: ['button', { isSignal: true }] }] } });
|
|
7557
|
+
|
|
7558
|
+
let HeaderComponent$1 = class HeaderComponent {
|
|
7559
|
+
level = input(3, ...(ngDevMode ? [{ debugName: "level" }] : /* istanbul ignore next */ []));
|
|
7560
|
+
label = input(...(ngDevMode ? [undefined, { debugName: "label" }] : /* istanbul ignore next */ []));
|
|
7561
|
+
// Drawn inside the heading rather than beside it. A glyph placed as the
|
|
7562
|
+
// heading's sibling has no line box of its own to centre against — it ends
|
|
7563
|
+
// up centred on whatever column it sits next to, which is how a Canvas
|
|
7564
|
+
// header's icon came to line up with the label slot's drop rect instead of
|
|
7565
|
+
// with the label. Inside, the two share one line box at every level.
|
|
7566
|
+
icon = input(...(ngDevMode ? [undefined, { debugName: "icon" }] : /* istanbul ignore next */ []));
|
|
7567
|
+
actionButton = input(...(ngDevMode ? [undefined, { debugName: "actionButton" }] : /* istanbul ignore next */ []));
|
|
7568
|
+
// The action Button's accessible name. It renders icon-only, so the label is
|
|
7569
|
+
// the only thing a screen reader has to go on — without it the button reads
|
|
7570
|
+
// as nothing at all.
|
|
7571
|
+
actionLabel = input(...(ngDevMode ? [undefined, { debugName: "actionLabel" }] : /* istanbul ignore next */ []));
|
|
7572
|
+
// The label is authored text rather than a translation key. Needed for text
|
|
7573
|
+
// carrying angle brackets above all: `translate` reads `<...>` as link
|
|
7574
|
+
// markup, so a heading naming a MessageVariable — `<$app>` — resolves to
|
|
7575
|
+
// nothing at all rather than to itself.
|
|
7576
|
+
noTranslate = input(false, ...(ngDevMode ? [{ debugName: "noTranslate" }] : /* istanbul ignore next */ []));
|
|
7577
|
+
// A message's [MessageVariable] values, the same record `m-text-output`
|
|
7578
|
+
// takes: a heading naming `<$count>` is a sentence with a datum in it, and
|
|
7579
|
+
// splicing that datum into the key instead would be parsed as a query
|
|
7580
|
+
// string (m-one-ui ADR 0066).
|
|
7581
|
+
params = input(undefined, ...(ngDevMode ? [{ debugName: "params" }] : /* istanbul ignore next */ []));
|
|
7582
|
+
actionClick = output();
|
|
7583
|
+
translateService = inject(TranslateService);
|
|
7584
|
+
sizeContext = inject(SIZE_CONTEXT, { optional: true });
|
|
7585
|
+
// The action Button sits inside the heading, whose font-size is the level's
|
|
7586
|
+
// own — 2.25rem at h1 — so `em` inheritance would scale the Button to the
|
|
7587
|
+
// heading rather than to the Section it belongs to. It reads the Size in
|
|
7588
|
+
// force instead, the way Icon does, and lands at the same size as every
|
|
7589
|
+
// other Button on that Section (ADR 0008).
|
|
7590
|
+
actionSize = computed(() => resolveSize(this.sizeContext?.size()), ...(ngDevMode ? [{ debugName: "actionSize" }] : /* istanbul ignore next */ []));
|
|
7591
|
+
actionConfig = computed(() => {
|
|
7592
|
+
const icon = this.actionButton();
|
|
7593
|
+
if (!icon)
|
|
7594
|
+
return undefined;
|
|
7595
|
+
return {
|
|
7596
|
+
icon,
|
|
7597
|
+
label: this.actionLabel(),
|
|
7598
|
+
iconOnly: true,
|
|
7599
|
+
variant: 'ghost',
|
|
7600
|
+
};
|
|
7601
|
+
}, ...(ngDevMode ? [{ debugName: "actionConfig" }] : /* istanbul ignore next */ []));
|
|
7602
|
+
// A computed rather than the impure TranslatePipe repeated six times: one
|
|
7603
|
+
// lookup per label change instead of one per change-detection tick, and it
|
|
7604
|
+
// still repaints when the language or an in-memory translation moves.
|
|
7605
|
+
text = computed(() => this.noTranslate()
|
|
7606
|
+
? (this.label() ?? '')
|
|
7607
|
+
: this.translateService.translate(this.label(), this.params()), ...(ngDevMode ? [{ debugName: "text" }] : /* istanbul ignore next */ []));
|
|
7608
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: HeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
7609
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: HeaderComponent, isStandalone: true, selector: "m-header", inputs: { level: { classPropertyName: "level", publicName: "level", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, actionButton: { classPropertyName: "actionButton", publicName: "actionButton", isSignal: true, isRequired: false, transformFunction: null }, actionLabel: { classPropertyName: "actionLabel", publicName: "actionLabel", isSignal: true, isRequired: false, transformFunction: null }, noTranslate: { classPropertyName: "noTranslate", publicName: "noTranslate", isSignal: true, isRequired: false, transformFunction: null }, params: { classPropertyName: "params", publicName: "params", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { actionClick: "actionClick" }, ngImport: i0, template: `
|
|
7610
|
+
@switch (level()) {
|
|
7611
|
+
@case (1) {
|
|
7612
|
+
<h1 class="header__heading">
|
|
7613
|
+
@if (icon(); as iconName) {
|
|
7614
|
+
<m-icon class="header__icon" [name]="iconName" />
|
|
7615
|
+
}
|
|
7616
|
+
<span>{{ text() }}</span>
|
|
7617
|
+
<ng-content />
|
|
7618
|
+
@if (actionConfig(); as action) {
|
|
7619
|
+
<m-button class="header__action" [config]="action" [style.--m-button-size]="actionSize()" (clicked)="actionClick.emit()" />
|
|
7620
|
+
}
|
|
7621
|
+
</h1>
|
|
7622
|
+
}
|
|
7623
|
+
@case (2) {
|
|
7624
|
+
<h2 class="header__heading">
|
|
7625
|
+
@if (icon(); as iconName) {
|
|
7626
|
+
<m-icon class="header__icon" [name]="iconName" />
|
|
7627
|
+
}
|
|
7628
|
+
<span>{{ text() }}</span>
|
|
7629
|
+
<ng-content />
|
|
7630
|
+
@if (actionConfig(); as action) {
|
|
7631
|
+
<m-button class="header__action" [config]="action" [style.--m-button-size]="actionSize()" (clicked)="actionClick.emit()" />
|
|
7632
|
+
}
|
|
7633
|
+
</h2>
|
|
7634
|
+
}
|
|
7635
|
+
@case (3) {
|
|
7636
|
+
<h3 class="header__heading">
|
|
7637
|
+
@if (icon(); as iconName) {
|
|
7638
|
+
<m-icon class="header__icon" [name]="iconName" />
|
|
7639
|
+
}
|
|
7640
|
+
<span>{{ text() }}</span>
|
|
7641
|
+
<ng-content />
|
|
7642
|
+
@if (actionConfig(); as action) {
|
|
7643
|
+
<m-button class="header__action" [config]="action" [style.--m-button-size]="actionSize()" (clicked)="actionClick.emit()" />
|
|
7644
|
+
}
|
|
7645
|
+
</h3>
|
|
7646
|
+
}
|
|
7647
|
+
@case (4) {
|
|
7648
|
+
<h4 class="header__heading">
|
|
7649
|
+
@if (icon(); as iconName) {
|
|
7650
|
+
<m-icon class="header__icon" [name]="iconName" />
|
|
7651
|
+
}
|
|
7652
|
+
<span>{{ text() }}</span>
|
|
7653
|
+
<ng-content />
|
|
7654
|
+
@if (actionConfig(); as action) {
|
|
7655
|
+
<m-button class="header__action" [config]="action" [style.--m-button-size]="actionSize()" (clicked)="actionClick.emit()" />
|
|
7656
|
+
}
|
|
7657
|
+
</h4>
|
|
7658
|
+
}
|
|
7659
|
+
@case (5) {
|
|
7660
|
+
<h5 class="header__heading">
|
|
7661
|
+
@if (icon(); as iconName) {
|
|
7662
|
+
<m-icon class="header__icon" [name]="iconName" />
|
|
7663
|
+
}
|
|
7664
|
+
<span>{{ text() }}</span>
|
|
7665
|
+
<ng-content />
|
|
7666
|
+
@if (actionConfig(); as action) {
|
|
7667
|
+
<m-button class="header__action" [config]="action" [style.--m-button-size]="actionSize()" (clicked)="actionClick.emit()" />
|
|
7668
|
+
}
|
|
7669
|
+
</h5>
|
|
7670
|
+
}
|
|
7671
|
+
@case (6) {
|
|
7672
|
+
<h6 class="header__heading">
|
|
7673
|
+
@if (icon(); as iconName) {
|
|
7674
|
+
<m-icon class="header__icon" [name]="iconName" />
|
|
7675
|
+
}
|
|
7676
|
+
<span>{{ text() }}</span>
|
|
7677
|
+
<ng-content />
|
|
7678
|
+
@if (actionConfig(); as action) {
|
|
7679
|
+
<m-button class="header__action" [config]="action" [style.--m-button-size]="actionSize()" (clicked)="actionClick.emit()" />
|
|
7680
|
+
}
|
|
7681
|
+
</h6>
|
|
7682
|
+
}
|
|
7683
|
+
}
|
|
7684
|
+
`, isInline: true, styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}.header__heading{display:flex;flex-direction:row;align-items:center;justify-content:var(--m-header-justify, flex-start);gap:.75rem;margin:0;padding:0;line-height:1.1;font-weight:800;letter-spacing:-.025em;color:var(--m-header-color, var(--m-text));transition:transform .2s cubic-bezier(.4,0,.2,1)}.header__heading:hover{transform:translate(2px)}.header__icon{flex-shrink:0}.header__action{margin-left:auto}.header__action span{display:inline-block;vertical-align:middle}h1.header__heading{font-size:var(--m-header-font-size, 2.25rem);font-weight:300;color:var(--m-text-quaternary);letter-spacing:-.035em;line-height:1.15}h2.header__heading{font-size:var(--m-header-font-size, 1.75rem);font-weight:300;color:var(--m-text-tertiary);letter-spacing:-.03em;line-height:1.2}h3.header__heading{font-size:var(--m-header-font-size, 1.375rem);font-weight:400;color:var(--m-text-secondary);letter-spacing:-.025em}h4.header__heading{font-size:var(--m-header-font-size, 1.125rem);font-weight:500;color:var(--m-text);letter-spacing:-.02em}h5.header__heading{font-size:var(--m-header-font-size, 1rem);font-weight:600;color:var(--m-text);letter-spacing:-.01em}h6.header__heading{font-size:var(--m-header-font-size, .875rem);font-weight:600;color:var(--m-text);letter-spacing:.05em;text-transform:uppercase}\n"], dependencies: [{ kind: "component", type: ButtonComponent, selector: "m-button,m-one-button", inputs: ["config", "color", "labelClass", "fullWidth", "nav", "navParams", "href", "disabled", "variant", "name", "baseUrl", "one", "remote", "label", "noTranslate", "params", "noNative", "icon", "isRightIcon", "iconOnly", "stacked", "imgSrc", "nonClickable", "inverted", "isSubmit", "tabindex"], outputs: ["configChange", "clicked"] }, { kind: "component", type: IconComponent, selector: "m-icon, m-one-icon", inputs: ["config", "name", "color", "size", "one", "baseUrl", "remote"], outputs: ["configChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
7685
|
+
};
|
|
7686
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: HeaderComponent$1, decorators: [{
|
|
7687
|
+
type: Component,
|
|
7688
|
+
args: [{ selector: 'm-header', imports: [ButtonComponent, IconComponent], template: `
|
|
7689
|
+
@switch (level()) {
|
|
7690
|
+
@case (1) {
|
|
7691
|
+
<h1 class="header__heading">
|
|
7692
|
+
@if (icon(); as iconName) {
|
|
7693
|
+
<m-icon class="header__icon" [name]="iconName" />
|
|
7694
|
+
}
|
|
7695
|
+
<span>{{ text() }}</span>
|
|
7696
|
+
<ng-content />
|
|
7697
|
+
@if (actionConfig(); as action) {
|
|
7698
|
+
<m-button class="header__action" [config]="action" [style.--m-button-size]="actionSize()" (clicked)="actionClick.emit()" />
|
|
7699
|
+
}
|
|
7700
|
+
</h1>
|
|
7701
|
+
}
|
|
7702
|
+
@case (2) {
|
|
7703
|
+
<h2 class="header__heading">
|
|
7704
|
+
@if (icon(); as iconName) {
|
|
7705
|
+
<m-icon class="header__icon" [name]="iconName" />
|
|
7706
|
+
}
|
|
7707
|
+
<span>{{ text() }}</span>
|
|
7708
|
+
<ng-content />
|
|
7709
|
+
@if (actionConfig(); as action) {
|
|
7710
|
+
<m-button class="header__action" [config]="action" [style.--m-button-size]="actionSize()" (clicked)="actionClick.emit()" />
|
|
7711
|
+
}
|
|
7712
|
+
</h2>
|
|
7713
|
+
}
|
|
7714
|
+
@case (3) {
|
|
7715
|
+
<h3 class="header__heading">
|
|
7716
|
+
@if (icon(); as iconName) {
|
|
7717
|
+
<m-icon class="header__icon" [name]="iconName" />
|
|
7718
|
+
}
|
|
7719
|
+
<span>{{ text() }}</span>
|
|
7720
|
+
<ng-content />
|
|
7721
|
+
@if (actionConfig(); as action) {
|
|
7722
|
+
<m-button class="header__action" [config]="action" [style.--m-button-size]="actionSize()" (clicked)="actionClick.emit()" />
|
|
7723
|
+
}
|
|
7724
|
+
</h3>
|
|
7725
|
+
}
|
|
7726
|
+
@case (4) {
|
|
7727
|
+
<h4 class="header__heading">
|
|
7728
|
+
@if (icon(); as iconName) {
|
|
7729
|
+
<m-icon class="header__icon" [name]="iconName" />
|
|
7730
|
+
}
|
|
7731
|
+
<span>{{ text() }}</span>
|
|
7732
|
+
<ng-content />
|
|
7733
|
+
@if (actionConfig(); as action) {
|
|
7734
|
+
<m-button class="header__action" [config]="action" [style.--m-button-size]="actionSize()" (clicked)="actionClick.emit()" />
|
|
7735
|
+
}
|
|
7736
|
+
</h4>
|
|
7737
|
+
}
|
|
7738
|
+
@case (5) {
|
|
7739
|
+
<h5 class="header__heading">
|
|
7740
|
+
@if (icon(); as iconName) {
|
|
7741
|
+
<m-icon class="header__icon" [name]="iconName" />
|
|
7742
|
+
}
|
|
7743
|
+
<span>{{ text() }}</span>
|
|
7744
|
+
<ng-content />
|
|
7745
|
+
@if (actionConfig(); as action) {
|
|
7746
|
+
<m-button class="header__action" [config]="action" [style.--m-button-size]="actionSize()" (clicked)="actionClick.emit()" />
|
|
7747
|
+
}
|
|
7748
|
+
</h5>
|
|
7749
|
+
}
|
|
7750
|
+
@case (6) {
|
|
7751
|
+
<h6 class="header__heading">
|
|
7752
|
+
@if (icon(); as iconName) {
|
|
7753
|
+
<m-icon class="header__icon" [name]="iconName" />
|
|
7754
|
+
}
|
|
7755
|
+
<span>{{ text() }}</span>
|
|
7756
|
+
<ng-content />
|
|
7757
|
+
@if (actionConfig(); as action) {
|
|
7758
|
+
<m-button class="header__action" [config]="action" [style.--m-button-size]="actionSize()" (clicked)="actionClick.emit()" />
|
|
7759
|
+
}
|
|
7760
|
+
</h6>
|
|
7761
|
+
}
|
|
7762
|
+
}
|
|
7763
|
+
`, changeDetection: ChangeDetectionStrategy.OnPush, styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}.header__heading{display:flex;flex-direction:row;align-items:center;justify-content:var(--m-header-justify, flex-start);gap:.75rem;margin:0;padding:0;line-height:1.1;font-weight:800;letter-spacing:-.025em;color:var(--m-header-color, var(--m-text));transition:transform .2s cubic-bezier(.4,0,.2,1)}.header__heading:hover{transform:translate(2px)}.header__icon{flex-shrink:0}.header__action{margin-left:auto}.header__action span{display:inline-block;vertical-align:middle}h1.header__heading{font-size:var(--m-header-font-size, 2.25rem);font-weight:300;color:var(--m-text-quaternary);letter-spacing:-.035em;line-height:1.15}h2.header__heading{font-size:var(--m-header-font-size, 1.75rem);font-weight:300;color:var(--m-text-tertiary);letter-spacing:-.03em;line-height:1.2}h3.header__heading{font-size:var(--m-header-font-size, 1.375rem);font-weight:400;color:var(--m-text-secondary);letter-spacing:-.025em}h4.header__heading{font-size:var(--m-header-font-size, 1.125rem);font-weight:500;color:var(--m-text);letter-spacing:-.02em}h5.header__heading{font-size:var(--m-header-font-size, 1rem);font-weight:600;color:var(--m-text);letter-spacing:-.01em}h6.header__heading{font-size:var(--m-header-font-size, .875rem);font-weight:600;color:var(--m-text);letter-spacing:.05em;text-transform:uppercase}\n"] }]
|
|
7764
|
+
}], propDecorators: { level: [{ type: i0.Input, args: [{ isSignal: true, alias: "level", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], actionButton: [{ type: i0.Input, args: [{ isSignal: true, alias: "actionButton", required: false }] }], actionLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "actionLabel", required: false }] }], noTranslate: [{ type: i0.Input, args: [{ isSignal: true, alias: "noTranslate", required: false }] }], params: [{ type: i0.Input, args: [{ isSignal: true, alias: "params", required: false }] }], actionClick: [{ type: i0.Output, args: ["actionClick"] }] } });
|
|
7765
|
+
|
|
7766
|
+
/**
|
|
7767
|
+
* Asks the user to agree to every Declared Permission of an App at once — no
|
|
7768
|
+
* subset (store ADR 0006). Closes `true` on agreement and `false` on the other
|
|
7769
|
+
* button, which is Cancel or, when the App cannot open without it, Back to
|
|
7770
|
+
* Store.
|
|
7771
|
+
*/
|
|
7772
|
+
class AgreementComponent {
|
|
7773
|
+
header = input('', ...(ngDevMode ? [{ debugName: "header" }] : /* istanbul ignore next */ []));
|
|
7774
|
+
params = input({}, ...(ngDevMode ? [{ debugName: "params" }] : /* istanbul ignore next */ []));
|
|
7775
|
+
permissions = input([], ...(ngDevMode ? [{ debugName: "permissions" }] : /* istanbul ignore next */ []));
|
|
7776
|
+
confirmLabel = input('agree', ...(ngDevMode ? [{ debugName: "confirmLabel" }] : /* istanbul ignore next */ []));
|
|
7777
|
+
cancelLabel = input('cancel', ...(ngDevMode ? [{ debugName: "cancelLabel" }] : /* istanbul ignore next */ []));
|
|
7778
|
+
#modalRef = inject(MODAL_REF);
|
|
7779
|
+
accept() {
|
|
7780
|
+
this.#modalRef.close(true);
|
|
7781
|
+
}
|
|
7782
|
+
decline() {
|
|
7783
|
+
this.#modalRef.close(false);
|
|
7784
|
+
}
|
|
7785
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AgreementComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
7786
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AgreementComponent, isStandalone: true, selector: "m-agreement", inputs: { header: { classPropertyName: "header", publicName: "header", isSignal: true, isRequired: false, transformFunction: null }, params: { classPropertyName: "params", publicName: "params", isSignal: true, isRequired: false, transformFunction: null }, permissions: { classPropertyName: "permissions", publicName: "permissions", isSignal: true, isRequired: false, transformFunction: null }, confirmLabel: { classPropertyName: "confirmLabel", publicName: "confirmLabel", isSignal: true, isRequired: false, transformFunction: null }, cancelLabel: { classPropertyName: "cancelLabel", publicName: "cancelLabel", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: `
|
|
7787
|
+
<div class="agreement">
|
|
7788
|
+
<div class="agreement__header">
|
|
7789
|
+
<m-header [level]="3" [label]="header()" [params]="params()" />
|
|
7790
|
+
<p class="agreement__body">{{ 'agreement-body' | translate }}</p>
|
|
7791
|
+
</div>
|
|
7792
|
+
|
|
7793
|
+
<ul class="agreement__list">
|
|
7794
|
+
@for (permission of permissions(); track permission.id) {
|
|
7795
|
+
<li class="agreement__item">
|
|
7796
|
+
<span class="agreement__icon"><m-icon [name]="permission.icon" /></span>
|
|
7797
|
+
<span class="agreement__text">
|
|
7798
|
+
<span class="agreement__name">{{ permission.nameKey | translate }}</span>
|
|
7799
|
+
<span class="agreement__description">{{
|
|
7800
|
+
permission.descriptionKey | translate
|
|
7801
|
+
}}</span>
|
|
7802
|
+
</span>
|
|
7803
|
+
</li>
|
|
7804
|
+
}
|
|
7805
|
+
</ul>
|
|
7806
|
+
|
|
7807
|
+
<div class="agreement__actions">
|
|
7808
|
+
<!-- asset: buttons/confirm_cancel.yml -->
|
|
7809
|
+
<m-one-button name="confirm_cancel" [label]="cancelLabel()" (clicked)="decline()" />
|
|
7810
|
+
<!-- asset: buttons/okay.yml -->
|
|
7811
|
+
<m-one-button name="okay" [label]="confirmLabel()" (clicked)="accept()" />
|
|
7812
|
+
</div>
|
|
7813
|
+
</div>
|
|
7814
|
+
`, isInline: true, styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}.agreement{display:flex;flex-direction:column;min-width:320px;max-width:480px;padding:2.5rem;background:var(--m-backdrop-modal, rgba(255, 255, 255, .85));backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}.agreement__header{display:flex;flex-direction:column;align-items:center;text-align:center;gap:.9375rem;margin-bottom:1.5rem}.agreement__body{margin:0;font-size:1rem;line-height:1.6;color:var(--m-text-600)}.agreement__list{list-style:none;margin:0 0 2rem;padding:0;display:flex;flex-direction:column;gap:1rem}.agreement__item{display:flex;align-items:flex-start;gap:1rem}.agreement__icon{flex:0 0 40px;height:40px;display:flex;align-items:center;justify-content:center;border-radius:12px;background:var(--m-backdrop-mm, rgba(65, 105, 225, .1));color:var(--m-mm, #4169e1)}.agreement__text{display:flex;flex-direction:column;gap:.25rem}.agreement__name{font-weight:600;color:var(--m-text-900)}.agreement__description{font-size:.875rem;color:var(--m-text-600)}.agreement__actions{width:100%;display:flex;justify-content:center;gap:1rem}\n"], dependencies: [{ kind: "component", type: ButtonComponent, selector: "m-button,m-one-button", inputs: ["config", "color", "labelClass", "fullWidth", "nav", "navParams", "href", "disabled", "variant", "name", "baseUrl", "one", "remote", "label", "noTranslate", "params", "noNative", "icon", "isRightIcon", "iconOnly", "stacked", "imgSrc", "nonClickable", "inverted", "isSubmit", "tabindex"], outputs: ["configChange", "clicked"] }, { kind: "component", type: IconComponent, selector: "m-icon, m-one-icon", inputs: ["config", "name", "color", "size", "one", "baseUrl", "remote"], outputs: ["configChange"] }, { kind: "component", type: HeaderComponent$1, selector: "m-header", inputs: ["level", "label", "icon", "actionButton", "actionLabel", "noTranslate", "params"], outputs: ["actionClick"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
7815
|
+
}
|
|
7816
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AgreementComponent, decorators: [{
|
|
7817
|
+
type: Component,
|
|
7818
|
+
args: [{ selector: 'm-agreement', imports: [ButtonComponent, IconComponent, TranslatePipe, HeaderComponent$1], template: `
|
|
7819
|
+
<div class="agreement">
|
|
7820
|
+
<div class="agreement__header">
|
|
7821
|
+
<m-header [level]="3" [label]="header()" [params]="params()" />
|
|
7822
|
+
<p class="agreement__body">{{ 'agreement-body' | translate }}</p>
|
|
7823
|
+
</div>
|
|
7824
|
+
|
|
7825
|
+
<ul class="agreement__list">
|
|
7826
|
+
@for (permission of permissions(); track permission.id) {
|
|
7827
|
+
<li class="agreement__item">
|
|
7828
|
+
<span class="agreement__icon"><m-icon [name]="permission.icon" /></span>
|
|
7829
|
+
<span class="agreement__text">
|
|
7830
|
+
<span class="agreement__name">{{ permission.nameKey | translate }}</span>
|
|
7831
|
+
<span class="agreement__description">{{
|
|
7832
|
+
permission.descriptionKey | translate
|
|
7833
|
+
}}</span>
|
|
7834
|
+
</span>
|
|
7835
|
+
</li>
|
|
7836
|
+
}
|
|
7837
|
+
</ul>
|
|
7838
|
+
|
|
7839
|
+
<div class="agreement__actions">
|
|
7840
|
+
<!-- asset: buttons/confirm_cancel.yml -->
|
|
7841
|
+
<m-one-button name="confirm_cancel" [label]="cancelLabel()" (clicked)="decline()" />
|
|
7842
|
+
<!-- asset: buttons/okay.yml -->
|
|
7843
|
+
<m-one-button name="okay" [label]="confirmLabel()" (clicked)="accept()" />
|
|
7844
|
+
</div>
|
|
7845
|
+
</div>
|
|
7846
|
+
`, changeDetection: ChangeDetectionStrategy.OnPush, styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}.agreement{display:flex;flex-direction:column;min-width:320px;max-width:480px;padding:2.5rem;background:var(--m-backdrop-modal, rgba(255, 255, 255, .85));backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}.agreement__header{display:flex;flex-direction:column;align-items:center;text-align:center;gap:.9375rem;margin-bottom:1.5rem}.agreement__body{margin:0;font-size:1rem;line-height:1.6;color:var(--m-text-600)}.agreement__list{list-style:none;margin:0 0 2rem;padding:0;display:flex;flex-direction:column;gap:1rem}.agreement__item{display:flex;align-items:flex-start;gap:1rem}.agreement__icon{flex:0 0 40px;height:40px;display:flex;align-items:center;justify-content:center;border-radius:12px;background:var(--m-backdrop-mm, rgba(65, 105, 225, .1));color:var(--m-mm, #4169e1)}.agreement__text{display:flex;flex-direction:column;gap:.25rem}.agreement__name{font-weight:600;color:var(--m-text-900)}.agreement__description{font-size:.875rem;color:var(--m-text-600)}.agreement__actions{width:100%;display:flex;justify-content:center;gap:1rem}\n"] }]
|
|
7847
|
+
}], propDecorators: { header: [{ type: i0.Input, args: [{ isSignal: true, alias: "header", required: false }] }], params: [{ type: i0.Input, args: [{ isSignal: true, alias: "params", required: false }] }], permissions: [{ type: i0.Input, args: [{ isSignal: true, alias: "permissions", required: false }] }], confirmLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "confirmLabel", required: false }] }], cancelLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "cancelLabel", required: false }] }] } });
|
|
7848
|
+
|
|
7849
|
+
// One modal per App at a time: init and every refused api call of the same
|
|
7850
|
+
// App wait on the same answer instead of stacking modals.
|
|
7851
|
+
const pending = new Map();
|
|
7852
|
+
/**
|
|
7853
|
+
* Asks the user to agree to every Declared Permission of an App (store ADR
|
|
7854
|
+
* 0006) and records it with `POST store/app/<id>/permission`. `hardStop` is
|
|
7855
|
+
* the init gate: the modal cannot be dismissed, and its other button leaves
|
|
7856
|
+
* for the Store.
|
|
7857
|
+
*/
|
|
7858
|
+
function injectAgreeToApp() {
|
|
7859
|
+
const modalStore = inject(ModalStore);
|
|
7860
|
+
const httpService = inject(HttpService);
|
|
7861
|
+
return (app, permissions, hardStop = false) => {
|
|
7862
|
+
const appId = app.id ?? '';
|
|
7863
|
+
const existing = pending.get(appId);
|
|
7864
|
+
if (existing)
|
|
7865
|
+
return existing;
|
|
7866
|
+
const appName = app.name ?? app.link ?? '';
|
|
7867
|
+
const answer = new Promise((resolve, reject) => {
|
|
7868
|
+
const modalRef = new ModalRef();
|
|
7869
|
+
const id = modalStore.open({
|
|
7870
|
+
component: AgreementComponent,
|
|
7871
|
+
providers: [{ provide: MODAL_REF, useValue: modalRef }],
|
|
7872
|
+
bindings: [
|
|
7873
|
+
inputBinding('header', () => `agreement_title?appName=${appName}`),
|
|
7874
|
+
inputBinding('permissions', () => permissions),
|
|
7875
|
+
inputBinding('cancelLabel', () => (hardStop ? 'back-to-store' : 'cancel')),
|
|
7876
|
+
],
|
|
7877
|
+
config: hardStop ? { closeProhibited: true, backdropClose: false } : undefined,
|
|
7878
|
+
});
|
|
7879
|
+
modalRef.onClose(async (agreed) => {
|
|
7880
|
+
modalStore.close(id);
|
|
7881
|
+
if (!agreed) {
|
|
7882
|
+
reject({
|
|
7883
|
+
type: hardStop ? 'back_to_store' : 'agreement_declined',
|
|
7884
|
+
});
|
|
7885
|
+
return;
|
|
7886
|
+
}
|
|
7887
|
+
try {
|
|
7888
|
+
await firstValueFrom(httpService.post('store', ['app', appId, 'permission'], {}));
|
|
7889
|
+
resolve();
|
|
7890
|
+
}
|
|
7891
|
+
catch (e) {
|
|
7892
|
+
reject(e);
|
|
7893
|
+
}
|
|
7894
|
+
});
|
|
7895
|
+
}).finally(() => pending.delete(appId));
|
|
7896
|
+
pending.set(appId, answer);
|
|
7897
|
+
return answer;
|
|
7898
|
+
};
|
|
7899
|
+
}
|
|
7900
|
+
|
|
7901
|
+
class ConfirmComponent {
|
|
7902
|
+
header = input('', ...(ngDevMode ? [{ debugName: "header" }] : /* istanbul ignore next */ []));
|
|
7903
|
+
body = input('', ...(ngDevMode ? [{ debugName: "body" }] : /* istanbul ignore next */ []));
|
|
7904
|
+
/**
|
|
7905
|
+
* The MessageVariable values the two keys above name — a row's name or id the
|
|
7906
|
+
* asker knows and the message asks about. Values and never text: they reach
|
|
7907
|
+
* `TranslatePipe` as params rather than spliced into the key, so the message
|
|
7908
|
+
* still resolves per language. Empty is a message with no slots, which is
|
|
7909
|
+
* every confirmation drawn before this.
|
|
7910
|
+
*/
|
|
7911
|
+
params = input({}, ...(ngDevMode ? [{ debugName: "params" }] : /* istanbul ignore next */ []));
|
|
7912
|
+
type = input('info', ...(ngDevMode ? [{ debugName: "type" }] : /* istanbul ignore next */ []));
|
|
7913
|
+
/**
|
|
7914
|
+
* Whether the question can be refused. `yes` is an acknowledgement — the one
|
|
7915
|
+
* button commits and there is nothing else to press — and stays the default,
|
|
7916
|
+
* which is what every ConfirmComponent drawn before this was.
|
|
7917
|
+
*/
|
|
7918
|
+
kind = input('yes', ...(ngDevMode ? [{ debugName: "kind" }] : /* istanbul ignore next */ []));
|
|
7919
|
+
/**
|
|
7920
|
+
* The wording of each button, as a TranslationAsset key. Empty falls back to
|
|
7921
|
+
* the library's own — derived from `type` for the commit, `cancel` for the
|
|
7922
|
+
* refusal — so a caller that has nothing to say about the buttons says
|
|
7923
|
+
* nothing.
|
|
7924
|
+
*/
|
|
7925
|
+
confirmLabel = input('', ...(ngDevMode ? [{ debugName: "confirmLabel" }] : /* istanbul ignore next */ []));
|
|
7926
|
+
cancelLabel = input('', ...(ngDevMode ? [{ debugName: "cancelLabel" }] : /* istanbul ignore next */ []));
|
|
7927
|
+
#modalRef = inject(MODAL_REF);
|
|
7928
|
+
confirmText = computed(() => {
|
|
7929
|
+
if (this.confirmLabel())
|
|
7930
|
+
return this.confirmLabel();
|
|
7931
|
+
switch (this.type()) {
|
|
7932
|
+
case 'danger':
|
|
7933
|
+
return 'delete';
|
|
7934
|
+
default:
|
|
7935
|
+
return 'okay';
|
|
7936
|
+
}
|
|
7937
|
+
}, ...(ngDevMode ? [{ debugName: "confirmText" }] : /* istanbul ignore next */ []));
|
|
7938
|
+
cancelText = computed(() => this.cancelLabel() || 'cancel', ...(ngDevMode ? [{ debugName: "cancelText" }] : /* istanbul ignore next */ []));
|
|
7939
|
+
iconName = computed(() => {
|
|
7940
|
+
switch (this.type()) {
|
|
7941
|
+
case 'danger':
|
|
7942
|
+
return 'trash';
|
|
7943
|
+
case 'warning':
|
|
7944
|
+
return 'exclamation-triangle';
|
|
7945
|
+
case 'success':
|
|
7946
|
+
return 'check-circle';
|
|
7947
|
+
default:
|
|
7948
|
+
return 'info';
|
|
7949
|
+
}
|
|
7950
|
+
}, ...(ngDevMode ? [{ debugName: "iconName" }] : /* istanbul ignore next */ []));
|
|
7951
|
+
accept() {
|
|
7952
|
+
this.#modalRef.close(true);
|
|
6956
7953
|
}
|
|
6957
|
-
|
|
6958
|
-
|
|
6959
|
-
|
|
6960
|
-
|
|
7954
|
+
// The refusal is a result like any other, so it closes with `false` rather
|
|
7955
|
+
// than dismissing: a caller waiting on the answer gets one either way.
|
|
7956
|
+
decline() {
|
|
7957
|
+
this.#modalRef.close(false);
|
|
7958
|
+
}
|
|
7959
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: ConfirmComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
7960
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: ConfirmComponent, isStandalone: true, selector: "m-confirm", inputs: { header: { classPropertyName: "header", publicName: "header", isSignal: true, isRequired: false, transformFunction: null }, body: { classPropertyName: "body", publicName: "body", isSignal: true, isRequired: false, transformFunction: null }, params: { classPropertyName: "params", publicName: "params", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, kind: { classPropertyName: "kind", publicName: "kind", isSignal: true, isRequired: false, transformFunction: null }, confirmLabel: { classPropertyName: "confirmLabel", publicName: "confirmLabel", isSignal: true, isRequired: false, transformFunction: null }, cancelLabel: { classPropertyName: "cancelLabel", publicName: "cancelLabel", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: `
|
|
7961
|
+
<div class="confirm confirm--{{ type() }}">
|
|
7962
|
+
<div class="confirm__header">
|
|
7963
|
+
<div class="confirm__icon">
|
|
7964
|
+
<m-icon [name]="iconName()" />
|
|
7965
|
+
</div>
|
|
7966
|
+
@if (header()) {
|
|
7967
|
+
<!-- The heading takes the key and its values rather than projected
|
|
7968
|
+
text: m-header translates its own label, and a MessageVariable
|
|
7969
|
+
fills the same way it does everywhere else. -->
|
|
7970
|
+
<m-header [level]="3" [label]="header()" [params]="params()" />
|
|
6961
7971
|
}
|
|
6962
|
-
|
|
6963
|
-
|
|
6964
|
-
|
|
6965
|
-
|
|
6966
|
-
|
|
6967
|
-
};
|
|
6968
|
-
}, ...(ngDevMode ? [{ debugName: "buttonIcon" }] : /* istanbul ignore next */ []));
|
|
6969
|
-
overrideProperty = computed(() => {
|
|
6970
|
-
const button = {};
|
|
6971
|
-
// The rest of what a `buttons/<name>.yml` carries, so a one-off Button
|
|
6972
|
-
// needs no file (ADR 0010). An omitted attribute is skipped rather than
|
|
6973
|
-
// written as undefined — writing it would blank whatever the asset set.
|
|
6974
|
-
const put = (key, value) => {
|
|
6975
|
-
if (value !== undefined)
|
|
6976
|
-
button[key] = value;
|
|
6977
|
-
};
|
|
6978
|
-
put('label', this.label());
|
|
6979
|
-
put('icon', this.icon());
|
|
6980
|
-
put('imgSrc', this.imgSrc());
|
|
6981
|
-
put('tabindex', toAttrNumber(this.tabindex()));
|
|
6982
|
-
put('noTranslate', toAttrBool(this.noTranslate()));
|
|
6983
|
-
put('params', this.params());
|
|
6984
|
-
put('isRightIcon', toAttrBool(this.isRightIcon()));
|
|
6985
|
-
put('iconOnly', toAttrBool(this.iconOnly()));
|
|
6986
|
-
put('stacked', toAttrBool(this.stacked()));
|
|
6987
|
-
put('nonClickable', toAttrBool(this.nonClickable()));
|
|
6988
|
-
put('inverted', toAttrBool(this.inverted()));
|
|
6989
|
-
put('isSubmit', toAttrBool(this.isSubmit()));
|
|
6990
|
-
if (this.color()) {
|
|
6991
|
-
button['color'] = this.color();
|
|
7972
|
+
</div>
|
|
7973
|
+
|
|
7974
|
+
<div class="confirm__content">
|
|
7975
|
+
@if (body()) {
|
|
7976
|
+
<p class="confirm__body" [innerHTML]="body() | translate: params()"></p>
|
|
6992
7977
|
}
|
|
6993
|
-
|
|
6994
|
-
|
|
7978
|
+
</div>
|
|
7979
|
+
|
|
7980
|
+
<div class="confirm__actions">
|
|
7981
|
+
@if (kind() === 'yes-no') {
|
|
7982
|
+
<!-- asset: buttons/confirm_cancel.yml -->
|
|
7983
|
+
<m-one-button name="confirm_cancel" [label]="cancelText()" (clicked)="decline()" />
|
|
6995
7984
|
}
|
|
6996
|
-
|
|
6997
|
-
|
|
7985
|
+
<!-- asset: buttons/okay.yml -->
|
|
7986
|
+
<m-one-button name="okay" [label]="confirmText()" (clicked)="accept()" />
|
|
7987
|
+
</div>
|
|
7988
|
+
</div>
|
|
7989
|
+
`, isInline: true, styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}.confirm{display:flex;flex-direction:column;min-width:320px;max-width:440px;padding:2.5rem;background:var(--m-backdrop-modal, rgba(255, 255, 255, .85));backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:0;position:relative;overflow:hidden}.confirm__header{display:flex;flex-direction:column;align-items:center;text-align:center;gap:.9375rem;margin-bottom:1.5rem}.confirm__icon{width:64px;height:64px;border-radius:1.6rem;display:flex;align-items:center;justify-content:center;font-size:2rem;background:var(--m-backdrop-mm, rgba(65, 105, 225, .1));color:var(--m-mm, #4169e1)}.confirm__icon .m-icon{width:32px;height:32px}.confirm__title{margin:0;font-size:1.375rem;font-weight:700;color:var(--m-text-900);letter-spacing:-.02em}.confirm__content{text-align:center;margin-bottom:2rem}.confirm__body{margin:0;font-size:1rem;line-height:1.6;color:var(--m-text-600)}.confirm__actions{width:100%;margin-top:auto;display:flex;justify-content:center;gap:1rem}.confirm--danger .confirm__icon{background:var(--m-backdrop-error, rgba(235, 25, 26, .1));color:var(--m-error, #EB191A)}.confirm--warning .confirm__icon{background:var(--m-backdrop-warning, rgba(247, 122, 2, .1));color:var(--m-warning, #F77A02)}.confirm--success .confirm__icon{background:var(--m-backdrop-success, rgba(109, 168, 47, .1));color:var(--m-success, #6da82f)}.confirm--info .confirm__icon{background:var(--m-info-lite, rgba(3, 102, 214, .1));color:var(--m-info, #0366d6)}\n"], dependencies: [{ kind: "component", type: ButtonComponent, selector: "m-button,m-one-button", inputs: ["config", "color", "labelClass", "fullWidth", "nav", "navParams", "href", "disabled", "variant", "name", "baseUrl", "one", "remote", "label", "noTranslate", "params", "noNative", "icon", "isRightIcon", "iconOnly", "stacked", "imgSrc", "nonClickable", "inverted", "isSubmit", "tabindex"], outputs: ["configChange", "clicked"] }, { kind: "component", type: IconComponent, selector: "m-icon, m-one-icon", inputs: ["config", "name", "color", "size", "one", "baseUrl", "remote"], outputs: ["configChange"] }, { kind: "component", type: HeaderComponent$1, selector: "m-header", inputs: ["level", "label", "icon", "actionButton", "actionLabel", "noTranslate", "params"], outputs: ["actionClick"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
7990
|
+
}
|
|
7991
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: ConfirmComponent, decorators: [{
|
|
7992
|
+
type: Component,
|
|
7993
|
+
args: [{ selector: 'm-confirm', imports: [ButtonComponent, IconComponent, TranslatePipe, HeaderComponent$1], template: `
|
|
7994
|
+
<div class="confirm confirm--{{ type() }}">
|
|
7995
|
+
<div class="confirm__header">
|
|
7996
|
+
<div class="confirm__icon">
|
|
7997
|
+
<m-icon [name]="iconName()" />
|
|
7998
|
+
</div>
|
|
7999
|
+
@if (header()) {
|
|
8000
|
+
<!-- The heading takes the key and its values rather than projected
|
|
8001
|
+
text: m-header translates its own label, and a MessageVariable
|
|
8002
|
+
fills the same way it does everywhere else. -->
|
|
8003
|
+
<m-header [level]="3" [label]="header()" [params]="params()" />
|
|
6998
8004
|
}
|
|
6999
|
-
|
|
7000
|
-
|
|
8005
|
+
</div>
|
|
8006
|
+
|
|
8007
|
+
<div class="confirm__content">
|
|
8008
|
+
@if (body()) {
|
|
8009
|
+
<p class="confirm__body" [innerHTML]="body() | translate: params()"></p>
|
|
7001
8010
|
}
|
|
7002
|
-
|
|
7003
|
-
|
|
8011
|
+
</div>
|
|
8012
|
+
|
|
8013
|
+
<div class="confirm__actions">
|
|
8014
|
+
@if (kind() === 'yes-no') {
|
|
8015
|
+
<!-- asset: buttons/confirm_cancel.yml -->
|
|
8016
|
+
<m-one-button name="confirm_cancel" [label]="cancelText()" (clicked)="decline()" />
|
|
7004
8017
|
}
|
|
7005
|
-
|
|
7006
|
-
|
|
8018
|
+
<!-- asset: buttons/okay.yml -->
|
|
8019
|
+
<m-one-button name="okay" [label]="confirmText()" (clicked)="accept()" />
|
|
8020
|
+
</div>
|
|
8021
|
+
</div>
|
|
8022
|
+
`, changeDetection: ChangeDetectionStrategy.OnPush, styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}.confirm{display:flex;flex-direction:column;min-width:320px;max-width:440px;padding:2.5rem;background:var(--m-backdrop-modal, rgba(255, 255, 255, .85));backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:0;position:relative;overflow:hidden}.confirm__header{display:flex;flex-direction:column;align-items:center;text-align:center;gap:.9375rem;margin-bottom:1.5rem}.confirm__icon{width:64px;height:64px;border-radius:1.6rem;display:flex;align-items:center;justify-content:center;font-size:2rem;background:var(--m-backdrop-mm, rgba(65, 105, 225, .1));color:var(--m-mm, #4169e1)}.confirm__icon .m-icon{width:32px;height:32px}.confirm__title{margin:0;font-size:1.375rem;font-weight:700;color:var(--m-text-900);letter-spacing:-.02em}.confirm__content{text-align:center;margin-bottom:2rem}.confirm__body{margin:0;font-size:1rem;line-height:1.6;color:var(--m-text-600)}.confirm__actions{width:100%;margin-top:auto;display:flex;justify-content:center;gap:1rem}.confirm--danger .confirm__icon{background:var(--m-backdrop-error, rgba(235, 25, 26, .1));color:var(--m-error, #EB191A)}.confirm--warning .confirm__icon{background:var(--m-backdrop-warning, rgba(247, 122, 2, .1));color:var(--m-warning, #F77A02)}.confirm--success .confirm__icon{background:var(--m-backdrop-success, rgba(109, 168, 47, .1));color:var(--m-success, #6da82f)}.confirm--info .confirm__icon{background:var(--m-info-lite, rgba(3, 102, 214, .1));color:var(--m-info, #0366d6)}\n"] }]
|
|
8023
|
+
}], propDecorators: { header: [{ type: i0.Input, args: [{ isSignal: true, alias: "header", required: false }] }], body: [{ type: i0.Input, args: [{ isSignal: true, alias: "body", required: false }] }], params: [{ type: i0.Input, args: [{ isSignal: true, alias: "params", required: false }] }], type: [{ type: i0.Input, args: [{ isSignal: true, alias: "type", required: false }] }], kind: [{ type: i0.Input, args: [{ isSignal: true, alias: "kind", required: false }] }], confirmLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "confirmLabel", required: false }] }], cancelLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "cancelLabel", required: false }] }] } });
|
|
8024
|
+
|
|
8025
|
+
/**
|
|
8026
|
+
* Installs an App after asking. An App declaring Permissions is installed only
|
|
8027
|
+
* with Agreement (store ADR 0006), so its modal lists them and the request
|
|
8028
|
+
* carries `agree: true`; `declared` spares the lookup when the caller already
|
|
8029
|
+
* holds them. `hardStop` is the init gate: the modal cannot be dismissed and
|
|
8030
|
+
* refusing leaves for the Store.
|
|
8031
|
+
*/
|
|
8032
|
+
function injectInstallApp() {
|
|
8033
|
+
const modalStore = inject(ModalStore);
|
|
8034
|
+
const httpService = inject(HttpService);
|
|
8035
|
+
return async (app, declared, hardStop = false) => {
|
|
8036
|
+
const appName = app.name ?? app.link ?? '';
|
|
8037
|
+
const appId = app.id ?? '';
|
|
8038
|
+
const permissions = declared ??
|
|
8039
|
+
(app.permissions?.length
|
|
8040
|
+
? await firstValueFrom(httpService.get('store', ['app', appId, 'permission'])).catch(() => [])
|
|
8041
|
+
: []);
|
|
8042
|
+
return new Promise((resolve, reject) => {
|
|
8043
|
+
const modalRef = new ModalRef();
|
|
8044
|
+
const id = permissions.length
|
|
8045
|
+
? modalStore.open({
|
|
8046
|
+
component: AgreementComponent,
|
|
8047
|
+
providers: [{ provide: MODAL_REF, useValue: modalRef }],
|
|
8048
|
+
bindings: [
|
|
8049
|
+
inputBinding('header', () => `install_app_title?appName=${appName}`),
|
|
8050
|
+
inputBinding('permissions', () => permissions),
|
|
8051
|
+
inputBinding('confirmLabel', () => 'install'),
|
|
8052
|
+
inputBinding('cancelLabel', () => hardStop ? 'back-to-store' : 'cancel'),
|
|
8053
|
+
],
|
|
8054
|
+
config: hardStop
|
|
8055
|
+
? { closeProhibited: true, backdropClose: false }
|
|
8056
|
+
: undefined,
|
|
8057
|
+
})
|
|
8058
|
+
: modalStore.open({
|
|
8059
|
+
component: ConfirmComponent,
|
|
8060
|
+
providers: [{ provide: MODAL_REF, useValue: modalRef }],
|
|
8061
|
+
bindings: [
|
|
8062
|
+
inputBinding('header', () => `install_app_title?appName=${appName}`),
|
|
8063
|
+
inputBinding('body', () => `install_app_body?appName=${appName}`),
|
|
8064
|
+
inputBinding('type', () => 'info'),
|
|
8065
|
+
],
|
|
8066
|
+
});
|
|
8067
|
+
modalRef.onClose(async (confirmed) => {
|
|
8068
|
+
modalStore.close(id);
|
|
8069
|
+
if (!confirmed) {
|
|
8070
|
+
reject(hardStop ? { type: 'back_to_store' } : new Error('app_install_declined'));
|
|
8071
|
+
return;
|
|
8072
|
+
}
|
|
8073
|
+
try {
|
|
8074
|
+
const body = await firstValueFrom(httpService.post('store', ['request', appId], permissions.length ? { agree: true } : {}));
|
|
8075
|
+
if (body?.relation?.type === 5) {
|
|
8076
|
+
reject({ type: 'install_pending', appName });
|
|
8077
|
+
return;
|
|
8078
|
+
}
|
|
8079
|
+
resolve();
|
|
8080
|
+
}
|
|
8081
|
+
catch (e) {
|
|
8082
|
+
reject(e);
|
|
8083
|
+
}
|
|
8084
|
+
});
|
|
8085
|
+
});
|
|
8086
|
+
};
|
|
8087
|
+
}
|
|
8088
|
+
|
|
8089
|
+
/** Where refusing the hard stop goes — the host's Store. */
|
|
8090
|
+
const STORE_PATH = '/store';
|
|
8091
|
+
/**
|
|
8092
|
+
* The init step every App passes before it renders (store ADR 0006): its apis
|
|
8093
|
+
* refuse without a current Agreement, so the App asks first — Agreement to an
|
|
8094
|
+
* installed App whose Declared Permissions grew, install-with-Agreement for a
|
|
8095
|
+
* visitor. The modal cannot be dismissed; its other button leaves for the
|
|
8096
|
+
* Store. The Relation it reads is kept per AppLink and is what AppContext
|
|
8097
|
+
* reads too, so an App fetches it once.
|
|
8098
|
+
*/
|
|
8099
|
+
class AgreementGate {
|
|
8100
|
+
#http = inject(HttpService);
|
|
8101
|
+
#injector = inject(Injector);
|
|
8102
|
+
#views = new Map();
|
|
8103
|
+
#revision = signal(0, ...(ngDevMode ? [{ debugName: "#revision" }] : /* istanbul ignore next */ []));
|
|
8104
|
+
/** Moves whenever a kept Relation is dropped, so a reader can read again. */
|
|
8105
|
+
revision = this.#revision.asReadonly();
|
|
8106
|
+
/** Refusing the hard stop leaves the App for the host's Store. */
|
|
8107
|
+
leaveForStore = () => window.location.assign(STORE_PATH);
|
|
8108
|
+
/** The caller's Relation to `link`, read once until `forget`. */
|
|
8109
|
+
view(link) {
|
|
8110
|
+
let view = this.#views.get(link);
|
|
8111
|
+
if (!view) {
|
|
8112
|
+
view = firstValueFrom(this.#http.get('store', ['app', link, 'relation']));
|
|
8113
|
+
view.catch(() => this.#views.delete(link));
|
|
8114
|
+
this.#views.set(link, view);
|
|
8115
|
+
}
|
|
8116
|
+
return view;
|
|
8117
|
+
}
|
|
8118
|
+
forget(link) {
|
|
8119
|
+
this.#views.delete(link);
|
|
8120
|
+
this.#revision.update((n) => n + 1);
|
|
8121
|
+
}
|
|
8122
|
+
/**
|
|
8123
|
+
* Resolves once the App may open. Never resolves when the user leaves for
|
|
8124
|
+
* the Store. A failed read lets the App open — its apis are the hard stop,
|
|
8125
|
+
* and they refuse on their own.
|
|
8126
|
+
*/
|
|
8127
|
+
async ensure(link, name) {
|
|
8128
|
+
let view;
|
|
8129
|
+
try {
|
|
8130
|
+
view = await this.view(link);
|
|
7007
8131
|
}
|
|
7008
|
-
|
|
7009
|
-
|
|
8132
|
+
catch {
|
|
8133
|
+
return;
|
|
7010
8134
|
}
|
|
7011
|
-
|
|
7012
|
-
|
|
8135
|
+
const app = { id: view.app, link, name };
|
|
8136
|
+
try {
|
|
8137
|
+
if (view.needsAgreement) {
|
|
8138
|
+
const agreeToApp = runInInjectionContext(this.#injector, injectAgreeToApp);
|
|
8139
|
+
await agreeToApp(app, view.permissions, true);
|
|
8140
|
+
this.forget(link);
|
|
8141
|
+
}
|
|
8142
|
+
else if (view.type === null && view.permissions.length) {
|
|
8143
|
+
const installApp = runInInjectionContext(this.#injector, injectInstallApp);
|
|
8144
|
+
await installApp(app, view.permissions, true);
|
|
8145
|
+
this.forget(link);
|
|
8146
|
+
}
|
|
7013
8147
|
}
|
|
7014
|
-
|
|
7015
|
-
|
|
7016
|
-
|
|
7017
|
-
|
|
7018
|
-
|
|
7019
|
-
if ((finalColor === 'inverse' || finalColor === 'inverseText') &&
|
|
7020
|
-
!isExplicitGhost &&
|
|
7021
|
-
!isExplicitSecondary) {
|
|
7022
|
-
button['color'] = 'inverseText';
|
|
7023
|
-
button['variant'] = 'primary';
|
|
8148
|
+
catch (refusal) {
|
|
8149
|
+
if (refusal?.type === 'back_to_store') {
|
|
8150
|
+
this.leaveForStore();
|
|
8151
|
+
return new Promise(() => undefined);
|
|
8152
|
+
}
|
|
7024
8153
|
}
|
|
7025
|
-
|
|
7026
|
-
|
|
8154
|
+
}
|
|
8155
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AgreementGate, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
8156
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AgreementGate, providedIn: 'root' });
|
|
8157
|
+
}
|
|
8158
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AgreementGate, decorators: [{
|
|
8159
|
+
type: Injectable,
|
|
8160
|
+
args: [{ providedIn: 'root' }]
|
|
8161
|
+
}] });
|
|
8162
|
+
|
|
8163
|
+
function initMagmoniumApp({ backend, authUrl, socketUrl, }) {
|
|
8164
|
+
return () => {
|
|
8165
|
+
inject(FreezeService); // ensure the loading effect is always active
|
|
8166
|
+
const httpService = inject(HttpService);
|
|
8167
|
+
const translateService = inject(TranslateService);
|
|
8168
|
+
const themeStore = inject(ThemeStore);
|
|
8169
|
+
const loginStore = inject(LOGIN_STORE);
|
|
8170
|
+
const navStore = inject(NavStore, { optional: true });
|
|
8171
|
+
const appLink = inject(APP_LINK);
|
|
8172
|
+
const agreementGate = inject(AgreementGate);
|
|
8173
|
+
translateService.init();
|
|
8174
|
+
SharedStoreRegistry.setThemeStore(themeStore);
|
|
8175
|
+
SharedStoreRegistry.setTranslateService(translateService);
|
|
8176
|
+
SharedStoreRegistry.setLoadingActions(loadingActions);
|
|
8177
|
+
SharedStoreRegistry.setNotificationStore(inject(NotificationStore));
|
|
8178
|
+
if (navStore) {
|
|
8179
|
+
SharedStoreRegistry.setNavStore(navStore);
|
|
7027
8180
|
}
|
|
7028
|
-
if (
|
|
7029
|
-
|
|
8181
|
+
if (loginStore) {
|
|
8182
|
+
SharedStoreRegistry.setLoginStore(loginStore);
|
|
7030
8183
|
}
|
|
7031
|
-
|
|
7032
|
-
|
|
7033
|
-
|
|
7034
|
-
|
|
7035
|
-
}
|
|
7036
|
-
onClick() {
|
|
7037
|
-
if (this.isFormSubmit()) {
|
|
7038
|
-
// Called rather than left to a native `type="submit"`: the `<form>` is
|
|
7039
|
-
// only an ancestor while nothing re-projects this Button out of it.
|
|
7040
|
-
this.sectionForm?.submit();
|
|
8184
|
+
const effectiveBackend = backend || 'http://localhost:8000';
|
|
8185
|
+
if (!backend) {
|
|
8186
|
+
console.warn('initMagmoniumApp: No backend URL provided, defaulting to http://localhost:8000. ' +
|
|
8187
|
+
'Check your environment configuration if this is unexpected.');
|
|
7041
8188
|
}
|
|
7042
|
-
|
|
7043
|
-
|
|
7044
|
-
|
|
7045
|
-
|
|
7046
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: ButtonComponent, isStandalone: true, selector: "m-button,m-one-button", inputs: { config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, labelClass: { classPropertyName: "labelClass", publicName: "labelClass", isSignal: true, isRequired: false, transformFunction: null }, fullWidth: { classPropertyName: "fullWidth", publicName: "fullWidth", isSignal: true, isRequired: false, transformFunction: null }, nav: { classPropertyName: "nav", publicName: "nav", isSignal: true, isRequired: false, transformFunction: null }, navParams: { classPropertyName: "navParams", publicName: "navParams", isSignal: true, isRequired: false, transformFunction: null }, href: { classPropertyName: "href", publicName: "href", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, baseUrl: { classPropertyName: "baseUrl", publicName: "baseUrl", isSignal: true, isRequired: false, transformFunction: null }, one: { classPropertyName: "one", publicName: "one", isSignal: true, isRequired: false, transformFunction: null }, remote: { classPropertyName: "remote", publicName: "remote", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, noTranslate: { classPropertyName: "noTranslate", publicName: "noTranslate", isSignal: true, isRequired: false, transformFunction: null }, params: { classPropertyName: "params", publicName: "params", isSignal: true, isRequired: false, transformFunction: null }, noNative: { classPropertyName: "noNative", publicName: "noNative", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, isRightIcon: { classPropertyName: "isRightIcon", publicName: "isRightIcon", isSignal: true, isRequired: false, transformFunction: null }, iconOnly: { classPropertyName: "iconOnly", publicName: "iconOnly", isSignal: true, isRequired: false, transformFunction: null }, stacked: { classPropertyName: "stacked", publicName: "stacked", isSignal: true, isRequired: false, transformFunction: null }, imgSrc: { classPropertyName: "imgSrc", publicName: "imgSrc", isSignal: true, isRequired: false, transformFunction: null }, nonClickable: { classPropertyName: "nonClickable", publicName: "nonClickable", isSignal: true, isRequired: false, transformFunction: null }, inverted: { classPropertyName: "inverted", publicName: "inverted", isSignal: true, isRequired: false, transformFunction: null }, isSubmit: { classPropertyName: "isSubmit", publicName: "isSubmit", isSignal: true, isRequired: false, transformFunction: null }, tabindex: { classPropertyName: "tabindex", publicName: "tabindex", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { config: "configChange", clicked: "clicked" }, viewQueries: [{ propertyName: "button", first: true, predicate: ["button"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "@if (config(); as config) {\n <!-- One branch for every in-app target: `mRef` names a NavId and the store\n reads the NavKind off that node to decide route vs panel (ADR 0014). -->\n @if (config.nav) {\n @if (!noNative()) {\n <button\n type=\"button\"\n class=\"{{ className() }}\"\n [attr.data-testid]=\"config.name + '-btn'\"\n [attr.tabindex]=\"config.tabindex\"\n [disabled]=\"config.disabled\"\n [mRef]=\"config.nav\"\n [mRefParams]=\"config.navParams\"\n [attr.aria-label]=\"config.noTranslate ? config.label : (config.label | translate: config.params)\"\n mRefLinkActive=\"tab\"\n (keydown.enter)=\"onClick()\"\n (click)=\"onClick()\"\n #button\n >\n <ng-container *ngTemplateOutlet=\"buttonContent; context: { button: config }\"></ng-container>\n </button>\n } @else {\n <div\n role=\"button\"\n [attr.tabindex]=\"config.tabindex ?? 0\"\n class=\"non-native {{ className() }}\"\n [attr.data-testid]=\"config.name + '-btn'\"\n [attr.aria-label]=\"config.noTranslate ? config.label : (config.label | translate: config.params)\"\n [attr.aria-disabled]=\"config.disabled ? 'true' : 'false'\"\n (keydown.enter)=\"onClick()\"\n (click)=\"onClick()\"\n #button\n >\n <ng-container *ngTemplateOutlet=\"buttonContent; context: { button: config }\"></ng-container>\n </div>\n }\n } @else if (config.href) {\n <a\n class=\"{{ className() }}\"\n [attr.data-testid]=\"config.name + '-btn'\"\n [attr.tabindex]=\"config.tabindex\"\n [href]=\"config.href\"\n [attr.aria-label]=\"config.noTranslate ? config.label : (config.label | translate: config.params)\"\n (click)=\"onClick()\"\n #button\n >\n <ng-container *ngTemplateOutlet=\"buttonContent; context: { button: config }\"></ng-container>\n </a>\n } @else {\n @if (!noNative()) {\n <button\n type=\"button\"\n class=\"{{ className() }}\"\n [attr.data-testid]=\"config.name + '-btn'\"\n [attr.tabindex]=\"config.tabindex\"\n [disabled]=\"isDisabled()\"\n [attr.aria-label]=\"config.noTranslate ? config.label : (config.label | translate: config.params)\"\n (keydown.enter)=\"onClick()\"\n (click)=\"onClick()\"\n #button\n >\n <ng-container *ngTemplateOutlet=\"buttonContent; context: { button: config }\"></ng-container>\n </button>\n } @else {\n <div\n role=\"button\"\n [attr.tabindex]=\"config.tabindex ?? 0\"\n class=\"non-native {{ className() }}\"\n [attr.data-testid]=\"config.name + '-btn'\"\n [attr.aria-label]=\"config.noTranslate ? config.label : (config.label | translate: config.params)\"\n [attr.aria-disabled]=\"isDisabled() ? 'true' : 'false'\"\n (keydown.enter)=\"onClick()\"\n (click)=\"onClick()\"\n #button\n >\n <ng-container *ngTemplateOutlet=\"buttonContent; context: { button: config }\"></ng-container>\n </div>\n }\n }\n}\n\n<ng-template #buttonContent let-button=\"button\">\n @if (button.imgSrc) {\n <div class=\"button-icon button-icon--img\">\n <m-img [src]=\"button.imgSrc\" [remote]=\"button.remote\" [alt]=\"button.label || button.name || ''\" />\n @if (button.badge && button.badge.count) {\n <m-badge\n [config]=\"{ variant: button.badge.variant ?? 'danger', position: 'absolute' }\"\n >{{ formatBadgeCount(button.badge.count) }}</m-badge\n >\n }\n </div>\n } @else if (buttonIcon(); as icon) {\n <div class=\"button-icon\">\n @if (isFromOne()) {\n <m-one-icon [config]=\"icon\" />\n } @else {\n <m-icon [config]=\"icon\" />\n }\n @if (button.badge && button.badge.count) {\n <m-badge\n [config]=\"{ variant: button.badge.variant ?? 'danger', position: 'absolute' }\"\n >{{ formatBadgeCount(button.badge.count) }}</m-badge\n >\n }\n </div>\n }\n @if (button.label && !button.iconOnly) {\n <span class=\"button-label {{ button.labelClass || '' }}\">\n {{ button.noTranslate ? button.label : (button.label | translate: button.params) }}\n </span>\n }\n @if (!buttonIcon() && button.badge && button.badge.count) {\n <m-badge [config]=\"{ variant: button.badge.variant ?? 'danger', position: 'static' }\">{{\n formatBadgeCount(button.badge.count)\n }}</m-badge>\n }\n</ng-template>\n", styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}:host{display:inline-flex;align-items:center;justify-content:center;vertical-align:middle;box-sizing:border-box;overflow:hidden;transition:box-shadow .15s ease;--m-btn-size: var(--m-button-size, 1em);--m-btn-color: var(--m-button-color, var(--m-one-button-color, var(--m-mm)));--m-btn-color-contrast: var(--m-button-color-contrast, var(--m-one-button-color-contrast, #ffffff));--m-btn-color-opposite: var(--m-button-color-opposite, var(--m-one-button-color-opposite, #e1b941));--m-btn-h: calc(var(--m-btn-size) * 2.25);width:var(--m-button-width, var(--m-one-button-width, auto));min-width:0;height:var(--m-btn-h);font-size:var(--m-btn-size)}:host-context(.inverse),:host-context(.tabs-inverse),:host.inverse{--m-btn-color: var(--m-button-color, var(--m-one-button-color, var(--m-inverse-text)))}:host:has(.full-width){display:flex;width:100%}:host:has(.full-width) button .button-label{white-space:normal;overflow:visible;text-overflow:clip;word-break:break-word}:host:has(.only-icon),:host:has(.toggle){width:var(--m-btn-h);min-width:var(--m-btn-h)}:host:has(.has-badge){overflow:visible}:host:has(.stacked),:host:has(.toggle){height:auto}button:not(.get):not(.toggle){height:calc(var(--input-size, var(--m-btn-size)) * 2);min-height:calc(var(--input-size, var(--m-btn-size)) * 2);border-width:max(1px,var(--input-size, var(--m-btn-size)) * .0625);border-radius:calc(var(--input-size, var(--m-btn-size)) * .4);padding:calc(var(--input-size, var(--m-btn-size)) * .5) calc(var(--input-size, var(--m-btn-size)) * .5);gap:calc(var(--input-size, var(--m-btn-size)) * .375);font-size:var(--input-size, var(--m-btn-size));border-color:var(--m-btn-color);transition:border-color .2s ease,box-shadow .2s ease,background-color .2s ease,opacity .2s ease}button:not(.get):not(.toggle):hover:not(:disabled){background-color:color-mix(in srgb,var(--m-btn-color) 6%,transparent)}button:not(.get):not(.toggle):disabled{opacity:.6;cursor:not-allowed}button:not(.get):not(.toggle){height:auto;padding:calc(var(--m-btn-size) * .625) calc(var(--m-btn-size) * 1.25);gap:calc(var(--m-btn-size) * .375);border-style:solid;display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;font-family:inherit;cursor:pointer;appearance:none;width:100%;height:100%;min-height:0;padding:0 calc(var(--m-btn-size) * 1.25);border-width:var(--m-button-border-width, 1px);border-radius:var(--m-button-radius, calc(var(--m-btn-size) * .5));color:var(--m-btn-color);font-weight:300;line-height:1;-webkit-user-select:none;user-select:none;position:relative;outline:none;box-shadow:var(--m-button-shadow, var(--m-one-button-shadow, none));transition:filter .15s ease,background .15s ease}button:not(.get):not(.toggle):hover:not(:disabled){filter:brightness(1.04)}button:not(.get):not(.toggle):focus-visible:not(:disabled){outline:2px solid color-mix(in srgb,var(--m-focus) 45%,transparent);outline-offset:-2px}button:not(.get):not(.toggle):active:not(:disabled){transform:scale(.97)}button:not(.get):not(.toggle):disabled{opacity:.35;cursor:not-allowed;pointer-events:none;filter:grayscale(80%)}button:not(.get):not(.toggle).read-only{pointer-events:none!important;cursor:default!important;transform:none!important;box-shadow:none!important;background:transparent!important;border-color:transparent!important;opacity:1!important}button:not(.get):not(.toggle).read-only .button-icon{transform:none!important;color:inherit!important}button:not(.get):not(.toggle).primary{background:var(--m-btn-color);border-color:var(--m-btn-color);color:var(--m-btn-color-contrast)}button:not(.get):not(.toggle).primary:hover:not(:disabled){filter:none;background:color-mix(in srgb,var(--m-btn-color) 88%,black);border-color:color-mix(in srgb,var(--m-btn-color) 88%,black)}button:not(.get):not(.toggle).primary:active:not(:disabled){filter:brightness(.94);transform:scale(.97)}button:not(.get):not(.toggle).ghost:not(.primary):not(.tab){background:transparent;border-color:transparent;color:var(--m-btn-color);box-shadow:none}button:not(.get):not(.toggle).ghost:not(.primary):not(.tab):hover:not(:disabled){filter:none;background:color-mix(in srgb,var(--m-btn-color) 8%,transparent)}button:not(.get):not(.toggle).ghost:not(.primary):not(.tab):active:not(:disabled){background:color-mix(in srgb,var(--m-btn-color) 14%,transparent);transform:scale(.97)}button:not(.get):not(.toggle).ghost:not(.primary):not(.tab).secondary{border:var(--m-button-border-width, 1px) solid color-mix(in srgb,var(--m-btn-color) 15%,transparent)}button:not(.get):not(.toggle).ghost:not(.primary):not(.tab).secondary:hover:not(:disabled){filter:none;border-color:color-mix(in srgb,var(--m-btn-color) 40%,transparent);background:color-mix(in srgb,var(--m-btn-color) 6%,transparent)}button:not(.get):not(.toggle).ghost:not(.primary):not(.tab).secondary:active:not(:disabled){border-color:color-mix(in srgb,var(--m-btn-color) 50%,transparent);background:color-mix(in srgb,var(--m-btn-color) 12%,transparent)}button:not(.get):not(.toggle).secondary:not(.primary):not(.ghost){background:transparent;border-color:var(--m-btn-color);color:var(--m-btn-color)}button:not(.get):not(.toggle).secondary:not(.primary):not(.ghost):hover:not(:disabled){filter:none;background:color-mix(in srgb,var(--m-btn-color) 8%,transparent)}button:not(.get):not(.toggle).secondary:not(.primary):not(.ghost):active:not(:disabled){background:color-mix(in srgb,var(--m-btn-color) 14%,transparent);transform:scale(.97)}button:not(.get):not(.toggle).tab{background:var(--m-backdrop-border);border-color:var(--m-backdrop-border);color:var(--m-btn-color)}button:not(.get):not(.toggle).tab:hover:not(:disabled){background:color-mix(in srgb,var(--m-backdrop-border) 82%,black);border-color:color-mix(in srgb,var(--m-backdrop-border) 82%,black);filter:none}button:not(.get):not(.toggle).tab:active:not(:disabled){background:color-mix(in srgb,var(--m-backdrop-border) 70%,black);border-color:color-mix(in srgb,var(--m-backdrop-border) 70%,black);transform:scale(.97)}button:not(.get):not(.toggle).segmented .button-icon,button:not(.get):not(.toggle).badge-accent .button-icon,button:not(.get):not(.toggle).with-right-icon .button-icon{display:inline-flex;align-items:center;justify-content:center;color:var(--m-btn-color-opposite);order:1}button:not(.get):not(.toggle).segmented .button-label,button:not(.get):not(.toggle).badge-accent .button-label,button:not(.get):not(.toggle).with-right-icon .button-label{order:-1}button:not(.get):not(.toggle).segmented.primary .button-icon,button:not(.get):not(.toggle).badge-accent.primary .button-icon,button:not(.get):not(.toggle).with-right-icon.primary .button-icon{color:var(--m-btn-color-opposite)}button:not(.get):not(.toggle).with-left-icon .button-icon{order:-1}button:not(.get):not(.toggle).with-left-icon .button-label{order:1}button:not(.get):not(.toggle).stacked{flex-direction:column;gap:calc(var(--m-btn-size) * .3);height:auto;min-height:var(--m-btn-h);padding:calc(var(--m-btn-size) * .625) calc(var(--m-btn-size) * .875)}button:not(.get):not(.toggle).stacked .button-label{font-size:calc(var(--m-btn-size) * .8)}button:not(.get):not(.toggle).only-icon{padding:0;border-width:var(--m-button-border-width, 1px);aspect-ratio:1;display:inline-flex;align-items:center;justify-content:center}button:not(.get):not(.toggle).only-icon m-icon,button:not(.get):not(.toggle).only-icon m-one-icon{display:inline-flex}m-badge{--m-badge-height: 1.5em;--m-badge-min-width: 1.5em;--m-badge-padding: 0 .3em;--m-badge-gap: .1em}.button-label{display:inline-flex;align-items:center;line-height:normal;font-size:inherit;min-width:0;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.button-icon{position:relative;display:inline-flex;align-items:center;justify-content:center}.button-icon--img{width:calc(var(--m-btn-size) * 1.75);height:calc(var(--m-btn-size) * 1.75);overflow:hidden}.button-icon--img m-img{width:100%;height:100%;display:block}.get{appearance:none;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;height:var(--m-btn-h);padding:0 min(var(--m-btn-size) * 1.75,2rem);border-radius:4px;background:linear-gradient(135deg,var(--m-mm),var(--m-focus),var(--m-success),var(--m-mm));background-size:200% auto;color:#fff;font-size:calc(var(--m-btn-size) * .8);font-weight:300;letter-spacing:.06em;text-transform:uppercase;border:none;cursor:pointer;white-space:nowrap;line-height:1;transition:background-position .2s ease,transform .15s ease}.get:hover{background-position:right center}.get:focus-visible{outline:2px solid color-mix(in srgb,var(--m-focus) 45%,transparent);outline-offset:-2px}.get:active{transform:scale(.97)}.toggle{appearance:none;display:inline-flex;align-items:center;justify-content:center;width:100%;height:100%;border:none;background:transparent;padding:0 min(var(--m-btn-size),1.25rem);border-radius:var(--m-button-radius, calc(var(--m-btn-size) * .375));box-shadow:none;color:var(--m-btn-color, var(--m-text-secondary));opacity:.65;font-family:inherit;font-size:var(--m-btn-size);font-weight:300;cursor:pointer;box-sizing:border-box;-webkit-user-select:none;user-select:none;transition:background .15s ease,color .15s ease,opacity .15s ease;min-width:0}.toggle .button-icon{flex-shrink:0}.toggle .button-label{display:inline-block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;min-width:0}.toggle:hover:not(:disabled){background:var(--m-button-hover-background, color-mix(in srgb, var(--m-focus) 8%, transparent));color:var(--m-button-hover-color, var(--m-text));opacity:1}.toggle:focus-visible:not(:disabled){outline:2px solid color-mix(in srgb,var(--m-focus) 45%,transparent);outline-offset:-2px;opacity:1}.toggle.primary{background:var(--m-button-active-background, var(--m-mm));color:var(--m-button-active-color, #ffffff);opacity:1}.toggle.primary:hover:not(:disabled){background:var(--m-button-active-background, var(--m-mm));color:var(--m-button-active-color, #ffffff);opacity:1}.toggle.primary:active:not(:disabled){transform:scale(.97)}.non-native:not(.get):not(.toggle){appearance:none;display:inline-flex;align-items:center;justify-content:center;width:100%;height:100%;min-height:0;padding:0 calc(var(--m-btn-size) * 1.25);border-width:2px;border-radius:4px;color:var(--m-btn-color);font-weight:300;line-height:1;-webkit-user-select:none;user-select:none;position:relative;outline:none;box-shadow:var(--m-button-shadow, var(--m-one-button-shadow, none));transition:filter .15s ease,background .15s ease}.non-native:not(.get):not(.toggle):hover:not([aria-disabled=true]){filter:brightness(1.04)}.non-native:not(.get):not(.toggle):focus-visible:not([aria-disabled=true]){outline:2px solid color-mix(in srgb,var(--m-focus) 45%,transparent);outline-offset:-2px}.non-native:not(.get):not(.toggle):active:not([aria-disabled=true]){transform:scale(.97)}.non-native:not(.get):not(.toggle)[aria-disabled=true]{opacity:.35;cursor:not-allowed;pointer-events:none;filter:grayscale(80%)}.non-native:not(.get):not(.toggle).primary{background:var(--m-btn-color);border-color:var(--m-btn-color);color:var(--m-btn-color-contrast)}.non-native:not(.get):not(.toggle).primary:hover:not([aria-disabled=true]){filter:none;background:color-mix(in srgb,var(--m-btn-color) 88%,black);border-color:color-mix(in srgb,var(--m-btn-color) 88%,black)}.non-native:not(.get):not(.toggle).primary:active:not([aria-disabled=true]){filter:brightness(.94);transform:scale(.97)}.non-native:not(.get):not(.toggle).ghost:not(.primary):not(.tab){background:transparent;border-color:transparent;color:var(--m-btn-color);box-shadow:none}.non-native:not(.get):not(.toggle).ghost:not(.primary):not(.tab):hover:not([aria-disabled=true]){filter:none;background:color-mix(in srgb,var(--m-btn-color) 8%,transparent)}.non-native:not(.get):not(.toggle).ghost:not(.primary):not(.tab):active:not([aria-disabled=true]){background:color-mix(in srgb,var(--m-btn-color) 14%,transparent);transform:scale(.97)}.non-native:not(.get):not(.toggle):disabled{opacity:.3;cursor:not-allowed}@container togglegroup (max-width: 320px){.non-native:not(.get):not(.toggle).with-left-icon .button-label,.non-native:not(.get):not(.toggle).with-right-icon .button-label{display:none!important}}@media(max-width:600px){.non-native:not(.get):not(.toggle).with-left-icon .button-label,.non-native:not(.get):not(.toggle).with-right-icon .button-label{display:none!important}}\n"], dependencies: [{ kind: "component", type: i0.forwardRef(() => IconComponent), selector: "m-icon, m-one-icon", inputs: ["config", "name", "color", "size", "one", "baseUrl", "remote"], outputs: ["configChange"] }, { kind: "component", type: i0.forwardRef(() => BadgeComponent), selector: "m-badge", inputs: ["config"], outputs: ["configChange"] }, { kind: "ngmodule", type: i0.forwardRef(() => RouterModule) }, { kind: "directive", type: i0.forwardRef(() => MRefDirective), selector: "[mRef]", inputs: ["mRef", "mRefLinkActive", "mRefToggle", "mRefParams"] }, { kind: "directive", type: i0.forwardRef(() => NgTemplateOutlet), selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i0.forwardRef(() => ImgComponent), selector: "m-img", inputs: ["src", "data", "dataType", "alt", "priority", "fill", "width", "height", "remote", "ngSrcset", "sizes"] }, { kind: "pipe", type: i0.forwardRef(() => TranslatePipe), name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
8189
|
+
// Auth URL defaults to Backend URL so single-host apps stay unchanged (ADR 0012).
|
|
8190
|
+
const effectiveAuth = authUrl || effectiveBackend;
|
|
8191
|
+
httpService.setUrl(effectiveBackend);
|
|
8192
|
+
httpService.setAuthUrl(effectiveAuth);
|
|
8193
|
+
themeStore.init();
|
|
8194
|
+
if (socketUrl) {
|
|
8195
|
+
const socketStore = inject(SocketStore);
|
|
8196
|
+
let lastToken;
|
|
8197
|
+
effect(() => {
|
|
8198
|
+
const tokens = loginStore?.tokens();
|
|
8199
|
+
const currentToken = tokens?.auth;
|
|
8200
|
+
if (!currentToken) {
|
|
8201
|
+
socketStore.disconnect();
|
|
8202
|
+
lastToken = undefined;
|
|
8203
|
+
return;
|
|
8204
|
+
}
|
|
8205
|
+
// If we already connected with this exact token, skip
|
|
8206
|
+
if (lastToken === currentToken)
|
|
8207
|
+
return;
|
|
8208
|
+
// If another instance (e.g. host app) has already established a socket,
|
|
8209
|
+
// and we are a new instance (e.g. WC) that hasn't connected yet, skip.
|
|
8210
|
+
if (SharedStoreRegistry.isHostSocketActive() &&
|
|
8211
|
+
lastToken === undefined) {
|
|
8212
|
+
return;
|
|
8213
|
+
}
|
|
8214
|
+
// Connect (or reconnect if lastToken was different)
|
|
8215
|
+
socketStore.connect(`${socketUrl}?token=${currentToken}`);
|
|
8216
|
+
SharedStoreRegistry.setSocketUrl(socketUrl);
|
|
8217
|
+
lastToken = currentToken;
|
|
8218
|
+
});
|
|
8219
|
+
}
|
|
8220
|
+
if (!loginStore)
|
|
8221
|
+
return EMPTY;
|
|
8222
|
+
// Load saved login IDs before init so the modal shows them if it opens
|
|
8223
|
+
if (!loginStore.tokens()) {
|
|
8224
|
+
loginStore.loadSavedLoginIds();
|
|
8225
|
+
}
|
|
8226
|
+
// Always call init — interceptor handles no-token case via authenticate()
|
|
8227
|
+
return httpService
|
|
8228
|
+
.put('auth', ['init'])
|
|
8229
|
+
.pipe(tap(({ navs, tokens, user }) => {
|
|
8230
|
+
loginStore.initApp({ navs, tokens, user });
|
|
8231
|
+
}), catchError(() => {
|
|
8232
|
+
loginStore.loadSavedLoginIds();
|
|
8233
|
+
return EMPTY;
|
|
8234
|
+
}),
|
|
8235
|
+
// The App's apis refuse without a current Agreement (store ADR 0006),
|
|
8236
|
+
// so init asks for it before the App renders.
|
|
8237
|
+
switchMap$1(() => {
|
|
8238
|
+
const link = appLink();
|
|
8239
|
+
return link ? from(agreementGate.ensure(link)) : of(undefined);
|
|
8240
|
+
}));
|
|
8241
|
+
};
|
|
7047
8242
|
}
|
|
7048
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: ButtonComponent, decorators: [{
|
|
7049
|
-
type: Component,
|
|
7050
|
-
args: [{ selector: 'm-button,m-one-button', imports: [
|
|
7051
|
-
forwardRef(() => TranslatePipe),
|
|
7052
|
-
forwardRef(() => IconComponent),
|
|
7053
|
-
forwardRef(() => BadgeComponent),
|
|
7054
|
-
RouterModule,
|
|
7055
|
-
MRefDirective,
|
|
7056
|
-
forwardRef(() => NgTemplateOutlet),
|
|
7057
|
-
forwardRef(() => ImgComponent),
|
|
7058
|
-
], encapsulation: ViewEncapsulation.Emulated, changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (config(); as config) {\n <!-- One branch for every in-app target: `mRef` names a NavId and the store\n reads the NavKind off that node to decide route vs panel (ADR 0014). -->\n @if (config.nav) {\n @if (!noNative()) {\n <button\n type=\"button\"\n class=\"{{ className() }}\"\n [attr.data-testid]=\"config.name + '-btn'\"\n [attr.tabindex]=\"config.tabindex\"\n [disabled]=\"config.disabled\"\n [mRef]=\"config.nav\"\n [mRefParams]=\"config.navParams\"\n [attr.aria-label]=\"config.noTranslate ? config.label : (config.label | translate: config.params)\"\n mRefLinkActive=\"tab\"\n (keydown.enter)=\"onClick()\"\n (click)=\"onClick()\"\n #button\n >\n <ng-container *ngTemplateOutlet=\"buttonContent; context: { button: config }\"></ng-container>\n </button>\n } @else {\n <div\n role=\"button\"\n [attr.tabindex]=\"config.tabindex ?? 0\"\n class=\"non-native {{ className() }}\"\n [attr.data-testid]=\"config.name + '-btn'\"\n [attr.aria-label]=\"config.noTranslate ? config.label : (config.label | translate: config.params)\"\n [attr.aria-disabled]=\"config.disabled ? 'true' : 'false'\"\n (keydown.enter)=\"onClick()\"\n (click)=\"onClick()\"\n #button\n >\n <ng-container *ngTemplateOutlet=\"buttonContent; context: { button: config }\"></ng-container>\n </div>\n }\n } @else if (config.href) {\n <a\n class=\"{{ className() }}\"\n [attr.data-testid]=\"config.name + '-btn'\"\n [attr.tabindex]=\"config.tabindex\"\n [href]=\"config.href\"\n [attr.aria-label]=\"config.noTranslate ? config.label : (config.label | translate: config.params)\"\n (click)=\"onClick()\"\n #button\n >\n <ng-container *ngTemplateOutlet=\"buttonContent; context: { button: config }\"></ng-container>\n </a>\n } @else {\n @if (!noNative()) {\n <button\n type=\"button\"\n class=\"{{ className() }}\"\n [attr.data-testid]=\"config.name + '-btn'\"\n [attr.tabindex]=\"config.tabindex\"\n [disabled]=\"isDisabled()\"\n [attr.aria-label]=\"config.noTranslate ? config.label : (config.label | translate: config.params)\"\n (keydown.enter)=\"onClick()\"\n (click)=\"onClick()\"\n #button\n >\n <ng-container *ngTemplateOutlet=\"buttonContent; context: { button: config }\"></ng-container>\n </button>\n } @else {\n <div\n role=\"button\"\n [attr.tabindex]=\"config.tabindex ?? 0\"\n class=\"non-native {{ className() }}\"\n [attr.data-testid]=\"config.name + '-btn'\"\n [attr.aria-label]=\"config.noTranslate ? config.label : (config.label | translate: config.params)\"\n [attr.aria-disabled]=\"isDisabled() ? 'true' : 'false'\"\n (keydown.enter)=\"onClick()\"\n (click)=\"onClick()\"\n #button\n >\n <ng-container *ngTemplateOutlet=\"buttonContent; context: { button: config }\"></ng-container>\n </div>\n }\n }\n}\n\n<ng-template #buttonContent let-button=\"button\">\n @if (button.imgSrc) {\n <div class=\"button-icon button-icon--img\">\n <m-img [src]=\"button.imgSrc\" [remote]=\"button.remote\" [alt]=\"button.label || button.name || ''\" />\n @if (button.badge && button.badge.count) {\n <m-badge\n [config]=\"{ variant: button.badge.variant ?? 'danger', position: 'absolute' }\"\n >{{ formatBadgeCount(button.badge.count) }}</m-badge\n >\n }\n </div>\n } @else if (buttonIcon(); as icon) {\n <div class=\"button-icon\">\n @if (isFromOne()) {\n <m-one-icon [config]=\"icon\" />\n } @else {\n <m-icon [config]=\"icon\" />\n }\n @if (button.badge && button.badge.count) {\n <m-badge\n [config]=\"{ variant: button.badge.variant ?? 'danger', position: 'absolute' }\"\n >{{ formatBadgeCount(button.badge.count) }}</m-badge\n >\n }\n </div>\n }\n @if (button.label && !button.iconOnly) {\n <span class=\"button-label {{ button.labelClass || '' }}\">\n {{ button.noTranslate ? button.label : (button.label | translate: button.params) }}\n </span>\n }\n @if (!buttonIcon() && button.badge && button.badge.count) {\n <m-badge [config]=\"{ variant: button.badge.variant ?? 'danger', position: 'static' }\">{{\n formatBadgeCount(button.badge.count)\n }}</m-badge>\n }\n</ng-template>\n", styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}:host{display:inline-flex;align-items:center;justify-content:center;vertical-align:middle;box-sizing:border-box;overflow:hidden;transition:box-shadow .15s ease;--m-btn-size: var(--m-button-size, 1em);--m-btn-color: var(--m-button-color, var(--m-one-button-color, var(--m-mm)));--m-btn-color-contrast: var(--m-button-color-contrast, var(--m-one-button-color-contrast, #ffffff));--m-btn-color-opposite: var(--m-button-color-opposite, var(--m-one-button-color-opposite, #e1b941));--m-btn-h: calc(var(--m-btn-size) * 2.25);width:var(--m-button-width, var(--m-one-button-width, auto));min-width:0;height:var(--m-btn-h);font-size:var(--m-btn-size)}:host-context(.inverse),:host-context(.tabs-inverse),:host.inverse{--m-btn-color: var(--m-button-color, var(--m-one-button-color, var(--m-inverse-text)))}:host:has(.full-width){display:flex;width:100%}:host:has(.full-width) button .button-label{white-space:normal;overflow:visible;text-overflow:clip;word-break:break-word}:host:has(.only-icon),:host:has(.toggle){width:var(--m-btn-h);min-width:var(--m-btn-h)}:host:has(.has-badge){overflow:visible}:host:has(.stacked),:host:has(.toggle){height:auto}button:not(.get):not(.toggle){height:calc(var(--input-size, var(--m-btn-size)) * 2);min-height:calc(var(--input-size, var(--m-btn-size)) * 2);border-width:max(1px,var(--input-size, var(--m-btn-size)) * .0625);border-radius:calc(var(--input-size, var(--m-btn-size)) * .4);padding:calc(var(--input-size, var(--m-btn-size)) * .5) calc(var(--input-size, var(--m-btn-size)) * .5);gap:calc(var(--input-size, var(--m-btn-size)) * .375);font-size:var(--input-size, var(--m-btn-size));border-color:var(--m-btn-color);transition:border-color .2s ease,box-shadow .2s ease,background-color .2s ease,opacity .2s ease}button:not(.get):not(.toggle):hover:not(:disabled){background-color:color-mix(in srgb,var(--m-btn-color) 6%,transparent)}button:not(.get):not(.toggle):disabled{opacity:.6;cursor:not-allowed}button:not(.get):not(.toggle){height:auto;padding:calc(var(--m-btn-size) * .625) calc(var(--m-btn-size) * 1.25);gap:calc(var(--m-btn-size) * .375);border-style:solid;display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;font-family:inherit;cursor:pointer;appearance:none;width:100%;height:100%;min-height:0;padding:0 calc(var(--m-btn-size) * 1.25);border-width:var(--m-button-border-width, 1px);border-radius:var(--m-button-radius, calc(var(--m-btn-size) * .5));color:var(--m-btn-color);font-weight:300;line-height:1;-webkit-user-select:none;user-select:none;position:relative;outline:none;box-shadow:var(--m-button-shadow, var(--m-one-button-shadow, none));transition:filter .15s ease,background .15s ease}button:not(.get):not(.toggle):hover:not(:disabled){filter:brightness(1.04)}button:not(.get):not(.toggle):focus-visible:not(:disabled){outline:2px solid color-mix(in srgb,var(--m-focus) 45%,transparent);outline-offset:-2px}button:not(.get):not(.toggle):active:not(:disabled){transform:scale(.97)}button:not(.get):not(.toggle):disabled{opacity:.35;cursor:not-allowed;pointer-events:none;filter:grayscale(80%)}button:not(.get):not(.toggle).read-only{pointer-events:none!important;cursor:default!important;transform:none!important;box-shadow:none!important;background:transparent!important;border-color:transparent!important;opacity:1!important}button:not(.get):not(.toggle).read-only .button-icon{transform:none!important;color:inherit!important}button:not(.get):not(.toggle).primary{background:var(--m-btn-color);border-color:var(--m-btn-color);color:var(--m-btn-color-contrast)}button:not(.get):not(.toggle).primary:hover:not(:disabled){filter:none;background:color-mix(in srgb,var(--m-btn-color) 88%,black);border-color:color-mix(in srgb,var(--m-btn-color) 88%,black)}button:not(.get):not(.toggle).primary:active:not(:disabled){filter:brightness(.94);transform:scale(.97)}button:not(.get):not(.toggle).ghost:not(.primary):not(.tab){background:transparent;border-color:transparent;color:var(--m-btn-color);box-shadow:none}button:not(.get):not(.toggle).ghost:not(.primary):not(.tab):hover:not(:disabled){filter:none;background:color-mix(in srgb,var(--m-btn-color) 8%,transparent)}button:not(.get):not(.toggle).ghost:not(.primary):not(.tab):active:not(:disabled){background:color-mix(in srgb,var(--m-btn-color) 14%,transparent);transform:scale(.97)}button:not(.get):not(.toggle).ghost:not(.primary):not(.tab).secondary{border:var(--m-button-border-width, 1px) solid color-mix(in srgb,var(--m-btn-color) 15%,transparent)}button:not(.get):not(.toggle).ghost:not(.primary):not(.tab).secondary:hover:not(:disabled){filter:none;border-color:color-mix(in srgb,var(--m-btn-color) 40%,transparent);background:color-mix(in srgb,var(--m-btn-color) 6%,transparent)}button:not(.get):not(.toggle).ghost:not(.primary):not(.tab).secondary:active:not(:disabled){border-color:color-mix(in srgb,var(--m-btn-color) 50%,transparent);background:color-mix(in srgb,var(--m-btn-color) 12%,transparent)}button:not(.get):not(.toggle).secondary:not(.primary):not(.ghost){background:transparent;border-color:var(--m-btn-color);color:var(--m-btn-color)}button:not(.get):not(.toggle).secondary:not(.primary):not(.ghost):hover:not(:disabled){filter:none;background:color-mix(in srgb,var(--m-btn-color) 8%,transparent)}button:not(.get):not(.toggle).secondary:not(.primary):not(.ghost):active:not(:disabled){background:color-mix(in srgb,var(--m-btn-color) 14%,transparent);transform:scale(.97)}button:not(.get):not(.toggle).tab{background:var(--m-backdrop-border);border-color:var(--m-backdrop-border);color:var(--m-btn-color)}button:not(.get):not(.toggle).tab:hover:not(:disabled){background:color-mix(in srgb,var(--m-backdrop-border) 82%,black);border-color:color-mix(in srgb,var(--m-backdrop-border) 82%,black);filter:none}button:not(.get):not(.toggle).tab:active:not(:disabled){background:color-mix(in srgb,var(--m-backdrop-border) 70%,black);border-color:color-mix(in srgb,var(--m-backdrop-border) 70%,black);transform:scale(.97)}button:not(.get):not(.toggle).segmented .button-icon,button:not(.get):not(.toggle).badge-accent .button-icon,button:not(.get):not(.toggle).with-right-icon .button-icon{display:inline-flex;align-items:center;justify-content:center;color:var(--m-btn-color-opposite);order:1}button:not(.get):not(.toggle).segmented .button-label,button:not(.get):not(.toggle).badge-accent .button-label,button:not(.get):not(.toggle).with-right-icon .button-label{order:-1}button:not(.get):not(.toggle).segmented.primary .button-icon,button:not(.get):not(.toggle).badge-accent.primary .button-icon,button:not(.get):not(.toggle).with-right-icon.primary .button-icon{color:var(--m-btn-color-opposite)}button:not(.get):not(.toggle).with-left-icon .button-icon{order:-1}button:not(.get):not(.toggle).with-left-icon .button-label{order:1}button:not(.get):not(.toggle).stacked{flex-direction:column;gap:calc(var(--m-btn-size) * .3);height:auto;min-height:var(--m-btn-h);padding:calc(var(--m-btn-size) * .625) calc(var(--m-btn-size) * .875)}button:not(.get):not(.toggle).stacked .button-label{font-size:calc(var(--m-btn-size) * .8)}button:not(.get):not(.toggle).only-icon{padding:0;border-width:var(--m-button-border-width, 1px);aspect-ratio:1;display:inline-flex;align-items:center;justify-content:center}button:not(.get):not(.toggle).only-icon m-icon,button:not(.get):not(.toggle).only-icon m-one-icon{display:inline-flex}m-badge{--m-badge-height: 1.5em;--m-badge-min-width: 1.5em;--m-badge-padding: 0 .3em;--m-badge-gap: .1em}.button-label{display:inline-flex;align-items:center;line-height:normal;font-size:inherit;min-width:0;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.button-icon{position:relative;display:inline-flex;align-items:center;justify-content:center}.button-icon--img{width:calc(var(--m-btn-size) * 1.75);height:calc(var(--m-btn-size) * 1.75);overflow:hidden}.button-icon--img m-img{width:100%;height:100%;display:block}.get{appearance:none;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;height:var(--m-btn-h);padding:0 min(var(--m-btn-size) * 1.75,2rem);border-radius:4px;background:linear-gradient(135deg,var(--m-mm),var(--m-focus),var(--m-success),var(--m-mm));background-size:200% auto;color:#fff;font-size:calc(var(--m-btn-size) * .8);font-weight:300;letter-spacing:.06em;text-transform:uppercase;border:none;cursor:pointer;white-space:nowrap;line-height:1;transition:background-position .2s ease,transform .15s ease}.get:hover{background-position:right center}.get:focus-visible{outline:2px solid color-mix(in srgb,var(--m-focus) 45%,transparent);outline-offset:-2px}.get:active{transform:scale(.97)}.toggle{appearance:none;display:inline-flex;align-items:center;justify-content:center;width:100%;height:100%;border:none;background:transparent;padding:0 min(var(--m-btn-size),1.25rem);border-radius:var(--m-button-radius, calc(var(--m-btn-size) * .375));box-shadow:none;color:var(--m-btn-color, var(--m-text-secondary));opacity:.65;font-family:inherit;font-size:var(--m-btn-size);font-weight:300;cursor:pointer;box-sizing:border-box;-webkit-user-select:none;user-select:none;transition:background .15s ease,color .15s ease,opacity .15s ease;min-width:0}.toggle .button-icon{flex-shrink:0}.toggle .button-label{display:inline-block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;min-width:0}.toggle:hover:not(:disabled){background:var(--m-button-hover-background, color-mix(in srgb, var(--m-focus) 8%, transparent));color:var(--m-button-hover-color, var(--m-text));opacity:1}.toggle:focus-visible:not(:disabled){outline:2px solid color-mix(in srgb,var(--m-focus) 45%,transparent);outline-offset:-2px;opacity:1}.toggle.primary{background:var(--m-button-active-background, var(--m-mm));color:var(--m-button-active-color, #ffffff);opacity:1}.toggle.primary:hover:not(:disabled){background:var(--m-button-active-background, var(--m-mm));color:var(--m-button-active-color, #ffffff);opacity:1}.toggle.primary:active:not(:disabled){transform:scale(.97)}.non-native:not(.get):not(.toggle){appearance:none;display:inline-flex;align-items:center;justify-content:center;width:100%;height:100%;min-height:0;padding:0 calc(var(--m-btn-size) * 1.25);border-width:2px;border-radius:4px;color:var(--m-btn-color);font-weight:300;line-height:1;-webkit-user-select:none;user-select:none;position:relative;outline:none;box-shadow:var(--m-button-shadow, var(--m-one-button-shadow, none));transition:filter .15s ease,background .15s ease}.non-native:not(.get):not(.toggle):hover:not([aria-disabled=true]){filter:brightness(1.04)}.non-native:not(.get):not(.toggle):focus-visible:not([aria-disabled=true]){outline:2px solid color-mix(in srgb,var(--m-focus) 45%,transparent);outline-offset:-2px}.non-native:not(.get):not(.toggle):active:not([aria-disabled=true]){transform:scale(.97)}.non-native:not(.get):not(.toggle)[aria-disabled=true]{opacity:.35;cursor:not-allowed;pointer-events:none;filter:grayscale(80%)}.non-native:not(.get):not(.toggle).primary{background:var(--m-btn-color);border-color:var(--m-btn-color);color:var(--m-btn-color-contrast)}.non-native:not(.get):not(.toggle).primary:hover:not([aria-disabled=true]){filter:none;background:color-mix(in srgb,var(--m-btn-color) 88%,black);border-color:color-mix(in srgb,var(--m-btn-color) 88%,black)}.non-native:not(.get):not(.toggle).primary:active:not([aria-disabled=true]){filter:brightness(.94);transform:scale(.97)}.non-native:not(.get):not(.toggle).ghost:not(.primary):not(.tab){background:transparent;border-color:transparent;color:var(--m-btn-color);box-shadow:none}.non-native:not(.get):not(.toggle).ghost:not(.primary):not(.tab):hover:not([aria-disabled=true]){filter:none;background:color-mix(in srgb,var(--m-btn-color) 8%,transparent)}.non-native:not(.get):not(.toggle).ghost:not(.primary):not(.tab):active:not([aria-disabled=true]){background:color-mix(in srgb,var(--m-btn-color) 14%,transparent);transform:scale(.97)}.non-native:not(.get):not(.toggle):disabled{opacity:.3;cursor:not-allowed}@container togglegroup (max-width: 320px){.non-native:not(.get):not(.toggle).with-left-icon .button-label,.non-native:not(.get):not(.toggle).with-right-icon .button-label{display:none!important}}@media(max-width:600px){.non-native:not(.get):not(.toggle).with-left-icon .button-label,.non-native:not(.get):not(.toggle).with-right-icon .button-label{display:none!important}}\n"] }]
|
|
7059
|
-
}], ctorParameters: () => [], propDecorators: { config: [{ type: i0.Input, args: [{ isSignal: true, alias: "config", required: false }] }, { type: i0.Output, args: ["configChange"] }], color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }], labelClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelClass", required: false }] }], fullWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "fullWidth", required: false }] }], nav: [{ type: i0.Input, args: [{ isSignal: true, alias: "nav", required: false }] }], navParams: [{ type: i0.Input, args: [{ isSignal: true, alias: "navParams", required: false }] }], href: [{ type: i0.Input, args: [{ isSignal: true, alias: "href", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: false }] }], baseUrl: [{ type: i0.Input, args: [{ isSignal: true, alias: "baseUrl", required: false }] }], one: [{ type: i0.Input, args: [{ isSignal: true, alias: "one", required: false }] }], remote: [{ type: i0.Input, args: [{ isSignal: true, alias: "remote", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], noTranslate: [{ type: i0.Input, args: [{ isSignal: true, alias: "noTranslate", required: false }] }], params: [{ type: i0.Input, args: [{ isSignal: true, alias: "params", required: false }] }], noNative: [{ type: i0.Input, args: [{ isSignal: true, alias: "noNative", required: false }] }], icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], isRightIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "isRightIcon", required: false }] }], iconOnly: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconOnly", required: false }] }], stacked: [{ type: i0.Input, args: [{ isSignal: true, alias: "stacked", required: false }] }], imgSrc: [{ type: i0.Input, args: [{ isSignal: true, alias: "imgSrc", required: false }] }], nonClickable: [{ type: i0.Input, args: [{ isSignal: true, alias: "nonClickable", required: false }] }], inverted: [{ type: i0.Input, args: [{ isSignal: true, alias: "inverted", required: false }] }], isSubmit: [{ type: i0.Input, args: [{ isSignal: true, alias: "isSubmit", required: false }] }], tabindex: [{ type: i0.Input, args: [{ isSignal: true, alias: "tabindex", required: false }] }], clicked: [{ type: i0.Output, args: ["clicked"] }], button: [{ type: i0.ViewChild, args: ['button', { isSignal: true }] }] } });
|
|
7060
8243
|
|
|
7061
8244
|
/**
|
|
7062
8245
|
* Sugar: a variant expands to a justify + align pair. Explicit `justify` /
|
|
@@ -7751,7 +8934,7 @@ class SectionFormItemComponent extends ConfigComponent {
|
|
|
7751
8934
|
break;
|
|
7752
8935
|
}
|
|
7753
8936
|
case InputType.TOGGLE: {
|
|
7754
|
-
const { ToggleInputComponent } = await import('./magmonium-one-toggle-
|
|
8937
|
+
const { ToggleInputComponent } = await import('./magmonium-one-toggle-CpMURu38.mjs');
|
|
7755
8938
|
this.createDynamicComponent(seq, ToggleInputComponent, [], true);
|
|
7756
8939
|
break;
|
|
7757
8940
|
}
|
|
@@ -7763,12 +8946,12 @@ class SectionFormItemComponent extends ConfigComponent {
|
|
|
7763
8946
|
break;
|
|
7764
8947
|
}
|
|
7765
8948
|
case InputType.PASSWORD: {
|
|
7766
|
-
const { PasswordInputComponent } = await import('./magmonium-one-password-
|
|
8949
|
+
const { PasswordInputComponent } = await import('./magmonium-one-password-CyHOns1l.mjs');
|
|
7767
8950
|
this.createDynamicComponent(seq, PasswordInputComponent);
|
|
7768
8951
|
break;
|
|
7769
8952
|
}
|
|
7770
8953
|
case InputType.OTP: {
|
|
7771
|
-
const { OtpInputComponent } = await import('./magmonium-one-otp-
|
|
8954
|
+
const { OtpInputComponent } = await import('./magmonium-one-otp-BwXKEaEg.mjs');
|
|
7772
8955
|
this.createDynamicComponent(seq, OtpInputComponent);
|
|
7773
8956
|
break;
|
|
7774
8957
|
}
|
|
@@ -9400,6 +10583,11 @@ class MenuComponent {
|
|
|
9400
10583
|
this.#focusPending = this.#hasFocus();
|
|
9401
10584
|
return;
|
|
9402
10585
|
}
|
|
10586
|
+
// A row naming a Nav goes there itself — the NavKind on that node decides
|
|
10587
|
+
// whether it routes or opens a panel, the answer `[mRef]` gives (CONTEXT.md
|
|
10588
|
+
// NavRef). Still emitted, so whatever holds the menu closes it.
|
|
10589
|
+
if (item.nav)
|
|
10590
|
+
this.#navRef?.setSelected(item.nav, undefined, item.keepPanel ? { keepPanel: true } : undefined);
|
|
9403
10591
|
this.action.emit(item);
|
|
9404
10592
|
}
|
|
9405
10593
|
goBack() {
|
|
@@ -9570,214 +10758,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
|
|
|
9570
10758
|
}]
|
|
9571
10759
|
}], propDecorators: { toggle: [{ type: i0.Input, args: [{ isSignal: true, alias: "toggle", required: false }] }, { type: i0.Output, args: ["toggleChange"] }], remote: [{ type: i0.Input, args: [{ isSignal: true, alias: "remote", required: false }] }], exclude: [{ type: i0.Input, args: [{ isSignal: true, alias: "exclude", required: false }] }], visibilityRule: [{ type: i0.Input, args: [{ isSignal: true, alias: "visibilityRule", required: false }] }], disableRule: [{ type: i0.Input, args: [{ isSignal: true, alias: "disableRule", required: false }] }], extraData: [{ type: i0.Input, args: [{ isSignal: true, alias: "extraData", required: false }] }], inverted: [{ type: i0.Input, args: [{ isSignal: true, alias: "inverted", required: false }] }], options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: false }] }], action: [{ type: i0.Output, args: ["action"] }], selectorDir: [{ type: i0.ViewChild, args: [i0.forwardRef(() => SelectorDirective), { isSignal: true }] }] } });
|
|
9572
10760
|
|
|
9573
|
-
let HeaderComponent$1 = class HeaderComponent {
|
|
9574
|
-
level = input(3, ...(ngDevMode ? [{ debugName: "level" }] : /* istanbul ignore next */ []));
|
|
9575
|
-
label = input(...(ngDevMode ? [undefined, { debugName: "label" }] : /* istanbul ignore next */ []));
|
|
9576
|
-
// Drawn inside the heading rather than beside it. A glyph placed as the
|
|
9577
|
-
// heading's sibling has no line box of its own to centre against — it ends
|
|
9578
|
-
// up centred on whatever column it sits next to, which is how a Canvas
|
|
9579
|
-
// header's icon came to line up with the label slot's drop rect instead of
|
|
9580
|
-
// with the label. Inside, the two share one line box at every level.
|
|
9581
|
-
icon = input(...(ngDevMode ? [undefined, { debugName: "icon" }] : /* istanbul ignore next */ []));
|
|
9582
|
-
actionButton = input(...(ngDevMode ? [undefined, { debugName: "actionButton" }] : /* istanbul ignore next */ []));
|
|
9583
|
-
// The action Button's accessible name. It renders icon-only, so the label is
|
|
9584
|
-
// the only thing a screen reader has to go on — without it the button reads
|
|
9585
|
-
// as nothing at all.
|
|
9586
|
-
actionLabel = input(...(ngDevMode ? [undefined, { debugName: "actionLabel" }] : /* istanbul ignore next */ []));
|
|
9587
|
-
// The label is authored text rather than a translation key. Needed for text
|
|
9588
|
-
// carrying angle brackets above all: `translate` reads `<...>` as link
|
|
9589
|
-
// markup, so a heading naming a MessageVariable — `<$app>` — resolves to
|
|
9590
|
-
// nothing at all rather than to itself.
|
|
9591
|
-
noTranslate = input(false, ...(ngDevMode ? [{ debugName: "noTranslate" }] : /* istanbul ignore next */ []));
|
|
9592
|
-
// A message's [MessageVariable] values, the same record `m-text-output`
|
|
9593
|
-
// takes: a heading naming `<$count>` is a sentence with a datum in it, and
|
|
9594
|
-
// splicing that datum into the key instead would be parsed as a query
|
|
9595
|
-
// string (m-one-ui ADR 0066).
|
|
9596
|
-
params = input(undefined, ...(ngDevMode ? [{ debugName: "params" }] : /* istanbul ignore next */ []));
|
|
9597
|
-
actionClick = output();
|
|
9598
|
-
translateService = inject(TranslateService);
|
|
9599
|
-
sizeContext = inject(SIZE_CONTEXT, { optional: true });
|
|
9600
|
-
// The action Button sits inside the heading, whose font-size is the level's
|
|
9601
|
-
// own — 2.25rem at h1 — so `em` inheritance would scale the Button to the
|
|
9602
|
-
// heading rather than to the Section it belongs to. It reads the Size in
|
|
9603
|
-
// force instead, the way Icon does, and lands at the same size as every
|
|
9604
|
-
// other Button on that Section (ADR 0008).
|
|
9605
|
-
actionSize = computed(() => resolveSize(this.sizeContext?.size()), ...(ngDevMode ? [{ debugName: "actionSize" }] : /* istanbul ignore next */ []));
|
|
9606
|
-
actionConfig = computed(() => {
|
|
9607
|
-
const icon = this.actionButton();
|
|
9608
|
-
if (!icon)
|
|
9609
|
-
return undefined;
|
|
9610
|
-
return {
|
|
9611
|
-
icon,
|
|
9612
|
-
label: this.actionLabel(),
|
|
9613
|
-
iconOnly: true,
|
|
9614
|
-
variant: 'ghost',
|
|
9615
|
-
};
|
|
9616
|
-
}, ...(ngDevMode ? [{ debugName: "actionConfig" }] : /* istanbul ignore next */ []));
|
|
9617
|
-
// A computed rather than the impure TranslatePipe repeated six times: one
|
|
9618
|
-
// lookup per label change instead of one per change-detection tick, and it
|
|
9619
|
-
// still repaints when the language or an in-memory translation moves.
|
|
9620
|
-
text = computed(() => this.noTranslate()
|
|
9621
|
-
? (this.label() ?? '')
|
|
9622
|
-
: this.translateService.translate(this.label(), this.params()), ...(ngDevMode ? [{ debugName: "text" }] : /* istanbul ignore next */ []));
|
|
9623
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: HeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
9624
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: HeaderComponent, isStandalone: true, selector: "m-header", inputs: { level: { classPropertyName: "level", publicName: "level", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, actionButton: { classPropertyName: "actionButton", publicName: "actionButton", isSignal: true, isRequired: false, transformFunction: null }, actionLabel: { classPropertyName: "actionLabel", publicName: "actionLabel", isSignal: true, isRequired: false, transformFunction: null }, noTranslate: { classPropertyName: "noTranslate", publicName: "noTranslate", isSignal: true, isRequired: false, transformFunction: null }, params: { classPropertyName: "params", publicName: "params", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { actionClick: "actionClick" }, ngImport: i0, template: `
|
|
9625
|
-
@switch (level()) {
|
|
9626
|
-
@case (1) {
|
|
9627
|
-
<h1 class="header__heading">
|
|
9628
|
-
@if (icon(); as iconName) {
|
|
9629
|
-
<m-icon class="header__icon" [name]="iconName" />
|
|
9630
|
-
}
|
|
9631
|
-
<span>{{ text() }}</span>
|
|
9632
|
-
<ng-content />
|
|
9633
|
-
@if (actionConfig(); as action) {
|
|
9634
|
-
<m-button class="header__action" [config]="action" [style.--m-button-size]="actionSize()" (clicked)="actionClick.emit()" />
|
|
9635
|
-
}
|
|
9636
|
-
</h1>
|
|
9637
|
-
}
|
|
9638
|
-
@case (2) {
|
|
9639
|
-
<h2 class="header__heading">
|
|
9640
|
-
@if (icon(); as iconName) {
|
|
9641
|
-
<m-icon class="header__icon" [name]="iconName" />
|
|
9642
|
-
}
|
|
9643
|
-
<span>{{ text() }}</span>
|
|
9644
|
-
<ng-content />
|
|
9645
|
-
@if (actionConfig(); as action) {
|
|
9646
|
-
<m-button class="header__action" [config]="action" [style.--m-button-size]="actionSize()" (clicked)="actionClick.emit()" />
|
|
9647
|
-
}
|
|
9648
|
-
</h2>
|
|
9649
|
-
}
|
|
9650
|
-
@case (3) {
|
|
9651
|
-
<h3 class="header__heading">
|
|
9652
|
-
@if (icon(); as iconName) {
|
|
9653
|
-
<m-icon class="header__icon" [name]="iconName" />
|
|
9654
|
-
}
|
|
9655
|
-
<span>{{ text() }}</span>
|
|
9656
|
-
<ng-content />
|
|
9657
|
-
@if (actionConfig(); as action) {
|
|
9658
|
-
<m-button class="header__action" [config]="action" [style.--m-button-size]="actionSize()" (clicked)="actionClick.emit()" />
|
|
9659
|
-
}
|
|
9660
|
-
</h3>
|
|
9661
|
-
}
|
|
9662
|
-
@case (4) {
|
|
9663
|
-
<h4 class="header__heading">
|
|
9664
|
-
@if (icon(); as iconName) {
|
|
9665
|
-
<m-icon class="header__icon" [name]="iconName" />
|
|
9666
|
-
}
|
|
9667
|
-
<span>{{ text() }}</span>
|
|
9668
|
-
<ng-content />
|
|
9669
|
-
@if (actionConfig(); as action) {
|
|
9670
|
-
<m-button class="header__action" [config]="action" [style.--m-button-size]="actionSize()" (clicked)="actionClick.emit()" />
|
|
9671
|
-
}
|
|
9672
|
-
</h4>
|
|
9673
|
-
}
|
|
9674
|
-
@case (5) {
|
|
9675
|
-
<h5 class="header__heading">
|
|
9676
|
-
@if (icon(); as iconName) {
|
|
9677
|
-
<m-icon class="header__icon" [name]="iconName" />
|
|
9678
|
-
}
|
|
9679
|
-
<span>{{ text() }}</span>
|
|
9680
|
-
<ng-content />
|
|
9681
|
-
@if (actionConfig(); as action) {
|
|
9682
|
-
<m-button class="header__action" [config]="action" [style.--m-button-size]="actionSize()" (clicked)="actionClick.emit()" />
|
|
9683
|
-
}
|
|
9684
|
-
</h5>
|
|
9685
|
-
}
|
|
9686
|
-
@case (6) {
|
|
9687
|
-
<h6 class="header__heading">
|
|
9688
|
-
@if (icon(); as iconName) {
|
|
9689
|
-
<m-icon class="header__icon" [name]="iconName" />
|
|
9690
|
-
}
|
|
9691
|
-
<span>{{ text() }}</span>
|
|
9692
|
-
<ng-content />
|
|
9693
|
-
@if (actionConfig(); as action) {
|
|
9694
|
-
<m-button class="header__action" [config]="action" [style.--m-button-size]="actionSize()" (clicked)="actionClick.emit()" />
|
|
9695
|
-
}
|
|
9696
|
-
</h6>
|
|
9697
|
-
}
|
|
9698
|
-
}
|
|
9699
|
-
`, isInline: true, styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}.header__heading{display:flex;flex-direction:row;align-items:center;justify-content:var(--m-header-justify, flex-start);gap:.75rem;margin:0;padding:0;line-height:1.1;font-weight:800;letter-spacing:-.025em;color:var(--m-header-color, var(--m-text));transition:transform .2s cubic-bezier(.4,0,.2,1)}.header__heading:hover{transform:translate(2px)}.header__icon{flex-shrink:0}.header__action{margin-left:auto}.header__action span{display:inline-block;vertical-align:middle}h1.header__heading{font-size:var(--m-header-font-size, 2.25rem);font-weight:300;color:var(--m-text-quaternary);letter-spacing:-.035em;line-height:1.15}h2.header__heading{font-size:var(--m-header-font-size, 1.75rem);font-weight:300;color:var(--m-text-tertiary);letter-spacing:-.03em;line-height:1.2}h3.header__heading{font-size:var(--m-header-font-size, 1.375rem);font-weight:400;color:var(--m-text-secondary);letter-spacing:-.025em}h4.header__heading{font-size:var(--m-header-font-size, 1.125rem);font-weight:500;color:var(--m-text);letter-spacing:-.02em}h5.header__heading{font-size:var(--m-header-font-size, 1rem);font-weight:600;color:var(--m-text);letter-spacing:-.01em}h6.header__heading{font-size:var(--m-header-font-size, .875rem);font-weight:600;color:var(--m-text);letter-spacing:.05em;text-transform:uppercase}\n"], dependencies: [{ kind: "component", type: ButtonComponent, selector: "m-button,m-one-button", inputs: ["config", "color", "labelClass", "fullWidth", "nav", "navParams", "href", "disabled", "variant", "name", "baseUrl", "one", "remote", "label", "noTranslate", "params", "noNative", "icon", "isRightIcon", "iconOnly", "stacked", "imgSrc", "nonClickable", "inverted", "isSubmit", "tabindex"], outputs: ["configChange", "clicked"] }, { kind: "component", type: IconComponent, selector: "m-icon, m-one-icon", inputs: ["config", "name", "color", "size", "one", "baseUrl", "remote"], outputs: ["configChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
9700
|
-
};
|
|
9701
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: HeaderComponent$1, decorators: [{
|
|
9702
|
-
type: Component,
|
|
9703
|
-
args: [{ selector: 'm-header', imports: [ButtonComponent, IconComponent], template: `
|
|
9704
|
-
@switch (level()) {
|
|
9705
|
-
@case (1) {
|
|
9706
|
-
<h1 class="header__heading">
|
|
9707
|
-
@if (icon(); as iconName) {
|
|
9708
|
-
<m-icon class="header__icon" [name]="iconName" />
|
|
9709
|
-
}
|
|
9710
|
-
<span>{{ text() }}</span>
|
|
9711
|
-
<ng-content />
|
|
9712
|
-
@if (actionConfig(); as action) {
|
|
9713
|
-
<m-button class="header__action" [config]="action" [style.--m-button-size]="actionSize()" (clicked)="actionClick.emit()" />
|
|
9714
|
-
}
|
|
9715
|
-
</h1>
|
|
9716
|
-
}
|
|
9717
|
-
@case (2) {
|
|
9718
|
-
<h2 class="header__heading">
|
|
9719
|
-
@if (icon(); as iconName) {
|
|
9720
|
-
<m-icon class="header__icon" [name]="iconName" />
|
|
9721
|
-
}
|
|
9722
|
-
<span>{{ text() }}</span>
|
|
9723
|
-
<ng-content />
|
|
9724
|
-
@if (actionConfig(); as action) {
|
|
9725
|
-
<m-button class="header__action" [config]="action" [style.--m-button-size]="actionSize()" (clicked)="actionClick.emit()" />
|
|
9726
|
-
}
|
|
9727
|
-
</h2>
|
|
9728
|
-
}
|
|
9729
|
-
@case (3) {
|
|
9730
|
-
<h3 class="header__heading">
|
|
9731
|
-
@if (icon(); as iconName) {
|
|
9732
|
-
<m-icon class="header__icon" [name]="iconName" />
|
|
9733
|
-
}
|
|
9734
|
-
<span>{{ text() }}</span>
|
|
9735
|
-
<ng-content />
|
|
9736
|
-
@if (actionConfig(); as action) {
|
|
9737
|
-
<m-button class="header__action" [config]="action" [style.--m-button-size]="actionSize()" (clicked)="actionClick.emit()" />
|
|
9738
|
-
}
|
|
9739
|
-
</h3>
|
|
9740
|
-
}
|
|
9741
|
-
@case (4) {
|
|
9742
|
-
<h4 class="header__heading">
|
|
9743
|
-
@if (icon(); as iconName) {
|
|
9744
|
-
<m-icon class="header__icon" [name]="iconName" />
|
|
9745
|
-
}
|
|
9746
|
-
<span>{{ text() }}</span>
|
|
9747
|
-
<ng-content />
|
|
9748
|
-
@if (actionConfig(); as action) {
|
|
9749
|
-
<m-button class="header__action" [config]="action" [style.--m-button-size]="actionSize()" (clicked)="actionClick.emit()" />
|
|
9750
|
-
}
|
|
9751
|
-
</h4>
|
|
9752
|
-
}
|
|
9753
|
-
@case (5) {
|
|
9754
|
-
<h5 class="header__heading">
|
|
9755
|
-
@if (icon(); as iconName) {
|
|
9756
|
-
<m-icon class="header__icon" [name]="iconName" />
|
|
9757
|
-
}
|
|
9758
|
-
<span>{{ text() }}</span>
|
|
9759
|
-
<ng-content />
|
|
9760
|
-
@if (actionConfig(); as action) {
|
|
9761
|
-
<m-button class="header__action" [config]="action" [style.--m-button-size]="actionSize()" (clicked)="actionClick.emit()" />
|
|
9762
|
-
}
|
|
9763
|
-
</h5>
|
|
9764
|
-
}
|
|
9765
|
-
@case (6) {
|
|
9766
|
-
<h6 class="header__heading">
|
|
9767
|
-
@if (icon(); as iconName) {
|
|
9768
|
-
<m-icon class="header__icon" [name]="iconName" />
|
|
9769
|
-
}
|
|
9770
|
-
<span>{{ text() }}</span>
|
|
9771
|
-
<ng-content />
|
|
9772
|
-
@if (actionConfig(); as action) {
|
|
9773
|
-
<m-button class="header__action" [config]="action" [style.--m-button-size]="actionSize()" (clicked)="actionClick.emit()" />
|
|
9774
|
-
}
|
|
9775
|
-
</h6>
|
|
9776
|
-
}
|
|
9777
|
-
}
|
|
9778
|
-
`, changeDetection: ChangeDetectionStrategy.OnPush, styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}.header__heading{display:flex;flex-direction:row;align-items:center;justify-content:var(--m-header-justify, flex-start);gap:.75rem;margin:0;padding:0;line-height:1.1;font-weight:800;letter-spacing:-.025em;color:var(--m-header-color, var(--m-text));transition:transform .2s cubic-bezier(.4,0,.2,1)}.header__heading:hover{transform:translate(2px)}.header__icon{flex-shrink:0}.header__action{margin-left:auto}.header__action span{display:inline-block;vertical-align:middle}h1.header__heading{font-size:var(--m-header-font-size, 2.25rem);font-weight:300;color:var(--m-text-quaternary);letter-spacing:-.035em;line-height:1.15}h2.header__heading{font-size:var(--m-header-font-size, 1.75rem);font-weight:300;color:var(--m-text-tertiary);letter-spacing:-.03em;line-height:1.2}h3.header__heading{font-size:var(--m-header-font-size, 1.375rem);font-weight:400;color:var(--m-text-secondary);letter-spacing:-.025em}h4.header__heading{font-size:var(--m-header-font-size, 1.125rem);font-weight:500;color:var(--m-text);letter-spacing:-.02em}h5.header__heading{font-size:var(--m-header-font-size, 1rem);font-weight:600;color:var(--m-text);letter-spacing:-.01em}h6.header__heading{font-size:var(--m-header-font-size, .875rem);font-weight:600;color:var(--m-text);letter-spacing:.05em;text-transform:uppercase}\n"] }]
|
|
9779
|
-
}], propDecorators: { level: [{ type: i0.Input, args: [{ isSignal: true, alias: "level", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], actionButton: [{ type: i0.Input, args: [{ isSignal: true, alias: "actionButton", required: false }] }], actionLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "actionLabel", required: false }] }], noTranslate: [{ type: i0.Input, args: [{ isSignal: true, alias: "noTranslate", required: false }] }], params: [{ type: i0.Input, args: [{ isSignal: true, alias: "params", required: false }] }], actionClick: [{ type: i0.Output, args: ["actionClick"] }] } });
|
|
9780
|
-
|
|
9781
10761
|
const SECTION_CONTEXT = new InjectionToken('SECTION_CONTEXT');
|
|
9782
10762
|
|
|
9783
10763
|
// The line box each heading level draws, straight from `header.sass`: its font
|
|
@@ -9893,7 +10873,7 @@ class SectionHeaderComponent {
|
|
|
9893
10873
|
this.accordion()?.toggle();
|
|
9894
10874
|
}
|
|
9895
10875
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: SectionHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
9896
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: SectionHeaderComponent, isStandalone: true, selector: "m-section-header", inputs: { sticky: { classPropertyName: "sticky", publicName: "sticky", isSignal: true, isRequired: false, transformFunction: null }, level: { classPropertyName: "level", publicName: "level", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, subLabel: { classPropertyName: "subLabel", publicName: "subLabel", isSignal: true, isRequired: false, transformFunction: null }, noTranslate: { classPropertyName: "noTranslate", publicName: "noTranslate", isSignal: true, isRequired: false, transformFunction: null }, params: { classPropertyName: "params", publicName: "params", isSignal: true, isRequired: false, transformFunction: null }, reverse: { classPropertyName: "reverse", publicName: "reverse", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, menu: { classPropertyName: "menu", publicName: "menu", isSignal: true, isRequired: false, transformFunction: null }, menuName: { classPropertyName: "menuName", publicName: "menuName", isSignal: true, isRequired: false, transformFunction: null }, visibilityRule: { classPropertyName: "visibilityRule", publicName: "visibilityRule", isSignal: true, isRequired: false, transformFunction: null }, disableRule: { classPropertyName: "disableRule", publicName: "disableRule", isSignal: true, isRequired: false, transformFunction: null }, extraData: { classPropertyName: "extraData", publicName: "extraData", isSignal: true, isRequired: false, transformFunction: null }, align: { classPropertyName: "align", publicName: "align", isSignal: true, isRequired: false, transformFunction: null }, showBack: { classPropertyName: "showBack", publicName: "showBack", isSignal: true, isRequired: false, transformFunction: null }, actionButton: { classPropertyName: "actionButton", publicName: "actionButton", isSignal: true, isRequired: false, transformFunction: null }, actionLabel: { classPropertyName: "actionLabel", publicName: "actionLabel", isSignal: true, isRequired: false, transformFunction: null }, spacing: { classPropertyName: "spacing", publicName: "spacing", isSignal: true, isRequired: false, transformFunction: null }, maxWidth: { classPropertyName: "maxWidth", publicName: "maxWidth", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { actionClick: "actionClick", action: "action", back: "back" }, host: { properties: { "class.is-sticky-enabled": "sticky()", "class.is-sticky": "isSticky()", "class.has-menu": "hasMenu()", "class.align-left": "alignment() === \"left\"", "class.align-center": "alignment() === \"center\"", "class.align-right": "alignment() === \"right\"", "class.has-sidepanel": "sidepanel()", "class.no-border": "noBorder()", "class.spacing": "spacing()", "class.box-center": "boxAlign() === \"center\"", "class.box-right": "boxAlign() === \"right\"", "style.--m-section-header-max-width": "resolvedMaxWidth()", "style.--m-section-header-icon-box": "iconBox()" }, classAttribute: "m-section-header" }, ngImport: i0, template: "<!-- One declaration of the row, rendered by whichever branch `spacing` picks.\n Hoisted into a template rather than written twice: an `<ng-content>` may\n appear once per selector in a component, so the duplicated copy caught\n nothing and a header projecting a title rendered it in the `spacing`\n branch alone. -->\n<ng-template #body>\n @if (accordion(); as accordionRef) {\n <div\n class=\"section-header__toggle\"\n [class.section-header__toggle--rotate]=\"toggleRotates()\"\n [class.section-header__toggle--open]=\"accordionRef.isOpen()\"\n [id]=\"accordionRef.headerId\"\n [attr.aria-expanded]=\"accordionRef.isOpen()\"\n [attr.aria-controls]=\"accordionRef.bodyId\"\n >\n <m-button\n [config]=\"{ icon: toggleIconName(), iconOnly: true, variant: 'ghost' }\"\n (clicked)=\"onToggleClick()\" />\n </div>\n }\n @if (showBack()) {\n <div class=\"section-header__back\">\n <m-button\n [config]=\"{ icon: 'arrow_back', iconOnly: true }\"\n (clicked)=\"back.emit()\" />\n </div>\n } @else if (!label() && icon(); as iconName) {\n <!-- Only where no label is written. A header with one hands the icon to\n `m-header`, which draws it inside the heading's line box and so on the\n heading's own centre line. Beside a projected title there is no such\n box to borrow, so the glyph is boxed to the level's line box here and\n centred in it \u2014 otherwise it centres against the whole title column,\n which on the Canvas is the label slot's drop rect stacked above the\n heading. -->\n <div class=\"section-header__icon\">\n <m-icon [name]=\"iconName\" />\n </div>\n }\n <div\n class=\"section-header__title\"\n [class.section-header__title--reverse]=\"reverse()\"\n >\n <!-- The title slot is the catch-all rather than a `[label]` one: every\n header already projecting a heading writes it unselected, and a\n selector here would drop that content on the floor. What the design\n page emits \u2014 `<span label>` \u2014 is caught by it too, nothing else\n claiming the node. -->\n <ng-content />\n <!-- The written label, drawn beside the slot rather than as its\n `ng-content` fallback. A fallback renders only while *nothing* is\n projected, and the design Canvas always projects the slot span \u2014\n empty until a Control is dropped in it \u2014 so a fallback there would\n blank the label a header is still configured with. `label` answers\n instead, which no header projecting a title sets. -->\n @if (label()) {\n <m-header\n [level]=\"level()\"\n [label]=\"label()\"\n [icon]=\"icon()\"\n [params]=\"params()\"\n [noTranslate]=\"noTranslate()\" />\n }\n @if (subText(); as sub) {\n <span class=\"section-header__sub\">{{ sub }}</span>\n }\n </div>\n <!-- A FilterGroup projected into the header row, selected by tag rather than\n by an attribute \u2014 the same shape a Section catches its `m-action` with.\n A header has room for one icon and not for a row, so a group landing\n here is squeezed by placement (ADR 0025); nothing here enforces that,\n the caller binding `[squeeze]` on the tag it projects. -->\n <div class=\"section-header__filters\">\n <ng-content select=\"m-section-filter-group\" />\n </div>\n @if (actionConfig(); as action) {\n <div class=\"section-header__action\">\n <m-button [config]=\"action\" (clicked)=\"actionClick.emit()\" />\n </div>\n }\n @if (hasMenu()) {\n <div class=\"section-header__menu\">\n <m-context-menu\n [config]=\"menu()\"\n [name]=\"menuName()\"\n [visibilityRule]=\"visibilityRule()\"\n [disableRule]=\"disableRule()\"\n [extraData]=\"extraData()\"\n (action)=\"action.emit($event)\"\n />\n </div>\n }\n</ng-template>\n\n<!-- Always the same two boxes, whether or not a `maxWidth` is in force. The\n border and the sticky backdrop live on the host and keep spanning the\n Section's full width; only this container narrows and is placed by the\n Section's `align`, so the heading lines up with the body under it. -->\n<div class=\"section-header__container\">\n <div class=\"section-header__inner\">\n <ng-container [ngTemplateOutlet]=\"body\" />\n </div>\n</div>\n", styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}:host{display:flex;align-items:center;gap:.5rem;min-height:var(--section-header-min-height, calc(var(--section-header-py, .5rem) * 2 + 1.25rem));border-bottom:1px solid var(--m-backdrop-border);padding:var(--section-header-py, .85rem) var(--section-px, 1rem);width:100%;grid-column:1/-1}:host(.no-border){border-bottom:none}:host(.spacing){padding:0;width:100%}.section-header__container{width:100%;min-width:0;max-width:var(--m-section-header-max-width, none);margin-inline:0 auto}:host(.box-center) .section-header__container{margin-inline:auto}:host(.box-right) .section-header__container{margin-inline:auto 0}.section-header__inner{display:flex;align-items:center;gap:.5rem;width:100%;min-width:0}.section-header__inner .section-header__title{flex:1;min-width:0;gap:.5rem}:host(.spacing) .section-header__inner{padding:1rem 1.5rem}:host(.has-sidepanel){padding-right:50px}:host(.has-sidepanel.has-menu){padding-right:50px}:host(.spacing.has-sidepanel) .section-header__inner{padding-right:calc(1.5rem + 50px)}:host(.is-sticky-enabled){position:sticky;top:0;z-index:10}:host(.is-sticky-enabled){background:color-mix(in srgb,var(--m-background) 80%,transparent);backdrop-filter:blur(16px) saturate(180%);-webkit-backdrop-filter:blur(16px) saturate(180%)}.section-header__toggle{display:flex;flex-shrink:0}.section-header__toggle.section-header__toggle--rotate m-button{display:flex;transition:transform .3s cubic-bezier(.4,0,.2,1)}.section-header__toggle.section-header__toggle--rotate.section-header__toggle--open m-button{transform:rotate(180deg)}.section-header__title{flex:1;min-width:0;display:flex;flex-direction:column;gap:.1rem}m-header{min-width:0}.section-header__title--reverse{flex-direction:column-reverse}.section-header__sub{font-size:.8rem;color:var(--m-text-secondary);line-height:1.2}:host(.align-center){--m-header-justify: center}:host(.align-right){--m-header-justify: flex-end}:host(.has-menu){padding-right:0}:host(.spacing.has-menu) .section-header__inner{padding-right:0}.section-header__filters{display:contents}.section-header__filters m-section-filter-group{width:auto;flex-shrink:0;border-bottom:none}.section-header__back{display:flex;align-items:center;flex-shrink:0}.section-header__icon{display:flex;align-items:center;justify-content:center;flex-shrink:0;align-self:flex-start;height:var(--m-section-header-icon-box, 1.5125rem)}.section-header__menu,.section-header__action{margin-left:auto;flex-shrink:0;display:flex;align-items:center}.section-header__action+.section-header__menu{margin-left:0}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ContextMenuComponent, selector: "m-context-menu, m-one-context-menu", inputs: ["toggle", "remote", "exclude", "visibilityRule", "disableRule", "extraData", "inverted", "options"], outputs: ["toggleChange", "action"] }, { kind: "component", type: HeaderComponent$1, selector: "m-header", inputs: ["level", "label", "icon", "actionButton", "actionLabel", "noTranslate", "params"], outputs: ["actionClick"] }, { kind: "component", type: IconComponent, selector: "m-icon, m-one-icon", inputs: ["config", "name", "color", "size", "one", "baseUrl", "remote"], outputs: ["configChange"] }, { kind: "component", type: ButtonComponent, selector: "m-button,m-one-button", inputs: ["config", "color", "labelClass", "fullWidth", "nav", "navParams", "href", "disabled", "variant", "name", "baseUrl", "one", "remote", "label", "noTranslate", "params", "noNative", "icon", "isRightIcon", "iconOnly", "stacked", "imgSrc", "nonClickable", "inverted", "isSubmit", "tabindex"], outputs: ["configChange", "clicked"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
10876
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: SectionHeaderComponent, isStandalone: true, selector: "m-section-header", inputs: { sticky: { classPropertyName: "sticky", publicName: "sticky", isSignal: true, isRequired: false, transformFunction: null }, level: { classPropertyName: "level", publicName: "level", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, subLabel: { classPropertyName: "subLabel", publicName: "subLabel", isSignal: true, isRequired: false, transformFunction: null }, noTranslate: { classPropertyName: "noTranslate", publicName: "noTranslate", isSignal: true, isRequired: false, transformFunction: null }, params: { classPropertyName: "params", publicName: "params", isSignal: true, isRequired: false, transformFunction: null }, reverse: { classPropertyName: "reverse", publicName: "reverse", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, menu: { classPropertyName: "menu", publicName: "menu", isSignal: true, isRequired: false, transformFunction: null }, menuName: { classPropertyName: "menuName", publicName: "menuName", isSignal: true, isRequired: false, transformFunction: null }, visibilityRule: { classPropertyName: "visibilityRule", publicName: "visibilityRule", isSignal: true, isRequired: false, transformFunction: null }, disableRule: { classPropertyName: "disableRule", publicName: "disableRule", isSignal: true, isRequired: false, transformFunction: null }, extraData: { classPropertyName: "extraData", publicName: "extraData", isSignal: true, isRequired: false, transformFunction: null }, align: { classPropertyName: "align", publicName: "align", isSignal: true, isRequired: false, transformFunction: null }, showBack: { classPropertyName: "showBack", publicName: "showBack", isSignal: true, isRequired: false, transformFunction: null }, actionButton: { classPropertyName: "actionButton", publicName: "actionButton", isSignal: true, isRequired: false, transformFunction: null }, actionLabel: { classPropertyName: "actionLabel", publicName: "actionLabel", isSignal: true, isRequired: false, transformFunction: null }, spacing: { classPropertyName: "spacing", publicName: "spacing", isSignal: true, isRequired: false, transformFunction: null }, maxWidth: { classPropertyName: "maxWidth", publicName: "maxWidth", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { actionClick: "actionClick", action: "action", back: "back" }, host: { properties: { "class.is-sticky-enabled": "sticky()", "class.is-sticky": "isSticky()", "class.has-menu": "hasMenu()", "class.align-left": "alignment() === \"left\"", "class.align-center": "alignment() === \"center\"", "class.align-right": "alignment() === \"right\"", "class.has-sidepanel": "sidepanel()", "class.no-border": "noBorder()", "class.spacing": "spacing()", "class.box-center": "boxAlign() === \"center\"", "class.box-right": "boxAlign() === \"right\"", "style.--m-section-header-max-width": "resolvedMaxWidth()", "style.--m-section-header-icon-box": "iconBox()" }, classAttribute: "m-section-header" }, ngImport: i0, template: "<!-- One declaration of the row, rendered by whichever branch `spacing` picks.\n Hoisted into a template rather than written twice: an `<ng-content>` may\n appear once per selector in a component, so the duplicated copy caught\n nothing and a header projecting a title rendered it in the `spacing`\n branch alone. -->\n<ng-template #body>\n @if (accordion(); as accordionRef) {\n <div\n class=\"section-header__toggle\"\n [class.section-header__toggle--rotate]=\"toggleRotates()\"\n [class.section-header__toggle--open]=\"accordionRef.isOpen()\"\n [id]=\"accordionRef.headerId\"\n [attr.aria-expanded]=\"accordionRef.isOpen()\"\n [attr.aria-controls]=\"accordionRef.bodyId\"\n >\n <m-button\n [config]=\"{ icon: toggleIconName(), iconOnly: true, variant: 'ghost' }\"\n (clicked)=\"onToggleClick()\" />\n </div>\n }\n @if (showBack()) {\n <div class=\"section-header__back\">\n <m-button\n [config]=\"{ icon: 'chevron-left', iconOnly: true }\"\n (clicked)=\"back.emit()\" />\n </div>\n } @else if (!label() && icon(); as iconName) {\n <!-- Only where no label is written. A header with one hands the icon to\n `m-header`, which draws it inside the heading's line box and so on the\n heading's own centre line. Beside a projected title there is no such\n box to borrow, so the glyph is boxed to the level's line box here and\n centred in it \u2014 otherwise it centres against the whole title column,\n which on the Canvas is the label slot's drop rect stacked above the\n heading. -->\n <div class=\"section-header__icon\">\n <m-icon [name]=\"iconName\" />\n </div>\n }\n <div\n class=\"section-header__title\"\n [class.section-header__title--reverse]=\"reverse()\"\n >\n <!-- The title slot is the catch-all rather than a `[label]` one: every\n header already projecting a heading writes it unselected, and a\n selector here would drop that content on the floor. What the design\n page emits \u2014 `<span label>` \u2014 is caught by it too, nothing else\n claiming the node. -->\n <ng-content />\n <!-- The written label, drawn beside the slot rather than as its\n `ng-content` fallback. A fallback renders only while *nothing* is\n projected, and the design Canvas always projects the slot span \u2014\n empty until a Control is dropped in it \u2014 so a fallback there would\n blank the label a header is still configured with. `label` answers\n instead, which no header projecting a title sets. -->\n @if (label()) {\n <m-header\n [level]=\"level()\"\n [label]=\"label()\"\n [icon]=\"icon()\"\n [params]=\"params()\"\n [noTranslate]=\"noTranslate()\" />\n }\n @if (subText(); as sub) {\n <span class=\"section-header__sub\">{{ sub }}</span>\n }\n </div>\n <!-- A FilterGroup projected into the header row, selected by tag rather than\n by an attribute \u2014 the same shape a Section catches its `m-action` with.\n A header has room for one icon and not for a row, so a group landing\n here is squeezed by placement (ADR 0025); nothing here enforces that,\n the caller binding `[squeeze]` on the tag it projects. -->\n <div class=\"section-header__filters\">\n <ng-content select=\"m-section-filter-group\" />\n </div>\n @if (actionConfig(); as action) {\n <div class=\"section-header__action\">\n <m-button [config]=\"action\" (clicked)=\"actionClick.emit()\" />\n </div>\n }\n @if (hasMenu()) {\n <div class=\"section-header__menu\">\n <m-context-menu\n [config]=\"menu()\"\n [name]=\"menuName()\"\n [visibilityRule]=\"visibilityRule()\"\n [disableRule]=\"disableRule()\"\n [extraData]=\"extraData()\"\n (action)=\"action.emit($event)\"\n />\n </div>\n }\n</ng-template>\n\n<!-- Always the same two boxes, whether or not a `maxWidth` is in force. The\n border and the sticky backdrop live on the host and keep spanning the\n Section's full width; only this container narrows and is placed by the\n Section's `align`, so the heading lines up with the body under it. -->\n<div class=\"section-header__container\">\n <div class=\"section-header__inner\">\n <ng-container [ngTemplateOutlet]=\"body\" />\n </div>\n</div>\n", styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}:host{display:flex;align-items:center;gap:.5rem;min-height:var(--section-header-min-height, calc(var(--section-header-py, .5rem) * 2 + 1.25rem));border-bottom:1px solid var(--m-backdrop-border);padding:var(--section-header-py, .85rem) var(--section-px, 1rem);width:100%;grid-column:1/-1}:host(.no-border){border-bottom:none}:host(.spacing){padding:0;width:100%}.section-header__container{width:100%;min-width:0;max-width:var(--m-section-header-max-width, none);margin-inline:0 auto}:host(.box-center) .section-header__container{margin-inline:auto}:host(.box-right) .section-header__container{margin-inline:auto 0}.section-header__inner{display:flex;align-items:center;gap:.5rem;width:100%;min-width:0}.section-header__inner .section-header__title{flex:1;min-width:0;gap:.5rem}:host(.spacing) .section-header__inner{padding:1rem 1.5rem}:host(.has-sidepanel){padding-right:50px}:host(.has-sidepanel.has-menu){padding-right:50px}:host(.spacing.has-sidepanel) .section-header__inner{padding-right:calc(1.5rem + 50px)}:host(.is-sticky-enabled){position:sticky;top:0;z-index:10}:host(.is-sticky-enabled){background:color-mix(in srgb,var(--m-background) 80%,transparent);backdrop-filter:blur(16px) saturate(180%);-webkit-backdrop-filter:blur(16px) saturate(180%)}.section-header__toggle{display:flex;flex-shrink:0}.section-header__toggle.section-header__toggle--rotate m-button{display:flex;transition:transform .3s cubic-bezier(.4,0,.2,1)}.section-header__toggle.section-header__toggle--rotate.section-header__toggle--open m-button{transform:rotate(180deg)}.section-header__title{flex:1;min-width:0;display:flex;flex-direction:column;gap:.1rem}m-header{min-width:0}.section-header__title--reverse{flex-direction:column-reverse}.section-header__sub{font-size:.8rem;color:var(--m-text-secondary);line-height:1.2}:host(.align-center){--m-header-justify: center}:host(.align-right){--m-header-justify: flex-end}:host(.has-menu){padding-right:0}:host(.spacing.has-menu) .section-header__inner{padding-right:0}.section-header__filters{display:contents}.section-header__filters m-section-filter-group{width:auto;flex-shrink:0;border-bottom:none}.section-header__back{display:flex;align-items:center;flex-shrink:0}.section-header__icon{display:flex;align-items:center;justify-content:center;flex-shrink:0;align-self:flex-start;height:var(--m-section-header-icon-box, 1.5125rem)}.section-header__menu,.section-header__action{margin-left:auto;flex-shrink:0;display:flex;align-items:center}.section-header__action+.section-header__menu{margin-left:0}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ContextMenuComponent, selector: "m-context-menu, m-one-context-menu", inputs: ["toggle", "remote", "exclude", "visibilityRule", "disableRule", "extraData", "inverted", "options"], outputs: ["toggleChange", "action"] }, { kind: "component", type: HeaderComponent$1, selector: "m-header", inputs: ["level", "label", "icon", "actionButton", "actionLabel", "noTranslate", "params"], outputs: ["actionClick"] }, { kind: "component", type: IconComponent, selector: "m-icon, m-one-icon", inputs: ["config", "name", "color", "size", "one", "baseUrl", "remote"], outputs: ["configChange"] }, { kind: "component", type: ButtonComponent, selector: "m-button,m-one-button", inputs: ["config", "color", "labelClass", "fullWidth", "nav", "navParams", "href", "disabled", "variant", "name", "baseUrl", "one", "remote", "label", "noTranslate", "params", "noNative", "icon", "isRightIcon", "iconOnly", "stacked", "imgSrc", "nonClickable", "inverted", "isSubmit", "tabindex"], outputs: ["configChange", "clicked"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
9897
10877
|
}
|
|
9898
10878
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: SectionHeaderComponent, decorators: [{
|
|
9899
10879
|
type: Component,
|
|
@@ -9918,11 +10898,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
|
|
|
9918
10898
|
'[class.box-right]': 'boxAlign() === "right"',
|
|
9919
10899
|
'[style.--m-section-header-max-width]': 'resolvedMaxWidth()',
|
|
9920
10900
|
'[style.--m-section-header-icon-box]': 'iconBox()',
|
|
9921
|
-
}, template: "<!-- One declaration of the row, rendered by whichever branch `spacing` picks.\n Hoisted into a template rather than written twice: an `<ng-content>` may\n appear once per selector in a component, so the duplicated copy caught\n nothing and a header projecting a title rendered it in the `spacing`\n branch alone. -->\n<ng-template #body>\n @if (accordion(); as accordionRef) {\n <div\n class=\"section-header__toggle\"\n [class.section-header__toggle--rotate]=\"toggleRotates()\"\n [class.section-header__toggle--open]=\"accordionRef.isOpen()\"\n [id]=\"accordionRef.headerId\"\n [attr.aria-expanded]=\"accordionRef.isOpen()\"\n [attr.aria-controls]=\"accordionRef.bodyId\"\n >\n <m-button\n [config]=\"{ icon: toggleIconName(), iconOnly: true, variant: 'ghost' }\"\n (clicked)=\"onToggleClick()\" />\n </div>\n }\n @if (showBack()) {\n <div class=\"section-header__back\">\n <m-button\n [config]=\"{ icon: '
|
|
10901
|
+
}, template: "<!-- One declaration of the row, rendered by whichever branch `spacing` picks.\n Hoisted into a template rather than written twice: an `<ng-content>` may\n appear once per selector in a component, so the duplicated copy caught\n nothing and a header projecting a title rendered it in the `spacing`\n branch alone. -->\n<ng-template #body>\n @if (accordion(); as accordionRef) {\n <div\n class=\"section-header__toggle\"\n [class.section-header__toggle--rotate]=\"toggleRotates()\"\n [class.section-header__toggle--open]=\"accordionRef.isOpen()\"\n [id]=\"accordionRef.headerId\"\n [attr.aria-expanded]=\"accordionRef.isOpen()\"\n [attr.aria-controls]=\"accordionRef.bodyId\"\n >\n <m-button\n [config]=\"{ icon: toggleIconName(), iconOnly: true, variant: 'ghost' }\"\n (clicked)=\"onToggleClick()\" />\n </div>\n }\n @if (showBack()) {\n <div class=\"section-header__back\">\n <m-button\n [config]=\"{ icon: 'chevron-left', iconOnly: true }\"\n (clicked)=\"back.emit()\" />\n </div>\n } @else if (!label() && icon(); as iconName) {\n <!-- Only where no label is written. A header with one hands the icon to\n `m-header`, which draws it inside the heading's line box and so on the\n heading's own centre line. Beside a projected title there is no such\n box to borrow, so the glyph is boxed to the level's line box here and\n centred in it \u2014 otherwise it centres against the whole title column,\n which on the Canvas is the label slot's drop rect stacked above the\n heading. -->\n <div class=\"section-header__icon\">\n <m-icon [name]=\"iconName\" />\n </div>\n }\n <div\n class=\"section-header__title\"\n [class.section-header__title--reverse]=\"reverse()\"\n >\n <!-- The title slot is the catch-all rather than a `[label]` one: every\n header already projecting a heading writes it unselected, and a\n selector here would drop that content on the floor. What the design\n page emits \u2014 `<span label>` \u2014 is caught by it too, nothing else\n claiming the node. -->\n <ng-content />\n <!-- The written label, drawn beside the slot rather than as its\n `ng-content` fallback. A fallback renders only while *nothing* is\n projected, and the design Canvas always projects the slot span \u2014\n empty until a Control is dropped in it \u2014 so a fallback there would\n blank the label a header is still configured with. `label` answers\n instead, which no header projecting a title sets. -->\n @if (label()) {\n <m-header\n [level]=\"level()\"\n [label]=\"label()\"\n [icon]=\"icon()\"\n [params]=\"params()\"\n [noTranslate]=\"noTranslate()\" />\n }\n @if (subText(); as sub) {\n <span class=\"section-header__sub\">{{ sub }}</span>\n }\n </div>\n <!-- A FilterGroup projected into the header row, selected by tag rather than\n by an attribute \u2014 the same shape a Section catches its `m-action` with.\n A header has room for one icon and not for a row, so a group landing\n here is squeezed by placement (ADR 0025); nothing here enforces that,\n the caller binding `[squeeze]` on the tag it projects. -->\n <div class=\"section-header__filters\">\n <ng-content select=\"m-section-filter-group\" />\n </div>\n @if (actionConfig(); as action) {\n <div class=\"section-header__action\">\n <m-button [config]=\"action\" (clicked)=\"actionClick.emit()\" />\n </div>\n }\n @if (hasMenu()) {\n <div class=\"section-header__menu\">\n <m-context-menu\n [config]=\"menu()\"\n [name]=\"menuName()\"\n [visibilityRule]=\"visibilityRule()\"\n [disableRule]=\"disableRule()\"\n [extraData]=\"extraData()\"\n (action)=\"action.emit($event)\"\n />\n </div>\n }\n</ng-template>\n\n<!-- Always the same two boxes, whether or not a `maxWidth` is in force. The\n border and the sticky backdrop live on the host and keep spanning the\n Section's full width; only this container narrows and is placed by the\n Section's `align`, so the heading lines up with the body under it. -->\n<div class=\"section-header__container\">\n <div class=\"section-header__inner\">\n <ng-container [ngTemplateOutlet]=\"body\" />\n </div>\n</div>\n", styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}:host{display:flex;align-items:center;gap:.5rem;min-height:var(--section-header-min-height, calc(var(--section-header-py, .5rem) * 2 + 1.25rem));border-bottom:1px solid var(--m-backdrop-border);padding:var(--section-header-py, .85rem) var(--section-px, 1rem);width:100%;grid-column:1/-1}:host(.no-border){border-bottom:none}:host(.spacing){padding:0;width:100%}.section-header__container{width:100%;min-width:0;max-width:var(--m-section-header-max-width, none);margin-inline:0 auto}:host(.box-center) .section-header__container{margin-inline:auto}:host(.box-right) .section-header__container{margin-inline:auto 0}.section-header__inner{display:flex;align-items:center;gap:.5rem;width:100%;min-width:0}.section-header__inner .section-header__title{flex:1;min-width:0;gap:.5rem}:host(.spacing) .section-header__inner{padding:1rem 1.5rem}:host(.has-sidepanel){padding-right:50px}:host(.has-sidepanel.has-menu){padding-right:50px}:host(.spacing.has-sidepanel) .section-header__inner{padding-right:calc(1.5rem + 50px)}:host(.is-sticky-enabled){position:sticky;top:0;z-index:10}:host(.is-sticky-enabled){background:color-mix(in srgb,var(--m-background) 80%,transparent);backdrop-filter:blur(16px) saturate(180%);-webkit-backdrop-filter:blur(16px) saturate(180%)}.section-header__toggle{display:flex;flex-shrink:0}.section-header__toggle.section-header__toggle--rotate m-button{display:flex;transition:transform .3s cubic-bezier(.4,0,.2,1)}.section-header__toggle.section-header__toggle--rotate.section-header__toggle--open m-button{transform:rotate(180deg)}.section-header__title{flex:1;min-width:0;display:flex;flex-direction:column;gap:.1rem}m-header{min-width:0}.section-header__title--reverse{flex-direction:column-reverse}.section-header__sub{font-size:.8rem;color:var(--m-text-secondary);line-height:1.2}:host(.align-center){--m-header-justify: center}:host(.align-right){--m-header-justify: flex-end}:host(.has-menu){padding-right:0}:host(.spacing.has-menu) .section-header__inner{padding-right:0}.section-header__filters{display:contents}.section-header__filters m-section-filter-group{width:auto;flex-shrink:0;border-bottom:none}.section-header__back{display:flex;align-items:center;flex-shrink:0}.section-header__icon{display:flex;align-items:center;justify-content:center;flex-shrink:0;align-self:flex-start;height:var(--m-section-header-icon-box, 1.5125rem)}.section-header__menu,.section-header__action{margin-left:auto;flex-shrink:0;display:flex;align-items:center}.section-header__action+.section-header__menu{margin-left:0}\n"] }]
|
|
9922
10902
|
}], propDecorators: { sticky: [{ type: i0.Input, args: [{ isSignal: true, alias: "sticky", required: false }] }], level: [{ type: i0.Input, args: [{ isSignal: true, alias: "level", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], subLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "subLabel", required: false }] }], noTranslate: [{ type: i0.Input, args: [{ isSignal: true, alias: "noTranslate", required: false }] }], params: [{ type: i0.Input, args: [{ isSignal: true, alias: "params", required: false }] }], reverse: [{ type: i0.Input, args: [{ isSignal: true, alias: "reverse", required: false }] }], icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], menu: [{ type: i0.Input, args: [{ isSignal: true, alias: "menu", required: false }] }], menuName: [{ type: i0.Input, args: [{ isSignal: true, alias: "menuName", required: false }] }], visibilityRule: [{ type: i0.Input, args: [{ isSignal: true, alias: "visibilityRule", required: false }] }], disableRule: [{ type: i0.Input, args: [{ isSignal: true, alias: "disableRule", required: false }] }], extraData: [{ type: i0.Input, args: [{ isSignal: true, alias: "extraData", required: false }] }], align: [{ type: i0.Input, args: [{ isSignal: true, alias: "align", required: false }] }], showBack: [{ type: i0.Input, args: [{ isSignal: true, alias: "showBack", required: false }] }], actionButton: [{ type: i0.Input, args: [{ isSignal: true, alias: "actionButton", required: false }] }], actionLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "actionLabel", required: false }] }], spacing: [{ type: i0.Input, args: [{ isSignal: true, alias: "spacing", required: false }] }], maxWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxWidth", required: false }] }], actionClick: [{ type: i0.Output, args: ["actionClick"] }], action: [{ type: i0.Output, args: ["action"] }], back: [{ type: i0.Output, args: ["back"] }] } });
|
|
9923
10903
|
|
|
9924
10904
|
const BACK_BTN = {
|
|
9925
|
-
icon: '
|
|
10905
|
+
icon: 'chevron-left',
|
|
9926
10906
|
iconOnly: true,
|
|
9927
10907
|
variant: 'ghost',
|
|
9928
10908
|
};
|
|
@@ -9962,7 +10942,7 @@ class SectionBackComponent {
|
|
|
9962
10942
|
<m-header [level]="3" [label]="label() ?? 'magmonium'" />
|
|
9963
10943
|
}
|
|
9964
10944
|
}
|
|
9965
|
-
`, isInline: true, styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}:host{display:flex;align-items:center;gap:.
|
|
10945
|
+
`, isInline: true, styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}:host{display:flex;align-items:center;gap:.25rem;min-height:var(--section-header-min-height, calc(var(--section-header-py, .5rem) * 2 + 1.25rem));border-bottom:1px solid var(--m-backdrop-border);width:100%;grid-column:1/-1;--section-back-size: .7rem;--section-back-seat: calc(var(--section-back-size) * 2.25)}:host(.no-border){border-bottom:none}m-button,m-icon{flex-shrink:0}m-button{--m-button-size: var(--section-back-size)}m-icon{display:inline-flex;justify-content:center;width:var(--section-back-seat)}m-logo{flex-shrink:0;width:1.5rem;height:1.5rem}m-header{flex:1;min-width:0}:host>span{display:contents}:host.has-padding-x{padding-inline:var(--section-px, 1rem)}:host.has-padding-y{padding-block:var(--section-header-py, .85rem)}\n"], dependencies: [{ kind: "component", type: IconComponent, selector: "m-icon, m-one-icon", inputs: ["config", "name", "color", "size", "one", "baseUrl", "remote"], outputs: ["configChange"] }, { kind: "component", type: ButtonComponent, selector: "m-button,m-one-button", inputs: ["config", "color", "labelClass", "fullWidth", "nav", "navParams", "href", "disabled", "variant", "name", "baseUrl", "one", "remote", "label", "noTranslate", "params", "noNative", "icon", "isRightIcon", "iconOnly", "stacked", "imgSrc", "nonClickable", "inverted", "isSubmit", "tabindex"], outputs: ["configChange", "clicked"] }, { kind: "component", type: HeaderComponent$1, selector: "m-header", inputs: ["level", "label", "icon", "actionButton", "actionLabel", "noTranslate", "params"], outputs: ["actionClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
9966
10946
|
}
|
|
9967
10947
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: SectionBackComponent, decorators: [{
|
|
9968
10948
|
type: Component,
|
|
@@ -9986,7 +10966,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
|
|
|
9986
10966
|
'[class.has-padding-x]': 'padding() || paddingX()',
|
|
9987
10967
|
'[class.has-padding-y]': 'padding() || paddingY()',
|
|
9988
10968
|
'[class.no-border]': 'noBorder()',
|
|
9989
|
-
}, styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}:host{display:flex;align-items:center;gap:.
|
|
10969
|
+
}, styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}:host{display:flex;align-items:center;gap:.25rem;min-height:var(--section-header-min-height, calc(var(--section-header-py, .5rem) * 2 + 1.25rem));border-bottom:1px solid var(--m-backdrop-border);width:100%;grid-column:1/-1;--section-back-size: .7rem;--section-back-seat: calc(var(--section-back-size) * 2.25)}:host(.no-border){border-bottom:none}m-button,m-icon{flex-shrink:0}m-button{--m-button-size: var(--section-back-size)}m-icon{display:inline-flex;justify-content:center;width:var(--section-back-seat)}m-logo{flex-shrink:0;width:1.5rem;height:1.5rem}m-header{flex:1;min-width:0}:host>span{display:contents}:host.has-padding-x{padding-inline:var(--section-px, 1rem)}:host.has-padding-y{padding-block:var(--section-header-py, .85rem)}\n"] }]
|
|
9990
10970
|
}], ctorParameters: () => [], propDecorators: { back: [{ type: i0.Input, args: [{ isSignal: true, alias: "back", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], html: [{ type: i0.Input, args: [{ isSignal: true, alias: "html", required: false }] }], padding: [{ type: i0.Input, args: [{ isSignal: true, alias: "padding", required: false }] }], paddingX: [{ type: i0.Input, args: [{ isSignal: true, alias: "paddingX", required: false }] }], paddingY: [{ type: i0.Input, args: [{ isSignal: true, alias: "paddingY", required: false }] }], navigate: [{ type: i0.Output, args: ["navigate"] }], contentRef: [{ type: i0.ViewChild, args: ['content', { isSignal: true }] }] } });
|
|
9991
10971
|
|
|
9992
10972
|
/**
|
|
@@ -10314,6 +11294,11 @@ class ActionComponent extends ButtonGroupComponent {
|
|
|
10314
11294
|
// consumes the Buttons dropped on a SectionAction into `[buttons]` and writes
|
|
10315
11295
|
// every other setting as an attribute (ADR 0010).
|
|
10316
11296
|
variant = input(...(ngDevMode ? [undefined, { debugName: "variant" }] : /* istanbul ignore next */ []));
|
|
11297
|
+
// A toggle's lit Button, named by a host that also moves the pick from
|
|
11298
|
+
// outside the bar — a shortcut, a store. It wins over the last press, so a
|
|
11299
|
+
// host binding it follows `clicked` back into it, the way a controlled input
|
|
11300
|
+
// does. Unset leaves the bar keeping its own selection.
|
|
11301
|
+
active = input(...(ngDevMode ? [undefined, { debugName: "active" }] : /* istanbul ignore next */ []));
|
|
10317
11302
|
// Design-mode only: Button name -> the id of the Control it was folded from.
|
|
10318
11303
|
// The Canvas draws a folded Button through this bar rather than as a tag of
|
|
10319
11304
|
// its own, so the `render-id` its ControlLayer measures has nowhere else to
|
|
@@ -10392,6 +11377,9 @@ class ActionComponent extends ButtonGroupComponent {
|
|
|
10392
11377
|
}
|
|
10393
11378
|
if (this.resolvedVariant() !== 'toggle')
|
|
10394
11379
|
return this.config()?.primary;
|
|
11380
|
+
const named = this.active();
|
|
11381
|
+
if (named && buttons.some((b) => b.name === named))
|
|
11382
|
+
return named;
|
|
10395
11383
|
const pressed = this.pressed();
|
|
10396
11384
|
if (pressed && buttons.some((b) => b.name === pressed))
|
|
10397
11385
|
return pressed;
|
|
@@ -10428,10 +11416,12 @@ class ActionComponent extends ButtonGroupComponent {
|
|
|
10428
11416
|
}
|
|
10429
11417
|
return undefined;
|
|
10430
11418
|
}, ...(ngDevMode ? [{ debugName: "activeSqueeze" }] : /* istanbul ignore next */ []));
|
|
10431
|
-
//
|
|
10432
|
-
//
|
|
11419
|
+
// Squeezed to icons, or asked for by the Button itself (`iconOnly`). Only
|
|
11420
|
+
// where the icon can carry the Button on its own — a label dropped off a
|
|
11421
|
+
// Button with no glyph behind it leaves an empty box to press.
|
|
10433
11422
|
isLabelHidden(button) {
|
|
10434
|
-
return
|
|
11423
|
+
return (!!button.icon &&
|
|
11424
|
+
(!!button.iconOnly || this.activeSqueeze() === 'icon'));
|
|
10435
11425
|
}
|
|
10436
11426
|
// Folded: the Button that speaks for the bar stays out, the rest go in the
|
|
10437
11427
|
// menu. Below two Buttons there is nothing to fold, so the bar is left alone.
|
|
@@ -10599,6 +11589,9 @@ class ActionComponent extends ButtonGroupComponent {
|
|
|
10599
11589
|
// A press announces itself through `select`; this speaks only for defaults.
|
|
10600
11590
|
if (this.pressed() !== undefined)
|
|
10601
11591
|
return;
|
|
11592
|
+
// A host that names the active Button already knows which one it is.
|
|
11593
|
+
if (this.active() !== undefined)
|
|
11594
|
+
return;
|
|
10602
11595
|
const name = this.selected();
|
|
10603
11596
|
if (!name || name === this.announcedDefault())
|
|
10604
11597
|
return;
|
|
@@ -10611,7 +11604,7 @@ class ActionComponent extends ButtonGroupComponent {
|
|
|
10611
11604
|
this.clicked.emit(button);
|
|
10612
11605
|
};
|
|
10613
11606
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: ActionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
10614
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: ActionComponent, isStandalone: true, selector: "m-action, m-one-action", inputs: { sticky: { classPropertyName: "sticky", publicName: "sticky", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, renderIds: { classPropertyName: "renderIds", publicName: "renderIds", isSignal: true, isRequired: false, transformFunction: null }, squeezeAt: { classPropertyName: "squeezeAt", publicName: "squeezeAt", isSignal: true, isRequired: false, transformFunction: null }, squeezeMode: { classPropertyName: "squeezeMode", publicName: "squeezeMode", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.m-action--host-sticky": "sticky()" } }, usesInheritance: true, ngImport: i0, template: "@let buttons = actionButtons();\n<!-- No `config()` guard: a bar the Design editor folded its Buttons into has no\n `button_groups/<name>.yml` behind it \u2014 they ride on `[buttons]` instead\n (ADR 0009, ADR 0010) \u2014 so what decides whether the row exists is whether\n there are Buttons in it. Empty, it draws only on the Canvas, where it is\n the drop space a Button lands on. -->\n@if (buttons.length || isDesignMode) {\n <div\n class=\"m-action\"\n [class.m-action--stuck]=\"isStuck()\"\n [class.m-action--toggle]=\"resolvedVariant() === 'toggle'\"\n
|
|
11607
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: ActionComponent, isStandalone: true, selector: "m-action, m-one-action", inputs: { sticky: { classPropertyName: "sticky", publicName: "sticky", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, active: { classPropertyName: "active", publicName: "active", isSignal: true, isRequired: false, transformFunction: null }, renderIds: { classPropertyName: "renderIds", publicName: "renderIds", isSignal: true, isRequired: false, transformFunction: null }, squeezeAt: { classPropertyName: "squeezeAt", publicName: "squeezeAt", isSignal: true, isRequired: false, transformFunction: null }, squeezeMode: { classPropertyName: "squeezeMode", publicName: "squeezeMode", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.m-action--host-sticky": "sticky()" } }, usesInheritance: true, ngImport: i0, template: "@let buttons = actionButtons();\n<!-- No `config()` guard: a bar the Design editor folded its Buttons into has no\n `button_groups/<name>.yml` behind it \u2014 they ride on `[buttons]` instead\n (ADR 0009, ADR 0010) \u2014 so what decides whether the row exists is whether\n there are Buttons in it. Empty, it draws only on the Canvas, where it is\n the drop space a Button lands on. -->\n@if (buttons.length || isDesignMode) {\n <div\n class=\"m-action\"\n [class.m-action--stuck]=\"isStuck()\"\n [class.m-action--toggle]=\"resolvedVariant() === 'toggle'\"\n >\n @for (button of visibleButtons(); track $index) {\n <!-- A routed Button is a real link, so the browser's own affordances \u2014\n a middle-click, open in new tab, the URL on hover \u2014 reach it. A\n disabled one stays a <button>: an <a> cannot be disabled, and a\n RouterLink on one would still navigate. -->\n @let link = isDisabled(button.name) ? undefined : linkOf(button);\n @if (link) {\n <a\n class=\"m-action__btn\"\n [routerLink]=\"link\"\n [attr.data-testid]=\"(button.name || '') + '-btn'\"\n [class.active]=\"isActive(button)\"\n [class.m-action__btn--icon-only]=\"isLabelHidden(button)\"\n [attr.aria-label]=\"isLabelHidden(button) ? (button.label | translate) : null\"\n [attr.aria-current]=\"isActive(button) ? 'page' : null\"\n [style.--m-action-color]=\"fillColor(button)\"\n [style.--m-action-color-contrast]=\"contrastColor(button)\"\n [style.--m-action-label]=\"labelColor(button)\"\n (click)=\"select(button)\"\n >\n <ng-container\n *ngTemplateOutlet=\"buttonContent; context: { $implicit: button }\"\n />\n </a>\n } @else {\n <button\n type=\"button\"\n class=\"m-action__btn\"\n [attr.data-testid]=\"(button.name || '') + '-btn'\"\n [attr.render-id]=\"renderIds()?.[button.name ?? '']\"\n [class.active]=\"isActive(button)\"\n [class.m-action__btn--icon-only]=\"isLabelHidden(button)\"\n [attr.aria-label]=\"isLabelHidden(button) ? (button.label | translate) : null\"\n [style.--m-action-color]=\"fillColor(button)\"\n [style.--m-action-color-contrast]=\"contrastColor(button)\"\n [style.--m-action-label]=\"labelColor(button)\"\n [disabled]=\"isDisabled(button.name)\"\n (click)=\"select(button)\"\n >\n <ng-container\n *ngTemplateOutlet=\"buttonContent; context: { $implicit: button }\"\n />\n </button>\n }\n }\n @if (menuButtons().length) {\n <!-- The Buttons the bar could not fit. Squeezed rather than dropped:\n an action the User can still reach behind one press beats an action\n that silently stopped existing at 400px. -->\n <m-context-menu\n class=\"m-action__overflow\"\n [config]=\"squeezeMenu()\"\n [remote]=\"remote() ?? config()?.remote\"\n (action)=\"onMenuAction($event)\"\n />\n }\n @if (!buttons.length) {\n <!-- A bar with nothing in it has no box, and a slot with no box is a slot\n nothing can be dropped on \u2014 the same rect an empty projected Card is\n given (m-one-ui `.card-drop-space`). -->\n <span class=\"m-action__drop\"></span>\n }\n </div>\n}\n\n<ng-template #buttonContent let-button>\n @if (button.icon) {\n <m-icon\n [name]=\"button.icon\"\n [color]=\"iconColor(button)\"\n [remote]=\"remote() ?? config()?.remote\"\n />\n }\n @if (button.label && !isLabelHidden(button)) {\n <span class=\"m-action__label\">{{ button.label | translate }}</span>\n }\n</ng-template>\n", styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}m-action,m-one-action{display:block;width:100%;grid-column:1/-1}m-action.m-action--host-sticky,m-one-action.m-action--host-sticky{position:sticky;top:0;z-index:50;background:#ffffffeb;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.m-action{display:flex;flex-wrap:nowrap;background:transparent;width:100%;border-bottom:1px solid #f1f5f9;--m-action-color: var(--m-button-color, var(--m-one-button-color, var(--m-mm)));--m-action-color-contrast: var(--m-button-color-contrast, var(--m-one-button-color-contrast, #ffffff))}.m-action--stuck{border-bottom-color:#00000014;box-shadow:0 2px 10px #0000000f}.m-action__btn{flex:1;min-width:0;padding:1rem 2rem;border:none;background:transparent;text-decoration:none;color:var(--m-action-label, #1e293b);font-weight:300;font-size:.9rem;display:flex;align-items:center;justify-content:center;gap:.6rem;white-space:nowrap;overflow:hidden;cursor:pointer;border-right:1px solid #f1f5f9;transition:all .25s cubic-bezier(.4,0,.2,1)}.m-action__btn:last-child{border-right:none}.m-action__btn:hover{background:#f8fafc;color:var(--m-action-color)}.m-action__btn .m-icon{transition:transform .2s ease}.m-action__btn:hover .m-icon{transform:scale(1.1)}.m-action__btn:disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.m-action__btn.active{color:var(--m-action-color);font-weight:500}.m-action__btn.m-action__btn--icon-only{padding:1rem .5rem;gap:0}.m-action--toggle .m-action__btn{position:relative;filter:grayscale(100%);transition:all .25s cubic-bezier(.4,0,.2,1),filter .25s cubic-bezier(.4,0,.2,1)}.m-action--toggle .m-action__btn.active{filter:none}.m-action--toggle .m-action__btn.active:hover:not(:disabled){filter:none}.m-action__overflow{display:flex;align-items:center;padding:0 .5rem;flex:0 0 auto}.m-action__drop{display:block;flex:1;min-height:3.5rem;margin:.5rem;border:1px dashed currentColor;border-radius:.25rem;opacity:.4;pointer-events:none}.m-action__label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}@container mag-grid (max-width: 767.98px){.m-action__btn{padding:1rem .75rem;gap:.4rem}}@container mag-grid (max-width: 575.98px){.m-action__btn{padding:.85rem .4rem;font-size:.8rem}}\n"], dependencies: [{ kind: "ngmodule", type: i0.forwardRef(() => CommonModule) }, { kind: "directive", type: i0.forwardRef(() => i1.NgTemplateOutlet), selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i0.forwardRef(() => IconComponent), selector: "m-icon, m-one-icon", inputs: ["config", "name", "color", "size", "one", "baseUrl", "remote"], outputs: ["configChange"] }, { kind: "component", type: i0.forwardRef(() => ContextMenuComponent), selector: "m-context-menu, m-one-context-menu", inputs: ["toggle", "remote", "exclude", "visibilityRule", "disableRule", "extraData", "inverted", "options"], outputs: ["toggleChange", "action"] }, { kind: "directive", type: i0.forwardRef(() => RouterLink), selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "pipe", type: i0.forwardRef(() => TranslatePipe), name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
10615
11608
|
}
|
|
10616
11609
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: ActionComponent, decorators: [{
|
|
10617
11610
|
type: Component,
|
|
@@ -10623,8 +11616,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
|
|
|
10623
11616
|
RouterLink,
|
|
10624
11617
|
], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
|
|
10625
11618
|
'[class.m-action--host-sticky]': 'sticky()',
|
|
10626
|
-
}, template: "@let buttons = actionButtons();\n<!-- No `config()` guard: a bar the Design editor folded its Buttons into has no\n `button_groups/<name>.yml` behind it \u2014 they ride on `[buttons]` instead\n (ADR 0009, ADR 0010) \u2014 so what decides whether the row exists is whether\n there are Buttons in it. Empty, it draws only on the Canvas, where it is\n the drop space a Button lands on. -->\n@if (buttons.length || isDesignMode) {\n <div\n class=\"m-action\"\n [class.m-action--stuck]=\"isStuck()\"\n [class.m-action--toggle]=\"resolvedVariant() === 'toggle'\"\n
|
|
10627
|
-
}], ctorParameters: () => [], propDecorators: { sticky: [{ type: i0.Input, args: [{ isSignal: true, alias: "sticky", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], renderIds: [{ type: i0.Input, args: [{ isSignal: true, alias: "renderIds", required: false }] }], squeezeAt: [{ type: i0.Input, args: [{ isSignal: true, alias: "squeezeAt", required: false }] }], squeezeMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "squeezeMode", required: false }] }] } });
|
|
11619
|
+
}, template: "@let buttons = actionButtons();\n<!-- No `config()` guard: a bar the Design editor folded its Buttons into has no\n `button_groups/<name>.yml` behind it \u2014 they ride on `[buttons]` instead\n (ADR 0009, ADR 0010) \u2014 so what decides whether the row exists is whether\n there are Buttons in it. Empty, it draws only on the Canvas, where it is\n the drop space a Button lands on. -->\n@if (buttons.length || isDesignMode) {\n <div\n class=\"m-action\"\n [class.m-action--stuck]=\"isStuck()\"\n [class.m-action--toggle]=\"resolvedVariant() === 'toggle'\"\n >\n @for (button of visibleButtons(); track $index) {\n <!-- A routed Button is a real link, so the browser's own affordances \u2014\n a middle-click, open in new tab, the URL on hover \u2014 reach it. A\n disabled one stays a <button>: an <a> cannot be disabled, and a\n RouterLink on one would still navigate. -->\n @let link = isDisabled(button.name) ? undefined : linkOf(button);\n @if (link) {\n <a\n class=\"m-action__btn\"\n [routerLink]=\"link\"\n [attr.data-testid]=\"(button.name || '') + '-btn'\"\n [class.active]=\"isActive(button)\"\n [class.m-action__btn--icon-only]=\"isLabelHidden(button)\"\n [attr.aria-label]=\"isLabelHidden(button) ? (button.label | translate) : null\"\n [attr.aria-current]=\"isActive(button) ? 'page' : null\"\n [style.--m-action-color]=\"fillColor(button)\"\n [style.--m-action-color-contrast]=\"contrastColor(button)\"\n [style.--m-action-label]=\"labelColor(button)\"\n (click)=\"select(button)\"\n >\n <ng-container\n *ngTemplateOutlet=\"buttonContent; context: { $implicit: button }\"\n />\n </a>\n } @else {\n <button\n type=\"button\"\n class=\"m-action__btn\"\n [attr.data-testid]=\"(button.name || '') + '-btn'\"\n [attr.render-id]=\"renderIds()?.[button.name ?? '']\"\n [class.active]=\"isActive(button)\"\n [class.m-action__btn--icon-only]=\"isLabelHidden(button)\"\n [attr.aria-label]=\"isLabelHidden(button) ? (button.label | translate) : null\"\n [style.--m-action-color]=\"fillColor(button)\"\n [style.--m-action-color-contrast]=\"contrastColor(button)\"\n [style.--m-action-label]=\"labelColor(button)\"\n [disabled]=\"isDisabled(button.name)\"\n (click)=\"select(button)\"\n >\n <ng-container\n *ngTemplateOutlet=\"buttonContent; context: { $implicit: button }\"\n />\n </button>\n }\n }\n @if (menuButtons().length) {\n <!-- The Buttons the bar could not fit. Squeezed rather than dropped:\n an action the User can still reach behind one press beats an action\n that silently stopped existing at 400px. -->\n <m-context-menu\n class=\"m-action__overflow\"\n [config]=\"squeezeMenu()\"\n [remote]=\"remote() ?? config()?.remote\"\n (action)=\"onMenuAction($event)\"\n />\n }\n @if (!buttons.length) {\n <!-- A bar with nothing in it has no box, and a slot with no box is a slot\n nothing can be dropped on \u2014 the same rect an empty projected Card is\n given (m-one-ui `.card-drop-space`). -->\n <span class=\"m-action__drop\"></span>\n }\n </div>\n}\n\n<ng-template #buttonContent let-button>\n @if (button.icon) {\n <m-icon\n [name]=\"button.icon\"\n [color]=\"iconColor(button)\"\n [remote]=\"remote() ?? config()?.remote\"\n />\n }\n @if (button.label && !isLabelHidden(button)) {\n <span class=\"m-action__label\">{{ button.label | translate }}</span>\n }\n</ng-template>\n", styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}m-action,m-one-action{display:block;width:100%;grid-column:1/-1}m-action.m-action--host-sticky,m-one-action.m-action--host-sticky{position:sticky;top:0;z-index:50;background:#ffffffeb;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.m-action{display:flex;flex-wrap:nowrap;background:transparent;width:100%;border-bottom:1px solid #f1f5f9;--m-action-color: var(--m-button-color, var(--m-one-button-color, var(--m-mm)));--m-action-color-contrast: var(--m-button-color-contrast, var(--m-one-button-color-contrast, #ffffff))}.m-action--stuck{border-bottom-color:#00000014;box-shadow:0 2px 10px #0000000f}.m-action__btn{flex:1;min-width:0;padding:1rem 2rem;border:none;background:transparent;text-decoration:none;color:var(--m-action-label, #1e293b);font-weight:300;font-size:.9rem;display:flex;align-items:center;justify-content:center;gap:.6rem;white-space:nowrap;overflow:hidden;cursor:pointer;border-right:1px solid #f1f5f9;transition:all .25s cubic-bezier(.4,0,.2,1)}.m-action__btn:last-child{border-right:none}.m-action__btn:hover{background:#f8fafc;color:var(--m-action-color)}.m-action__btn .m-icon{transition:transform .2s ease}.m-action__btn:hover .m-icon{transform:scale(1.1)}.m-action__btn:disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.m-action__btn.active{color:var(--m-action-color);font-weight:500}.m-action__btn.m-action__btn--icon-only{padding:1rem .5rem;gap:0}.m-action--toggle .m-action__btn{position:relative;filter:grayscale(100%);transition:all .25s cubic-bezier(.4,0,.2,1),filter .25s cubic-bezier(.4,0,.2,1)}.m-action--toggle .m-action__btn.active{filter:none}.m-action--toggle .m-action__btn.active:hover:not(:disabled){filter:none}.m-action__overflow{display:flex;align-items:center;padding:0 .5rem;flex:0 0 auto}.m-action__drop{display:block;flex:1;min-height:3.5rem;margin:.5rem;border:1px dashed currentColor;border-radius:.25rem;opacity:.4;pointer-events:none}.m-action__label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}@container mag-grid (max-width: 767.98px){.m-action__btn{padding:1rem .75rem;gap:.4rem}}@container mag-grid (max-width: 575.98px){.m-action__btn{padding:.85rem .4rem;font-size:.8rem}}\n"] }]
|
|
11620
|
+
}], ctorParameters: () => [], propDecorators: { sticky: [{ type: i0.Input, args: [{ isSignal: true, alias: "sticky", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], active: [{ type: i0.Input, args: [{ isSignal: true, alias: "active", required: false }] }], renderIds: [{ type: i0.Input, args: [{ isSignal: true, alias: "renderIds", required: false }] }], squeezeAt: [{ type: i0.Input, args: [{ isSignal: true, alias: "squeezeAt", required: false }] }], squeezeMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "squeezeMode", required: false }] }] } });
|
|
10628
11621
|
|
|
10629
11622
|
class BaseInputComponent {
|
|
10630
11623
|
focused = input(false, ...(ngDevMode ? [{ debugName: "focused" }] : /* istanbul ignore next */ []));
|
|
@@ -14834,10 +15827,6 @@ function createMap(elems, key = 'id', elemMap = {}) {
|
|
|
14834
15827
|
}, {}) ?? {});
|
|
14835
15828
|
}
|
|
14836
15829
|
|
|
14837
|
-
function getUniqueId() {
|
|
14838
|
-
return Date.now().toString(36) + Math.random().toString(36).substr(2);
|
|
14839
|
-
}
|
|
14840
|
-
|
|
14841
15830
|
/**
|
|
14842
15831
|
* Ranks items based on a numeric score and provides a sequence of ranks.
|
|
14843
15832
|
*/
|
|
@@ -16965,454 +17954,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
|
|
|
16965
17954
|
args: [{ providedIn: 'root' }]
|
|
16966
17955
|
}] });
|
|
16967
17956
|
|
|
16968
|
-
const MODAL_COMPONENT = new InjectionToken('MODAL_COMPONENT');
|
|
16969
|
-
const PANEL_COMPONENT = new InjectionToken('PANEL_COMPONENT');
|
|
16970
|
-
const CONFIRM_COMPONENT = new InjectionToken('CONFIRM_COMPONENT');
|
|
16971
|
-
/**
|
|
16972
|
-
* The body an overlay opened by name is filled with — what `mModal` and
|
|
16973
|
-
* `mSidePanel` already build by hand, reached through a token here so
|
|
16974
|
-
* `ModalStore.openScreen` can build the same thing without importing the
|
|
16975
|
-
* component into the store (the reason the three above are tokens).
|
|
16976
|
-
*/
|
|
16977
|
-
const OVERLAY_BODY_COMPONENT = new InjectionToken('OVERLAY_BODY_COMPONENT');
|
|
16978
|
-
|
|
16979
|
-
const MODAL_REF = new InjectionToken('MODAL_REF');
|
|
16980
|
-
class ModalRef {
|
|
16981
|
-
closeCallback;
|
|
16982
|
-
changeCallback;
|
|
16983
|
-
/** Commit a result and dismiss (single-pick, confirm, …). */
|
|
16984
|
-
close(result) {
|
|
16985
|
-
this.closeCallback?.(result);
|
|
16986
|
-
}
|
|
16987
|
-
/**
|
|
16988
|
-
* Commit a result without dismissing. Multi-pick panels use this so each
|
|
16989
|
-
* tick updates the field while the panel stays open.
|
|
16990
|
-
*/
|
|
16991
|
-
change(result) {
|
|
16992
|
-
this.changeCallback?.(result);
|
|
16993
|
-
}
|
|
16994
|
-
onClose(callback) {
|
|
16995
|
-
this.closeCallback = callback;
|
|
16996
|
-
}
|
|
16997
|
-
onChange(callback) {
|
|
16998
|
-
this.changeCallback = callback;
|
|
16999
|
-
}
|
|
17000
|
-
}
|
|
17001
|
-
|
|
17002
|
-
/**
|
|
17003
|
-
* A DockedPanel takes the viewport edge and displaces the older SidePanel inboard.
|
|
17004
|
-
* Docking is desktop-only and requires the page to stay readable behind both panels.
|
|
17005
|
-
* See ADR 0004.
|
|
17006
|
-
*/
|
|
17007
|
-
const DOCK_MIN_PAGE_REMAINDER = 320;
|
|
17008
|
-
const DOCK_TRANSITION = '300ms cubic-bezier(0.2, 0, 0, 1)';
|
|
17009
|
-
const DEFAULT_PANEL_WIDTH = '400px';
|
|
17010
|
-
/**
|
|
17011
|
-
* Reads a px panel width. Any other unit is undockable — the displacement offset
|
|
17012
|
-
* must be known before the panel exists in the DOM.
|
|
17013
|
-
*/
|
|
17014
|
-
const parsePanelWidth = (width) => {
|
|
17015
|
-
if (!width?.endsWith('px')) {
|
|
17016
|
-
return undefined;
|
|
17017
|
-
}
|
|
17018
|
-
const value = Number.parseFloat(width);
|
|
17019
|
-
return Number.isFinite(value) ? value : undefined;
|
|
17020
|
-
};
|
|
17021
|
-
/**
|
|
17022
|
-
* A CSS length as a panel needs it. An authored width is free text — the
|
|
17023
|
-
* Screen editor takes `400` as readily as `400px` — and a unitless number is
|
|
17024
|
-
* not a length: the browser drops the declaration and the panel collapses to
|
|
17025
|
-
* its content. A bare number means px, which is what every other authored
|
|
17026
|
-
* dimension in the library already assumes; anything carrying a unit, a
|
|
17027
|
-
* percentage or a `calc()` is passed through untouched.
|
|
17028
|
-
*/
|
|
17029
|
-
const panelCssLength = (value) => {
|
|
17030
|
-
const trimmed = value?.trim();
|
|
17031
|
-
if (!trimmed)
|
|
17032
|
-
return undefined;
|
|
17033
|
-
return /^-?\d*\.?\d+$/.test(trimmed) ? `${trimmed}px` : trimmed;
|
|
17034
|
-
};
|
|
17035
|
-
const hasRoomToDock = (baseWidth, panelWidth, viewportWidth) => {
|
|
17036
|
-
const base = parsePanelWidth(baseWidth);
|
|
17037
|
-
const panel = parsePanelWidth(panelWidth);
|
|
17038
|
-
if (base === undefined || panel === undefined) {
|
|
17039
|
-
return false;
|
|
17040
|
-
}
|
|
17041
|
-
return viewportWidth - (base + panel) >= DOCK_MIN_PAGE_REMAINDER;
|
|
17042
|
-
};
|
|
17043
|
-
|
|
17044
|
-
const initialModalState = {
|
|
17045
|
-
modalTriggerMap: {},
|
|
17046
|
-
className: 'modal',
|
|
17047
|
-
parentClassName: 'modals',
|
|
17048
|
-
activeModal: undefined,
|
|
17049
|
-
panelTriggerMap: {},
|
|
17050
|
-
panelClassName: 'panel',
|
|
17051
|
-
panelParentClassName: 'panels',
|
|
17052
|
-
activePanel: undefined,
|
|
17053
|
-
};
|
|
17054
|
-
const ModalStore = signalStore({ providedIn: 'root' }, withState(initialModalState), withMethods((state, domService = inject(DomService), deviceService = inject(DeviceService)) => {
|
|
17055
|
-
// Every modal that has gone, by id. A modal is dismissed from two places —
|
|
17056
|
-
// its own close affordance and this store — and only one of those runs
|
|
17057
|
-
// through a ModalRef, so a caller waiting on an answer would otherwise wait
|
|
17058
|
-
// forever on the other.
|
|
17059
|
-
const closed = new Subject();
|
|
17060
|
-
const modalComp = inject(MODAL_COMPONENT);
|
|
17061
|
-
const panelComp = inject(PANEL_COMPONENT);
|
|
17062
|
-
const confirmComp = inject(CONFIRM_COMPONENT);
|
|
17063
|
-
const overlayBodyComp = inject(OVERLAY_BODY_COMPONENT);
|
|
17064
|
-
const open = (modalTrigger) => {
|
|
17065
|
-
const id = modalTrigger.id ?? getUniqueId();
|
|
17066
|
-
const modalComponentRef = domService.create({
|
|
17067
|
-
component: modalComp,
|
|
17068
|
-
className: state.className(),
|
|
17069
|
-
id,
|
|
17070
|
-
parentClassName: state.parentClassName(),
|
|
17071
|
-
bindings: [
|
|
17072
|
-
inputBinding('name', () => modalTrigger.name),
|
|
17073
|
-
inputBinding('component', () => modalTrigger.component),
|
|
17074
|
-
inputBinding('bindings', () => modalTrigger.bindings),
|
|
17075
|
-
inputBinding('providers', () => modalTrigger.providers),
|
|
17076
|
-
inputBinding('one', () => modalTrigger.one ?? false),
|
|
17077
|
-
inputBinding('instanceId', () => id),
|
|
17078
|
-
inputBinding('config', () => modalTrigger.config),
|
|
17079
|
-
],
|
|
17080
|
-
});
|
|
17081
|
-
patchState(state, {
|
|
17082
|
-
modalTriggerMap: {
|
|
17083
|
-
...state.modalTriggerMap(),
|
|
17084
|
-
[id]: {
|
|
17085
|
-
...modalTrigger,
|
|
17086
|
-
ref: modalComponentRef,
|
|
17087
|
-
},
|
|
17088
|
-
},
|
|
17089
|
-
activeModal: id,
|
|
17090
|
-
});
|
|
17091
|
-
return id;
|
|
17092
|
-
};
|
|
17093
|
-
const close = (id) => {
|
|
17094
|
-
const modalId = id ?? state.activeModal();
|
|
17095
|
-
const modalTriggerMap = state.modalTriggerMap();
|
|
17096
|
-
if (!modalId) {
|
|
17097
|
-
return;
|
|
17098
|
-
}
|
|
17099
|
-
// A modal that has already gone. Closing it again is what a body and its
|
|
17100
|
-
// own close affordance both doing their job looks like (ADR 0031), and
|
|
17101
|
-
// the state patch below would hand `activeModal` to somebody else's
|
|
17102
|
-
// overlay, so the second call answers nothing.
|
|
17103
|
-
if (id && !modalTriggerMap[id]) {
|
|
17104
|
-
return;
|
|
17105
|
-
}
|
|
17106
|
-
domService.destroy({
|
|
17107
|
-
componentRef: modalTriggerMap[modalId]?.ref,
|
|
17108
|
-
parentClassName: state.parentClassName(),
|
|
17109
|
-
id: modalId,
|
|
17110
|
-
});
|
|
17111
|
-
delete modalTriggerMap[modalId];
|
|
17112
|
-
const remaining = Object.keys(modalTriggerMap);
|
|
17113
|
-
patchState(state, {
|
|
17114
|
-
modalTriggerMap: { ...modalTriggerMap },
|
|
17115
|
-
activeModal: remaining.length
|
|
17116
|
-
? remaining[remaining.length - 1]
|
|
17117
|
-
: undefined,
|
|
17118
|
-
});
|
|
17119
|
-
closed.next(modalId);
|
|
17120
|
-
};
|
|
17121
|
-
/**
|
|
17122
|
-
* The panel a dock request would displace: whatever currently holds the edge.
|
|
17123
|
-
* Docking is decided once, at open — never re-evaluated on resize (ADR 0004).
|
|
17124
|
-
*/
|
|
17125
|
-
const resolveDockTarget = (side, width) => {
|
|
17126
|
-
if (!deviceService.isDesktop()) {
|
|
17127
|
-
return undefined;
|
|
17128
|
-
}
|
|
17129
|
-
const baseId = state.activePanel();
|
|
17130
|
-
const base = baseId ? state.panelTriggerMap()[baseId] : undefined;
|
|
17131
|
-
if (!baseId || !base || (base.side ?? 'right') !== side) {
|
|
17132
|
-
return undefined;
|
|
17133
|
-
}
|
|
17134
|
-
const viewportWidth = typeof window === 'undefined' ? 0 : window.innerWidth;
|
|
17135
|
-
return hasRoomToDock(base.width, width, viewportWidth)
|
|
17136
|
-
? baseId
|
|
17137
|
-
: undefined;
|
|
17138
|
-
};
|
|
17139
|
-
const openPanel = (panelTrigger) => {
|
|
17140
|
-
const id = panelTrigger.id ?? getUniqueId();
|
|
17141
|
-
const side = panelTrigger.side ?? 'right';
|
|
17142
|
-
// Authored free text, made a CSS length: a unitless `400` is dropped by
|
|
17143
|
-
// the browser and the panel opens at the width of its own content.
|
|
17144
|
-
const width = panelCssLength(panelTrigger.width) ?? DEFAULT_PANEL_WIDTH;
|
|
17145
|
-
const height = panelCssLength(panelTrigger.height);
|
|
17146
|
-
const isMobile = deviceService.isMobile();
|
|
17147
|
-
if (panelTrigger.dock) {
|
|
17148
|
-
const activeId = state.activePanel();
|
|
17149
|
-
// Max two panels: a further dock request replaces the current DockedPanel,
|
|
17150
|
-
// which restores the panel underneath to the edge before we displace it again.
|
|
17151
|
-
if (activeId && state.panelTriggerMap()[activeId]?.dockedOver) {
|
|
17152
|
-
closePanel(activeId);
|
|
17153
|
-
}
|
|
17154
|
-
}
|
|
17155
|
-
const dockedOver = panelTrigger.dock
|
|
17156
|
-
? resolveDockTarget(side, width)
|
|
17157
|
-
: undefined;
|
|
17158
|
-
const styles = isMobile
|
|
17159
|
-
? {
|
|
17160
|
-
position: 'fixed',
|
|
17161
|
-
bottom: '0',
|
|
17162
|
-
left: '0',
|
|
17163
|
-
width: '100%',
|
|
17164
|
-
height: '90%',
|
|
17165
|
-
zIndex: '1000',
|
|
17166
|
-
}
|
|
17167
|
-
: {
|
|
17168
|
-
position: 'fixed',
|
|
17169
|
-
top: '0',
|
|
17170
|
-
bottom: '0',
|
|
17171
|
-
[side]: '0',
|
|
17172
|
-
width,
|
|
17173
|
-
zIndex: '1000',
|
|
17174
|
-
transition: `${side} ${DOCK_TRANSITION}`,
|
|
17175
|
-
};
|
|
17176
|
-
const panelComponentRef = domService.create({
|
|
17177
|
-
component: panelComp,
|
|
17178
|
-
className: `${state.panelClassName()} panel--${side}`,
|
|
17179
|
-
id,
|
|
17180
|
-
parentClassName: state.panelParentClassName(),
|
|
17181
|
-
styles,
|
|
17182
|
-
bindings: [
|
|
17183
|
-
inputBinding('component', () => panelTrigger.component),
|
|
17184
|
-
inputBinding('bindings', () => panelTrigger.bindings),
|
|
17185
|
-
inputBinding('providers', () => panelTrigger.providers),
|
|
17186
|
-
inputBinding('side', () => side),
|
|
17187
|
-
inputBinding('instanceId', () => id),
|
|
17188
|
-
inputBinding('docked', () => !!state.panelTriggerMap()[id]?.dockedOver),
|
|
17189
|
-
inputBinding('height', () => height),
|
|
17190
|
-
inputBinding('closeProhibited', () => !!panelTrigger.closeProhibited),
|
|
17191
|
-
],
|
|
17192
|
-
});
|
|
17193
|
-
if (dockedOver) {
|
|
17194
|
-
domService.updateStyleById({
|
|
17195
|
-
id: dockedOver,
|
|
17196
|
-
parentClassName: state.panelParentClassName(),
|
|
17197
|
-
styles: { [side]: width },
|
|
17198
|
-
});
|
|
17199
|
-
}
|
|
17200
|
-
patchState(state, {
|
|
17201
|
-
panelTriggerMap: {
|
|
17202
|
-
...state.panelTriggerMap(),
|
|
17203
|
-
[id]: {
|
|
17204
|
-
...panelTrigger,
|
|
17205
|
-
side,
|
|
17206
|
-
width,
|
|
17207
|
-
dockedOver,
|
|
17208
|
-
ref: panelComponentRef,
|
|
17209
|
-
},
|
|
17210
|
-
},
|
|
17211
|
-
activePanel: id,
|
|
17212
|
-
});
|
|
17213
|
-
return id;
|
|
17214
|
-
};
|
|
17215
|
-
const closePanel = (id) => {
|
|
17216
|
-
const panelId = id ?? state.activePanel();
|
|
17217
|
-
const panelTriggerMap = state.panelTriggerMap();
|
|
17218
|
-
if (!panelId) {
|
|
17219
|
-
return;
|
|
17220
|
-
}
|
|
17221
|
-
// A panel that has already gone — `close`'s reason, and here it would
|
|
17222
|
-
// also promote a DockedPanel a second time.
|
|
17223
|
-
if (id && !panelTriggerMap[id]) {
|
|
17224
|
-
return;
|
|
17225
|
-
}
|
|
17226
|
-
const closing = panelTriggerMap[panelId];
|
|
17227
|
-
domService.destroy({
|
|
17228
|
-
componentRef: closing?.ref,
|
|
17229
|
-
parentClassName: state.panelParentClassName(),
|
|
17230
|
-
id: panelId,
|
|
17231
|
-
});
|
|
17232
|
-
delete panelTriggerMap[panelId];
|
|
17233
|
-
// Closing a DockedPanel returns the panel it displaced to the edge.
|
|
17234
|
-
if (closing?.dockedOver && panelTriggerMap[closing.dockedOver]) {
|
|
17235
|
-
domService.updateStyleById({
|
|
17236
|
-
id: closing.dockedOver,
|
|
17237
|
-
parentClassName: state.panelParentClassName(),
|
|
17238
|
-
styles: { [closing.side ?? 'right']: '0' },
|
|
17239
|
-
});
|
|
17240
|
-
}
|
|
17241
|
-
// Closing a displaced panel promotes its DockedPanel: already at the edge,
|
|
17242
|
-
// so nothing moves — its seam just goes dashed -> solid.
|
|
17243
|
-
const promotedId = Object.keys(panelTriggerMap).find((key) => panelTriggerMap[key]?.dockedOver === panelId);
|
|
17244
|
-
if (promotedId) {
|
|
17245
|
-
panelTriggerMap[promotedId] = {
|
|
17246
|
-
...panelTriggerMap[promotedId],
|
|
17247
|
-
dockedOver: undefined,
|
|
17248
|
-
};
|
|
17249
|
-
}
|
|
17250
|
-
const remaining = Object.keys(panelTriggerMap);
|
|
17251
|
-
patchState(state, {
|
|
17252
|
-
panelTriggerMap: { ...panelTriggerMap },
|
|
17253
|
-
activePanel: remaining.length
|
|
17254
|
-
? remaining[remaining.length - 1]
|
|
17255
|
-
: undefined,
|
|
17256
|
-
});
|
|
17257
|
-
};
|
|
17258
|
-
const cleanupOnClose = rxMethod(pipe(filter((modalMap) => !Object.keys(modalMap).length), tap(() => {
|
|
17259
|
-
domService.cleanup(state.parentClassName());
|
|
17260
|
-
})));
|
|
17261
|
-
const cleanupPanelsOnClose = rxMethod(pipe(filter((panelMap) => !Object.keys(panelMap).length), tap(() => {
|
|
17262
|
-
domService.cleanup(state.panelParentClassName());
|
|
17263
|
-
})));
|
|
17264
|
-
/**
|
|
17265
|
-
* The question as a value: subscribing asks it, and the single emission is
|
|
17266
|
-
* the answer — `true` for the commit, `false` for a refusal and for a
|
|
17267
|
-
* dismissal, which is a refusal by another route. Completes with that
|
|
17268
|
-
* emission, so a `switchMap` over it moves on rather than holding the
|
|
17269
|
-
* modal's answer open.
|
|
17270
|
-
*
|
|
17271
|
-
* Unsubscribing before it answers takes the modal away with it: the caller
|
|
17272
|
-
* that asked is gone, and a dialog nothing is waiting on is a dialog whose
|
|
17273
|
-
* answer lands nowhere.
|
|
17274
|
-
*/
|
|
17275
|
-
const ask = (opts) => new Observable((subscriber) => {
|
|
17276
|
-
const modalRef = new ModalRef();
|
|
17277
|
-
let settled = false;
|
|
17278
|
-
let id = '';
|
|
17279
|
-
const settle = (result, dismiss) => {
|
|
17280
|
-
if (settled)
|
|
17281
|
-
return;
|
|
17282
|
-
settled = true;
|
|
17283
|
-
watch.unsubscribe();
|
|
17284
|
-
if (dismiss)
|
|
17285
|
-
close(id);
|
|
17286
|
-
subscriber.next(result);
|
|
17287
|
-
subscriber.complete();
|
|
17288
|
-
};
|
|
17289
|
-
const watch = closed
|
|
17290
|
-
.pipe(filter((closedId) => closedId === id))
|
|
17291
|
-
.subscribe(() => settle(false, false));
|
|
17292
|
-
id = open({
|
|
17293
|
-
component: confirmComp,
|
|
17294
|
-
providers: [{ provide: MODAL_REF, useValue: modalRef }],
|
|
17295
|
-
bindings: [
|
|
17296
|
-
inputBinding('header', () => opts.header ?? ''),
|
|
17297
|
-
inputBinding('body', () => opts.body ?? ''),
|
|
17298
|
-
inputBinding('params', () => opts.params ?? {}),
|
|
17299
|
-
inputBinding('type', () => opts.type ?? 'info'),
|
|
17300
|
-
inputBinding('kind', () => opts.kind ?? 'yes'),
|
|
17301
|
-
inputBinding('confirmLabel', () => opts.confirmLabel ?? ''),
|
|
17302
|
-
inputBinding('cancelLabel', () => opts.cancelLabel ?? ''),
|
|
17303
|
-
],
|
|
17304
|
-
});
|
|
17305
|
-
modalRef.onClose((result) => settle(!!result, true));
|
|
17306
|
-
return () => {
|
|
17307
|
-
if (settled)
|
|
17308
|
-
return;
|
|
17309
|
-
settled = true;
|
|
17310
|
-
watch.unsubscribe();
|
|
17311
|
-
close(id);
|
|
17312
|
-
};
|
|
17313
|
-
});
|
|
17314
|
-
/**
|
|
17315
|
-
* Opens one Screen as an overlay and hands it its inputs — what a
|
|
17316
|
-
* generated FeatureStore calls where a Control's `mModal` would be the
|
|
17317
|
-
* drawn answer (m-one-ui OpenScreen).
|
|
17318
|
-
*
|
|
17319
|
-
* The same body the two directives build, reached the same way: the widget
|
|
17320
|
-
* is loaded on first open, so nothing it names is in the initial bundle.
|
|
17321
|
-
* Returns the overlay's own id and waits for nothing — the caller is a
|
|
17322
|
-
* `tap` inside a request pipe, and a store that held its emission open
|
|
17323
|
-
* until a panel closed would be answering for a gesture nobody made.
|
|
17324
|
-
*/
|
|
17325
|
-
const openScreen = (trigger) => {
|
|
17326
|
-
const bindings = [
|
|
17327
|
-
inputBinding('widget', () => trigger.widget),
|
|
17328
|
-
inputBinding('inputs', () => trigger.inputs ?? {}),
|
|
17329
|
-
// The body binds these onto the Screen it creates (ADR 0033). A
|
|
17330
|
-
// Screen the opener listens to nothing of hands an empty record,
|
|
17331
|
-
// which binds nothing at all.
|
|
17332
|
-
inputBinding('outputs', () => trigger.outputs ?? {}),
|
|
17333
|
-
];
|
|
17334
|
-
// Its own ModalRef, the way each directive mints one: the body closes
|
|
17335
|
-
// itself through this. Nothing here listens for the *result* — a store
|
|
17336
|
-
// has nowhere to put a panel's answer — but the close dismisses, which is
|
|
17337
|
-
// the whole of what a body opened this way can ask for (ADR 0031).
|
|
17338
|
-
const modalRef = new ModalRef();
|
|
17339
|
-
// What the body answered reaches the caller either way (ADR 0031): a
|
|
17340
|
-
// `change` reports and the overlay stays, a `close` reports and then it
|
|
17341
|
-
// goes. The order on a close is deliberate — a handler that reads the
|
|
17342
|
-
// Screen it opened must run while that Screen is still there.
|
|
17343
|
-
modalRef.onChange((result) => trigger.onResult?.(result));
|
|
17344
|
-
const providers = [{ provide: MODAL_REF, useValue: modalRef }];
|
|
17345
|
-
if (trigger.as === 'side_panel') {
|
|
17346
|
-
const panelId = openPanel({
|
|
17347
|
-
component: overlayBodyComp,
|
|
17348
|
-
bindings,
|
|
17349
|
-
providers,
|
|
17350
|
-
side: trigger.side,
|
|
17351
|
-
width: trigger.width,
|
|
17352
|
-
height: trigger.height,
|
|
17353
|
-
dock: trigger.dock,
|
|
17354
|
-
closeProhibited: trigger.closeProhibited,
|
|
17355
|
-
});
|
|
17356
|
-
modalRef.onClose((result) => {
|
|
17357
|
-
trigger.onResult?.(result);
|
|
17358
|
-
closePanel(panelId);
|
|
17359
|
-
});
|
|
17360
|
-
return panelId;
|
|
17361
|
-
}
|
|
17362
|
-
const modalId = open({
|
|
17363
|
-
component: overlayBodyComp,
|
|
17364
|
-
bindings,
|
|
17365
|
-
providers,
|
|
17366
|
-
config: trigger.config,
|
|
17367
|
-
});
|
|
17368
|
-
modalRef.onClose((result) => {
|
|
17369
|
-
trigger.onResult?.(result);
|
|
17370
|
-
close(modalId);
|
|
17371
|
-
});
|
|
17372
|
-
return modalId;
|
|
17373
|
-
};
|
|
17374
|
-
/**
|
|
17375
|
-
* Closes the overlay with this id, whichever kind it is — what a caller
|
|
17376
|
-
* holding only what `openScreen` returned can say (ADR 0031). Nothing for
|
|
17377
|
-
* an id nothing answers to, which is what a body that already closed itself
|
|
17378
|
-
* leaves behind.
|
|
17379
|
-
*/
|
|
17380
|
-
const dismiss = (id) => {
|
|
17381
|
-
if (state.modalTriggerMap()[id]) {
|
|
17382
|
-
close(id);
|
|
17383
|
-
return;
|
|
17384
|
-
}
|
|
17385
|
-
if (state.panelTriggerMap()[id])
|
|
17386
|
-
closePanel(id);
|
|
17387
|
-
};
|
|
17388
|
-
// The callback form, kept for every caller drawn against it. One
|
|
17389
|
-
// implementation underneath: a refusal runs nothing, which is what an
|
|
17390
|
-
// `onConfirm` that never fires already meant.
|
|
17391
|
-
const confirm = (opts, onConfirm) => {
|
|
17392
|
-
ask(opts).subscribe((result) => {
|
|
17393
|
-
if (result)
|
|
17394
|
-
onConfirm();
|
|
17395
|
-
});
|
|
17396
|
-
};
|
|
17397
|
-
return {
|
|
17398
|
-
open,
|
|
17399
|
-
close,
|
|
17400
|
-
dismiss,
|
|
17401
|
-
ask,
|
|
17402
|
-
confirm,
|
|
17403
|
-
openScreen,
|
|
17404
|
-
openPanel,
|
|
17405
|
-
closePanel,
|
|
17406
|
-
cleanupOnClose,
|
|
17407
|
-
cleanupPanelsOnClose,
|
|
17408
|
-
};
|
|
17409
|
-
}), withHooks({
|
|
17410
|
-
onInit({ cleanupOnClose, modalTriggerMap, cleanupPanelsOnClose, panelTriggerMap, }) {
|
|
17411
|
-
cleanupOnClose(modalTriggerMap);
|
|
17412
|
-
cleanupPanelsOnClose(panelTriggerMap);
|
|
17413
|
-
},
|
|
17414
|
-
}));
|
|
17415
|
-
|
|
17416
17957
|
const USER_TAB_MAP = new InjectionToken('USER_TAB_MAP');
|
|
17417
17958
|
const WIN_USER_TAB_HOOK = '__mag_register_user_tabs__';
|
|
17418
17959
|
const WIN_USER_TAB_KEY = '__mag_user_tabs__';
|
|
@@ -17846,169 +18387,6 @@ function injectAuthenticate() {
|
|
|
17846
18387
|
};
|
|
17847
18388
|
}
|
|
17848
18389
|
|
|
17849
|
-
class ConfirmComponent {
|
|
17850
|
-
header = input('', ...(ngDevMode ? [{ debugName: "header" }] : /* istanbul ignore next */ []));
|
|
17851
|
-
body = input('', ...(ngDevMode ? [{ debugName: "body" }] : /* istanbul ignore next */ []));
|
|
17852
|
-
/**
|
|
17853
|
-
* The MessageVariable values the two keys above name — a row's name or id the
|
|
17854
|
-
* asker knows and the message asks about. Values and never text: they reach
|
|
17855
|
-
* `TranslatePipe` as params rather than spliced into the key, so the message
|
|
17856
|
-
* still resolves per language. Empty is a message with no slots, which is
|
|
17857
|
-
* every confirmation drawn before this.
|
|
17858
|
-
*/
|
|
17859
|
-
params = input({}, ...(ngDevMode ? [{ debugName: "params" }] : /* istanbul ignore next */ []));
|
|
17860
|
-
type = input('info', ...(ngDevMode ? [{ debugName: "type" }] : /* istanbul ignore next */ []));
|
|
17861
|
-
/**
|
|
17862
|
-
* Whether the question can be refused. `yes` is an acknowledgement — the one
|
|
17863
|
-
* button commits and there is nothing else to press — and stays the default,
|
|
17864
|
-
* which is what every ConfirmComponent drawn before this was.
|
|
17865
|
-
*/
|
|
17866
|
-
kind = input('yes', ...(ngDevMode ? [{ debugName: "kind" }] : /* istanbul ignore next */ []));
|
|
17867
|
-
/**
|
|
17868
|
-
* The wording of each button, as a TranslationAsset key. Empty falls back to
|
|
17869
|
-
* the library's own — derived from `type` for the commit, `cancel` for the
|
|
17870
|
-
* refusal — so a caller that has nothing to say about the buttons says
|
|
17871
|
-
* nothing.
|
|
17872
|
-
*/
|
|
17873
|
-
confirmLabel = input('', ...(ngDevMode ? [{ debugName: "confirmLabel" }] : /* istanbul ignore next */ []));
|
|
17874
|
-
cancelLabel = input('', ...(ngDevMode ? [{ debugName: "cancelLabel" }] : /* istanbul ignore next */ []));
|
|
17875
|
-
#modalRef = inject(MODAL_REF);
|
|
17876
|
-
confirmText = computed(() => {
|
|
17877
|
-
if (this.confirmLabel())
|
|
17878
|
-
return this.confirmLabel();
|
|
17879
|
-
switch (this.type()) {
|
|
17880
|
-
case 'danger':
|
|
17881
|
-
return 'delete';
|
|
17882
|
-
default:
|
|
17883
|
-
return 'okay';
|
|
17884
|
-
}
|
|
17885
|
-
}, ...(ngDevMode ? [{ debugName: "confirmText" }] : /* istanbul ignore next */ []));
|
|
17886
|
-
cancelText = computed(() => this.cancelLabel() || 'cancel', ...(ngDevMode ? [{ debugName: "cancelText" }] : /* istanbul ignore next */ []));
|
|
17887
|
-
iconName = computed(() => {
|
|
17888
|
-
switch (this.type()) {
|
|
17889
|
-
case 'danger':
|
|
17890
|
-
return 'trash';
|
|
17891
|
-
case 'warning':
|
|
17892
|
-
return 'exclamation-triangle';
|
|
17893
|
-
case 'success':
|
|
17894
|
-
return 'check-circle';
|
|
17895
|
-
default:
|
|
17896
|
-
return 'info';
|
|
17897
|
-
}
|
|
17898
|
-
}, ...(ngDevMode ? [{ debugName: "iconName" }] : /* istanbul ignore next */ []));
|
|
17899
|
-
accept() {
|
|
17900
|
-
this.#modalRef.close(true);
|
|
17901
|
-
}
|
|
17902
|
-
// The refusal is a result like any other, so it closes with `false` rather
|
|
17903
|
-
// than dismissing: a caller waiting on the answer gets one either way.
|
|
17904
|
-
decline() {
|
|
17905
|
-
this.#modalRef.close(false);
|
|
17906
|
-
}
|
|
17907
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: ConfirmComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
17908
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: ConfirmComponent, isStandalone: true, selector: "m-confirm", inputs: { header: { classPropertyName: "header", publicName: "header", isSignal: true, isRequired: false, transformFunction: null }, body: { classPropertyName: "body", publicName: "body", isSignal: true, isRequired: false, transformFunction: null }, params: { classPropertyName: "params", publicName: "params", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, kind: { classPropertyName: "kind", publicName: "kind", isSignal: true, isRequired: false, transformFunction: null }, confirmLabel: { classPropertyName: "confirmLabel", publicName: "confirmLabel", isSignal: true, isRequired: false, transformFunction: null }, cancelLabel: { classPropertyName: "cancelLabel", publicName: "cancelLabel", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: `
|
|
17909
|
-
<div class="confirm confirm--{{ type() }}">
|
|
17910
|
-
<div class="confirm__header">
|
|
17911
|
-
<div class="confirm__icon">
|
|
17912
|
-
<m-icon [name]="iconName()" />
|
|
17913
|
-
</div>
|
|
17914
|
-
@if (header()) {
|
|
17915
|
-
<!-- The heading takes the key and its values rather than projected
|
|
17916
|
-
text: m-header translates its own label, and a MessageVariable
|
|
17917
|
-
fills the same way it does everywhere else. -->
|
|
17918
|
-
<m-header [level]="3" [label]="header()" [params]="params()" />
|
|
17919
|
-
}
|
|
17920
|
-
</div>
|
|
17921
|
-
|
|
17922
|
-
<div class="confirm__content">
|
|
17923
|
-
@if (body()) {
|
|
17924
|
-
<p class="confirm__body" [innerHTML]="body() | translate: params()"></p>
|
|
17925
|
-
}
|
|
17926
|
-
</div>
|
|
17927
|
-
|
|
17928
|
-
<div class="confirm__actions">
|
|
17929
|
-
@if (kind() === 'yes-no') {
|
|
17930
|
-
<!-- asset: buttons/confirm_cancel.yml -->
|
|
17931
|
-
<m-one-button name="confirm_cancel" [label]="cancelText()" (clicked)="decline()" />
|
|
17932
|
-
}
|
|
17933
|
-
<!-- asset: buttons/okay.yml -->
|
|
17934
|
-
<m-one-button name="okay" [label]="confirmText()" (clicked)="accept()" />
|
|
17935
|
-
</div>
|
|
17936
|
-
</div>
|
|
17937
|
-
`, isInline: true, styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}.confirm{display:flex;flex-direction:column;min-width:320px;max-width:440px;padding:2.5rem;background:var(--m-backdrop-modal, rgba(255, 255, 255, .85));backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:0;position:relative;overflow:hidden}.confirm__header{display:flex;flex-direction:column;align-items:center;text-align:center;gap:.9375rem;margin-bottom:1.5rem}.confirm__icon{width:64px;height:64px;border-radius:1.6rem;display:flex;align-items:center;justify-content:center;font-size:2rem;background:var(--m-backdrop-mm, rgba(65, 105, 225, .1));color:var(--m-mm, #4169e1)}.confirm__icon .m-icon{width:32px;height:32px}.confirm__title{margin:0;font-size:1.375rem;font-weight:700;color:var(--m-text-900);letter-spacing:-.02em}.confirm__content{text-align:center;margin-bottom:2rem}.confirm__body{margin:0;font-size:1rem;line-height:1.6;color:var(--m-text-600)}.confirm__actions{width:100%;margin-top:auto;display:flex;justify-content:center;gap:1rem}.confirm--danger .confirm__icon{background:var(--m-backdrop-error, rgba(235, 25, 26, .1));color:var(--m-error, #EB191A)}.confirm--warning .confirm__icon{background:var(--m-backdrop-warning, rgba(247, 122, 2, .1));color:var(--m-warning, #F77A02)}.confirm--success .confirm__icon{background:var(--m-backdrop-success, rgba(109, 168, 47, .1));color:var(--m-success, #6da82f)}.confirm--info .confirm__icon{background:var(--m-info-lite, rgba(3, 102, 214, .1));color:var(--m-info, #0366d6)}\n"], dependencies: [{ kind: "component", type: ButtonComponent, selector: "m-button,m-one-button", inputs: ["config", "color", "labelClass", "fullWidth", "nav", "navParams", "href", "disabled", "variant", "name", "baseUrl", "one", "remote", "label", "noTranslate", "params", "noNative", "icon", "isRightIcon", "iconOnly", "stacked", "imgSrc", "nonClickable", "inverted", "isSubmit", "tabindex"], outputs: ["configChange", "clicked"] }, { kind: "component", type: IconComponent, selector: "m-icon, m-one-icon", inputs: ["config", "name", "color", "size", "one", "baseUrl", "remote"], outputs: ["configChange"] }, { kind: "component", type: HeaderComponent$1, selector: "m-header", inputs: ["level", "label", "icon", "actionButton", "actionLabel", "noTranslate", "params"], outputs: ["actionClick"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
17938
|
-
}
|
|
17939
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: ConfirmComponent, decorators: [{
|
|
17940
|
-
type: Component,
|
|
17941
|
-
args: [{ selector: 'm-confirm', imports: [ButtonComponent, IconComponent, TranslatePipe, HeaderComponent$1], template: `
|
|
17942
|
-
<div class="confirm confirm--{{ type() }}">
|
|
17943
|
-
<div class="confirm__header">
|
|
17944
|
-
<div class="confirm__icon">
|
|
17945
|
-
<m-icon [name]="iconName()" />
|
|
17946
|
-
</div>
|
|
17947
|
-
@if (header()) {
|
|
17948
|
-
<!-- The heading takes the key and its values rather than projected
|
|
17949
|
-
text: m-header translates its own label, and a MessageVariable
|
|
17950
|
-
fills the same way it does everywhere else. -->
|
|
17951
|
-
<m-header [level]="3" [label]="header()" [params]="params()" />
|
|
17952
|
-
}
|
|
17953
|
-
</div>
|
|
17954
|
-
|
|
17955
|
-
<div class="confirm__content">
|
|
17956
|
-
@if (body()) {
|
|
17957
|
-
<p class="confirm__body" [innerHTML]="body() | translate: params()"></p>
|
|
17958
|
-
}
|
|
17959
|
-
</div>
|
|
17960
|
-
|
|
17961
|
-
<div class="confirm__actions">
|
|
17962
|
-
@if (kind() === 'yes-no') {
|
|
17963
|
-
<!-- asset: buttons/confirm_cancel.yml -->
|
|
17964
|
-
<m-one-button name="confirm_cancel" [label]="cancelText()" (clicked)="decline()" />
|
|
17965
|
-
}
|
|
17966
|
-
<!-- asset: buttons/okay.yml -->
|
|
17967
|
-
<m-one-button name="okay" [label]="confirmText()" (clicked)="accept()" />
|
|
17968
|
-
</div>
|
|
17969
|
-
</div>
|
|
17970
|
-
`, changeDetection: ChangeDetectionStrategy.OnPush, styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}.confirm{display:flex;flex-direction:column;min-width:320px;max-width:440px;padding:2.5rem;background:var(--m-backdrop-modal, rgba(255, 255, 255, .85));backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:0;position:relative;overflow:hidden}.confirm__header{display:flex;flex-direction:column;align-items:center;text-align:center;gap:.9375rem;margin-bottom:1.5rem}.confirm__icon{width:64px;height:64px;border-radius:1.6rem;display:flex;align-items:center;justify-content:center;font-size:2rem;background:var(--m-backdrop-mm, rgba(65, 105, 225, .1));color:var(--m-mm, #4169e1)}.confirm__icon .m-icon{width:32px;height:32px}.confirm__title{margin:0;font-size:1.375rem;font-weight:700;color:var(--m-text-900);letter-spacing:-.02em}.confirm__content{text-align:center;margin-bottom:2rem}.confirm__body{margin:0;font-size:1rem;line-height:1.6;color:var(--m-text-600)}.confirm__actions{width:100%;margin-top:auto;display:flex;justify-content:center;gap:1rem}.confirm--danger .confirm__icon{background:var(--m-backdrop-error, rgba(235, 25, 26, .1));color:var(--m-error, #EB191A)}.confirm--warning .confirm__icon{background:var(--m-backdrop-warning, rgba(247, 122, 2, .1));color:var(--m-warning, #F77A02)}.confirm--success .confirm__icon{background:var(--m-backdrop-success, rgba(109, 168, 47, .1));color:var(--m-success, #6da82f)}.confirm--info .confirm__icon{background:var(--m-info-lite, rgba(3, 102, 214, .1));color:var(--m-info, #0366d6)}\n"] }]
|
|
17971
|
-
}], propDecorators: { header: [{ type: i0.Input, args: [{ isSignal: true, alias: "header", required: false }] }], body: [{ type: i0.Input, args: [{ isSignal: true, alias: "body", required: false }] }], params: [{ type: i0.Input, args: [{ isSignal: true, alias: "params", required: false }] }], type: [{ type: i0.Input, args: [{ isSignal: true, alias: "type", required: false }] }], kind: [{ type: i0.Input, args: [{ isSignal: true, alias: "kind", required: false }] }], confirmLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "confirmLabel", required: false }] }], cancelLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "cancelLabel", required: false }] }] } });
|
|
17972
|
-
|
|
17973
|
-
function injectInstallApp() {
|
|
17974
|
-
const modalStore = inject(ModalStore);
|
|
17975
|
-
const httpService = inject(HttpService);
|
|
17976
|
-
return (app) => {
|
|
17977
|
-
const appName = app.name ?? app.link ?? '';
|
|
17978
|
-
const appId = app.id ?? '';
|
|
17979
|
-
return new Promise((resolve, reject) => {
|
|
17980
|
-
const modalRef = new ModalRef();
|
|
17981
|
-
const id = modalStore.open({
|
|
17982
|
-
component: ConfirmComponent,
|
|
17983
|
-
providers: [{ provide: MODAL_REF, useValue: modalRef }],
|
|
17984
|
-
bindings: [
|
|
17985
|
-
inputBinding('header', () => `install_app_title?appName=${appName}`),
|
|
17986
|
-
inputBinding('body', () => `install_app_body?appName=${appName}`),
|
|
17987
|
-
inputBinding('type', () => 'info'),
|
|
17988
|
-
],
|
|
17989
|
-
});
|
|
17990
|
-
modalRef.onClose(async (confirmed) => {
|
|
17991
|
-
modalStore.close(id);
|
|
17992
|
-
if (!confirmed) {
|
|
17993
|
-
reject(new Error('app_install_declined'));
|
|
17994
|
-
return;
|
|
17995
|
-
}
|
|
17996
|
-
try {
|
|
17997
|
-
const body = await firstValueFrom(httpService.post('store', ['request', appId], {}));
|
|
17998
|
-
if (body?.relation?.type === 5) {
|
|
17999
|
-
reject({ type: 'install_pending', appName });
|
|
18000
|
-
return;
|
|
18001
|
-
}
|
|
18002
|
-
resolve();
|
|
18003
|
-
}
|
|
18004
|
-
catch (e) {
|
|
18005
|
-
reject(e);
|
|
18006
|
-
}
|
|
18007
|
-
});
|
|
18008
|
-
});
|
|
18009
|
-
};
|
|
18010
|
-
}
|
|
18011
|
-
|
|
18012
18390
|
/**
|
|
18013
18391
|
* Pre-creates signal-to-observable conversions at service instantiation time
|
|
18014
18392
|
* (always outside reactive context), preventing NG0602 when interceptors run
|
|
@@ -18087,7 +18465,7 @@ class NotificationService {
|
|
|
18087
18465
|
...notification,
|
|
18088
18466
|
timestamp: notification.timestamp ?? new Date().toISOString(),
|
|
18089
18467
|
});
|
|
18090
|
-
if (!notification.persistent) {
|
|
18468
|
+
if (!notification.persistent && !notification.silent) {
|
|
18091
18469
|
this.scheduleAutoClose(id);
|
|
18092
18470
|
}
|
|
18093
18471
|
return id;
|
|
@@ -18169,7 +18547,13 @@ const tokenRefreshed$ = new Subject();
|
|
|
18169
18547
|
// Holds the refresh token while the refresh HTTP call is in-flight.
|
|
18170
18548
|
// Must be stored before clearAuth() erases it from the store.
|
|
18171
18549
|
let pendingRefreshToken = null;
|
|
18172
|
-
|
|
18550
|
+
/**
|
|
18551
|
+
* The header naming which App sent a request (api ADR 0007): a domain api
|
|
18552
|
+
* honours a Declared Permission only for the App it names.
|
|
18553
|
+
*/
|
|
18554
|
+
const CALLING_APP_HEADER = 'X-Mag-App';
|
|
18555
|
+
// Deduplicates concurrent app_access_required / agreement_required 403s — only
|
|
18556
|
+
// one install or Agreement modal at a time.
|
|
18173
18557
|
// Subsequent failures queue on tokenRefreshed$/authFailed$ rather than opening a second modal.
|
|
18174
18558
|
const appInstallGuard = { pending: null };
|
|
18175
18559
|
function getTokenizedReq(request, { auth }) {
|
|
@@ -18177,14 +18561,19 @@ function getTokenizedReq(request, { auth }) {
|
|
|
18177
18561
|
headers: request.headers.set('Authorization', auth),
|
|
18178
18562
|
});
|
|
18179
18563
|
}
|
|
18180
|
-
const mInterceptor = (
|
|
18564
|
+
const mInterceptor = (incoming, next) => {
|
|
18181
18565
|
const httpService = inject(HttpService);
|
|
18182
18566
|
const injector = inject(Injector);
|
|
18183
18567
|
const baseUrl = httpService.getUrl();
|
|
18184
18568
|
const authBaseUrl = httpService.getAuthUrl();
|
|
18185
|
-
const isBackend =
|
|
18569
|
+
const isBackend = incoming.url.startsWith(baseUrl) || incoming.url.startsWith(authBaseUrl);
|
|
18570
|
+
const appLink = inject(APP_LINK)();
|
|
18571
|
+
const request = appLink && incoming.url.startsWith(baseUrl)
|
|
18572
|
+
? incoming.clone({ setHeaders: { [CALLING_APP_HEADER]: appLink } })
|
|
18573
|
+
: incoming;
|
|
18186
18574
|
const authenticate = injectAuthenticate();
|
|
18187
18575
|
const installApp = injectInstallApp();
|
|
18576
|
+
const agreeToApp = injectAgreeToApp();
|
|
18188
18577
|
const store = inject(LOGIN_STORE);
|
|
18189
18578
|
const authObs = inject(InterceptorObservables);
|
|
18190
18579
|
const tokens = store?.tokens();
|
|
@@ -18229,6 +18618,23 @@ const mInterceptor = (request, next) => {
|
|
|
18229
18618
|
const waitForToken = () => race(tokenRefreshed$.pipe(take(1), switchMap$1(() => sendWithToken())), authFailed$.pipe(take(1), switchMap$1((err) => throwError(() => err))));
|
|
18230
18619
|
const on403 = (error) => {
|
|
18231
18620
|
const hint = error.error?.hint;
|
|
18621
|
+
// The App's Declared Permissions grew since the user agreed, or they never
|
|
18622
|
+
// did (store ADR 0006): ask, record it, and resend.
|
|
18623
|
+
if (hint?.type === 'agreement_required' && hint.app) {
|
|
18624
|
+
actions.cancelLoading();
|
|
18625
|
+
if (!appInstallGuard.pending) {
|
|
18626
|
+
appInstallGuard.pending = agreeToApp(hint.app, hint.permissions ?? [])
|
|
18627
|
+
.then(() => {
|
|
18628
|
+
appInstallGuard.pending = null;
|
|
18629
|
+
tokenRefreshed$.next();
|
|
18630
|
+
})
|
|
18631
|
+
.catch(() => {
|
|
18632
|
+
appInstallGuard.pending = null;
|
|
18633
|
+
authFailed$.next(error);
|
|
18634
|
+
});
|
|
18635
|
+
}
|
|
18636
|
+
return waitForToken();
|
|
18637
|
+
}
|
|
18232
18638
|
if (hint?.type === 'app_access_required' && hint.app) {
|
|
18233
18639
|
actions.cancelLoading();
|
|
18234
18640
|
if (!appInstallGuard.pending) {
|
|
@@ -18418,6 +18824,8 @@ class BaseRootWebComponent extends BaseWebComponent {
|
|
|
18418
18824
|
searchGroups = inject(WC_SEARCH_GROUPS, { optional: true });
|
|
18419
18825
|
/** The custom element itself: the one channel two mounts of this app do not share. */
|
|
18420
18826
|
host = inject(ElementRef).nativeElement;
|
|
18827
|
+
ownAppLink = inject(APP_LINK);
|
|
18828
|
+
agreementGate = inject(AgreementGate);
|
|
18421
18829
|
constructor() {
|
|
18422
18830
|
super();
|
|
18423
18831
|
effect(() => {
|
|
@@ -18485,6 +18893,18 @@ class BaseRootWebComponent extends BaseWebComponent {
|
|
|
18485
18893
|
if (id && !appId)
|
|
18486
18894
|
untracked(() => bindApp(id));
|
|
18487
18895
|
});
|
|
18896
|
+
// m-remote's `appLink` is who this app is, even where the page URL names
|
|
18897
|
+
// the app that mounted it. Named late, so Agreement is asked here rather
|
|
18898
|
+
// than at init (store ADR 0006).
|
|
18899
|
+
effect(() => {
|
|
18900
|
+
const id = this.appLink();
|
|
18901
|
+
if (!id || id === untracked(this.ownAppLink))
|
|
18902
|
+
return;
|
|
18903
|
+
untracked(() => {
|
|
18904
|
+
this.ownAppLink.set(id);
|
|
18905
|
+
this.agreementGate.ensure(id);
|
|
18906
|
+
});
|
|
18907
|
+
});
|
|
18488
18908
|
// Run initial sync when router is ready
|
|
18489
18909
|
this.router.initialNavigation();
|
|
18490
18910
|
const initialPath = this.extra();
|
|
@@ -19211,7 +19631,7 @@ class SectionTableComponent extends ConfigComponent {
|
|
|
19211
19631
|
</div>
|
|
19212
19632
|
<ng-content select="m-section-pagination" />
|
|
19213
19633
|
</div>
|
|
19214
|
-
`, isInline: true, styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}.m-table{display:flex;flex-direction:column;border:1px solid var(--m-backdrop-border);border-radius:12px;overflow:clip;background:#ffffffe6;-webkit-backdrop-filter:blur(40px);backdrop-filter:blur(40px);position:relative;transition:background-color .3s ease}.m-table--flat{border:none;box-shadow:none;background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;border-radius:0}.m-table__toolbar{position:sticky;top:0;z-index:2;display:flex;align-items:center;justify-content:space-between;padding:1.5rem var(--m-table-toolbar-padding-x, 1.25rem);border-bottom:1px solid var(--m-backdrop-border);gap:1.5rem;background:color-mix(in srgb,var(--m-background) 45%,transparent)}.m-table--flat .m-table__toolbar{background:transparent;padding-left:0;padding-right:0}.m-table__title{margin:0;font-size:1.25rem;font-weight:800;color:var(--m-text);letter-spacing:-.02em;flex:1}.m-table__search{flex:0 1 auto;display:flex;align-items:center}.m-table__search .m-input-wrapper{width:100%}.m-table__mobile-view{display:flex;flex-direction:column;gap:1rem;padding:1.25rem;flex:1;overflow:auto}.m-table__empty-mobile{padding:3rem 1.5rem;text-align:center;color:var(--m-text-tertiary);font-size:.9375rem;font-weight:500;font-style:italic;opacity:.8;background:color-mix(in srgb,var(--m-background) 20%,transparent);border-radius:12px;border:1px dashed var(--m-backdrop-border)}.m-table__wrapper{overflow:auto;flex:1}.m-table__wrapper::-webkit-scrollbar{width:6px;height:6px}.m-table__wrapper::-webkit-scrollbar-track{background:transparent}.m-table__wrapper::-webkit-scrollbar-thumb{background:var(--m-backdrop-border);border-radius:10px}.m-table__wrapper::-webkit-scrollbar-thumb:hover{background:var(--m-text-tertiary)}.m-table__table{width:100%;min-width:100%;border-collapse:separate;border-spacing:0}mark.m-table__highlight{background:var(--m-highlight);color:#000;border-radius:2px;padding:0 2px;font-weight:700;box-shadow:0 1px 4px #0003}mark.m-table__highlight .m-one-pagination{margin-left:auto;--m-button-size: 2.25rem;--m-pagination-gap: .375rem}.m-table-pagination{display:flex;align-items:center;gap:1.5rem;padding:1.25rem var(--m-table-pagination-padding-x, 1.25rem);border-top:1px solid var(--m-backdrop-border);font-size:.8125rem;flex-wrap:wrap;background:color-mix(in srgb,var(--m-background) 40%,transparent)}.m-table--flat .m-table-pagination{background:transparent;padding-left:0;padding-right:0}.m-table-pagination__size{display:flex;flex-direction:column;align-items:flex-start;gap:.35rem;color:var(--m-text-secondary);font-weight:500}.m-table-pagination__select{border:1px solid var(--m-backdrop-border);border-radius:8px;background:var(--m-backdrop-surface);color:var(--m-text);padding:.375rem .625rem;font-size:.8125rem;font-weight:600;cursor:pointer;transition:all .2s cubic-bezier(.4,0,.2,1);outline:none}.m-table-pagination__select:hover{background:var(--m-backdrop-glass);border-color:var(--m-mm);box-shadow:0 0 0 3px color-mix(in srgb,var(--m-mm) 10%,transparent)}.m-table-pagination__select:focus{border-color:var(--m-mm);box-shadow:0 0 0 3px color-mix(in srgb,var(--m-mm) 20%,transparent)}.m-table-filter{display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding:1rem 1.25rem;background:color-mix(in srgb,var(--m-background-lite) 60%,transparent);border-bottom:1px solid var(--m-backdrop-border);box-shadow:inset 0 2px 4px #00000005;overflow-x:auto;scrollbar-width:none}.m-table-filter::-webkit-scrollbar{display:none}.m-table--flat .m-table-filter{background:transparent;padding-left:0;padding-right:0;border-bottom:none}.m-table-filter__item{display:flex;align-items:center;gap:10px;padding:.4375rem 1rem;border-radius:12px;background:var(--m-background);border:1px solid var(--m-backdrop-border);color:var(--m-text-secondary);cursor:pointer;transition:all .2s cubic-bezier(.4,0,.2,1);white-space:nowrap;-webkit-user-select:none;user-select:none;outline:none;font-weight:500}.m-table-filter__item:hover{border-color:var(--m-mm);color:var(--m-mm);background:var(--m-background);transform:translateY(-1px);box-shadow:0 4px 12px #0000000d}.m-table-filter__item--active{background:var(--m-mm);border-color:var(--m-mm);color:var(--m-inverse-text);font-weight:600;box-shadow:0 8px 16px color-mix(in srgb,var(--m-mm) 25%,transparent)}.m-table-filter__item--active:hover{background:var(--m-mm);border-color:var(--m-mm);color:var(--m-inverse-text);transform:translateY(-1px)}.m-table-filter__item--active .m-table-filter__badge{background:#fff3;color:var(--m-inverse-text);border-color:#ffffff1a}.m-table-filter__item--primary{background:var(--m-mm);border-color:var(--m-mm);color:var(--m-inverse-text);font-weight:600;box-shadow:0 8px 16px color-mix(in srgb,var(--m-mm) 25%,transparent)}.m-table-filter__item--primary:hover{background:var(--m-mm);border-color:var(--m-mm);color:var(--m-inverse-text);transform:translateY(-1px);box-shadow:0 10px 20px color-mix(in srgb,var(--m-mm) 30%,transparent)}.m-table-filter__item--primary .m-table-filter__badge{background:#fff3;color:var(--m-inverse-text);border-color:#ffffff1a}.m-table-filter__item--danger{border-color:var(--m-error);color:var(--m-error)}.m-table-filter__item--danger:hover{border-color:var(--m-error);color:var(--m-error);background:var(--m-backdrop-error);transform:translateY(-1px);box-shadow:0 4px 12px color-mix(in srgb,var(--m-error) 12%,transparent)}.m-table-filter__item--danger .m-table-filter__badge{background:var(--m-backdrop-error);color:var(--m-error);border-color:color-mix(in srgb,var(--m-error) 20%,transparent)}.m-table-filter__label{font-size:.8125rem;font-weight:600;letter-spacing:.01em}.m-table-filter__badge{display:inline-flex;align-items:center;justify-content:center;min-width:1.25rem;height:1.25rem;padding:0 .375rem;border-radius:100px;background:var(--m-backdrop-surface);color:var(--m-text-secondary);font-size:.6875rem;font-weight:700;border:1px solid var(--m-backdrop-border);transition:all .2s ease}.m-table-thead__th{position:sticky;top:0;z-index:10;background:color-mix(in srgb,var(--m-background) 95%,transparent);-webkit-backdrop-filter:blur(28px);backdrop-filter:blur(28px);padding:1.25rem;text-align:left;font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--m-text-tertiary);border-bottom:2px solid var(--m-backdrop-border);white-space:nowrap;transition:all .2s ease}.m-table-thead__th:hover{color:var(--m-text);background:var(--m-background)}@media(min-width:769px){.m-table-thead__th--fixed{z-index:20;background:var(--m-background)}}@media(max-width:768px){.m-table-thead__th--fixed{position:static;z-index:auto}}.m-table-thead__th--fixed{border-right:none}@media(min-width:769px){.m-table-thead__th--fixed-last{border-right:1px solid var(--m-backdrop-border)}}@media(max-width:768px){.m-table-thead__th--fixed-last{border-right:none}}.m-table-thead__th--sortable{cursor:pointer;-webkit-user-select:none;user-select:none}.m-table-thead__th--select{width:48px;min-width:48px;max-width:48px;padding:0 1rem;text-align:center}.m-table-thead__th--select input[type=checkbox]{width:1rem;height:1rem;cursor:pointer;accent-color:var(--m-mm);border-radius:3px;display:block;margin:0 auto}.m-table-thead__cell{display:flex;align-items:center;gap:.5rem}.m-table-thead__sort-icon{color:var(--m-mm);opacity:.6;transition:opacity .2s ease}.m-table-thead__th:hover .m-table-thead__sort-icon{opacity:1}.m-table-thead__menu-btn{display:flex;align-items:center;justify-content:center;width:1.5rem;height:1.5rem;margin-left:auto;border:none;background:transparent;cursor:pointer;color:var(--m-text-tertiary);border-radius:6px;opacity:0;transition:all .15ms ease}.m-table-thead__menu-btn:hover{background:var(--m-backdrop-surface);color:var(--m-text)}.m-table-thead__th:hover .m-table-thead__menu-btn{opacity:1}.m-table-body__row{transition:background-color .3s cubic-bezier(.4,0,.2,1);position:relative}.m-table-body__row:hover{background:color-mix(in srgb,var(--m-mm) 5%,transparent)}.m-table-body__row:hover .m-table-body__cell{background:inherit}.m-table-body__cell{padding:1rem 1.25rem;font-size:.875rem;color:var(--m-text);border-bottom:1px solid var(--m-backdrop-border);white-space:nowrap;vertical-align:middle;background:transparent;transition:background-color .3s ease}.m-table-body__cell[class*=--number],.m-table-body__cell[class*=--currency],.m-table-body__cell[class*=--percent]{font-family:Inter,Roboto Mono,monospace;font-variant-numeric:tabular-nums;letter-spacing:-.01em}@media(min-width:769px){.m-table-body__cell--fixed{position:sticky;background:var(--m-background);z-index:5}}@media(max-width:768px){.m-table-body__cell--fixed{position:static;background:transparent;z-index:auto}}.m-table-body__cell--fixed{border-right:none;transition:background-color .3s ease}.m-table-body__row:hover .m-table-body__cell--fixed{background:color-mix(in srgb,var(--m-mm) 5%,var(--m-background));z-index:6}@media(min-width:769px){.m-table-body__cell--fixed-last{border-right:1px solid var(--m-backdrop-border)}}@media(max-width:768px){.m-table-body__cell--fixed-last{border-right:none}}.m-table-body__cell--context-menu{padding-top:.35rem;padding-bottom:.35rem}.m-table-body__cell--select{width:48px;min-width:48px;max-width:48px;padding:0 1rem;text-align:center}.m-table-body__cell--select input[type=checkbox],.m-table-body__cell--select input[type=radio]{width:1rem;height:1rem;cursor:pointer;accent-color:var(--m-mm);display:block;margin:0 auto}.m-table-body__input{border:none;border-bottom:2px solid var(--m-backdrop-border);background:transparent;font-size:.875rem;color:var(--m-text);padding:.25rem;outline:none;width:100%;transition:border-bottom-color .2s ease}.m-table-body__input:focus{border-bottom-color:var(--m-mm)}.m-table-body__action-btn{display:flex;align-items:center;justify-content:center;width:2rem;height:2rem;border:none;background:transparent;cursor:pointer;color:var(--m-text-tertiary);border-radius:8px;transition:all .2s ease}.m-table-body__action-btn:hover{background:var(--m-backdrop-surface);color:var(--m-text)}.m-table-body__empty{text-align:center;padding:4rem;color:var(--m-text-tertiary);font-size:1rem;font-weight:500;letter-spacing:.02em;font-style:italic;opacity:.7}.m-table-body__link{color:var(--m-mm);text-decoration:none;cursor:pointer;font-weight:600;transition:color .2s ease}.m-table-body__link:hover{text-decoration:underline;color:var(--m-mm-lite)}.m-table-body__value{padding:.25rem .5rem;border-radius:6px;font-weight:600;font-variant-numeric:tabular-nums;letter-spacing:-.01em}.m-table-body__value--positive{color:var(--m-success);background:var(--m-backdrop-success)}.m-table-body__value--negative{color:var(--m-error);background:var(--m-backdrop-error)}.m-table-body__dash{color:var(--m-text-tertiary);font-weight:400;font-style:italic;opacity:.8}.m-section-table-host{display:block;width:100%}.m-section-table__th{position:static;vertical-align:middle}.m-section-table--sticky .m-section-table__th{position:sticky;top:0}.m-section-table__heading{justify-content:var(--m-section-table-justify, flex-start);min-height:2rem}.m-section-table--compact :where(.m-section-table__th){padding:.625rem .75rem}.m-section-table--compact :where(.m-section-table__cell){padding:.5rem .75rem}.m-section-table--spacious :where(.m-section-table__th){padding:1.5rem 1.75rem}.m-section-table--spacious :where(.m-section-table__cell){padding:1.5rem 1.75rem}.m-section-table--margin{margin-block:1em}.m-section-table--border.m-table{border-top:4px solid var(--m-backdrop-border);border-bottom:2px solid var(--m-backdrop-border)}.m-section-table--zebra .m-section-table__row:nth-child(2n):not(:hover){background:color-mix(in srgb,var(--m-mm) 3%,transparent)}.m-section-table--zebra .m-section-table__row:nth-child(2n):not(:hover) .m-section-table__cell--frozen{background:color-mix(in srgb,var(--m-mm) 3%,var(--m-background))}.m-section-table__th--squeeze{position:relative;padding-right:3rem}.m-section-table__th--folded{padding-left:0;padding-right:0}.m-section-table__squeeze{position:absolute;top:50%;right:.5rem;transform:translateY(-50%);display:flex;border:1px solid var(--m-backdrop-border);border-radius:8px;background:var(--m-backdrop-surface)}.m-section-table__th--folded .m-section-table__squeeze{right:50%;transform:translate(50%,-50%)}@media(min-width:769px){.m-section-table__cell--frozen{position:sticky;z-index:5;background:var(--m-background)}}@media(min-width:769px){.m-section-table th.m-section-table__cell--frozen{z-index:20}}@media(min-width:769px){.m-section-table--sticky .m-section-table th.m-section-table__cell--frozen{z-index:21}}@media(min-width:769px){.m-section-table__cell--frozen-last{border-right:1px solid var(--m-backdrop-border)}}.m-section-table__row:hover .m-section-table__cell--frozen{background:color-mix(in srgb,var(--m-mm) 5%,var(--m-background))}.m-section-table__cell--folded{text-align:center;padding-left:0;padding-right:0}.m-section-table__content[hidden]{display:none}.m-section-table .m-section-table__cell .m-section-table__content .m-text-output-host.align-left .m-text-output{text-align:inherit}.m-section-table__dot{display:inline-block;width:.375rem;height:.375rem;border-radius:50%;background:var(--m-text-tertiary)}.m-section-table__row{cursor:default}\n"], dependencies: [{ kind: "component", type: ButtonComponent, selector: "m-button,m-one-button", inputs: ["config", "color", "labelClass", "fullWidth", "nav", "navParams", "href", "disabled", "variant", "name", "baseUrl", "one", "remote", "label", "noTranslate", "params", "noNative", "icon", "isRightIcon", "iconOnly", "stacked", "imgSrc", "nonClickable", "inverted", "isSubmit", "tabindex"], outputs: ["configChange", "clicked"] }, { kind: "component", type: FreezeComponent, selector: "m-freeze", inputs: ["config"] }, { kind: "component", type: IconComponent, selector: "m-icon, m-one-icon", inputs: ["config", "name", "color", "size", "one", "baseUrl", "remote"], outputs: ["configChange"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
19634
|
+
`, isInline: true, styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}.m-table{display:flex;flex-direction:column;border:1px solid var(--m-backdrop-border);border-radius:12px;overflow:clip;background:#ffffffe6;-webkit-backdrop-filter:blur(40px);backdrop-filter:blur(40px);position:relative;transition:background-color .3s ease}.m-table--flat{border:none;box-shadow:none;background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;border-radius:0}.m-table__toolbar{position:sticky;top:0;z-index:2;display:flex;align-items:center;justify-content:space-between;padding:1.5rem var(--m-table-toolbar-padding-x, 1.25rem);border-bottom:1px solid var(--m-backdrop-border);gap:1.5rem;background:color-mix(in srgb,var(--m-background) 45%,transparent)}.m-table--flat .m-table__toolbar{background:transparent;padding-left:0;padding-right:0}.m-table__title{margin:0;font-size:1.25rem;font-weight:800;color:var(--m-text);letter-spacing:-.02em;flex:1}.m-table__search{flex:0 1 auto;display:flex;align-items:center}.m-table__search .m-input-wrapper{width:100%}.m-table__mobile-view{display:flex;flex-direction:column;gap:1rem;padding:1.25rem;flex:1;overflow:auto}.m-table__empty-mobile{padding:3rem 1.5rem;text-align:center;color:var(--m-text-tertiary);font-size:.9375rem;font-weight:500;font-style:italic;opacity:.8;background:color-mix(in srgb,var(--m-background) 20%,transparent);border-radius:12px;border:1px dashed var(--m-backdrop-border)}.m-table__wrapper{overflow:auto;flex:1}.m-table__wrapper::-webkit-scrollbar{width:6px;height:6px}.m-table__wrapper::-webkit-scrollbar-track{background:transparent}.m-table__wrapper::-webkit-scrollbar-thumb{background:var(--m-backdrop-border);border-radius:10px}.m-table__wrapper::-webkit-scrollbar-thumb:hover{background:var(--m-text-tertiary)}.m-table__table{width:100%;min-width:100%;border-collapse:separate;border-spacing:0}mark.m-table__highlight{background:var(--m-highlight);color:#000;border-radius:2px;padding:0 2px;font-weight:700;box-shadow:0 1px 4px #0003}mark.m-table__highlight .m-one-pagination{margin-left:auto;--m-button-size: 2.25rem;--m-pagination-gap: .375rem}.m-table-pagination{display:flex;align-items:center;gap:1.5rem;padding:1.25rem var(--m-table-pagination-padding-x, 1.25rem);border-top:1px solid var(--m-backdrop-border);font-size:.8125rem;flex-wrap:wrap;background:color-mix(in srgb,var(--m-background) 40%,transparent)}.m-table--flat .m-table-pagination{background:transparent;padding-left:0;padding-right:0}.m-table-pagination__size{display:flex;flex-direction:column;align-items:flex-start;gap:.35rem;color:var(--m-text-secondary);font-weight:500}.m-table-pagination__select{border:1px solid var(--m-backdrop-border);border-radius:8px;background:var(--m-backdrop-surface);color:var(--m-text);padding:.375rem .625rem;font-size:.8125rem;font-weight:600;cursor:pointer;transition:all .2s cubic-bezier(.4,0,.2,1);outline:none}.m-table-pagination__select:hover{background:var(--m-backdrop-glass);border-color:var(--m-mm);box-shadow:0 0 0 3px color-mix(in srgb,var(--m-mm) 10%,transparent)}.m-table-pagination__select:focus{border-color:var(--m-mm);box-shadow:0 0 0 3px color-mix(in srgb,var(--m-mm) 20%,transparent)}.m-table-filter{display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding:1rem 1.25rem;background:color-mix(in srgb,var(--m-background-lite) 60%,transparent);border-bottom:1px solid var(--m-backdrop-border);box-shadow:inset 0 2px 4px #00000005;overflow-x:auto;scrollbar-width:none}.m-table-filter::-webkit-scrollbar{display:none}.m-table--flat .m-table-filter{background:transparent;padding-left:0;padding-right:0;border-bottom:none}.m-table-filter__item{display:flex;align-items:center;gap:10px;padding:.4375rem 1rem;border-radius:12px;background:var(--m-background);border:1px solid var(--m-backdrop-border);color:var(--m-text-secondary);cursor:pointer;transition:all .2s cubic-bezier(.4,0,.2,1);white-space:nowrap;-webkit-user-select:none;user-select:none;outline:none;font-weight:500}.m-table-filter__item:hover{border-color:var(--m-mm);color:var(--m-mm);background:var(--m-background);transform:translateY(-1px);box-shadow:0 4px 12px #0000000d}.m-table-filter__item--active{background:var(--m-mm);border-color:var(--m-mm);color:var(--m-inverse-text);font-weight:600;box-shadow:0 8px 16px color-mix(in srgb,var(--m-mm) 25%,transparent)}.m-table-filter__item--active:hover{background:var(--m-mm);border-color:var(--m-mm);color:var(--m-inverse-text);transform:translateY(-1px)}.m-table-filter__item--active .m-table-filter__badge{background:#fff3;color:var(--m-inverse-text);border-color:#ffffff1a}.m-table-filter__item--primary{background:var(--m-mm);border-color:var(--m-mm);color:var(--m-inverse-text);font-weight:600;box-shadow:0 8px 16px color-mix(in srgb,var(--m-mm) 25%,transparent)}.m-table-filter__item--primary:hover{background:var(--m-mm);border-color:var(--m-mm);color:var(--m-inverse-text);transform:translateY(-1px);box-shadow:0 10px 20px color-mix(in srgb,var(--m-mm) 30%,transparent)}.m-table-filter__item--primary .m-table-filter__badge{background:#fff3;color:var(--m-inverse-text);border-color:#ffffff1a}.m-table-filter__item--danger{border-color:var(--m-error);color:var(--m-error)}.m-table-filter__item--danger:hover{border-color:var(--m-error);color:var(--m-error);background:var(--m-backdrop-error);transform:translateY(-1px);box-shadow:0 4px 12px color-mix(in srgb,var(--m-error) 12%,transparent)}.m-table-filter__item--danger .m-table-filter__badge{background:var(--m-backdrop-error);color:var(--m-error);border-color:color-mix(in srgb,var(--m-error) 20%,transparent)}.m-table-filter__label{font-size:.8125rem;font-weight:600;letter-spacing:.01em}.m-table-filter__badge{display:inline-flex;align-items:center;justify-content:center;min-width:1.25rem;height:1.25rem;padding:0 .375rem;border-radius:100px;background:var(--m-backdrop-surface);color:var(--m-text-secondary);font-size:.6875rem;font-weight:700;border:1px solid var(--m-backdrop-border);transition:all .2s ease}.m-table-thead__th{position:sticky;top:0;z-index:10;background:var(--m-table-thead-background, color-mix(in srgb, var(--m-background) 95%, transparent));-webkit-backdrop-filter:var(--m-table-thead-backdrop-filter, blur(28px));backdrop-filter:var(--m-table-thead-backdrop-filter, blur(28px));padding:1.25rem;text-align:left;font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--m-text-tertiary);border-bottom:2px solid var(--m-backdrop-border);white-space:nowrap;transition:all .2s ease}.m-table-thead__th:hover{color:var(--m-text);background:var(--m-table-thead-background, var(--m-background))}@media(min-width:769px){.m-table-thead__th--fixed{z-index:20;background:var(--m-table-thead-background, var(--m-background))}}@media(max-width:768px){.m-table-thead__th--fixed{position:static;z-index:auto}}.m-table-thead__th--fixed{border-right:none}@media(min-width:769px){.m-table-thead__th--fixed-last{border-right:1px solid var(--m-backdrop-border)}}@media(max-width:768px){.m-table-thead__th--fixed-last{border-right:none}}.m-table-thead__th--sortable{cursor:pointer;-webkit-user-select:none;user-select:none}.m-table-thead__th--select{width:48px;min-width:48px;max-width:48px;padding:0 1rem;text-align:center}.m-table-thead__th--select input[type=checkbox]{width:1rem;height:1rem;cursor:pointer;accent-color:var(--m-mm);border-radius:3px;display:block;margin:0 auto}.m-table-thead__cell{display:flex;align-items:center;gap:.5rem}.m-table-thead__sort-icon{color:var(--m-mm);opacity:.6;transition:opacity .2s ease}.m-table-thead__th:hover .m-table-thead__sort-icon{opacity:1}.m-table-thead__menu-btn{display:flex;align-items:center;justify-content:center;width:1.5rem;height:1.5rem;margin-left:auto;border:none;background:transparent;cursor:pointer;color:var(--m-text-tertiary);border-radius:6px;opacity:0;transition:all .15ms ease}.m-table-thead__menu-btn:hover{background:var(--m-backdrop-surface);color:var(--m-text)}.m-table-thead__th:hover .m-table-thead__menu-btn{opacity:1}.m-table-body__row{transition:background-color .3s cubic-bezier(.4,0,.2,1);position:relative}.m-table-body__row:hover{background:color-mix(in srgb,var(--m-mm) 5%,transparent)}.m-table-body__row:hover .m-table-body__cell{background:inherit}.m-table-body__cell{padding:1rem 1.25rem;font-size:.875rem;color:var(--m-text);border-bottom:1px solid var(--m-backdrop-border);white-space:nowrap;vertical-align:middle;background:transparent;transition:background-color .3s ease}.m-table-body__cell[class*=--number],.m-table-body__cell[class*=--currency],.m-table-body__cell[class*=--percent]{font-family:Inter,Roboto Mono,monospace;font-variant-numeric:tabular-nums;letter-spacing:-.01em}@media(min-width:769px){.m-table-body__cell--fixed{position:sticky;background:var(--m-background);z-index:5}}@media(max-width:768px){.m-table-body__cell--fixed{position:static;background:transparent;z-index:auto}}.m-table-body__cell--fixed{border-right:none;transition:background-color .3s ease}.m-table-body__row:hover .m-table-body__cell--fixed{background:color-mix(in srgb,var(--m-mm) 5%,var(--m-background));z-index:6}@media(min-width:769px){.m-table-body__cell--fixed-last{border-right:1px solid var(--m-backdrop-border)}}@media(max-width:768px){.m-table-body__cell--fixed-last{border-right:none}}.m-table-body__cell--context-menu{padding-top:.35rem;padding-bottom:.35rem}.m-table-body__cell--select{width:48px;min-width:48px;max-width:48px;padding:0 1rem;text-align:center}.m-table-body__cell--select input[type=checkbox],.m-table-body__cell--select input[type=radio]{width:1rem;height:1rem;cursor:pointer;accent-color:var(--m-mm);display:block;margin:0 auto}.m-table-body__input{border:none;border-bottom:2px solid var(--m-backdrop-border);background:transparent;font-size:.875rem;color:var(--m-text);padding:.25rem;outline:none;width:100%;transition:border-bottom-color .2s ease}.m-table-body__input:focus{border-bottom-color:var(--m-mm)}.m-table-body__action-btn{display:flex;align-items:center;justify-content:center;width:2rem;height:2rem;border:none;background:transparent;cursor:pointer;color:var(--m-text-tertiary);border-radius:8px;transition:all .2s ease}.m-table-body__action-btn:hover{background:var(--m-backdrop-surface);color:var(--m-text)}.m-table-body__empty{text-align:center;padding:4rem;color:var(--m-text-tertiary);font-size:1rem;font-weight:500;letter-spacing:.02em;font-style:italic;opacity:.7}.m-table-body__link{color:var(--m-mm);text-decoration:none;cursor:pointer;font-weight:600;transition:color .2s ease}.m-table-body__link:hover{text-decoration:underline;color:var(--m-mm-lite)}.m-table-body__value{padding:.25rem .5rem;border-radius:6px;font-weight:600;font-variant-numeric:tabular-nums;letter-spacing:-.01em}.m-table-body__value--positive{color:var(--m-success);background:var(--m-backdrop-success)}.m-table-body__value--negative{color:var(--m-error);background:var(--m-backdrop-error)}.m-table-body__dash{color:var(--m-text-tertiary);font-weight:400;font-style:italic;opacity:.8}.m-section-table-host{display:block;width:100%}.m-section-table__th{position:static;vertical-align:middle}.m-section-table--sticky .m-section-table__th{position:sticky;top:0}.m-section-table__heading{justify-content:var(--m-section-table-justify, flex-start);min-height:2rem}.m-section-table--compact :where(.m-section-table__th){padding:.625rem .75rem}.m-section-table--compact :where(.m-section-table__cell){padding:.5rem .75rem}.m-section-table--spacious :where(.m-section-table__th){padding:1.5rem 1.75rem}.m-section-table--spacious :where(.m-section-table__cell){padding:1.5rem 1.75rem}.m-section-table--margin{margin-block:1em}.m-section-table--border.m-table{border-top:4px solid var(--m-backdrop-border);border-bottom:2px solid var(--m-backdrop-border)}.m-section-table--zebra .m-section-table__row:nth-child(2n):not(:hover){background:color-mix(in srgb,var(--m-mm) 3%,transparent)}.m-section-table--zebra .m-section-table__row:nth-child(2n):not(:hover) .m-section-table__cell--frozen{background:color-mix(in srgb,var(--m-mm) 3%,var(--m-background))}.m-section-table__th--squeeze{position:relative;padding-right:3rem}.m-section-table__th--folded{padding-left:0;padding-right:0}.m-section-table__squeeze{position:absolute;top:50%;right:.5rem;transform:translateY(-50%);display:flex;border:1px solid var(--m-backdrop-border);border-radius:8px;background:var(--m-backdrop-surface)}.m-section-table__th--folded .m-section-table__squeeze{right:50%;transform:translate(50%,-50%)}@media(min-width:769px){.m-section-table__cell--frozen{position:sticky;z-index:5;background:var(--m-background)}}@media(min-width:769px){.m-section-table th.m-section-table__cell--frozen{z-index:20}}@media(min-width:769px){.m-section-table--sticky .m-section-table th.m-section-table__cell--frozen{z-index:21}}@media(min-width:769px){.m-section-table__cell--frozen-last{border-right:1px solid var(--m-backdrop-border)}}.m-section-table__row:hover .m-section-table__cell--frozen{background:color-mix(in srgb,var(--m-mm) 5%,var(--m-background))}.m-section-table__cell--folded{text-align:center;padding-left:0;padding-right:0}.m-section-table__content[hidden]{display:none}.m-section-table .m-section-table__cell .m-section-table__content .m-text-output-host.align-left .m-text-output{text-align:inherit}.m-section-table__dot{display:inline-block;width:.375rem;height:.375rem;border-radius:50%;background:var(--m-text-tertiary)}.m-section-table__row{cursor:default}\n"], dependencies: [{ kind: "component", type: ButtonComponent, selector: "m-button,m-one-button", inputs: ["config", "color", "labelClass", "fullWidth", "nav", "navParams", "href", "disabled", "variant", "name", "baseUrl", "one", "remote", "label", "noTranslate", "params", "noNative", "icon", "isRightIcon", "iconOnly", "stacked", "imgSrc", "nonClickable", "inverted", "isSubmit", "tabindex"], outputs: ["configChange", "clicked"] }, { kind: "component", type: FreezeComponent, selector: "m-freeze", inputs: ["config"] }, { kind: "component", type: IconComponent, selector: "m-icon, m-one-icon", inputs: ["config", "name", "color", "size", "one", "baseUrl", "remote"], outputs: ["configChange"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
19215
19635
|
}
|
|
19216
19636
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: SectionTableComponent, decorators: [{
|
|
19217
19637
|
type: Component,
|
|
@@ -19305,7 +19725,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
|
|
|
19305
19725
|
};
|
|
19306
19726
|
},
|
|
19307
19727
|
},
|
|
19308
|
-
], styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}.m-table{display:flex;flex-direction:column;border:1px solid var(--m-backdrop-border);border-radius:12px;overflow:clip;background:#ffffffe6;-webkit-backdrop-filter:blur(40px);backdrop-filter:blur(40px);position:relative;transition:background-color .3s ease}.m-table--flat{border:none;box-shadow:none;background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;border-radius:0}.m-table__toolbar{position:sticky;top:0;z-index:2;display:flex;align-items:center;justify-content:space-between;padding:1.5rem var(--m-table-toolbar-padding-x, 1.25rem);border-bottom:1px solid var(--m-backdrop-border);gap:1.5rem;background:color-mix(in srgb,var(--m-background) 45%,transparent)}.m-table--flat .m-table__toolbar{background:transparent;padding-left:0;padding-right:0}.m-table__title{margin:0;font-size:1.25rem;font-weight:800;color:var(--m-text);letter-spacing:-.02em;flex:1}.m-table__search{flex:0 1 auto;display:flex;align-items:center}.m-table__search .m-input-wrapper{width:100%}.m-table__mobile-view{display:flex;flex-direction:column;gap:1rem;padding:1.25rem;flex:1;overflow:auto}.m-table__empty-mobile{padding:3rem 1.5rem;text-align:center;color:var(--m-text-tertiary);font-size:.9375rem;font-weight:500;font-style:italic;opacity:.8;background:color-mix(in srgb,var(--m-background) 20%,transparent);border-radius:12px;border:1px dashed var(--m-backdrop-border)}.m-table__wrapper{overflow:auto;flex:1}.m-table__wrapper::-webkit-scrollbar{width:6px;height:6px}.m-table__wrapper::-webkit-scrollbar-track{background:transparent}.m-table__wrapper::-webkit-scrollbar-thumb{background:var(--m-backdrop-border);border-radius:10px}.m-table__wrapper::-webkit-scrollbar-thumb:hover{background:var(--m-text-tertiary)}.m-table__table{width:100%;min-width:100%;border-collapse:separate;border-spacing:0}mark.m-table__highlight{background:var(--m-highlight);color:#000;border-radius:2px;padding:0 2px;font-weight:700;box-shadow:0 1px 4px #0003}mark.m-table__highlight .m-one-pagination{margin-left:auto;--m-button-size: 2.25rem;--m-pagination-gap: .375rem}.m-table-pagination{display:flex;align-items:center;gap:1.5rem;padding:1.25rem var(--m-table-pagination-padding-x, 1.25rem);border-top:1px solid var(--m-backdrop-border);font-size:.8125rem;flex-wrap:wrap;background:color-mix(in srgb,var(--m-background) 40%,transparent)}.m-table--flat .m-table-pagination{background:transparent;padding-left:0;padding-right:0}.m-table-pagination__size{display:flex;flex-direction:column;align-items:flex-start;gap:.35rem;color:var(--m-text-secondary);font-weight:500}.m-table-pagination__select{border:1px solid var(--m-backdrop-border);border-radius:8px;background:var(--m-backdrop-surface);color:var(--m-text);padding:.375rem .625rem;font-size:.8125rem;font-weight:600;cursor:pointer;transition:all .2s cubic-bezier(.4,0,.2,1);outline:none}.m-table-pagination__select:hover{background:var(--m-backdrop-glass);border-color:var(--m-mm);box-shadow:0 0 0 3px color-mix(in srgb,var(--m-mm) 10%,transparent)}.m-table-pagination__select:focus{border-color:var(--m-mm);box-shadow:0 0 0 3px color-mix(in srgb,var(--m-mm) 20%,transparent)}.m-table-filter{display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding:1rem 1.25rem;background:color-mix(in srgb,var(--m-background-lite) 60%,transparent);border-bottom:1px solid var(--m-backdrop-border);box-shadow:inset 0 2px 4px #00000005;overflow-x:auto;scrollbar-width:none}.m-table-filter::-webkit-scrollbar{display:none}.m-table--flat .m-table-filter{background:transparent;padding-left:0;padding-right:0;border-bottom:none}.m-table-filter__item{display:flex;align-items:center;gap:10px;padding:.4375rem 1rem;border-radius:12px;background:var(--m-background);border:1px solid var(--m-backdrop-border);color:var(--m-text-secondary);cursor:pointer;transition:all .2s cubic-bezier(.4,0,.2,1);white-space:nowrap;-webkit-user-select:none;user-select:none;outline:none;font-weight:500}.m-table-filter__item:hover{border-color:var(--m-mm);color:var(--m-mm);background:var(--m-background);transform:translateY(-1px);box-shadow:0 4px 12px #0000000d}.m-table-filter__item--active{background:var(--m-mm);border-color:var(--m-mm);color:var(--m-inverse-text);font-weight:600;box-shadow:0 8px 16px color-mix(in srgb,var(--m-mm) 25%,transparent)}.m-table-filter__item--active:hover{background:var(--m-mm);border-color:var(--m-mm);color:var(--m-inverse-text);transform:translateY(-1px)}.m-table-filter__item--active .m-table-filter__badge{background:#fff3;color:var(--m-inverse-text);border-color:#ffffff1a}.m-table-filter__item--primary{background:var(--m-mm);border-color:var(--m-mm);color:var(--m-inverse-text);font-weight:600;box-shadow:0 8px 16px color-mix(in srgb,var(--m-mm) 25%,transparent)}.m-table-filter__item--primary:hover{background:var(--m-mm);border-color:var(--m-mm);color:var(--m-inverse-text);transform:translateY(-1px);box-shadow:0 10px 20px color-mix(in srgb,var(--m-mm) 30%,transparent)}.m-table-filter__item--primary .m-table-filter__badge{background:#fff3;color:var(--m-inverse-text);border-color:#ffffff1a}.m-table-filter__item--danger{border-color:var(--m-error);color:var(--m-error)}.m-table-filter__item--danger:hover{border-color:var(--m-error);color:var(--m-error);background:var(--m-backdrop-error);transform:translateY(-1px);box-shadow:0 4px 12px color-mix(in srgb,var(--m-error) 12%,transparent)}.m-table-filter__item--danger .m-table-filter__badge{background:var(--m-backdrop-error);color:var(--m-error);border-color:color-mix(in srgb,var(--m-error) 20%,transparent)}.m-table-filter__label{font-size:.8125rem;font-weight:600;letter-spacing:.01em}.m-table-filter__badge{display:inline-flex;align-items:center;justify-content:center;min-width:1.25rem;height:1.25rem;padding:0 .375rem;border-radius:100px;background:var(--m-backdrop-surface);color:var(--m-text-secondary);font-size:.6875rem;font-weight:700;border:1px solid var(--m-backdrop-border);transition:all .2s ease}.m-table-thead__th{position:sticky;top:0;z-index:10;background:color-mix(in srgb,var(--m-background) 95%,transparent);-webkit-backdrop-filter:blur(28px);backdrop-filter:blur(28px);padding:1.25rem;text-align:left;font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--m-text-tertiary);border-bottom:2px solid var(--m-backdrop-border);white-space:nowrap;transition:all .2s ease}.m-table-thead__th:hover{color:var(--m-text);background:var(--m-background)}@media(min-width:769px){.m-table-thead__th--fixed{z-index:20;background:var(--m-background)}}@media(max-width:768px){.m-table-thead__th--fixed{position:static;z-index:auto}}.m-table-thead__th--fixed{border-right:none}@media(min-width:769px){.m-table-thead__th--fixed-last{border-right:1px solid var(--m-backdrop-border)}}@media(max-width:768px){.m-table-thead__th--fixed-last{border-right:none}}.m-table-thead__th--sortable{cursor:pointer;-webkit-user-select:none;user-select:none}.m-table-thead__th--select{width:48px;min-width:48px;max-width:48px;padding:0 1rem;text-align:center}.m-table-thead__th--select input[type=checkbox]{width:1rem;height:1rem;cursor:pointer;accent-color:var(--m-mm);border-radius:3px;display:block;margin:0 auto}.m-table-thead__cell{display:flex;align-items:center;gap:.5rem}.m-table-thead__sort-icon{color:var(--m-mm);opacity:.6;transition:opacity .2s ease}.m-table-thead__th:hover .m-table-thead__sort-icon{opacity:1}.m-table-thead__menu-btn{display:flex;align-items:center;justify-content:center;width:1.5rem;height:1.5rem;margin-left:auto;border:none;background:transparent;cursor:pointer;color:var(--m-text-tertiary);border-radius:6px;opacity:0;transition:all .15ms ease}.m-table-thead__menu-btn:hover{background:var(--m-backdrop-surface);color:var(--m-text)}.m-table-thead__th:hover .m-table-thead__menu-btn{opacity:1}.m-table-body__row{transition:background-color .3s cubic-bezier(.4,0,.2,1);position:relative}.m-table-body__row:hover{background:color-mix(in srgb,var(--m-mm) 5%,transparent)}.m-table-body__row:hover .m-table-body__cell{background:inherit}.m-table-body__cell{padding:1rem 1.25rem;font-size:.875rem;color:var(--m-text);border-bottom:1px solid var(--m-backdrop-border);white-space:nowrap;vertical-align:middle;background:transparent;transition:background-color .3s ease}.m-table-body__cell[class*=--number],.m-table-body__cell[class*=--currency],.m-table-body__cell[class*=--percent]{font-family:Inter,Roboto Mono,monospace;font-variant-numeric:tabular-nums;letter-spacing:-.01em}@media(min-width:769px){.m-table-body__cell--fixed{position:sticky;background:var(--m-background);z-index:5}}@media(max-width:768px){.m-table-body__cell--fixed{position:static;background:transparent;z-index:auto}}.m-table-body__cell--fixed{border-right:none;transition:background-color .3s ease}.m-table-body__row:hover .m-table-body__cell--fixed{background:color-mix(in srgb,var(--m-mm) 5%,var(--m-background));z-index:6}@media(min-width:769px){.m-table-body__cell--fixed-last{border-right:1px solid var(--m-backdrop-border)}}@media(max-width:768px){.m-table-body__cell--fixed-last{border-right:none}}.m-table-body__cell--context-menu{padding-top:.35rem;padding-bottom:.35rem}.m-table-body__cell--select{width:48px;min-width:48px;max-width:48px;padding:0 1rem;text-align:center}.m-table-body__cell--select input[type=checkbox],.m-table-body__cell--select input[type=radio]{width:1rem;height:1rem;cursor:pointer;accent-color:var(--m-mm);display:block;margin:0 auto}.m-table-body__input{border:none;border-bottom:2px solid var(--m-backdrop-border);background:transparent;font-size:.875rem;color:var(--m-text);padding:.25rem;outline:none;width:100%;transition:border-bottom-color .2s ease}.m-table-body__input:focus{border-bottom-color:var(--m-mm)}.m-table-body__action-btn{display:flex;align-items:center;justify-content:center;width:2rem;height:2rem;border:none;background:transparent;cursor:pointer;color:var(--m-text-tertiary);border-radius:8px;transition:all .2s ease}.m-table-body__action-btn:hover{background:var(--m-backdrop-surface);color:var(--m-text)}.m-table-body__empty{text-align:center;padding:4rem;color:var(--m-text-tertiary);font-size:1rem;font-weight:500;letter-spacing:.02em;font-style:italic;opacity:.7}.m-table-body__link{color:var(--m-mm);text-decoration:none;cursor:pointer;font-weight:600;transition:color .2s ease}.m-table-body__link:hover{text-decoration:underline;color:var(--m-mm-lite)}.m-table-body__value{padding:.25rem .5rem;border-radius:6px;font-weight:600;font-variant-numeric:tabular-nums;letter-spacing:-.01em}.m-table-body__value--positive{color:var(--m-success);background:var(--m-backdrop-success)}.m-table-body__value--negative{color:var(--m-error);background:var(--m-backdrop-error)}.m-table-body__dash{color:var(--m-text-tertiary);font-weight:400;font-style:italic;opacity:.8}.m-section-table-host{display:block;width:100%}.m-section-table__th{position:static;vertical-align:middle}.m-section-table--sticky .m-section-table__th{position:sticky;top:0}.m-section-table__heading{justify-content:var(--m-section-table-justify, flex-start);min-height:2rem}.m-section-table--compact :where(.m-section-table__th){padding:.625rem .75rem}.m-section-table--compact :where(.m-section-table__cell){padding:.5rem .75rem}.m-section-table--spacious :where(.m-section-table__th){padding:1.5rem 1.75rem}.m-section-table--spacious :where(.m-section-table__cell){padding:1.5rem 1.75rem}.m-section-table--margin{margin-block:1em}.m-section-table--border.m-table{border-top:4px solid var(--m-backdrop-border);border-bottom:2px solid var(--m-backdrop-border)}.m-section-table--zebra .m-section-table__row:nth-child(2n):not(:hover){background:color-mix(in srgb,var(--m-mm) 3%,transparent)}.m-section-table--zebra .m-section-table__row:nth-child(2n):not(:hover) .m-section-table__cell--frozen{background:color-mix(in srgb,var(--m-mm) 3%,var(--m-background))}.m-section-table__th--squeeze{position:relative;padding-right:3rem}.m-section-table__th--folded{padding-left:0;padding-right:0}.m-section-table__squeeze{position:absolute;top:50%;right:.5rem;transform:translateY(-50%);display:flex;border:1px solid var(--m-backdrop-border);border-radius:8px;background:var(--m-backdrop-surface)}.m-section-table__th--folded .m-section-table__squeeze{right:50%;transform:translate(50%,-50%)}@media(min-width:769px){.m-section-table__cell--frozen{position:sticky;z-index:5;background:var(--m-background)}}@media(min-width:769px){.m-section-table th.m-section-table__cell--frozen{z-index:20}}@media(min-width:769px){.m-section-table--sticky .m-section-table th.m-section-table__cell--frozen{z-index:21}}@media(min-width:769px){.m-section-table__cell--frozen-last{border-right:1px solid var(--m-backdrop-border)}}.m-section-table__row:hover .m-section-table__cell--frozen{background:color-mix(in srgb,var(--m-mm) 5%,var(--m-background))}.m-section-table__cell--folded{text-align:center;padding-left:0;padding-right:0}.m-section-table__content[hidden]{display:none}.m-section-table .m-section-table__cell .m-section-table__content .m-text-output-host.align-left .m-text-output{text-align:inherit}.m-section-table__dot{display:inline-block;width:.375rem;height:.375rem;border-radius:50%;background:var(--m-text-tertiary)}.m-section-table__row{cursor:default}\n"] }]
|
|
19728
|
+
], styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}.m-table{display:flex;flex-direction:column;border:1px solid var(--m-backdrop-border);border-radius:12px;overflow:clip;background:#ffffffe6;-webkit-backdrop-filter:blur(40px);backdrop-filter:blur(40px);position:relative;transition:background-color .3s ease}.m-table--flat{border:none;box-shadow:none;background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;border-radius:0}.m-table__toolbar{position:sticky;top:0;z-index:2;display:flex;align-items:center;justify-content:space-between;padding:1.5rem var(--m-table-toolbar-padding-x, 1.25rem);border-bottom:1px solid var(--m-backdrop-border);gap:1.5rem;background:color-mix(in srgb,var(--m-background) 45%,transparent)}.m-table--flat .m-table__toolbar{background:transparent;padding-left:0;padding-right:0}.m-table__title{margin:0;font-size:1.25rem;font-weight:800;color:var(--m-text);letter-spacing:-.02em;flex:1}.m-table__search{flex:0 1 auto;display:flex;align-items:center}.m-table__search .m-input-wrapper{width:100%}.m-table__mobile-view{display:flex;flex-direction:column;gap:1rem;padding:1.25rem;flex:1;overflow:auto}.m-table__empty-mobile{padding:3rem 1.5rem;text-align:center;color:var(--m-text-tertiary);font-size:.9375rem;font-weight:500;font-style:italic;opacity:.8;background:color-mix(in srgb,var(--m-background) 20%,transparent);border-radius:12px;border:1px dashed var(--m-backdrop-border)}.m-table__wrapper{overflow:auto;flex:1}.m-table__wrapper::-webkit-scrollbar{width:6px;height:6px}.m-table__wrapper::-webkit-scrollbar-track{background:transparent}.m-table__wrapper::-webkit-scrollbar-thumb{background:var(--m-backdrop-border);border-radius:10px}.m-table__wrapper::-webkit-scrollbar-thumb:hover{background:var(--m-text-tertiary)}.m-table__table{width:100%;min-width:100%;border-collapse:separate;border-spacing:0}mark.m-table__highlight{background:var(--m-highlight);color:#000;border-radius:2px;padding:0 2px;font-weight:700;box-shadow:0 1px 4px #0003}mark.m-table__highlight .m-one-pagination{margin-left:auto;--m-button-size: 2.25rem;--m-pagination-gap: .375rem}.m-table-pagination{display:flex;align-items:center;gap:1.5rem;padding:1.25rem var(--m-table-pagination-padding-x, 1.25rem);border-top:1px solid var(--m-backdrop-border);font-size:.8125rem;flex-wrap:wrap;background:color-mix(in srgb,var(--m-background) 40%,transparent)}.m-table--flat .m-table-pagination{background:transparent;padding-left:0;padding-right:0}.m-table-pagination__size{display:flex;flex-direction:column;align-items:flex-start;gap:.35rem;color:var(--m-text-secondary);font-weight:500}.m-table-pagination__select{border:1px solid var(--m-backdrop-border);border-radius:8px;background:var(--m-backdrop-surface);color:var(--m-text);padding:.375rem .625rem;font-size:.8125rem;font-weight:600;cursor:pointer;transition:all .2s cubic-bezier(.4,0,.2,1);outline:none}.m-table-pagination__select:hover{background:var(--m-backdrop-glass);border-color:var(--m-mm);box-shadow:0 0 0 3px color-mix(in srgb,var(--m-mm) 10%,transparent)}.m-table-pagination__select:focus{border-color:var(--m-mm);box-shadow:0 0 0 3px color-mix(in srgb,var(--m-mm) 20%,transparent)}.m-table-filter{display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding:1rem 1.25rem;background:color-mix(in srgb,var(--m-background-lite) 60%,transparent);border-bottom:1px solid var(--m-backdrop-border);box-shadow:inset 0 2px 4px #00000005;overflow-x:auto;scrollbar-width:none}.m-table-filter::-webkit-scrollbar{display:none}.m-table--flat .m-table-filter{background:transparent;padding-left:0;padding-right:0;border-bottom:none}.m-table-filter__item{display:flex;align-items:center;gap:10px;padding:.4375rem 1rem;border-radius:12px;background:var(--m-background);border:1px solid var(--m-backdrop-border);color:var(--m-text-secondary);cursor:pointer;transition:all .2s cubic-bezier(.4,0,.2,1);white-space:nowrap;-webkit-user-select:none;user-select:none;outline:none;font-weight:500}.m-table-filter__item:hover{border-color:var(--m-mm);color:var(--m-mm);background:var(--m-background);transform:translateY(-1px);box-shadow:0 4px 12px #0000000d}.m-table-filter__item--active{background:var(--m-mm);border-color:var(--m-mm);color:var(--m-inverse-text);font-weight:600;box-shadow:0 8px 16px color-mix(in srgb,var(--m-mm) 25%,transparent)}.m-table-filter__item--active:hover{background:var(--m-mm);border-color:var(--m-mm);color:var(--m-inverse-text);transform:translateY(-1px)}.m-table-filter__item--active .m-table-filter__badge{background:#fff3;color:var(--m-inverse-text);border-color:#ffffff1a}.m-table-filter__item--primary{background:var(--m-mm);border-color:var(--m-mm);color:var(--m-inverse-text);font-weight:600;box-shadow:0 8px 16px color-mix(in srgb,var(--m-mm) 25%,transparent)}.m-table-filter__item--primary:hover{background:var(--m-mm);border-color:var(--m-mm);color:var(--m-inverse-text);transform:translateY(-1px);box-shadow:0 10px 20px color-mix(in srgb,var(--m-mm) 30%,transparent)}.m-table-filter__item--primary .m-table-filter__badge{background:#fff3;color:var(--m-inverse-text);border-color:#ffffff1a}.m-table-filter__item--danger{border-color:var(--m-error);color:var(--m-error)}.m-table-filter__item--danger:hover{border-color:var(--m-error);color:var(--m-error);background:var(--m-backdrop-error);transform:translateY(-1px);box-shadow:0 4px 12px color-mix(in srgb,var(--m-error) 12%,transparent)}.m-table-filter__item--danger .m-table-filter__badge{background:var(--m-backdrop-error);color:var(--m-error);border-color:color-mix(in srgb,var(--m-error) 20%,transparent)}.m-table-filter__label{font-size:.8125rem;font-weight:600;letter-spacing:.01em}.m-table-filter__badge{display:inline-flex;align-items:center;justify-content:center;min-width:1.25rem;height:1.25rem;padding:0 .375rem;border-radius:100px;background:var(--m-backdrop-surface);color:var(--m-text-secondary);font-size:.6875rem;font-weight:700;border:1px solid var(--m-backdrop-border);transition:all .2s ease}.m-table-thead__th{position:sticky;top:0;z-index:10;background:var(--m-table-thead-background, color-mix(in srgb, var(--m-background) 95%, transparent));-webkit-backdrop-filter:var(--m-table-thead-backdrop-filter, blur(28px));backdrop-filter:var(--m-table-thead-backdrop-filter, blur(28px));padding:1.25rem;text-align:left;font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--m-text-tertiary);border-bottom:2px solid var(--m-backdrop-border);white-space:nowrap;transition:all .2s ease}.m-table-thead__th:hover{color:var(--m-text);background:var(--m-table-thead-background, var(--m-background))}@media(min-width:769px){.m-table-thead__th--fixed{z-index:20;background:var(--m-table-thead-background, var(--m-background))}}@media(max-width:768px){.m-table-thead__th--fixed{position:static;z-index:auto}}.m-table-thead__th--fixed{border-right:none}@media(min-width:769px){.m-table-thead__th--fixed-last{border-right:1px solid var(--m-backdrop-border)}}@media(max-width:768px){.m-table-thead__th--fixed-last{border-right:none}}.m-table-thead__th--sortable{cursor:pointer;-webkit-user-select:none;user-select:none}.m-table-thead__th--select{width:48px;min-width:48px;max-width:48px;padding:0 1rem;text-align:center}.m-table-thead__th--select input[type=checkbox]{width:1rem;height:1rem;cursor:pointer;accent-color:var(--m-mm);border-radius:3px;display:block;margin:0 auto}.m-table-thead__cell{display:flex;align-items:center;gap:.5rem}.m-table-thead__sort-icon{color:var(--m-mm);opacity:.6;transition:opacity .2s ease}.m-table-thead__th:hover .m-table-thead__sort-icon{opacity:1}.m-table-thead__menu-btn{display:flex;align-items:center;justify-content:center;width:1.5rem;height:1.5rem;margin-left:auto;border:none;background:transparent;cursor:pointer;color:var(--m-text-tertiary);border-radius:6px;opacity:0;transition:all .15ms ease}.m-table-thead__menu-btn:hover{background:var(--m-backdrop-surface);color:var(--m-text)}.m-table-thead__th:hover .m-table-thead__menu-btn{opacity:1}.m-table-body__row{transition:background-color .3s cubic-bezier(.4,0,.2,1);position:relative}.m-table-body__row:hover{background:color-mix(in srgb,var(--m-mm) 5%,transparent)}.m-table-body__row:hover .m-table-body__cell{background:inherit}.m-table-body__cell{padding:1rem 1.25rem;font-size:.875rem;color:var(--m-text);border-bottom:1px solid var(--m-backdrop-border);white-space:nowrap;vertical-align:middle;background:transparent;transition:background-color .3s ease}.m-table-body__cell[class*=--number],.m-table-body__cell[class*=--currency],.m-table-body__cell[class*=--percent]{font-family:Inter,Roboto Mono,monospace;font-variant-numeric:tabular-nums;letter-spacing:-.01em}@media(min-width:769px){.m-table-body__cell--fixed{position:sticky;background:var(--m-background);z-index:5}}@media(max-width:768px){.m-table-body__cell--fixed{position:static;background:transparent;z-index:auto}}.m-table-body__cell--fixed{border-right:none;transition:background-color .3s ease}.m-table-body__row:hover .m-table-body__cell--fixed{background:color-mix(in srgb,var(--m-mm) 5%,var(--m-background));z-index:6}@media(min-width:769px){.m-table-body__cell--fixed-last{border-right:1px solid var(--m-backdrop-border)}}@media(max-width:768px){.m-table-body__cell--fixed-last{border-right:none}}.m-table-body__cell--context-menu{padding-top:.35rem;padding-bottom:.35rem}.m-table-body__cell--select{width:48px;min-width:48px;max-width:48px;padding:0 1rem;text-align:center}.m-table-body__cell--select input[type=checkbox],.m-table-body__cell--select input[type=radio]{width:1rem;height:1rem;cursor:pointer;accent-color:var(--m-mm);display:block;margin:0 auto}.m-table-body__input{border:none;border-bottom:2px solid var(--m-backdrop-border);background:transparent;font-size:.875rem;color:var(--m-text);padding:.25rem;outline:none;width:100%;transition:border-bottom-color .2s ease}.m-table-body__input:focus{border-bottom-color:var(--m-mm)}.m-table-body__action-btn{display:flex;align-items:center;justify-content:center;width:2rem;height:2rem;border:none;background:transparent;cursor:pointer;color:var(--m-text-tertiary);border-radius:8px;transition:all .2s ease}.m-table-body__action-btn:hover{background:var(--m-backdrop-surface);color:var(--m-text)}.m-table-body__empty{text-align:center;padding:4rem;color:var(--m-text-tertiary);font-size:1rem;font-weight:500;letter-spacing:.02em;font-style:italic;opacity:.7}.m-table-body__link{color:var(--m-mm);text-decoration:none;cursor:pointer;font-weight:600;transition:color .2s ease}.m-table-body__link:hover{text-decoration:underline;color:var(--m-mm-lite)}.m-table-body__value{padding:.25rem .5rem;border-radius:6px;font-weight:600;font-variant-numeric:tabular-nums;letter-spacing:-.01em}.m-table-body__value--positive{color:var(--m-success);background:var(--m-backdrop-success)}.m-table-body__value--negative{color:var(--m-error);background:var(--m-backdrop-error)}.m-table-body__dash{color:var(--m-text-tertiary);font-weight:400;font-style:italic;opacity:.8}.m-section-table-host{display:block;width:100%}.m-section-table__th{position:static;vertical-align:middle}.m-section-table--sticky .m-section-table__th{position:sticky;top:0}.m-section-table__heading{justify-content:var(--m-section-table-justify, flex-start);min-height:2rem}.m-section-table--compact :where(.m-section-table__th){padding:.625rem .75rem}.m-section-table--compact :where(.m-section-table__cell){padding:.5rem .75rem}.m-section-table--spacious :where(.m-section-table__th){padding:1.5rem 1.75rem}.m-section-table--spacious :where(.m-section-table__cell){padding:1.5rem 1.75rem}.m-section-table--margin{margin-block:1em}.m-section-table--border.m-table{border-top:4px solid var(--m-backdrop-border);border-bottom:2px solid var(--m-backdrop-border)}.m-section-table--zebra .m-section-table__row:nth-child(2n):not(:hover){background:color-mix(in srgb,var(--m-mm) 3%,transparent)}.m-section-table--zebra .m-section-table__row:nth-child(2n):not(:hover) .m-section-table__cell--frozen{background:color-mix(in srgb,var(--m-mm) 3%,var(--m-background))}.m-section-table__th--squeeze{position:relative;padding-right:3rem}.m-section-table__th--folded{padding-left:0;padding-right:0}.m-section-table__squeeze{position:absolute;top:50%;right:.5rem;transform:translateY(-50%);display:flex;border:1px solid var(--m-backdrop-border);border-radius:8px;background:var(--m-backdrop-surface)}.m-section-table__th--folded .m-section-table__squeeze{right:50%;transform:translate(50%,-50%)}@media(min-width:769px){.m-section-table__cell--frozen{position:sticky;z-index:5;background:var(--m-background)}}@media(min-width:769px){.m-section-table th.m-section-table__cell--frozen{z-index:20}}@media(min-width:769px){.m-section-table--sticky .m-section-table th.m-section-table__cell--frozen{z-index:21}}@media(min-width:769px){.m-section-table__cell--frozen-last{border-right:1px solid var(--m-backdrop-border)}}.m-section-table__row:hover .m-section-table__cell--frozen{background:color-mix(in srgb,var(--m-mm) 5%,var(--m-background))}.m-section-table__cell--folded{text-align:center;padding-left:0;padding-right:0}.m-section-table__content[hidden]{display:none}.m-section-table .m-section-table__cell .m-section-table__content .m-text-output-host.align-left .m-text-output{text-align:inherit}.m-section-table__dot{display:inline-block;width:.375rem;height:.375rem;border-radius:50%;background:var(--m-text-tertiary)}.m-section-table__row{cursor:default}\n"] }]
|
|
19309
19729
|
}], ctorParameters: () => [], propDecorators: { sticky: [{ type: i0.Input, args: [{ isSignal: true, alias: "sticky", required: false }] }], margin: [{ type: i0.Input, args: [{ isSignal: true, alias: "margin", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], sortChange: [{ type: i0.Output, args: ["sortChange"] }], tableInitialized: [{ type: i0.Output, args: ["tableInitialized"] }], headings: [{ type: i0.ViewChildren, args: ['heading', { isSignal: true }] }] } });
|
|
19310
19730
|
|
|
19311
19731
|
/**
|
|
@@ -22506,7 +22926,7 @@ class WrapperInputComponent extends ConfigComponent {
|
|
|
22506
22926
|
break;
|
|
22507
22927
|
}
|
|
22508
22928
|
case InputType.TOGGLE: {
|
|
22509
|
-
const { ToggleInputComponent } = await import('./magmonium-one-toggle-
|
|
22929
|
+
const { ToggleInputComponent } = await import('./magmonium-one-toggle-CpMURu38.mjs');
|
|
22510
22930
|
this.createDynamicComponent(seq, ToggleInputComponent, [], true);
|
|
22511
22931
|
break;
|
|
22512
22932
|
}
|
|
@@ -22518,12 +22938,12 @@ class WrapperInputComponent extends ConfigComponent {
|
|
|
22518
22938
|
break;
|
|
22519
22939
|
}
|
|
22520
22940
|
case InputType.PASSWORD: {
|
|
22521
|
-
const { PasswordInputComponent } = await import('./magmonium-one-password-
|
|
22941
|
+
const { PasswordInputComponent } = await import('./magmonium-one-password-CyHOns1l.mjs');
|
|
22522
22942
|
this.createDynamicComponent(seq, PasswordInputComponent);
|
|
22523
22943
|
break;
|
|
22524
22944
|
}
|
|
22525
22945
|
case InputType.OTP: {
|
|
22526
|
-
const { OtpInputComponent } = await import('./magmonium-one-otp-
|
|
22946
|
+
const { OtpInputComponent } = await import('./magmonium-one-otp-BwXKEaEg.mjs');
|
|
22527
22947
|
this.createDynamicComponent(seq, OtpInputComponent);
|
|
22528
22948
|
break;
|
|
22529
22949
|
}
|
|
@@ -24230,7 +24650,7 @@ class FileUploadInputComponent extends BaseInputComponent {
|
|
|
24230
24650
|
const modalStore = this.modalStore;
|
|
24231
24651
|
if (!modalStore)
|
|
24232
24652
|
return undefined;
|
|
24233
|
-
const { ImageEditorComponent } = await import('./magmonium-one-image-editor-
|
|
24653
|
+
const { ImageEditorComponent } = await import('./magmonium-one-image-editor-BjCvZ9rH.mjs');
|
|
24234
24654
|
const ratio = String(this.config()?.ratio ?? '');
|
|
24235
24655
|
return new Promise((resolve) => {
|
|
24236
24656
|
const modalRef = new ModalRef();
|
|
@@ -27106,6 +27526,8 @@ class RemoteComponent {
|
|
|
27106
27526
|
mountedLink;
|
|
27107
27527
|
/** The first report after each mount replaces: boot redirects leave no entry. */
|
|
27108
27528
|
reported = false;
|
|
27529
|
+
/** The next report replaces rather than pushes — a move asked to (`move`). */
|
|
27530
|
+
replaceNext = false;
|
|
27109
27531
|
/** The remote's own last word on where it stands, never echoed back to it. */
|
|
27110
27532
|
lastReported;
|
|
27111
27533
|
lastSent;
|
|
@@ -27272,7 +27694,8 @@ class RemoteComponent {
|
|
|
27272
27694
|
* A menu click: unlike a path binding the host URL does not hold it yet, so
|
|
27273
27695
|
* the report that follows is a move to write, not an echo to drop.
|
|
27274
27696
|
*/
|
|
27275
|
-
move = (path) => {
|
|
27697
|
+
move = (path, options) => {
|
|
27698
|
+
this.replaceNext = !!options?.replaceUrl;
|
|
27276
27699
|
this.loadedElement?.dispatchEvent(new CustomEvent(WC_NAVIGATE_EVENT, { detail: { path } }));
|
|
27277
27700
|
};
|
|
27278
27701
|
onReport = (event) => {
|
|
@@ -27298,8 +27721,9 @@ class RemoteComponent {
|
|
|
27298
27721
|
const out = untracked(() => this.out());
|
|
27299
27722
|
const target = out ? out(path, link) : path;
|
|
27300
27723
|
const url = this.url();
|
|
27301
|
-
const replace = !this.reported;
|
|
27724
|
+
const replace = !this.reported || this.replaceNext;
|
|
27302
27725
|
this.reported = true;
|
|
27726
|
+
this.replaceNext = false;
|
|
27303
27727
|
const keys = queryKeysOf(target);
|
|
27304
27728
|
const dropped = this.queryKeys.filter((k) => !keys.includes(k));
|
|
27305
27729
|
this.queryKeys = keys;
|
|
@@ -29159,7 +29583,7 @@ class TableHeaderComponent {
|
|
|
29159
29583
|
}
|
|
29160
29584
|
</tr>
|
|
29161
29585
|
</thead>
|
|
29162
|
-
`, isInline: true, styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}.m-table-thead__th{position:sticky;top:0;z-index:10;background:color-mix(in srgb,var(--m-background) 95%,transparent);-webkit-backdrop-filter:blur(28px);backdrop-filter:blur(28px);padding:1.25rem;text-align:left;font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--m-text-tertiary);border-bottom:2px solid var(--m-backdrop-border);white-space:nowrap;transition:all .2s ease}.m-table-thead__th:hover{color:var(--m-text);background:var(--m-background)}@media(min-width:769px){.m-table-thead__th--fixed{z-index:20;background:var(--m-background)}}@media(max-width:768px){.m-table-thead__th--fixed{position:static;z-index:auto}}.m-table-thead__th--fixed{border-right:none}@media(min-width:769px){.m-table-thead__th--fixed-last{border-right:1px solid var(--m-backdrop-border)}}@media(max-width:768px){.m-table-thead__th--fixed-last{border-right:none}}.m-table-thead__th--sortable{cursor:pointer;-webkit-user-select:none;user-select:none}.m-table-thead__th--select{width:48px;min-width:48px;max-width:48px;padding:0 1rem;text-align:center}.m-table-thead__th--select input[type=checkbox]{width:1rem;height:1rem;cursor:pointer;accent-color:var(--m-mm);border-radius:3px;display:block;margin:0 auto}.m-table-thead__cell{display:flex;align-items:center;gap:.5rem}.m-table-thead__sort-icon{color:var(--m-mm);opacity:.6;transition:opacity .2s ease}.m-table-thead__th:hover .m-table-thead__sort-icon{opacity:1}.m-table-thead__menu-btn{display:flex;align-items:center;justify-content:center;width:1.5rem;height:1.5rem;margin-left:auto;border:none;background:transparent;cursor:pointer;color:var(--m-text-tertiary);border-radius:6px;opacity:0;transition:all .15ms ease}.m-table-thead__menu-btn:hover{background:var(--m-backdrop-surface);color:var(--m-text)}.m-table-thead__th:hover .m-table-thead__menu-btn{opacity:1}\n"], dependencies: [{ kind: "component", type: CheckboxInputComponent, selector: "m-checkbox", inputs: ["checked", "config", "required", "disabled", "invalid", "touched", "focused", "errors"], outputs: ["checkedChange", "touchedChange"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
29586
|
+
`, isInline: true, styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}.m-table-thead__th{position:sticky;top:0;z-index:10;background:var(--m-table-thead-background, color-mix(in srgb, var(--m-background) 95%, transparent));-webkit-backdrop-filter:var(--m-table-thead-backdrop-filter, blur(28px));backdrop-filter:var(--m-table-thead-backdrop-filter, blur(28px));padding:1.25rem;text-align:left;font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--m-text-tertiary);border-bottom:2px solid var(--m-backdrop-border);white-space:nowrap;transition:all .2s ease}.m-table-thead__th:hover{color:var(--m-text);background:var(--m-table-thead-background, var(--m-background))}@media(min-width:769px){.m-table-thead__th--fixed{z-index:20;background:var(--m-table-thead-background, var(--m-background))}}@media(max-width:768px){.m-table-thead__th--fixed{position:static;z-index:auto}}.m-table-thead__th--fixed{border-right:none}@media(min-width:769px){.m-table-thead__th--fixed-last{border-right:1px solid var(--m-backdrop-border)}}@media(max-width:768px){.m-table-thead__th--fixed-last{border-right:none}}.m-table-thead__th--sortable{cursor:pointer;-webkit-user-select:none;user-select:none}.m-table-thead__th--select{width:48px;min-width:48px;max-width:48px;padding:0 1rem;text-align:center}.m-table-thead__th--select input[type=checkbox]{width:1rem;height:1rem;cursor:pointer;accent-color:var(--m-mm);border-radius:3px;display:block;margin:0 auto}.m-table-thead__cell{display:flex;align-items:center;gap:.5rem}.m-table-thead__sort-icon{color:var(--m-mm);opacity:.6;transition:opacity .2s ease}.m-table-thead__th:hover .m-table-thead__sort-icon{opacity:1}.m-table-thead__menu-btn{display:flex;align-items:center;justify-content:center;width:1.5rem;height:1.5rem;margin-left:auto;border:none;background:transparent;cursor:pointer;color:var(--m-text-tertiary);border-radius:6px;opacity:0;transition:all .15ms ease}.m-table-thead__menu-btn:hover{background:var(--m-backdrop-surface);color:var(--m-text)}.m-table-thead__th:hover .m-table-thead__menu-btn{opacity:1}\n"], dependencies: [{ kind: "component", type: CheckboxInputComponent, selector: "m-checkbox", inputs: ["checked", "config", "required", "disabled", "invalid", "touched", "focused", "errors"], outputs: ["checkedChange", "touchedChange"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
29163
29587
|
}
|
|
29164
29588
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: TableHeaderComponent, decorators: [{
|
|
29165
29589
|
type: Component,
|
|
@@ -29212,7 +29636,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
|
|
|
29212
29636
|
}
|
|
29213
29637
|
</tr>
|
|
29214
29638
|
</thead>
|
|
29215
|
-
`, changeDetection: ChangeDetectionStrategy.OnPush, styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}.m-table-thead__th{position:sticky;top:0;z-index:10;background:color-mix(in srgb,var(--m-background) 95%,transparent);-webkit-backdrop-filter:blur(28px);backdrop-filter:blur(28px);padding:1.25rem;text-align:left;font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--m-text-tertiary);border-bottom:2px solid var(--m-backdrop-border);white-space:nowrap;transition:all .2s ease}.m-table-thead__th:hover{color:var(--m-text);background:var(--m-background)}@media(min-width:769px){.m-table-thead__th--fixed{z-index:20;background:var(--m-background)}}@media(max-width:768px){.m-table-thead__th--fixed{position:static;z-index:auto}}.m-table-thead__th--fixed{border-right:none}@media(min-width:769px){.m-table-thead__th--fixed-last{border-right:1px solid var(--m-backdrop-border)}}@media(max-width:768px){.m-table-thead__th--fixed-last{border-right:none}}.m-table-thead__th--sortable{cursor:pointer;-webkit-user-select:none;user-select:none}.m-table-thead__th--select{width:48px;min-width:48px;max-width:48px;padding:0 1rem;text-align:center}.m-table-thead__th--select input[type=checkbox]{width:1rem;height:1rem;cursor:pointer;accent-color:var(--m-mm);border-radius:3px;display:block;margin:0 auto}.m-table-thead__cell{display:flex;align-items:center;gap:.5rem}.m-table-thead__sort-icon{color:var(--m-mm);opacity:.6;transition:opacity .2s ease}.m-table-thead__th:hover .m-table-thead__sort-icon{opacity:1}.m-table-thead__menu-btn{display:flex;align-items:center;justify-content:center;width:1.5rem;height:1.5rem;margin-left:auto;border:none;background:transparent;cursor:pointer;color:var(--m-text-tertiary);border-radius:6px;opacity:0;transition:all .15ms ease}.m-table-thead__menu-btn:hover{background:var(--m-backdrop-surface);color:var(--m-text)}.m-table-thead__th:hover .m-table-thead__menu-btn{opacity:1}\n"] }]
|
|
29639
|
+
`, changeDetection: ChangeDetectionStrategy.OnPush, styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}.m-table-thead__th{position:sticky;top:0;z-index:10;background:var(--m-table-thead-background, color-mix(in srgb, var(--m-background) 95%, transparent));-webkit-backdrop-filter:var(--m-table-thead-backdrop-filter, blur(28px));backdrop-filter:var(--m-table-thead-backdrop-filter, blur(28px));padding:1.25rem;text-align:left;font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--m-text-tertiary);border-bottom:2px solid var(--m-backdrop-border);white-space:nowrap;transition:all .2s ease}.m-table-thead__th:hover{color:var(--m-text);background:var(--m-table-thead-background, var(--m-background))}@media(min-width:769px){.m-table-thead__th--fixed{z-index:20;background:var(--m-table-thead-background, var(--m-background))}}@media(max-width:768px){.m-table-thead__th--fixed{position:static;z-index:auto}}.m-table-thead__th--fixed{border-right:none}@media(min-width:769px){.m-table-thead__th--fixed-last{border-right:1px solid var(--m-backdrop-border)}}@media(max-width:768px){.m-table-thead__th--fixed-last{border-right:none}}.m-table-thead__th--sortable{cursor:pointer;-webkit-user-select:none;user-select:none}.m-table-thead__th--select{width:48px;min-width:48px;max-width:48px;padding:0 1rem;text-align:center}.m-table-thead__th--select input[type=checkbox]{width:1rem;height:1rem;cursor:pointer;accent-color:var(--m-mm);border-radius:3px;display:block;margin:0 auto}.m-table-thead__cell{display:flex;align-items:center;gap:.5rem}.m-table-thead__sort-icon{color:var(--m-mm);opacity:.6;transition:opacity .2s ease}.m-table-thead__th:hover .m-table-thead__sort-icon{opacity:1}.m-table-thead__menu-btn{display:flex;align-items:center;justify-content:center;width:1.5rem;height:1.5rem;margin-left:auto;border:none;background:transparent;cursor:pointer;color:var(--m-text-tertiary);border-radius:6px;opacity:0;transition:all .15ms ease}.m-table-thead__menu-btn:hover{background:var(--m-backdrop-surface);color:var(--m-text)}.m-table-thead__th:hover .m-table-thead__menu-btn{opacity:1}\n"] }]
|
|
29216
29640
|
}], propDecorators: { visibleColumns: [{ type: i0.Input, args: [{ isSignal: true, alias: "visibleColumns", required: false }] }], fixedCount: [{ type: i0.Input, args: [{ isSignal: true, alias: "fixedCount", required: false }] }], fixedOffset: [{ type: i0.Input, args: [{ isSignal: true, alias: "fixedOffset", required: false }] }], sortState: [{ type: i0.Input, args: [{ isSignal: true, alias: "sortState", required: false }] }], sortClick: [{ type: i0.Output, args: ["sortClick"] }], selectable: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectable", required: false }] }], allSelected: [{ type: i0.Input, args: [{ isSignal: true, alias: "allSelected", required: false }] }], someSelected: [{ type: i0.Input, args: [{ isSignal: true, alias: "someSelected", required: false }] }], selectAll: [{ type: i0.Output, args: ["selectAll"] }] } });
|
|
29217
29641
|
|
|
29218
29642
|
class TableUserCellComponent {
|
|
@@ -31274,7 +31698,7 @@ class TreeGridComponent extends ConfigComponent {
|
|
|
31274
31698
|
</table>
|
|
31275
31699
|
</div>
|
|
31276
31700
|
</div>
|
|
31277
|
-
`, isInline: true, styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}.m-table{display:flex;flex-direction:column;border:1px solid var(--m-backdrop-border);border-radius:12px;overflow:clip;background:#ffffffe6;-webkit-backdrop-filter:blur(40px);backdrop-filter:blur(40px);position:relative;transition:background-color .3s ease}.m-table--flat{border:none;box-shadow:none;background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;border-radius:0}.m-table__toolbar{position:sticky;top:0;z-index:2;display:flex;align-items:center;justify-content:space-between;padding:1.5rem var(--m-table-toolbar-padding-x, 1.25rem);border-bottom:1px solid var(--m-backdrop-border);gap:1.5rem;background:color-mix(in srgb,var(--m-background) 45%,transparent)}.m-table--flat .m-table__toolbar{background:transparent;padding-left:0;padding-right:0}.m-table__title{margin:0;font-size:1.25rem;font-weight:800;color:var(--m-text);letter-spacing:-.02em;flex:1}.m-table__search{flex:0 1 auto;display:flex;align-items:center}.m-table__search .m-input-wrapper{width:100%}.m-table__mobile-view{display:flex;flex-direction:column;gap:1rem;padding:1.25rem;flex:1;overflow:auto}.m-table__empty-mobile{padding:3rem 1.5rem;text-align:center;color:var(--m-text-tertiary);font-size:.9375rem;font-weight:500;font-style:italic;opacity:.8;background:color-mix(in srgb,var(--m-background) 20%,transparent);border-radius:12px;border:1px dashed var(--m-backdrop-border)}.m-table__wrapper{overflow:auto;flex:1}.m-table__wrapper::-webkit-scrollbar{width:6px;height:6px}.m-table__wrapper::-webkit-scrollbar-track{background:transparent}.m-table__wrapper::-webkit-scrollbar-thumb{background:var(--m-backdrop-border);border-radius:10px}.m-table__wrapper::-webkit-scrollbar-thumb:hover{background:var(--m-text-tertiary)}.m-table__table{width:100%;min-width:100%;border-collapse:separate;border-spacing:0}mark.m-table__highlight{background:var(--m-highlight);color:#000;border-radius:2px;padding:0 2px;font-weight:700;box-shadow:0 1px 4px #0003}mark.m-table__highlight .m-one-pagination{margin-left:auto;--m-button-size: 2.25rem;--m-pagination-gap: .375rem}.m-table-pagination{display:flex;align-items:center;gap:1.5rem;padding:1.25rem var(--m-table-pagination-padding-x, 1.25rem);border-top:1px solid var(--m-backdrop-border);font-size:.8125rem;flex-wrap:wrap;background:color-mix(in srgb,var(--m-background) 40%,transparent)}.m-table--flat .m-table-pagination{background:transparent;padding-left:0;padding-right:0}.m-table-pagination__size{display:flex;flex-direction:column;align-items:flex-start;gap:.35rem;color:var(--m-text-secondary);font-weight:500}.m-table-pagination__select{border:1px solid var(--m-backdrop-border);border-radius:8px;background:var(--m-backdrop-surface);color:var(--m-text);padding:.375rem .625rem;font-size:.8125rem;font-weight:600;cursor:pointer;transition:all .2s cubic-bezier(.4,0,.2,1);outline:none}.m-table-pagination__select:hover{background:var(--m-backdrop-glass);border-color:var(--m-mm);box-shadow:0 0 0 3px color-mix(in srgb,var(--m-mm) 10%,transparent)}.m-table-pagination__select:focus{border-color:var(--m-mm);box-shadow:0 0 0 3px color-mix(in srgb,var(--m-mm) 20%,transparent)}.m-table-filter{display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding:1rem 1.25rem;background:color-mix(in srgb,var(--m-background-lite) 60%,transparent);border-bottom:1px solid var(--m-backdrop-border);box-shadow:inset 0 2px 4px #00000005;overflow-x:auto;scrollbar-width:none}.m-table-filter::-webkit-scrollbar{display:none}.m-table--flat .m-table-filter{background:transparent;padding-left:0;padding-right:0;border-bottom:none}.m-table-filter__item{display:flex;align-items:center;gap:10px;padding:.4375rem 1rem;border-radius:12px;background:var(--m-background);border:1px solid var(--m-backdrop-border);color:var(--m-text-secondary);cursor:pointer;transition:all .2s cubic-bezier(.4,0,.2,1);white-space:nowrap;-webkit-user-select:none;user-select:none;outline:none;font-weight:500}.m-table-filter__item:hover{border-color:var(--m-mm);color:var(--m-mm);background:var(--m-background);transform:translateY(-1px);box-shadow:0 4px 12px #0000000d}.m-table-filter__item--active{background:var(--m-mm);border-color:var(--m-mm);color:var(--m-inverse-text);font-weight:600;box-shadow:0 8px 16px color-mix(in srgb,var(--m-mm) 25%,transparent)}.m-table-filter__item--active:hover{background:var(--m-mm);border-color:var(--m-mm);color:var(--m-inverse-text);transform:translateY(-1px)}.m-table-filter__item--active .m-table-filter__badge{background:#fff3;color:var(--m-inverse-text);border-color:#ffffff1a}.m-table-filter__item--primary{background:var(--m-mm);border-color:var(--m-mm);color:var(--m-inverse-text);font-weight:600;box-shadow:0 8px 16px color-mix(in srgb,var(--m-mm) 25%,transparent)}.m-table-filter__item--primary:hover{background:var(--m-mm);border-color:var(--m-mm);color:var(--m-inverse-text);transform:translateY(-1px);box-shadow:0 10px 20px color-mix(in srgb,var(--m-mm) 30%,transparent)}.m-table-filter__item--primary .m-table-filter__badge{background:#fff3;color:var(--m-inverse-text);border-color:#ffffff1a}.m-table-filter__item--danger{border-color:var(--m-error);color:var(--m-error)}.m-table-filter__item--danger:hover{border-color:var(--m-error);color:var(--m-error);background:var(--m-backdrop-error);transform:translateY(-1px);box-shadow:0 4px 12px color-mix(in srgb,var(--m-error) 12%,transparent)}.m-table-filter__item--danger .m-table-filter__badge{background:var(--m-backdrop-error);color:var(--m-error);border-color:color-mix(in srgb,var(--m-error) 20%,transparent)}.m-table-filter__label{font-size:.8125rem;font-weight:600;letter-spacing:.01em}.m-table-filter__badge{display:inline-flex;align-items:center;justify-content:center;min-width:1.25rem;height:1.25rem;padding:0 .375rem;border-radius:100px;background:var(--m-backdrop-surface);color:var(--m-text-secondary);font-size:.6875rem;font-weight:700;border:1px solid var(--m-backdrop-border);transition:all .2s ease}.m-table-thead__th{position:sticky;top:0;z-index:10;background:color-mix(in srgb,var(--m-background) 95%,transparent);-webkit-backdrop-filter:blur(28px);backdrop-filter:blur(28px);padding:1.25rem;text-align:left;font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--m-text-tertiary);border-bottom:2px solid var(--m-backdrop-border);white-space:nowrap;transition:all .2s ease}.m-table-thead__th:hover{color:var(--m-text);background:var(--m-background)}@media(min-width:769px){.m-table-thead__th--fixed{z-index:20;background:var(--m-background)}}@media(max-width:768px){.m-table-thead__th--fixed{position:static;z-index:auto}}.m-table-thead__th--fixed{border-right:none}@media(min-width:769px){.m-table-thead__th--fixed-last{border-right:1px solid var(--m-backdrop-border)}}@media(max-width:768px){.m-table-thead__th--fixed-last{border-right:none}}.m-table-thead__th--sortable{cursor:pointer;-webkit-user-select:none;user-select:none}.m-table-thead__th--select{width:48px;min-width:48px;max-width:48px;padding:0 1rem;text-align:center}.m-table-thead__th--select input[type=checkbox]{width:1rem;height:1rem;cursor:pointer;accent-color:var(--m-mm);border-radius:3px;display:block;margin:0 auto}.m-table-thead__cell{display:flex;align-items:center;gap:.5rem}.m-table-thead__sort-icon{color:var(--m-mm);opacity:.6;transition:opacity .2s ease}.m-table-thead__th:hover .m-table-thead__sort-icon{opacity:1}.m-table-thead__menu-btn{display:flex;align-items:center;justify-content:center;width:1.5rem;height:1.5rem;margin-left:auto;border:none;background:transparent;cursor:pointer;color:var(--m-text-tertiary);border-radius:6px;opacity:0;transition:all .15ms ease}.m-table-thead__menu-btn:hover{background:var(--m-backdrop-surface);color:var(--m-text)}.m-table-thead__th:hover .m-table-thead__menu-btn{opacity:1}.m-table-body__row{transition:background-color .3s cubic-bezier(.4,0,.2,1);position:relative}.m-table-body__row:hover{background:color-mix(in srgb,var(--m-mm) 5%,transparent)}.m-table-body__row:hover .m-table-body__cell{background:inherit}.m-table-body__cell{padding:1rem 1.25rem;font-size:.875rem;color:var(--m-text);border-bottom:1px solid var(--m-backdrop-border);white-space:nowrap;vertical-align:middle;background:transparent;transition:background-color .3s ease}.m-table-body__cell[class*=--number],.m-table-body__cell[class*=--currency],.m-table-body__cell[class*=--percent]{font-family:Inter,Roboto Mono,monospace;font-variant-numeric:tabular-nums;letter-spacing:-.01em}@media(min-width:769px){.m-table-body__cell--fixed{position:sticky;background:var(--m-background);z-index:5}}@media(max-width:768px){.m-table-body__cell--fixed{position:static;background:transparent;z-index:auto}}.m-table-body__cell--fixed{border-right:none;transition:background-color .3s ease}.m-table-body__row:hover .m-table-body__cell--fixed{background:color-mix(in srgb,var(--m-mm) 5%,var(--m-background));z-index:6}@media(min-width:769px){.m-table-body__cell--fixed-last{border-right:1px solid var(--m-backdrop-border)}}@media(max-width:768px){.m-table-body__cell--fixed-last{border-right:none}}.m-table-body__cell--context-menu{padding-top:.35rem;padding-bottom:.35rem}.m-table-body__cell--select{width:48px;min-width:48px;max-width:48px;padding:0 1rem;text-align:center}.m-table-body__cell--select input[type=checkbox],.m-table-body__cell--select input[type=radio]{width:1rem;height:1rem;cursor:pointer;accent-color:var(--m-mm);display:block;margin:0 auto}.m-table-body__input{border:none;border-bottom:2px solid var(--m-backdrop-border);background:transparent;font-size:.875rem;color:var(--m-text);padding:.25rem;outline:none;width:100%;transition:border-bottom-color .2s ease}.m-table-body__input:focus{border-bottom-color:var(--m-mm)}.m-table-body__action-btn{display:flex;align-items:center;justify-content:center;width:2rem;height:2rem;border:none;background:transparent;cursor:pointer;color:var(--m-text-tertiary);border-radius:8px;transition:all .2s ease}.m-table-body__action-btn:hover{background:var(--m-backdrop-surface);color:var(--m-text)}.m-table-body__empty{text-align:center;padding:4rem;color:var(--m-text-tertiary);font-size:1rem;font-weight:500;letter-spacing:.02em;font-style:italic;opacity:.7}.m-table-body__link{color:var(--m-mm);text-decoration:none;cursor:pointer;font-weight:600;transition:color .2s ease}.m-table-body__link:hover{text-decoration:underline;color:var(--m-mm-lite)}.m-table-body__value{padding:.25rem .5rem;border-radius:6px;font-weight:600;font-variant-numeric:tabular-nums;letter-spacing:-.01em}.m-table-body__value--positive{color:var(--m-success);background:var(--m-backdrop-success)}.m-table-body__value--negative{color:var(--m-error);background:var(--m-backdrop-error)}.m-table-body__dash{color:var(--m-text-tertiary);font-weight:400;font-style:italic;opacity:.8}.m-tree-grid{--m-tree-grid-icon: .75rem}.m-tree-grid .m-table-thead__th,.m-tree-grid .m-table-body__cell{padding:.375rem .5rem}.m-tree-grid .m-table-thead__th{font-size:.6875rem;letter-spacing:.06em;border-bottom-width:1px}.m-tree-grid__tree-cell{display:flex;align-items:center;gap:0;min-width:0}.m-tree-grid__indent{flex:0 0 auto;width:calc(var(--m-tree-grid-depth, 0) * var(--m-tree-grid-indent, var(--m-tree-grid-icon)))}.m-tree-grid__toggle{flex:0 0 auto;width:var(--m-tree-grid-icon);height:var(--m-tree-grid-icon);display:inline-flex;align-items:center;justify-content:center}.m-tree-grid__toggle m-button{--m-button-size: .333rem}.m-tree-grid__toggle-spacer{width:var(--m-tree-grid-icon);height:var(--m-tree-grid-icon);flex:0 0 auto}.m-tree-grid__lead-icon{flex:0 0 auto;display:inline-flex;align-items:center;margin-left:.125rem;opacity:.75}.m-tree-grid__lead-icon m-icon{--m-icon-size: .75rem}.m-tree-grid__label{min-width:0;margin-left:.25rem;overflow:hidden;text-overflow:ellipsis;font-size:.875em;line-height:1.25}.m-tree-grid .m-table-body__row{cursor:pointer}.m-tree-grid .m-table-body__row--selected{background:color-mix(in srgb,var(--m-mm) 12%,transparent)}.m-tree-grid .m-table__toolbar{padding:.5rem;background:var(--m-background)}.m-tree-grid .m-table__search{flex:1 1 auto;width:100%}.m-tree-grid .m-table__search m-input-wrapper,.m-tree-grid .m-table__search .m-input-wrapper{width:100%}.m-tree-grid__match{background:var(--m-highlight);padding:0;color:inherit;border-radius:2px}\n"], dependencies: [{ kind: "component", type: TableHeaderComponent, selector: "m-table-header", inputs: ["visibleColumns", "fixedCount", "fixedOffset", "sortState", "selectable", "allSelected", "someSelected"], outputs: ["sortClick", "selectAll"] }, { kind: "component", type: FreezeComponent, selector: "m-freeze", inputs: ["config"] }, { kind: "component", type: ButtonComponent, selector: "m-button,m-one-button", inputs: ["config", "color", "labelClass", "fullWidth", "nav", "navParams", "href", "disabled", "variant", "name", "baseUrl", "one", "remote", "label", "noTranslate", "params", "noNative", "icon", "isRightIcon", "iconOnly", "stacked", "imgSrc", "nonClickable", "inverted", "isSubmit", "tabindex"], outputs: ["configChange", "clicked"] }, { kind: "component", type: HeaderComponent$1, selector: "m-header", inputs: ["level", "label", "icon", "actionButton", "actionLabel", "noTranslate", "params"], outputs: ["actionClick"] }, { kind: "component", type: IconComponent, selector: "m-icon, m-one-icon", inputs: ["config", "name", "color", "size", "one", "baseUrl", "remote"], outputs: ["configChange"] }, { kind: "component", type: ContextMenuComponent, selector: "m-context-menu, m-one-context-menu", inputs: ["toggle", "remote", "exclude", "visibilityRule", "disableRule", "extraData", "inverted", "options"], outputs: ["toggleChange", "action"] }, { kind: "component", type: WrapperInputComponent, selector: "m-input-wrapper", inputs: ["remote", "value", "readonly", "state", "focused", "form", "options", "dir", "element", "data", "template", "placeholder", "aclResolver", "formValues"], outputs: ["valueChange", "stateChange", "act", "fieldKey", "fieldType"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
31701
|
+
`, isInline: true, styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}.m-table{display:flex;flex-direction:column;border:1px solid var(--m-backdrop-border);border-radius:12px;overflow:clip;background:#ffffffe6;-webkit-backdrop-filter:blur(40px);backdrop-filter:blur(40px);position:relative;transition:background-color .3s ease}.m-table--flat{border:none;box-shadow:none;background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;border-radius:0}.m-table__toolbar{position:sticky;top:0;z-index:2;display:flex;align-items:center;justify-content:space-between;padding:1.5rem var(--m-table-toolbar-padding-x, 1.25rem);border-bottom:1px solid var(--m-backdrop-border);gap:1.5rem;background:color-mix(in srgb,var(--m-background) 45%,transparent)}.m-table--flat .m-table__toolbar{background:transparent;padding-left:0;padding-right:0}.m-table__title{margin:0;font-size:1.25rem;font-weight:800;color:var(--m-text);letter-spacing:-.02em;flex:1}.m-table__search{flex:0 1 auto;display:flex;align-items:center}.m-table__search .m-input-wrapper{width:100%}.m-table__mobile-view{display:flex;flex-direction:column;gap:1rem;padding:1.25rem;flex:1;overflow:auto}.m-table__empty-mobile{padding:3rem 1.5rem;text-align:center;color:var(--m-text-tertiary);font-size:.9375rem;font-weight:500;font-style:italic;opacity:.8;background:color-mix(in srgb,var(--m-background) 20%,transparent);border-radius:12px;border:1px dashed var(--m-backdrop-border)}.m-table__wrapper{overflow:auto;flex:1}.m-table__wrapper::-webkit-scrollbar{width:6px;height:6px}.m-table__wrapper::-webkit-scrollbar-track{background:transparent}.m-table__wrapper::-webkit-scrollbar-thumb{background:var(--m-backdrop-border);border-radius:10px}.m-table__wrapper::-webkit-scrollbar-thumb:hover{background:var(--m-text-tertiary)}.m-table__table{width:100%;min-width:100%;border-collapse:separate;border-spacing:0}mark.m-table__highlight{background:var(--m-highlight);color:#000;border-radius:2px;padding:0 2px;font-weight:700;box-shadow:0 1px 4px #0003}mark.m-table__highlight .m-one-pagination{margin-left:auto;--m-button-size: 2.25rem;--m-pagination-gap: .375rem}.m-table-pagination{display:flex;align-items:center;gap:1.5rem;padding:1.25rem var(--m-table-pagination-padding-x, 1.25rem);border-top:1px solid var(--m-backdrop-border);font-size:.8125rem;flex-wrap:wrap;background:color-mix(in srgb,var(--m-background) 40%,transparent)}.m-table--flat .m-table-pagination{background:transparent;padding-left:0;padding-right:0}.m-table-pagination__size{display:flex;flex-direction:column;align-items:flex-start;gap:.35rem;color:var(--m-text-secondary);font-weight:500}.m-table-pagination__select{border:1px solid var(--m-backdrop-border);border-radius:8px;background:var(--m-backdrop-surface);color:var(--m-text);padding:.375rem .625rem;font-size:.8125rem;font-weight:600;cursor:pointer;transition:all .2s cubic-bezier(.4,0,.2,1);outline:none}.m-table-pagination__select:hover{background:var(--m-backdrop-glass);border-color:var(--m-mm);box-shadow:0 0 0 3px color-mix(in srgb,var(--m-mm) 10%,transparent)}.m-table-pagination__select:focus{border-color:var(--m-mm);box-shadow:0 0 0 3px color-mix(in srgb,var(--m-mm) 20%,transparent)}.m-table-filter{display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding:1rem 1.25rem;background:color-mix(in srgb,var(--m-background-lite) 60%,transparent);border-bottom:1px solid var(--m-backdrop-border);box-shadow:inset 0 2px 4px #00000005;overflow-x:auto;scrollbar-width:none}.m-table-filter::-webkit-scrollbar{display:none}.m-table--flat .m-table-filter{background:transparent;padding-left:0;padding-right:0;border-bottom:none}.m-table-filter__item{display:flex;align-items:center;gap:10px;padding:.4375rem 1rem;border-radius:12px;background:var(--m-background);border:1px solid var(--m-backdrop-border);color:var(--m-text-secondary);cursor:pointer;transition:all .2s cubic-bezier(.4,0,.2,1);white-space:nowrap;-webkit-user-select:none;user-select:none;outline:none;font-weight:500}.m-table-filter__item:hover{border-color:var(--m-mm);color:var(--m-mm);background:var(--m-background);transform:translateY(-1px);box-shadow:0 4px 12px #0000000d}.m-table-filter__item--active{background:var(--m-mm);border-color:var(--m-mm);color:var(--m-inverse-text);font-weight:600;box-shadow:0 8px 16px color-mix(in srgb,var(--m-mm) 25%,transparent)}.m-table-filter__item--active:hover{background:var(--m-mm);border-color:var(--m-mm);color:var(--m-inverse-text);transform:translateY(-1px)}.m-table-filter__item--active .m-table-filter__badge{background:#fff3;color:var(--m-inverse-text);border-color:#ffffff1a}.m-table-filter__item--primary{background:var(--m-mm);border-color:var(--m-mm);color:var(--m-inverse-text);font-weight:600;box-shadow:0 8px 16px color-mix(in srgb,var(--m-mm) 25%,transparent)}.m-table-filter__item--primary:hover{background:var(--m-mm);border-color:var(--m-mm);color:var(--m-inverse-text);transform:translateY(-1px);box-shadow:0 10px 20px color-mix(in srgb,var(--m-mm) 30%,transparent)}.m-table-filter__item--primary .m-table-filter__badge{background:#fff3;color:var(--m-inverse-text);border-color:#ffffff1a}.m-table-filter__item--danger{border-color:var(--m-error);color:var(--m-error)}.m-table-filter__item--danger:hover{border-color:var(--m-error);color:var(--m-error);background:var(--m-backdrop-error);transform:translateY(-1px);box-shadow:0 4px 12px color-mix(in srgb,var(--m-error) 12%,transparent)}.m-table-filter__item--danger .m-table-filter__badge{background:var(--m-backdrop-error);color:var(--m-error);border-color:color-mix(in srgb,var(--m-error) 20%,transparent)}.m-table-filter__label{font-size:.8125rem;font-weight:600;letter-spacing:.01em}.m-table-filter__badge{display:inline-flex;align-items:center;justify-content:center;min-width:1.25rem;height:1.25rem;padding:0 .375rem;border-radius:100px;background:var(--m-backdrop-surface);color:var(--m-text-secondary);font-size:.6875rem;font-weight:700;border:1px solid var(--m-backdrop-border);transition:all .2s ease}.m-table-thead__th{position:sticky;top:0;z-index:10;background:var(--m-table-thead-background, color-mix(in srgb, var(--m-background) 95%, transparent));-webkit-backdrop-filter:var(--m-table-thead-backdrop-filter, blur(28px));backdrop-filter:var(--m-table-thead-backdrop-filter, blur(28px));padding:1.25rem;text-align:left;font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--m-text-tertiary);border-bottom:2px solid var(--m-backdrop-border);white-space:nowrap;transition:all .2s ease}.m-table-thead__th:hover{color:var(--m-text);background:var(--m-table-thead-background, var(--m-background))}@media(min-width:769px){.m-table-thead__th--fixed{z-index:20;background:var(--m-table-thead-background, var(--m-background))}}@media(max-width:768px){.m-table-thead__th--fixed{position:static;z-index:auto}}.m-table-thead__th--fixed{border-right:none}@media(min-width:769px){.m-table-thead__th--fixed-last{border-right:1px solid var(--m-backdrop-border)}}@media(max-width:768px){.m-table-thead__th--fixed-last{border-right:none}}.m-table-thead__th--sortable{cursor:pointer;-webkit-user-select:none;user-select:none}.m-table-thead__th--select{width:48px;min-width:48px;max-width:48px;padding:0 1rem;text-align:center}.m-table-thead__th--select input[type=checkbox]{width:1rem;height:1rem;cursor:pointer;accent-color:var(--m-mm);border-radius:3px;display:block;margin:0 auto}.m-table-thead__cell{display:flex;align-items:center;gap:.5rem}.m-table-thead__sort-icon{color:var(--m-mm);opacity:.6;transition:opacity .2s ease}.m-table-thead__th:hover .m-table-thead__sort-icon{opacity:1}.m-table-thead__menu-btn{display:flex;align-items:center;justify-content:center;width:1.5rem;height:1.5rem;margin-left:auto;border:none;background:transparent;cursor:pointer;color:var(--m-text-tertiary);border-radius:6px;opacity:0;transition:all .15ms ease}.m-table-thead__menu-btn:hover{background:var(--m-backdrop-surface);color:var(--m-text)}.m-table-thead__th:hover .m-table-thead__menu-btn{opacity:1}.m-table-body__row{transition:background-color .3s cubic-bezier(.4,0,.2,1);position:relative}.m-table-body__row:hover{background:color-mix(in srgb,var(--m-mm) 5%,transparent)}.m-table-body__row:hover .m-table-body__cell{background:inherit}.m-table-body__cell{padding:1rem 1.25rem;font-size:.875rem;color:var(--m-text);border-bottom:1px solid var(--m-backdrop-border);white-space:nowrap;vertical-align:middle;background:transparent;transition:background-color .3s ease}.m-table-body__cell[class*=--number],.m-table-body__cell[class*=--currency],.m-table-body__cell[class*=--percent]{font-family:Inter,Roboto Mono,monospace;font-variant-numeric:tabular-nums;letter-spacing:-.01em}@media(min-width:769px){.m-table-body__cell--fixed{position:sticky;background:var(--m-background);z-index:5}}@media(max-width:768px){.m-table-body__cell--fixed{position:static;background:transparent;z-index:auto}}.m-table-body__cell--fixed{border-right:none;transition:background-color .3s ease}.m-table-body__row:hover .m-table-body__cell--fixed{background:color-mix(in srgb,var(--m-mm) 5%,var(--m-background));z-index:6}@media(min-width:769px){.m-table-body__cell--fixed-last{border-right:1px solid var(--m-backdrop-border)}}@media(max-width:768px){.m-table-body__cell--fixed-last{border-right:none}}.m-table-body__cell--context-menu{padding-top:.35rem;padding-bottom:.35rem}.m-table-body__cell--select{width:48px;min-width:48px;max-width:48px;padding:0 1rem;text-align:center}.m-table-body__cell--select input[type=checkbox],.m-table-body__cell--select input[type=radio]{width:1rem;height:1rem;cursor:pointer;accent-color:var(--m-mm);display:block;margin:0 auto}.m-table-body__input{border:none;border-bottom:2px solid var(--m-backdrop-border);background:transparent;font-size:.875rem;color:var(--m-text);padding:.25rem;outline:none;width:100%;transition:border-bottom-color .2s ease}.m-table-body__input:focus{border-bottom-color:var(--m-mm)}.m-table-body__action-btn{display:flex;align-items:center;justify-content:center;width:2rem;height:2rem;border:none;background:transparent;cursor:pointer;color:var(--m-text-tertiary);border-radius:8px;transition:all .2s ease}.m-table-body__action-btn:hover{background:var(--m-backdrop-surface);color:var(--m-text)}.m-table-body__empty{text-align:center;padding:4rem;color:var(--m-text-tertiary);font-size:1rem;font-weight:500;letter-spacing:.02em;font-style:italic;opacity:.7}.m-table-body__link{color:var(--m-mm);text-decoration:none;cursor:pointer;font-weight:600;transition:color .2s ease}.m-table-body__link:hover{text-decoration:underline;color:var(--m-mm-lite)}.m-table-body__value{padding:.25rem .5rem;border-radius:6px;font-weight:600;font-variant-numeric:tabular-nums;letter-spacing:-.01em}.m-table-body__value--positive{color:var(--m-success);background:var(--m-backdrop-success)}.m-table-body__value--negative{color:var(--m-error);background:var(--m-backdrop-error)}.m-table-body__dash{color:var(--m-text-tertiary);font-weight:400;font-style:italic;opacity:.8}.m-tree-grid{--m-tree-grid-icon: .75rem}.m-tree-grid .m-table-thead__th,.m-tree-grid .m-table-body__cell{padding:.375rem .5rem}.m-tree-grid{--m-table-thead-background: transparent;--m-table-thead-backdrop-filter: none}.m-tree-grid .m-table-thead__th{font-size:.6875rem;letter-spacing:.06em;border-bottom-width:1px}.m-tree-grid__tree-cell{display:flex;align-items:center;gap:0;min-width:0}.m-tree-grid__indent{flex:0 0 auto;width:calc(var(--m-tree-grid-depth, 0) * var(--m-tree-grid-indent, var(--m-tree-grid-icon)))}.m-tree-grid__toggle{flex:0 0 auto;width:var(--m-tree-grid-icon);height:var(--m-tree-grid-icon);display:inline-flex;align-items:center;justify-content:center}.m-tree-grid__toggle m-button{--m-button-size: .333rem}.m-tree-grid__toggle-spacer{width:var(--m-tree-grid-icon);height:var(--m-tree-grid-icon);flex:0 0 auto}.m-tree-grid__lead-icon{flex:0 0 auto;display:inline-flex;align-items:center;margin-left:.125rem;opacity:.75}.m-tree-grid__lead-icon m-icon{--m-icon-size: .75rem}.m-tree-grid__label{min-width:0;margin-left:.25rem;overflow:hidden;text-overflow:ellipsis;font-size:.875em;line-height:1.25}.m-tree-grid .m-table-body__row{cursor:pointer}.m-tree-grid .m-table-body__row--selected{background:color-mix(in srgb,var(--m-mm) 12%,transparent)}.m-tree-grid .m-table__toolbar{padding:.5rem;background:transparent}.m-tree-grid .m-table__search{flex:1 1 auto;width:100%}.m-tree-grid .m-table__search m-input-wrapper,.m-tree-grid .m-table__search .m-input-wrapper{width:100%}.m-tree-grid__match{background:var(--m-highlight);padding:0;color:inherit;border-radius:2px}\n"], dependencies: [{ kind: "component", type: TableHeaderComponent, selector: "m-table-header", inputs: ["visibleColumns", "fixedCount", "fixedOffset", "sortState", "selectable", "allSelected", "someSelected"], outputs: ["sortClick", "selectAll"] }, { kind: "component", type: FreezeComponent, selector: "m-freeze", inputs: ["config"] }, { kind: "component", type: ButtonComponent, selector: "m-button,m-one-button", inputs: ["config", "color", "labelClass", "fullWidth", "nav", "navParams", "href", "disabled", "variant", "name", "baseUrl", "one", "remote", "label", "noTranslate", "params", "noNative", "icon", "isRightIcon", "iconOnly", "stacked", "imgSrc", "nonClickable", "inverted", "isSubmit", "tabindex"], outputs: ["configChange", "clicked"] }, { kind: "component", type: HeaderComponent$1, selector: "m-header", inputs: ["level", "label", "icon", "actionButton", "actionLabel", "noTranslate", "params"], outputs: ["actionClick"] }, { kind: "component", type: IconComponent, selector: "m-icon, m-one-icon", inputs: ["config", "name", "color", "size", "one", "baseUrl", "remote"], outputs: ["configChange"] }, { kind: "component", type: ContextMenuComponent, selector: "m-context-menu, m-one-context-menu", inputs: ["toggle", "remote", "exclude", "visibilityRule", "disableRule", "extraData", "inverted", "options"], outputs: ["toggleChange", "action"] }, { kind: "component", type: WrapperInputComponent, selector: "m-input-wrapper", inputs: ["remote", "value", "readonly", "state", "focused", "form", "options", "dir", "element", "data", "template", "placeholder", "aclResolver", "formValues"], outputs: ["valueChange", "stateChange", "act", "fieldKey", "fieldType"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
31278
31702
|
}
|
|
31279
31703
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: TreeGridComponent, decorators: [{
|
|
31280
31704
|
type: Component,
|
|
@@ -31555,7 +31979,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
|
|
|
31555
31979
|
</table>
|
|
31556
31980
|
</div>
|
|
31557
31981
|
</div>
|
|
31558
|
-
`, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}.m-table{display:flex;flex-direction:column;border:1px solid var(--m-backdrop-border);border-radius:12px;overflow:clip;background:#ffffffe6;-webkit-backdrop-filter:blur(40px);backdrop-filter:blur(40px);position:relative;transition:background-color .3s ease}.m-table--flat{border:none;box-shadow:none;background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;border-radius:0}.m-table__toolbar{position:sticky;top:0;z-index:2;display:flex;align-items:center;justify-content:space-between;padding:1.5rem var(--m-table-toolbar-padding-x, 1.25rem);border-bottom:1px solid var(--m-backdrop-border);gap:1.5rem;background:color-mix(in srgb,var(--m-background) 45%,transparent)}.m-table--flat .m-table__toolbar{background:transparent;padding-left:0;padding-right:0}.m-table__title{margin:0;font-size:1.25rem;font-weight:800;color:var(--m-text);letter-spacing:-.02em;flex:1}.m-table__search{flex:0 1 auto;display:flex;align-items:center}.m-table__search .m-input-wrapper{width:100%}.m-table__mobile-view{display:flex;flex-direction:column;gap:1rem;padding:1.25rem;flex:1;overflow:auto}.m-table__empty-mobile{padding:3rem 1.5rem;text-align:center;color:var(--m-text-tertiary);font-size:.9375rem;font-weight:500;font-style:italic;opacity:.8;background:color-mix(in srgb,var(--m-background) 20%,transparent);border-radius:12px;border:1px dashed var(--m-backdrop-border)}.m-table__wrapper{overflow:auto;flex:1}.m-table__wrapper::-webkit-scrollbar{width:6px;height:6px}.m-table__wrapper::-webkit-scrollbar-track{background:transparent}.m-table__wrapper::-webkit-scrollbar-thumb{background:var(--m-backdrop-border);border-radius:10px}.m-table__wrapper::-webkit-scrollbar-thumb:hover{background:var(--m-text-tertiary)}.m-table__table{width:100%;min-width:100%;border-collapse:separate;border-spacing:0}mark.m-table__highlight{background:var(--m-highlight);color:#000;border-radius:2px;padding:0 2px;font-weight:700;box-shadow:0 1px 4px #0003}mark.m-table__highlight .m-one-pagination{margin-left:auto;--m-button-size: 2.25rem;--m-pagination-gap: .375rem}.m-table-pagination{display:flex;align-items:center;gap:1.5rem;padding:1.25rem var(--m-table-pagination-padding-x, 1.25rem);border-top:1px solid var(--m-backdrop-border);font-size:.8125rem;flex-wrap:wrap;background:color-mix(in srgb,var(--m-background) 40%,transparent)}.m-table--flat .m-table-pagination{background:transparent;padding-left:0;padding-right:0}.m-table-pagination__size{display:flex;flex-direction:column;align-items:flex-start;gap:.35rem;color:var(--m-text-secondary);font-weight:500}.m-table-pagination__select{border:1px solid var(--m-backdrop-border);border-radius:8px;background:var(--m-backdrop-surface);color:var(--m-text);padding:.375rem .625rem;font-size:.8125rem;font-weight:600;cursor:pointer;transition:all .2s cubic-bezier(.4,0,.2,1);outline:none}.m-table-pagination__select:hover{background:var(--m-backdrop-glass);border-color:var(--m-mm);box-shadow:0 0 0 3px color-mix(in srgb,var(--m-mm) 10%,transparent)}.m-table-pagination__select:focus{border-color:var(--m-mm);box-shadow:0 0 0 3px color-mix(in srgb,var(--m-mm) 20%,transparent)}.m-table-filter{display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding:1rem 1.25rem;background:color-mix(in srgb,var(--m-background-lite) 60%,transparent);border-bottom:1px solid var(--m-backdrop-border);box-shadow:inset 0 2px 4px #00000005;overflow-x:auto;scrollbar-width:none}.m-table-filter::-webkit-scrollbar{display:none}.m-table--flat .m-table-filter{background:transparent;padding-left:0;padding-right:0;border-bottom:none}.m-table-filter__item{display:flex;align-items:center;gap:10px;padding:.4375rem 1rem;border-radius:12px;background:var(--m-background);border:1px solid var(--m-backdrop-border);color:var(--m-text-secondary);cursor:pointer;transition:all .2s cubic-bezier(.4,0,.2,1);white-space:nowrap;-webkit-user-select:none;user-select:none;outline:none;font-weight:500}.m-table-filter__item:hover{border-color:var(--m-mm);color:var(--m-mm);background:var(--m-background);transform:translateY(-1px);box-shadow:0 4px 12px #0000000d}.m-table-filter__item--active{background:var(--m-mm);border-color:var(--m-mm);color:var(--m-inverse-text);font-weight:600;box-shadow:0 8px 16px color-mix(in srgb,var(--m-mm) 25%,transparent)}.m-table-filter__item--active:hover{background:var(--m-mm);border-color:var(--m-mm);color:var(--m-inverse-text);transform:translateY(-1px)}.m-table-filter__item--active .m-table-filter__badge{background:#fff3;color:var(--m-inverse-text);border-color:#ffffff1a}.m-table-filter__item--primary{background:var(--m-mm);border-color:var(--m-mm);color:var(--m-inverse-text);font-weight:600;box-shadow:0 8px 16px color-mix(in srgb,var(--m-mm) 25%,transparent)}.m-table-filter__item--primary:hover{background:var(--m-mm);border-color:var(--m-mm);color:var(--m-inverse-text);transform:translateY(-1px);box-shadow:0 10px 20px color-mix(in srgb,var(--m-mm) 30%,transparent)}.m-table-filter__item--primary .m-table-filter__badge{background:#fff3;color:var(--m-inverse-text);border-color:#ffffff1a}.m-table-filter__item--danger{border-color:var(--m-error);color:var(--m-error)}.m-table-filter__item--danger:hover{border-color:var(--m-error);color:var(--m-error);background:var(--m-backdrop-error);transform:translateY(-1px);box-shadow:0 4px 12px color-mix(in srgb,var(--m-error) 12%,transparent)}.m-table-filter__item--danger .m-table-filter__badge{background:var(--m-backdrop-error);color:var(--m-error);border-color:color-mix(in srgb,var(--m-error) 20%,transparent)}.m-table-filter__label{font-size:.8125rem;font-weight:600;letter-spacing:.01em}.m-table-filter__badge{display:inline-flex;align-items:center;justify-content:center;min-width:1.25rem;height:1.25rem;padding:0 .375rem;border-radius:100px;background:var(--m-backdrop-surface);color:var(--m-text-secondary);font-size:.6875rem;font-weight:700;border:1px solid var(--m-backdrop-border);transition:all .2s ease}.m-table-thead__th{position:sticky;top:0;z-index:10;background:color-mix(in srgb,var(--m-background) 95%,transparent);-webkit-backdrop-filter:blur(28px);backdrop-filter:blur(28px);padding:1.25rem;text-align:left;font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--m-text-tertiary);border-bottom:2px solid var(--m-backdrop-border);white-space:nowrap;transition:all .2s ease}.m-table-thead__th:hover{color:var(--m-text);background:var(--m-background)}@media(min-width:769px){.m-table-thead__th--fixed{z-index:20;background:var(--m-background)}}@media(max-width:768px){.m-table-thead__th--fixed{position:static;z-index:auto}}.m-table-thead__th--fixed{border-right:none}@media(min-width:769px){.m-table-thead__th--fixed-last{border-right:1px solid var(--m-backdrop-border)}}@media(max-width:768px){.m-table-thead__th--fixed-last{border-right:none}}.m-table-thead__th--sortable{cursor:pointer;-webkit-user-select:none;user-select:none}.m-table-thead__th--select{width:48px;min-width:48px;max-width:48px;padding:0 1rem;text-align:center}.m-table-thead__th--select input[type=checkbox]{width:1rem;height:1rem;cursor:pointer;accent-color:var(--m-mm);border-radius:3px;display:block;margin:0 auto}.m-table-thead__cell{display:flex;align-items:center;gap:.5rem}.m-table-thead__sort-icon{color:var(--m-mm);opacity:.6;transition:opacity .2s ease}.m-table-thead__th:hover .m-table-thead__sort-icon{opacity:1}.m-table-thead__menu-btn{display:flex;align-items:center;justify-content:center;width:1.5rem;height:1.5rem;margin-left:auto;border:none;background:transparent;cursor:pointer;color:var(--m-text-tertiary);border-radius:6px;opacity:0;transition:all .15ms ease}.m-table-thead__menu-btn:hover{background:var(--m-backdrop-surface);color:var(--m-text)}.m-table-thead__th:hover .m-table-thead__menu-btn{opacity:1}.m-table-body__row{transition:background-color .3s cubic-bezier(.4,0,.2,1);position:relative}.m-table-body__row:hover{background:color-mix(in srgb,var(--m-mm) 5%,transparent)}.m-table-body__row:hover .m-table-body__cell{background:inherit}.m-table-body__cell{padding:1rem 1.25rem;font-size:.875rem;color:var(--m-text);border-bottom:1px solid var(--m-backdrop-border);white-space:nowrap;vertical-align:middle;background:transparent;transition:background-color .3s ease}.m-table-body__cell[class*=--number],.m-table-body__cell[class*=--currency],.m-table-body__cell[class*=--percent]{font-family:Inter,Roboto Mono,monospace;font-variant-numeric:tabular-nums;letter-spacing:-.01em}@media(min-width:769px){.m-table-body__cell--fixed{position:sticky;background:var(--m-background);z-index:5}}@media(max-width:768px){.m-table-body__cell--fixed{position:static;background:transparent;z-index:auto}}.m-table-body__cell--fixed{border-right:none;transition:background-color .3s ease}.m-table-body__row:hover .m-table-body__cell--fixed{background:color-mix(in srgb,var(--m-mm) 5%,var(--m-background));z-index:6}@media(min-width:769px){.m-table-body__cell--fixed-last{border-right:1px solid var(--m-backdrop-border)}}@media(max-width:768px){.m-table-body__cell--fixed-last{border-right:none}}.m-table-body__cell--context-menu{padding-top:.35rem;padding-bottom:.35rem}.m-table-body__cell--select{width:48px;min-width:48px;max-width:48px;padding:0 1rem;text-align:center}.m-table-body__cell--select input[type=checkbox],.m-table-body__cell--select input[type=radio]{width:1rem;height:1rem;cursor:pointer;accent-color:var(--m-mm);display:block;margin:0 auto}.m-table-body__input{border:none;border-bottom:2px solid var(--m-backdrop-border);background:transparent;font-size:.875rem;color:var(--m-text);padding:.25rem;outline:none;width:100%;transition:border-bottom-color .2s ease}.m-table-body__input:focus{border-bottom-color:var(--m-mm)}.m-table-body__action-btn{display:flex;align-items:center;justify-content:center;width:2rem;height:2rem;border:none;background:transparent;cursor:pointer;color:var(--m-text-tertiary);border-radius:8px;transition:all .2s ease}.m-table-body__action-btn:hover{background:var(--m-backdrop-surface);color:var(--m-text)}.m-table-body__empty{text-align:center;padding:4rem;color:var(--m-text-tertiary);font-size:1rem;font-weight:500;letter-spacing:.02em;font-style:italic;opacity:.7}.m-table-body__link{color:var(--m-mm);text-decoration:none;cursor:pointer;font-weight:600;transition:color .2s ease}.m-table-body__link:hover{text-decoration:underline;color:var(--m-mm-lite)}.m-table-body__value{padding:.25rem .5rem;border-radius:6px;font-weight:600;font-variant-numeric:tabular-nums;letter-spacing:-.01em}.m-table-body__value--positive{color:var(--m-success);background:var(--m-backdrop-success)}.m-table-body__value--negative{color:var(--m-error);background:var(--m-backdrop-error)}.m-table-body__dash{color:var(--m-text-tertiary);font-weight:400;font-style:italic;opacity:.8}.m-tree-grid{--m-tree-grid-icon: .75rem}.m-tree-grid .m-table-thead__th,.m-tree-grid .m-table-body__cell{padding:.375rem .5rem}.m-tree-grid .m-table-thead__th{font-size:.6875rem;letter-spacing:.06em;border-bottom-width:1px}.m-tree-grid__tree-cell{display:flex;align-items:center;gap:0;min-width:0}.m-tree-grid__indent{flex:0 0 auto;width:calc(var(--m-tree-grid-depth, 0) * var(--m-tree-grid-indent, var(--m-tree-grid-icon)))}.m-tree-grid__toggle{flex:0 0 auto;width:var(--m-tree-grid-icon);height:var(--m-tree-grid-icon);display:inline-flex;align-items:center;justify-content:center}.m-tree-grid__toggle m-button{--m-button-size: .333rem}.m-tree-grid__toggle-spacer{width:var(--m-tree-grid-icon);height:var(--m-tree-grid-icon);flex:0 0 auto}.m-tree-grid__lead-icon{flex:0 0 auto;display:inline-flex;align-items:center;margin-left:.125rem;opacity:.75}.m-tree-grid__lead-icon m-icon{--m-icon-size: .75rem}.m-tree-grid__label{min-width:0;margin-left:.25rem;overflow:hidden;text-overflow:ellipsis;font-size:.875em;line-height:1.25}.m-tree-grid .m-table-body__row{cursor:pointer}.m-tree-grid .m-table-body__row--selected{background:color-mix(in srgb,var(--m-mm) 12%,transparent)}.m-tree-grid .m-table__toolbar{padding:.5rem;background:var(--m-background)}.m-tree-grid .m-table__search{flex:1 1 auto;width:100%}.m-tree-grid .m-table__search m-input-wrapper,.m-tree-grid .m-table__search .m-input-wrapper{width:100%}.m-tree-grid__match{background:var(--m-highlight);padding:0;color:inherit;border-radius:2px}\n"] }]
|
|
31982
|
+
`, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}.m-table{display:flex;flex-direction:column;border:1px solid var(--m-backdrop-border);border-radius:12px;overflow:clip;background:#ffffffe6;-webkit-backdrop-filter:blur(40px);backdrop-filter:blur(40px);position:relative;transition:background-color .3s ease}.m-table--flat{border:none;box-shadow:none;background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;border-radius:0}.m-table__toolbar{position:sticky;top:0;z-index:2;display:flex;align-items:center;justify-content:space-between;padding:1.5rem var(--m-table-toolbar-padding-x, 1.25rem);border-bottom:1px solid var(--m-backdrop-border);gap:1.5rem;background:color-mix(in srgb,var(--m-background) 45%,transparent)}.m-table--flat .m-table__toolbar{background:transparent;padding-left:0;padding-right:0}.m-table__title{margin:0;font-size:1.25rem;font-weight:800;color:var(--m-text);letter-spacing:-.02em;flex:1}.m-table__search{flex:0 1 auto;display:flex;align-items:center}.m-table__search .m-input-wrapper{width:100%}.m-table__mobile-view{display:flex;flex-direction:column;gap:1rem;padding:1.25rem;flex:1;overflow:auto}.m-table__empty-mobile{padding:3rem 1.5rem;text-align:center;color:var(--m-text-tertiary);font-size:.9375rem;font-weight:500;font-style:italic;opacity:.8;background:color-mix(in srgb,var(--m-background) 20%,transparent);border-radius:12px;border:1px dashed var(--m-backdrop-border)}.m-table__wrapper{overflow:auto;flex:1}.m-table__wrapper::-webkit-scrollbar{width:6px;height:6px}.m-table__wrapper::-webkit-scrollbar-track{background:transparent}.m-table__wrapper::-webkit-scrollbar-thumb{background:var(--m-backdrop-border);border-radius:10px}.m-table__wrapper::-webkit-scrollbar-thumb:hover{background:var(--m-text-tertiary)}.m-table__table{width:100%;min-width:100%;border-collapse:separate;border-spacing:0}mark.m-table__highlight{background:var(--m-highlight);color:#000;border-radius:2px;padding:0 2px;font-weight:700;box-shadow:0 1px 4px #0003}mark.m-table__highlight .m-one-pagination{margin-left:auto;--m-button-size: 2.25rem;--m-pagination-gap: .375rem}.m-table-pagination{display:flex;align-items:center;gap:1.5rem;padding:1.25rem var(--m-table-pagination-padding-x, 1.25rem);border-top:1px solid var(--m-backdrop-border);font-size:.8125rem;flex-wrap:wrap;background:color-mix(in srgb,var(--m-background) 40%,transparent)}.m-table--flat .m-table-pagination{background:transparent;padding-left:0;padding-right:0}.m-table-pagination__size{display:flex;flex-direction:column;align-items:flex-start;gap:.35rem;color:var(--m-text-secondary);font-weight:500}.m-table-pagination__select{border:1px solid var(--m-backdrop-border);border-radius:8px;background:var(--m-backdrop-surface);color:var(--m-text);padding:.375rem .625rem;font-size:.8125rem;font-weight:600;cursor:pointer;transition:all .2s cubic-bezier(.4,0,.2,1);outline:none}.m-table-pagination__select:hover{background:var(--m-backdrop-glass);border-color:var(--m-mm);box-shadow:0 0 0 3px color-mix(in srgb,var(--m-mm) 10%,transparent)}.m-table-pagination__select:focus{border-color:var(--m-mm);box-shadow:0 0 0 3px color-mix(in srgb,var(--m-mm) 20%,transparent)}.m-table-filter{display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding:1rem 1.25rem;background:color-mix(in srgb,var(--m-background-lite) 60%,transparent);border-bottom:1px solid var(--m-backdrop-border);box-shadow:inset 0 2px 4px #00000005;overflow-x:auto;scrollbar-width:none}.m-table-filter::-webkit-scrollbar{display:none}.m-table--flat .m-table-filter{background:transparent;padding-left:0;padding-right:0;border-bottom:none}.m-table-filter__item{display:flex;align-items:center;gap:10px;padding:.4375rem 1rem;border-radius:12px;background:var(--m-background);border:1px solid var(--m-backdrop-border);color:var(--m-text-secondary);cursor:pointer;transition:all .2s cubic-bezier(.4,0,.2,1);white-space:nowrap;-webkit-user-select:none;user-select:none;outline:none;font-weight:500}.m-table-filter__item:hover{border-color:var(--m-mm);color:var(--m-mm);background:var(--m-background);transform:translateY(-1px);box-shadow:0 4px 12px #0000000d}.m-table-filter__item--active{background:var(--m-mm);border-color:var(--m-mm);color:var(--m-inverse-text);font-weight:600;box-shadow:0 8px 16px color-mix(in srgb,var(--m-mm) 25%,transparent)}.m-table-filter__item--active:hover{background:var(--m-mm);border-color:var(--m-mm);color:var(--m-inverse-text);transform:translateY(-1px)}.m-table-filter__item--active .m-table-filter__badge{background:#fff3;color:var(--m-inverse-text);border-color:#ffffff1a}.m-table-filter__item--primary{background:var(--m-mm);border-color:var(--m-mm);color:var(--m-inverse-text);font-weight:600;box-shadow:0 8px 16px color-mix(in srgb,var(--m-mm) 25%,transparent)}.m-table-filter__item--primary:hover{background:var(--m-mm);border-color:var(--m-mm);color:var(--m-inverse-text);transform:translateY(-1px);box-shadow:0 10px 20px color-mix(in srgb,var(--m-mm) 30%,transparent)}.m-table-filter__item--primary .m-table-filter__badge{background:#fff3;color:var(--m-inverse-text);border-color:#ffffff1a}.m-table-filter__item--danger{border-color:var(--m-error);color:var(--m-error)}.m-table-filter__item--danger:hover{border-color:var(--m-error);color:var(--m-error);background:var(--m-backdrop-error);transform:translateY(-1px);box-shadow:0 4px 12px color-mix(in srgb,var(--m-error) 12%,transparent)}.m-table-filter__item--danger .m-table-filter__badge{background:var(--m-backdrop-error);color:var(--m-error);border-color:color-mix(in srgb,var(--m-error) 20%,transparent)}.m-table-filter__label{font-size:.8125rem;font-weight:600;letter-spacing:.01em}.m-table-filter__badge{display:inline-flex;align-items:center;justify-content:center;min-width:1.25rem;height:1.25rem;padding:0 .375rem;border-radius:100px;background:var(--m-backdrop-surface);color:var(--m-text-secondary);font-size:.6875rem;font-weight:700;border:1px solid var(--m-backdrop-border);transition:all .2s ease}.m-table-thead__th{position:sticky;top:0;z-index:10;background:var(--m-table-thead-background, color-mix(in srgb, var(--m-background) 95%, transparent));-webkit-backdrop-filter:var(--m-table-thead-backdrop-filter, blur(28px));backdrop-filter:var(--m-table-thead-backdrop-filter, blur(28px));padding:1.25rem;text-align:left;font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--m-text-tertiary);border-bottom:2px solid var(--m-backdrop-border);white-space:nowrap;transition:all .2s ease}.m-table-thead__th:hover{color:var(--m-text);background:var(--m-table-thead-background, var(--m-background))}@media(min-width:769px){.m-table-thead__th--fixed{z-index:20;background:var(--m-table-thead-background, var(--m-background))}}@media(max-width:768px){.m-table-thead__th--fixed{position:static;z-index:auto}}.m-table-thead__th--fixed{border-right:none}@media(min-width:769px){.m-table-thead__th--fixed-last{border-right:1px solid var(--m-backdrop-border)}}@media(max-width:768px){.m-table-thead__th--fixed-last{border-right:none}}.m-table-thead__th--sortable{cursor:pointer;-webkit-user-select:none;user-select:none}.m-table-thead__th--select{width:48px;min-width:48px;max-width:48px;padding:0 1rem;text-align:center}.m-table-thead__th--select input[type=checkbox]{width:1rem;height:1rem;cursor:pointer;accent-color:var(--m-mm);border-radius:3px;display:block;margin:0 auto}.m-table-thead__cell{display:flex;align-items:center;gap:.5rem}.m-table-thead__sort-icon{color:var(--m-mm);opacity:.6;transition:opacity .2s ease}.m-table-thead__th:hover .m-table-thead__sort-icon{opacity:1}.m-table-thead__menu-btn{display:flex;align-items:center;justify-content:center;width:1.5rem;height:1.5rem;margin-left:auto;border:none;background:transparent;cursor:pointer;color:var(--m-text-tertiary);border-radius:6px;opacity:0;transition:all .15ms ease}.m-table-thead__menu-btn:hover{background:var(--m-backdrop-surface);color:var(--m-text)}.m-table-thead__th:hover .m-table-thead__menu-btn{opacity:1}.m-table-body__row{transition:background-color .3s cubic-bezier(.4,0,.2,1);position:relative}.m-table-body__row:hover{background:color-mix(in srgb,var(--m-mm) 5%,transparent)}.m-table-body__row:hover .m-table-body__cell{background:inherit}.m-table-body__cell{padding:1rem 1.25rem;font-size:.875rem;color:var(--m-text);border-bottom:1px solid var(--m-backdrop-border);white-space:nowrap;vertical-align:middle;background:transparent;transition:background-color .3s ease}.m-table-body__cell[class*=--number],.m-table-body__cell[class*=--currency],.m-table-body__cell[class*=--percent]{font-family:Inter,Roboto Mono,monospace;font-variant-numeric:tabular-nums;letter-spacing:-.01em}@media(min-width:769px){.m-table-body__cell--fixed{position:sticky;background:var(--m-background);z-index:5}}@media(max-width:768px){.m-table-body__cell--fixed{position:static;background:transparent;z-index:auto}}.m-table-body__cell--fixed{border-right:none;transition:background-color .3s ease}.m-table-body__row:hover .m-table-body__cell--fixed{background:color-mix(in srgb,var(--m-mm) 5%,var(--m-background));z-index:6}@media(min-width:769px){.m-table-body__cell--fixed-last{border-right:1px solid var(--m-backdrop-border)}}@media(max-width:768px){.m-table-body__cell--fixed-last{border-right:none}}.m-table-body__cell--context-menu{padding-top:.35rem;padding-bottom:.35rem}.m-table-body__cell--select{width:48px;min-width:48px;max-width:48px;padding:0 1rem;text-align:center}.m-table-body__cell--select input[type=checkbox],.m-table-body__cell--select input[type=radio]{width:1rem;height:1rem;cursor:pointer;accent-color:var(--m-mm);display:block;margin:0 auto}.m-table-body__input{border:none;border-bottom:2px solid var(--m-backdrop-border);background:transparent;font-size:.875rem;color:var(--m-text);padding:.25rem;outline:none;width:100%;transition:border-bottom-color .2s ease}.m-table-body__input:focus{border-bottom-color:var(--m-mm)}.m-table-body__action-btn{display:flex;align-items:center;justify-content:center;width:2rem;height:2rem;border:none;background:transparent;cursor:pointer;color:var(--m-text-tertiary);border-radius:8px;transition:all .2s ease}.m-table-body__action-btn:hover{background:var(--m-backdrop-surface);color:var(--m-text)}.m-table-body__empty{text-align:center;padding:4rem;color:var(--m-text-tertiary);font-size:1rem;font-weight:500;letter-spacing:.02em;font-style:italic;opacity:.7}.m-table-body__link{color:var(--m-mm);text-decoration:none;cursor:pointer;font-weight:600;transition:color .2s ease}.m-table-body__link:hover{text-decoration:underline;color:var(--m-mm-lite)}.m-table-body__value{padding:.25rem .5rem;border-radius:6px;font-weight:600;font-variant-numeric:tabular-nums;letter-spacing:-.01em}.m-table-body__value--positive{color:var(--m-success);background:var(--m-backdrop-success)}.m-table-body__value--negative{color:var(--m-error);background:var(--m-backdrop-error)}.m-table-body__dash{color:var(--m-text-tertiary);font-weight:400;font-style:italic;opacity:.8}.m-tree-grid{--m-tree-grid-icon: .75rem}.m-tree-grid .m-table-thead__th,.m-tree-grid .m-table-body__cell{padding:.375rem .5rem}.m-tree-grid{--m-table-thead-background: transparent;--m-table-thead-backdrop-filter: none}.m-tree-grid .m-table-thead__th{font-size:.6875rem;letter-spacing:.06em;border-bottom-width:1px}.m-tree-grid__tree-cell{display:flex;align-items:center;gap:0;min-width:0}.m-tree-grid__indent{flex:0 0 auto;width:calc(var(--m-tree-grid-depth, 0) * var(--m-tree-grid-indent, var(--m-tree-grid-icon)))}.m-tree-grid__toggle{flex:0 0 auto;width:var(--m-tree-grid-icon);height:var(--m-tree-grid-icon);display:inline-flex;align-items:center;justify-content:center}.m-tree-grid__toggle m-button{--m-button-size: .333rem}.m-tree-grid__toggle-spacer{width:var(--m-tree-grid-icon);height:var(--m-tree-grid-icon);flex:0 0 auto}.m-tree-grid__lead-icon{flex:0 0 auto;display:inline-flex;align-items:center;margin-left:.125rem;opacity:.75}.m-tree-grid__lead-icon m-icon{--m-icon-size: .75rem}.m-tree-grid__label{min-width:0;margin-left:.25rem;overflow:hidden;text-overflow:ellipsis;font-size:.875em;line-height:1.25}.m-tree-grid .m-table-body__row{cursor:pointer}.m-tree-grid .m-table-body__row--selected{background:color-mix(in srgb,var(--m-mm) 12%,transparent)}.m-tree-grid .m-table__toolbar{padding:.5rem;background:transparent}.m-tree-grid .m-table__search{flex:1 1 auto;width:100%}.m-tree-grid .m-table__search m-input-wrapper,.m-tree-grid .m-table__search .m-input-wrapper{width:100%}.m-tree-grid__match{background:var(--m-highlight);padding:0;color:inherit;border-radius:2px}\n"] }]
|
|
31559
31983
|
}], propDecorators: { config: [{ type: i0.Input, args: [{ isSignal: true, alias: "config", required: false }] }, { type: i0.Output, args: ["configChange"] }], data: [{ type: i0.Input, args: [{ isSignal: true, alias: "data", required: false }] }, { type: i0.Output, args: ["dataChange"] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], indentRem: [{ type: i0.Input, args: [{ isSignal: true, alias: "indentRem", required: false }] }], keyIndex: [{ type: i0.Input, args: [{ isSignal: true, alias: "keyIndex", required: false }] }], selectedKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectedKey", required: false }] }, { type: i0.Output, args: ["selectedKeyChange"] }], rowToggled: [{ type: i0.Output, args: ["rowToggled"] }], loadChildren: [{ type: i0.Output, args: ["loadChildren"] }], rowSelected: [{ type: i0.Output, args: ["rowSelected"] }], menuAction: [{ type: i0.Output, args: ["menuAction"] }], cellClicked: [{ type: i0.Output, args: ["cellClicked"] }], searchChanged: [{ type: i0.Output, args: ["searchChanged"] }] } });
|
|
31560
31984
|
|
|
31561
31985
|
const CHART_WIDTH = 300;
|
|
@@ -33187,9 +33611,14 @@ function provideModalComponents() {
|
|
|
33187
33611
|
]);
|
|
33188
33612
|
}
|
|
33189
33613
|
|
|
33614
|
+
/** Where the recent queries are held (CONTEXT.md HeldValue). */
|
|
33615
|
+
const RECENT_KEY = 'search.recent';
|
|
33616
|
+
/** Recent queries kept — enough to pick from, not a history. */
|
|
33617
|
+
const RECENT_SEARCH_LIMIT = 8;
|
|
33190
33618
|
const initialState$1 = {
|
|
33191
33619
|
query: '',
|
|
33192
33620
|
sourceResults: {},
|
|
33621
|
+
recent: [],
|
|
33193
33622
|
};
|
|
33194
33623
|
const SearchStore = signalStore({ providedIn: 'root' }, withState(initialState$1), withComputed(({ query, sourceResults }) => ({
|
|
33195
33624
|
groupedResults: computed(() => Object.values(sourceResults()).filter((g) => g.items.length > 0)),
|
|
@@ -33197,11 +33626,30 @@ const SearchStore = signalStore({ providedIn: 'root' }, withState(initialState$1
|
|
|
33197
33626
|
hasQuery: computed(() => query().trim().length > 0),
|
|
33198
33627
|
})), withMethods((store) => {
|
|
33199
33628
|
const searchQuery = inject(SEARCH_QUERY, { optional: true });
|
|
33629
|
+
const storage = inject(StorageService);
|
|
33200
33630
|
return {
|
|
33201
33631
|
updateQuery: (query) => {
|
|
33202
33632
|
patchState(store, { query });
|
|
33203
33633
|
searchQuery?.set(query);
|
|
33204
33634
|
},
|
|
33635
|
+
/**
|
|
33636
|
+
* Keeps the current query as a recent one — called when a User follows
|
|
33637
|
+
* a hit, so only a search that found something is kept, never each
|
|
33638
|
+
* keystroke on the way to it. Moves a repeat to the front.
|
|
33639
|
+
*/
|
|
33640
|
+
rememberQuery: () => {
|
|
33641
|
+
const query = store.query().trim();
|
|
33642
|
+
if (!query)
|
|
33643
|
+
return;
|
|
33644
|
+
const recent = [
|
|
33645
|
+
query,
|
|
33646
|
+
...store
|
|
33647
|
+
.recent()
|
|
33648
|
+
.filter((q) => q.toLowerCase() !== query.toLowerCase()),
|
|
33649
|
+
].slice(0, RECENT_SEARCH_LIMIT);
|
|
33650
|
+
patchState(store, { recent });
|
|
33651
|
+
storage.setHeld(RECENT_KEY, recent);
|
|
33652
|
+
},
|
|
33205
33653
|
clearQuery: () => {
|
|
33206
33654
|
patchState(store, { query: '', sourceResults: {} });
|
|
33207
33655
|
searchQuery?.set('');
|
|
@@ -33227,6 +33675,9 @@ const SearchStore = signalStore({ providedIn: 'root' }, withState(initialState$1
|
|
|
33227
33675
|
const injector = inject(Injector);
|
|
33228
33676
|
return {
|
|
33229
33677
|
onInit() {
|
|
33678
|
+
patchState(store, {
|
|
33679
|
+
recent: injector.get(StorageService).getHeld(RECENT_KEY) ?? [],
|
|
33680
|
+
});
|
|
33230
33681
|
const sq = injector.get(SEARCH_QUERY, null);
|
|
33231
33682
|
if (sq) {
|
|
33232
33683
|
effect(() => {
|
|
@@ -33631,23 +34082,89 @@ const navTailMatcher = (prefix, name) => (segments) => {
|
|
|
33631
34082
|
return { consumed: segments, posParams };
|
|
33632
34083
|
};
|
|
33633
34084
|
|
|
34085
|
+
// What one entry and its chevron take on the line, at the trail's size. An
|
|
34086
|
+
// estimate rather than a measurement: labels are clipped to fit anyway, so the
|
|
34087
|
+
// guess only decides how many ancestors are worth drawing at all.
|
|
34088
|
+
const ENTRY_PX = 96;
|
|
34089
|
+
// Unmeasured (SSR, jsdom) the trail has no width to fold against, so a long
|
|
34090
|
+
// one still folds rather than running off the line.
|
|
34091
|
+
const UNMEASURED_FIT = 4;
|
|
34092
|
+
// The root entry and the one nearest the page are the two worth keeping.
|
|
34093
|
+
const MIN_FIT = 2;
|
|
33634
34094
|
class NavTrailComponent {
|
|
33635
34095
|
config = input.required(...(ngDevMode ? [{ debugName: "config" }] : /* istanbul ignore next */ []));
|
|
33636
34096
|
Size = Size;
|
|
33637
34097
|
themeStore = inject(ThemeStore);
|
|
33638
34098
|
navStore = inject(NavStore);
|
|
34099
|
+
el = inject(ElementRef);
|
|
34100
|
+
destroyRef = inject(DestroyRef);
|
|
34101
|
+
doc = inject(DOCUMENT);
|
|
33639
34102
|
headerColor = computed(() => this.themeStore.color()?.mm ?? '#fff', ...(ngDevMode ? [{ debugName: "headerColor" }] : /* istanbul ignore next */ []));
|
|
33640
34103
|
fromUrl = computed(() => !!this.navStore.id(), ...(ngDevMode ? [{ debugName: "fromUrl" }] : /* istanbul ignore next */ []));
|
|
34104
|
+
// The trail's own width, measured rather than queried: the header is
|
|
34105
|
+
// routinely the width of a docked panel, not the window (ADR 0001).
|
|
34106
|
+
width = signal(undefined, ...(ngDevMode ? [{ debugName: "width" }] : /* istanbul ignore next */ []));
|
|
34107
|
+
fit = computed(() => {
|
|
34108
|
+
const width = this.width();
|
|
34109
|
+
if (width === undefined)
|
|
34110
|
+
return UNMEASURED_FIT;
|
|
34111
|
+
return Math.max(MIN_FIT, Math.floor(width / ENTRY_PX));
|
|
34112
|
+
}, ...(ngDevMode ? [{ debugName: "fit" }] : /* istanbul ignore next */ []));
|
|
34113
|
+
// Folded from the middle: the root anchors where the trail starts and the
|
|
34114
|
+
// nearest ancestors say where the User stands, so it is the ones between
|
|
34115
|
+
// that go behind the overflow.
|
|
34116
|
+
fold = computed(() => {
|
|
34117
|
+
const trail = this.config();
|
|
34118
|
+
const fit = this.fit();
|
|
34119
|
+
if (trail.length <= fit)
|
|
34120
|
+
return { shown: trail, hidden: [] };
|
|
34121
|
+
const tail = Math.max(1, fit - 1);
|
|
34122
|
+
return {
|
|
34123
|
+
shown: [trail[0], ...trail.slice(-tail)],
|
|
34124
|
+
hidden: trail.slice(1, trail.length - tail),
|
|
34125
|
+
};
|
|
34126
|
+
}, ...(ngDevMode ? [{ debugName: "fold" }] : /* istanbul ignore next */ []));
|
|
34127
|
+
shown = computed(() => this.fold().shown, ...(ngDevMode ? [{ debugName: "shown" }] : /* istanbul ignore next */ []));
|
|
34128
|
+
hidden = computed(() => this.fold().hidden, ...(ngDevMode ? [{ debugName: "hidden" }] : /* istanbul ignore next */ []));
|
|
34129
|
+
// No `nav` on the rows: the menu would follow it and move the User, where a
|
|
34130
|
+
// trail entry only Browses. The press comes back through `onOverflow`.
|
|
34131
|
+
overflowMenu = computed(() => ({
|
|
34132
|
+
align: 'left',
|
|
34133
|
+
icon: { name: 'more' },
|
|
34134
|
+
options: [
|
|
34135
|
+
this.hidden().map((entry) => ({
|
|
34136
|
+
id: entry.id,
|
|
34137
|
+
label: entry.label,
|
|
34138
|
+
icon: entry.icon,
|
|
34139
|
+
})),
|
|
34140
|
+
],
|
|
34141
|
+
}), ...(ngDevMode ? [{ debugName: "overflowMenu" }] : /* istanbul ignore next */ []));
|
|
34142
|
+
constructor() {
|
|
34143
|
+
afterNextRender(() => {
|
|
34144
|
+
if (typeof ResizeObserver === 'undefined')
|
|
34145
|
+
return;
|
|
34146
|
+
const observer = new ResizeObserver(([entry]) => this.width.set(entry.contentRect.width));
|
|
34147
|
+
observer.observe(this.el.nativeElement);
|
|
34148
|
+
this.destroyRef.onDestroy(() => observer.disconnect());
|
|
34149
|
+
});
|
|
34150
|
+
}
|
|
33641
34151
|
/**
|
|
33642
34152
|
* Moves the panel onto the entry's Nav and leaves the Address, and the Page
|
|
33643
34153
|
* behind the panel, where they are (CONTEXT.md Browse).
|
|
33644
34154
|
*/
|
|
33645
34155
|
browse = (navId, params) => this.navStore.browse(navId, params);
|
|
34156
|
+
onOverflow(item) {
|
|
34157
|
+
const entry = this.hidden().find((e) => e.id === item.id);
|
|
34158
|
+
if (entry?.nav)
|
|
34159
|
+
this.browse(entry.nav, entry.navParams);
|
|
34160
|
+
else if (entry?.href)
|
|
34161
|
+
this.doc.location.assign(entry.href);
|
|
34162
|
+
}
|
|
33646
34163
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: NavTrailComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
33647
34164
|
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: NavTrailComponent, isStandalone: true, selector: "m-nav-trail", inputs: { config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: true, transformFunction: null } }, host: { classAttribute: "m-nav-trail" }, ngImport: i0, template: `
|
|
33648
34165
|
@if (config(); as trail) {
|
|
33649
34166
|
<nav class="nav-trail">
|
|
33650
|
-
@for (item of
|
|
34167
|
+
@for (item of shown(); track item.id; let i = $index; let last = $last) {
|
|
33651
34168
|
<div class="trail-item" [style.animation-delay.ms]="i * 50">
|
|
33652
34169
|
@if (item.nav; as nav) {
|
|
33653
34170
|
<!-- Browses: the trail moves the panel, never the User. -->
|
|
@@ -33655,13 +34172,14 @@ class NavTrailComponent {
|
|
|
33655
34172
|
class="trail-link"
|
|
33656
34173
|
role="button"
|
|
33657
34174
|
tabindex="0"
|
|
34175
|
+
[attr.title]="item.label | translate"
|
|
33658
34176
|
(click)="browse(nav, item.navParams)"
|
|
33659
34177
|
(keydown.enter)="browse(nav, item.navParams)"
|
|
33660
34178
|
>
|
|
33661
34179
|
{{ item.label | translate }}
|
|
33662
34180
|
</a>
|
|
33663
34181
|
} @else if (item.href; as href) {
|
|
33664
|
-
<a [href]="href" class="trail-link">
|
|
34182
|
+
<a [href]="href" class="trail-link" [attr.title]="item.label | translate">
|
|
33665
34183
|
{{ item.label | translate }}
|
|
33666
34184
|
</a>
|
|
33667
34185
|
}
|
|
@@ -33671,17 +34189,26 @@ class NavTrailComponent {
|
|
|
33671
34189
|
</div>
|
|
33672
34190
|
}
|
|
33673
34191
|
</div>
|
|
34192
|
+
@if (i === 0 && hidden().length) {
|
|
34193
|
+
<!-- The ancestors the line could not fit, one press away. -->
|
|
34194
|
+
<div class="trail-item trail-item--overflow">
|
|
34195
|
+
<m-context-menu [config]="overflowMenu()" (action)="onOverflow($event)" />
|
|
34196
|
+
<div class="trail-separator">
|
|
34197
|
+
<m-icon name="chevron-right" />
|
|
34198
|
+
</div>
|
|
34199
|
+
</div>
|
|
34200
|
+
}
|
|
33674
34201
|
}
|
|
33675
34202
|
</nav>
|
|
33676
34203
|
}
|
|
33677
|
-
`, isInline: true, styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}.m-nav-trail{display:block;flex:1;min-width:0}.nav-trail{display:flex;align-items:center;gap:.
|
|
34204
|
+
`, isInline: true, styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}.m-nav-trail{display:block;flex:1;min-width:0}.nav-trail{display:flex;flex-wrap:nowrap;align-items:center;min-width:0;gap:.125rem;font-size:.725rem;letter-spacing:.04em;color:var(--m-text-tertiary);-webkit-user-select:none;user-select:none;font-weight:600}.trail-item{display:flex;align-items:center;gap:.125rem;min-width:0;flex:0 3 auto;animation:slide-in-trail .5s cubic-bezier(.16,1,.3,1)}.trail-item:last-child{flex-shrink:1}.trail-item:last-child .trail-link{color:var(--m-text-secondary)}.trail-item--overflow{flex-shrink:0;--m-button-size: .7rem}.trail-link{display:block;min-width:2rem;max-width:12rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:inherit;text-decoration:none;padding:.125rem .375rem;border-radius:4px;transition:all .3s cubic-bezier(.16,1,.3,1);cursor:pointer}.trail-link:hover{color:var(--m-mm);background:color-mix(in srgb,var(--m-mm) 6%,transparent)}.trail-link:active{transform:scale(.96)}.trail-separator{display:flex;flex-shrink:0;align-items:center;justify-content:center;opacity:.35;color:var(--m-text-tertiary);pointer-events:none;font-size:.625rem}.trail-separator .m-icon{--m-icon-size: .625rem;display:flex;align-items:center;justify-content:center}@keyframes slide-in-trail{0%{opacity:0;transform:translate(-10px)}to{opacity:1;transform:translate(0)}}\n"], dependencies: [{ kind: "component", type: IconComponent, selector: "m-icon, m-one-icon", inputs: ["config", "name", "color", "size", "one", "baseUrl", "remote"], outputs: ["configChange"] }, { kind: "component", type: ContextMenuComponent, selector: "m-context-menu, m-one-context-menu", inputs: ["toggle", "remote", "exclude", "visibilityRule", "disableRule", "extraData", "inverted", "options"], outputs: ["toggleChange", "action"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
33678
34205
|
}
|
|
33679
34206
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: NavTrailComponent, decorators: [{
|
|
33680
34207
|
type: Component,
|
|
33681
34208
|
args: [{ selector: 'm-nav-trail', template: `
|
|
33682
34209
|
@if (config(); as trail) {
|
|
33683
34210
|
<nav class="nav-trail">
|
|
33684
|
-
@for (item of
|
|
34211
|
+
@for (item of shown(); track item.id; let i = $index; let last = $last) {
|
|
33685
34212
|
<div class="trail-item" [style.animation-delay.ms]="i * 50">
|
|
33686
34213
|
@if (item.nav; as nav) {
|
|
33687
34214
|
<!-- Browses: the trail moves the panel, never the User. -->
|
|
@@ -33689,13 +34216,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
|
|
|
33689
34216
|
class="trail-link"
|
|
33690
34217
|
role="button"
|
|
33691
34218
|
tabindex="0"
|
|
34219
|
+
[attr.title]="item.label | translate"
|
|
33692
34220
|
(click)="browse(nav, item.navParams)"
|
|
33693
34221
|
(keydown.enter)="browse(nav, item.navParams)"
|
|
33694
34222
|
>
|
|
33695
34223
|
{{ item.label | translate }}
|
|
33696
34224
|
</a>
|
|
33697
34225
|
} @else if (item.href; as href) {
|
|
33698
|
-
<a [href]="href" class="trail-link">
|
|
34226
|
+
<a [href]="href" class="trail-link" [attr.title]="item.label | translate">
|
|
33699
34227
|
{{ item.label | translate }}
|
|
33700
34228
|
</a>
|
|
33701
34229
|
}
|
|
@@ -33705,13 +34233,22 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
|
|
|
33705
34233
|
</div>
|
|
33706
34234
|
}
|
|
33707
34235
|
</div>
|
|
34236
|
+
@if (i === 0 && hidden().length) {
|
|
34237
|
+
<!-- The ancestors the line could not fit, one press away. -->
|
|
34238
|
+
<div class="trail-item trail-item--overflow">
|
|
34239
|
+
<m-context-menu [config]="overflowMenu()" (action)="onOverflow($event)" />
|
|
34240
|
+
<div class="trail-separator">
|
|
34241
|
+
<m-icon name="chevron-right" />
|
|
34242
|
+
</div>
|
|
34243
|
+
</div>
|
|
34244
|
+
}
|
|
33708
34245
|
}
|
|
33709
34246
|
</nav>
|
|
33710
34247
|
}
|
|
33711
|
-
`, imports: [TranslatePipe, IconComponent], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
|
|
34248
|
+
`, imports: [TranslatePipe, IconComponent, ContextMenuComponent], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
|
|
33712
34249
|
class: 'm-nav-trail',
|
|
33713
|
-
}, styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}.m-nav-trail{display:block;flex:1;min-width:0}.nav-trail{display:flex;align-items:center;gap:.
|
|
33714
|
-
}], propDecorators: { config: [{ type: i0.Input, args: [{ isSignal: true, alias: "config", required: true }] }] } });
|
|
34250
|
+
}, styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}.m-nav-trail{display:block;flex:1;min-width:0}.nav-trail{display:flex;flex-wrap:nowrap;align-items:center;min-width:0;gap:.125rem;font-size:.725rem;letter-spacing:.04em;color:var(--m-text-tertiary);-webkit-user-select:none;user-select:none;font-weight:600}.trail-item{display:flex;align-items:center;gap:.125rem;min-width:0;flex:0 3 auto;animation:slide-in-trail .5s cubic-bezier(.16,1,.3,1)}.trail-item:last-child{flex-shrink:1}.trail-item:last-child .trail-link{color:var(--m-text-secondary)}.trail-item--overflow{flex-shrink:0;--m-button-size: .7rem}.trail-link{display:block;min-width:2rem;max-width:12rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:inherit;text-decoration:none;padding:.125rem .375rem;border-radius:4px;transition:all .3s cubic-bezier(.16,1,.3,1);cursor:pointer}.trail-link:hover{color:var(--m-mm);background:color-mix(in srgb,var(--m-mm) 6%,transparent)}.trail-link:active{transform:scale(.96)}.trail-separator{display:flex;flex-shrink:0;align-items:center;justify-content:center;opacity:.35;color:var(--m-text-tertiary);pointer-events:none;font-size:.625rem}.trail-separator .m-icon{--m-icon-size: .625rem;display:flex;align-items:center;justify-content:center}@keyframes slide-in-trail{0%{opacity:0;transform:translate(-10px)}to{opacity:1;transform:translate(0)}}\n"] }]
|
|
34251
|
+
}], ctorParameters: () => [], propDecorators: { config: [{ type: i0.Input, args: [{ isSignal: true, alias: "config", required: true }] }] } });
|
|
33715
34252
|
|
|
33716
34253
|
class SearchPanelComponent {
|
|
33717
34254
|
searchStore = inject(SearchStore);
|
|
@@ -33719,9 +34256,31 @@ class SearchPanelComponent {
|
|
|
33719
34256
|
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: SearchPanelComponent, isStandalone: true, selector: "m-search-panel", ngImport: i0, template: `
|
|
33720
34257
|
<div class="search-panel">
|
|
33721
34258
|
@if (!searchStore.hasQuery()) {
|
|
33722
|
-
|
|
33723
|
-
|
|
33724
|
-
|
|
34259
|
+
@if (searchStore.recent().length) {
|
|
34260
|
+
<div class="search-panel__group">
|
|
34261
|
+
<span class="search-panel__source-label">{{
|
|
34262
|
+
'recent-searches' | translate
|
|
34263
|
+
}}</span>
|
|
34264
|
+
<!-- mousedown kept from the input, so picking a recent query
|
|
34265
|
+
leaves the search bar open with that query in it. -->
|
|
34266
|
+
@for (query of searchStore.recent(); track query) {
|
|
34267
|
+
<a
|
|
34268
|
+
class="search-panel__result"
|
|
34269
|
+
role="button"
|
|
34270
|
+
tabindex="0"
|
|
34271
|
+
(mousedown)="$event.preventDefault()"
|
|
34272
|
+
(click)="searchStore.updateQuery(query)"
|
|
34273
|
+
(keydown.enter)="searchStore.updateQuery(query)"
|
|
34274
|
+
>
|
|
34275
|
+
<span class="search-panel__result-title">{{ query }}</span>
|
|
34276
|
+
</a>
|
|
34277
|
+
}
|
|
34278
|
+
</div>
|
|
34279
|
+
} @else {
|
|
34280
|
+
<div class="search-panel__empty">
|
|
34281
|
+
{{ 'type-to-search' | translate }}
|
|
34282
|
+
</div>
|
|
34283
|
+
}
|
|
33725
34284
|
} @else if (!searchStore.hasResults()) {
|
|
33726
34285
|
<div class="search-panel__empty">{{ 'no-results-found' | translate }}</div>
|
|
33727
34286
|
} @else {
|
|
@@ -33731,7 +34290,11 @@ class SearchPanelComponent {
|
|
|
33731
34290
|
group.label | translate
|
|
33732
34291
|
}}</span>
|
|
33733
34292
|
@for (result of group.items; track result.id) {
|
|
33734
|
-
<a
|
|
34293
|
+
<a
|
|
34294
|
+
class="search-panel__result"
|
|
34295
|
+
[routerLink]="result.url ?? '/'"
|
|
34296
|
+
(click)="searchStore.rememberQuery()"
|
|
34297
|
+
>
|
|
33735
34298
|
@if (result.img) {
|
|
33736
34299
|
<div class="search-panel__result-img">
|
|
33737
34300
|
<m-img [src]="result.img" [alt]="result.title" />
|
|
@@ -33760,9 +34323,31 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
|
|
|
33760
34323
|
args: [{ selector: 'm-search-panel', changeDetection: ChangeDetectionStrategy.OnPush, imports: [RouterLink, ImgComponent, TranslatePipe], template: `
|
|
33761
34324
|
<div class="search-panel">
|
|
33762
34325
|
@if (!searchStore.hasQuery()) {
|
|
33763
|
-
|
|
33764
|
-
|
|
33765
|
-
|
|
34326
|
+
@if (searchStore.recent().length) {
|
|
34327
|
+
<div class="search-panel__group">
|
|
34328
|
+
<span class="search-panel__source-label">{{
|
|
34329
|
+
'recent-searches' | translate
|
|
34330
|
+
}}</span>
|
|
34331
|
+
<!-- mousedown kept from the input, so picking a recent query
|
|
34332
|
+
leaves the search bar open with that query in it. -->
|
|
34333
|
+
@for (query of searchStore.recent(); track query) {
|
|
34334
|
+
<a
|
|
34335
|
+
class="search-panel__result"
|
|
34336
|
+
role="button"
|
|
34337
|
+
tabindex="0"
|
|
34338
|
+
(mousedown)="$event.preventDefault()"
|
|
34339
|
+
(click)="searchStore.updateQuery(query)"
|
|
34340
|
+
(keydown.enter)="searchStore.updateQuery(query)"
|
|
34341
|
+
>
|
|
34342
|
+
<span class="search-panel__result-title">{{ query }}</span>
|
|
34343
|
+
</a>
|
|
34344
|
+
}
|
|
34345
|
+
</div>
|
|
34346
|
+
} @else {
|
|
34347
|
+
<div class="search-panel__empty">
|
|
34348
|
+
{{ 'type-to-search' | translate }}
|
|
34349
|
+
</div>
|
|
34350
|
+
}
|
|
33766
34351
|
} @else if (!searchStore.hasResults()) {
|
|
33767
34352
|
<div class="search-panel__empty">{{ 'no-results-found' | translate }}</div>
|
|
33768
34353
|
} @else {
|
|
@@ -33772,7 +34357,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
|
|
|
33772
34357
|
group.label | translate
|
|
33773
34358
|
}}</span>
|
|
33774
34359
|
@for (result of group.items; track result.id) {
|
|
33775
|
-
<a
|
|
34360
|
+
<a
|
|
34361
|
+
class="search-panel__result"
|
|
34362
|
+
[routerLink]="result.url ?? '/'"
|
|
34363
|
+
(click)="searchStore.rememberQuery()"
|
|
34364
|
+
>
|
|
33776
34365
|
@if (result.img) {
|
|
33777
34366
|
<div class="search-panel__result-img">
|
|
33778
34367
|
<m-img [src]="result.img" [alt]="result.title" />
|
|
@@ -33800,8 +34389,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
|
|
|
33800
34389
|
class NavHeaderComponent {
|
|
33801
34390
|
_navStore = inject(NavStore);
|
|
33802
34391
|
_searchStore = inject(SearchStore);
|
|
33803
|
-
|
|
33804
|
-
|
|
34392
|
+
// Asked of the panel that answered, not of the Address: opened over any page
|
|
34393
|
+
// but root, the Address is anchored there (`<page>_search`), and it is the
|
|
34394
|
+
// root-anchored Platform panel behind it that is showing.
|
|
34395
|
+
_isUser = computed(() => this._navStore.panelNavId() === `${ROOT_NAV$1}_user`, ...(ngDevMode ? [{ debugName: "_isUser" }] : /* istanbul ignore next */ []));
|
|
34396
|
+
_isSearch = computed(() => this._navStore.panelNavId() === `${ROOT_NAV$1}_search`, ...(ngDevMode ? [{ debugName: "_isSearch" }] : /* istanbul ignore next */ []));
|
|
33805
34397
|
_hasParent = computed(() => this._navStore.breadcrumb().header?.id !== ROOT_NAV$1, ...(ngDevMode ? [{ debugName: "_hasParent" }] : /* istanbul ignore next */ []));
|
|
33806
34398
|
_trail = computed(() => {
|
|
33807
34399
|
const trail = this._navStore.breadcrumb().trail;
|
|
@@ -34266,8 +34858,8 @@ class NavComponent {
|
|
|
34266
34858
|
return {
|
|
34267
34859
|
icon: showArrow
|
|
34268
34860
|
? isMobileOrTablet
|
|
34269
|
-
? '
|
|
34270
|
-
: '
|
|
34861
|
+
? 'chevron-down'
|
|
34862
|
+
: 'chevron-left'
|
|
34271
34863
|
: 'menu',
|
|
34272
34864
|
variant: 'ghost',
|
|
34273
34865
|
iconOnly: true,
|
|
@@ -34715,6 +35307,21 @@ class NotificationElementComponent {
|
|
|
34715
35307
|
<m-button-group [name]="buttons" />
|
|
34716
35308
|
</div>
|
|
34717
35309
|
}
|
|
35310
|
+
|
|
35311
|
+
@if (notification()?.actions?.length) {
|
|
35312
|
+
<div class="notification-item__actions">
|
|
35313
|
+
@for (action of notification()?.actions; track $index) {
|
|
35314
|
+
<!-- Same stop as dismiss: an action is not a click on the row. -->
|
|
35315
|
+
<m-one-button
|
|
35316
|
+
variant="ghost"
|
|
35317
|
+
[label]="action.label"
|
|
35318
|
+
noTranslate="true"
|
|
35319
|
+
(click)="$event.stopPropagation()"
|
|
35320
|
+
(clicked)="action.run()"
|
|
35321
|
+
/>
|
|
35322
|
+
}
|
|
35323
|
+
</div>
|
|
35324
|
+
}
|
|
34718
35325
|
}
|
|
34719
35326
|
</div>
|
|
34720
35327
|
</div>
|
|
@@ -34816,6 +35423,21 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
|
|
|
34816
35423
|
<m-button-group [name]="buttons" />
|
|
34817
35424
|
</div>
|
|
34818
35425
|
}
|
|
35426
|
+
|
|
35427
|
+
@if (notification()?.actions?.length) {
|
|
35428
|
+
<div class="notification-item__actions">
|
|
35429
|
+
@for (action of notification()?.actions; track $index) {
|
|
35430
|
+
<!-- Same stop as dismiss: an action is not a click on the row. -->
|
|
35431
|
+
<m-one-button
|
|
35432
|
+
variant="ghost"
|
|
35433
|
+
[label]="action.label"
|
|
35434
|
+
noTranslate="true"
|
|
35435
|
+
(click)="$event.stopPropagation()"
|
|
35436
|
+
(clicked)="action.run()"
|
|
35437
|
+
/>
|
|
35438
|
+
}
|
|
35439
|
+
</div>
|
|
35440
|
+
}
|
|
34819
35441
|
}
|
|
34820
35442
|
</div>
|
|
34821
35443
|
</div>
|
|
@@ -36790,22 +37412,17 @@ const providePlatformNavWidgets = () => provideNavWidgets(platformNavWidgets());
|
|
|
36790
37412
|
function provideAppContext() {
|
|
36791
37413
|
const navStore = inject(NavStore);
|
|
36792
37414
|
const authStore = inject(AuthStore);
|
|
36793
|
-
const
|
|
37415
|
+
const agreementGate = inject(AgreementGate);
|
|
36794
37416
|
const relationType = signal(null, ...(ngDevMode ? [{ debugName: "relationType" }] : /* istanbul ignore next */ []));
|
|
36795
37417
|
effect(() => {
|
|
36796
37418
|
const appLink = navStore.appLink();
|
|
36797
37419
|
const isLoggedIn = authStore.isLoggedIn();
|
|
37420
|
+
agreementGate.revision();
|
|
36798
37421
|
if (appLink && isLoggedIn) {
|
|
36799
|
-
|
|
36800
|
-
|
|
36801
|
-
|
|
36802
|
-
|
|
36803
|
-
relationType.set(response.type);
|
|
36804
|
-
},
|
|
36805
|
-
error: () => {
|
|
36806
|
-
relationType.set(null);
|
|
36807
|
-
},
|
|
36808
|
-
});
|
|
37422
|
+
// The same read the init Agreement step made, so it is fetched once.
|
|
37423
|
+
// A reply for an app the host has since left is dropped.
|
|
37424
|
+
const current = () => untracked(navStore.appLink) === appLink;
|
|
37425
|
+
agreementGate.view(appLink).then((view) => current() && relationType.set(view.type), () => current() && relationType.set(null));
|
|
36809
37426
|
}
|
|
36810
37427
|
else {
|
|
36811
37428
|
relationType.set(null);
|
|
@@ -36839,6 +37456,12 @@ function provideMagWcConfig(options) {
|
|
|
36839
37456
|
},
|
|
36840
37457
|
},
|
|
36841
37458
|
provideZonelessChangeDetection(),
|
|
37459
|
+
{
|
|
37460
|
+
// The `/app/<link>` a host mounts it under, until m-remote hands the
|
|
37461
|
+
// `appLink` input down (BaseRootWebComponent) — init reads it first.
|
|
37462
|
+
provide: APP_LINK,
|
|
37463
|
+
useFactory: () => signal(window.location.pathname.match(/^\/app\/([^/]+)/)?.[1]),
|
|
37464
|
+
},
|
|
36842
37465
|
// `always` rather than the default `emptyOnly`: a child route rendered in
|
|
36843
37466
|
// a parent Page's RouterOutlet declares its own component, so without it
|
|
36844
37467
|
// Angular hands the child none of the parent's `:params` and
|
|
@@ -37016,6 +37639,7 @@ function provideMagAppConfig(options) {
|
|
|
37016
37639
|
provideMurlUrlSerializer(),
|
|
37017
37640
|
provideZonelessChangeDetection(),
|
|
37018
37641
|
provideAnimations(),
|
|
37642
|
+
{ provide: APP_LINK, useValue: signal(options.appLink) },
|
|
37019
37643
|
provideHttpClient(withFetch(), withInterceptors([mInterceptor])),
|
|
37020
37644
|
provideAppInitializer(initMagmoniumApp({
|
|
37021
37645
|
backend: options.backend,
|
|
@@ -37114,6 +37738,7 @@ function bootstrapMagApp(routesOrOptions, maybeOptions) {
|
|
|
37114
37738
|
backend: options.backend,
|
|
37115
37739
|
authUrl: options.authUrl,
|
|
37116
37740
|
socketUrl: options.socketUrl,
|
|
37741
|
+
appLink: options.appLink,
|
|
37117
37742
|
routes: finalRoutes,
|
|
37118
37743
|
providers: options.providers,
|
|
37119
37744
|
});
|
|
@@ -37140,6 +37765,13 @@ function bootstrapMagApp(routesOrOptions, maybeOptions) {
|
|
|
37140
37765
|
if (wcConfig?.app) {
|
|
37141
37766
|
navStore.setWcConfig(wcConfig.app, wcConfig);
|
|
37142
37767
|
navStore.setAppLink(wcConfig.app);
|
|
37768
|
+
// A bootstrap naming no appLink learns it only now, after init
|
|
37769
|
+
// — so Agreement is asked here instead (store ADR 0006).
|
|
37770
|
+
const appLink = appRef.injector.get(APP_LINK);
|
|
37771
|
+
if (!appLink()) {
|
|
37772
|
+
appLink.set(wcConfig.app);
|
|
37773
|
+
appRef.injector.get(AgreementGate).ensure(wcConfig.app);
|
|
37774
|
+
}
|
|
37143
37775
|
}
|
|
37144
37776
|
else if (options.appLink) {
|
|
37145
37777
|
navStore.setAppLink(options.appLink);
|
|
@@ -39625,5 +40257,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
|
|
|
39625
40257
|
* Generated bundle index. Do not edit.
|
|
39626
40258
|
*/
|
|
39627
40259
|
|
|
39628
|
-
export { ClipboardService as $, ACCESS_DOMAINS as A, ButtonComponent as B, Assets as C, AuthActivityPageComponent as D, AuthApiService as E, AuthStore as F, AutosizeDirective as G, HeaderComponent$1 as H, InputType as I, BadgeComponent as J, BandingComponent as K, LabelComponent as L, MODAL_REF as M, BaseArrayInputComponent as N, BaseRootWebComponent as O, BaseWebComponent as P, ButtonGroupComponent as Q, RangeInputComponent as R, COMPONENT_INPUT_REGISTRY as S, TranslatePipe as T, CardComponent as U, CardWrapperComponent as V, CarouselComponent as W, ChartComponent as X, ChatBubbleComponent as Y, CheckboxInputComponent as Z, ClearableInputComponent as _, MIN_ZOOM as a, ImgComponent as a$, ColComponent as a0, ColorPickerInputComponent as a1, CommentItemComponent as a2, CommentsApiService as a3, CommentsComponent as a4, CommentsStore as a5, CompactNumberPipe as a6, ComponentInputComponent as a7, ComponentStepperComponent as a8, ConfigComponent as a9, Domain as aA, DotGridComponent as aB, DragListDirective as aC, DragListItemDirective as aD, DraggableDirective as aE, DropdownInputComponent as aF, FILTER_GROUP_CONTEXT as aG, FILTER_RANGE_MODES as aH, FILTER_VARIANTS as aI, FLEX_VARIANTS as aJ, FOLDER_PICK_LISTENER as aK, FORM_ASSET_FOLDER as aL, FileService as aM, FileUploadDirective as aN, FileUploadInputComponent as aO, FlexComponent as aP, FlexItemComponent as aQ, FormGroupComponent as aR, FrameComponent as aS, FreezeService as aT, GRID_BREAKPOINTS as aU, GetNavService as aV, HighlightDirective as aW, HttpService as aX, ICON_SOURCE as aY, IS_SIDE_PANEL as aZ, IconComponent as a_, ConfirmComponent as aa, ContextMenuComponent as ab, CustomIconClass as ac, CustomIconEditComponent as ad, DEFAULT_DENIAL as ae, DEFAULT_DOC_DENSITY as af, DEFAULT_DOC_VARIANT as ag, DEFAULT_FILTER_RANGE_MODE as ah, DEFAULT_FILTER_VARIANT as ai, DEFAULT_NAV_PARAM as aj, DEFAULT_NAV_SEGMENT as ak, DEFAULT_SIZE as al, DOCK_MIN_PAGE_REMAINDER as am, DOCS_FOLDER as an, DOC_ACTION_ICONS as ao, DOC_DENSITIES as ap, DOC_EDIT_ACTIONS as aq, DOC_TOOLBAR_GROUPS as ar, DOC_VARIANTS as as, DashboardCardComponent as at, DateInputComponent as au, DatePickerComponent as av, DeviceService as aw, DocComponent as ax, DocEditorComponent as ay, DomService as az, MAX_ZOOM as b, PercentagePipe as b$, InstrumentScoreComponent as b0, InterceptorObservables as b1, JumbotronComponent as b2, KeyValueComponent as b3, LAYOUT_ASSET_FOLDER as b4, LOGIN_COMPONENT as b5, LOGIN_STORE as b6, LanguageComponent as b7, ListComponent as b8, LogoComponent as b9, NavDetailsComponent as bA, NavHeaderComponent as bB, NavMenuComponent as bC, NavStore as bD, NavTrailComponent as bE, NothingComponent as bF, NotificationElementComponent as bG, NotificationGroupComponent as bH, NotificationPopupComponent as bI, NotificationService as bJ, NotificationStore as bK, NotificationType as bL, NotificationWidgetComponent as bM, ONE_ASSET_BASE_URL as bN, OPTIONS_SOURCE as bO, OVERLAY_WIDGETS as bP, OneApp as bQ, OptionsSourceDirective as bR, OverlayBodyComponent as bS, OverlayRef as bT, OverlayService as bU, PLATFORM_BUTTON_NAV_IDS as bV, PLATFORM_EXTENSIBLE_NAV_IDS as bW, PLATFORM_NAV_MAP as bX, PLATFORM_ROOT_CHILDREN as bY, PaginationComponent as bZ, PanelComponent as b_, MAG_SOCKET_EVENT as ba, MHeroColorDirective as bb, MHeroComponent as bc, MODAL_STORE_REF as bd, MOUNT_STATIC_SEGMENT as be, MOUNT_TOKEN as bf, MRefDirective as bg, MStepComponent as bh, MURL_PARAM as bi, MURL_SEP as bj, ManifestEnrichmentService as bk, MenuComponent as bl, ModalDirective as bm, ModalRef as bn, ModalStore as bo, MoneyPipe as bp, MultiRangeInputComponent as bq, MurlUrlSerializer as br, NAV_DEFAULT_MURL as bs, NAV_ID_SEP as bt, NAV_MAIN_BUTTONS as bu, NAV_SEGMENT_RE as bv, NAV_STORE_REF as bw, NAV_WC_COMPONENTS as bx, NAV_WIDGET_MAP as by, NavComponent as bz, cropRect as c, SocketStore as c$, PlaygroundComponent as c0, PositionDirective as c1, PwaInstallComponent as c2, REMOTE_PAGE_RELOAD as c3, ROOT_NAV$1 as c4, RadioGroupComponent as c5, RadioInputComponent as c6, RatingInputComponent as c7, ReactiveElementComponent as c8, RemoteComponent as c9, SectionFilterGroupComponent as cA, SectionFilterMenuComponent as cB, SectionFilterPanelComponent as cC, SectionFilterRangePanelComponent as cD, SectionFooterComponent as cE, SectionFormComponent as cF, SectionFormItemComponent as cG, SectionHeaderComponent as cH, SectionHeroComponent as cI, SectionPaginationComponent as cJ, SectionSearchComponent as cK, SectionStepperComponent as cL, SectionTableCellComponent as cM, SectionTableComponent as cN, SectionTableRowComponent as cO, SectionTableSortPipe as cP, SectionTabsComponent as cQ, SectionToggleComponent as cR, SectionToggleItemDirective as cS, SelectableCardInputComponent as cT, SelectorDirective as cU, SettingsSearchBarComponent as cV, SettingsSearchService as cW, ShapeComponent as cX, SharedStoreRegistry as cY, SidePanelDirective as cZ, Size as c_, RemoteLoaderService as ca, ResizeElementComponent as cb, RouteContainer as cc, RowComponent as cd, SEARCH_QUERY as ce, SEARCH_RESULTS_EVENT as cf, SECTION_ACCORDION_GROUP as cg, SECTION_FORM_CONTEXT as ch, SECTION_TABLE_VARIANTS as ci, SHARED_ICONS as cj, SIZE_CONTEXT as ck, ScoreComponent as cl, ScrollComponent as cm, ScrollService as cn, SearchPanelComponent as co, SearchStore as cp, SearchUserPanelComponent as cq, SectionAccordionDirective as cr, SectionAccordionGroupDirective as cs, SectionBackComponent as ct, SectionBadgesComponent as cu, SectionButtonGroupComponent as cv, SectionCardComponent as cw, SectionCarouselComponent as cx, SectionComponent as cy, SectionFilterComponent as cz, drawFramed as d, childNavId as d$, SortComponent as d0, StatComponent as d1, StepComponent as d2, StepperComponent as d3, StepsComponent as d4, StorageService as d5, StrokeLinecap as d6, StrokeLinejoin as d7, SummaryComponent as d8, SvgGeneratorComponent as d9, UserApiService as dA, UserAvatarComponent as dB, UserComponent as dC, UserNavComponent as dD, UserSettingsComponent as dE, UserStore as dF, WC_BUNDLE as dG, WC_NAVIGATE_EVENT as dH, WC_ROUTE_CHANGED_EVENT as dI, WC_SEARCH_GROUPS as dJ, WIN_USER_TAB_HOOK as dK, WIN_USER_TAB_KEY as dL, WatermarkComponent as dM, WcRouterStore as dN, WrapperInputComponent as dO, anchorNavId as dP, applyColorsToElement as dQ, applyDocEdit as dR, assetOptions as dS, bootstrapMagApp as dT, bootstrapPwaInstall as dU, buildWcBaseUrl as dV, calculateLuminance as dW, calculateRanks as dX, cellText as dY, checkDoc as dZ, checkFilterCondition as d_, SvgGeneratorService as da, SvgService as db, TOTAL_COLUMNS as dc, TRANSLATION_SOURCE as dd, TableComponent as de, TechnicalMeterComponent as df, TextInputComponent as dg, TextareaInputComponent as dh, ThemeComponent as di, ThemeDataService as dj, ThemeService as dk, ThemeStore as dl, TimeAgoPipe as dm, TimelineComponent as dn, ToggleButtonComponent as dp, ToggleInputComponent as dq, ToggleRadioInputComponent as dr, ToolTipDirective as ds, TooltipComponent as dt, TranslateService as du, TreeGridComponent as dv, URL_SEP as dw, USER_STORE_REF as dx, USER_TAB_MAP as dy, UniverseComponent as dz, encodeFramed as e, isExtensiblePlatformNavId as e$, claimDenial as e0, classListSignal as e1, coerceSize as e2, cornerEdge as e3, cornerSide as e4, createMap as e5, createPlatformNavMap as e6, definedWcTierOf as e7, deriveAvatarGradient as e8, deriveContrastColor as e9, flattenTreeGridRows as eA, formatBadgeCount as eB, fullName as eC, generateClipPath as eD, generateTransform as eE, getClassList as eF, getProperty as eG, getScrollParent as eH, getTierFromPreviewPath as eI, getTreeGridRow as eJ, getUniqueId as eK, getValue as eL, hasErrorComputed as eM, hexToRgb as eN, hslToRgb$1 as eO, initMagmoniumApp as eP, initialNotificationState as eQ, initialState$2 as eR, initials as eS, injectAuthenticate as eT, injectDefaultDenial as eU, injectInstallApp as eV, injectParentSize as eW, injectScrollSticky as eX, isBootRedirect as eY, isButtonName as eZ, isCancelledComputed as e_, deriveOppositeColor as ea, derivePropertyName as eb, docActionKey as ec, docAssetCandidates as ed, docProblemKey as ee, docRemotePath as ef, emailValidation as eg, evaluate as eh, evaluateBool as ei, fieldBoolean as ej, fieldNumber as ek, fieldString as el, filterHoldsList as em, filterHoldsOneBound as en, filterHoldsOptions as eo, filterHoldsRange as ep, filterList as eq, filterNumber as er, filterNumberList as es, filterOne as et, filterPanelOf as eu, filterPanelWidth as ev, filterRange as ew, filterTreeGridRows as ex, filterValueList as ey, filterValues as ez, clampFraming as f, provideModalComponents as f$, isJson as f0, isLoadingComputed as f1, isLocalhost as f2, isNavInstanceConfig as f3, isNavMenuConfig as f4, isNavRowsConfig as f5, isNavVisibilityConfig as f6, isPlatformNavId as f7, isSize as f8, isTierPreview as f9, navIdChain as fA, navIdFor as fB, navIdSegment as fC, navIdToRoutePath as fD, navIdToSegments as fE, navParamOf as fF, navTailMatcher as fG, navToId as fH, navVisibilityGuard as fI, nextSectionTableSort as fJ, normalizeAssetOptions as fK, offsetOfLine as fL, parentNavId as fM, parseAddress as fN, parseColor as fO, parseMountPattern as fP, parsePatternNames as fQ, patternValidation as fR, patternsValidation as fS, permissionRefusal as fT, platformNavWidgets as fU, privateGuard as fV, processImageToSvg as fW, provideAppContext as fX, provideMagAppConfig as fY, provideMagWcConfig as fZ, provideMagWcRoutes as f_, isUrlLocalhost as fa, isValidNavId as fb, isValidNavSegment as fc, isWebComponent as fd, linkToId as fe, linkToNav as ff, loadingActions as fg, mInterceptor as fh, manualValidation as fi, matchFieldValidation as fj, matchMount as fk, maxLengthValidation as fl, maxValidation as fm, mergePlatformNav as fn, mergeUnique as fo, mergeUniqueBy as fp, mergeUniqueWith as fq, minAgeValidation as fr, minLengthValidation as fs, minValidation as ft, miniMarkToHtml as fu, mountFor as fv, mountPatternProblem as fw, mountPatternText as fx, mountSegmentOf as fy, mountTokenOf as fz, BaseInputComponent as g, provideMurlUrlSerializer as g0, provideNavWidgets as g1, provideOverlayWidgets as g2, providePlatformNavWidgets as g3, provideSearch as g4, provideSizeContext as g5, provideUserTabs as g6, publicGuard as g7, readFieldPatterns as g8, recordDefinedWcTier as g9, toAttrBool as gA, toAttrNumber as gB, toCssLength as gC, toHostNavId as gD, toLength$1 as gE, toLocalNavId as gF, toggleTreeGridRow as gG, unfetchedPlatformNav as gH, ungroupedDocActions as gI, urlValidation as gJ, wcTierOf as gK, remoteOutletRoute as ga, renderAddress as gb, renderDocument as gc, requiredValidation as gd, resolveConfigAsset as ge, resolveIconSize as gf, resolvePallet as gg, resolvePatternRules as gh, resolveSize as gi, rgbToHex as gj, rgbToHsl as gk, rowHasChildren as gl, samePatterns as gm, sectionTableColumnId as gn, sectionTableColumnWidths as go, sectionTableFrozenCount as gp, segmentsToNavId as gq, setProperty as gr, setTreeGridChildren as gs, setWcTier as gt, settingsWidgets as gu, shouldShowBadge as gv, sortSectionTableRows as gw, splitNavId as gx, splitOnMatch as gy, stringToColor as gz, BaseTextInputComponent as h, initialFraming as i, TextOutputComponent as j, IS_DESIGN_MODE as k, APP_CONTEXT_REF as l, ASSET_BASE_URL as m, AccordionBodyDirective as n, outputSize as o, parseRatio as p, AccordionComponent as q, renameForType as r, AccordionGroupComponent as s, ActionComponent as t, AnimatedGraphsComponent as u, AppCardComponent as v, AppRelationType as w, AppTileComponent as x, AssetStore as y, AssetUrlPipe as z };
|
|
39629
|
-
//# sourceMappingURL=magmonium-one-magmonium-one-
|
|
40260
|
+
export { CheckboxInputComponent as $, ACCESS_DOMAINS as A, ButtonComponent as B, AssetUrlPipe as C, Assets as D, AuthActivityPageComponent as E, AuthApiService as F, AuthStore as G, HeaderComponent$1 as H, InputType as I, AutosizeDirective as J, BadgeComponent as K, LabelComponent as L, MODAL_REF as M, BandingComponent as N, BaseArrayInputComponent as O, BaseRootWebComponent as P, BaseWebComponent as Q, RangeInputComponent as R, ButtonGroupComponent as S, TranslatePipe as T, CALLING_APP_HEADER as U, COMPONENT_INPUT_REGISTRY as V, CardComponent as W, CardWrapperComponent as X, CarouselComponent as Y, ChartComponent as Z, ChatBubbleComponent as _, MIN_ZOOM as a, IS_SIDE_PANEL as a$, ClearableInputComponent as a0, ClipboardService as a1, ColComponent as a2, ColorPickerInputComponent as a3, CommentItemComponent as a4, CommentsApiService as a5, CommentsComponent as a6, CommentsStore as a7, CompactNumberPipe as a8, ComponentInputComponent as a9, DocEditorComponent as aA, DomService as aB, Domain as aC, DotGridComponent as aD, DragListDirective as aE, DragListItemDirective as aF, DraggableDirective as aG, DropdownInputComponent as aH, FILTER_GROUP_CONTEXT as aI, FILTER_RANGE_MODES as aJ, FILTER_VARIANTS as aK, FLEX_VARIANTS as aL, FOLDER_PICK_LISTENER as aM, FORM_ASSET_FOLDER as aN, FileService as aO, FileUploadDirective as aP, FileUploadInputComponent as aQ, FlexComponent as aR, FlexItemComponent as aS, FormGroupComponent as aT, FrameComponent as aU, FreezeService as aV, GRID_BREAKPOINTS as aW, GetNavService as aX, HighlightDirective as aY, HttpService as aZ, ICON_SOURCE as a_, ComponentStepperComponent as aa, ConfigComponent as ab, ConfirmComponent as ac, ContextMenuComponent as ad, CustomIconClass as ae, CustomIconEditComponent as af, DEFAULT_DENIAL as ag, DEFAULT_DOC_DENSITY as ah, DEFAULT_DOC_VARIANT as ai, DEFAULT_FILTER_RANGE_MODE as aj, DEFAULT_FILTER_VARIANT as ak, DEFAULT_NAV_PARAM as al, DEFAULT_NAV_SEGMENT as am, DEFAULT_SIZE as an, DOCK_MIN_PAGE_REMAINDER as ao, DOCS_FOLDER as ap, DOC_ACTION_ICONS as aq, DOC_DENSITIES as ar, DOC_EDIT_ACTIONS as as, DOC_TOOLBAR_GROUPS as at, DOC_VARIANTS as au, DashboardCardComponent as av, DateInputComponent as aw, DatePickerComponent as ax, DeviceService as ay, DocComponent as az, MAX_ZOOM as b, PaginationComponent as b$, IconComponent as b0, ImgComponent as b1, InstrumentScoreComponent as b2, InterceptorObservables as b3, JumbotronComponent as b4, KeyValueComponent as b5, LAYOUT_ASSET_FOLDER as b6, LOGIN_COMPONENT as b7, LOGIN_STORE as b8, LanguageComponent as b9, NAV_WIDGET_MAP as bA, NavComponent as bB, NavDetailsComponent as bC, NavHeaderComponent as bD, NavMenuComponent as bE, NavStore as bF, NavTrailComponent as bG, NothingComponent as bH, NotificationElementComponent as bI, NotificationGroupComponent as bJ, NotificationPopupComponent as bK, NotificationService as bL, NotificationStore as bM, NotificationType as bN, NotificationWidgetComponent as bO, ONE_ASSET_BASE_URL as bP, OPTIONS_SOURCE as bQ, OVERLAY_WIDGETS as bR, OneApp as bS, OptionsSourceDirective as bT, OverlayBodyComponent as bU, OverlayRef as bV, OverlayService as bW, PLATFORM_BUTTON_NAV_IDS as bX, PLATFORM_EXTENSIBLE_NAV_IDS as bY, PLATFORM_NAV_MAP as bZ, PLATFORM_ROOT_CHILDREN as b_, ListComponent as ba, LogoComponent as bb, MAG_SOCKET_EVENT as bc, MHeroColorDirective as bd, MHeroComponent as be, MODAL_STORE_REF as bf, MOUNT_STATIC_SEGMENT as bg, MOUNT_TOKEN as bh, MRefDirective as bi, MStepComponent as bj, MURL_PARAM as bk, MURL_SEP as bl, ManifestEnrichmentService as bm, MenuComponent as bn, ModalDirective as bo, ModalRef as bp, ModalStore as bq, MoneyPipe as br, MultiRangeInputComponent as bs, MurlUrlSerializer as bt, NAV_DEFAULT_MURL as bu, NAV_ID_SEP as bv, NAV_MAIN_BUTTONS as bw, NAV_SEGMENT_RE as bx, NAV_STORE_REF as by, NAV_WC_COMPONENTS as bz, cropRect as c, SharedStoreRegistry as c$, PanelComponent as c0, PercentagePipe as c1, PlaygroundComponent as c2, PositionDirective as c3, PwaInstallComponent as c4, RECENT_SEARCH_LIMIT as c5, REMOTE_PAGE_RELOAD as c6, ROOT_NAV$1 as c7, RadioGroupComponent as c8, RadioInputComponent as c9, SectionCarouselComponent as cA, SectionComponent as cB, SectionFilterComponent as cC, SectionFilterGroupComponent as cD, SectionFilterMenuComponent as cE, SectionFilterPanelComponent as cF, SectionFilterRangePanelComponent as cG, SectionFooterComponent as cH, SectionFormComponent as cI, SectionFormItemComponent as cJ, SectionHeaderComponent as cK, SectionHeroComponent as cL, SectionPaginationComponent as cM, SectionSearchComponent as cN, SectionStepperComponent as cO, SectionTableCellComponent as cP, SectionTableComponent as cQ, SectionTableRowComponent as cR, SectionTableSortPipe as cS, SectionTabsComponent as cT, SectionToggleComponent as cU, SectionToggleItemDirective as cV, SelectableCardInputComponent as cW, SelectorDirective as cX, SettingsSearchBarComponent as cY, SettingsSearchService as cZ, ShapeComponent as c_, RatingInputComponent as ca, ReactiveElementComponent as cb, RemoteComponent as cc, RemoteLoaderService as cd, ResizeElementComponent as ce, RouteContainer as cf, RowComponent as cg, SEARCH_QUERY as ch, SEARCH_RESULTS_EVENT as ci, SECTION_ACCORDION_GROUP as cj, SECTION_FORM_CONTEXT as ck, SECTION_TABLE_VARIANTS as cl, SHARED_ICONS as cm, SIZE_CONTEXT as cn, ScoreComponent as co, ScrollComponent as cp, ScrollService as cq, SearchPanelComponent as cr, SearchStore as cs, SearchUserPanelComponent as ct, SectionAccordionDirective as cu, SectionAccordionGroupDirective as cv, SectionBackComponent as cw, SectionBadgesComponent as cx, SectionButtonGroupComponent as cy, SectionCardComponent as cz, drawFramed as d, cellText as d$, SidePanelDirective as d0, Size as d1, SocketStore as d2, SortComponent as d3, StatComponent as d4, StepComponent as d5, StepperComponent as d6, StepsComponent as d7, StorageService as d8, StrokeLinecap as d9, USER_STORE_REF as dA, USER_TAB_MAP as dB, UniverseComponent as dC, UserApiService as dD, UserAvatarComponent as dE, UserComponent as dF, UserNavComponent as dG, UserSettingsComponent as dH, UserStore as dI, WC_BUNDLE as dJ, WC_NAVIGATE_EVENT as dK, WC_ROUTE_CHANGED_EVENT as dL, WC_SEARCH_GROUPS as dM, WIN_USER_TAB_HOOK as dN, WIN_USER_TAB_KEY as dO, WatermarkComponent as dP, WcRouterStore as dQ, WrapperInputComponent as dR, anchorNavId as dS, applyColorsToElement as dT, applyDocEdit as dU, assetOptions as dV, bootstrapMagApp as dW, bootstrapPwaInstall as dX, buildWcBaseUrl as dY, calculateLuminance as dZ, calculateRanks as d_, StrokeLinejoin as da, SummaryComponent as db, SvgGeneratorComponent as dc, SvgGeneratorService as dd, SvgService as de, TOTAL_COLUMNS as df, TRANSLATION_SOURCE as dg, TableComponent as dh, TechnicalMeterComponent as di, TextInputComponent as dj, TextareaInputComponent as dk, ThemeComponent as dl, ThemeDataService as dm, ThemeService as dn, ThemeStore as dp, TimeAgoPipe as dq, TimelineComponent as dr, ToggleButtonComponent as ds, ToggleInputComponent as dt, ToggleRadioInputComponent as du, ToolTipDirective as dv, TooltipComponent as dw, TranslateService as dx, TreeGridComponent as dy, URL_SEP as dz, encodeFramed as e, isBootRedirect as e$, checkDoc as e0, checkFilterCondition as e1, childNavId as e2, claimDenial as e3, classListSignal as e4, coerceSize as e5, cornerEdge as e6, cornerSide as e7, createMap as e8, createPlatformNavMap as e9, filterTreeGridRows as eA, filterValueList as eB, filterValues as eC, flattenTreeGridRows as eD, formatBadgeCount as eE, fullName as eF, generateClipPath as eG, generateTransform as eH, getClassList as eI, getProperty as eJ, getScrollParent as eK, getTierFromPreviewPath as eL, getTreeGridRow as eM, getUniqueId as eN, getValue as eO, hasErrorComputed as eP, hexToRgb as eQ, hslToRgb$1 as eR, initMagmoniumApp as eS, initialNotificationState as eT, initialState$2 as eU, initials as eV, injectAuthenticate as eW, injectDefaultDenial as eX, injectInstallApp as eY, injectParentSize as eZ, injectScrollSticky as e_, definedWcTierOf as ea, deriveAvatarGradient as eb, deriveContrastColor as ec, deriveOppositeColor as ed, derivePropertyName as ee, docActionKey as ef, docAssetCandidates as eg, docProblemKey as eh, docRemotePath as ei, emailValidation as ej, evaluate as ek, evaluateBool as el, fieldBoolean as em, fieldNumber as en, fieldString as eo, filterHoldsList as ep, filterHoldsOneBound as eq, filterHoldsOptions as er, filterHoldsRange as es, filterList as et, filterNumber as eu, filterNumberList as ev, filterOne as ew, filterPanelOf as ex, filterPanelWidth as ey, filterRange as ez, clampFraming as f, provideMagAppConfig as f$, isButtonName as f0, isCancelledComputed as f1, isExtensiblePlatformNavId as f2, isJson as f3, isLoadingComputed as f4, isLocalhost as f5, isNavInstanceConfig as f6, isNavMenuConfig as f7, isNavRowsConfig as f8, isNavVisibilityConfig as f9, mountPatternText as fA, mountSegmentOf as fB, mountTokenOf as fC, navIdChain as fD, navIdFor as fE, navIdSegment as fF, navIdToRoutePath as fG, navIdToSegments as fH, navParamOf as fI, navTailMatcher as fJ, navToId as fK, navVisibilityGuard as fL, nextSectionTableSort as fM, normalizeAssetOptions as fN, offsetOfLine as fO, parentNavId as fP, parseAddress as fQ, parseColor as fR, parseMountPattern as fS, parsePatternNames as fT, patternValidation as fU, patternsValidation as fV, permissionRefusal as fW, platformNavWidgets as fX, privateGuard as fY, processImageToSvg as fZ, provideAppContext as f_, isPlatformNavId as fa, isSize as fb, isTierPreview as fc, isUrlLocalhost as fd, isValidNavId as fe, isValidNavSegment as ff, isWebComponent as fg, linkToId as fh, linkToNav as fi, loadingActions as fj, mInterceptor as fk, manualValidation as fl, matchFieldValidation as fm, matchMount as fn, maxLengthValidation as fo, maxValidation as fp, mergePlatformNav as fq, mergeUnique as fr, mergeUniqueBy as fs, mergeUniqueWith as ft, minAgeValidation as fu, minLengthValidation as fv, minValidation as fw, miniMarkToHtml as fx, mountFor as fy, mountPatternProblem as fz, BaseInputComponent as g, provideMagWcConfig as g0, provideMagWcRoutes as g1, provideModalComponents as g2, provideMurlUrlSerializer as g3, provideNavWidgets as g4, provideOverlayWidgets as g5, providePlatformNavWidgets as g6, provideSearch as g7, provideSizeContext as g8, provideUserTabs as g9, splitNavId as gA, splitOnMatch as gB, stringToColor as gC, toAttrBool as gD, toAttrNumber as gE, toCssLength as gF, toHostNavId as gG, toLength$1 as gH, toLocalNavId as gI, toggleTreeGridRow as gJ, unfetchedPlatformNav as gK, ungroupedDocActions as gL, urlValidation as gM, wcTierOf as gN, publicGuard as ga, readFieldPatterns as gb, recordDefinedWcTier as gc, remoteOutletRoute as gd, renderAddress as ge, renderDocument as gf, requiredValidation as gg, resolveConfigAsset as gh, resolveIconSize as gi, resolvePallet as gj, resolvePatternRules as gk, resolveSize as gl, rgbToHex as gm, rgbToHsl as gn, rowHasChildren as go, samePatterns as gp, sectionTableColumnId as gq, sectionTableColumnWidths as gr, sectionTableFrozenCount as gs, segmentsToNavId as gt, setProperty as gu, setTreeGridChildren as gv, setWcTier as gw, settingsWidgets as gx, shouldShowBadge as gy, sortSectionTableRows as gz, BaseTextInputComponent as h, initialFraming as i, TextOutputComponent as j, IS_DESIGN_MODE as k, APP_CONTEXT_REF as l, APP_LINK as m, ASSET_BASE_URL as n, outputSize as o, parseRatio as p, AccordionBodyDirective as q, renameForType as r, AccordionComponent as s, AccordionGroupComponent as t, ActionComponent as u, AnimatedGraphsComponent as v, AppCardComponent as w, AppRelationType as x, AppTileComponent as y, AssetStore as z };
|
|
40261
|
+
//# sourceMappingURL=magmonium-one-magmonium-one-B5qzsrNB.mjs.map
|