@ngx-formly/material
Version:
Formly is a dynamic (JSON powered) form library for Angular that bring unmatched maintainability to your application's forms.
709 lines (700 loc) • 30.2 kB
JavaScript
import * as i0 from '@angular/core';
import { Component, ChangeDetectionStrategy, ViewChild, InjectionToken, forwardRef, EventEmitter, Directive, Inject, Input, Output, NgModule, NO_ERRORS_SCHEMA } from '@angular/core';
import { CommonModule } from '@angular/common';
import * as i3 from '@ngx-formly/core';
import { FormlyModule } from '@ngx-formly/core';
import * as i4 from '@angular/forms';
import { NG_VALUE_ACCESSOR, ReactiveFormsModule } from '@angular/forms';
import * as i1 from '@angular/material/slider';
import { MatSlider, MatSliderModule } from '@angular/material/slider';
import { FieldType, FormlyMatFormFieldModule } from '@ngx-formly/material/form-field';
import { VERSION as VERSION$1 } from '@angular/cdk';
import { VERSION, MatCommonModule, MatRippleModule } from '@angular/material/core';
import { coerceNumberProperty, coerceBooleanProperty } from '@angular/cdk/coercion';
import { Subject } from 'rxjs';
class FormlyFieldSlider$2 extends FieldType {
constructor() {
super(...arguments);
this.defaultOptions = {
props: {
hideFieldUnderline: true,
floatLabel: 'always',
thumbLabel: false,
displayWith: (value) => value,
},
};
}
onContainerClick(event) {
this.slider.focus?.();
super.onContainerClick(event);
}
}
FormlyFieldSlider$2.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: FormlyFieldSlider$2, deps: null, target: i0.ɵɵFactoryTarget.Component });
FormlyFieldSlider$2.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: FormlyFieldSlider$2, selector: "formly-field-mat-slider", viewQueries: [{ propertyName: "slider", first: true, predicate: MatSlider, descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: `
<mat-slider
[id]="id"
[style.width]="'100%'"
[formControl]="formControl"
[formlyAttributes]="field"
[tabIndex]="props.tabindex"
[color]="props.color"
[displayWith]="props.displayWith"
[invert]="props.invert"
[max]="props.max"
[min]="props.min"
[step]="props.step"
[thumbLabel]="props.thumbLabel || props.discrete"
[tickInterval]="props.tickInterval"
[valueText]="props.valueText"
[vertical]="props.vertical"
(input)="props.input && props.input(field, $event)"
(change)="props.change && props.change(field, $event)"
>
</mat-slider>
`, isInline: true, components: [{ type: i1.MatSlider, selector: "mat-slider", inputs: ["disabled", "color", "tabIndex", "invert", "max", "min", "step", "thumbLabel", "tickInterval", "value", "displayWith", "valueText", "vertical"], outputs: ["change", "input", "valueChange"], exportAs: ["matSlider"] }], directives: [{ type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i3.ɵFormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: FormlyFieldSlider$2, decorators: [{
type: Component,
args: [{
selector: 'formly-field-mat-slider',
template: `
<mat-slider
[id]="id"
[style.width]="'100%'"
[formControl]="formControl"
[formlyAttributes]="field"
[tabIndex]="props.tabindex"
[color]="props.color"
[displayWith]="props.displayWith"
[invert]="props.invert"
[max]="props.max"
[min]="props.min"
[step]="props.step"
[thumbLabel]="props.thumbLabel || props.discrete"
[tickInterval]="props.tickInterval"
[valueText]="props.valueText"
[vertical]="props.vertical"
(input)="props.input && props.input(field, $event)"
(change)="props.change && props.change(field, $event)"
>
</mat-slider>
`,
changeDetection: ChangeDetectionStrategy.OnPush,
}]
}], propDecorators: { slider: [{
type: ViewChild,
args: [MatSlider, { static: true }]
}] } });
/**
* @license
* Copyright Google LLC All Rights Reserved.
*
* Use of this source code is governed by an MIT-style license that can be
* found in the LICENSE file at https://angular.io/license
*/
/**
* Injection token that can be used to query for a `MatSliderThumb`.
* Used primarily to avoid circular imports.
* @docs-private
*/
const MAT_SLIDER_THUMB = new InjectionToken('_MatSliderThumb');
/**
* @license
* Copyright Google LLC All Rights Reserved.
*
* Use of this source code is governed by an MIT-style license that can be
* found in the LICENSE file at https://angular.io/license
*/
class Signal {
constructor(value) {
this.value = value;
}
set(value) {
this.value = value;
}
update(updateFn) {
this.set(updateFn(this.value));
}
asReadonly() {
return this;
}
}
/**
* Provider that allows the slider thumb to register as a ControlValueAccessor.
* @docs-private
*/
const MAT_SLIDER_THUMB_VALUE_ACCESSOR = {
provide: NG_VALUE_ACCESSOR,
useExisting: forwardRef(() => MatSliderThumb),
multi: true,
};
/**
* Directive that adds slider-specific behaviors to an input element inside `<mat-slider>`.
* Up to two may be placed inside of a `<mat-slider>`.
*
* If one is used, the selector `matSliderThumb` must be used, and the outcome will be a normal
* slider. If two are used, the selectors `matSliderStartThumb` and `matSliderEndThumb` must be
* used, and the outcome will be a range slider with two slider thumbs.
* @ignore
*/
class MatSliderThumb {
constructor(_ngZone, _elementRef, _cdr, _slider) {
this._ngZone = _ngZone;
this._elementRef = _elementRef;
this._cdr = _cdr;
this._slider = _slider;
/** Event emitted when the `value` is changed. */
this.valueChange = new EventEmitter();
/** Event emitted when the slider thumb starts being dragged. */
this.dragStart = new EventEmitter();
/** Event emitted when the slider thumb stops being dragged. */
this.dragEnd = new EventEmitter();
/**
* Indicates whether this thumb is the start or end thumb.
* @docs-private
*/
this.thumbPosition = 2 /* END */;
/** The aria-valuetext string representation of the input's value. */
this._valuetext = +VERSION.major >= 18 ? new Signal('') : '';
/** The radius of a native html slider's knob. */
this._knobRadius = 8;
/** Whether user's cursor is currently in a mouse down state on the input. */
this._isActive = false;
/** Whether the input is currently focused (either by tab or after clicking). */
this._isFocused = false;
/**
* Whether the initial value has been set.
* This exists because the initial value cannot be immediately set because the min and max
* must first be relayed from the parent MatSlider component, which can only happen later
* in the component lifecycle.
*/
this._hasSetInitialValue = false;
/** Emits when the component is destroyed. */
this._destroyed = new Subject();
/**
* Indicates whether UI updates should be skipped.
*
* This flag is used to avoid flickering
* when correcting values on pointer up/down.
*/
this._skipUIUpdate = false;
/** Callback called when the slider input value changes. */
this._onChangeFn = () => { };
/** Callback called when the slider input has been touched. */
this._onTouchedFn = () => { };
this._hostElement = _elementRef.nativeElement;
this._onPointerDown = this._onPointerDown.bind(this);
this._onPointerMove = this._onPointerMove.bind(this);
this._onPointerUp = this._onPointerUp.bind(this);
this._ngZone.runOutsideAngular(() => {
this._hostElement.addEventListener('pointerdown', this._onPointerDown);
this._hostElement.addEventListener('pointermove', this._onPointerMove);
this._hostElement.addEventListener('pointerup', this._onPointerUp);
});
}
get value() {
return coerceNumberProperty(this._hostElement.value);
}
set value(v) {
const val = coerceNumberProperty(v).toString();
if (!this._hasSetInitialValue) {
this._initialValue = val;
return;
}
if (this._isActive) {
return;
}
this._hostElement.value = val;
this._updateThumbUIByValue();
this._slider._onValueChange(this);
this._cdr.detectChanges();
}
/**
* The current translateX in px of the slider visual thumb.
* @docs-private
*/
get translateX() {
if (this._slider.min >= this._slider.max) {
this._translateX = 0;
return this._translateX;
}
if (this._translateX === undefined) {
this._translateX = this._calcTranslateXByValue();
}
return this._translateX;
}
set translateX(v) {
this._translateX = v;
}
/** @docs-private */
get min() {
return coerceNumberProperty(this._hostElement.min);
}
set min(v) {
this._hostElement.min = coerceNumberProperty(v).toString();
this._cdr.detectChanges();
}
/** @docs-private */
get max() {
return coerceNumberProperty(this._hostElement.max);
}
set max(v) {
this._hostElement.max = coerceNumberProperty(v).toString();
this._cdr.detectChanges();
}
get step() {
return coerceNumberProperty(this._hostElement.step);
}
set step(v) {
this._hostElement.step = coerceNumberProperty(v).toString();
this._cdr.detectChanges();
}
/** @docs-private */
get disabled() {
return coerceBooleanProperty(this._hostElement.disabled);
}
set disabled(v) {
this._hostElement.disabled = coerceBooleanProperty(v);
this._cdr.detectChanges();
if (this._slider.disabled !== this.disabled) {
this._slider.disabled = this.disabled;
}
}
/** The percentage of the slider that coincides with the value. */
get percentage() {
if (this._slider.min >= this._slider.max) {
return this._slider._isRtl ? 1 : 0;
}
return (this.value - this._slider.min) / (this._slider.max - this._slider.min);
}
/** @docs-private */
get fillPercentage() {
if (!this._slider._cachedWidth) {
return this._slider._isRtl ? 1 : 0;
}
if (this._translateX === 0) {
return 0;
}
return this.translateX / this._slider._cachedWidth;
}
get valuetext() {
return +VERSION.major >= 18 ? this._valuetext.value : this._valuetext;
}
/** Used to relay updates to _isFocused to the slider visual thumbs. */
_setIsFocused(v) {
this._isFocused = v;
}
ngOnDestroy() {
this._hostElement.removeEventListener('pointerdown', this._onPointerDown);
this._hostElement.removeEventListener('pointermove', this._onPointerMove);
this._hostElement.removeEventListener('pointerup', this._onPointerUp);
this._destroyed.next();
this._destroyed.complete();
this.dragStart.complete();
this.dragEnd.complete();
}
/** @docs-private */
initProps() {
this._updateWidthInactive();
// If this or the parent slider is disabled, just make everything disabled.
if (this.disabled !== this._slider.disabled) {
// The MatSlider setter for disabled will relay this and disable both inputs.
this._slider.disabled = true;
}
this.step = this._slider.step;
this.min = this._slider.min;
this.max = this._slider.max;
this._initValue();
}
/** @docs-private */
initUI() {
this._updateThumbUIByValue();
}
_initValue() {
this._hasSetInitialValue = true;
if (this._initialValue === undefined) {
this.value = this._getDefaultValue();
}
else {
this._hostElement.value = this._initialValue;
this._updateThumbUIByValue();
this._slider._onValueChange(this);
this._cdr.detectChanges();
}
}
_getDefaultValue() {
return this.min;
}
_onBlur() {
this._setIsFocused(false);
this._onTouchedFn();
}
_onFocus() {
this._setIsFocused(true);
}
_onChange() {
this.valueChange.emit(this.value);
// only used to handle the edge case where user
// mousedown on the slider then uses arrow keys.
if (this._isActive) {
this._updateThumbUIByValue({ withAnimation: true });
}
}
_onInput() {
this._onChangeFn(this.value);
// handles arrowing and updating the value when
// a step is defined.
if (this._slider.step || !this._isActive) {
this._updateThumbUIByValue({ withAnimation: true });
}
this._slider._onValueChange(this);
}
_onNgControlValueChange() {
// only used to handle when the value change
// originates outside of the slider.
if (!this._isActive || !this._isFocused) {
this._slider._onValueChange(this);
this._updateThumbUIByValue();
}
this._slider.disabled = this._formControl.disabled;
}
_onPointerDown(event) {
if (this.disabled || event.button !== 0) {
return;
}
this._isActive = true;
this._setIsFocused(true);
this._updateWidthActive();
this._slider._updateDimensions();
// Does nothing if a step is defined because we
// want the value to snap to the values on input.
if (!this._slider.step) {
this._updateThumbUIByPointerEvent(event, { withAnimation: true });
}
if (!this.disabled) {
this._handleValueCorrection(event);
this.dragStart.emit({ source: this, parent: this._slider, value: this.value });
}
}
/**
* Corrects the value of the slider on pointer up/down.
*
* Called on pointer down and up because the value is set based
* on the inactive width instead of the active width.
*/
_handleValueCorrection(event) {
// Don't update the UI with the current value! The value on pointerdown
// and pointerup is calculated in the split second before the input(s)
// resize. See _updateWidthInactive() and _updateWidthActive() for more
// details.
this._skipUIUpdate = true;
// Note that this function gets triggered before the actual value of the
// slider is updated. This means if we were to set the value here, it
// would immediately be overwritten. Using setTimeout ensures the setting
// of the value happens after the value has been updated by the
// pointerdown event.
setTimeout(() => {
this._skipUIUpdate = false;
this._fixValue(event);
}, 0);
}
/** Corrects the value of the slider based on the pointer event's position. */
_fixValue(event) {
const xPos = event.clientX - this._slider._cachedLeft;
const width = this._slider._cachedWidth;
const step = this._slider.step === 0 ? 1 : this._slider.step;
const numSteps = Math.floor((this._slider.max - this._slider.min) / step);
const percentage = this._slider._isRtl ? 1 - xPos / width : xPos / width;
// To ensure the percentage is rounded to the necessary number of decimals.
const fixedPercentage = Math.round(percentage * numSteps) / numSteps;
const impreciseValue = fixedPercentage * (this._slider.max - this._slider.min) + this._slider.min;
const value = Math.round(impreciseValue / step) * step;
const prevValue = this.value;
if (value === prevValue) {
// Because we prevented UI updates, if it turns out that the race
// condition didn't happen and the value is already correct, we
// have to apply the ui updates now.
this._slider._onValueChange(this);
this._slider.step > 0
? this._updateThumbUIByValue()
: this._updateThumbUIByPointerEvent(event, { withAnimation: this._slider._hasAnimation });
return;
}
this.value = value;
this.valueChange.emit(this.value);
this._onChangeFn(this.value);
this._slider._onValueChange(this);
this._slider.step > 0
? this._updateThumbUIByValue()
: this._updateThumbUIByPointerEvent(event, { withAnimation: this._slider._hasAnimation });
}
_onPointerMove(event) {
// Again, does nothing if a step is defined because
// we want the value to snap to the values on input.
if (!this._slider.step && this._isActive) {
this._updateThumbUIByPointerEvent(event);
}
}
_onPointerUp() {
if (this._isActive) {
this._isActive = false;
this.dragEnd.emit({ source: this, parent: this._slider, value: this.value });
setTimeout(() => this._updateWidthInactive());
}
}
_clamp(v) {
return Math.max(Math.min(v, this._slider._cachedWidth), 0);
}
_calcTranslateXByValue() {
if (this._slider._isRtl) {
return (1 - this.percentage) * this._slider._cachedWidth;
}
return this.percentage * this._slider._cachedWidth;
}
_calcTranslateXByPointerEvent(event) {
return event.clientX - this._slider._cachedLeft;
}
/**
* Used to set the slider width to the correct
* dimensions while the user is dragging.
*/
_updateWidthActive() {
this._hostElement.style.padding = `0 ${this._slider._inputPadding}px`;
this._hostElement.style.width = `calc(100% + ${this._slider._inputPadding}px)`;
}
/**
* Sets the slider input to disproportionate dimensions to allow for touch
* events to be captured on touch devices.
*/
_updateWidthInactive() {
this._hostElement.style.padding = '0px';
this._hostElement.style.width = 'calc(100% + 48px)';
this._hostElement.style.left = '-24px';
}
_updateThumbUIByValue(options) {
this.translateX = this._clamp(this._calcTranslateXByValue());
this._updateThumbUI(options);
}
_updateThumbUIByPointerEvent(event, options) {
this.translateX = this._clamp(this._calcTranslateXByPointerEvent(event));
this._updateThumbUI(options);
}
_updateThumbUI(options) {
this._slider._setTransition(!!options?.withAnimation);
this._slider._onTranslateXChange(this);
}
/**
* Sets the input's value.
* @param value The new value of the input
* @docs-private
*/
writeValue(value) {
this.value = value;
}
/**
* Registers a callback to be invoked when the input's value changes from user input.
* @param fn The callback to register
* @docs-private
*/
registerOnChange(fn) {
this._onChangeFn = fn;
}
/**
* Registers a callback to be invoked when the input is blurred by the user.
* @param fn The callback to register
* @docs-private
*/
registerOnTouched(fn) {
this._onTouchedFn = fn;
}
/**
* Sets the disabled state of the slider.
* @param isDisabled The new disabled state
* @docs-private
*/
setDisabledState(isDisabled) {
this.disabled = isDisabled;
}
focus() {
this._hostElement.focus();
}
blur() {
this._hostElement.blur();
}
}
MatSliderThumb.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: MatSliderThumb, deps: [{ token: i0.NgZone }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: MatSlider }], target: i0.ɵɵFactoryTarget.Directive });
MatSliderThumb.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.12", type: MatSliderThumb, selector: "input[matSliderThumb]", inputs: { value: "value" }, outputs: { valueChange: "valueChange", dragStart: "dragStart", dragEnd: "dragEnd" }, host: { attributes: { "type": "range" }, listeners: { "change": "_onChange()", "input": "_onInput()", "blur": "_onBlur()", "focus": "_onFocus()" }, properties: { "attr.aria-valuetext": "valuetext" }, classAttribute: "mdc-slider__input" }, providers: [MAT_SLIDER_THUMB_VALUE_ACCESSOR, { provide: MAT_SLIDER_THUMB, useExisting: MatSliderThumb }], exportAs: ["matSliderThumb"], ngImport: i0 });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: MatSliderThumb, decorators: [{
type: Directive,
args: [{
// eslint-disable-next-line
selector: 'input[matSliderThumb]',
exportAs: 'matSliderThumb',
host: {
class: 'mdc-slider__input',
type: 'range',
'[attr.aria-valuetext]': 'valuetext',
'(change)': '_onChange()',
'(input)': '_onInput()',
// TODO(wagnermaciel): Consider using a global event listener instead.
// Reason: I have found a semi-consistent way to mouse up without triggering this event.
'(blur)': '_onBlur()',
'(focus)': '_onFocus()',
},
providers: [MAT_SLIDER_THUMB_VALUE_ACCESSOR, { provide: MAT_SLIDER_THUMB, useExisting: MatSliderThumb }],
}]
}], ctorParameters: function () { return [{ type: i0.NgZone }, { type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: undefined, decorators: [{
type: Inject,
args: [MatSlider]
}] }]; }, propDecorators: { value: [{
type: Input
}], valueChange: [{
type: Output
}], dragStart: [{
type: Output
}], dragEnd: [{
type: Output
}] } });
/**
* @ignore
*/
class FormlyFieldMDCSlider extends FormlyFieldSlider$2 {
set mdcSlider(slider) {
Object.defineProperty(slider, '_input', {
set: () => { },
get: () => this.sliderThumb,
});
const visualThumb = {
_hostElement: {
classList: {
add: () => { },
remove: () => { },
},
},
};
// workarround for "ERROR TypeError: visualThumb is undefined" when `discrete` is set to `true`
slider._thumbs = { first: visualThumb, last: visualThumb };
}
onContainerClick(event) {
this.sliderThumb?._hostElement.focus();
super.onContainerClick(event);
}
}
FormlyFieldMDCSlider.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: FormlyFieldMDCSlider, deps: null, target: i0.ɵɵFactoryTarget.Component });
FormlyFieldMDCSlider.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: FormlyFieldMDCSlider, selector: "formly-field-mat-slider", viewQueries: [{ propertyName: "sliderThumb", first: true, predicate: MAT_SLIDER_THUMB, descendants: true, static: true }, { propertyName: "mdcSlider", first: true, predicate: MatSlider, descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: `
<mat-slider
[id]="id"
[style.width]="'100%'"
[formlyAttributes]="field"
[tabIndex]="props.tabindex"
[color]="props.color"
[displayWith]="props.displayWith"
[invert]="props.invert"
[max]="props.max"
[min]="props.min"
[step]="props.step"
[discrete]="props.thumbLabel || props.discrete"
[showTickMarks]="props.showTickMarks"
[step]="props.step"
[tickInterval]="props.tickInterval"
[valueText]="props.valueText"
[vertical]="props.vertical"
(input)="props.input && props.input(field, $event)"
(change)="props.change && props.change(field, $event)"
>
<input matSliderThumb [formControl]="formControl" [formlyAttributes]="field" />
</mat-slider>
`, isInline: true, components: [{ type: i1.MatSlider, selector: "mat-slider", inputs: ["disabled", "color", "tabIndex", "invert", "max", "min", "step", "thumbLabel", "tickInterval", "value", "displayWith", "valueText", "vertical"], outputs: ["change", "input", "valueChange"], exportAs: ["matSlider"] }], directives: [{ type: i3.ɵFormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }, { type: MatSliderThumb, selector: "input[matSliderThumb]", inputs: ["value"], outputs: ["valueChange", "dragStart", "dragEnd"], exportAs: ["matSliderThumb"] }, { type: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: FormlyFieldMDCSlider, decorators: [{
type: Component,
args: [{
selector: 'formly-field-mat-slider',
template: `
<mat-slider
[id]="id"
[style.width]="'100%'"
[formlyAttributes]="field"
[tabIndex]="props.tabindex"
[color]="props.color"
[displayWith]="props.displayWith"
[invert]="props.invert"
[max]="props.max"
[min]="props.min"
[step]="props.step"
[discrete]="props.thumbLabel || props.discrete"
[showTickMarks]="props.showTickMarks"
[step]="props.step"
[tickInterval]="props.tickInterval"
[valueText]="props.valueText"
[vertical]="props.vertical"
(input)="props.input && props.input(field, $event)"
(change)="props.change && props.change(field, $event)"
>
<input matSliderThumb [formControl]="formControl" [formlyAttributes]="field" />
</mat-slider>
`,
changeDetection: ChangeDetectionStrategy.OnPush,
}]
}], propDecorators: { sliderThumb: [{
type: ViewChild,
args: [MAT_SLIDER_THUMB, { static: true }]
}], mdcSlider: [{
type: ViewChild,
args: [MatSlider, { static: true }]
}] } });
const FormlyFieldSlider$1 = Number(VERSION$1.major) >= 15 ? FormlyFieldMDCSlider : FormlyFieldSlider$2;
class FormlyMatSliderModule {
}
FormlyMatSliderModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: FormlyMatSliderModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
FormlyMatSliderModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: FormlyMatSliderModule, declarations: [FormlyFieldSlider$2, FormlyFieldMDCSlider, MatSliderThumb], imports: [CommonModule,
MatCommonModule,
MatRippleModule,
ReactiveFormsModule,
MatSliderModule,
FormlyMatFormFieldModule, i3.FormlyModule] });
FormlyMatSliderModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: FormlyMatSliderModule, imports: [[
CommonModule,
MatCommonModule,
MatRippleModule,
ReactiveFormsModule,
MatSliderModule,
FormlyMatFormFieldModule,
FormlyModule.forChild({
types: [
{
name: 'slider',
component: FormlyFieldSlider$1,
wrappers: ['form-field'],
},
],
}),
]] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: FormlyMatSliderModule, decorators: [{
type: NgModule,
args: [{
declarations: [FormlyFieldSlider$2, FormlyFieldMDCSlider, MatSliderThumb],
imports: [
CommonModule,
MatCommonModule,
MatRippleModule,
ReactiveFormsModule,
MatSliderModule,
FormlyMatFormFieldModule,
FormlyModule.forChild({
types: [
{
name: 'slider',
component: FormlyFieldSlider$1,
wrappers: ['form-field'],
},
],
}),
],
schemas: [NO_ERRORS_SCHEMA],
}]
}] });
const FormlyFieldSlider = Number(VERSION$1.major) >= 15 ? FormlyFieldMDCSlider : FormlyFieldSlider$2;
/**
* Generated bundle index. Do not edit.
*/
export { FormlyFieldSlider, FormlyMatSliderModule };
//# sourceMappingURL=ngx-formly-material-slider.mjs.map