@magmonium/one 0.2.6 → 0.2.8

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.
@@ -5446,7 +5446,7 @@ class ImgComponent {
5446
5446
  this.isLoaded.set(false);
5447
5447
  }
5448
5448
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: ImgComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
5449
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: ImgComponent, isStandalone: true, selector: "m-img", inputs: { src: { classPropertyName: "src", publicName: "src", isSignal: true, isRequired: false, transformFunction: null }, data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null }, dataType: { classPropertyName: "dataType", publicName: "dataType", isSignal: true, isRequired: false, transformFunction: null }, alt: { classPropertyName: "alt", publicName: "alt", isSignal: true, isRequired: true, transformFunction: null }, priority: { classPropertyName: "priority", publicName: "priority", isSignal: true, isRequired: false, transformFunction: null }, fill: { classPropertyName: "fill", publicName: "fill", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, height: { classPropertyName: "height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null }, remote: { classPropertyName: "remote", publicName: "remote", isSignal: true, isRequired: false, transformFunction: null }, ngSrcset: { classPropertyName: "ngSrcset", publicName: "ngSrcset", isSignal: true, isRequired: false, transformFunction: null }, sizes: { classPropertyName: "sizes", publicName: "sizes", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.m-img-host--fill": "fill()", "style.width.px": "boxWidth()", "style.height.px": "boxHeight()" } }, providers: [
5449
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: ImgComponent, isStandalone: true, selector: "m-img", inputs: { src: { classPropertyName: "src", publicName: "src", isSignal: true, isRequired: false, transformFunction: null }, data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null }, dataType: { classPropertyName: "dataType", publicName: "dataType", isSignal: true, isRequired: false, transformFunction: null }, alt: { classPropertyName: "alt", publicName: "alt", isSignal: true, isRequired: true, transformFunction: null }, priority: { classPropertyName: "priority", publicName: "priority", isSignal: true, isRequired: false, transformFunction: null }, fill: { classPropertyName: "fill", publicName: "fill", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, height: { classPropertyName: "height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null }, remote: { classPropertyName: "remote", publicName: "remote", isSignal: true, isRequired: false, transformFunction: null }, ngSrcset: { classPropertyName: "ngSrcset", publicName: "ngSrcset", isSignal: true, isRequired: false, transformFunction: null }, sizes: { classPropertyName: "sizes", publicName: "sizes", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "style.width.px": "boxWidth()", "style.height.px": "boxHeight()" } }, providers: [
5450
5450
  {
5451
5451
  provide: IMAGE_LOADER,
5452
5452
  useValue: (config) => {
@@ -5470,7 +5470,7 @@ class ImgComponent {
5470
5470
  [class.m-img--sized]="isSized()"
5471
5471
  >
5472
5472
  @if (hasError()) {
5473
- <div class="m-img__fallback" [attr.aria-label]="alt()">
5473
+ <div class="m-img__fallback" role="img" [attr.aria-label]="alt()">
5474
5474
  <svg
5475
5475
  viewBox="0 0 24 24"
5476
5476
  fill="none"
@@ -5504,16 +5504,7 @@ class ImgComponent {
5504
5504
  stroke-linejoin="round"
5505
5505
  opacity="0.4"
5506
5506
  />
5507
- <path
5508
- d="M12 2L13 5L11 8L14 12L12 16L13 22"
5509
- stroke="currentColor"
5510
- stroke-width="1.5"
5511
- stroke-linecap="round"
5512
- stroke-linejoin="round"
5513
- class="m-img__crack"
5514
- />
5515
5507
  </svg>
5516
- <span class="m-img__error-text">{{ 'failed-to-load-image' | translate }}</span>
5517
5508
  </div>
5518
5509
  } @else if (effectiveSrc()) {
5519
5510
  <div class="m-img__wrapper">
@@ -5568,16 +5559,13 @@ class ImgComponent {
5568
5559
  </div>
5569
5560
  }
5570
5561
  </div>
5571
- `, 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:block;width:100%;max-width:100%;overflow:hidden;border-radius:inherit;contain:paint}:host.m-img-host--fill{height:100%}.m-img{position:relative;width:100%;background:#ffffff05;border-radius:inherit;transition:transform .6s cubic-bezier(.2,0,.2,1);display:flex;flex-direction:column}.m-img--fill,.m-img--sized{height:100%}.m-img--error{height:auto;min-height:12rem;background:#0003}.m-img__wrapper{position:relative;width:100%;overflow:hidden;border-radius:inherit}.m-img--fill .m-img__wrapper,.m-img--sized .m-img__wrapper{height:100%}.m-img__img{display:block;width:100%;opacity:0;transform:scale(1.05) translateZ(0);filter:blur(10px) brightness(.8);transition:opacity 1.2s cubic-bezier(.4,0,.2,1),transform 1.2s cubic-bezier(.2,0,.2,1),filter 1s ease-out}.m-img--fill .m-img__img,.m-img--sized .m-img__img{height:100%;object-fit:cover}.m-img__img:not(.m-img--fill *):not(.m-img--sized *){height:auto}.m-img--loaded .m-img__img,.m-img--priority .m-img__img{opacity:1;transform:scale(1) translateZ(0);filter:blur(0) brightness(1)}.m-img__skeleton{position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(90deg,#fff0,#ffffff0d,#fff0);background-size:200% 100%;animation:shimmer 2s infinite linear,pulse 2.5s infinite ease-in-out;border-radius:inherit}.m-img__fallback{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;height:100%;min-height:12rem;background:#14141499;backdrop-filter:blur(12px) brightness(1.1);-webkit-backdrop-filter:blur(12px) brightness(1.1);background-color:var(--m-backdrop-frosted);border:1px solid rgba(255,255,255,.1);color:#fff9;gap:1.25rem;padding:2.5rem;border-radius:inherit;text-align:center;position:relative;z-index:1}.m-img__fallback svg{width:56px;height:56px;stroke:currentColor;stroke-width:1.5;opacity:.8;filter:drop-shadow(0 0 15px rgba(255,255,255,.2));animation:icon-float 4s infinite ease-in-out}.m-img__fallback .m-img__crack{stroke-dasharray:100;stroke-dashoffset:100;animation:crack-draw 1.5s cubic-bezier(.4,0,.2,1) forwards,crack-glitch 6s infinite 3s}.m-img__error-text{font-size:.7rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;opacity:.5;margin-top:-.5rem}@media(hover:hover){.m-img:hover .m-img__img{transform:scale(1.04) translateZ(0);transition-duration:2s}}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.4}}@keyframes icon-float{0%,to{transform:translateY(0) rotate(0)}50%{transform:translateY(-8px) rotate(-2deg)}}@keyframes crack-draw{to{stroke-dashoffset:0}}@keyframes crack-glitch{0%,80%,to{opacity:1;transform:translate(0)}82%{opacity:.4;transform:translate(-2px,1px)}84%{opacity:.8;transform:translate(2px,-1px)}86%{opacity:.2;transform:translate(-3px,2px)}88%{opacity:.6;transform:translate(1px,-2px)}}\n"], dependencies: [{ kind: "directive", type: NgOptimizedImage, selector: "img[ngSrc]", inputs: ["ngSrc", "ngSrcset", "sizes", "width", "height", "decoding", "loading", "priority", "loaderParams", "disableOptimizedSrcset", "fill", "placeholder", "placeholderConfig", "src", "srcset"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
5562
+ `, isInline: true, styles: [":host{display:block;width:100%;height:100%;max-width:100%;overflow:hidden;border-radius:inherit;contain:paint}.m-img{position:relative;width:100%;height:100%;background:#ffffff05;border-radius:inherit;transition:transform .6s cubic-bezier(.2,0,.2,1);display:flex;flex-direction:column}.m-img--error{background:#0003}.m-img__wrapper{position:relative;width:100%;height:100%;overflow:hidden;border-radius:inherit}.m-img__img{display:block;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.05) translateZ(0);filter:blur(10px) brightness(.8);transition:opacity 1.2s cubic-bezier(.4,0,.2,1),transform 1.2s cubic-bezier(.2,0,.2,1),filter 1s ease-out}.m-img--loaded .m-img__img,.m-img--priority .m-img__img{opacity:1;transform:scale(1) translateZ(0);filter:blur(0) brightness(1)}.m-img__skeleton{position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(90deg,#fff0,#ffffff0d,#fff0);background-size:200% 100%;animation:shimmer 2s infinite linear,pulse 2.5s infinite ease-in-out;border-radius:inherit}.m-img__fallback{display:flex;align-items:center;justify-content:center;width:100%;height:100%;color:#ffffff80;border-radius:inherit}.m-img__fallback svg{width:clamp(1.5rem,20%,3.5rem);height:auto;aspect-ratio:1;stroke:currentColor;stroke-width:1.5;opacity:.8}@media(hover:hover){.m-img:hover .m-img__img{transform:scale(1.04) translateZ(0);transition-duration:2s}}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.4}}\n"], dependencies: [{ kind: "directive", type: NgOptimizedImage, selector: "img[ngSrc]", inputs: ["ngSrc", "ngSrcset", "sizes", "width", "height", "decoding", "loading", "priority", "loaderParams", "disableOptimizedSrcset", "fill", "placeholder", "placeholderConfig", "src", "srcset"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
5572
5563
  }
5573
5564
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: ImgComponent, decorators: [{
5574
5565
  type: Component,
5575
- args: [{ selector: 'm-img', changeDetection: ChangeDetectionStrategy.OnPush, imports: [NgOptimizedImage, TranslatePipe], host: {
5576
- '[class.m-img-host--fill]': 'fill()',
5577
- // The figures decide the box, not just the ratio NgOptimizedImage reserves
5578
- // it with — a caller that names them means that size. Only a caller that
5579
- // names them: unset, they keep serving the reservation alone, which is
5580
- // what every picture that takes its size from its column relies on.
5566
+ args: [{ selector: 'm-img', changeDetection: ChangeDetectionStrategy.OnPush, imports: [NgOptimizedImage], host: {
5567
+ // The box is the container's: 100% wide and tall unless a caller names
5568
+ // width/height figures, which land as inline px on this element.
5581
5569
  '[style.width.px]': 'boxWidth()',
5582
5570
  '[style.height.px]': 'boxHeight()',
5583
5571
  }, providers: [
@@ -5604,7 +5592,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
5604
5592
  [class.m-img--sized]="isSized()"
5605
5593
  >
5606
5594
  @if (hasError()) {
5607
- <div class="m-img__fallback" [attr.aria-label]="alt()">
5595
+ <div class="m-img__fallback" role="img" [attr.aria-label]="alt()">
5608
5596
  <svg
5609
5597
  viewBox="0 0 24 24"
5610
5598
  fill="none"
@@ -5638,16 +5626,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
5638
5626
  stroke-linejoin="round"
5639
5627
  opacity="0.4"
5640
5628
  />
5641
- <path
5642
- d="M12 2L13 5L11 8L14 12L12 16L13 22"
5643
- stroke="currentColor"
5644
- stroke-width="1.5"
5645
- stroke-linecap="round"
5646
- stroke-linejoin="round"
5647
- class="m-img__crack"
5648
- />
5649
5629
  </svg>
5650
- <span class="m-img__error-text">{{ 'failed-to-load-image' | translate }}</span>
5651
5630
  </div>
5652
5631
  } @else if (effectiveSrc()) {
5653
5632
  <div class="m-img__wrapper">
@@ -5702,7 +5681,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
5702
5681
  </div>
5703
5682
  }
5704
5683
  </div>
5705
- `, 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:block;width:100%;max-width:100%;overflow:hidden;border-radius:inherit;contain:paint}:host.m-img-host--fill{height:100%}.m-img{position:relative;width:100%;background:#ffffff05;border-radius:inherit;transition:transform .6s cubic-bezier(.2,0,.2,1);display:flex;flex-direction:column}.m-img--fill,.m-img--sized{height:100%}.m-img--error{height:auto;min-height:12rem;background:#0003}.m-img__wrapper{position:relative;width:100%;overflow:hidden;border-radius:inherit}.m-img--fill .m-img__wrapper,.m-img--sized .m-img__wrapper{height:100%}.m-img__img{display:block;width:100%;opacity:0;transform:scale(1.05) translateZ(0);filter:blur(10px) brightness(.8);transition:opacity 1.2s cubic-bezier(.4,0,.2,1),transform 1.2s cubic-bezier(.2,0,.2,1),filter 1s ease-out}.m-img--fill .m-img__img,.m-img--sized .m-img__img{height:100%;object-fit:cover}.m-img__img:not(.m-img--fill *):not(.m-img--sized *){height:auto}.m-img--loaded .m-img__img,.m-img--priority .m-img__img{opacity:1;transform:scale(1) translateZ(0);filter:blur(0) brightness(1)}.m-img__skeleton{position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(90deg,#fff0,#ffffff0d,#fff0);background-size:200% 100%;animation:shimmer 2s infinite linear,pulse 2.5s infinite ease-in-out;border-radius:inherit}.m-img__fallback{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;height:100%;min-height:12rem;background:#14141499;backdrop-filter:blur(12px) brightness(1.1);-webkit-backdrop-filter:blur(12px) brightness(1.1);background-color:var(--m-backdrop-frosted);border:1px solid rgba(255,255,255,.1);color:#fff9;gap:1.25rem;padding:2.5rem;border-radius:inherit;text-align:center;position:relative;z-index:1}.m-img__fallback svg{width:56px;height:56px;stroke:currentColor;stroke-width:1.5;opacity:.8;filter:drop-shadow(0 0 15px rgba(255,255,255,.2));animation:icon-float 4s infinite ease-in-out}.m-img__fallback .m-img__crack{stroke-dasharray:100;stroke-dashoffset:100;animation:crack-draw 1.5s cubic-bezier(.4,0,.2,1) forwards,crack-glitch 6s infinite 3s}.m-img__error-text{font-size:.7rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;opacity:.5;margin-top:-.5rem}@media(hover:hover){.m-img:hover .m-img__img{transform:scale(1.04) translateZ(0);transition-duration:2s}}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.4}}@keyframes icon-float{0%,to{transform:translateY(0) rotate(0)}50%{transform:translateY(-8px) rotate(-2deg)}}@keyframes crack-draw{to{stroke-dashoffset:0}}@keyframes crack-glitch{0%,80%,to{opacity:1;transform:translate(0)}82%{opacity:.4;transform:translate(-2px,1px)}84%{opacity:.8;transform:translate(2px,-1px)}86%{opacity:.2;transform:translate(-3px,2px)}88%{opacity:.6;transform:translate(1px,-2px)}}\n"] }]
5684
+ `, styles: [":host{display:block;width:100%;height:100%;max-width:100%;overflow:hidden;border-radius:inherit;contain:paint}.m-img{position:relative;width:100%;height:100%;background:#ffffff05;border-radius:inherit;transition:transform .6s cubic-bezier(.2,0,.2,1);display:flex;flex-direction:column}.m-img--error{background:#0003}.m-img__wrapper{position:relative;width:100%;height:100%;overflow:hidden;border-radius:inherit}.m-img__img{display:block;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.05) translateZ(0);filter:blur(10px) brightness(.8);transition:opacity 1.2s cubic-bezier(.4,0,.2,1),transform 1.2s cubic-bezier(.2,0,.2,1),filter 1s ease-out}.m-img--loaded .m-img__img,.m-img--priority .m-img__img{opacity:1;transform:scale(1) translateZ(0);filter:blur(0) brightness(1)}.m-img__skeleton{position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(90deg,#fff0,#ffffff0d,#fff0);background-size:200% 100%;animation:shimmer 2s infinite linear,pulse 2.5s infinite ease-in-out;border-radius:inherit}.m-img__fallback{display:flex;align-items:center;justify-content:center;width:100%;height:100%;color:#ffffff80;border-radius:inherit}.m-img__fallback svg{width:clamp(1.5rem,20%,3.5rem);height:auto;aspect-ratio:1;stroke:currentColor;stroke-width:1.5;opacity:.8}@media(hover:hover){.m-img:hover .m-img__img{transform:scale(1.04) translateZ(0);transition-duration:2s}}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.4}}\n"] }]
5706
5685
  }], ctorParameters: () => [], propDecorators: { src: [{ type: i0.Input, args: [{ isSignal: true, alias: "src", required: false }] }], data: [{ type: i0.Input, args: [{ isSignal: true, alias: "data", required: false }] }], dataType: [{ type: i0.Input, args: [{ isSignal: true, alias: "dataType", required: false }] }], alt: [{ type: i0.Input, args: [{ isSignal: true, alias: "alt", required: true }] }], priority: [{ type: i0.Input, args: [{ isSignal: true, alias: "priority", required: false }] }], fill: [{ type: i0.Input, args: [{ isSignal: true, alias: "fill", required: false }] }], width: [{ type: i0.Input, args: [{ isSignal: true, alias: "width", required: false }] }], height: [{ type: i0.Input, args: [{ isSignal: true, alias: "height", required: false }] }], remote: [{ type: i0.Input, args: [{ isSignal: true, alias: "remote", required: false }] }], ngSrcset: [{ type: i0.Input, args: [{ isSignal: true, alias: "ngSrcset", required: false }] }], sizes: [{ type: i0.Input, args: [{ isSignal: true, alias: "sizes", required: false }] }] } });
5707
5686
 
5708
5687
  const SECTION_FORM_CONTEXT = new InjectionToken('SECTION_FORM_CONTEXT');
@@ -6533,7 +6512,7 @@ class SectionFormItemComponent extends ConfigComponent {
6533
6512
  break;
6534
6513
  }
6535
6514
  case InputType.TOGGLE: {
6536
- const { ToggleInputComponent } = await import('./magmonium-one-toggle-va8TrumU.mjs');
6515
+ const { ToggleInputComponent } = await import('./magmonium-one-toggle-DV8ZrcIu.mjs');
6537
6516
  this.createDynamicComponent(seq, ToggleInputComponent, [], true);
6538
6517
  break;
6539
6518
  }
@@ -6545,12 +6524,12 @@ class SectionFormItemComponent extends ConfigComponent {
6545
6524
  break;
6546
6525
  }
6547
6526
  case InputType.PASSWORD: {
6548
- const { PasswordInputComponent } = await import('./magmonium-one-password-BBDHGlXa.mjs');
6527
+ const { PasswordInputComponent } = await import('./magmonium-one-password-ByXNWyk4.mjs');
6549
6528
  this.createDynamicComponent(seq, PasswordInputComponent);
6550
6529
  break;
6551
6530
  }
6552
6531
  case InputType.OTP: {
6553
- const { OtpInputComponent } = await import('./magmonium-one-otp-Ee5Z04t5.mjs');
6532
+ const { OtpInputComponent } = await import('./magmonium-one-otp-APADBAsq.mjs');
6554
6533
  this.createDynamicComponent(seq, OtpInputComponent);
6555
6534
  break;
6556
6535
  }
@@ -8849,6 +8828,10 @@ class ActionComponent extends ButtonGroupComponent {
8849
8828
  // opens on its first option, and `primary` still speaks for a bar that is a
8850
8829
  // row of commands.
8851
8830
  pressed = signal(undefined, ...(ngDevMode ? [{ debugName: "pressed" }] : /* istanbul ignore next */ []));
8831
+ // The default already announced, by name: the guard that keeps a Buttons
8832
+ // list re-resolving behind the same names from re-firing the announcement,
8833
+ // while still letting a genuinely different first Button be heard.
8834
+ announcedDefault = signal(undefined, ...(ngDevMode ? [{ debugName: "announcedDefault" }] : /* istanbul ignore next */ []));
8852
8835
  selected = computed(() => {
8853
8836
  const buttons = this.actionButtons();
8854
8837
  if (this.resolvedVariant() !== 'toggle')
@@ -9012,6 +8995,12 @@ class ActionComponent extends ButtonGroupComponent {
9012
8995
  actionButtons = computed(() => this.actionButtonsResource.value() ?? this.mergedButtons(), ...(ngDevMode ? [{ debugName: "actionButtons" }] : /* istanbul ignore next */ []));
9013
8996
  constructor() {
9014
8997
  super();
8998
+ // A toggle's default is state, not decoration: `clicked` is the only
8999
+ // channel a consumer has for which Button is lit, so a bar that lights its
9000
+ // first option on load while staying silent about it leaves the consumer
9001
+ // guessing what the light already says. The default therefore announces
9002
+ // itself — and stops once a press takes over, a press announcing itself.
9003
+ effect(this.announceDefault);
9015
9004
  afterNextRender(() => {
9016
9005
  // No squeeze without a measurement, and no measurement without the
9017
9006
  // observer — a bar rendered where there is none (SSR, jsdom) stays the
@@ -9032,6 +9021,27 @@ class ActionComponent extends ButtonGroupComponent {
9032
9021
  this.destroyRef.onDestroy(() => observer.disconnect());
9033
9022
  });
9034
9023
  }
9024
+ // Declared as a field and handed to `effect` in the constructor, matching how
9025
+ // the parent group registers `updateProperty`. An effect rather than
9026
+ // `afterNextRender`: the default is only known once the Buttons have
9027
+ // resolved, and they resolve asynchronously.
9028
+ announceDefault = () => {
9029
+ if (this.resolvedVariant() !== 'toggle')
9030
+ return;
9031
+ // A press announces itself through `select`; this speaks only for defaults.
9032
+ if (this.pressed() !== undefined)
9033
+ return;
9034
+ const name = this.selected();
9035
+ if (!name || name === this.announcedDefault())
9036
+ return;
9037
+ const button = this.actionButtons().find((b) => b.name === name);
9038
+ if (!button)
9039
+ return;
9040
+ // Set before the emit, so a handler that reaches back into this bar during
9041
+ // the announcement cannot make it announce twice.
9042
+ this.announcedDefault.set(name);
9043
+ this.clicked.emit(button);
9044
+ };
9035
9045
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: ActionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
9036
9046
  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 [class.m-action--icon-only]=\"activeSqueeze() === 'icon'\"\n >\n @for (button of visibleButtons(); track $index) {\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 [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 @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 </button>\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", 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;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--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--icon-only .m-action__btn{padding:1rem .5rem;gap:0}.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: "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"], outputs: ["toggleChange", "action"] }, { kind: "pipe", type: i0.forwardRef(() => TranslatePipe), name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
9037
9047
  }
@@ -17940,7 +17950,7 @@ class WrapperInputComponent extends ConfigComponent {
17940
17950
  break;
17941
17951
  }
17942
17952
  case InputType.TOGGLE: {
17943
- const { ToggleInputComponent } = await import('./magmonium-one-toggle-va8TrumU.mjs');
17953
+ const { ToggleInputComponent } = await import('./magmonium-one-toggle-DV8ZrcIu.mjs');
17944
17954
  this.createDynamicComponent(seq, ToggleInputComponent, [], true);
17945
17955
  break;
17946
17956
  }
@@ -17952,12 +17962,12 @@ class WrapperInputComponent extends ConfigComponent {
17952
17962
  break;
17953
17963
  }
17954
17964
  case InputType.PASSWORD: {
17955
- const { PasswordInputComponent } = await import('./magmonium-one-password-BBDHGlXa.mjs');
17965
+ const { PasswordInputComponent } = await import('./magmonium-one-password-ByXNWyk4.mjs');
17956
17966
  this.createDynamicComponent(seq, PasswordInputComponent);
17957
17967
  break;
17958
17968
  }
17959
17969
  case InputType.OTP: {
17960
- const { OtpInputComponent } = await import('./magmonium-one-otp-Ee5Z04t5.mjs');
17970
+ const { OtpInputComponent } = await import('./magmonium-one-otp-APADBAsq.mjs');
17961
17971
  this.createDynamicComponent(seq, OtpInputComponent);
17962
17972
  break;
17963
17973
  }
@@ -32290,4 +32300,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
32290
32300
  */
32291
32301
 
32292
32302
  export { DateInputComponent 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_SIZE as Z, DashboardCardComponent as _, BaseTextInputComponent as a, NavComponent as a$, DatePickerComponent as a0, DeviceService as a1, DomService as a2, Domain as a3, DotGridComponent as a4, DragListDirective as a5, DragListItemDirective as a6, DraggableDirective as a7, DropdownInputComponent as a8, FLEX_VARIANTS as a9, LOGIN_STORE as aA, LanguageComponent as aB, LogoComponent as aC, MAG_SOCKET_EVENT as aD, MHeroColorDirective as aE, MHeroComponent as aF, MODAL_REF as aG, MODAL_STORE_REF as aH, MRefDirective as aI, MStepComponent as aJ, MURL_PARAM as aK, MURL_SEP as aL, ManifestEnrichmentService as aM, MenuComponent as aN, ModalDirective as aO, ModalRef as aP, ModalStore as aQ, MoneyPipe as aR, MultiRangeInputComponent as aS, MurlUrlSerializer as aT, NAV_DEFAULT_MURL as aU, NAV_ID_SEP as aV, NAV_MAIN_BUTTONS as aW, NAV_SEGMENT_RE as aX, NAV_STORE_REF as aY, NAV_WC_COMPONENTS as aZ, NAV_WIDGET_MAP as a_, FOLDER_PICK_LISTENER as aa, FORM_ASSET_FOLDER as ab, FileService as ac, FileUploadDirective as ad, FileUploadInputComponent as ae, FlexComponent as af, FlexItemComponent as ag, FormGroupComponent as ah, FrameComponent as ai, FreezeService as aj, GRID_BREAKPOINTS as ak, GetNavService as al, HeaderComponent$1 as am, HighlightDirective as an, HttpService as ao, ICON_SOURCE as ap, IS_SIDE_PANEL as aq, IconComponent as ar, ImgComponent as as, InputType as at, InstrumentScoreComponent as au, InterceptorObservables as av, JumbotronComponent as aw, KeyValueComponent as ax, LAYOUT_ASSET_FOLDER as ay, LOGIN_COMPONENT as az, TextOutputComponent as b, SectionFooterComponent as b$, NavDetailsComponent as b0, NavHeaderComponent as b1, NavMenuComponent as b2, NavStore as b3, NavTrailComponent as b4, NothingComponent as b5, NotificationElementComponent as b6, NotificationGroupComponent as b7, NotificationPopupComponent as b8, NotificationService as b9, ReactiveElementComponent as bA, RemoteComponent as bB, RemoteLoaderService as bC, ResizeElementComponent as bD, RouteContainer as bE, RowComponent as bF, SEARCH_QUERY as bG, SEARCH_RESULTS_EVENT as bH, SECTION_ACCORDION_GROUP as bI, SECTION_FORM_CONTEXT as bJ, SHARED_ICONS as bK, SIZE_CONTEXT as bL, ScoreComponent as bM, ScrollComponent as bN, ScrollService as bO, SearchPanelComponent as bP, SearchStore as bQ, SearchUserPanelComponent as bR, SectionAccordionDirective as bS, SectionAccordionGroupDirective as bT, SectionBackComponent as bU, SectionBadgesComponent as bV, SectionButtonGroupComponent as bW, SectionCardComponent as bX, SectionCarouselComponent as bY, SectionComponent as bZ, SectionFilterComponent as b_, NotificationStore as ba, NotificationType as bb, NotificationWidgetComponent as bc, ONE_ASSET_BASE_URL as bd, OPTIONS_SOURCE as be, OVERLAY_WIDGETS as bf, OneApp as bg, OptionsSourceDirective as bh, OverlayBodyComponent as bi, OverlayRef as bj, OverlayService as bk, PLATFORM_BUTTON_NAV_IDS as bl, PLATFORM_EXTENSIBLE_NAV_IDS as bm, PLATFORM_NAV_MAP as bn, PLATFORM_ROOT_CHILDREN as bo, PaginationComponent as bp, PanelComponent as bq, PercentagePipe as br, PlaygroundComponent as bs, PositionDirective as bt, PwaInstallComponent as bu, ROOT_NAV$1 as bv, RadioGroupComponent as bw, RadioInputComponent as bx, RangeInputComponent as by, RatingInputComponent as bz, ButtonComponent as c, WIN_USER_TAB_KEY as c$, SectionFormComponent as c0, SectionFormItemComponent as c1, SectionHeaderComponent as c2, SectionHeroComponent as c3, SectionSearchComponent as c4, SectionStepperComponent as c5, SectionTabsComponent as c6, SectionToggleComponent as c7, SectionToggleItemDirective as c8, SelectableCardInputComponent as c9, ThemeComponent as cA, ThemeDataService as cB, ThemeService as cC, ThemeStore as cD, TimeAgoPipe as cE, TimelineComponent as cF, ToggleButtonComponent as cG, ToggleInputComponent as cH, ToggleRadioInputComponent as cI, ToolTipDirective as cJ, TooltipComponent as cK, TranslateService as cL, TreeGridComponent as cM, URL_SEP as cN, USER_STORE_REF as cO, USER_TAB_MAP as cP, UlComponent as cQ, UniverseComponent as cR, UserApiService as cS, UserAvatarComponent as cT, UserComponent as cU, UserNavComponent as cV, UserSettingsComponent as cW, UserStore as cX, WC_ROUTE_CHANGED_EVENT as cY, WC_SEARCH_GROUPS as cZ, WIN_USER_TAB_HOOK as c_, SelectorDirective as ca, SettingsSearchBarComponent as cb, SettingsSearchService as cc, ShapeComponent as cd, SharedStoreRegistry as ce, SidePanelDirective as cf, Size as cg, SocketStore as ch, SortComponent as ci, StatComponent as cj, StepComponent as ck, StepperComponent as cl, StepsComponent as cm, StorageService as cn, StrokeLinecap as co, StrokeLinejoin as cp, SummaryComponent as cq, SvgGeneratorComponent as cr, SvgGeneratorService as cs, SvgService as ct, TOTAL_COLUMNS as cu, TRANSLATION_SOURCE as cv, TableComponent as cw, TechnicalMeterComponent as cx, TextInputComponent as cy, TextareaInputComponent as cz, APP_CONTEXT_REF as d, linkToId as d$, WatermarkComponent as d0, WcRouterStore as d1, WrapperInputComponent as d2, anchorNavId as d3, applyColorsToElement as d4, bootstrapMagApp as d5, bootstrapPwaInstall as d6, buildWcBaseUrl as d7, calculateLuminance as d8, calculateRanks as d9, getTreeGridRow as dA, getUniqueId as dB, getValue as dC, hasErrorComputed as dD, hexToRgb as dE, hslToRgb$1 as dF, initMagmoniumApp as dG, initialNotificationState as dH, initialState$2 as dI, initials as dJ, injectAuthenticate as dK, injectInstallApp as dL, injectParentSize as dM, injectScrollSticky as dN, isButtonName as dO, isCancelledComputed as dP, isExtensiblePlatformNavId as dQ, isJson as dR, isLoadingComputed as dS, isLocalhost as dT, isPlatformNavId as dU, isSize as dV, isTierPreview as dW, isUrlLocalhost as dX, isValidNavId as dY, isValidNavSegment as dZ, isWebComponent as d_, cellText as da, checkFilterCondition as db, childNavId as dc, classListSignal as dd, coerceSize as de, cornerEdge as df, cornerSide as dg, createMap as dh, createPlatformNavMap as di, deriveAvatarGradient as dj, deriveContrastColor as dk, deriveOppositeColor as dl, derivePropertyName as dm, emailValidation as dn, evaluate as dp, evaluateBool as dq, flattenTreeGridRows as dr, formatBadgeCount as ds, fullName as dt, generateClipPath as du, generateTransform as dv, getClassList as dw, getProperty as dx, getScrollParent as dy, getTierFromPreviewPath as dz, ASSET_BASE_URL as e, toAttrNumber as e$, linkToNav as e0, loadingActions as e1, mInterceptor as e2, manualValidation as e3, matchFieldValidation as e4, maxLengthValidation as e5, maxValidation as e6, mergePlatformNav as e7, mergeUnique as e8, mergeUniqueBy as e9, provideNavWidgets as eA, provideOverlayWidgets as eB, providePlatformNavWidgets as eC, provideSearch as eD, provideSizeContext as eE, provideUserTabs as eF, publicGuard as eG, readFieldPatterns as eH, renderAddress as eI, requiredValidation as eJ, resolveConfigAsset as eK, resolveIconSize as eL, resolvePallet as eM, resolvePatternRules as eN, resolveSize as eO, rgbToHex as eP, rgbToHsl as eQ, rowHasChildren as eR, samePatterns as eS, segmentsToNavId as eT, setProperty as eU, setTreeGridChildren as eV, settingsWidgets as eW, shouldShowBadge as eX, splitNavId as eY, stringToColor as eZ, toAttrBool as e_, mergeUniqueWith as ea, minAgeValidation as eb, minLengthValidation as ec, minValidation as ed, miniMarkToHtml as ee, navIdChain as ef, navIdFor as eg, navIdSegment as eh, navIdToRoutePath as ei, navIdToSegments as ej, navToId as ek, parentNavId as el, parseAddress as em, parseColor as en, parsePatternNames as eo, patternValidation as ep, patternsValidation as eq, platformNavWidgets as er, privateGuard as es, processImageToSvg as et, provideAppContext as eu, provideMagAppConfig as ev, provideMagWcConfig as ew, provideMagWcRoutes as ex, provideModalComponents as ey, provideMurlUrlSerializer as ez, AccordionBodyDirective as f, toCssLength as f0, toHostNavId as f1, toLength$1 as f2, toLocalNavId as f3, toggleTreeGridRow as f4, unfetchedPlatformNav as f5, urlValidation as f6, 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 };
32293
- //# sourceMappingURL=magmonium-one-magmonium-one-yNHWPewC.mjs.map
32303
+ //# sourceMappingURL=magmonium-one-magmonium-one-BXY0lmeR.mjs.map