@magmonium/one 0.4.102 → 0.4.103

package/fesm2022/{magmonium-one-text-output-DiA4R1pw.mjs.map → magmonium-one-text-output-DP06NTMe.mjs.map}

@@ -1 +1 @@
-{"version":3,"file":"magmonium-one-text-output-DiA4R1pw.mjs","names":[],"sources":["../../../../libs/one/src/lib/shared/ui/text-output/ui/text-output.ts"],"sourcesContent":["import {\n  ChangeDetectionStrategy,\n  Component,\n  computed,\n  inject,\n  input,\n  model,\n  output,\n} from '@angular/core';\nimport { TranslateService } from '../../../services/translate';\nimport { ConfigComponent } from '../../../lib/components/config-component';\nimport { Config } from '../../../type/config/config-type';\nimport { LAYOUT_ASSET_FOLDER } from '../../../enum';\nimport { toAttrBool } from '../../../functions/config/attribute-value';\nimport { resolvePallet } from '../../../lib/theme/lib/color-utl';\n\nexport type TextOutputAlign = 'left' | 'right' | 'center';\n\n// Variants are roles, not styles: each one says what the text is doing on the\n// page, and the Section it sits in decides how big that role renders. Every\n// size below is therefore an `em` multiple of the inherited Section font-size\n// — a `lead` in a compact Section stays proportionally a lead — which is the\n// one rule the plain (undefined) variant keeps by inheriting outright.\n//\n// - `lead`     opening paragraph that introduces the block under it\n// - `big`      one-line statement — a number, a verdict, a headline that is\n//              not a SectionHeader\n// - `bold`     emphasis at body size, for the line that must be read first\n// - `footer`   annotation under the thing it describes — a field's validation\n//              message, a caption, a disclaimer; 0.75 of body, body colour\n// - `footnote` aside the reader may skip — source, legal line, small print;\n//              0.6 of body, body colour\n// - `link`       text that goes somewhere on click — an affordance rather than\n//                a size, so it is the one role that stays inline, takes focus,\n//                and emits `clicked`\n// - `link-small` the same affordance for a link that trails the content it\n//                belongs to rather than carrying a line of its own — a \"see\n//                all\", an \"edit\" beside a field; body size like `link`\nexport type TextOutputVariant =\n  | 'lead'\n  | 'big'\n  | 'bold'\n  | 'footer'\n  | 'footnote'\n  | 'link'\n  | 'link-small';\n\n// Weight tokens of the type scale. Applied after the variant, so it overrides\n// the weight a role implies (`lead` light, `big` semibold, `bold` bold).\nexport type TextOutputFontWeight =\n  | 'light'\n  | 'normal'\n  | 'medium'\n  | 'semibold'\n  | 'bold';\n\nexport interface TextOutputConfig extends Config {\n  label?: string;\n  noTranslate?: boolean;\n  align?: TextOutputAlign;\n  variant?: TextOutputVariant;\n  color?: string;\n  fontWeight?: TextOutputFontWeight;\n}\n\n@Component({\n  selector: 'm-text-output',\n  imports: [],\n  template: `\n    <div\n      class=\"m-text-output\"\n      [style.color]=\"resolvedColorPallet().color\"\n      [innerHTML]=\"html()\"\n    ></div>\n  `,\n  styleUrl: './text-output.sass',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  host: {\n    class: 'm-text-output-host',\n    '[class.is-design-mode]': 'isDesignMode',\n    '[class.align-left]': 'resolvedAlign() === \"left\"',\n    '[class.align-right]': 'resolvedAlign() === \"right\"',\n    '[class.align-center]': 'resolvedAlign() === \"center\"',\n    '[class.variant-lead]': 'resolvedVariant() === \"lead\"',\n    '[class.variant-big]': 'resolvedVariant() === \"big\"',\n    '[class.variant-bold]': 'resolvedVariant() === \"bold\"',\n    '[class.variant-footer]': 'resolvedVariant() === \"footer\"',\n    '[class.variant-footnote]': 'resolvedVariant() === \"footnote\"',\n    '[class.variant-link]': 'resolvedVariant() === \"link\"',\n    '[class.variant-link-small]': 'resolvedVariant() === \"link-small\"',\n    '[class.weight-light]': 'resolvedFontWeight() === \"light\"',\n    '[class.weight-normal]': 'resolvedFontWeight() === \"normal\"',\n    '[class.weight-medium]': 'resolvedFontWeight() === \"medium\"',\n    '[class.weight-semibold]': 'resolvedFontWeight() === \"semibold\"',\n    '[class.weight-bold]': 'resolvedFontWeight() === \"bold\"',\n    '[class.has-color]': '!!(color() ?? config()?.color)',\n    '[class.is-truncated]': '!!truncate()',\n    // Only a link is reachable and announced as one. Every other variant is a\n    // size, and a focus stop on plain text is a tab stop that does nothing.\n    '[attr.role]': 'isLink() ? \"link\" : null',\n    '[attr.tabindex]': 'isLink() ? 0 : null',\n    '(click)': 'onClick()',\n    '(keydown.enter)': 'onClick()',\n    '[style.--m-text-output-color]': 'resolvedColorPallet().color',\n    '[style.--m-text-output-color-contrast]': 'resolvedColorPallet().contrastColor',\n    '[style.--m-text-output-color-opposite]': 'resolvedColorPallet().oppositeColor',\n  },\n})\nexport class TextOutputComponent extends ConfigComponent<TextOutputConfig> {\n  override subFolder = LAYOUT_ASSET_FOLDER.text_output;\n  override config = model<Partial<TextOutputConfig>>();\n  private readonly translateService = inject(TranslateService);\n\n  readonly align = input<TextOutputAlign | undefined>(undefined);\n  readonly variant = input<TextOutputVariant | undefined>(undefined);\n  // A theme colour key (`error`, `warning`, `success`, …) or a raw CSS colour,\n  // resolved the same way an Icon's or a Logo's is so a token follows the\n  // active theme instead of freezing one theme's hex into a template.\n  readonly color = input<string | undefined>(undefined);\n  readonly fontWeight = input<TextOutputFontWeight | undefined>(undefined);\n  // `label` is the text itself, so a one-off TextOutput needs no asset behind\n  // it (ADR 0010). Numeric display values are stringified before entering the\n  // text and translation pipeline.\n  readonly label = input<string | number | undefined>(undefined);\n  readonly noTranslate = input<boolean | string | undefined>(undefined);\n  // Values for the message's `<name>` / `<$name>` placeholders. An input and\n  // deliberately not a TextOutputConfig key: an asset is resolved by name and\n  // shared across every Control that names it, and these differ per render\n  // (ADR 0020). The query-string form (`min_length?len=6`) still works and\n  // still loses to this on a shared placeholder, that being the precedence\n  // TranslateService already had. Bind a named member — an object literal in a\n  // template is refused by `no-inline-config` (ADR 0010).\n  readonly params = input<Record<string, string> | undefined>(undefined);\n  // One line, cut with an ellipsis at the box's edge rather than wrapping or\n  // spilling into a neighbour. For text whose length says nothing about the\n  // layout — a bound path drawn as `{store.a.b.c}` on the design Canvas.\n  readonly truncate = input<boolean | undefined>(undefined);\n\n  readonly resolvedAlign = computed<TextOutputAlign>(\n    () => this.align() ?? this.config()?.align ?? 'left'\n  );\n\n  protected readonly resolvedVariant = computed<TextOutputVariant | undefined>(\n    () => this.variant() ?? this.config()?.variant\n  );\n\n  protected readonly resolvedFontWeight = computed<\n    TextOutputFontWeight | undefined\n  >(() => this.fontWeight() ?? this.config()?.fontWeight);\n\n  // Both link roles are the same affordance, so both take the focus stop, the\n  // `role=\"link\"` and the `clicked` output; only their size differs.\n  protected readonly isLink = computed(() => {\n    const variant = this.resolvedVariant();\n    return variant === 'link' || variant === 'link-small';\n  });\n\n  /**\n   * Fired by a `link` variant and by nothing else. A text that is not a link\n   * draws no affordance and takes no focus, so a click on it is a click on\n   * prose — emitting there would be a control only a mouse could find.\n   *\n   * Where the link goes to a route instead, the caller attaches `routerLink`\n   * and binds nothing here: one click means one thing.\n   */\n  readonly clicked = output<void>();\n\n  protected onClick(): void {\n    if (this.isLink()) this.clicked.emit();\n  }\n\n  protected readonly resolvedColorPallet = computed(() =>\n    resolvePallet(\n      this.color() ?? this.config()?.color ?? this.defaultColor,\n      this.themeStore.color()\n    )\n  );\n\n  protected override resolveComponentOverrides(): Partial<TextOutputConfig> {\n    const overrides: Partial<TextOutputConfig> = {};\n    const align = this.align();\n    if (align !== undefined) overrides.align = align;\n    const label = this.label();\n    if (label !== undefined) overrides.label = String(label);\n    const noTranslate = toAttrBool(this.noTranslate());\n    if (noTranslate !== undefined) overrides.noTranslate = noTranslate;\n    const variant = this.variant();\n    if (variant !== undefined) overrides.variant = variant;\n    const color = this.color();\n    if (color !== undefined) overrides.color = color;\n    const fontWeight = this.fontWeight();\n    if (fontWeight !== undefined) overrides.fontWeight = fontWeight;\n    return overrides;\n  }\n\n  protected readonly resolvedLabel = computed(() => this.config()?.label);\n  protected readonly shouldTranslate = computed(\n    () => !this.config()?.noTranslate\n  );\n  protected readonly html = computed(() => {\n    const label = this.resolvedLabel();\n    return this.shouldTranslate()\n      ? this.translateService.translateToHtml(label, this.params())\n      : this.translateService.toSafeHtml(label);\n  });\n}\n"],"mappings":"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"}
+{"version":3,"file":"magmonium-one-text-output-DP06NTMe.mjs","names":[],"sources":["../../../../libs/one/src/lib/shared/ui/text-output/ui/text-output.ts"],"sourcesContent":["import {\n  ChangeDetectionStrategy,\n  Component,\n  computed,\n  inject,\n  input,\n  model,\n  output,\n} from '@angular/core';\nimport { TranslateService } from '../../../services/translate';\nimport { ConfigComponent } from '../../../lib/components/config-component';\nimport { Config } from '../../../type/config/config-type';\nimport { LAYOUT_ASSET_FOLDER } from '../../../enum';\nimport { toAttrBool } from '../../../functions/config/attribute-value';\nimport { resolvePallet } from '../../../lib/theme/lib/color-utl';\n\nexport type TextOutputAlign = 'left' | 'right' | 'center';\n\n// Variants are roles, not styles: each one says what the text is doing on the\n// page, and the Section it sits in decides how big that role renders. Every\n// size below is therefore an `em` multiple of the inherited Section font-size\n// — a `lead` in a compact Section stays proportionally a lead — which is the\n// one rule the plain (undefined) variant keeps by inheriting outright.\n//\n// - `lead`     opening paragraph that introduces the block under it\n// - `big`      one-line statement — a number, a verdict, a headline that is\n//              not a SectionHeader\n// - `bold`     emphasis at body size, for the line that must be read first\n// - `footer`   annotation under the thing it describes — a field's validation\n//              message, a caption, a disclaimer; 0.75 of body, body colour\n// - `footnote` aside the reader may skip — source, legal line, small print;\n//              0.6 of body, body colour\n// - `link`       text that goes somewhere on click — an affordance rather than\n//                a size, so it is the one role that stays inline, takes focus,\n//                and emits `clicked`\n// - `link-small` the same affordance for a link that trails the content it\n//                belongs to rather than carrying a line of its own — a \"see\n//                all\", an \"edit\" beside a field; body size like `link`\nexport type TextOutputVariant =\n  | 'lead'\n  | 'big'\n  | 'bold'\n  | 'footer'\n  | 'footnote'\n  | 'link'\n  | 'link-small';\n\n// Weight tokens of the type scale. Applied after the variant, so it overrides\n// the weight a role implies (`lead` light, `big` semibold, `bold` bold).\nexport type TextOutputFontWeight =\n  | 'light'\n  | 'normal'\n  | 'medium'\n  | 'semibold'\n  | 'bold';\n\nexport interface TextOutputConfig extends Config {\n  label?: string;\n  noTranslate?: boolean;\n  align?: TextOutputAlign;\n  variant?: TextOutputVariant;\n  color?: string;\n  fontWeight?: TextOutputFontWeight;\n}\n\n@Component({\n  selector: 'm-text-output',\n  imports: [],\n  template: `\n    <div\n      class=\"m-text-output\"\n      [style.color]=\"resolvedColorPallet().color\"\n      [innerHTML]=\"html()\"\n    ></div>\n  `,\n  styleUrl: './text-output.sass',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  host: {\n    class: 'm-text-output-host',\n    '[class.is-design-mode]': 'isDesignMode',\n    '[class.align-left]': 'resolvedAlign() === \"left\"',\n    '[class.align-right]': 'resolvedAlign() === \"right\"',\n    '[class.align-center]': 'resolvedAlign() === \"center\"',\n    '[class.variant-lead]': 'resolvedVariant() === \"lead\"',\n    '[class.variant-big]': 'resolvedVariant() === \"big\"',\n    '[class.variant-bold]': 'resolvedVariant() === \"bold\"',\n    '[class.variant-footer]': 'resolvedVariant() === \"footer\"',\n    '[class.variant-footnote]': 'resolvedVariant() === \"footnote\"',\n    '[class.variant-link]': 'resolvedVariant() === \"link\"',\n    '[class.variant-link-small]': 'resolvedVariant() === \"link-small\"',\n    '[class.weight-light]': 'resolvedFontWeight() === \"light\"',\n    '[class.weight-normal]': 'resolvedFontWeight() === \"normal\"',\n    '[class.weight-medium]': 'resolvedFontWeight() === \"medium\"',\n    '[class.weight-semibold]': 'resolvedFontWeight() === \"semibold\"',\n    '[class.weight-bold]': 'resolvedFontWeight() === \"bold\"',\n    '[class.has-color]': '!!(color() ?? config()?.color)',\n    '[class.is-truncated]': '!!truncate()',\n    // Only a link is reachable and announced as one. Every other variant is a\n    // size, and a focus stop on plain text is a tab stop that does nothing.\n    '[attr.role]': 'isLink() ? \"link\" : null',\n    '[attr.tabindex]': 'isLink() ? 0 : null',\n    '(click)': 'onClick()',\n    '(keydown.enter)': 'onClick()',\n    '[style.--m-text-output-color]': 'resolvedColorPallet().color',\n    '[style.--m-text-output-color-contrast]': 'resolvedColorPallet().contrastColor',\n    '[style.--m-text-output-color-opposite]': 'resolvedColorPallet().oppositeColor',\n  },\n})\nexport class TextOutputComponent extends ConfigComponent<TextOutputConfig> {\n  override subFolder = LAYOUT_ASSET_FOLDER.text_output;\n  override config = model<Partial<TextOutputConfig>>();\n  private readonly translateService = inject(TranslateService);\n\n  readonly align = input<TextOutputAlign | undefined>(undefined);\n  readonly variant = input<TextOutputVariant | undefined>(undefined);\n  // A theme colour key (`error`, `warning`, `success`, …) or a raw CSS colour,\n  // resolved the same way an Icon's or a Logo's is so a token follows the\n  // active theme instead of freezing one theme's hex into a template.\n  readonly color = input<string | undefined>(undefined);\n  readonly fontWeight = input<TextOutputFontWeight | undefined>(undefined);\n  // `label` is the text itself, so a one-off TextOutput needs no asset behind\n  // it (ADR 0010). Numeric display values are stringified before entering the\n  // text and translation pipeline.\n  readonly label = input<string | number | undefined>(undefined);\n  readonly noTranslate = input<boolean | string | undefined>(undefined);\n  // Values for the message's `<name>` / `<$name>` placeholders. An input and\n  // deliberately not a TextOutputConfig key: an asset is resolved by name and\n  // shared across every Control that names it, and these differ per render\n  // (ADR 0020). The query-string form (`min_length?len=6`) still works and\n  // still loses to this on a shared placeholder, that being the precedence\n  // TranslateService already had. Bind a named member — an object literal in a\n  // template is refused by `no-inline-config` (ADR 0010).\n  readonly params = input<Record<string, string> | undefined>(undefined);\n  // One line, cut with an ellipsis at the box's edge rather than wrapping or\n  // spilling into a neighbour. For text whose length says nothing about the\n  // layout — a bound path drawn as `{store.a.b.c}` on the design Canvas.\n  readonly truncate = input<boolean | undefined>(undefined);\n\n  readonly resolvedAlign = computed<TextOutputAlign>(\n    () => this.align() ?? this.config()?.align ?? 'left'\n  );\n\n  protected readonly resolvedVariant = computed<TextOutputVariant | undefined>(\n    () => this.variant() ?? this.config()?.variant\n  );\n\n  protected readonly resolvedFontWeight = computed<\n    TextOutputFontWeight | undefined\n  >(() => this.fontWeight() ?? this.config()?.fontWeight);\n\n  // Both link roles are the same affordance, so both take the focus stop, the\n  // `role=\"link\"` and the `clicked` output; only their size differs.\n  protected readonly isLink = computed(() => {\n    const variant = this.resolvedVariant();\n    return variant === 'link' || variant === 'link-small';\n  });\n\n  /**\n   * Fired by a `link` variant and by nothing else. A text that is not a link\n   * draws no affordance and takes no focus, so a click on it is a click on\n   * prose — emitting there would be a control only a mouse could find.\n   *\n   * Where the link goes to a route instead, the caller attaches `routerLink`\n   * and binds nothing here: one click means one thing.\n   */\n  readonly clicked = output<void>();\n\n  protected onClick(): void {\n    if (this.isLink()) this.clicked.emit();\n  }\n\n  protected readonly resolvedColorPallet = computed(() =>\n    resolvePallet(\n      this.color() ?? this.config()?.color ?? this.defaultColor,\n      this.themeStore.color()\n    )\n  );\n\n  protected override resolveComponentOverrides(): Partial<TextOutputConfig> {\n    const overrides: Partial<TextOutputConfig> = {};\n    const align = this.align();\n    if (align !== undefined) overrides.align = align;\n    const label = this.label();\n    if (label !== undefined) overrides.label = String(label);\n    const noTranslate = toAttrBool(this.noTranslate());\n    if (noTranslate !== undefined) overrides.noTranslate = noTranslate;\n    const variant = this.variant();\n    if (variant !== undefined) overrides.variant = variant;\n    const color = this.color();\n    if (color !== undefined) overrides.color = color;\n    const fontWeight = this.fontWeight();\n    if (fontWeight !== undefined) overrides.fontWeight = fontWeight;\n    return overrides;\n  }\n\n  protected readonly resolvedLabel = computed(() => this.config()?.label);\n  protected readonly shouldTranslate = computed(\n    () => !this.config()?.noTranslate\n  );\n  protected readonly html = computed(() => {\n    const label = this.resolvedLabel();\n    return this.shouldTranslate()\n      ? this.translateService.translateToHtml(label, this.params())\n      : this.translateService.toSafeHtml(label);\n  });\n}\n"],"mappings":"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"}

package/fesm2022/magmonium-one-theme-LIc0f731.mjs

@@ -0,0 +1 @@
+import "./magmonium-one-color-utl-Bo4uumN1.mjs";

package/fesm2022/{magmonium-one-toggle-sUSXzxMl.mjs → magmonium-one-toggle-CqEqyEtf.mjs}

@@ -1,4 +1,4 @@
-import { t as BaseInputComponent, u as TranslatePipe } from "./magmonium-one-base-input-BeyBAbV4.mjs";
+import { t as BaseInputComponent, u as TranslatePipe } from "./magmonium-one-base-input-BP-CVJlM.mjs";
 import * as i0 from "@angular/core";
 import { ChangeDetectionStrategy, Component, input, model } from "@angular/core";
 var ToggleInputComponent = class ToggleInputComponent extends BaseInputComponent {
@@ -226,4 +226,4 @@ i0.ɵɵngDeclareClassMetadata({
 });
 export { ToggleInputComponent };
 
-//# sourceMappingURL=magmonium-one-toggle-sUSXzxMl.mjs.map
+//# sourceMappingURL=magmonium-one-toggle-CqEqyEtf.mjs.map

package/fesm2022/{magmonium-one-toggle-sUSXzxMl.mjs.map → magmonium-one-toggle-CqEqyEtf.mjs.map}

@@ -1 +1 @@
-{"version":3,"file":"magmonium-one-toggle-sUSXzxMl.mjs","names":[],"sources":["../../../../libs/one/src/lib/shared/ui/input/ui/toggle/toggle.ts"],"sourcesContent":["import {\n  ChangeDetectionStrategy,\n  Component,\n  input,\n  model,\n  ModelSignal,\n} from '@angular/core';\nimport { ToggleInput } from '../../model/input';\nimport { TranslatePipe } from '../../../../pipe/translate';\nimport {\n  FormCheckboxControl,\n  ValidationError,\n  WithOptionalFieldTree,\n} from '@angular/forms/signals';\nimport { BaseInputComponent } from '../../lib/base-input';\n\n@Component({\n  selector: 'm-toggle-input',\n  template: `\n    @if (config(); as toggle) {\n      <div class=\"toggle\">\n        <input\n          [id]=\"toggle.name ?? ''\"\n          [checked]=\"checked()\"\n          (change)=\"onChange($event)\"\n          type=\"checkbox\"\n        />\n        <label [attr.for]=\"toggle.name || null\">{{\n          toggle.label | translate\n        }}</label>\n      </div>\n    }\n  `,\n  imports: [TranslatePipe],\n  styleUrl: './toggle.sass',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class ToggleInputComponent\n  extends BaseInputComponent<ToggleInput>\n  implements FormCheckboxControl\n{\n  public value = undefined;\n  public checked = model<boolean>(false) as ModelSignal<boolean>;\n  public override config = input<Partial<ToggleInput> | undefined>();\n  public override required = input<boolean>(false);\n  public override disabled = input<boolean>(false);\n  public override invalid = input<boolean>(false);\n  public override touched = model<boolean>(false);\n  public override focused = input<boolean>(false);\n  public override errors = input<readonly WithOptionalFieldTree<ValidationError>[]>(\n    []\n  );\n\n  /** Required by FormCheckboxControl interface */\n  // public readonly checked: ModelSignal<boolean> = this.value; // Already defined above\n\n  constructor() {\n    super();\n  }\n\n  protected onChange(event: Event): void {\n    const target = event.target as HTMLInputElement;\n    this.checked.set(target?.checked ?? false);\n  }\n}\n"],"mappings":";;;AAqCA,IAAa,uBAAb,MAAa,6BACH,mBAA+B;CAGhC,QAAQ;CACR,UAAU,MAAe,KAAK;CACrB,SAAS,MAAyC,GAAA,YAAA,CAAA,QAAA,EAAA,WAAA,SAAA,CAAA,+BAAA,CAAA,CAAA;CAClD,WAAW,MAAe,OAAM,GAAA,YAAA,CAAA,EAAA,WAAA,WAAA,CAAA,+BAAA,CAAA,CAAA;CAChC,WAAW,MAAe,OAAM,GAAA,YAAA,CAAA,EAAA,WAAA,WAAA,CAAA,+BAAA,CAAA,CAAA;CAChC,UAAU,MAAe,OAAM,GAAA,YAAA,CAAA,EAAA,WAAA,UAAA,CAAA,+BAAA,CAAA,CAAA;CAC/B,UAAU,MAAe,OAAM,GAAA,YAAA,CAAA,EAAA,WAAA,UAAA,CAAA,+BAAA,CAAA,CAAA;CAC/B,UAAU,MAAe,OAAM,GAAA,YAAA,CAAA,EAAA,WAAA,UAAA,CAAA,+BAAA,CAAA,CAAA;CAC/B,SAAS,MACvB,CAAA,GACD,GAAA,YAAA,CAAA,EAAA,WAAA,SAAA,CAAA,+BAAA,CAAA,CAAA;CAKD,cAAA;EACE,MAAK;CACP;CAEU,SAAS,OAAY;EAC7B,MAAM,SAAS,MAAM;EACrB,KAAK,QAAQ,IAAI,QAAQ,WAAW,KAAK;CAC3C;CA1BW,OAAA,OAAA,GAAA,mBAAA;EAAA,YAAA;EAAA,SAAA;EAAA,UAAA;EAAA,MAAA;EAAoB,MAAA,CAAA;EAAA,QAAA,GAAA,gBAAA;CAAA,CAAA;CAApB,OAAA,OAAA,GAAA,qBAAA;EAAA,YAAA;EAAA,SAAA;EAAA,MAAA;EAAoB,cAAA;EAAA,UAAA;EAAA,QAAA;GAAA,SAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;GAAA,QAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;GAAA,UAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;GAAA,UAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;GAAA,SAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;GAAA,SAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;GAAA,SAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;GAAA,QAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;EAAA;EAAA,SAAA;GAAA,SAAA;GAAA,SAAA;EAAA;EAAA,iBAAA;EAAA,UAAA;EAAA,UAnBrB;;;;;;;;;;;;;;;EAcT,UAAA;EAAA,QAAA,CAAA,+6GAAA;EAAA,cAAA,CAAA;GAAA,MAAA;GAAA,MACS;GAAa,MAAA;EAAA,CAAA;EAAA,iBAAA,GAAA,wBAAA;CAAA,CAAA;;AAIZ,GAAA,yBAAA;CAAA,YAAA;CAAA,SAAA;CAAA,UAAA;CAAA,MAAA;CAAoB,YAAA,CAAA;EArBhC,MAAA;EACW,MAAA,CAAA;GAAA,UAAA;GAAgB,UAChB;;;;;;;;;;;;;;;GAcT,SACQ,CAAC,aAAa;GAAC,iBAEP,wBAAwB;GAAM,QAAA,CAAA,+6GAAA;EAAA,CAAA"}
+{"version":3,"file":"magmonium-one-toggle-CqEqyEtf.mjs","names":[],"sources":["../../../../libs/one/src/lib/shared/ui/input/ui/toggle/toggle.ts"],"sourcesContent":["import {\n  ChangeDetectionStrategy,\n  Component,\n  input,\n  model,\n  ModelSignal,\n} from '@angular/core';\nimport { ToggleInput } from '../../model/input';\nimport { TranslatePipe } from '../../../../pipe/translate';\nimport {\n  FormCheckboxControl,\n  ValidationError,\n  WithOptionalFieldTree,\n} from '@angular/forms/signals';\nimport { BaseInputComponent } from '../../lib/base-input';\n\n@Component({\n  selector: 'm-toggle-input',\n  template: `\n    @if (config(); as toggle) {\n      <div class=\"toggle\">\n        <input\n          [id]=\"toggle.name ?? ''\"\n          [checked]=\"checked()\"\n          (change)=\"onChange($event)\"\n          type=\"checkbox\"\n        />\n        <label [attr.for]=\"toggle.name || null\">{{\n          toggle.label | translate\n        }}</label>\n      </div>\n    }\n  `,\n  imports: [TranslatePipe],\n  styleUrl: './toggle.sass',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class ToggleInputComponent\n  extends BaseInputComponent<ToggleInput>\n  implements FormCheckboxControl\n{\n  public value = undefined;\n  public checked = model<boolean>(false) as ModelSignal<boolean>;\n  public override config = input<Partial<ToggleInput> | undefined>();\n  public override required = input<boolean>(false);\n  public override disabled = input<boolean>(false);\n  public override invalid = input<boolean>(false);\n  public override touched = model<boolean>(false);\n  public override focused = input<boolean>(false);\n  public override errors = input<readonly WithOptionalFieldTree<ValidationError>[]>(\n    []\n  );\n\n  /** Required by FormCheckboxControl interface */\n  // public readonly checked: ModelSignal<boolean> = this.value; // Already defined above\n\n  constructor() {\n    super();\n  }\n\n  protected onChange(event: Event): void {\n    const target = event.target as HTMLInputElement;\n    this.checked.set(target?.checked ?? false);\n  }\n}\n"],"mappings":";;;AAqCA,IAAa,uBAAb,MAAa,6BACH,mBAA+B;CAGhC,QAAQ;CACR,UAAU,MAAe,KAAK;CACrB,SAAS,MAAyC,GAAA,YAAA,CAAA,QAAA,EAAA,WAAA,SAAA,CAAA,+BAAA,CAAA,CAAA;CAClD,WAAW,MAAe,OAAM,GAAA,YAAA,CAAA,EAAA,WAAA,WAAA,CAAA,+BAAA,CAAA,CAAA;CAChC,WAAW,MAAe,OAAM,GAAA,YAAA,CAAA,EAAA,WAAA,WAAA,CAAA,+BAAA,CAAA,CAAA;CAChC,UAAU,MAAe,OAAM,GAAA,YAAA,CAAA,EAAA,WAAA,UAAA,CAAA,+BAAA,CAAA,CAAA;CAC/B,UAAU,MAAe,OAAM,GAAA,YAAA,CAAA,EAAA,WAAA,UAAA,CAAA,+BAAA,CAAA,CAAA;CAC/B,UAAU,MAAe,OAAM,GAAA,YAAA,CAAA,EAAA,WAAA,UAAA,CAAA,+BAAA,CAAA,CAAA;CAC/B,SAAS,MACvB,CAAA,GACD,GAAA,YAAA,CAAA,EAAA,WAAA,SAAA,CAAA,+BAAA,CAAA,CAAA;CAKD,cAAA;EACE,MAAK;CACP;CAEU,SAAS,OAAY;EAC7B,MAAM,SAAS,MAAM;EACrB,KAAK,QAAQ,IAAI,QAAQ,WAAW,KAAK;CAC3C;CA1BW,OAAA,OAAA,GAAA,mBAAA;EAAA,YAAA;EAAA,SAAA;EAAA,UAAA;EAAA,MAAA;EAAoB,MAAA,CAAA;EAAA,QAAA,GAAA,gBAAA;CAAA,CAAA;CAApB,OAAA,OAAA,GAAA,qBAAA;EAAA,YAAA;EAAA,SAAA;EAAA,MAAA;EAAoB,cAAA;EAAA,UAAA;EAAA,QAAA;GAAA,SAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;GAAA,QAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;GAAA,UAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;GAAA,UAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;GAAA,SAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;GAAA,SAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;GAAA,SAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;GAAA,QAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;EAAA;EAAA,SAAA;GAAA,SAAA;GAAA,SAAA;EAAA;EAAA,iBAAA;EAAA,UAAA;EAAA,UAnBrB;;;;;;;;;;;;;;;EAcT,UAAA;EAAA,QAAA,CAAA,+6GAAA;EAAA,cAAA,CAAA;GAAA,MAAA;GAAA,MACS;GAAa,MAAA;EAAA,CAAA;EAAA,iBAAA,GAAA,wBAAA;CAAA,CAAA;;AAIZ,GAAA,yBAAA;CAAA,YAAA;CAAA,SAAA;CAAA,UAAA;CAAA,MAAA;CAAoB,YAAA,CAAA;EArBhC,MAAA;EACW,MAAA,CAAA;GAAA,UAAA;GAAgB,UAChB;;;;;;;;;;;;;;;GAcT,SACQ,CAAC,aAAa;GAAC,iBAEP,wBAAwB;GAAM,QAAA,CAAA,+6GAAA;EAAA,CAAA"}

package/fesm2022/magmonium-one.mjs

@@ -1,29 +1,29 @@
 import { t as __exportAll } from "./magmonium-one-rolldown-runtime-DpJrqANO.mjs";
-import { $ as OPTIONS_SOURCE, A as wcTierOf, B as AppRelationType, C as buildWcBaseUrl, D as setWcLocalPort, E as recordDefinedWcTier, F as isWebComponent, G as IS_DESIGN_MODE, H as FOLDER_PICK_LISTENER, I as APP_CONTEXT_REF, J as LOGIN_COMPONENT, K as IS_SIDE_PANEL, L as APP_LINK, M as isLocalhost, N as isTierPreview, O as setWcTier, P as isUrlLocalhost, Q as ONE_ASSET_BASE_URL, R as ASSET_BASE_URL, S as HttpService, T as definedWcTierOf, U as HOST_SESSION, V as COMPONENT_INPUT_REGISTRY, W as ICON_SOURCE, X as MODAL_STORE_REF, Y as LOGIN_STORE, Z as NAV_STORE_REF, _ as AssetStore, a as resolveIconSize, at as WC_SEARCH_GROUPS, b as isJson, c as toCssLength, ct as Assets, d as TranslateService, et as SEARCH_QUERY, f as BrowserLocaleService, g as miniMarkToHtml, h as miniMarkInlineToHtml, i as isSize, it as WC_BUNDLE, j as getTierFromPreviewPath, k as wcLocalBaseOf, l as toLength, lt as DEFAULT_SIZE, m as escapeHtml, nt as TRANSLATION_SOURCE, o as resolveSize, ot as FORM_ASSET_FOLDER, p as browserLocale, q as LOADING_ACTIONS_REF, r as coerceSize, rt as USER_STORE_REF, s as resolveSpacing, st as LAYOUT_ASSET_FOLDER, t as BaseInputComponent, tt as SEARCH_RESULTS_EVENT, u as TranslatePipe, ut as Size, v as SharedStoreRegistry, w as definedWcBundleOf, x as ACCESS_DOMAINS, y as StorageService, z as AppAvailability } from "./magmonium-one-base-input-BeyBAbV4.mjs";
-import { a as OverlayService, c as DeviceService, i as OverlayRef, n as Direction, o as ScrollService, r as ThemeService, s as DomService, t as SelectorDirective } from "./magmonium-one-selector-QB49Ju9l.mjs";
+import { $ as OPTIONS_SOURCE, A as wcTierOf, B as AppRelationType, C as buildWcBaseUrl, D as setWcLocalPort, E as recordDefinedWcTier, F as isWebComponent, G as IS_DESIGN_MODE, H as FOLDER_PICK_LISTENER, I as APP_CONTEXT_REF, J as LOGIN_COMPONENT, K as IS_SIDE_PANEL, L as APP_LINK, M as isLocalhost, N as isTierPreview, O as setWcTier, P as isUrlLocalhost, Q as ONE_ASSET_BASE_URL, R as ASSET_BASE_URL, S as HttpService, T as definedWcTierOf, U as HOST_SESSION, V as COMPONENT_INPUT_REGISTRY, W as ICON_SOURCE, X as MODAL_STORE_REF, Y as LOGIN_STORE, Z as NAV_STORE_REF, _ as AssetStore, a as resolveIconSize, at as WC_SEARCH_GROUPS, b as isJson, c as toCssLength, ct as Assets, d as TranslateService, et as SEARCH_QUERY, f as BrowserLocaleService, g as miniMarkToHtml, h as miniMarkInlineToHtml, i as isSize, it as WC_BUNDLE, j as getTierFromPreviewPath, k as wcLocalBaseOf, l as toLength, lt as DEFAULT_SIZE, m as escapeHtml, nt as TRANSLATION_SOURCE, o as resolveSize, ot as FORM_ASSET_FOLDER, p as browserLocale, q as LOADING_ACTIONS_REF, r as coerceSize, rt as USER_STORE_REF, s as resolveSpacing, st as LAYOUT_ASSET_FOLDER, t as BaseInputComponent, tt as SEARCH_RESULTS_EVENT, u as TranslatePipe, ut as Size, v as SharedStoreRegistry, w as definedWcBundleOf, x as ACCESS_DOMAINS, y as StorageService, z as AppAvailability } from "./magmonium-one-base-input-BP-CVJlM.mjs";
+import { a as OverlayService, c as DeviceService, i as OverlayRef, n as Direction, o as ScrollService, r as ThemeService, s as DomService, t as SelectorDirective } from "./magmonium-one-selector-x0wB0KrY.mjs";
 import { t as FileService } from "./magmonium-one-file.service-D39FjShR.mjs";
-import { C as isLightAppColor, D as readableAppColor, E as normalizeAppColor, O as rebuildLogoGlyph, S as appLogoShadowColor, T as logoGlyphMaskUrl, _ as AppLogoState, a as calculateLuminance, b as LOGO_GLYPH_MAX_BYTES, c as hexToRgb, d as derivePropertyName, f as getProperty, g as APP_THEME_COLOR, h as APP_LOGO_SOURCE, i as deriveOppositeColor, k as ThemeDataService, l as hslToRgb, m as ThemeStore, n as resolvePallet, o as rgbToHex, p as setProperty, r as deriveContrastColor, s as rgbToHsl, t as applyColorsToElement, u as parseColor, v as appThemeColorFactory, w as isReadableOn, x as appColorBrand, y as paintAppColor } from "./magmonium-one-color-utl-DMLkkE-z.mjs";
-import "./magmonium-one-theme-DEgFM1wD.mjs";
-import { _ as TimeAgoPipe, a as nextSectionTableSort, c as sectionTableFrozenCount, d as SectionTableSortDirection, f as AssetUrlPipe, g as MoneyPipe, h as PercentagePipe, i as defaultSectionTableSort, l as sortSectionTableRows, m as SignColorPipe, n as ToListPipe, o as sectionTableColumnId, p as CompactNumberPipe, r as SectionTableSortPipe, s as sectionTableColumnWidths, t as LabelComponent, u as SECTION_TABLE_VARIANTS } from "./magmonium-one-label-BNxbDSwc.mjs";
-import { a as SIZE_CONTEXT, c as SHARED_ICONS, i as APP_LOGO_ICON, n as CustomIconClass, o as injectParentSize, r as IconComponent, s as provideSizeContext, t as CustomIconEditComponent } from "./magmonium-one-icon-CXFTG4mD.mjs";
-import { i as resolveConfigAsset, n as toAttrNumber, r as ConfigComponent, t as toAttrBool } from "./magmonium-one-attribute-value-BXEWw7xP.mjs";
-import { a as ACTION_BUTTON_HOST, c as isButtonName, d as BadgeComponent, f as formatBadgeCount, i as BUTTON_GROUP_HOST, l as enumValue, n as SECTION_FORM_CONTEXT, p as shouldShowBadge, r as ImgComponent, s as actionName, t as ButtonComponent, u as ReactiveElementComponent } from "./magmonium-one-button-DC_fLy-J.mjs";
-import { t as MRefDirective } from "./magmonium-one-m-ref-CoK96ogW.mjs";
-import { i as OptionsSourceDirective, n as normalizeAssetOptions, r as presetDefaultOption, t as assetOptions } from "./magmonium-one-options-asset-DWjdYQe0.mjs";
+import { C as isLightAppColor, D as readableAppColor, E as normalizeAppColor, O as rebuildLogoGlyph, S as appLogoShadowColor, T as logoGlyphMaskUrl, _ as AppLogoState, a as calculateLuminance, b as LOGO_GLYPH_MAX_BYTES, c as hexToRgb, d as derivePropertyName, f as getProperty, g as APP_THEME_COLOR, h as APP_LOGO_SOURCE, i as deriveOppositeColor, k as ThemeDataService, l as hslToRgb, m as ThemeStore, n as resolvePallet, o as rgbToHex, p as setProperty, r as deriveContrastColor, s as rgbToHsl, t as applyColorsToElement, u as parseColor, v as appThemeColorFactory, w as isReadableOn, x as appColorBrand, y as paintAppColor } from "./magmonium-one-color-utl-Bo4uumN1.mjs";
+import "./magmonium-one-theme-LIc0f731.mjs";
+import { _ as TimeAgoPipe, a as nextSectionTableSort, c as sectionTableFrozenCount, d as SectionTableSortDirection, f as AssetUrlPipe, g as MoneyPipe, h as PercentagePipe, i as defaultSectionTableSort, l as sortSectionTableRows, m as SignColorPipe, n as ToListPipe, o as sectionTableColumnId, p as CompactNumberPipe, r as SectionTableSortPipe, s as sectionTableColumnWidths, t as LabelComponent, u as SECTION_TABLE_VARIANTS } from "./magmonium-one-label-mLyqV5U_.mjs";
+import { a as SIZE_CONTEXT, c as SHARED_ICONS, i as APP_LOGO_ICON, n as CustomIconClass, o as injectParentSize, r as IconComponent, s as provideSizeContext, t as CustomIconEditComponent } from "./magmonium-one-icon-C8FRmxpW.mjs";
+import { i as resolveConfigAsset, n as toAttrNumber, r as ConfigComponent, t as toAttrBool } from "./magmonium-one-attribute-value-D3-h8ve6.mjs";
+import { a as ACTION_BUTTON_HOST, c as isButtonName, d as BadgeComponent, f as formatBadgeCount, i as BUTTON_GROUP_HOST, l as enumValue, n as SECTION_FORM_CONTEXT, p as shouldShowBadge, r as ImgComponent, s as actionName, t as ButtonComponent, u as ReactiveElementComponent } from "./magmonium-one-button-CJG1vPHS.mjs";
+import { t as MRefDirective } from "./magmonium-one-m-ref-DQLJ12Cj.mjs";
+import { i as OptionsSourceDirective, n as normalizeAssetOptions, r as presetDefaultOption, t as assetOptions } from "./magmonium-one-options-asset-iITooSr4.mjs";
 import { t as InputType } from "./magmonium-one-input-DqHPorA1.mjs";
-import { r as PLACED_CHECKBOX, t as CheckboxInputComponent } from "./magmonium-one-checkbox-C85FEuTs.mjs";
-import { a as ToolTipDirective, c as DragListItemDirective, d as MarginDirective, f as PaddingDirective, i as PositionDirective, l as DragListDirective, n as stringToColor, o as FileUploadDirective, p as SPACING_INWARD, r as HighlightDirective, s as AutosizeDirective, t as MHeroColorDirective, u as DraggableDirective } from "./magmonium-one-directives-CJK7xDPK.mjs";
-import { t as HeaderComponent } from "./magmonium-one-header-BC-74GOn.mjs";
-import { i as mergeUniqueWith, n as mergeUnique, r as mergeUniqueBy, t as ButtonGroupComponent } from "./magmonium-one-group-qu3xLiI8.mjs";
-import { n as ContextMenuBoxComponent, r as MenuComponent, t as ContextMenuComponent } from "./magmonium-one-menu-D_HAqfel.mjs";
-import { i as getScrollParent, n as activeElementWithin, r as classListSignal, t as BaseTextInputComponent } from "./magmonium-one-base-text-BBeMl8XM.mjs";
-import { t as TextOutputComponent } from "./magmonium-one-text-output-DiA4R1pw.mjs";
-import { t as BaseCheckboxInputComponent } from "./magmonium-one-base-checkbox-CIUMxkzu.mjs";
-import { t as RadioInputComponent } from "./magmonium-one-radio-DGTbRRXb.mjs";
-import { t as TextInputComponent } from "./magmonium-one-text-CMULvvAr.mjs";
-import { r as BaseArrayInputComponent, t as MultiRangeInputComponent } from "./magmonium-one-multi-range-DqtW4U_x.mjs";
-import { t as RangeInputComponent } from "./magmonium-one-range-Dw4YACtP.mjs";
-import { n as DROPDOWN_IMPORTS, r as DROPDOWN_TEMPLATE, t as BaseDropdownComponent } from "./magmonium-one-base-dropdown-BMsV5USo.mjs";
+import { r as PLACED_CHECKBOX, t as CheckboxInputComponent } from "./magmonium-one-checkbox-ZM0KfqIQ.mjs";
+import { a as ToolTipDirective, c as DragListItemDirective, d as MarginDirective, f as PaddingDirective, i as PositionDirective, l as DragListDirective, n as stringToColor, o as FileUploadDirective, p as SPACING_INWARD, r as HighlightDirective, s as AutosizeDirective, t as MHeroColorDirective, u as DraggableDirective } from "./magmonium-one-directives-BxxQs2S4.mjs";
+import { t as HeaderComponent } from "./magmonium-one-header-BGTP8_Uw.mjs";
+import { i as mergeUniqueWith, n as mergeUnique, r as mergeUniqueBy, t as ButtonGroupComponent } from "./magmonium-one-group-D5QIFnbR.mjs";
+import { n as ContextMenuBoxComponent, r as MenuComponent, t as ContextMenuComponent } from "./magmonium-one-menu-BqT-XVvZ.mjs";
+import { i as getScrollParent, n as activeElementWithin, r as classListSignal, t as BaseTextInputComponent } from "./magmonium-one-base-text-D6Ep6NEn.mjs";
+import { t as TextOutputComponent } from "./magmonium-one-text-output-DP06NTMe.mjs";
+import { t as BaseCheckboxInputComponent } from "./magmonium-one-base-checkbox-Bwl2LUSC.mjs";
+import { t as RadioInputComponent } from "./magmonium-one-radio-bTivHHZH.mjs";
+import { t as TextInputComponent } from "./magmonium-one-text-BTAJl4eW.mjs";
+import { r as BaseArrayInputComponent, t as MultiRangeInputComponent } from "./magmonium-one-multi-range-BMn1iVZ4.mjs";
+import { t as RangeInputComponent } from "./magmonium-one-range-8y-IUMjf.mjs";
+import { n as DROPDOWN_IMPORTS, r as DROPDOWN_TEMPLATE, t as BaseDropdownComponent } from "./magmonium-one-base-dropdown-Cw6z6tBU.mjs";
 import { o as isEditableImage, s as outputSize } from "./magmonium-one-image-frame-BTSaUSAi.mjs";
 import * as i0 from "@angular/core";
 import { ApplicationRef, CUSTOM_ELEMENTS_SCHEMA, ChangeDetectionStrategy, ChangeDetectorRef, Component, ContentChild, DOCUMENT, DestroyRef, Directive, ElementRef, EventEmitter, HostAttributeToken, HostBinding, HostListener, Injectable, InjectionToken, Injector, Input, LOCALE_ID, Output, TemplateRef, ViewChild, ViewContainerRef, ViewEncapsulation, afterEveryRender, afterNextRender, afterRenderEffect, booleanAttribute, computed, contentChild, contentChildren, createComponent, effect, forwardRef, inject, input, inputBinding, linkedSignal, makeEnvironmentProviders, model, numberAttribute, output, outputBinding, provideAppInitializer, provideBrowserGlobalErrorListeners, provideZonelessChangeDetection, reflectComponentType, runInInjectionContext, signal, twoWayBinding, untracked, viewChild, viewChildren } from "@angular/core";
@@ -743,12 +743,12 @@ var SectionFormItemComponent = class SectionFormItemComponent extends ConfigComp
 		try {
 			switch (type) {
 				case InputType.RADIO: {
-					const { RadioInputComponent } = await import("./magmonium-one-radio-DGTbRRXb.mjs").then((n) => n.n);
+					const { RadioInputComponent } = await import("./magmonium-one-radio-bTivHHZH.mjs").then((n) => n.n);
 					this.createDynamicComponent(seq, RadioInputComponent);
 					break;
 				}
 				case InputType.TOGGLE: {
-					const { ToggleInputComponent } = await import("./magmonium-one-toggle-sUSXzxMl.mjs");
+					const { ToggleInputComponent } = await import("./magmonium-one-toggle-CqEqyEtf.mjs");
 					this.createDynamicComponent(seq, ToggleInputComponent, [], true);
 					break;
 				}
@@ -758,12 +758,12 @@ var SectionFormItemComponent = class SectionFormItemComponent extends ConfigComp
 					break;
 				}
 				case InputType.PASSWORD: {
-					const { PasswordInputComponent } = await import("./magmonium-one-password-BqdyEDF6.mjs");
+					const { PasswordInputComponent } = await import("./magmonium-one-password-lZ5OEevh.mjs");
 					this.createDynamicComponent(seq, PasswordInputComponent);
 					break;
 				}
 				case InputType.OTP: {
-					const { OtpInputComponent } = await import("./magmonium-one-otp-DOPvjYJz.mjs");
+					const { OtpInputComponent } = await import("./magmonium-one-otp-xQgDDbDC.mjs");
 					this.createDynamicComponent(seq, OtpInputComponent);
 					break;
 				}
@@ -773,7 +773,7 @@ var SectionFormItemComponent = class SectionFormItemComponent extends ConfigComp
 					break;
 				}
 				case InputType.CHECKBOX: {
-					const { CheckboxInputComponent } = await import("./magmonium-one-checkbox-C85FEuTs.mjs").then((n) => n.n);
+					const { CheckboxInputComponent } = await import("./magmonium-one-checkbox-ZM0KfqIQ.mjs").then((n) => n.n);
 					this.createDynamicComponent(seq, CheckboxInputComponent, [], true);
 					break;
 				}
@@ -788,12 +788,12 @@ var SectionFormItemComponent = class SectionFormItemComponent extends ConfigComp
 					break;
 				}
 				case InputType.RANGE: {
-					const { RangeInputComponent } = await import("./magmonium-one-range-Dw4YACtP.mjs").then((n) => n.n);
+					const { RangeInputComponent } = await import("./magmonium-one-range-8y-IUMjf.mjs").then((n) => n.n);
 					this.createDynamicComponent(seq, RangeInputComponent);
 					break;
 				}
 				case InputType.MULTI_RANGE: {
-					const { MultiRangeInputComponent } = await import("./magmonium-one-multi-range-DqtW4U_x.mjs").then((n) => n.n);
+					const { MultiRangeInputComponent } = await import("./magmonium-one-multi-range-BMn1iVZ4.mjs").then((n) => n.n);
 					this.createDynamicComponent(seq, MultiRangeInputComponent);
 					break;
 				}
@@ -844,7 +844,7 @@ var SectionFormItemComponent = class SectionFormItemComponent extends ConfigComp
 					break;
 				}
 				default: {
-					const { TextInputComponent } = await import("./magmonium-one-text-CMULvvAr.mjs").then((n) => n.n);
+					const { TextInputComponent } = await import("./magmonium-one-text-BTAJl4eW.mjs").then((n) => n.n);
 					this.createDynamicComponent(seq, TextInputComponent);
 					break;
 				}
@@ -4026,7 +4026,7 @@ var ClearableInputComponent = class ClearableInputComponent extends BaseTextInpu
       }
     </div>
     @if (showErrors()) {
-      @for (error of errors(); track $index) {
+      @if (shownError(); as error) {
         <m-text-output
           variant="footer"
           color="error"
@@ -4180,7 +4180,7 @@ i0.ɵɵngDeclareClassMetadata({
       }
     </div>
     @if (showErrors()) {
-      @for (error of errors(); track $index) {
+      @if (shownError(); as error) {
         <m-text-output
           variant="footer"
           color="error"
@@ -12264,7 +12264,7 @@ var DropdownInputComponent = class DropdownInputComponent extends BaseDropdownCo
 		outputs: { value: "valueChange" },
 		usesInheritance: true,
 		ngImport: i0,
-		template: "\n  @if (config(); as dropdown) {\n    @if (dropdown.label) {\n      <m-label\n        [for]=\"dropdown.name ?? ''\"\n        [placeholder]=\"dropdown.label\"\n        [params]=\"dropdown.params\"\n        [required]=\"required()\"\n        [disabled]=\"disabled()\"\n      />\n    }\n    <div\n      class=\"trigger-wrap\"\n      #wrapper\n      [mSelector]=\"selectorConfig()\"\n      [disabled]=\"disabled() || readonly() || !!config()?.readonly\"\n      (opened)=\"onOpened()\"\n      (closed)=\"onClosed()\"\n      (focusin)=\"isFocused.set(true)\"\n      (focusout)=\"isFocused.set(false)\"\n    >\n      <m-text-input\n        [config]=\"triggerInputConfig()\"\n        [value]=\"displayValue()\"\n        [disabled]=\"disabled()\"\n        [invalid]=\"invalid()\"\n        [hideErrors]=\"true\"\n        [(touched)]=\"touched\"\n        [focused]=\"focused()\"\n        (valueChange)=\"onInput($event)\"\n        (click)=\"preventToggleWhenOpen($event)\"\n        (keydown.space)=\"$event.stopPropagation()\"\n        (keydown.enter)=\"onEnter($event)\"\n        (keydown.arrowdown)=\"onArrow($event, 1)\"\n        (keydown.arrowup)=\"onArrow($event, -1)\"\n        (keydown.tab)=\"$event.stopPropagation()\"\n      />\n      <m-button [disabled]=\"disabled()\" [config]=\"chevron()\" />\n    </div>\n    @if (showErrors()) {\n      @for (error of errors(); track $index) {\n        <m-text-output\n          variant=\"footer\"\n          color=\"error\"\n          [label]=\"error.message\"\n        />\n      }\n    }\n  }\n",
+		template: "\n  @if (config(); as dropdown) {\n    @if (dropdown.label) {\n      <m-label\n        [for]=\"dropdown.name ?? ''\"\n        [placeholder]=\"dropdown.label\"\n        [params]=\"dropdown.params\"\n        [required]=\"required()\"\n        [disabled]=\"disabled()\"\n      />\n    }\n    <div\n      class=\"trigger-wrap\"\n      #wrapper\n      [mSelector]=\"selectorConfig()\"\n      [disabled]=\"disabled() || readonly() || !!config()?.readonly\"\n      (opened)=\"onOpened()\"\n      (closed)=\"onClosed()\"\n      (focusin)=\"isFocused.set(true)\"\n      (focusout)=\"isFocused.set(false)\"\n    >\n      <m-text-input\n        [config]=\"triggerInputConfig()\"\n        [value]=\"displayValue()\"\n        [disabled]=\"disabled()\"\n        [invalid]=\"invalid()\"\n        [hideErrors]=\"true\"\n        [(touched)]=\"touched\"\n        [focused]=\"focused()\"\n        (valueChange)=\"onInput($event)\"\n        (click)=\"preventToggleWhenOpen($event)\"\n        (keydown.space)=\"$event.stopPropagation()\"\n        (keydown.enter)=\"onEnter($event)\"\n        (keydown.arrowdown)=\"onArrow($event, 1)\"\n        (keydown.arrowup)=\"onArrow($event, -1)\"\n        (keydown.tab)=\"$event.stopPropagation()\"\n      />\n      <m-button [disabled]=\"disabled()\" [config]=\"chevron()\" />\n    </div>\n    @if (showErrors()) {\n      @if (shownError(); as error) {\n        <m-text-output\n          variant=\"footer\"\n          color=\"error\"\n          [label]=\"error.message\"\n        />\n      }\n    }\n  }\n",
 		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:contents}.trigger-wrap{position:relative;--m-text-input-padding-right: 2.25em }.trigger-wrap m-button{position:absolute;right:0;top:0;bottom:0;--m-button-size: 1em !important;height:100%;border-radius:0 var(--m-input-radius, calc(var(--input-size, 1em) * .5)) var(--m-input-radius, calc(var(--input-size, 1em) * .5)) 0;--m-button-radius: 0 var(--m-input-radius, calc(var(--input-size, 1em) * .5)) var(--m-input-radius, calc(var(--input-size, 1em) * .5)) 0}\n"],
 		dependencies: [
@@ -20630,7 +20630,7 @@ var TextareaInputComponent = class TextareaInputComponent extends BaseTextInputC
         ></textarea>
       </div>
       @if (showErrors()) {
-        @for (error of errors(); track $index) {
+        @if (shownError(); as error) {
           <m-text-output
             variant="footer"
             color="error"
@@ -20738,7 +20738,7 @@ i0.ɵɵngDeclareClassMetadata({
         ></textarea>
       </div>
       @if (showErrors()) {
-        @for (error of errors(); track $index) {
+        @if (shownError(); as error) {
           <m-text-output
             variant="footer"
             color="error"
@@ -21833,7 +21833,7 @@ var DateInputComponent = class DateInputComponent extends BaseTextInputComponent
         />
       </div>
       @if (showErrors()) {
-        @for (error of errors(); track $index) {
+        @if (shownError(); as error) {
           <m-text-output
             variant="footer"
             color="error"
@@ -21970,7 +21970,7 @@ i0.ɵɵngDeclareClassMetadata({
         />
       </div>
       @if (showErrors()) {
-        @for (error of errors(); track $index) {
+        @if (shownError(); as error) {
           <m-text-output
             variant="footer"
             color="error"
@@ -22182,7 +22182,7 @@ var CheckboxGroupComponent = class CheckboxGroupComponent extends BaseInputCompo
         }
       </div>
       @if (showErrors()) {
-        @for (error of errors(); track $index) {
+        @if (shownError(); as error) {
           <m-text-output
             variant="footer"
             color="error"
@@ -22285,7 +22285,7 @@ i0.ɵɵngDeclareClassMetadata({
         }
       </div>
       @if (showErrors()) {
-        @for (error of errors(); track $index) {
+        @if (shownError(); as error) {
           <m-text-output
             variant="footer"
             color="error"
@@ -22372,7 +22372,7 @@ var MultiselectInputComponent = class MultiselectInputComponent extends BaseDrop
 		outputs: { value: "valueChange" },
 		usesInheritance: true,
 		ngImport: i0,
-		template: "\n  @if (config(); as dropdown) {\n    @if (dropdown.label) {\n      <m-label\n        [for]=\"dropdown.name ?? ''\"\n        [placeholder]=\"dropdown.label\"\n        [params]=\"dropdown.params\"\n        [required]=\"required()\"\n        [disabled]=\"disabled()\"\n      />\n    }\n    <div\n      class=\"trigger-wrap\"\n      #wrapper\n      [mSelector]=\"selectorConfig()\"\n      [disabled]=\"disabled() || readonly() || !!config()?.readonly\"\n      (opened)=\"onOpened()\"\n      (closed)=\"onClosed()\"\n      (focusin)=\"isFocused.set(true)\"\n      (focusout)=\"isFocused.set(false)\"\n    >\n      <m-text-input\n        [config]=\"triggerInputConfig()\"\n        [value]=\"displayValue()\"\n        [disabled]=\"disabled()\"\n        [invalid]=\"invalid()\"\n        [hideErrors]=\"true\"\n        [(touched)]=\"touched\"\n        [focused]=\"focused()\"\n        (valueChange)=\"onInput($event)\"\n        (click)=\"preventToggleWhenOpen($event)\"\n        (keydown.space)=\"$event.stopPropagation()\"\n        (keydown.enter)=\"onEnter($event)\"\n        (keydown.arrowdown)=\"onArrow($event, 1)\"\n        (keydown.arrowup)=\"onArrow($event, -1)\"\n        (keydown.tab)=\"$event.stopPropagation()\"\n      />\n      <m-button [disabled]=\"disabled()\" [config]=\"chevron()\" />\n    </div>\n    @if (showErrors()) {\n      @for (error of errors(); track $index) {\n        <m-text-output\n          variant=\"footer\"\n          color=\"error\"\n          [label]=\"error.message\"\n        />\n      }\n    }\n  }\n",
+		template: "\n  @if (config(); as dropdown) {\n    @if (dropdown.label) {\n      <m-label\n        [for]=\"dropdown.name ?? ''\"\n        [placeholder]=\"dropdown.label\"\n        [params]=\"dropdown.params\"\n        [required]=\"required()\"\n        [disabled]=\"disabled()\"\n      />\n    }\n    <div\n      class=\"trigger-wrap\"\n      #wrapper\n      [mSelector]=\"selectorConfig()\"\n      [disabled]=\"disabled() || readonly() || !!config()?.readonly\"\n      (opened)=\"onOpened()\"\n      (closed)=\"onClosed()\"\n      (focusin)=\"isFocused.set(true)\"\n      (focusout)=\"isFocused.set(false)\"\n    >\n      <m-text-input\n        [config]=\"triggerInputConfig()\"\n        [value]=\"displayValue()\"\n        [disabled]=\"disabled()\"\n        [invalid]=\"invalid()\"\n        [hideErrors]=\"true\"\n        [(touched)]=\"touched\"\n        [focused]=\"focused()\"\n        (valueChange)=\"onInput($event)\"\n        (click)=\"preventToggleWhenOpen($event)\"\n        (keydown.space)=\"$event.stopPropagation()\"\n        (keydown.enter)=\"onEnter($event)\"\n        (keydown.arrowdown)=\"onArrow($event, 1)\"\n        (keydown.arrowup)=\"onArrow($event, -1)\"\n        (keydown.tab)=\"$event.stopPropagation()\"\n      />\n      <m-button [disabled]=\"disabled()\" [config]=\"chevron()\" />\n    </div>\n    @if (showErrors()) {\n      @if (shownError(); as error) {\n        <m-text-output\n          variant=\"footer\"\n          color=\"error\"\n          [label]=\"error.message\"\n        />\n      }\n    }\n  }\n",
 		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:contents}.trigger-wrap{position:relative;--m-text-input-padding-right: 2.25em }.trigger-wrap m-button{position:absolute;right:0;top:0;bottom:0;--m-button-size: 1em !important;height:100%;border-radius:0 var(--m-input-radius, calc(var(--input-size, 1em) * .5)) var(--m-input-radius, calc(var(--input-size, 1em) * .5)) 0;--m-button-radius: 0 var(--m-input-radius, calc(var(--input-size, 1em) * .5)) var(--m-input-radius, calc(var(--input-size, 1em) * .5)) 0}\n"],
 		dependencies: [
@@ -23681,7 +23681,7 @@ var ColorPickerInputComponent = class ColorPickerInputComponent extends BaseText
         <m-button [disabled]="disabled()" [config]="pickerIcon()" />
       </div>
       @if (showErrors()) {
-        @for (error of errors(); track $index) {
+        @if (shownError(); as error) {
           <m-text-output
             variant="footer"
             color="error"
@@ -23842,7 +23842,7 @@ i0.ɵɵngDeclareClassMetadata({
         <m-button [disabled]="disabled()" [config]="pickerIcon()" />
       </div>
       @if (showErrors()) {
-        @for (error of errors(); track $index) {
+        @if (shownError(); as error) {
           <m-text-output
             variant="footer"
             color="error"
@@ -24003,12 +24003,12 @@ var WrapperInputComponent = class WrapperInputComponent extends ConfigComponent
 		const seq = ++this.dynamicSeq;
 		switch (this.config()?.type) {
 			case InputType.RADIO: {
-				const { RadioInputComponent } = await import("./magmonium-one-radio-DGTbRRXb.mjs").then((n) => n.n);
+				const { RadioInputComponent } = await import("./magmonium-one-radio-bTivHHZH.mjs").then((n) => n.n);
 				this.createDynamicComponent(seq, RadioInputComponent);
 				break;
 			}
 			case InputType.TOGGLE: {
-				const { ToggleInputComponent } = await import("./magmonium-one-toggle-sUSXzxMl.mjs");
+				const { ToggleInputComponent } = await import("./magmonium-one-toggle-CqEqyEtf.mjs");
 				this.createDynamicComponent(seq, ToggleInputComponent, [], true);
 				break;
 			}
@@ -24018,12 +24018,12 @@ var WrapperInputComponent = class WrapperInputComponent extends ConfigComponent
 				break;
 			}
 			case InputType.PASSWORD: {
-				const { PasswordInputComponent } = await import("./magmonium-one-password-BqdyEDF6.mjs");
+				const { PasswordInputComponent } = await import("./magmonium-one-password-lZ5OEevh.mjs");
 				this.createDynamicComponent(seq, PasswordInputComponent);
 				break;
 			}
 			case InputType.OTP: {
-				const { OtpInputComponent } = await import("./magmonium-one-otp-DOPvjYJz.mjs");
+				const { OtpInputComponent } = await import("./magmonium-one-otp-xQgDDbDC.mjs");
 				this.createDynamicComponent(seq, OtpInputComponent);
 				break;
 			}
@@ -24033,7 +24033,7 @@ var WrapperInputComponent = class WrapperInputComponent extends ConfigComponent
 				break;
 			}
 			case InputType.CHECKBOX: {
-				const { CheckboxInputComponent } = await import("./magmonium-one-checkbox-C85FEuTs.mjs").then((n) => n.n);
+				const { CheckboxInputComponent } = await import("./magmonium-one-checkbox-ZM0KfqIQ.mjs").then((n) => n.n);
 				this.createDynamicComponent(seq, CheckboxInputComponent, [], true);
 				break;
 			}
@@ -24048,12 +24048,12 @@ var WrapperInputComponent = class WrapperInputComponent extends ConfigComponent
 				break;
 			}
 			case InputType.RANGE: {
-				const { RangeInputComponent } = await import("./magmonium-one-range-Dw4YACtP.mjs").then((n) => n.n);
+				const { RangeInputComponent } = await import("./magmonium-one-range-8y-IUMjf.mjs").then((n) => n.n);
 				this.createDynamicComponent(seq, RangeInputComponent);
 				break;
 			}
 			case InputType.MULTI_RANGE: {
-				const { MultiRangeInputComponent } = await import("./magmonium-one-multi-range-DqtW4U_x.mjs").then((n) => n.n);
+				const { MultiRangeInputComponent } = await import("./magmonium-one-multi-range-BMn1iVZ4.mjs").then((n) => n.n);
 				this.createDynamicComponent(seq, MultiRangeInputComponent);
 				break;
 			}
@@ -24104,7 +24104,7 @@ var WrapperInputComponent = class WrapperInputComponent extends ConfigComponent
 				break;
 			}
 			default: {
-				const { TextInputComponent } = await import("./magmonium-one-text-CMULvvAr.mjs").then((n) => n.n);
+				const { TextInputComponent } = await import("./magmonium-one-text-BTAJl4eW.mjs").then((n) => n.n);
 				this.createDynamicComponent(seq, TextInputComponent);
 				break;
 			}
@@ -24616,7 +24616,7 @@ var RadioGroupComponent = class RadioGroupComponent extends BaseTextInputCompone
         }
       </div>
       @if (showErrors()) {
-        @for (error of errors(); track $index) {
+        @if (shownError(); as error) {
           <m-text-output
             variant="footer"
             color="error"
@@ -24717,7 +24717,7 @@ i0.ɵɵngDeclareClassMetadata({
         }
       </div>
       @if (showErrors()) {
-        @for (error of errors(); track $index) {
+        @if (shownError(); as error) {
           <m-text-output
             variant="footer"
             color="error"
@@ -25710,7 +25710,7 @@ var RatingInputComponent = class RatingInputComponent extends BaseInputComponent
 		},
 		usesInheritance: true,
 		ngImport: i0,
-		template: "@if (config(); as rating) {\n  @if (rating.label) {\n    <m-label\n      [for]=\"rating.name ?? ''\"\n      [placeholder]=\"rating.label\"\n      [params]=\"rating.params\"\n      [required]=\"required()\"\n      [disabled]=\"disabled()\"\n    />\n  }\n\n  <div\n    class=\"rating\"\n    [class.rating--error]=\"showErrors()\"\n    [class.rating--enlarge]=\"enlarged()\"\n    [style.--rating-color-filled]=\"filledColor()\"\n  >\n    <div\n      class=\"rating__stars\"\n      [class.rating__stars--interactive]=\"interactive()\"\n      [class.rating__stars--disabled]=\"disabled()\"\n      (mouseleave)=\"onLeave()\"\n    >\n      <!-- Hidden SVG for per-star gradient defs -->\n      <svg width=\"0\" height=\"0\" aria-hidden=\"true\" class=\"rating__defs\">\n        <defs>\n          @for (star of stars; track star) {\n            <linearGradient [id]=\"'star-grad-' + star\" x1=\"0%\" y1=\"0%\" x2=\"100%\" y2=\"0%\">\n              <stop [attr.offset]=\"starFill(star) + '%'\" class=\"rating__stop--filled\" />\n              <stop [attr.offset]=\"starFill(star) + '%'\" class=\"rating__stop--empty\" />\n            </linearGradient>\n          }\n        </defs>\n      </svg>\n\n      @for (star of stars; track star) {\n        <button\n          class=\"rating__star\"\n          type=\"button\"\n          [attr.aria-label]=\"'rate-star-out-of-5' | translate: { star: (star + 1).toString() }\"\n          [attr.aria-pressed]=\"(ratingValue() ?? -1) >= star\"\n          [attr.disabled]=\"(!interactive()) ? true : null\"\n          (click)=\"rate(star)\"\n          (mouseenter)=\"onHover(star)\"\n        >\n          <svg\n            class=\"rating__star-svg\"\n            viewBox=\"0 0 24 24\"\n            xmlns=\"http://www.w3.org/2000/svg\"\n            aria-hidden=\"true\"\n          >\n            <polygon\n              class=\"rating__star-shape\"\n              [attr.fill]=\"'url(#star-grad-' + star + ')'\"\n              points=\"12,2.5 15.27,9.14 22.6,10.13 17.3,15.26 18.54,22.56 12,19.13 5.46,22.56 6.7,15.26 1.4,10.13 8.73,9.14\"\n            />\n          </svg>\n        </button>\n      }\n    </div>\n  </div>\n\n  @if (showErrors()) {\n    @for (error of errors(); track $index) {\n      <m-text-output\n        variant=\"footer\"\n        color=\"error\"\n        [label]=\"error.message\"\n      />\n    }\n  }\n}\n",
+		template: "@if (config(); as rating) {\n  @if (rating.label) {\n    <m-label\n      [for]=\"rating.name ?? ''\"\n      [placeholder]=\"rating.label\"\n      [params]=\"rating.params\"\n      [required]=\"required()\"\n      [disabled]=\"disabled()\"\n    />\n  }\n\n  <div\n    class=\"rating\"\n    [class.rating--error]=\"showErrors()\"\n    [class.rating--enlarge]=\"enlarged()\"\n    [style.--rating-color-filled]=\"filledColor()\"\n  >\n    <div\n      class=\"rating__stars\"\n      [class.rating__stars--interactive]=\"interactive()\"\n      [class.rating__stars--disabled]=\"disabled()\"\n      (mouseleave)=\"onLeave()\"\n    >\n      <!-- Hidden SVG for per-star gradient defs -->\n      <svg width=\"0\" height=\"0\" aria-hidden=\"true\" class=\"rating__defs\">\n        <defs>\n          @for (star of stars; track star) {\n            <linearGradient [id]=\"'star-grad-' + star\" x1=\"0%\" y1=\"0%\" x2=\"100%\" y2=\"0%\">\n              <stop [attr.offset]=\"starFill(star) + '%'\" class=\"rating__stop--filled\" />\n              <stop [attr.offset]=\"starFill(star) + '%'\" class=\"rating__stop--empty\" />\n            </linearGradient>\n          }\n        </defs>\n      </svg>\n\n      @for (star of stars; track star) {\n        <button\n          class=\"rating__star\"\n          type=\"button\"\n          [attr.aria-label]=\"'rate-star-out-of-5' | translate: { star: (star + 1).toString() }\"\n          [attr.aria-pressed]=\"(ratingValue() ?? -1) >= star\"\n          [attr.disabled]=\"(!interactive()) ? true : null\"\n          (click)=\"rate(star)\"\n          (mouseenter)=\"onHover(star)\"\n        >\n          <svg\n            class=\"rating__star-svg\"\n            viewBox=\"0 0 24 24\"\n            xmlns=\"http://www.w3.org/2000/svg\"\n            aria-hidden=\"true\"\n          >\n            <polygon\n              class=\"rating__star-shape\"\n              [attr.fill]=\"'url(#star-grad-' + star + ')'\"\n              points=\"12,2.5 15.27,9.14 22.6,10.13 17.3,15.26 18.54,22.56 12,19.13 5.46,22.56 6.7,15.26 1.4,10.13 8.73,9.14\"\n            />\n          </svg>\n        </button>\n      }\n    </div>\n  </div>\n\n  @if (showErrors()) {\n    @if (shownError(); as error) {\n      <m-text-output\n        variant=\"footer\"\n        color=\"error\"\n        [label]=\"error.message\"\n      />\n    }\n  }\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)}}.rating{display:inline-flex;flex-direction:column;gap:6px}.rating__defs{display:block;width:0;height:0;overflow:hidden;pointer-events:none;flex-shrink:0}.rating__stop--filled{stop-color:var(--rating-color-filled, #FFB800);stop-opacity:1}.rating__stop--empty{stop-color:#e0e0e0;stop-opacity:1}.rating__stars{position:relative;display:inline-flex;align-items:center;gap:4px}.rating__star{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;padding:0;background:none;border:none;cursor:default;outline:none;flex-shrink:0}.rating__star-svg{width:28px;height:28px;display:block;filter:drop-shadow(0 1px 1px rgba(0,0,0,.08));transition:opacity .15s ease,transform .12s ease}.rating__star-shape{stroke:#0000000f;stroke-width:.5px}.rating__stars--interactive .rating__star{cursor:pointer;border-radius:4px}.rating__stars--interactive .rating__star:focus-visible{outline:2px solid var(--m-mm);outline-offset:2px;border-radius:4px}.rating__stars--interactive .rating__star:hover .rating__star-svg,.rating__stars--interactive .rating__star:focus-visible .rating__star-svg{transform:scale(1.15);filter:drop-shadow(0 2px 4px rgba(0,0,0,.18))}.rating__stars--disabled{opacity:.5;pointer-events:none}.rating__stars--disabled .rating__stop--filled{stop-color:#bdbdbd}.rating--enlarge .rating__star,.rating--enlarge .rating__star-svg{width:56px;height:56px}.rating--error .rating__stop--filled{stop-color:var(--m-error)}\n"],
 		dependencies: [
 			{
@@ -25770,7 +25770,7 @@ i0.ɵɵngDeclareClassMetadata({
 			],
 			encapsulation: ViewEncapsulation.None,
 			changeDetection: ChangeDetectionStrategy.OnPush,
-			template: "@if (config(); as rating) {\n  @if (rating.label) {\n    <m-label\n      [for]=\"rating.name ?? ''\"\n      [placeholder]=\"rating.label\"\n      [params]=\"rating.params\"\n      [required]=\"required()\"\n      [disabled]=\"disabled()\"\n    />\n  }\n\n  <div\n    class=\"rating\"\n    [class.rating--error]=\"showErrors()\"\n    [class.rating--enlarge]=\"enlarged()\"\n    [style.--rating-color-filled]=\"filledColor()\"\n  >\n    <div\n      class=\"rating__stars\"\n      [class.rating__stars--interactive]=\"interactive()\"\n      [class.rating__stars--disabled]=\"disabled()\"\n      (mouseleave)=\"onLeave()\"\n    >\n      <!-- Hidden SVG for per-star gradient defs -->\n      <svg width=\"0\" height=\"0\" aria-hidden=\"true\" class=\"rating__defs\">\n        <defs>\n          @for (star of stars; track star) {\n            <linearGradient [id]=\"'star-grad-' + star\" x1=\"0%\" y1=\"0%\" x2=\"100%\" y2=\"0%\">\n              <stop [attr.offset]=\"starFill(star) + '%'\" class=\"rating__stop--filled\" />\n              <stop [attr.offset]=\"starFill(star) + '%'\" class=\"rating__stop--empty\" />\n            </linearGradient>\n          }\n        </defs>\n      </svg>\n\n      @for (star of stars; track star) {\n        <button\n          class=\"rating__star\"\n          type=\"button\"\n          [attr.aria-label]=\"'rate-star-out-of-5' | translate: { star: (star + 1).toString() }\"\n          [attr.aria-pressed]=\"(ratingValue() ?? -1) >= star\"\n          [attr.disabled]=\"(!interactive()) ? true : null\"\n          (click)=\"rate(star)\"\n          (mouseenter)=\"onHover(star)\"\n        >\n          <svg\n            class=\"rating__star-svg\"\n            viewBox=\"0 0 24 24\"\n            xmlns=\"http://www.w3.org/2000/svg\"\n            aria-hidden=\"true\"\n          >\n            <polygon\n              class=\"rating__star-shape\"\n              [attr.fill]=\"'url(#star-grad-' + star + ')'\"\n              points=\"12,2.5 15.27,9.14 22.6,10.13 17.3,15.26 18.54,22.56 12,19.13 5.46,22.56 6.7,15.26 1.4,10.13 8.73,9.14\"\n            />\n          </svg>\n        </button>\n      }\n    </div>\n  </div>\n\n  @if (showErrors()) {\n    @for (error of errors(); track $index) {\n      <m-text-output\n        variant=\"footer\"\n        color=\"error\"\n        [label]=\"error.message\"\n      />\n    }\n  }\n}\n",
+			template: "@if (config(); as rating) {\n  @if (rating.label) {\n    <m-label\n      [for]=\"rating.name ?? ''\"\n      [placeholder]=\"rating.label\"\n      [params]=\"rating.params\"\n      [required]=\"required()\"\n      [disabled]=\"disabled()\"\n    />\n  }\n\n  <div\n    class=\"rating\"\n    [class.rating--error]=\"showErrors()\"\n    [class.rating--enlarge]=\"enlarged()\"\n    [style.--rating-color-filled]=\"filledColor()\"\n  >\n    <div\n      class=\"rating__stars\"\n      [class.rating__stars--interactive]=\"interactive()\"\n      [class.rating__stars--disabled]=\"disabled()\"\n      (mouseleave)=\"onLeave()\"\n    >\n      <!-- Hidden SVG for per-star gradient defs -->\n      <svg width=\"0\" height=\"0\" aria-hidden=\"true\" class=\"rating__defs\">\n        <defs>\n          @for (star of stars; track star) {\n            <linearGradient [id]=\"'star-grad-' + star\" x1=\"0%\" y1=\"0%\" x2=\"100%\" y2=\"0%\">\n              <stop [attr.offset]=\"starFill(star) + '%'\" class=\"rating__stop--filled\" />\n              <stop [attr.offset]=\"starFill(star) + '%'\" class=\"rating__stop--empty\" />\n            </linearGradient>\n          }\n        </defs>\n      </svg>\n\n      @for (star of stars; track star) {\n        <button\n          class=\"rating__star\"\n          type=\"button\"\n          [attr.aria-label]=\"'rate-star-out-of-5' | translate: { star: (star + 1).toString() }\"\n          [attr.aria-pressed]=\"(ratingValue() ?? -1) >= star\"\n          [attr.disabled]=\"(!interactive()) ? true : null\"\n          (click)=\"rate(star)\"\n          (mouseenter)=\"onHover(star)\"\n        >\n          <svg\n            class=\"rating__star-svg\"\n            viewBox=\"0 0 24 24\"\n            xmlns=\"http://www.w3.org/2000/svg\"\n            aria-hidden=\"true\"\n          >\n            <polygon\n              class=\"rating__star-shape\"\n              [attr.fill]=\"'url(#star-grad-' + star + ')'\"\n              points=\"12,2.5 15.27,9.14 22.6,10.13 17.3,15.26 18.54,22.56 12,19.13 5.46,22.56 6.7,15.26 1.4,10.13 8.73,9.14\"\n            />\n          </svg>\n        </button>\n      }\n    </div>\n  </div>\n\n  @if (showErrors()) {\n    @if (shownError(); as error) {\n      <m-text-output\n        variant=\"footer\"\n        color=\"error\"\n        [label]=\"error.message\"\n      />\n    }\n  }\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)}}.rating{display:inline-flex;flex-direction:column;gap:6px}.rating__defs{display:block;width:0;height:0;overflow:hidden;pointer-events:none;flex-shrink:0}.rating__stop--filled{stop-color:var(--rating-color-filled, #FFB800);stop-opacity:1}.rating__stop--empty{stop-color:#e0e0e0;stop-opacity:1}.rating__stars{position:relative;display:inline-flex;align-items:center;gap:4px}.rating__star{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;padding:0;background:none;border:none;cursor:default;outline:none;flex-shrink:0}.rating__star-svg{width:28px;height:28px;display:block;filter:drop-shadow(0 1px 1px rgba(0,0,0,.08));transition:opacity .15s ease,transform .12s ease}.rating__star-shape{stroke:#0000000f;stroke-width:.5px}.rating__stars--interactive .rating__star{cursor:pointer;border-radius:4px}.rating__stars--interactive .rating__star:focus-visible{outline:2px solid var(--m-mm);outline-offset:2px;border-radius:4px}.rating__stars--interactive .rating__star:hover .rating__star-svg,.rating__stars--interactive .rating__star:focus-visible .rating__star-svg{transform:scale(1.15);filter:drop-shadow(0 2px 4px rgba(0,0,0,.18))}.rating__stars--disabled{opacity:.5;pointer-events:none}.rating__stars--disabled .rating__stop--filled{stop-color:#bdbdbd}.rating--enlarge .rating__star,.rating--enlarge .rating__star-svg{width:56px;height:56px}.rating--error .rating__stop--filled{stop-color:var(--m-error)}\n"]
 		}]
 	}],
@@ -25952,7 +25952,7 @@ var ComponentInputComponent = class ComponentInputComponent extends BaseTextInpu
       }
       <m-button (click)="openModal()" [config]="buttonConfig()" />
       @if (showErrors()) {
-        @for (error of errors(); track $index) {
+        @if (shownError(); as error) {
           <m-text-output
             variant="footer"
             color="error"
@@ -26056,7 +26056,7 @@ i0.ɵɵngDeclareClassMetadata({
       }
       <m-button (click)="openModal()" [config]="buttonConfig()" />
       @if (showErrors()) {
-        @for (error of errors(); track $index) {
+        @if (shownError(); as error) {
           <m-text-output
             variant="footer"
             color="error"
@@ -26495,7 +26495,7 @@ var FileUploadInputComponent = class FileUploadInputComponent extends BaseInputC
 	openEditor = async (file, size) => {
 		const modalStore = this.modalStore;
 		if (!modalStore) return void 0;
-		const { ImageEditorComponent } = await import("./magmonium-one-image-editor-BAF7cdC2.mjs");
+		const { ImageEditorComponent } = await import("./magmonium-one-image-editor-C4l92aUj.mjs");
 		const ratio = String(this.config()?.ratio ?? "");
 		return new Promise((resolve) => {
 			const modalRef = new ModalRef();
@@ -26671,7 +26671,7 @@ var FileUploadInputComponent = class FileUploadInputComponent extends BaseInputC
         />
       }
       @if (showErrors()) {
-        @for (error of errors(); track $index) {
+        @if (shownError(); as error) {
           <m-text-output
             variant="footer"
             color="error"
@@ -26881,7 +26881,7 @@ i0.ɵɵngDeclareClassMetadata({
         />
       }
       @if (showErrors()) {
-        @for (error of errors(); track $index) {
+        @if (shownError(); as error) {
           <m-text-output
             variant="footer"
             color="error"