@kirbydesign/designsystem 11.5.0 → 11.6.0

package/fesm2022/kirbydesign-designsystem-radio.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"kirbydesign-designsystem-radio.mjs","sources":["../../radio/src/radio.component.ts","../../radio/src/radio.component.html","../../radio/src/radio-group/radio-group.component.ts","../../radio/src/radio-group/radio-group.component.html","../../radio/src/radio-module.ts","../../radio/src/kirbydesign-designsystem-radio.ts"],"sourcesContent":["import {\n  AfterContentInit,\n  AfterViewInit,\n  ChangeDetectionStrategy,\n  Component,\n  ElementRef,\n  HostBinding,\n  Input,\n  OnInit,\n  ViewChild,\n} from '@angular/core';\nimport { IonRadio } from '@ionic/angular/standalone';\nimport { IonicElementPartHelper } from '@kirbydesign/designsystem/helpers';\nimport { inheritAriaLabelText, setAccessibleLabel } from '@kirbydesign/designsystem/shared';\n\n@Component({\n  selector: 'kirby-radio',\n  templateUrl: './radio.component.html',\n  styleUrls: ['./radio.component.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  providers: [IonicElementPartHelper],\n  imports: [IonRadio],\n})\nexport class RadioComponent implements AfterViewInit, OnInit, AfterContentInit {\n  @ViewChild(IonRadio, { read: ElementRef, static: true })\n  private ionRadioElement?: ElementRef<HTMLIonRadioElement>;\n\n  @Input()\n  value: any;\n\n  @Input()\n  text: string;\n\n  @HostBinding('class')\n  @Input()\n  size: 'xs' | 'sm' | 'md' = 'md';\n\n  @Input()\n  disabled: boolean;\n  @HostBinding('attr.disabled')\n  get _isDisabled() {\n    return this.disabled ? 'disabled' : null;\n  }\n\n  @HostBinding('class.has-hidden-label') _labelText: string;\n\n  get buttonTabIndex(): number {\n    return this.ionRadioElement ? this.ionRadioElement.nativeElement.tabIndex : -1;\n  }\n\n  _justify: 'start' | 'end' | 'space-between' = 'start';\n  _labelPlacement: 'end' | 'fixed' | 'stacked' | 'start' = 'end';\n  _hasSlottedContent: boolean;\n\n  constructor(\n    private element: ElementRef<HTMLElement>,\n    private ionicElementPartHelper: IonicElementPartHelper\n  ) {}\n\n  ngOnInit(): void {\n    /**\n     * We cannot query ion-checkbox for slotted content at this point as the slot has not been rendered.\n     * But we need to know if content is slotted to set justify and labelPlacement BEFORE ion-checkbox is rendered.\n     * So it has to be done by querying an additional wrapper around the default content slot like this.\n     */\n    this._hasSlottedContent = this.element.nativeElement\n      .querySelector('.default-content')\n      .hasChildNodes();\n\n    const slot = this.element.nativeElement.getAttribute('slot');\n    if (slot === 'end' && this._hasSlottedContent) {\n      this._justify = 'space-between';\n      this._labelPlacement = 'start';\n    }\n  }\n\n  ngAfterViewInit(): void {\n    this.ionicElementPartHelper.setPart('label', this.ionRadioElement, '.radio-wrapper');\n    this.ionicElementPartHelper.setPart(\n      'label-text-wrapper',\n      this.ionRadioElement,\n      '.label-text-wrapper'\n    );\n    this.ionicElementPartHelper.setPart('native-wrapper', this.ionRadioElement, '.native-wrapper');\n  }\n\n  ngAfterContentInit(): void {\n    this._labelText = inheritAriaLabelText(this.element.nativeElement);\n\n    if (!this.text && !this._labelText && !this._hasSlottedContent) {\n      // if no label has been set try to find a label in an item and use its text content\n      this._labelText = setAccessibleLabel(this.element.nativeElement);\n    }\n  }\n\n  focus() {\n    this.ionRadioElement?.nativeElement.focus();\n  }\n}\n","<ion-radio\n  [value]=\"value\"\n  [disabled]=\"disabled\"\n  mode=\"md\"\n  [labelPlacement]=\"_labelPlacement\"\n  [justify]=\"_justify\"\n>\n  @if (_labelText) {\n    <span class=\"hidden-label\">{{ _labelText }}</span>\n  }\n  @if (text) {\n    <span [attr.aria-hidden]=\"_labelText ? true : undefined\">{{ text }}</span>\n  }\n  <span class=\"default-content\" [attr.aria-hidden]=\"_labelText ? true : undefined\">\n    <ng-content></ng-content>\n  </span>\n</ion-radio>\n","import {\n  AfterContentInit,\n  AfterViewInit,\n  ChangeDetectionStrategy,\n  ChangeDetectorRef,\n  ContentChild,\n  ContentChildren,\n  ElementRef,\n  EventEmitter,\n  HostBinding,\n  Output,\n  QueryList,\n  Renderer2,\n  TemplateRef,\n  ViewChildren,\n} from '@angular/core';\nimport { Component, HostListener, Input } from '@angular/core';\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\nimport { ListItemTemplateDirective } from '@kirbydesign/designsystem/list';\nimport { FormFieldControl } from '@kirbydesign/designsystem/types';\n\nimport { forwardAttributes } from '@kirbydesign/designsystem/shared';\nimport { IonRadioGroup } from '@ionic/angular/standalone';\nimport { NgTemplateOutlet } from '@angular/common';\nimport { RadioComponent } from '../radio.component';\n\n@Component({\n  selector: 'kirby-radio-group',\n  templateUrl: './radio-group.component.html',\n  styles: ['ion-radio-group { display: inherit; flex-wrap: inherit}'],\n  providers: [\n    {\n      provide: NG_VALUE_ACCESSOR,\n      useExisting: RadioGroupComponent,\n      multi: true,\n    },\n  ],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  imports: [IonRadioGroup, NgTemplateOutlet, RadioComponent],\n})\nexport class RadioGroupComponent\n  implements AfterContentInit, ControlValueAccessor, FormFieldControl, AfterViewInit\n{\n  constructor(\n    private cdr: ChangeDetectorRef,\n    private element: ElementRef<HTMLElement>,\n    private renderer: Renderer2\n  ) {}\n\n  // #region public properties\n\n  get disabled(): boolean {\n    return this._disabled;\n  }\n\n  @Input() set disabled(value: boolean) {\n    this._disabled = value;\n    this.setProjectedRadiosDisabledState(value);\n  }\n\n  private _hasError: boolean = false;\n\n  @HostBinding('class.error')\n  @Input()\n  get hasError(): boolean {\n    return this._hasError;\n  }\n\n  set hasError(value: boolean) {\n    if (this._hasError !== value) {\n      this._hasError = value;\n      this.hasErrorChange.emit(this._hasError);\n    }\n  }\n\n  @Output() hasErrorChange = new EventEmitter<boolean>();\n\n  get items(): string[] | any[] {\n    return this._items || []; // Ensure items return empty array even if set to null/undefined\n  }\n\n  @Input() set items(value: string[] | any[]) {\n    if ((!value || !value.length) && !this.items.length) return; // Nothing changed, no items before or after\n    this._items = value;\n    this.refreshSelectionState();\n  }\n\n  @Input()\n  itemTextProperty = 'text';\n\n  @Input()\n  itemDisabledProperty = 'disabled';\n\n  get selectedIndex(): number {\n    return this._selectedIndex;\n  }\n\n  @Input() set selectedIndex(value: number) {\n    if (typeof value === 'string') value = parseInt(value); // Ensure data type number, e.g. when used with template syntax without binding: <... selectedIndex=\"1\"\n    if (value === undefined || value === null || Number.isNaN(value)) value = -1;\n    if (value === this.selectedIndex) return;\n    this._selectedIndex = value;\n    this._value = this.getValueFromSelectedIndex() || null;\n  }\n\n  get value(): string | any {\n    return this._value;\n  }\n\n  @Input() set value(value: string | any) {\n    this.setSelectedItem(value);\n  }\n\n  private get hasValue(): boolean {\n    return this.value !== undefined && this.value !== null;\n  }\n\n  /**\n   * Emitted when an option is selected\n   */\n  @Output() valueChange: EventEmitter<string | any> = new EventEmitter<string | any>();\n  // #endregion public properties\n\n  // #region \"protected\" properties used by template\n  @ContentChild(ListItemTemplateDirective, { read: TemplateRef })\n  _customItemTemplate: TemplateRef<any>;\n  // #endregion \"protected\" properties used by template\n\n  // #region private fields\n  private _disabled = false;\n  private _items: string[] | any[] = [];\n  private _onChangeCallback: (value: any) => void = () => {};\n  private _onTouched = () => {};\n  private _selectedIndex: number = -1;\n  private _value?: string | any = null;\n  private _attributesToForward = ['aria-label', 'aria-labelledby'];\n\n  @ViewChildren(RadioComponent)\n  private radioButtons: QueryList<RadioComponent>;\n  @ContentChildren(RadioComponent, { descendants: true })\n  private projectedRadioButtons: QueryList<RadioComponent>;\n\n  private get hasItemsFromContentProjection(): boolean {\n    return (\n      !this.items.length &&\n      !this._customItemTemplate &&\n      this.projectedRadioButtons &&\n      this.projectedRadioButtons.length > 0\n    );\n  }\n\n  // #endregion private fields\n\n  // #region public methods\n  focus() {\n    const findFocusable = (radios: QueryList<RadioComponent>) =>\n      radios && radios.find((radio) => !isNaN(radio.buttonTabIndex) && radio.buttonTabIndex !== -1);\n    const focusable = findFocusable(this.radioButtons) || findFocusable(this.projectedRadioButtons);\n    focusable?.focus();\n  }\n\n  ngAfterContentInit(): void {\n    this.initSelectionStateFromProjectedContent();\n    this.listenForProjectedRadiosChange();\n  }\n\n  ngAfterViewInit(): void {\n    forwardAttributes(\n      this.element.nativeElement,\n      this._attributesToForward,\n      this.renderer,\n      this.element.nativeElement.querySelector('ion-radio-group')\n    );\n  }\n\n  registerOnChange(fn: any): void {\n    this._onChangeCallback = fn;\n  }\n\n  registerOnTouched(fn: any): void {\n    this._onTouched = fn;\n  }\n\n  setDisabledState(isDisabled: boolean) {\n    this.disabled = isDisabled;\n    this.cdr.markForCheck();\n  }\n\n  writeValue(value: any): void {\n    this.value = value;\n    this.cdr.markForCheck();\n  }\n\n  // #endregion public methods\n\n  // #region \"protected\" methods used by template\n  _getTextFromItem(item: string | any): string {\n    if (!item) return null;\n    return typeof item === 'string' ? item : item[this.itemTextProperty];\n  }\n\n  _getDisabledStateFromItem(item: string | any): boolean {\n    if (!item) return undefined;\n    return typeof item === 'string' ? undefined : item[this.itemDisabledProperty];\n  }\n\n  get _hasItems(): boolean {\n    return this.items.length > 0 || this.hasItemsFromContentProjection;\n  }\n\n  _onChange(value: string | any) {\n    if (value === this._value) return;\n    this.setSelectedItem(value);\n    this.valueChange.emit(value);\n    this._onChangeCallback(value);\n  }\n\n  @HostListener('ionBlur')\n  _onRadioBlur() {\n    this._onTouched();\n  }\n\n  // #endregion \"protected\" methods used by template\n\n  // #region private methods\n  private getIndexOfSelectedValue() {\n    if (!this.hasValue) return -1;\n    return this.hasItemsFromContentProjection\n      ? this.getIndexOfProjectedRadio(this.value)\n      : this.items.indexOf(this.value);\n  }\n\n  private getIndexOfProjectedRadio(value: string | any): number {\n    let selectedIndex = -1;\n    this.projectedRadioButtons?.find((radio, i) => {\n      const found = radio.value === value;\n      if (found) {\n        selectedIndex = i;\n      }\n      return found;\n    });\n    return selectedIndex;\n  }\n\n  private getValueFromSelectedIndex(): string | any {\n    if (this.selectedIndex === -1) return;\n    return this.hasItemsFromContentProjection\n      ? this.getValueFromProjectedRadios(this.selectedIndex)\n      : this.items[this.selectedIndex];\n  }\n\n  private getValueFromProjectedRadios(index: number): string | any {\n    const radio =\n      this.projectedRadioButtons &&\n      this.projectedRadioButtons.find((_, i) => {\n        return i === index;\n      });\n    return radio && radio.value;\n  }\n\n  private initSelectionStateFromProjectedContent() {\n    if (this.hasItemsFromContentProjection) {\n      this.refreshSelectionState(); // Initialize selected index and value from projected radios\n    }\n  }\n\n  private listenForProjectedRadiosChange() {\n    this.projectedRadioButtons.changes.subscribe(() => {\n      this.refreshStateFromProjectedContent();\n\n      if (this.disabled) {\n        // Ensure disabled state propagates when re-rendering projected radios.\n        // setTimeout prevents ExpressionChangedAfterItHasBeenCheckedError when updating the DOM in QueryList.changes:\n        setTimeout(() => this.setProjectedRadiosDisabledState(this.disabled));\n      }\n    });\n  }\n\n  private refreshSelectionState() {\n    if (this.hasValue) {\n      this._selectedIndex = this.getIndexOfSelectedValue(); // Ensure selectedIndex reflects value within items\n    }\n\n    const valueFromSelectedIndex = this.getValueFromSelectedIndex();\n    this._value = valueFromSelectedIndex !== undefined ? valueFromSelectedIndex : null;\n  }\n\n  private refreshStateFromProjectedContent() {\n    if (this._customItemTemplate) return; // Only refresh on changes to projected content, not when re-rendering custom template\n    this.cdr.markForCheck(); // Ensure changes to projected content gets checked in next change detection cycle\n    this.refreshSelectionState(); // Sync selected index and value from projected radios\n  }\n\n  private setSelectedItem(value: string | any) {\n    if (value === this._value) return; // Nothing changed\n    this._value = value;\n    this._selectedIndex = this.getIndexOfSelectedValue();\n  }\n\n  private setProjectedRadiosDisabledState(isDisabled: boolean) {\n    if (!this.projectedRadioButtons || !this.projectedRadioButtons.length) return;\n    this.projectedRadioButtons.forEach((radio, index) => {\n      // Disable all radios when group is disabled, otherwise fall back to each item's disabled state, if defined:\n      radio.disabled = isDisabled || this._getDisabledStateFromItem(this.items[index]);\n    });\n  }\n\n  // #endregion private methods\n}\n","@if (_hasItems) {\n  <ion-radio-group\n    [value]=\"value\"\n    (ionChange)=\"_onChange($event.detail.value)\"\n    [attr.aria-invalid]=\"hasError\"\n  >\n    @if (!items || !items.length) {\n      <ng-content></ng-content>\n    } @else {\n      @for (item of items; track _getTextFromItem(item)) {\n        <ng-container\n          *ngTemplateOutlet=\"\n            _customItemTemplate || defaultItemTemplate;\n            context: { $implicit: item, selected: $index === selectedIndex, index: $index }\n          \"\n        ></ng-container>\n      }\n    }\n  </ion-radio-group>\n}\n\n<ng-template #defaultItemTemplate let-item>\n  <kirby-radio\n    [value]=\"item\"\n    [disabled]=\"disabled || _getDisabledStateFromItem(item)\"\n    [text]=\"_getTextFromItem(item)\"\n  ></kirby-radio>\n</ng-template>\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { IonRadio, IonRadioGroup } from '@ionic/angular/standalone';\nimport { RadioGroupComponent } from './radio-group/radio-group.component';\nimport { RadioComponent } from './radio.component';\n\nconst declarations = [RadioComponent, RadioGroupComponent];\n\n@NgModule({\n  imports: [CommonModule, IonRadio, IonRadioGroup, ...declarations],\n  exports: [...declarations],\n})\nexport class RadioModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"kirbydesign-designsystem-radio.mjs","sources":["../../radio/src/radio.component.ts","../../radio/src/radio.component.html","../../radio/src/radio-group/radio-group.component.ts","../../radio/src/radio-group/radio-group.component.html","../../radio/src/radio-module.ts","../../radio/src/kirbydesign-designsystem-radio.ts"],"sourcesContent":["import {\n  AfterContentInit,\n  AfterViewInit,\n  ChangeDetectionStrategy,\n  Component,\n  ElementRef,\n  HostBinding,\n  Input,\n  OnInit,\n  ViewChild,\n} from '@angular/core';\nimport { IonRadio } from '@ionic/angular/standalone';\nimport { IonicElementPartHelper } from '@kirbydesign/designsystem/helpers';\nimport { inheritAriaLabelText, setAccessibleLabel } from '@kirbydesign/designsystem/shared';\n\n@Component({\n  selector: 'kirby-radio',\n  templateUrl: './radio.component.html',\n  styleUrls: ['./radio.component.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  providers: [IonicElementPartHelper],\n  imports: [IonRadio],\n})\nexport class RadioComponent implements AfterViewInit, OnInit, AfterContentInit {\n  @ViewChild(IonRadio, { read: ElementRef, static: true })\n  private ionRadioElement?: ElementRef<HTMLIonRadioElement>;\n\n  @Input()\n  value: any;\n\n  @Input()\n  text: string;\n\n  @HostBinding('class')\n  @Input()\n  size: 'xs' | 'sm' | 'md' = 'md';\n\n  @Input()\n  disabled: boolean;\n  @HostBinding('attr.disabled')\n  get _isDisabled() {\n    return this.disabled ? 'disabled' : null;\n  }\n\n  @HostBinding('class.has-hidden-label') _labelText: string;\n\n  get buttonTabIndex(): number {\n    return this.ionRadioElement ? this.ionRadioElement.nativeElement.tabIndex : -1;\n  }\n\n  _justify: 'start' | 'end' | 'space-between' = 'start';\n  _labelPlacement: 'end' | 'fixed' | 'stacked' | 'start' = 'end';\n  _hasSlottedContent: boolean;\n\n  constructor(\n    private element: ElementRef<HTMLElement>,\n    private ionicElementPartHelper: IonicElementPartHelper\n  ) {}\n\n  ngOnInit(): void {\n    /**\n     * We cannot query ion-checkbox for slotted content at this point as the slot has not been rendered.\n     * But we need to know if content is slotted to set justify and labelPlacement BEFORE ion-checkbox is rendered.\n     * So it has to be done by querying an additional wrapper around the default content slot like this.\n     */\n    this._hasSlottedContent = this.element.nativeElement\n      .querySelector('.default-content')\n      .hasChildNodes();\n\n    const slot = this.element.nativeElement.getAttribute('slot');\n    if (slot === 'end' && this._hasSlottedContent) {\n      this._justify = 'space-between';\n      this._labelPlacement = 'start';\n    }\n  }\n\n  ngAfterViewInit(): void {\n    this.ionicElementPartHelper.setPart('label', this.ionRadioElement, '.radio-wrapper');\n    this.ionicElementPartHelper.setPart(\n      'label-text-wrapper',\n      this.ionRadioElement,\n      '.label-text-wrapper'\n    );\n    this.ionicElementPartHelper.setPart('native-wrapper', this.ionRadioElement, '.native-wrapper');\n  }\n\n  ngAfterContentInit(): void {\n    this._labelText = inheritAriaLabelText(this.element.nativeElement);\n\n    if (!this.text && !this._labelText && !this._hasSlottedContent) {\n      // if no label has been set try to find a label in an item and use its text content\n      this._labelText = setAccessibleLabel(this.element.nativeElement);\n    }\n  }\n\n  focus() {\n    this.ionRadioElement?.nativeElement.focus();\n  }\n}\n","<ion-radio\n  [value]=\"value\"\n  [disabled]=\"disabled\"\n  mode=\"md\"\n  [labelPlacement]=\"_labelPlacement\"\n  [justify]=\"_justify\"\n>\n  @if (_labelText) {\n    <span class=\"hidden-label\">{{ _labelText }}</span>\n  }\n  @if (text) {\n    <span [attr.aria-hidden]=\"_labelText ? true : undefined\">{{ text }}</span>\n  }\n  <span class=\"default-content\" [attr.aria-hidden]=\"_labelText ? true : undefined\">\n    <ng-content></ng-content>\n  </span>\n</ion-radio>\n","import {\n  AfterContentInit,\n  AfterViewInit,\n  ChangeDetectionStrategy,\n  ChangeDetectorRef,\n  ContentChild,\n  ContentChildren,\n  ElementRef,\n  EventEmitter,\n  HostBinding,\n  Output,\n  QueryList,\n  Renderer2,\n  TemplateRef,\n  ViewChildren,\n} from '@angular/core';\nimport { Component, HostListener, Input } from '@angular/core';\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\nimport { ListItemTemplateDirective } from '@kirbydesign/designsystem/list';\nimport { FormFieldControl } from '@kirbydesign/designsystem/types';\n\nimport { forwardAttributes } from '@kirbydesign/designsystem/shared';\nimport { IonRadioGroup } from '@ionic/angular/standalone';\nimport { NgTemplateOutlet } from '@angular/common';\nimport { RadioComponent } from '../radio.component';\n\n@Component({\n  selector: 'kirby-radio-group',\n  templateUrl: './radio-group.component.html',\n  styles: ['ion-radio-group { display: inherit; flex-wrap: inherit}'],\n  providers: [\n    {\n      provide: NG_VALUE_ACCESSOR,\n      useExisting: RadioGroupComponent,\n      multi: true,\n    },\n  ],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  imports: [IonRadioGroup, NgTemplateOutlet, RadioComponent],\n})\nexport class RadioGroupComponent\n  implements AfterContentInit, ControlValueAccessor, FormFieldControl, AfterViewInit\n{\n  constructor(\n    private cdr: ChangeDetectorRef,\n    private element: ElementRef<HTMLElement>,\n    private renderer: Renderer2\n  ) {}\n\n  // #region public properties\n\n  get disabled(): boolean {\n    return this._disabled;\n  }\n\n  @Input() set disabled(value: boolean) {\n    this._disabled = value;\n    this.setProjectedRadiosDisabledState(value);\n  }\n\n  private _hasError: boolean = false;\n\n  @HostBinding('class.error')\n  @Input()\n  get hasError(): boolean {\n    return this._hasError;\n  }\n\n  set hasError(value: boolean) {\n    if (this._hasError !== value) {\n      this._hasError = value;\n      this.hasErrorChange.emit(this._hasError);\n    }\n  }\n\n  @Output() hasErrorChange = new EventEmitter<boolean>();\n\n  get items(): string[] | any[] {\n    return this._items || []; // Ensure items return empty array even if set to null/undefined\n  }\n\n  @Input() set items(value: string[] | any[]) {\n    if ((!value || !value.length) && !this.items.length) return; // Nothing changed, no items before or after\n    this._items = value;\n    this.refreshSelectionState();\n  }\n\n  @Input()\n  itemTextProperty = 'text';\n\n  @Input()\n  itemDisabledProperty = 'disabled';\n\n  get selectedIndex(): number {\n    return this._selectedIndex;\n  }\n\n  @Input() set selectedIndex(value: number) {\n    if (typeof value === 'string') value = parseInt(value); // Ensure data type number, e.g. when used with template syntax without binding: <... selectedIndex=\"1\"\n    if (value === undefined || value === null || Number.isNaN(value)) value = -1;\n    if (value === this.selectedIndex) return;\n    this._selectedIndex = value;\n    this._value = this.getValueFromSelectedIndex() || null;\n  }\n\n  get value(): string | any {\n    return this._value;\n  }\n\n  @Input() set value(value: string | any) {\n    this.setSelectedItem(value);\n  }\n\n  private get hasValue(): boolean {\n    return this.value !== undefined && this.value !== null;\n  }\n\n  /**\n   * Emitted when an option is selected\n   */\n  @Output() valueChange: EventEmitter<string | any> = new EventEmitter<string | any>();\n  // #endregion public properties\n\n  // #region \"protected\" properties used by template\n  @ContentChild(ListItemTemplateDirective, { read: TemplateRef })\n  _customItemTemplate: TemplateRef<any>;\n  // #endregion \"protected\" properties used by template\n\n  // #region private fields\n  private _disabled = false;\n  private _items: string[] | any[] = [];\n  private _onChangeCallback: (value: any) => void = () => {};\n  private _onTouched = () => {};\n  private _selectedIndex: number = -1;\n  private _value?: string | any = null;\n  private _attributesToForward = ['aria-label', 'aria-labelledby'];\n\n  @ViewChildren(RadioComponent)\n  private radioButtons: QueryList<RadioComponent>;\n  @ContentChildren(RadioComponent, { descendants: true })\n  private projectedRadioButtons: QueryList<RadioComponent>;\n\n  private get hasItemsFromContentProjection(): boolean {\n    return (\n      !this.items.length &&\n      !this._customItemTemplate &&\n      this.projectedRadioButtons &&\n      this.projectedRadioButtons.length > 0\n    );\n  }\n\n  // #endregion private fields\n\n  // #region public methods\n  focus() {\n    const findFocusable = (radios: QueryList<RadioComponent>) =>\n      radios && radios.find((radio) => !isNaN(radio.buttonTabIndex) && radio.buttonTabIndex !== -1);\n    const focusable = findFocusable(this.radioButtons) || findFocusable(this.projectedRadioButtons);\n    focusable?.focus();\n  }\n\n  ngAfterContentInit(): void {\n    this.initSelectionStateFromProjectedContent();\n    this.listenForProjectedRadiosChange();\n  }\n\n  ngAfterViewInit(): void {\n    forwardAttributes(\n      this.element.nativeElement,\n      this._attributesToForward,\n      this.renderer,\n      this.element.nativeElement.querySelector('ion-radio-group')\n    );\n  }\n\n  registerOnChange(fn: any): void {\n    this._onChangeCallback = fn;\n  }\n\n  registerOnTouched(fn: any): void {\n    this._onTouched = fn;\n  }\n\n  setDisabledState(isDisabled: boolean) {\n    this.disabled = isDisabled;\n    this.cdr.markForCheck();\n  }\n\n  writeValue(value: any): void {\n    this.value = value;\n    this.cdr.markForCheck();\n  }\n\n  // #endregion public methods\n\n  // #region \"protected\" methods used by template\n  _getTextFromItem(item: string | any): string {\n    if (!item) return null;\n    return typeof item === 'string' ? item : item[this.itemTextProperty];\n  }\n\n  _getDisabledStateFromItem(item: string | any): boolean {\n    if (!item) return undefined;\n    return typeof item === 'string' ? undefined : item[this.itemDisabledProperty];\n  }\n\n  get _hasItems(): boolean {\n    return this.items.length > 0 || this.hasItemsFromContentProjection;\n  }\n\n  _onChange(value: string | any) {\n    if (value === this._value) return;\n    this.setSelectedItem(value);\n    this.valueChange.emit(value);\n    this._onChangeCallback(value);\n  }\n\n  @HostListener('ionBlur')\n  _onRadioBlur() {\n    this._onTouched();\n  }\n\n  // #endregion \"protected\" methods used by template\n\n  // #region private methods\n  private getIndexOfSelectedValue() {\n    if (!this.hasValue) return -1;\n    return this.hasItemsFromContentProjection\n      ? this.getIndexOfProjectedRadio(this.value)\n      : this.items.indexOf(this.value);\n  }\n\n  private getIndexOfProjectedRadio(value: string | any): number {\n    let selectedIndex = -1;\n    this.projectedRadioButtons?.find((radio, i) => {\n      const found = radio.value === value;\n      if (found) {\n        selectedIndex = i;\n      }\n      return found;\n    });\n    return selectedIndex;\n  }\n\n  private getValueFromSelectedIndex(): string | any {\n    if (this.selectedIndex === -1) return;\n    return this.hasItemsFromContentProjection\n      ? this.getValueFromProjectedRadios(this.selectedIndex)\n      : this.items[this.selectedIndex];\n  }\n\n  private getValueFromProjectedRadios(index: number): string | any {\n    const radio =\n      this.projectedRadioButtons &&\n      this.projectedRadioButtons.find((_, i) => {\n        return i === index;\n      });\n    return radio && radio.value;\n  }\n\n  private initSelectionStateFromProjectedContent() {\n    if (this.hasItemsFromContentProjection) {\n      this.refreshSelectionState(); // Initialize selected index and value from projected radios\n    }\n  }\n\n  private listenForProjectedRadiosChange() {\n    this.projectedRadioButtons.changes.subscribe(() => {\n      this.refreshStateFromProjectedContent();\n\n      if (this.disabled) {\n        // Ensure disabled state propagates when re-rendering projected radios.\n        // setTimeout prevents ExpressionChangedAfterItHasBeenCheckedError when updating the DOM in QueryList.changes:\n        setTimeout(() => this.setProjectedRadiosDisabledState(this.disabled));\n      }\n    });\n  }\n\n  private refreshSelectionState() {\n    if (this.hasValue) {\n      this._selectedIndex = this.getIndexOfSelectedValue(); // Ensure selectedIndex reflects value within items\n    }\n\n    const valueFromSelectedIndex = this.getValueFromSelectedIndex();\n    this._value = valueFromSelectedIndex !== undefined ? valueFromSelectedIndex : null;\n  }\n\n  private refreshStateFromProjectedContent() {\n    if (this._customItemTemplate) return; // Only refresh on changes to projected content, not when re-rendering custom template\n    this.cdr.markForCheck(); // Ensure changes to projected content gets checked in next change detection cycle\n    this.refreshSelectionState(); // Sync selected index and value from projected radios\n  }\n\n  private setSelectedItem(value: string | any) {\n    if (value === this._value) return; // Nothing changed\n    this._value = value;\n    this._selectedIndex = this.getIndexOfSelectedValue();\n  }\n\n  private setProjectedRadiosDisabledState(isDisabled: boolean) {\n    if (!this.projectedRadioButtons || !this.projectedRadioButtons.length) return;\n    this.projectedRadioButtons.forEach((radio, index) => {\n      // Disable all radios when group is disabled, otherwise fall back to each item's disabled state, if defined:\n      radio.disabled = isDisabled || this._getDisabledStateFromItem(this.items[index]);\n    });\n  }\n\n  // #endregion private methods\n}\n","@if (_hasItems) {\n  <ion-radio-group\n    [value]=\"value\"\n    (ionChange)=\"_onChange($event.detail.value)\"\n    [attr.aria-invalid]=\"hasError\"\n  >\n    @if (!items || !items.length) {\n      <ng-content></ng-content>\n    } @else {\n      @for (item of items; track _getTextFromItem(item)) {\n        <ng-container\n          *ngTemplateOutlet=\"\n            _customItemTemplate || defaultItemTemplate;\n            context: { $implicit: item, selected: $index === selectedIndex, index: $index }\n          \"\n        ></ng-container>\n      }\n    }\n  </ion-radio-group>\n}\n\n<ng-template #defaultItemTemplate let-item>\n  <kirby-radio\n    [value]=\"item\"\n    [disabled]=\"disabled || _getDisabledStateFromItem(item)\"\n    [text]=\"_getTextFromItem(item)\"\n  ></kirby-radio>\n</ng-template>\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { IonRadio, IonRadioGroup } from '@ionic/angular/standalone';\nimport { RadioGroupComponent } from './radio-group/radio-group.component';\nimport { RadioComponent } from './radio.component';\n\nconst declarations = [RadioComponent, RadioGroupComponent];\n\n@NgModule({\n  imports: [CommonModule, IonRadio, IonRadioGroup, ...declarations],\n  exports: [...declarations],\n})\nexport class RadioModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}

package/fesm2022/kirbydesign-designsystem-range.mjs

@@ -94,16 +94,16 @@ class RangeComponent {
     registerOnChange(fn) {
         this.propagateChange = fn;
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: RangeComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: RangeComponent, isStandalone: true, selector: "kirby-range", inputs: { minLabel: "minLabel", maxLabel: "maxLabel", debounce: "debounce", max: "max", min: "min", pin: "pin", step: "step", ticks: "ticks", disabled: "disabled", pinFormatter: "pinFormatter", value: "value" }, outputs: { change: "change", move: "move" }, providers: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: RangeComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.4", type: RangeComponent, isStandalone: true, selector: "kirby-range", inputs: { minLabel: "minLabel", maxLabel: "maxLabel", debounce: "debounce", max: "max", min: "min", pin: "pin", step: "step", ticks: "ticks", disabled: "disabled", pinFormatter: "pinFormatter", value: "value" }, outputs: { change: "change", move: "move" }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 multi: true,
                 useExisting: forwardRef((() => RangeComponent)),
             },
-        ], viewQueries: [{ propertyName: "ionRange", first: true, predicate: IonRange, descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: "<ion-range\n  (ionChange)=\"_onRangeValueChange($event)\"\n  [min]=\"min\"\n  [max]=\"max\"\n  [step]=\"step\"\n  [value]=\"value\"\n  [pin]=\"pin\"\n  [pinFormatter]=\"pinFormatter\"\n  [snaps]=\"ticks\"\n  [ticks]=\"ticks\"\n  [debounce]=\"debounce\"\n  [disabled]=\"disabled\"\n></ion-range>\n\n@if (minLabel) {\n  <label class=\"min-label\">{{ minLabel }}</label>\n}\n@if (maxLabel) {\n  <label class=\"max-label\">{{ maxLabel }}</label>\n}\n", styles: [":host{display:flex;justify-content:space-between;flex-wrap:wrap}@media(hover:hover)and (pointer:fine){ion-range:focus-within::part(knob){transition:all 80ms linear 0ms;box-shadow:0 5px 10px #1c1c1c4d,0 0 5px #1c1c1c14,0 0 0 2px var(--kirby-background-color),0 0 0 4px #4d90fe}}@media(hover:hover){ion-range:hover{--state-layer-opacity: .08;--state-layer-background-color: var(--kirby-black);cursor:pointer;--knob-background: rgb(234.6, 234.6, 234.6)}}ion-range:active,ion-range.interaction-state-active{--state-layer-opacity: .12;--state-layer-background-color: var(--kirby-black);--knob-background: rgb(214.2, 214.2, 214.2)}ion-range{--knob-background: var(--kirby-white);--knob-box-shadow: 0 5px 10px 0 rgba(28, 28, 28, .3), 0 0 5px 0 rgba(28, 28, 28, .08);--knob-size: 24px;--pin-color: var(--kirby-text-color-black);--pin-background: var(--kirby-semi-light);--bar-background: var(--kirby-medium);--bar-background-active: var(--kirby-dark);--bar-border-radius: 4px;--bar-height: 2px;flex:1 1 100%;padding:0}ion-range.range-disabled{--knob-background: var(--kirby-medium);--knob-box-shadow: none;--bar-background: var(--kirby-semi-light);--bar-background-active: var(--kirby-medium)}ion-range.range-disabled::part(tick){background:var(--kirby-semi-light)}ion-range.range-has-pin{padding:0 3px}ion-range::part(knob){transition:all 80ms linear 0ms;transition-property:background}ion-range::part(pin){font-size:12px;color:var(--pin-color);background-color:var(--pin-background);padding:2px 8px;border-radius:4px;min-width:24px;top:-12px}ion-range::part(pin):before{content:\"\";position:absolute;top:100%;left:50%;transform:translate(-50%);display:block;border:solid transparent 6px;border-top-color:var(--pin-background)}ion-range::part(tick),ion-range::part(tick-active){border-radius:50%;width:6px;height:6px;margin-top:1px;z-index:1;margin-inline-start:-3px}ion-range::part(tick){background:var(--kirby-medium)}label{font-size:12px;line-height:16px;color:var(--kirby-text-color-semi-dark);margin-top:-4px}\n"], dependencies: [{ kind: "component", type: IonRange, selector: "ion-range", inputs: ["activeBarStart", "color", "debounce", "disabled", "dualKnobs", "label", "labelPlacement", "max", "min", "mode", "name", "pin", "pinFormatter", "snaps", "step", "ticks", "value"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+        ], viewQueries: [{ propertyName: "ionRange", first: true, predicate: IonRange, descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: "<ion-range\n  (ionChange)=\"_onRangeValueChange($event)\"\n  [min]=\"min\"\n  [max]=\"max\"\n  [step]=\"step\"\n  [value]=\"value\"\n  [pin]=\"pin\"\n  [pinFormatter]=\"pinFormatter\"\n  [snaps]=\"ticks\"\n  [ticks]=\"ticks\"\n  [debounce]=\"debounce\"\n  [disabled]=\"disabled\"\n></ion-range>\n\n@if (minLabel) {\n  <label class=\"min-label\">{{ minLabel }}</label>\n}\n@if (maxLabel) {\n  <label class=\"max-label\">{{ maxLabel }}</label>\n}\n", styles: [":host{display:flex;justify-content:space-between;flex-wrap:wrap}@media(hover:hover)and (pointer:fine){ion-range:focus-within::part(knob):focus-visible{transition:all 80ms linear 0ms;box-shadow:0 5px 10px #1c1c1c4d,0 0 5px #1c1c1c14,0 0 0 2px var(--kirby-background-color),0 0 0 4px #4d90fe}ion-range:focus-visible:focus-within::part(knob){transition:all 80ms linear 0ms;box-shadow:0 5px 10px #1c1c1c4d,0 0 5px #1c1c1c14,0 0 0 2px var(--kirby-background-color),0 0 0 4px #4d90fe}}@media(hover:hover){ion-range:hover{--state-layer-opacity: .08;--state-layer-background-color: var(--kirby-black);cursor:pointer;--knob-background: rgb(234.6, 234.6, 234.6)}}ion-range:active,ion-range.interaction-state-active{--state-layer-opacity: .12;--state-layer-background-color: var(--kirby-black);--knob-background: rgb(214.2, 214.2, 214.2)}ion-range{--knob-background: var(--kirby-white);--knob-box-shadow: 0 5px 10px 0 rgba(28, 28, 28, .3), 0 0 5px 0 rgba(28, 28, 28, .08);--knob-size: 24px;--pin-color: var(--kirby-text-color-black);--pin-background: var(--kirby-semi-light);--bar-background: var(--kirby-medium);--bar-background-active: var(--kirby-dark);--bar-border-radius: 4px;--bar-height: 2px;flex:1 1 100%;padding:0}ion-range.range-disabled{--knob-background: var(--kirby-medium);--knob-box-shadow: none;--bar-background: var(--kirby-semi-light);--bar-background-active: var(--kirby-medium)}ion-range.range-disabled::part(tick){background:var(--kirby-semi-light)}ion-range.range-has-pin{padding:0 3px}ion-range::part(knob){transition:all 80ms linear 0ms;transition-property:background}ion-range::part(pin){font-size:12px;color:var(--pin-color);background-color:var(--pin-background);padding:2px 8px;border-radius:4px;min-width:24px;top:-12px}ion-range::part(pin):before{content:\"\";position:absolute;top:100%;left:50%;transform:translate(-50%);display:block;border:solid transparent 6px;border-top-color:var(--pin-background)}ion-range::part(tick),ion-range::part(tick-active){border-radius:50%;width:6px;height:6px;margin-top:1px;z-index:1;margin-inline-start:-3px}ion-range::part(tick){background:var(--kirby-medium)}label{font-size:12px;line-height:16px;color:var(--kirby-text-color-semi-dark);margin-top:-4px}\n"], dependencies: [{ kind: "component", type: IonRange, selector: "ion-range", inputs: ["activeBarStart", "color", "debounce", "disabled", "dualKnobs", "label", "labelPlacement", "max", "min", "mode", "name", "pin", "pinFormatter", "snaps", "step", "ticks", "value"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: RangeComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: RangeComponent, decorators: [{
             type: Component,
             args: [{ imports: [IonRange], selector: 'kirby-range', providers: [
                         {
@@ -111,7 +111,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImpor
                             multi: true,
                             useExisting: forwardRef((() => RangeComponent)),
                         },
-                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<ion-range\n  (ionChange)=\"_onRangeValueChange($event)\"\n  [min]=\"min\"\n  [max]=\"max\"\n  [step]=\"step\"\n  [value]=\"value\"\n  [pin]=\"pin\"\n  [pinFormatter]=\"pinFormatter\"\n  [snaps]=\"ticks\"\n  [ticks]=\"ticks\"\n  [debounce]=\"debounce\"\n  [disabled]=\"disabled\"\n></ion-range>\n\n@if (minLabel) {\n  <label class=\"min-label\">{{ minLabel }}</label>\n}\n@if (maxLabel) {\n  <label class=\"max-label\">{{ maxLabel }}</label>\n}\n", styles: [":host{display:flex;justify-content:space-between;flex-wrap:wrap}@media(hover:hover)and (pointer:fine){ion-range:focus-within::part(knob){transition:all 80ms linear 0ms;box-shadow:0 5px 10px #1c1c1c4d,0 0 5px #1c1c1c14,0 0 0 2px var(--kirby-background-color),0 0 0 4px #4d90fe}}@media(hover:hover){ion-range:hover{--state-layer-opacity: .08;--state-layer-background-color: var(--kirby-black);cursor:pointer;--knob-background: rgb(234.6, 234.6, 234.6)}}ion-range:active,ion-range.interaction-state-active{--state-layer-opacity: .12;--state-layer-background-color: var(--kirby-black);--knob-background: rgb(214.2, 214.2, 214.2)}ion-range{--knob-background: var(--kirby-white);--knob-box-shadow: 0 5px 10px 0 rgba(28, 28, 28, .3), 0 0 5px 0 rgba(28, 28, 28, .08);--knob-size: 24px;--pin-color: var(--kirby-text-color-black);--pin-background: var(--kirby-semi-light);--bar-background: var(--kirby-medium);--bar-background-active: var(--kirby-dark);--bar-border-radius: 4px;--bar-height: 2px;flex:1 1 100%;padding:0}ion-range.range-disabled{--knob-background: var(--kirby-medium);--knob-box-shadow: none;--bar-background: var(--kirby-semi-light);--bar-background-active: var(--kirby-medium)}ion-range.range-disabled::part(tick){background:var(--kirby-semi-light)}ion-range.range-has-pin{padding:0 3px}ion-range::part(knob){transition:all 80ms linear 0ms;transition-property:background}ion-range::part(pin){font-size:12px;color:var(--pin-color);background-color:var(--pin-background);padding:2px 8px;border-radius:4px;min-width:24px;top:-12px}ion-range::part(pin):before{content:\"\";position:absolute;top:100%;left:50%;transform:translate(-50%);display:block;border:solid transparent 6px;border-top-color:var(--pin-background)}ion-range::part(tick),ion-range::part(tick-active){border-radius:50%;width:6px;height:6px;margin-top:1px;z-index:1;margin-inline-start:-3px}ion-range::part(tick){background:var(--kirby-medium)}label{font-size:12px;line-height:16px;color:var(--kirby-text-color-semi-dark);margin-top:-4px}\n"] }]
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<ion-range\n  (ionChange)=\"_onRangeValueChange($event)\"\n  [min]=\"min\"\n  [max]=\"max\"\n  [step]=\"step\"\n  [value]=\"value\"\n  [pin]=\"pin\"\n  [pinFormatter]=\"pinFormatter\"\n  [snaps]=\"ticks\"\n  [ticks]=\"ticks\"\n  [debounce]=\"debounce\"\n  [disabled]=\"disabled\"\n></ion-range>\n\n@if (minLabel) {\n  <label class=\"min-label\">{{ minLabel }}</label>\n}\n@if (maxLabel) {\n  <label class=\"max-label\">{{ maxLabel }}</label>\n}\n", styles: [":host{display:flex;justify-content:space-between;flex-wrap:wrap}@media(hover:hover)and (pointer:fine){ion-range:focus-within::part(knob):focus-visible{transition:all 80ms linear 0ms;box-shadow:0 5px 10px #1c1c1c4d,0 0 5px #1c1c1c14,0 0 0 2px var(--kirby-background-color),0 0 0 4px #4d90fe}ion-range:focus-visible:focus-within::part(knob){transition:all 80ms linear 0ms;box-shadow:0 5px 10px #1c1c1c4d,0 0 5px #1c1c1c14,0 0 0 2px var(--kirby-background-color),0 0 0 4px #4d90fe}}@media(hover:hover){ion-range:hover{--state-layer-opacity: .08;--state-layer-background-color: var(--kirby-black);cursor:pointer;--knob-background: rgb(234.6, 234.6, 234.6)}}ion-range:active,ion-range.interaction-state-active{--state-layer-opacity: .12;--state-layer-background-color: var(--kirby-black);--knob-background: rgb(214.2, 214.2, 214.2)}ion-range{--knob-background: var(--kirby-white);--knob-box-shadow: 0 5px 10px 0 rgba(28, 28, 28, .3), 0 0 5px 0 rgba(28, 28, 28, .08);--knob-size: 24px;--pin-color: var(--kirby-text-color-black);--pin-background: var(--kirby-semi-light);--bar-background: var(--kirby-medium);--bar-background-active: var(--kirby-dark);--bar-border-radius: 4px;--bar-height: 2px;flex:1 1 100%;padding:0}ion-range.range-disabled{--knob-background: var(--kirby-medium);--knob-box-shadow: none;--bar-background: var(--kirby-semi-light);--bar-background-active: var(--kirby-medium)}ion-range.range-disabled::part(tick){background:var(--kirby-semi-light)}ion-range.range-has-pin{padding:0 3px}ion-range::part(knob){transition:all 80ms linear 0ms;transition-property:background}ion-range::part(pin){font-size:12px;color:var(--pin-color);background-color:var(--pin-background);padding:2px 8px;border-radius:4px;min-width:24px;top:-12px}ion-range::part(pin):before{content:\"\";position:absolute;top:100%;left:50%;transform:translate(-50%);display:block;border:solid transparent 6px;border-top-color:var(--pin-background)}ion-range::part(tick),ion-range::part(tick-active){border-radius:50%;width:6px;height:6px;margin-top:1px;z-index:1;margin-inline-start:-3px}ion-range::part(tick){background:var(--kirby-medium)}label{font-size:12px;line-height:16px;color:var(--kirby-text-color-semi-dark);margin-top:-4px}\n"] }]
         }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.Renderer2 }], propDecorators: { minLabel: [{
                 type: Input
             }], maxLabel: [{

package/fesm2022/kirbydesign-designsystem-range.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"kirbydesign-designsystem-range.mjs","sources":["../../range/src/range.component.ts","../../range/src/range.component.html","../../range/src/kirbydesign-designsystem-range.ts"],"sourcesContent":["import {\n  AfterViewInit,\n  ChangeDetectionStrategy,\n  ChangeDetectorRef,\n  Component,\n  ElementRef,\n  EventEmitter,\n  forwardRef,\n  Input,\n  OnChanges,\n  OnInit,\n  Output,\n  Renderer2,\n  ViewChild,\n} from '@angular/core';\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\nimport { IonRange } from '@ionic/angular/standalone';\nimport { forwardAttributes } from '@kirbydesign/designsystem/shared';\n\n@Component({\n  imports: [IonRange],\n  selector: 'kirby-range',\n  templateUrl: './range.component.html',\n  styleUrls: ['./range.component.scss'],\n  providers: [\n    {\n      provide: NG_VALUE_ACCESSOR,\n      multi: true,\n      useExisting: forwardRef(() => RangeComponent),\n    },\n  ],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class RangeComponent implements OnChanges, OnInit, ControlValueAccessor, AfterViewInit {\n  @Input() minLabel: string;\n  @Input() maxLabel: string;\n  @Input() debounce: number;\n  @Input() max: number;\n  @Input() min: number;\n  @Input() pin: boolean;\n  @Input() step = 1;\n  @Input() ticks: boolean;\n  @Input() disabled = false;\n  @Input() pinFormatter: (value: number) => string | number = this.defaultPinFormatter;\n  @Input()\n  set value(value: number) {\n    if (value !== this.currentValue) {\n      this.currentValue = value;\n      this.propagateChange(this.currentValue);\n    }\n  }\n\n  get value(): number {\n    return this.currentValue;\n  }\n\n  @Output() change: EventEmitter<number> = new EventEmitter<number>();\n  @Output() move: EventEmitter<number> = new EventEmitter<number>();\n\n  @ViewChild(IonRange, { static: true }) private ionRange: IonRange;\n\n  private currentValue: number;\n  private _attributesToForward = ['aria-label', 'aria-labelledby'];\n\n  constructor(\n    private cdr: ChangeDetectorRef,\n    private element: ElementRef<HTMLElement>,\n    private renderer: Renderer2\n  ) {}\n\n  ngOnInit() {\n    this.initializeMoveEventEmitter();\n  }\n\n  ngOnChanges() {\n    if (!this.ticks) return;\n\n    /*\n     * Max 10 ticks are allowed\n     */\n    const amountOfTicks = (this.max - this.min) / this.step;\n    if (amountOfTicks > 9) {\n      this.step = (this.max - this.min) / 9;\n    }\n\n    /*\n     * Set value to the nearest tick\n     */\n    this.value = this.getTicks().reduce((a, b) => {\n      return Math.abs(b - this.value) < Math.abs(a - this.value) ? b : a;\n    });\n  }\n\n  ngAfterViewInit(): void {\n    forwardAttributes(\n      this.element.nativeElement,\n      this._attributesToForward,\n      this.renderer,\n      this.element.nativeElement.querySelector('ion-range')\n    );\n  }\n\n  private getTicks() {\n    const ticks = [];\n    for (let value = Number(this.min); value <= Number(this.max); value += Number(this.step)) {\n      ticks.push(value);\n    }\n    return ticks;\n  }\n\n  private initializeMoveEventEmitter() {\n    // We subscribe to ionRange's ionInput imperatively instead of in markup\n    // to avoid doing work when no-one is listening to the move event.\n    if (this.move.observed) {\n      this.ionRange.ionInput.subscribe((rangeEvent) => {\n        this._onRangeKnobMove(rangeEvent);\n      });\n    }\n  }\n\n  private defaultPinFormatter(value: number): number {\n    return value;\n  }\n\n  public setDisabledState?(isDisabled: boolean): void {\n    this.disabled = isDisabled;\n    this.cdr.markForCheck();\n  }\n\n  public _onRangeValueChange($event: any): void {\n    this.writeValue($event.detail.value);\n    this.change.emit(this.currentValue);\n  }\n\n  public _onRangeKnobMove($event: any): void {\n    this.writeValue($event.detail.value);\n    this.move.emit(this.currentValue);\n  }\n\n  public onTouched = () => {};\n\n  // eslint-disable-next-line @typescript-eslint/no-unused-vars\n  public propagateChange = (_: any) => {};\n\n  public writeValue(value: any): void {\n    if (value !== undefined) {\n      this.value = value;\n      this.cdr.markForCheck();\n    }\n  }\n\n  public registerOnTouched(fn: any): void {\n    this.onTouched = fn;\n  }\n\n  public registerOnChange(fn: any): void {\n    this.propagateChange = fn;\n  }\n}\n","<ion-range\n  (ionChange)=\"_onRangeValueChange($event)\"\n  [min]=\"min\"\n  [max]=\"max\"\n  [step]=\"step\"\n  [value]=\"value\"\n  [pin]=\"pin\"\n  [pinFormatter]=\"pinFormatter\"\n  [snaps]=\"ticks\"\n  [ticks]=\"ticks\"\n  [debounce]=\"debounce\"\n  [disabled]=\"disabled\"\n></ion-range>\n\n@if (minLabel) {\n  <label class=\"min-label\">{{ minLabel }}</label>\n}\n@if (maxLabel) {\n  <label class=\"max-label\">{{ maxLabel }}</label>\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"kirbydesign-designsystem-range.mjs","sources":["../../range/src/range.component.ts","../../range/src/range.component.html","../../range/src/kirbydesign-designsystem-range.ts"],"sourcesContent":["import {\n  AfterViewInit,\n  ChangeDetectionStrategy,\n  ChangeDetectorRef,\n  Component,\n  ElementRef,\n  EventEmitter,\n  forwardRef,\n  Input,\n  OnChanges,\n  OnInit,\n  Output,\n  Renderer2,\n  ViewChild,\n} from '@angular/core';\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\nimport { IonRange } from '@ionic/angular/standalone';\nimport { forwardAttributes } from '@kirbydesign/designsystem/shared';\n\n@Component({\n  imports: [IonRange],\n  selector: 'kirby-range',\n  templateUrl: './range.component.html',\n  styleUrls: ['./range.component.scss'],\n  providers: [\n    {\n      provide: NG_VALUE_ACCESSOR,\n      multi: true,\n      useExisting: forwardRef(() => RangeComponent),\n    },\n  ],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class RangeComponent implements OnChanges, OnInit, ControlValueAccessor, AfterViewInit {\n  @Input() minLabel: string;\n  @Input() maxLabel: string;\n  @Input() debounce: number;\n  @Input() max: number;\n  @Input() min: number;\n  @Input() pin: boolean;\n  @Input() step = 1;\n  @Input() ticks: boolean;\n  @Input() disabled = false;\n  @Input() pinFormatter: (value: number) => string | number = this.defaultPinFormatter;\n  @Input()\n  set value(value: number) {\n    if (value !== this.currentValue) {\n      this.currentValue = value;\n      this.propagateChange(this.currentValue);\n    }\n  }\n\n  get value(): number {\n    return this.currentValue;\n  }\n\n  @Output() change: EventEmitter<number> = new EventEmitter<number>();\n  @Output() move: EventEmitter<number> = new EventEmitter<number>();\n\n  @ViewChild(IonRange, { static: true }) private ionRange: IonRange;\n\n  private currentValue: number;\n  private _attributesToForward = ['aria-label', 'aria-labelledby'];\n\n  constructor(\n    private cdr: ChangeDetectorRef,\n    private element: ElementRef<HTMLElement>,\n    private renderer: Renderer2\n  ) {}\n\n  ngOnInit() {\n    this.initializeMoveEventEmitter();\n  }\n\n  ngOnChanges() {\n    if (!this.ticks) return;\n\n    /*\n     * Max 10 ticks are allowed\n     */\n    const amountOfTicks = (this.max - this.min) / this.step;\n    if (amountOfTicks > 9) {\n      this.step = (this.max - this.min) / 9;\n    }\n\n    /*\n     * Set value to the nearest tick\n     */\n    this.value = this.getTicks().reduce((a, b) => {\n      return Math.abs(b - this.value) < Math.abs(a - this.value) ? b : a;\n    });\n  }\n\n  ngAfterViewInit(): void {\n    forwardAttributes(\n      this.element.nativeElement,\n      this._attributesToForward,\n      this.renderer,\n      this.element.nativeElement.querySelector('ion-range')\n    );\n  }\n\n  private getTicks() {\n    const ticks = [];\n    for (let value = Number(this.min); value <= Number(this.max); value += Number(this.step)) {\n      ticks.push(value);\n    }\n    return ticks;\n  }\n\n  private initializeMoveEventEmitter() {\n    // We subscribe to ionRange's ionInput imperatively instead of in markup\n    // to avoid doing work when no-one is listening to the move event.\n    if (this.move.observed) {\n      this.ionRange.ionInput.subscribe((rangeEvent) => {\n        this._onRangeKnobMove(rangeEvent);\n      });\n    }\n  }\n\n  private defaultPinFormatter(value: number): number {\n    return value;\n  }\n\n  public setDisabledState?(isDisabled: boolean): void {\n    this.disabled = isDisabled;\n    this.cdr.markForCheck();\n  }\n\n  public _onRangeValueChange($event: any): void {\n    this.writeValue($event.detail.value);\n    this.change.emit(this.currentValue);\n  }\n\n  public _onRangeKnobMove($event: any): void {\n    this.writeValue($event.detail.value);\n    this.move.emit(this.currentValue);\n  }\n\n  public onTouched = () => {};\n\n  // eslint-disable-next-line @typescript-eslint/no-unused-vars\n  public propagateChange = (_: any) => {};\n\n  public writeValue(value: any): void {\n    if (value !== undefined) {\n      this.value = value;\n      this.cdr.markForCheck();\n    }\n  }\n\n  public registerOnTouched(fn: any): void {\n    this.onTouched = fn;\n  }\n\n  public registerOnChange(fn: any): void {\n    this.propagateChange = fn;\n  }\n}\n","<ion-range\n  (ionChange)=\"_onRangeValueChange($event)\"\n  [min]=\"min\"\n  [max]=\"max\"\n  [step]=\"step\"\n  [value]=\"value\"\n  [pin]=\"pin\"\n  [pinFormatter]=\"pinFormatter\"\n  [snaps]=\"ticks\"\n  [ticks]=\"ticks\"\n  [debounce]=\"debounce\"\n  [disabled]=\"disabled\"\n></ion-range>\n\n@if (minLabel) {\n  <label class=\"min-label\">{{ minLabel }}</label>\n}\n@if (maxLabel) {\n  <label class=\"max-label\">{{ maxLabel }}</label>\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}

package/fesm2022/kirbydesign-designsystem-reorder-list.mjs

@@ -66,10 +66,10 @@ class ReorderListComponent {
         this.observer?.disconnect();
         delete this.observer;
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: ReorderListComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: ReorderListComponent, isStandalone: true, selector: "kirby-reorder-list", inputs: { items: "items", subItemsName: "subItemsName", getItemTextDefault: "getItemTextDefault" }, outputs: { itemReorder: "itemReorder", subItemReorder: "subItemReorder" }, queries: [{ propertyName: "itemTemplate", first: true, predicate: ListItemTemplateDirective, descendants: true, read: TemplateRef, static: true }], viewQueries: [{ propertyName: "reorderGroupContainer", predicate: ["reorderGroupContainer"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "@if (reorderActive) {\n  <ion-backdrop [tappable]=\"false\" [visible]=\"true\" [stopPropagation]=\"false\"></ion-backdrop>\n}\n<ion-reorder-group (ionItemReorder)=\"doReorder($event)\" disabled=\"false\">\n  @for (reorderItem of items; track reorderItem) {\n    <div>\n      <kirby-card>\n        <ng-container\n          *ngTemplateOutlet=\"\n            itemTemplate || defaultItemTemplate;\n            context: { $implicit: reorderItem }\n          \"\n        ></ng-container>\n        @if (reorderItem[subItemsName]) {\n          <div #reorderGroupContainer>\n            <ion-reorder-group\n              (ionItemReorder)=\"doSubReorder($event, reorderItem)\"\n              disabled=\"false\"\n            >\n              @for (subItem of reorderItem[subItemsName]; track subItem) {\n                <div>\n                  <ng-container\n                    *ngTemplateOutlet=\"\n                      itemTemplate || defaultItemTemplate;\n                      context: { $implicit: subItem, isSubItem: true }\n                    \"\n                  ></ng-container>\n                </div>\n              }\n            </ion-reorder-group>\n          </div>\n        }\n      </kirby-card>\n    </div>\n  }\n</ion-reorder-group>\n\n<ng-template #defaultItemTemplate let-item let-isSubItem>\n  <kirby-item [reorderable]=\"true\">\n    <p class=\"kirby-item-title\">{{ getItemTextDefault(item) }}</p>\n  </kirby-item>\n</ng-template>\n", styles: ["ion-backdrop{opacity:.3;z-index:101;position:fixed}.reorder-selected{box-shadow:none;opacity:1;z-index:104}.reorder-selected kirby-card{transform:scale(1.05)}.reorder-selected kirby-card div:first-child{border-top:1px solid var(--kirby-background-color)}.reorder-selected ::ng-deep>kirby-item{box-shadow:0 0 10px #0006;transform:scale(1.05);border-radius:16px;overflow:hidden}.reorder-list-active>*{position:relative;z-index:103}.reorder-list-active>.reorder-selected{z-index:104}.reorder-list-active div:first-child{border-top:none}.reorder-list-active ::ng-deep>div:last-child kirby-item{border-bottom-left-radius:16px;border-bottom-right-radius:16px;overflow:hidden}.reorder-list-active .reorder-selected ::ng-deep>kirby-item{box-shadow:0 0 10px #0006;transform:scale(1.05);border-radius:16px;overflow:hidden}:host>ion-reorder-group>div{border-bottom:20px transparent solid}:host>ion-reorder-group>div:last-child{border-bottom-width:0}kirby-card{overflow:inherit;z-index:auto}kirby-card ::ng-deep>div:last-child ion-reorder-group div:last-child kirby-item{border-bottom-left-radius:16px;border-bottom-right-radius:16px;overflow:hidden}kirby-card ::ng-deep>div kirby-item{z-index:1}kirby-card ::ng-deep>.content-layer>div:first-child kirby-item{border-radius:16px;overflow:hidden}kirby-card ::ng-deep>div .reorder-list-active kirby-item{z-index:103}kirby-card div:first-child{border-top:1px solid var(--kirby-background-color)}\n"], dependencies: [{ kind: "component", type: CardComponent, selector: "kirby-card", inputs: ["title", "subtitle", "backgroundImageUrl", "hasPadding", "sizes", "variant"] }, { kind: "component", type: ItemComponent, selector: "kirby-item", inputs: ["disabled", "selected", "disclosure", "selectable", "reorderable", "size", "href", "rotateIcon"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: IonBackdrop, selector: "ion-backdrop", inputs: ["stopPropagation", "tappable", "visible"] }, { kind: "component", type: IonReorderGroup, selector: "ion-reorder-group", inputs: ["disabled"] }] }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: ReorderListComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.4", type: ReorderListComponent, isStandalone: true, selector: "kirby-reorder-list", inputs: { items: "items", subItemsName: "subItemsName", getItemTextDefault: "getItemTextDefault" }, outputs: { itemReorder: "itemReorder", subItemReorder: "subItemReorder" }, queries: [{ propertyName: "itemTemplate", first: true, predicate: ListItemTemplateDirective, descendants: true, read: TemplateRef, static: true }], viewQueries: [{ propertyName: "reorderGroupContainer", predicate: ["reorderGroupContainer"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "@if (reorderActive) {\n  <ion-backdrop [tappable]=\"false\" [visible]=\"true\" [stopPropagation]=\"false\"></ion-backdrop>\n}\n<ion-reorder-group (ionItemReorder)=\"doReorder($event)\" disabled=\"false\">\n  @for (reorderItem of items; track reorderItem) {\n    <div>\n      <kirby-card>\n        <ng-container\n          *ngTemplateOutlet=\"\n            itemTemplate || defaultItemTemplate;\n            context: { $implicit: reorderItem }\n          \"\n        ></ng-container>\n        @if (reorderItem[subItemsName]) {\n          <div #reorderGroupContainer>\n            <ion-reorder-group\n              (ionItemReorder)=\"doSubReorder($event, reorderItem)\"\n              disabled=\"false\"\n            >\n              @for (subItem of reorderItem[subItemsName]; track subItem) {\n                <div>\n                  <ng-container\n                    *ngTemplateOutlet=\"\n                      itemTemplate || defaultItemTemplate;\n                      context: { $implicit: subItem, isSubItem: true }\n                    \"\n                  ></ng-container>\n                </div>\n              }\n            </ion-reorder-group>\n          </div>\n        }\n      </kirby-card>\n    </div>\n  }\n</ion-reorder-group>\n\n<ng-template #defaultItemTemplate let-item let-isSubItem>\n  <kirby-item [reorderable]=\"true\">\n    <p class=\"kirby-item-title\">{{ getItemTextDefault(item) }}</p>\n  </kirby-item>\n</ng-template>\n", styles: ["ion-backdrop{opacity:.3;z-index:101;position:fixed}.reorder-selected{box-shadow:none;opacity:1;z-index:104}.reorder-selected kirby-card{transform:scale(1.05)}.reorder-selected kirby-card div:first-child{border-top:1px solid var(--kirby-background-color)}.reorder-selected ::ng-deep>kirby-item{box-shadow:0 0 10px #0006;transform:scale(1.05);border-radius:16px;overflow:hidden}.reorder-list-active>*{position:relative;z-index:103}.reorder-list-active>.reorder-selected{z-index:104}.reorder-list-active div:first-child{border-top:none}.reorder-list-active ::ng-deep>div:last-child kirby-item{border-bottom-left-radius:16px;border-bottom-right-radius:16px;overflow:hidden}.reorder-list-active .reorder-selected ::ng-deep>kirby-item{box-shadow:0 0 10px #0006;transform:scale(1.05);border-radius:16px;overflow:hidden}:host>ion-reorder-group>div{border-bottom:20px transparent solid}:host>ion-reorder-group>div:last-child{border-bottom-width:0}kirby-card{overflow:inherit;z-index:auto}kirby-card ::ng-deep>div:last-child ion-reorder-group div:last-child kirby-item{border-bottom-left-radius:16px;border-bottom-right-radius:16px;overflow:hidden}kirby-card ::ng-deep>div kirby-item{z-index:1}kirby-card ::ng-deep>.content-layer>div:first-child kirby-item{border-radius:16px;overflow:hidden}kirby-card ::ng-deep>div .reorder-list-active kirby-item{z-index:103}kirby-card div:first-child{border-top:1px solid var(--kirby-background-color)}\n"], dependencies: [{ kind: "component", type: CardComponent, selector: "kirby-card", inputs: ["title", "subtitle", "backgroundImageUrl", "hasPadding", "sizes", "variant"] }, { kind: "component", type: ItemComponent, selector: "kirby-item", inputs: ["disabled", "selected", "disclosure", "selectable", "reorderable", "size", "href", "rotateIcon"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: IonBackdrop, selector: "ion-backdrop", inputs: ["stopPropagation", "tappable", "visible"] }, { kind: "component", type: IonReorderGroup, selector: "ion-reorder-group", inputs: ["disabled"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: ReorderListComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: ReorderListComponent, decorators: [{
             type: Component,
             args: [{ imports: [
                         CardComponent,

package/fesm2022/kirbydesign-designsystem-router-outlet.mjs

@@ -8,10 +8,10 @@ class RouterOutletComponent {
     constructor() {
         this._animated = isPlatform('hybrid');
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: RouterOutletComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: RouterOutletComponent, isStandalone: true, selector: "kirby-router-outlet", inputs: { main: "main" }, ngImport: i0, template: "@if (main) {\n  <ion-router-outlet main [animated]=\"_animated\"></ion-router-outlet>\n}\n@if (!main) {\n  <ion-router-outlet [animated]=\"_animated\"></ion-router-outlet>\n}\n", styles: [":host{inset:0;position:absolute;contain:size layout style;z-index:0;overflow:hidden;background-color:var(--kirby-background-color)}\n"], dependencies: [{ kind: "component", type: IonRouterOutlet, selector: "ion-router-outlet" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: RouterOutletComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.4", type: RouterOutletComponent, isStandalone: true, selector: "kirby-router-outlet", inputs: { main: "main" }, ngImport: i0, template: "@if (main) {\n  <ion-router-outlet main [animated]=\"_animated\"></ion-router-outlet>\n}\n@if (!main) {\n  <ion-router-outlet [animated]=\"_animated\"></ion-router-outlet>\n}\n", styles: [":host{inset:0;position:absolute;contain:size layout style;z-index:0;overflow:hidden;background-color:var(--kirby-background-color)}\n"], dependencies: [{ kind: "component", type: IonRouterOutlet, selector: "ion-router-outlet" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: RouterOutletComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: RouterOutletComponent, decorators: [{
             type: Component,
             args: [{ selector: 'kirby-router-outlet', changeDetection: ChangeDetectionStrategy.OnPush, imports: [IonRouterOutlet], template: "@if (main) {\n  <ion-router-outlet main [animated]=\"_animated\"></ion-router-outlet>\n}\n@if (!main) {\n  <ion-router-outlet [animated]=\"_animated\"></ion-router-outlet>\n}\n", styles: [":host{inset:0;position:absolute;contain:size layout style;z-index:0;overflow:hidden;background-color:var(--kirby-background-color)}\n"] }]
         }], propDecorators: { main: [{
@@ -19,11 +19,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImpor
             }] } });
 
 class RouterOutletModule {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: RouterOutletModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.0.6", ngImport: i0, type: RouterOutletModule, imports: [CommonModule, IonRouterOutlet, RouterOutletComponent], exports: [RouterOutletComponent] }); }
-    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: RouterOutletModule, imports: [CommonModule, IonRouterOutlet, RouterOutletComponent] }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: RouterOutletModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.1.4", ngImport: i0, type: RouterOutletModule, imports: [CommonModule, IonRouterOutlet, RouterOutletComponent], exports: [RouterOutletComponent] }); }
+    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: RouterOutletModule, imports: [CommonModule, IonRouterOutlet, RouterOutletComponent] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: RouterOutletModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: RouterOutletModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [CommonModule, IonRouterOutlet, RouterOutletComponent],

package/fesm2022/kirbydesign-designsystem-section-header.mjs

@@ -3,10 +3,10 @@ import { ChangeDetectionStrategy, Component } from '@angular/core';
 import { IonItemDivider } from '@ionic/angular/standalone';
 
 class SectionHeaderComponent {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: SectionHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: SectionHeaderComponent, isStandalone: true, selector: "kirby-section-header", ngImport: i0, template: "<ion-item-divider>\n  <ng-content></ng-content>\n</ion-item-divider>\n", styles: [":host{--kirby-section-header-color: var(--kirby-text-color-black)}:host ion-item-divider{--inner-padding-end: 0;--background: transparent;font-weight:inherit;min-height:0;z-index:initial;--padding-end: 16px;--padding-start: 16px}:host ion-item-divider ::ng-deep>[heading]{font-weight:700;font-size:18px;line-height:24px;color:var(--kirby-section-header-color);margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host ion-item-divider ::ng-deep>[detail],:host ion-item-divider ::ng-deep>[label]{font-weight:300;font-size:14px;line-height:20px;color:var(--kirby-section-header-color);margin:4px 0 8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}\n"], dependencies: [{ kind: "component", type: IonItemDivider, selector: "ion-item-divider", inputs: ["color", "mode", "sticky"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: SectionHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.4", type: SectionHeaderComponent, isStandalone: true, selector: "kirby-section-header", ngImport: i0, template: "<ion-item-divider>\n  <ng-content></ng-content>\n</ion-item-divider>\n", styles: [":host{--kirby-section-header-color: var(--kirby-text-color-black)}:host ion-item-divider{--inner-padding-end: 0;--background: transparent;font-weight:inherit;min-height:0;z-index:initial;--padding-end: 16px;--padding-start: 16px}:host ion-item-divider ::ng-deep>[heading]{font-weight:700;font-size:18px;line-height:24px;color:var(--kirby-section-header-color);margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host ion-item-divider ::ng-deep>[detail],:host ion-item-divider ::ng-deep>[label]{font-weight:300;font-size:14px;line-height:20px;color:var(--kirby-section-header-color);margin:4px 0 8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}\n"], dependencies: [{ kind: "component", type: IonItemDivider, selector: "ion-item-divider", inputs: ["color", "mode", "sticky"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: SectionHeaderComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: SectionHeaderComponent, decorators: [{
             type: Component,
             args: [{ imports: [IonItemDivider], selector: 'kirby-section-header', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ion-item-divider>\n  <ng-content></ng-content>\n</ion-item-divider>\n", styles: [":host{--kirby-section-header-color: var(--kirby-text-color-black)}:host ion-item-divider{--inner-padding-end: 0;--background: transparent;font-weight:inherit;min-height:0;z-index:initial;--padding-end: 16px;--padding-start: 16px}:host ion-item-divider ::ng-deep>[heading]{font-weight:700;font-size:18px;line-height:24px;color:var(--kirby-section-header-color);margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host ion-item-divider ::ng-deep>[detail],:host ion-item-divider ::ng-deep>[label]{font-weight:300;font-size:14px;line-height:20px;color:var(--kirby-section-header-color);margin:4px 0 8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}\n"] }]
         }] });

package/fesm2022/kirbydesign-designsystem-shared-floating.mjs

@@ -336,10 +336,10 @@ class FloatingDirective {
         this.tearDownReferenceElementEventHandling();
         this.removeAutoUpdaterRef();
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: FloatingDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i1.PortalDirective }], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.6", type: FloatingDirective, isStandalone: true, selector: "[kirbyFloating]", inputs: { reference: "reference", placement: "placement", strategy: "strategy", triggers: "triggers", DOMPortalOutlet: "DOMPortalOutlet", portalOutletConfig: "portalOutletConfig", isDisabled: "isDisabled", offset: "offset", shift: "shift", autoPlacement: "autoPlacement", closeOnSelect: "closeOnSelect", closeOnEscapeKey: "closeOnEscapeKey", closeOnBackdrop: "closeOnBackdrop" }, outputs: { displayChanged: "displayChanged" }, host: { listeners: { "document:keydown.escape": "onEscapeKeyPressed()" } }, providers: [PortalDirective], hostDirectives: [{ directive: i1.PortalDirective }], ngImport: i0 }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: FloatingDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i1.PortalDirective }], target: i0.ɵɵFactoryTarget.Directive }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.4", type: FloatingDirective, isStandalone: true, selector: "[kirbyFloating]", inputs: { reference: "reference", placement: "placement", strategy: "strategy", triggers: "triggers", DOMPortalOutlet: "DOMPortalOutlet", portalOutletConfig: "portalOutletConfig", isDisabled: "isDisabled", offset: "offset", shift: "shift", autoPlacement: "autoPlacement", closeOnSelect: "closeOnSelect", closeOnEscapeKey: "closeOnEscapeKey", closeOnBackdrop: "closeOnBackdrop" }, outputs: { displayChanged: "displayChanged" }, host: { listeners: { "document:keydown.escape": "onEscapeKeyPressed()" } }, providers: [PortalDirective], hostDirectives: [{ directive: i1.PortalDirective }], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: FloatingDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: FloatingDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[kirbyFloating]',

package/fesm2022/kirbydesign-designsystem-shared-portal.mjs

@@ -64,10 +64,10 @@ class PortalDirective extends CdkPortalOutlet {
             });
         };
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: PortalDirective, deps: [{ token: i0.ElementRef }, { token: i0.ComponentFactoryResolver }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.6", type: PortalDirective, isStandalone: true, selector: "[kirbyPortal]", inputs: { outlet: "outlet" }, usesInheritance: true, ngImport: i0 }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: PortalDirective, deps: [{ token: i0.ElementRef }, { token: i0.ComponentFactoryResolver }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.4", type: PortalDirective, isStandalone: true, selector: "[kirbyPortal]", inputs: { outlet: "outlet" }, usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: PortalDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: PortalDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[kirbyPortal]',

package/fesm2022/kirbydesign-designsystem-shared.mjs

@@ -11,10 +11,10 @@ class ResizeObserverFactory {
     create(callback) {
         return typeof ResizeObserver === 'undefined' ? null : new ResizeObserver(callback);
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: ResizeObserverFactory, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    /** @nocollapse */ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: ResizeObserverFactory, providedIn: 'root' }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: ResizeObserverFactory, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    /** @nocollapse */ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: ResizeObserverFactory, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: ResizeObserverFactory, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: ResizeObserverFactory, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
         }] });
@@ -57,10 +57,10 @@ class ResizeObserverService {
             }
         });
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: ResizeObserverService, deps: [{ token: ResizeObserverFactory }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    /** @nocollapse */ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: ResizeObserverService, providedIn: 'root' }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: ResizeObserverService, deps: [{ token: ResizeObserverFactory }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    /** @nocollapse */ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: ResizeObserverService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: ResizeObserverService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: ResizeObserverService, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
         }], ctorParameters: () => [{ type: ResizeObserverFactory }] });
@@ -128,10 +128,10 @@ class ThemeColorDirective {
         this._isBrightnessLight = colorBrightness === 'light';
         this._isBrightnessDark = colorBrightness === 'dark';
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: ThemeColorDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.6", type: ThemeColorDirective, isStandalone: true, selector: "kirby-avatar[themeColor],\n             kirby-card[themeColor],\n             kirby-icon[themeColor],\n             kirby-progress-circle-ring[themeColor],\n             kirby-modal-footer[themeColor],\n             kirby-empty-state[themeColor]", inputs: { themeColor: "themeColor" }, host: { properties: { "class.default": "this.isDefault", "class.primary": "this.isPrimary", "class.secondary": "this.isSecondary", "class.tertiary": "this.isTertiary", "class.success": "this.isSuccess", "class.warning": "this.isWarning", "class.danger": "this.isDanger", "class.light": "this.isLight", "class.medium": "this.isMedium", "class.dark": "this.isDark", "class.white": "this.isWhite", "class.kirby-color-brightness-white": "this.isBrightnessWhite", "class.kirby-color-brightness-light": "this.isBrightnessLight", "class.kirby-color-brightness-dark": "this.isBrightnessDark" } }, ngImport: i0 }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: ThemeColorDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.4", type: ThemeColorDirective, isStandalone: true, selector: "kirby-avatar[themeColor],\n             kirby-card[themeColor],\n             kirby-icon[themeColor],\n             kirby-progress-circle-ring[themeColor],\n             kirby-modal-footer[themeColor],\n             kirby-empty-state[themeColor]", inputs: { themeColor: "themeColor" }, host: { properties: { "class.default": "this.isDefault", "class.primary": "this.isPrimary", "class.secondary": "this.isSecondary", "class.tertiary": "this.isTertiary", "class.success": "this.isSuccess", "class.warning": "this.isWarning", "class.danger": "this.isDanger", "class.light": "this.isLight", "class.medium": "this.isMedium", "class.dark": "this.isDark", "class.white": "this.isWhite", "class.kirby-color-brightness-white": "this.isBrightnessWhite", "class.kirby-color-brightness-light": "this.isBrightnessLight", "class.kirby-color-brightness-dark": "this.isBrightnessDark" } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: ThemeColorDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: ThemeColorDirective, decorators: [{
             type: Directive,
             args: [{
                     standalone: true,
@@ -207,10 +207,10 @@ class ComponentLoaderDirective {
         }
         componentRef.instance.data = this.configuration.data;
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: ComponentLoaderDirective, deps: [{ token: i0.ComponentFactoryResolver }, { token: i0.ViewContainerRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.6", type: ComponentLoaderDirective, isStandalone: true, selector: "[kirbyLoadComponent]", inputs: { configuration: ["kirbyLoadComponent", "configuration"], cssClass: "cssClass" }, ngImport: i0 }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: ComponentLoaderDirective, deps: [{ token: i0.ComponentFactoryResolver }, { token: i0.ViewContainerRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Directive }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.4", type: ComponentLoaderDirective, isStandalone: true, selector: "[kirbyLoadComponent]", inputs: { configuration: ["kirbyLoadComponent", "configuration"], cssClass: "cssClass" }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: ComponentLoaderDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: ComponentLoaderDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[kirbyLoadComponent]',
@@ -308,10 +308,10 @@ class FitHeadingDirective {
         this.renderer.setStyle(el, 'font-size', size.fontSize);
         this.renderer.setStyle(el, 'line-height', size.lineHeight);
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: FitHeadingDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: ResizeObserverService }, { token: i2.LineClampHelper }], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.6", type: FitHeadingDirective, isStandalone: true, selector: "h1[kirbyFitHeading],h2[kirbyFitHeading],h3[kirbyFitHeading],[kirbyFitHeading]", inputs: { config: ["kirbyFitHeading", "config"] }, providers: [LineClampHelper], ngImport: i0 }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: FitHeadingDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: ResizeObserverService }, { token: i2.LineClampHelper }], target: i0.ɵɵFactoryTarget.Directive }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.4", type: FitHeadingDirective, isStandalone: true, selector: "h1[kirbyFitHeading],h2[kirbyFitHeading],h3[kirbyFitHeading],[kirbyFitHeading]", inputs: { config: ["kirbyFitHeading", "config"] }, providers: [LineClampHelper], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: FitHeadingDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: FitHeadingDirective, decorators: [{
             type: Directive,
             args: [{
                     standalone: true,
@@ -441,10 +441,10 @@ class TranslationService {
     get(key) {
         return this.activeTranslation[key];
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: TranslationService, deps: [{ token: LOCALE_ID }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    /** @nocollapse */ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: TranslationService, providedIn: 'root' }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: TranslationService, deps: [{ token: LOCALE_ID }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    /** @nocollapse */ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: TranslationService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: TranslationService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: TranslationService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',

package/fesm2022/kirbydesign-designsystem-slide-button.mjs

@@ -65,12 +65,12 @@ class SlideButtonComponent {
         this.slideDone.emit();
         this.isSlideDone = true;
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: SlideButtonComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: SlideButtonComponent, isStandalone: true, selector: "kirby-slide-button", inputs: { text: "text", expand: "expand" }, outputs: { slideDone: "slideDone", slidingPercentageChanged: "slidingPercentageChanged" }, viewQueries: [{ propertyName: "hiddenButton", first: true, predicate: ["hiddenButton"], descendants: true, read: ElementRef }], ngImport: i0, template: "<div class=\"slide-button-container\" [ngClass]=\"{ 'slide-done': isSlideDone }\" [inert]=\"isSlideDone\">\n  <input\n    tabindex=\"-1\"\n    type=\"range\"\n    (mouseup)=\"onSliderMouseup()\"\n    (touchend)=\"onSliderMouseup()\"\n    (input)=\"onSliderValueChange($event.target.value)\"\n    (mousedown)=\"onSliderMousedown()\"\n    (touchstart)=\"onSliderMousedown()\"\n    class=\"slide-button\"\n    [value]=\"value\"\n    max=\"100\"\n    aria-hidden=\"true\"\n  />\n  <p class=\"slide-button-text slide-{{ pctInTens }}-pct\" aria-hidden=\"true\">{{ text }}</p>\n  <button #hiddenButton class=\"kirby-visually-hidden breakout\" (click)=\"handleSlideDone()\">\n    {{ text }}\n  </button>\n</div>\n", styles: [":host{position:relative;display:inline-block;width:256px;-webkit-user-select:none;user-select:none}:host[expand=block]{display:block;width:100%}:host .slide-button-container{width:100%;display:flex;justify-content:center;align-items:center;color:var(--kirby-primary-contrast);background-color:var(--kirby-primary);height:56px;border-radius:26px}@media(hover:hover)and (pointer:fine){:host .slide-button-container:focus-within{transition:all 80ms linear 0ms;box-shadow:0 1px 24px #1c1c1c0a,0 0 0 2px var(--kirby-background-color),0 0 0 4px #4d90fe}}:host .slide-10-pct{opacity:.9}:host .slide-20-pct{opacity:.8}:host .slide-30-pct{opacity:.7}:host .slide-40-pct{opacity:.6}:host .slide-50-pct{opacity:.5}:host .slide-60-pct{opacity:.4}:host .slide-70-pct{opacity:.3}:host .slide-80-pct{opacity:.2}:host .slide-90-pct{opacity:.1}:host .slide-100-pct{opacity:0}:host .slide-button-text{position:absolute;font-size:16px;margin:0;line-height:1;z-index:1;width:100%;text-align:center;padding:0 26px 0 56px;pointer-events:none}:host .slide-button{outline:none;width:100%;height:100%;-webkit-appearance:none;appearance:none;background:transparent;z-index:2;pointer-events:none}@media(hover:hover){:host .slide-button::-webkit-slider-thumb:hover{--state-layer-opacity: .08;--state-layer-background-color: var(--kirby-black);cursor:pointer;background-color:#ebebeb}}:host .slide-button::-webkit-slider-thumb:active,:host .slide-button::-webkit-slider-thumb .interaction-state-active{--state-layer-opacity: .12;--state-layer-background-color: var(--kirby-black);background-color:#e0e0e0}:host .slide-button::-webkit-slider-thumb{transition:all 80ms linear 0ms;-webkit-appearance:none;appearance:none;border-radius:50%;background-color:var(--kirby-white);background-image:url(/assets/kirby/icons/svg/arrow-more.svg);background-repeat:no-repeat;background-position:center;background-size:24px;width:52px;height:52px;border:none;pointer-events:all}@media(hover:hover){:host .slide-button::-moz-range-thumb:hover{--state-layer-opacity: .08;--state-layer-background-color: var(--kirby-black);cursor:pointer;background-color:#ebebeb}}:host .slide-button::-moz-range-thumb:active,:host .slide-button::-moz-range-thumb .interaction-state-active{--state-layer-opacity: .12;--state-layer-background-color: var(--kirby-black);background-color:#e0e0e0}:host .slide-button::-moz-range-thumb{transition:all 80ms linear 0ms;-webkit-appearance:none;appearance:none;border-radius:50%;background-color:var(--kirby-white);background-image:url(/assets/kirby/icons/svg/arrow-more.svg);background-repeat:no-repeat;background-position:center;background-size:24px;width:52px;height:52px;border:none;pointer-events:all}:host .slide-done{transition:all .3s ease-in-out;opacity:0;height:0;transform:scale(0);pointer-events:none}.kirby-visually-hidden.breakout{width:100%;height:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: SlideButtonComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.4", type: SlideButtonComponent, isStandalone: true, selector: "kirby-slide-button", inputs: { text: "text", expand: "expand" }, outputs: { slideDone: "slideDone", slidingPercentageChanged: "slidingPercentageChanged" }, viewQueries: [{ propertyName: "hiddenButton", first: true, predicate: ["hiddenButton"], descendants: true, read: ElementRef }], ngImport: i0, template: "<div class=\"slide-button-container\" [ngClass]=\"{ 'slide-done': isSlideDone }\" [inert]=\"isSlideDone\">\n  <input\n    tabindex=\"-1\"\n    type=\"range\"\n    (mouseup)=\"onSliderMouseup()\"\n    (touchend)=\"onSliderMouseup()\"\n    (input)=\"onSliderValueChange($event.target.value)\"\n    (mousedown)=\"onSliderMousedown()\"\n    (touchstart)=\"onSliderMousedown()\"\n    class=\"slide-button\"\n    [value]=\"value\"\n    max=\"100\"\n    aria-hidden=\"true\"\n  />\n  <p class=\"slide-button-text slide-{{ pctInTens }}-pct\" aria-hidden=\"true\">{{ text }}</p>\n  <button #hiddenButton class=\"kirby-visually-hidden breakout\" (click)=\"handleSlideDone()\">\n    {{ text }}\n  </button>\n</div>\n", styles: [":host{position:relative;display:inline-block;width:256px;-webkit-user-select:none;user-select:none}:host[expand=block]{display:block;width:100%}:host .slide-button-container{width:100%;display:flex;justify-content:center;align-items:center;color:var(--kirby-primary-contrast);background-color:var(--kirby-primary);height:56px;border-radius:26px}@media(hover:hover)and (pointer:fine){:host .slide-button-container:has(:focus-visible){transition:all 80ms linear 0ms;box-shadow:0 1px 24px #1c1c1c0a,0 0 0 2px var(--kirby-background-color),0 0 0 4px #4d90fe}}:host .slide-10-pct{opacity:.9}:host .slide-20-pct{opacity:.8}:host .slide-30-pct{opacity:.7}:host .slide-40-pct{opacity:.6}:host .slide-50-pct{opacity:.5}:host .slide-60-pct{opacity:.4}:host .slide-70-pct{opacity:.3}:host .slide-80-pct{opacity:.2}:host .slide-90-pct{opacity:.1}:host .slide-100-pct{opacity:0}:host .slide-button-text{position:absolute;font-size:16px;margin:0;line-height:1;z-index:1;width:100%;text-align:center;padding:0 26px 0 56px;pointer-events:none}:host .slide-button{outline:none;width:100%;height:100%;-webkit-appearance:none;appearance:none;background:transparent;z-index:2;pointer-events:none}@media(hover:hover){:host .slide-button::-webkit-slider-thumb:hover{--state-layer-opacity: .08;--state-layer-background-color: var(--kirby-black);cursor:pointer;background-color:#ebebeb}}:host .slide-button::-webkit-slider-thumb:active,:host .slide-button::-webkit-slider-thumb .interaction-state-active{--state-layer-opacity: .12;--state-layer-background-color: var(--kirby-black);background-color:#e0e0e0}:host .slide-button::-webkit-slider-thumb{transition:all 80ms linear 0ms;-webkit-appearance:none;appearance:none;border-radius:50%;background-color:var(--kirby-white);background-image:url(/assets/kirby/icons/svg/arrow-more.svg);background-repeat:no-repeat;background-position:center;background-size:24px;width:52px;height:52px;border:none;pointer-events:all}@media(hover:hover){:host .slide-button::-moz-range-thumb:hover{--state-layer-opacity: .08;--state-layer-background-color: var(--kirby-black);cursor:pointer;background-color:#ebebeb}}:host .slide-button::-moz-range-thumb:active,:host .slide-button::-moz-range-thumb .interaction-state-active{--state-layer-opacity: .12;--state-layer-background-color: var(--kirby-black);background-color:#e0e0e0}:host .slide-button::-moz-range-thumb{transition:all 80ms linear 0ms;-webkit-appearance:none;appearance:none;border-radius:50%;background-color:var(--kirby-white);background-image:url(/assets/kirby/icons/svg/arrow-more.svg);background-repeat:no-repeat;background-position:center;background-size:24px;width:52px;height:52px;border:none;pointer-events:all}:host .slide-done{transition:all .3s ease-in-out;opacity:0;height:0;transform:scale(0);pointer-events:none}.kirby-visually-hidden.breakout{width:100%;height:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: SlideButtonComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: SlideButtonComponent, decorators: [{
             type: Component,
-            args: [{ imports: [CommonModule], selector: 'kirby-slide-button', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"slide-button-container\" [ngClass]=\"{ 'slide-done': isSlideDone }\" [inert]=\"isSlideDone\">\n  <input\n    tabindex=\"-1\"\n    type=\"range\"\n    (mouseup)=\"onSliderMouseup()\"\n    (touchend)=\"onSliderMouseup()\"\n    (input)=\"onSliderValueChange($event.target.value)\"\n    (mousedown)=\"onSliderMousedown()\"\n    (touchstart)=\"onSliderMousedown()\"\n    class=\"slide-button\"\n    [value]=\"value\"\n    max=\"100\"\n    aria-hidden=\"true\"\n  />\n  <p class=\"slide-button-text slide-{{ pctInTens }}-pct\" aria-hidden=\"true\">{{ text }}</p>\n  <button #hiddenButton class=\"kirby-visually-hidden breakout\" (click)=\"handleSlideDone()\">\n    {{ text }}\n  </button>\n</div>\n", styles: [":host{position:relative;display:inline-block;width:256px;-webkit-user-select:none;user-select:none}:host[expand=block]{display:block;width:100%}:host .slide-button-container{width:100%;display:flex;justify-content:center;align-items:center;color:var(--kirby-primary-contrast);background-color:var(--kirby-primary);height:56px;border-radius:26px}@media(hover:hover)and (pointer:fine){:host .slide-button-container:focus-within{transition:all 80ms linear 0ms;box-shadow:0 1px 24px #1c1c1c0a,0 0 0 2px var(--kirby-background-color),0 0 0 4px #4d90fe}}:host .slide-10-pct{opacity:.9}:host .slide-20-pct{opacity:.8}:host .slide-30-pct{opacity:.7}:host .slide-40-pct{opacity:.6}:host .slide-50-pct{opacity:.5}:host .slide-60-pct{opacity:.4}:host .slide-70-pct{opacity:.3}:host .slide-80-pct{opacity:.2}:host .slide-90-pct{opacity:.1}:host .slide-100-pct{opacity:0}:host .slide-button-text{position:absolute;font-size:16px;margin:0;line-height:1;z-index:1;width:100%;text-align:center;padding:0 26px 0 56px;pointer-events:none}:host .slide-button{outline:none;width:100%;height:100%;-webkit-appearance:none;appearance:none;background:transparent;z-index:2;pointer-events:none}@media(hover:hover){:host .slide-button::-webkit-slider-thumb:hover{--state-layer-opacity: .08;--state-layer-background-color: var(--kirby-black);cursor:pointer;background-color:#ebebeb}}:host .slide-button::-webkit-slider-thumb:active,:host .slide-button::-webkit-slider-thumb .interaction-state-active{--state-layer-opacity: .12;--state-layer-background-color: var(--kirby-black);background-color:#e0e0e0}:host .slide-button::-webkit-slider-thumb{transition:all 80ms linear 0ms;-webkit-appearance:none;appearance:none;border-radius:50%;background-color:var(--kirby-white);background-image:url(/assets/kirby/icons/svg/arrow-more.svg);background-repeat:no-repeat;background-position:center;background-size:24px;width:52px;height:52px;border:none;pointer-events:all}@media(hover:hover){:host .slide-button::-moz-range-thumb:hover{--state-layer-opacity: .08;--state-layer-background-color: var(--kirby-black);cursor:pointer;background-color:#ebebeb}}:host .slide-button::-moz-range-thumb:active,:host .slide-button::-moz-range-thumb .interaction-state-active{--state-layer-opacity: .12;--state-layer-background-color: var(--kirby-black);background-color:#e0e0e0}:host .slide-button::-moz-range-thumb{transition:all 80ms linear 0ms;-webkit-appearance:none;appearance:none;border-radius:50%;background-color:var(--kirby-white);background-image:url(/assets/kirby/icons/svg/arrow-more.svg);background-repeat:no-repeat;background-position:center;background-size:24px;width:52px;height:52px;border:none;pointer-events:all}:host .slide-done{transition:all .3s ease-in-out;opacity:0;height:0;transform:scale(0);pointer-events:none}.kirby-visually-hidden.breakout{width:100%;height:100%}\n"] }]
+            args: [{ imports: [CommonModule], selector: 'kirby-slide-button', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"slide-button-container\" [ngClass]=\"{ 'slide-done': isSlideDone }\" [inert]=\"isSlideDone\">\n  <input\n    tabindex=\"-1\"\n    type=\"range\"\n    (mouseup)=\"onSliderMouseup()\"\n    (touchend)=\"onSliderMouseup()\"\n    (input)=\"onSliderValueChange($event.target.value)\"\n    (mousedown)=\"onSliderMousedown()\"\n    (touchstart)=\"onSliderMousedown()\"\n    class=\"slide-button\"\n    [value]=\"value\"\n    max=\"100\"\n    aria-hidden=\"true\"\n  />\n  <p class=\"slide-button-text slide-{{ pctInTens }}-pct\" aria-hidden=\"true\">{{ text }}</p>\n  <button #hiddenButton class=\"kirby-visually-hidden breakout\" (click)=\"handleSlideDone()\">\n    {{ text }}\n  </button>\n</div>\n", styles: [":host{position:relative;display:inline-block;width:256px;-webkit-user-select:none;user-select:none}:host[expand=block]{display:block;width:100%}:host .slide-button-container{width:100%;display:flex;justify-content:center;align-items:center;color:var(--kirby-primary-contrast);background-color:var(--kirby-primary);height:56px;border-radius:26px}@media(hover:hover)and (pointer:fine){:host .slide-button-container:has(:focus-visible){transition:all 80ms linear 0ms;box-shadow:0 1px 24px #1c1c1c0a,0 0 0 2px var(--kirby-background-color),0 0 0 4px #4d90fe}}:host .slide-10-pct{opacity:.9}:host .slide-20-pct{opacity:.8}:host .slide-30-pct{opacity:.7}:host .slide-40-pct{opacity:.6}:host .slide-50-pct{opacity:.5}:host .slide-60-pct{opacity:.4}:host .slide-70-pct{opacity:.3}:host .slide-80-pct{opacity:.2}:host .slide-90-pct{opacity:.1}:host .slide-100-pct{opacity:0}:host .slide-button-text{position:absolute;font-size:16px;margin:0;line-height:1;z-index:1;width:100%;text-align:center;padding:0 26px 0 56px;pointer-events:none}:host .slide-button{outline:none;width:100%;height:100%;-webkit-appearance:none;appearance:none;background:transparent;z-index:2;pointer-events:none}@media(hover:hover){:host .slide-button::-webkit-slider-thumb:hover{--state-layer-opacity: .08;--state-layer-background-color: var(--kirby-black);cursor:pointer;background-color:#ebebeb}}:host .slide-button::-webkit-slider-thumb:active,:host .slide-button::-webkit-slider-thumb .interaction-state-active{--state-layer-opacity: .12;--state-layer-background-color: var(--kirby-black);background-color:#e0e0e0}:host .slide-button::-webkit-slider-thumb{transition:all 80ms linear 0ms;-webkit-appearance:none;appearance:none;border-radius:50%;background-color:var(--kirby-white);background-image:url(/assets/kirby/icons/svg/arrow-more.svg);background-repeat:no-repeat;background-position:center;background-size:24px;width:52px;height:52px;border:none;pointer-events:all}@media(hover:hover){:host .slide-button::-moz-range-thumb:hover{--state-layer-opacity: .08;--state-layer-background-color: var(--kirby-black);cursor:pointer;background-color:#ebebeb}}:host .slide-button::-moz-range-thumb:active,:host .slide-button::-moz-range-thumb .interaction-state-active{--state-layer-opacity: .12;--state-layer-background-color: var(--kirby-black);background-color:#e0e0e0}:host .slide-button::-moz-range-thumb{transition:all 80ms linear 0ms;-webkit-appearance:none;appearance:none;border-radius:50%;background-color:var(--kirby-white);background-image:url(/assets/kirby/icons/svg/arrow-more.svg);background-repeat:no-repeat;background-position:center;background-size:24px;width:52px;height:52px;border:none;pointer-events:all}:host .slide-done{transition:all .3s ease-in-out;opacity:0;height:0;transform:scale(0);pointer-events:none}.kirby-visually-hidden.breakout{width:100%;height:100%}\n"] }]
         }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.Renderer2 }], propDecorators: { text: [{
                 type: Input
             }], expand: [{

package/fesm2022/kirbydesign-designsystem-slide-button.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"kirbydesign-designsystem-slide-button.mjs","sources":["../../slide-button/src/slide-button.component.ts","../../slide-button/src/slide-button.component.html","../../slide-button/src/kirbydesign-designsystem-slide-button.ts"],"sourcesContent":["import { CommonModule } from '@angular/common';\nimport {\n  AfterViewInit,\n  ChangeDetectionStrategy,\n  ChangeDetectorRef,\n  Component,\n  ElementRef,\n  EventEmitter,\n  Input,\n  OnDestroy,\n  Output,\n  Renderer2,\n  ViewChild,\n} from '@angular/core';\nimport { forwardAttributes } from '@kirbydesign/designsystem/shared';\n\n@Component({\n  imports: [CommonModule],\n  selector: 'kirby-slide-button',\n  templateUrl: './slide-button.component.html',\n  styleUrls: ['./slide-button.component.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class SlideButtonComponent implements OnDestroy, AfterViewInit {\n  @Input() text = '';\n  @Input() expand: 'block';\n\n  @Output() slideDone = new EventEmitter();\n  @Output() slidingPercentageChanged = new EventEmitter<number>();\n\n  @ViewChild('hiddenButton', { read: ElementRef })\n  hiddenButton!: ElementRef<HTMLButtonElement>;\n\n  private _attributesToForward = ['aria-label', 'aria-labelledby'];\n\n  readonly slideDoneFadeTime = 500;\n  readonly slideResetTime = 100;\n\n  isSlideDone = false;\n  pctInTens = 0;\n\n  get value(): number {\n    return this._value;\n  }\n  set value(v: number) {\n    this._value = v;\n    this.calculatePctInTens();\n  }\n\n  private _value: number = 0;\n  private resetSliderIntervalTimer: any;\n  private calculatePctInTens() {\n    this.pctInTens = Math.ceil(this.value / 10) * 10;\n  }\n\n  constructor(\n    private changeDetectionRef: ChangeDetectorRef,\n    private elementRef: ElementRef<HTMLElement>,\n    private renderer: Renderer2\n  ) {}\n\n  ngAfterViewInit(): void {\n    forwardAttributes(\n      this.elementRef.nativeElement,\n      this._attributesToForward,\n      this.renderer,\n      this.hiddenButton.nativeElement\n    );\n  }\n\n  ngOnDestroy(): void {\n    if (this.resetSliderIntervalTimer) {\n      clearInterval(this.resetSliderIntervalTimer);\n    }\n  }\n\n  onSliderMouseup() {\n    if (this.value == 100) {\n      this.handleSlideDone();\n    } else {\n      // Return slider thumb to beginning of slider button in increments of 2\n      this.resetSliderIntervalTimer = setInterval(() => {\n        if (this.value > 0) {\n          this.value -= 2;\n        } else {\n          clearInterval(this.resetSliderIntervalTimer);\n        }\n\n        this.changeDetectionRef.markForCheck();\n      }, 1);\n    }\n  }\n\n  onSliderValueChange(val: string) {\n    this.value = +val;\n    this.slidingPercentageChanged.emit(this.value);\n  }\n\n  onSliderMousedown() {\n    clearInterval(this.resetSliderIntervalTimer);\n  }\n\n  handleSlideDone() {\n    this.slideDone.emit();\n    this.isSlideDone = true;\n  }\n}\n","<div class=\"slide-button-container\" [ngClass]=\"{ 'slide-done': isSlideDone }\" [inert]=\"isSlideDone\">\n  <input\n    tabindex=\"-1\"\n    type=\"range\"\n    (mouseup)=\"onSliderMouseup()\"\n    (touchend)=\"onSliderMouseup()\"\n    (input)=\"onSliderValueChange($event.target.value)\"\n    (mousedown)=\"onSliderMousedown()\"\n    (touchstart)=\"onSliderMousedown()\"\n    class=\"slide-button\"\n    [value]=\"value\"\n    max=\"100\"\n    aria-hidden=\"true\"\n  />\n  <p class=\"slide-button-text slide-{{ pctInTens }}-pct\" aria-hidden=\"true\">{{ text }}</p>\n  <button #hiddenButton class=\"kirby-visually-hidden breakout\" (click)=\"handleSlideDone()\">\n    {{ text }}\n  </button>\n</div>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"kirbydesign-designsystem-slide-button.mjs","sources":["../../slide-button/src/slide-button.component.ts","../../slide-button/src/slide-button.component.html","../../slide-button/src/kirbydesign-designsystem-slide-button.ts"],"sourcesContent":["import { CommonModule } from '@angular/common';\nimport {\n  AfterViewInit,\n  ChangeDetectionStrategy,\n  ChangeDetectorRef,\n  Component,\n  ElementRef,\n  EventEmitter,\n  Input,\n  OnDestroy,\n  Output,\n  Renderer2,\n  ViewChild,\n} from '@angular/core';\nimport { forwardAttributes } from '@kirbydesign/designsystem/shared';\n\n@Component({\n  imports: [CommonModule],\n  selector: 'kirby-slide-button',\n  templateUrl: './slide-button.component.html',\n  styleUrls: ['./slide-button.component.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class SlideButtonComponent implements OnDestroy, AfterViewInit {\n  @Input() text = '';\n  @Input() expand: 'block';\n\n  @Output() slideDone = new EventEmitter();\n  @Output() slidingPercentageChanged = new EventEmitter<number>();\n\n  @ViewChild('hiddenButton', { read: ElementRef })\n  hiddenButton!: ElementRef<HTMLButtonElement>;\n\n  private _attributesToForward = ['aria-label', 'aria-labelledby'];\n\n  readonly slideDoneFadeTime = 500;\n  readonly slideResetTime = 100;\n\n  isSlideDone = false;\n  pctInTens = 0;\n\n  get value(): number {\n    return this._value;\n  }\n  set value(v: number) {\n    this._value = v;\n    this.calculatePctInTens();\n  }\n\n  private _value: number = 0;\n  private resetSliderIntervalTimer: any;\n  private calculatePctInTens() {\n    this.pctInTens = Math.ceil(this.value / 10) * 10;\n  }\n\n  constructor(\n    private changeDetectionRef: ChangeDetectorRef,\n    private elementRef: ElementRef<HTMLElement>,\n    private renderer: Renderer2\n  ) {}\n\n  ngAfterViewInit(): void {\n    forwardAttributes(\n      this.elementRef.nativeElement,\n      this._attributesToForward,\n      this.renderer,\n      this.hiddenButton.nativeElement\n    );\n  }\n\n  ngOnDestroy(): void {\n    if (this.resetSliderIntervalTimer) {\n      clearInterval(this.resetSliderIntervalTimer);\n    }\n  }\n\n  onSliderMouseup() {\n    if (this.value == 100) {\n      this.handleSlideDone();\n    } else {\n      // Return slider thumb to beginning of slider button in increments of 2\n      this.resetSliderIntervalTimer = setInterval(() => {\n        if (this.value > 0) {\n          this.value -= 2;\n        } else {\n          clearInterval(this.resetSliderIntervalTimer);\n        }\n\n        this.changeDetectionRef.markForCheck();\n      }, 1);\n    }\n  }\n\n  onSliderValueChange(val: string) {\n    this.value = +val;\n    this.slidingPercentageChanged.emit(this.value);\n  }\n\n  onSliderMousedown() {\n    clearInterval(this.resetSliderIntervalTimer);\n  }\n\n  handleSlideDone() {\n    this.slideDone.emit();\n    this.isSlideDone = true;\n  }\n}\n","<div class=\"slide-button-container\" [ngClass]=\"{ 'slide-done': isSlideDone }\" [inert]=\"isSlideDone\">\n  <input\n    tabindex=\"-1\"\n    type=\"range\"\n    (mouseup)=\"onSliderMouseup()\"\n    (touchend)=\"onSliderMouseup()\"\n    (input)=\"onSliderValueChange($event.target.value)\"\n    (mousedown)=\"onSliderMousedown()\"\n    (touchstart)=\"onSliderMousedown()\"\n    class=\"slide-button\"\n    [value]=\"value\"\n    max=\"100\"\n    aria-hidden=\"true\"\n  />\n  <p class=\"slide-button-text slide-{{ pctInTens }}-pct\" aria-hidden=\"true\">{{ text }}</p>\n  <button #hiddenButton class=\"kirby-visually-hidden breakout\" (click)=\"handleSlideDone()\">\n    {{ text }}\n  </button>\n</div>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}