@testgorilla/tgo-ui 11.22.2 → 12.0.0

package/fesm2022/testgorilla-tgo-ui-components-toggle.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"testgorilla-tgo-ui-components-toggle.mjs","sources":["../../../components/toggle/toggle.component.ts","../../../components/toggle/toggle.component.html","../../../components/toggle/toggle.component.module.ts","../../../components/toggle/testgorilla-tgo-ui-components-toggle.ts"],"sourcesContent":["import { NgClass } from '@angular/common';\nimport {\n  ChangeDetectionStrategy,\n  ChangeDetectorRef,\n  Component,\n  EventEmitter,\n  forwardRef,\n  HostBinding,\n  Inject,\n  inject,\n  Input,\n  OnChanges,\n  OnInit,\n  Optional,\n  Output,\n} from '@angular/core';\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\nimport { MatTooltip } from '@angular/material/tooltip';\n\nimport { ApplicationTheme, IKeyboardEvent, EllipseTextDirective } from '@testgorilla/tgo-ui/components/core';\nimport { IconComponentModule } from '@testgorilla/tgo-ui/components/icon';\nimport { SpinnerComponent } from '@testgorilla/tgo-ui/components/spinner';\n\nimport { RegisterFn } from './toggle.model';\n\n@Component({\n  selector: 'ui-toggle',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  templateUrl: './toggle.component.html',\n  styleUrls: ['./toggle.component.scss'],\n  providers: [\n    {\n      provide: NG_VALUE_ACCESSOR,\n      useExisting: forwardRef(() => ToggleComponent),\n      multi: true,\n    },\n  ],\n  imports: [NgClass, EllipseTextDirective, MatTooltip, IconComponentModule, SpinnerComponent],\n})\nexport class ToggleComponent implements ControlValueAccessor, OnChanges, OnInit {\n  /**\n   * The `selected` property determines the current state of the toggle switch.\n   *\n   * @type {boolean}\n   * @default false\n   * @memberof ToggleComponent\n   */\n  @Input() selected = false;\n\n  /**\n   * The `disabled` property determines whether the toggle switch is disabled.\n   *\n   * @type {boolean}\n   * @default false\n   * @memberof ToggleComponent\n   */\n  @Input() disabled = false;\n\n  /**\n   * Toggle label\n   *\n   * @type {string}\n   * @default ''\n   * @memberof ToggleComponent\n   */\n  @Input() label = '';\n\n  /**\n   * Message\n   *\n   * @type {string}\n   * @default ''\n   * @memberof ToggleComponent\n   */\n  @Input() message = '';\n\n  /**\n   * Max width of the toggle container\n   *\n   * @type {number}\n   * @memberof ToggleComponent\n   */\n  @HostBinding('style.--max-width')\n  @Input()\n  maxWidth: number | undefined;\n\n  /**\n   *\n   * Defines the application theme\n   *\n   * @type {ApplicationTheme}\n   * @memberof ToggleComponent\n   */\n  @Input() applicationTheme: ApplicationTheme = 'light';\n\n  /**\n   * The `toggle` event is triggered when the state of the toggle switch changes. It returns the new state.\n   *\n   * @type {event}\n   * @memberof ToggleComponent\n   */\n  // eslint-disable-next-line @angular-eslint/no-output-native -- output shadows a native event; rename is breaking, deferred to the breaking-change MAJOR (see plan)\n  @Output() toggle = new EventEmitter<boolean>();\n\n  /**\n   * A string representing the ARIA label for accessibility.\n   * This label is used to provide an accessible name for the input element.\n   * @type {string}\n   * @memberof ToggleComponent\n   */\n  @Input() ariaLabel: string;\n\n  @Input() testId: string | null = null;\n\n  /**\n   * A string representing the ARIA requirement for accessibility.\n   * This attribute is used to indicate whether an input field is required for form submission.\n   * @type {boolean}\n   * @memberof ToggleComponent\n   */\n  @Input() ariaRequired = false;\n\n  /**\n   * disable/enable click on toggle\n   * @type {boolean}\n   * @memberof ToggleComponent\n   */\n  @Input() preventClick = false;\n\n  /**\n   * The loading state\n   *\n   * @type {boolean}\n   * @memberof ToggleComponent\n   */\n  @Input() loading = false;\n\n  /**\n   * A string representing the ARIA requirement for accessibility.\n   * This attribute is used to indicate whether an input field is required for form submission.\n   * @type {string}\n   * @memberof ToggleComponent\n   */\n  @Input() ariaDescribedby = '';\n\n  protected showLabelTooltip = false;\n  protected classes: string;\n\n  private static nextInstanceId = 0;\n\n  // Shared ids would point every toggle's `aria-labelledby` at the first toggle's label.\n  protected readonly labelId = `ui-toggle-label-${++ToggleComponent.nextInstanceId}`;\n  protected readonly describedbyId = `ui-toggle-describedby-${ToggleComponent.nextInstanceId}`;\n\n  constructor(\n    @Optional() @Inject('CANOPYUI_DEFAULT_APPLICATION_THEME') private readonly defaultAppTheme: ApplicationTheme\n  ) {\n    if (defaultAppTheme) {\n      this.applicationTheme = defaultAppTheme;\n    }\n  }\n\n  ngOnChanges(): void {\n    this.setClasses();\n  }\n\n  ngOnInit(): void {\n    this.setClasses();\n  }\n\n  onToggle(): void {\n    if (this.preventClick) {\n      this.toggle.emit(this.selected);\n    }\n    if (!this.disabled && !this.preventClick) {\n      this.selected = !this.selected;\n      this.toggle.emit(this.selected);\n      this.onChange(this.selected);\n    }\n  }\n\n  private readonly cdr = inject(ChangeDetectorRef);\n\n  writeValue(state: boolean): void {\n    if (state) {\n      this.selected = state;\n    }\n    // The forms API calls this from outside the component's own change\n    // detection — under OnPush the view must be marked explicitly.\n    this.cdr.markForCheck();\n  }\n\n  registerOnChange(fn: RegisterFn): void {\n    this.onChange = fn;\n  }\n\n  registerOnTouched(fn: RegisterFn): void {\n    this.onTouched = fn;\n  }\n\n  setDisabledState(isDisabled: boolean): void {\n    this.disabled = isDisabled;\n    // Recompute the root [ngClass] — it's otherwise only built in\n    // ngOnInit/ngOnChanges, so the `disabled` class never applied when\n    // disabling through the forms API.\n    this.setClasses();\n    this.cdr.markForCheck();\n  }\n\n  changeTextState(state: boolean): void {\n    this.showLabelTooltip = state;\n  }\n\n  onKeydown($event: KeyboardEvent) {\n    if ($event.key === (IKeyboardEvent.ENTER as string) || $event.key === (IKeyboardEvent.SPACE as string)) {\n      $event.stopPropagation();\n      $event.preventDefault();\n      this.onToggle();\n    }\n  }\n\n  private onChange: RegisterFn = () => {};\n  private onTouched: RegisterFn = () => {};\n\n  private setClasses(): void {\n    this.classes = `${this.disabled ? 'disabled' : ''} ${this.applicationTheme} ${this.loading ? 'loading' : ''} ${!this.label ? 'small-toggle' : ''}`;\n  }\n}\n","<div class=\"toggle\" [ngClass]=\"classes\">\n  <div\n    [style.--max-width]=\"maxWidth + 'px'\"\n    tabindex=\"0\"\n    class=\"toggle-container\"\n    [ngClass]=\"{ active: selected }\"\n    (click)=\"onToggle()\"\n    [attr.aria-label]=\"ariaLabel\"\n    [attr.aria-required]=\"ariaRequired\"\n    (keydown)=\"onKeydown($event)\"\n    role=\"switch\"\n    [attr.aria-labelledby]=\"label ? labelId : null\"\n    [attr.aria-describedby]=\"ariaDescribedby ? describedbyId : null\"\n    [attr.aria-checked]=\"selected\"\n    [attr.data-testid]=\"testId\"\n  >\n    <span [style.display]=\"'none'\" [id]=\"describedbyId\">{{ ariaDescribedby }}</span>\n    <div\n      class=\"label\"\n      uiEllipseText\n      [matTooltipShowDelay]=\"800\"\n      [matTooltip]=\"showLabelTooltip ? label : ''\"\n      (onChangeTextState)=\"changeTextState($event)\"\n      [id]=\"labelId\"\n    >\n      {{ label }}\n    </div>\n    @if (!loading) {\n      <div class=\"knob\" [ngClass]=\"{ selected }\">\n        @if (selected && !label) {\n          <ui-icon [color]=\"disabled ? 'grey' : 'white'\" [size]=\"'16'\" [name]=\"'Check-round-filled'\"></ui-icon>\n        }\n      </div>\n    } @else {\n      <ui-spinner [isLoader]=\"false\" [size]=\"'small'\" [applicationTheme]=\"'dark'\"></ui-spinner>\n    }\n  </div>\n  @if (message && selected) {\n    <div class=\"message\">{{ message }}</div>\n  }\n</div>\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { MatInputModule } from '@angular/material/input';\nimport { MatTooltipModule } from '@angular/material/tooltip';\n\nimport { EllipseTextDirective, UiTranslatePipe } from '@testgorilla/tgo-ui/components/core';\nimport { IconComponentModule } from '@testgorilla/tgo-ui/components/icon';\nimport { SpinnerComponentModule } from '@testgorilla/tgo-ui/components/spinner';\n\nimport { ToggleComponent } from './toggle.component';\n\n@NgModule({\n  imports: [\n    CommonModule,\n    MatTooltipModule,\n    EllipseTextDirective,\n    MatInputModule,\n    UiTranslatePipe,\n    IconComponentModule,\n    SpinnerComponentModule,\n    ToggleComponent,\n  ],\n  exports: [ToggleComponent],\n})\nexport class ToggleComponentModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"testgorilla-tgo-ui-components-toggle.mjs","names":[],"sources":["../../../components/toggle/toggle.component.ts","../../../components/toggle/toggle.component.html","../../../components/toggle/toggle.component.module.ts"],"sourcesContent":["import { NgClass } from '@angular/common';\nimport {\n  ChangeDetectionStrategy,\n  ChangeDetectorRef,\n  Component,\n  EventEmitter,\n  forwardRef,\n  HostBinding,\n  Inject,\n  inject,\n  Input,\n  OnChanges,\n  OnInit,\n  Optional,\n  Output,\n} from '@angular/core';\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\nimport { MatTooltip } from '@angular/material/tooltip';\n\nimport { ApplicationTheme, IKeyboardEvent, EllipseTextDirective } from '@testgorilla/tgo-ui/components/core';\nimport { IconComponentModule } from '@testgorilla/tgo-ui/components/icon';\nimport { SpinnerComponent } from '@testgorilla/tgo-ui/components/spinner';\n\nimport { RegisterFn } from './toggle.model';\n\n@Component({\n  selector: 'ui-toggle',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  templateUrl: './toggle.component.html',\n  styleUrls: ['./toggle.component.scss'],\n  providers: [\n    {\n      provide: NG_VALUE_ACCESSOR,\n      useExisting: forwardRef(() => ToggleComponent),\n      multi: true,\n    },\n  ],\n  imports: [NgClass, EllipseTextDirective, MatTooltip, IconComponentModule, SpinnerComponent],\n})\nexport class ToggleComponent implements ControlValueAccessor, OnChanges, OnInit {\n  /**\n   * The `selected` property determines the current state of the toggle switch.\n   *\n   * @type {boolean}\n   * @default false\n   * @memberof ToggleComponent\n   */\n  @Input() selected = false;\n\n  /**\n   * The `disabled` property determines whether the toggle switch is disabled.\n   *\n   * @type {boolean}\n   * @default false\n   * @memberof ToggleComponent\n   */\n  @Input() disabled = false;\n\n  /**\n   * Toggle label\n   *\n   * @type {string}\n   * @default ''\n   * @memberof ToggleComponent\n   */\n  @Input() label = '';\n\n  /**\n   * Message\n   *\n   * @type {string}\n   * @default ''\n   * @memberof ToggleComponent\n   */\n  @Input() message = '';\n\n  /**\n   * Max width of the toggle container\n   *\n   * @type {number}\n   * @memberof ToggleComponent\n   */\n  @HostBinding('style.--max-width')\n  @Input()\n  maxWidth: number | undefined;\n\n  /**\n   *\n   * Defines the application theme\n   *\n   * @type {ApplicationTheme}\n   * @memberof ToggleComponent\n   */\n  @Input() applicationTheme: ApplicationTheme = 'light';\n\n  /**\n   * The `toggle` event is triggered when the state of the toggle switch changes. It returns the new state.\n   *\n   * @type {event}\n   * @memberof ToggleComponent\n   */\n  // eslint-disable-next-line @angular-eslint/no-output-native -- output shadows a native event; rename is breaking, deferred to the breaking-change MAJOR (see plan)\n  @Output() toggle = new EventEmitter<boolean>();\n\n  /**\n   * A string representing the ARIA label for accessibility.\n   * This label is used to provide an accessible name for the input element.\n   * @type {string}\n   * @memberof ToggleComponent\n   */\n  @Input() ariaLabel: string;\n\n  @Input() testId: string | null = null;\n\n  /**\n   * A string representing the ARIA requirement for accessibility.\n   * This attribute is used to indicate whether an input field is required for form submission.\n   * @type {boolean}\n   * @memberof ToggleComponent\n   */\n  @Input() ariaRequired = false;\n\n  /**\n   * disable/enable click on toggle\n   * @type {boolean}\n   * @memberof ToggleComponent\n   */\n  @Input() preventClick = false;\n\n  /**\n   * The loading state\n   *\n   * @type {boolean}\n   * @memberof ToggleComponent\n   */\n  @Input() loading = false;\n\n  /**\n   * A string representing the ARIA requirement for accessibility.\n   * This attribute is used to indicate whether an input field is required for form submission.\n   * @type {string}\n   * @memberof ToggleComponent\n   */\n  @Input() ariaDescribedby = '';\n\n  protected showLabelTooltip = false;\n  protected classes: string;\n\n  private static nextInstanceId = 0;\n\n  // Shared ids would point every toggle's `aria-labelledby` at the first toggle's label.\n  protected readonly labelId = `ui-toggle-label-${++ToggleComponent.nextInstanceId}`;\n  protected readonly describedbyId = `ui-toggle-describedby-${ToggleComponent.nextInstanceId}`;\n\n  constructor(\n    @Optional() @Inject('CANOPYUI_DEFAULT_APPLICATION_THEME') private readonly defaultAppTheme: ApplicationTheme\n  ) {\n    if (defaultAppTheme) {\n      this.applicationTheme = defaultAppTheme;\n    }\n  }\n\n  ngOnChanges(): void {\n    this.setClasses();\n  }\n\n  ngOnInit(): void {\n    this.setClasses();\n  }\n\n  onToggle(): void {\n    if (this.preventClick) {\n      this.toggle.emit(this.selected);\n    }\n    if (!this.disabled && !this.preventClick) {\n      this.selected = !this.selected;\n      this.toggle.emit(this.selected);\n      this.onChange(this.selected);\n    }\n  }\n\n  private readonly cdr = inject(ChangeDetectorRef);\n\n  writeValue(state: boolean): void {\n    if (state) {\n      this.selected = state;\n    }\n    // The forms API calls this from outside the component's own change\n    // detection — under OnPush the view must be marked explicitly.\n    this.cdr.markForCheck();\n  }\n\n  registerOnChange(fn: RegisterFn): void {\n    this.onChange = fn;\n  }\n\n  registerOnTouched(fn: RegisterFn): void {\n    this.onTouched = fn;\n  }\n\n  setDisabledState(isDisabled: boolean): void {\n    this.disabled = isDisabled;\n    // Recompute the root [ngClass] — it's otherwise only built in\n    // ngOnInit/ngOnChanges, so the `disabled` class never applied when\n    // disabling through the forms API.\n    this.setClasses();\n    this.cdr.markForCheck();\n  }\n\n  changeTextState(state: boolean): void {\n    this.showLabelTooltip = state;\n  }\n\n  onKeydown($event: KeyboardEvent) {\n    if ($event.key === (IKeyboardEvent.ENTER as string) || $event.key === (IKeyboardEvent.SPACE as string)) {\n      $event.stopPropagation();\n      $event.preventDefault();\n      this.onToggle();\n    }\n  }\n\n  private onChange: RegisterFn = () => {};\n  private onTouched: RegisterFn = () => {};\n\n  private setClasses(): void {\n    this.classes = `${this.disabled ? 'disabled' : ''} ${this.applicationTheme} ${this.loading ? 'loading' : ''} ${!this.label ? 'small-toggle' : ''}`;\n  }\n}\n","<div class=\"toggle\" [ngClass]=\"classes\">\n  <div\n    [style.--max-width]=\"maxWidth + 'px'\"\n    tabindex=\"0\"\n    class=\"toggle-container\"\n    [ngClass]=\"{ active: selected }\"\n    (click)=\"onToggle()\"\n    [attr.aria-label]=\"ariaLabel\"\n    [attr.aria-required]=\"ariaRequired\"\n    (keydown)=\"onKeydown($event)\"\n    role=\"switch\"\n    [attr.aria-labelledby]=\"label ? labelId : null\"\n    [attr.aria-describedby]=\"ariaDescribedby ? describedbyId : null\"\n    [attr.aria-checked]=\"selected\"\n    [attr.data-testid]=\"testId\"\n  >\n    <span [style.display]=\"'none'\" [id]=\"describedbyId\">{{ ariaDescribedby }}</span>\n    <div\n      class=\"label\"\n      uiEllipseText\n      [matTooltipShowDelay]=\"800\"\n      [matTooltip]=\"showLabelTooltip ? label : ''\"\n      (onChangeTextState)=\"changeTextState($event)\"\n      [id]=\"labelId\"\n    >\n      {{ label }}\n    </div>\n    @if (!loading) {\n      <div class=\"knob\" [ngClass]=\"{ selected }\">\n        @if (selected && !label) {\n          <ui-icon [color]=\"disabled ? 'grey' : 'white'\" [size]=\"'16'\" [name]=\"'Check-round-filled'\"></ui-icon>\n        }\n      </div>\n    } @else {\n      <ui-spinner [isLoader]=\"false\" [size]=\"'small'\" [applicationTheme]=\"'dark'\"></ui-spinner>\n    }\n  </div>\n  @if (message && selected) {\n    <div class=\"message\">{{ message }}</div>\n  }\n</div>\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { MatInputModule } from '@angular/material/input';\nimport { MatTooltipModule } from '@angular/material/tooltip';\n\nimport { EllipseTextDirective, UiTranslatePipe } from '@testgorilla/tgo-ui/components/core';\nimport { IconComponentModule } from '@testgorilla/tgo-ui/components/icon';\nimport { SpinnerComponentModule } from '@testgorilla/tgo-ui/components/spinner';\n\nimport { ToggleComponent } from './toggle.component';\n\n@NgModule({\n  imports: [\n    CommonModule,\n    MatTooltipModule,\n    EllipseTextDirective,\n    MatInputModule,\n    UiTranslatePipe,\n    IconComponentModule,\n    SpinnerComponentModule,\n    ToggleComponent,\n  ],\n  exports: [ToggleComponent],\n})\nexport class ToggleComponentModule {}\n"],"mappings":"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"}