@magmonium/one 0.2.48 → 0.2.50

package/fesm2022/{magmonium-one-magmonium-one-NPMk122K.mjs → magmonium-one-magmonium-one-CSXqQSjH.mjs}

@@ -6990,7 +6990,7 @@ class SectionFormItemComponent extends ConfigComponent {
                     break;
                 }
                 case InputType.TOGGLE: {
-                    const { ToggleInputComponent } = await import('./magmonium-one-toggle-BaeVonYJ.mjs');
+                    const { ToggleInputComponent } = await import('./magmonium-one-toggle-CCaLEJ8V.mjs');
                     this.createDynamicComponent(seq, ToggleInputComponent, [], true);
                     break;
                 }
@@ -7002,12 +7002,12 @@ class SectionFormItemComponent extends ConfigComponent {
                     break;
                 }
                 case InputType.PASSWORD: {
-                    const { PasswordInputComponent } = await import('./magmonium-one-password-C4ExI9DU.mjs');
+                    const { PasswordInputComponent } = await import('./magmonium-one-password-x0jlYhku.mjs');
                     this.createDynamicComponent(seq, PasswordInputComponent);
                     break;
                 }
                 case InputType.OTP: {
-                    const { OtpInputComponent } = await import('./magmonium-one-otp-UHSEpR9_.mjs');
+                    const { OtpInputComponent } = await import('./magmonium-one-otp-DCDSkq9D.mjs');
                     this.createDynamicComponent(seq, OtpInputComponent);
                     break;
                 }
@@ -8736,7 +8736,7 @@ let HeaderComponent$1 = class HeaderComponent {
         </h6>
       }
     }
-  `, 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__action{margin-left:auto}.header__action span{display:inline-block;vertical-align:middle}h1.header__heading{font-size:2.25rem;font-weight:300;color:var(--m-text-quaternary);letter-spacing:-.035em;line-height:1.15}h2.header__heading{font-size:1.75rem;font-weight:300;color:var(--m-text-tertiary);letter-spacing:-.03em;line-height:1.2}h3.header__heading{font-size:1.375rem;font-weight:400;color:var(--m-text-secondary);letter-spacing:-.025em}h4.header__heading{font-size:1.125rem;font-weight:500;color:var(--m-text);letter-spacing:-.02em}h5.header__heading{font-size:1rem;font-weight:600;color:var(--m-text);letter-spacing:-.01em}h6.header__heading{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"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+  `, 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__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"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 };
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: HeaderComponent$1, decorators: [{
             type: Component,
@@ -8797,7 +8797,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
         </h6>
       }
     }
-  `, 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__action{margin-left:auto}.header__action span{display:inline-block;vertical-align:middle}h1.header__heading{font-size:2.25rem;font-weight:300;color:var(--m-text-quaternary);letter-spacing:-.035em;line-height:1.15}h2.header__heading{font-size:1.75rem;font-weight:300;color:var(--m-text-tertiary);letter-spacing:-.03em;line-height:1.2}h3.header__heading{font-size:1.375rem;font-weight:400;color:var(--m-text-secondary);letter-spacing:-.025em}h4.header__heading{font-size:1.125rem;font-weight:500;color:var(--m-text);letter-spacing:-.02em}h5.header__heading{font-size:1rem;font-weight:600;color:var(--m-text);letter-spacing:-.01em}h6.header__heading{font-size:.875rem;font-weight:600;color:var(--m-text);letter-spacing:.05em;text-transform:uppercase}\n"] }]
+  `, 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__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"] }]
         }], propDecorators: { level: [{ type: i0.Input, args: [{ isSignal: true, alias: "level", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", 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"] }] } });
 
 const SECTION_CONTEXT = new InjectionToken('SECTION_CONTEXT');
@@ -15525,10 +15525,18 @@ const UserStore = signalStore({ providedIn: 'root' }, withState(initialUserState
     };
 }));
 
+// A name is stored however it was typed — `john`, `JOHN`, `mcdonald` — and a
+// row of people reads as one list only when every name starts the same way.
+// Only the first letter of each word moves: lowercasing the rest would turn
+// `McDonald` into `Mcdonald`, which is a different person's name.
+function capitalizeName(value) {
+    return value.replace(/(^|[\s'-])(\p{L})/gu, (_, sep, ch) => sep + ch.toLocaleUpperCase());
+}
 function fullName(user) {
     if (!user)
         return '';
-    return `${user.firstName ?? ''} ${user.lastName ?? ''}`.trim();
+    const name = `${user.firstName ?? ''} ${user.lastName ?? ''}`.trim();
+    return capitalizeName(name);
 }
 function initials(user) {
     if (!user)
@@ -15598,7 +15606,7 @@ class UserAvatarComponent {
       <span class="user-avatar-initials">{{ abbr() }}</span>
     }
     <ng-content />
-  `, 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;justify-content:center;position:relative;overflow:hidden;width:32px;height:32px;background:var(--m-background-lite, #f3f4f6);color:var(--m-text-secondary, #4b5563);border:1px solid var(--m-border, rgba(0, 0, 0, .08));box-shadow:none;transition:transform .2s cubic-bezier(.4,0,.2,1),border-color .2s ease;box-sizing:border-box}@media(hover:hover){:host:hover{transform:scale(1.04);border-color:var(--m-text-secondary, rgba(0, 0, 0, .15))}}:host(.user-avatar--has-gradient){color:#fff;border-color:#ffffff26}@media(hover:hover){:host(.user-avatar--has-gradient):hover{border-color:#ffffff4d}}:host{width:2.75em;height:2.75em}:host(.user-avatar--square){border-radius:20%}:host(.user-avatar--rounded){border-radius:50%}.user-avatar-initials{color:inherit;font-family:Outfit,Inter,system-ui,-apple-system,sans-serif;font-weight:700;letter-spacing:-.01em;text-transform:uppercase;z-index:2;-webkit-user-select:none;user-select:none}\n"], dependencies: [{ kind: "component", type: ImgComponent, selector: "m-img", inputs: ["src", "data", "dataType", "alt", "priority", "fill", "width", "height", "remote", "ngSrcset", "sizes"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+  `, 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;justify-content:center;position:relative;overflow:hidden;width:2.5em;height:2.5em;flex:0 0 auto;background:var(--m-background-lite, #f3f4f6);color:var(--m-text-secondary, #4b5563);border:1px solid var(--m-border, rgba(0, 0, 0, .08));box-shadow:none;transition:transform .2s cubic-bezier(.4,0,.2,1),border-color .2s ease;box-sizing:border-box}@media(hover:hover){:host:hover{transform:scale(1.04);border-color:var(--m-text-secondary, rgba(0, 0, 0, .15))}}:host(.user-avatar--has-gradient){color:#fff;border-color:#ffffff26}@media(hover:hover){:host(.user-avatar--has-gradient):hover{border-color:#ffffff4d}}:host(.user-avatar--square){border-radius:20%}:host(.user-avatar--rounded){border-radius:50%}.user-avatar-initials{color:inherit;font-family:Outfit,Inter,system-ui,-apple-system,sans-serif;font-size:.9em;font-weight:700;letter-spacing:-.01em;text-transform:uppercase;z-index:2;-webkit-user-select:none;user-select:none}\n"], dependencies: [{ kind: "component", type: ImgComponent, selector: "m-img", inputs: ["src", "data", "dataType", "alt", "priority", "fill", "width", "height", "remote", "ngSrcset", "sizes"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: UserAvatarComponent, decorators: [{
             type: Component,
@@ -15612,9 +15620,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
   `, changeDetection: ChangeDetectionStrategy.OnPush, host: {
                         '[style.background]': 'gradient()',
                         '[class]': 'hostClass()',
-                    }, 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;justify-content:center;position:relative;overflow:hidden;width:32px;height:32px;background:var(--m-background-lite, #f3f4f6);color:var(--m-text-secondary, #4b5563);border:1px solid var(--m-border, rgba(0, 0, 0, .08));box-shadow:none;transition:transform .2s cubic-bezier(.4,0,.2,1),border-color .2s ease;box-sizing:border-box}@media(hover:hover){:host:hover{transform:scale(1.04);border-color:var(--m-text-secondary, rgba(0, 0, 0, .15))}}:host(.user-avatar--has-gradient){color:#fff;border-color:#ffffff26}@media(hover:hover){:host(.user-avatar--has-gradient):hover{border-color:#ffffff4d}}:host{width:2.75em;height:2.75em}:host(.user-avatar--square){border-radius:20%}:host(.user-avatar--rounded){border-radius:50%}.user-avatar-initials{color:inherit;font-family:Outfit,Inter,system-ui,-apple-system,sans-serif;font-weight:700;letter-spacing:-.01em;text-transform:uppercase;z-index:2;-webkit-user-select:none;user-select:none}\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;justify-content:center;position:relative;overflow:hidden;width:2.5em;height:2.5em;flex:0 0 auto;background:var(--m-background-lite, #f3f4f6);color:var(--m-text-secondary, #4b5563);border:1px solid var(--m-border, rgba(0, 0, 0, .08));box-shadow:none;transition:transform .2s cubic-bezier(.4,0,.2,1),border-color .2s ease;box-sizing:border-box}@media(hover:hover){:host:hover{transform:scale(1.04);border-color:var(--m-text-secondary, rgba(0, 0, 0, .15))}}:host(.user-avatar--has-gradient){color:#fff;border-color:#ffffff26}@media(hover:hover){:host(.user-avatar--has-gradient):hover{border-color:#ffffff4d}}:host(.user-avatar--square){border-radius:20%}:host(.user-avatar--rounded){border-radius:50%}.user-avatar-initials{color:inherit;font-family:Outfit,Inter,system-ui,-apple-system,sans-serif;font-size:.9em;font-weight:700;letter-spacing:-.01em;text-transform:uppercase;z-index:2;-webkit-user-select:none;user-select:none}\n"] }]
         }], propDecorators: { user: [{ type: i0.Input, args: [{ isSignal: true, alias: "user", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }] } });
 
+// Under DesignMode a UserControl whose four values are all still empty has no
+// name to draw, and an avatar over a blank line reads as broken rather than as
+// unfilled. A stub gives the author the shape of the row they are placing —
+// deliberately not translated, it stands in for data and never renders on a
+// real page.
+const DESIGN_STUB$1 = { firstName: 'Firstname', lastName: 'Lastname' };
 class UserComponent {
     id = input(...(ngDevMode ? [undefined, { debugName: "id" }] : /* istanbul ignore next */ []));
     user = input(undefined, ...(ngDevMode ? [{ debugName: "user" }] : /* istanbul ignore next */ []));
@@ -15622,14 +15636,16 @@ class UserComponent {
     lastName = input('', ...(ngDevMode ? [{ debugName: "lastName" }] : /* istanbul ignore next */ []));
     profilePic = input('', ...(ngDevMode ? [{ debugName: "profilePic" }] : /* istanbul ignore next */ []));
     #userStore = inject(UserStore);
+    #isDesignMode = !!inject(IS_DESIGN_MODE, { optional: true });
     resolvedUser = computed(() => {
         const id = this.id();
         const base = this.user() ?? (id ? this.#userStore.get(id)() : undefined);
         const firstName = this.firstName();
         const lastName = this.lastName();
         const profilePic = this.profilePic();
-        if (!base && !firstName && !lastName && !profilePic)
-            return undefined;
+        if (!base && !firstName && !lastName && !profilePic) {
+            return this.#isDesignMode ? DESIGN_STUB$1 : undefined;
+        }
         return {
             ...base,
             id: base?.id ?? id,
@@ -15685,7 +15701,7 @@ class UserComponent {
         }
       </div>
     </div>
-  `, 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)}}.user-profile{display:flex;align-items:flex-start;gap:1.25rem;padding:.25rem;border-radius:1.5rem;transition:all .3s cubic-bezier(.4,0,.2,1)}.user-info{display:flex;flex-direction:column;align-items:flex-start;gap:.35rem;flex:1;min-width:0}.user-header{display:flex;align-items:center;gap:.75rem;flex-wrap:wrap}.user-content{display:contents}.user-info:has(.user-content>*) .user-meta,.user-info:has(.user-content>*) .user-meta-loading{display:none}.user-name{font-size:1.25rem;font-weight:800;color:var(--m-text);margin:0;letter-spacing:-.03em;line-height:1.2;text-transform:capitalize}.user-meta{display:flex;align-items:center;gap:.5rem;color:var(--m-text-secondary);font-size:.875rem;font-weight:600;opacity:.8}.user-meta-item{display:flex;align-items:center}.user-meta-divider{width:3px;height:3px;border-radius:50%;background:var(--m-text-tertiary);opacity:.4}\n"], dependencies: [{ kind: "component", type: UserAvatarComponent, selector: "m-user-avatar", inputs: ["user", "variant"] }, { kind: "component", type: HeaderComponent$1, selector: "m-header", inputs: ["level", "label", "actionButton", "actionLabel", "noTranslate", "params"], outputs: ["actionClick"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+  `, 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)}}.user-profile{display:flex;align-items:flex-start;gap:.75em;padding:.25em;border-radius:.75em;transition:all .3s cubic-bezier(.4,0,.2,1)}.user-avatar{display:flex;flex:0 0 auto}.user-info{display:flex;flex-direction:column;align-items:flex-start;gap:.15em;flex:1;min-width:0}.user-header{display:flex;align-items:center;gap:.75em;flex-wrap:wrap}.user-content{display:contents}.user-info:has(.user-content>*) .user-meta,.user-info:has(.user-content>*) .user-meta-loading{display:none}m-header{--m-header-font-size: 1em;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.user-meta{display:flex;align-items:center;gap:.4em;color:var(--m-text-secondary);font-size:.8em;font-weight:600;line-height:1.2;opacity:.8}.user-meta-item{display:flex;align-items:center}.user-meta-divider{width:.2em;height:.2em;border-radius:50%;background:var(--m-text-tertiary);opacity:.4}.user-name-loading,.user-meta-loading{border-radius:.35em;background:var(--m-text-tertiary);opacity:.15;animation:user-skeleton-pulse 1.4s ease-in-out infinite}.user-name-loading{width:8em;height:1.2em}.user-meta-loading{width:5em;height:.96em}@keyframes user-skeleton-pulse{0%,to{opacity:.15}50%{opacity:.28}}\n"], dependencies: [{ kind: "component", type: UserAvatarComponent, selector: "m-user-avatar", inputs: ["user", "variant"] }, { kind: "component", type: HeaderComponent$1, selector: "m-header", inputs: ["level", "label", "actionButton", "actionLabel", "noTranslate", "params"], outputs: ["actionClick"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: UserComponent, decorators: [{
             type: Component,
@@ -15722,7 +15738,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
         }
       </div>
     </div>
-  `, 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)}}.user-profile{display:flex;align-items:flex-start;gap:1.25rem;padding:.25rem;border-radius:1.5rem;transition:all .3s cubic-bezier(.4,0,.2,1)}.user-info{display:flex;flex-direction:column;align-items:flex-start;gap:.35rem;flex:1;min-width:0}.user-header{display:flex;align-items:center;gap:.75rem;flex-wrap:wrap}.user-content{display:contents}.user-info:has(.user-content>*) .user-meta,.user-info:has(.user-content>*) .user-meta-loading{display:none}.user-name{font-size:1.25rem;font-weight:800;color:var(--m-text);margin:0;letter-spacing:-.03em;line-height:1.2;text-transform:capitalize}.user-meta{display:flex;align-items:center;gap:.5rem;color:var(--m-text-secondary);font-size:.875rem;font-weight:600;opacity:.8}.user-meta-item{display:flex;align-items:center}.user-meta-divider{width:3px;height:3px;border-radius:50%;background:var(--m-text-tertiary);opacity:.4}\n"] }]
+  `, 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)}}.user-profile{display:flex;align-items:flex-start;gap:.75em;padding:.25em;border-radius:.75em;transition:all .3s cubic-bezier(.4,0,.2,1)}.user-avatar{display:flex;flex:0 0 auto}.user-info{display:flex;flex-direction:column;align-items:flex-start;gap:.15em;flex:1;min-width:0}.user-header{display:flex;align-items:center;gap:.75em;flex-wrap:wrap}.user-content{display:contents}.user-info:has(.user-content>*) .user-meta,.user-info:has(.user-content>*) .user-meta-loading{display:none}m-header{--m-header-font-size: 1em;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.user-meta{display:flex;align-items:center;gap:.4em;color:var(--m-text-secondary);font-size:.8em;font-weight:600;line-height:1.2;opacity:.8}.user-meta-item{display:flex;align-items:center}.user-meta-divider{width:.2em;height:.2em;border-radius:50%;background:var(--m-text-tertiary);opacity:.4}.user-name-loading,.user-meta-loading{border-radius:.35em;background:var(--m-text-tertiary);opacity:.15;animation:user-skeleton-pulse 1.4s ease-in-out infinite}.user-name-loading{width:8em;height:1.2em}.user-meta-loading{width:5em;height:.96em}@keyframes user-skeleton-pulse{0%,to{opacity:.15}50%{opacity:.28}}\n"] }]
         }], propDecorators: { id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }], user: [{ type: i0.Input, args: [{ isSignal: true, alias: "user", required: false }] }], firstName: [{ type: i0.Input, args: [{ isSignal: true, alias: "firstName", required: false }] }], lastName: [{ type: i0.Input, args: [{ isSignal: true, alias: "lastName", required: false }] }], profilePic: [{ type: i0.Input, args: [{ isSignal: true, alias: "profilePic", required: false }] }] } });
 
 const checkPassword = (value, password) => {
@@ -20562,7 +20578,7 @@ class WrapperInputComponent extends ConfigComponent {
                 break;
             }
             case InputType.TOGGLE: {
-                const { ToggleInputComponent } = await import('./magmonium-one-toggle-BaeVonYJ.mjs');
+                const { ToggleInputComponent } = await import('./magmonium-one-toggle-CCaLEJ8V.mjs');
                 this.createDynamicComponent(seq, ToggleInputComponent, [], true);
                 break;
             }
@@ -20574,12 +20590,12 @@ class WrapperInputComponent extends ConfigComponent {
                 break;
             }
             case InputType.PASSWORD: {
-                const { PasswordInputComponent } = await import('./magmonium-one-password-C4ExI9DU.mjs');
+                const { PasswordInputComponent } = await import('./magmonium-one-password-x0jlYhku.mjs');
                 this.createDynamicComponent(seq, PasswordInputComponent);
                 break;
             }
             case InputType.OTP: {
-                const { OtpInputComponent } = await import('./magmonium-one-otp-UHSEpR9_.mjs');
+                const { OtpInputComponent } = await import('./magmonium-one-otp-DCDSkq9D.mjs');
                 this.createDynamicComponent(seq, OtpInputComponent);
                 break;
             }
@@ -35018,4 +35034,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
  */
 
 export { DEFAULT_NAV_PARAM as $, ACCESS_DOMAINS as A, BaseInputComponent as B, COMPONENT_INPUT_REGISTRY as C, CardComponent as D, CardWrapperComponent as E, CarouselComponent as F, ChartComponent as G, CheckboxInputComponent as H, IS_DESIGN_MODE as I, ClearableInputComponent as J, ColComponent as K, LabelComponent as L, ColorPickerInputComponent as M, CommentItemComponent as N, CommentsApiService as O, CommentsComponent as P, CommentsStore as Q, ComponentInputComponent as R, ComponentStepperComponent as S, TranslatePipe as T, ConfigComponent as U, ConfirmComponent as V, ContextMenuComponent as W, CustomIconClass as X, CustomIconEditComponent as Y, DEFAULT_FILTER_RANGE_MODE as Z, DEFAULT_FILTER_VARIANT as _, BaseTextInputComponent as a, MurlUrlSerializer as a$, DEFAULT_NAV_SEGMENT as a0, DEFAULT_SIZE as a1, DashboardCardComponent as a2, DateInputComponent as a3, DatePickerComponent as a4, DeviceService as a5, DomService as a6, Domain as a7, DotGridComponent as a8, DragListDirective as a9, InputType as aA, InstrumentScoreComponent as aB, InterceptorObservables as aC, JumbotronComponent as aD, KeyValueComponent as aE, LAYOUT_ASSET_FOLDER as aF, LOGIN_COMPONENT as aG, LOGIN_STORE as aH, LanguageComponent as aI, ListComponent as aJ, LogoComponent as aK, MAG_SOCKET_EVENT as aL, MHeroColorDirective as aM, MHeroComponent as aN, MODAL_REF as aO, MODAL_STORE_REF as aP, MRefDirective as aQ, MStepComponent as aR, MURL_PARAM as aS, MURL_SEP as aT, ManifestEnrichmentService as aU, MenuComponent as aV, ModalDirective as aW, ModalRef as aX, ModalStore as aY, MoneyPipe as aZ, MultiRangeInputComponent as a_, DragListItemDirective as aa, DraggableDirective as ab, DropdownInputComponent as ac, FILTER_GROUP_CONTEXT as ad, FILTER_RANGE_MODES as ae, FILTER_VARIANTS as af, FLEX_VARIANTS as ag, FOLDER_PICK_LISTENER as ah, FORM_ASSET_FOLDER as ai, FileService as aj, FileUploadDirective as ak, FileUploadInputComponent as al, FlexComponent as am, FlexItemComponent as an, FormGroupComponent as ao, FrameComponent as ap, FreezeService as aq, GRID_BREAKPOINTS as ar, GetNavService as as, HeaderComponent$1 as at, HighlightDirective as au, HttpService as av, ICON_SOURCE as aw, IS_SIDE_PANEL as ax, IconComponent as ay, ImgComponent as az, TextOutputComponent as b, SectionAccordionGroupDirective as b$, NAV_DEFAULT_MURL as b0, NAV_ID_SEP as b1, NAV_MAIN_BUTTONS as b2, NAV_SEGMENT_RE as b3, NAV_STORE_REF as b4, NAV_WC_COMPONENTS as b5, NAV_WIDGET_MAP as b6, NavComponent as b7, NavDetailsComponent as b8, NavHeaderComponent as b9, PlaygroundComponent as bA, PositionDirective as bB, PwaInstallComponent as bC, ROOT_NAV$1 as bD, RadioGroupComponent as bE, RadioInputComponent as bF, RangeInputComponent as bG, RatingInputComponent as bH, ReactiveElementComponent as bI, RemoteComponent as bJ, RemoteLoaderService as bK, ResizeElementComponent as bL, RouteContainer as bM, RowComponent as bN, SEARCH_QUERY as bO, SEARCH_RESULTS_EVENT as bP, SECTION_ACCORDION_GROUP as bQ, SECTION_FORM_CONTEXT as bR, SHARED_ICONS as bS, SIZE_CONTEXT as bT, ScoreComponent as bU, ScrollComponent as bV, ScrollService as bW, SearchPanelComponent as bX, SearchStore as bY, SearchUserPanelComponent as bZ, SectionAccordionDirective as b_, NavMenuComponent as ba, NavStore as bb, NavTrailComponent as bc, NothingComponent as bd, NotificationElementComponent as be, NotificationGroupComponent as bf, NotificationPopupComponent as bg, NotificationService as bh, NotificationStore as bi, NotificationType as bj, NotificationWidgetComponent as bk, ONE_ASSET_BASE_URL as bl, OPTIONS_SOURCE as bm, OVERLAY_WIDGETS as bn, OneApp as bo, OptionsSourceDirective as bp, OverlayBodyComponent as bq, OverlayRef as br, OverlayService as bs, PLATFORM_BUTTON_NAV_IDS as bt, PLATFORM_EXTENSIBLE_NAV_IDS as bu, PLATFORM_NAV_MAP as bv, PLATFORM_ROOT_CHILDREN as bw, PaginationComponent as bx, PanelComponent as by, PercentagePipe as bz, ButtonComponent as c, USER_STORE_REF as c$, SectionBackComponent as c0, SectionBadgesComponent as c1, SectionButtonGroupComponent as c2, SectionCardComponent as c3, SectionCarouselComponent as c4, SectionComponent as c5, SectionFilterComponent as c6, SectionFilterGroupComponent as c7, SectionFilterMenuComponent as c8, SectionFilterPanelComponent as c9, StorageService as cA, StrokeLinecap as cB, StrokeLinejoin as cC, SummaryComponent as cD, SvgGeneratorComponent as cE, SvgGeneratorService as cF, SvgService as cG, TOTAL_COLUMNS as cH, TRANSLATION_SOURCE as cI, TableComponent as cJ, TechnicalMeterComponent as cK, TextInputComponent as cL, TextareaInputComponent as cM, ThemeComponent as cN, ThemeDataService as cO, ThemeService as cP, ThemeStore as cQ, TimeAgoPipe as cR, TimelineComponent as cS, ToggleButtonComponent as cT, ToggleInputComponent as cU, ToggleRadioInputComponent as cV, ToolTipDirective as cW, TooltipComponent as cX, TranslateService as cY, TreeGridComponent as cZ, URL_SEP as c_, SectionFilterRangePanelComponent as ca, SectionFooterComponent as cb, SectionFormComponent as cc, SectionFormItemComponent as cd, SectionHeaderComponent as ce, SectionHeroComponent as cf, SectionPaginationComponent as cg, SectionSearchComponent as ch, SectionStepperComponent as ci, SectionTabsComponent as cj, SectionToggleComponent as ck, SectionToggleItemDirective as cl, SelectableCardInputComponent as cm, SelectorDirective as cn, SettingsSearchBarComponent as co, SettingsSearchService as cp, ShapeComponent as cq, SharedStoreRegistry as cr, SidePanelDirective as cs, Size as ct, SocketStore as cu, SortComponent as cv, StatComponent as cw, StepComponent as cx, StepperComponent as cy, StepsComponent as cz, APP_CONTEXT_REF as d, getTreeGridRow as d$, USER_TAB_MAP as d0, UniverseComponent as d1, UserApiService as d2, UserAvatarComponent as d3, UserComponent as d4, UserNavComponent as d5, UserSettingsComponent as d6, UserStore as d7, WC_ROUTE_CHANGED_EVENT as d8, WC_SEARCH_GROUPS as d9, derivePropertyName as dA, emailValidation as dB, evaluate as dC, evaluateBool as dD, filterHoldsList as dE, filterHoldsOneBound as dF, filterHoldsOptions as dG, filterHoldsRange as dH, filterList as dI, filterNumber as dJ, filterNumberList as dK, filterOne as dL, filterPanelOf as dM, filterPanelWidth as dN, filterRange as dO, filterTreeGridRows as dP, filterValueList as dQ, filterValues as dR, flattenTreeGridRows as dS, formatBadgeCount as dT, fullName as dU, generateClipPath as dV, generateTransform as dW, getClassList as dX, getProperty as dY, getScrollParent as dZ, getTierFromPreviewPath as d_, WIN_USER_TAB_HOOK as da, WIN_USER_TAB_KEY as db, WatermarkComponent as dc, WcRouterStore as dd, WrapperInputComponent as de, anchorNavId as df, applyColorsToElement as dg, assetOptions as dh, bootstrapMagApp as di, bootstrapPwaInstall as dj, buildWcBaseUrl as dk, calculateLuminance as dl, calculateRanks as dm, cellText as dn, checkFilterCondition as dp, childNavId as dq, classListSignal as dr, coerceSize as ds, cornerEdge as dt, cornerSide as du, createMap as dv, createPlatformNavMap as dw, deriveAvatarGradient as dx, deriveContrastColor as dy, deriveOppositeColor as dz, ASSET_BASE_URL as e, provideMagAppConfig as e$, getUniqueId as e0, getValue as e1, hasErrorComputed as e2, hexToRgb as e3, hslToRgb$1 as e4, initMagmoniumApp as e5, initialNotificationState as e6, initialState$2 as e7, initials as e8, injectAuthenticate as e9, maxValidation as eA, mergePlatformNav as eB, mergeUnique as eC, mergeUniqueBy as eD, mergeUniqueWith as eE, minAgeValidation as eF, minLengthValidation as eG, minValidation as eH, miniMarkToHtml as eI, navIdChain as eJ, navIdFor as eK, navIdSegment as eL, navIdToRoutePath as eM, navIdToSegments as eN, navParamOf as eO, navToId as eP, normalizeAssetOptions as eQ, parentNavId as eR, parseAddress as eS, parseColor as eT, parsePatternNames as eU, patternValidation as eV, patternsValidation as eW, platformNavWidgets as eX, privateGuard as eY, processImageToSvg as eZ, provideAppContext as e_, injectInstallApp as ea, injectParentSize as eb, injectScrollSticky as ec, isButtonName as ed, isCancelledComputed as ee, isExtensiblePlatformNavId as ef, isJson as eg, isLoadingComputed as eh, isLocalhost as ei, isNavInstanceConfig as ej, isNavMenuConfig as ek, isNavRowsConfig as el, isPlatformNavId as em, isSize as en, isTierPreview as eo, isUrlLocalhost as ep, isValidNavId as eq, isValidNavSegment as er, isWebComponent as es, linkToId as et, linkToNav as eu, loadingActions as ev, mInterceptor as ew, manualValidation as ex, matchFieldValidation as ey, maxLengthValidation as ez, AccordionBodyDirective as f, provideMagWcConfig as f0, provideMagWcRoutes as f1, provideModalComponents as f2, provideMurlUrlSerializer as f3, provideNavWidgets as f4, provideOverlayWidgets as f5, providePlatformNavWidgets as f6, provideSearch as f7, provideSizeContext as f8, provideUserTabs as f9, toLocalNavId as fA, toggleTreeGridRow as fB, unfetchedPlatformNav as fC, urlValidation as fD, publicGuard as fa, readFieldPatterns as fb, renderAddress as fc, requiredValidation as fd, resolveConfigAsset as fe, resolveIconSize as ff, resolvePallet as fg, resolvePatternRules as fh, resolveSize as fi, rgbToHex as fj, rgbToHsl as fk, rowHasChildren as fl, samePatterns as fm, segmentsToNavId as fn, setProperty as fo, setTreeGridChildren as fp, settingsWidgets as fq, shouldShowBadge as fr, splitNavId as fs, splitOnMatch as ft, stringToColor as fu, toAttrBool as fv, toAttrNumber as fw, toCssLength as fx, toHostNavId as fy, toLength$1 as fz, AccordionComponent as g, AccordionGroupComponent as h, ActionComponent as i, AnimatedGraphsComponent as j, AppCardComponent as k, AppRelationType as l, AppTileComponent as m, AssetStore as n, AssetUrlPipe as o, Assets as p, AuthActivityPageComponent as q, AuthApiService as r, AuthStore as s, AutosizeDirective as t, BadgeComponent as u, BandingComponent as v, BaseArrayInputComponent as w, BaseRootWebComponent as x, BaseWebComponent as y, ButtonGroupComponent as z };
-//# sourceMappingURL=magmonium-one-magmonium-one-NPMk122K.mjs.map
+//# sourceMappingURL=magmonium-one-magmonium-one-CSXqQSjH.mjs.map