@vallift/ngl 22.0.25 → 22.0.27

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -2507,7 +2507,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImpor
2507
2507
  }] } });
2508
2508
 
2509
2509
  class ColorPickerDirective {
2510
- colorChanged = new EventEmitter(false);
2510
+ initialHexColor = input('', /* @ts-ignore */
2511
+ ...(ngDevMode ? [{ debugName: "initialHexColor" }] : /* istanbul ignore next */ []));
2512
+ enableAlpha = input(true, /* @ts-ignore */
2513
+ ...(ngDevMode ? [{ debugName: "enableAlpha" }] : /* istanbul ignore next */ []));
2514
+ enableAdditionalColor = input(false, /* @ts-ignore */
2515
+ ...(ngDevMode ? [{ debugName: "enableAdditionalColor" }] : /* istanbul ignore next */ []));
2516
+ disabled = input(false, /* @ts-ignore */
2517
+ ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
2518
+ colorChanged = output();
2519
+ pickerClosed = output();
2511
2520
  componentRef = null;
2512
2521
  overlay = null;
2513
2522
  elementRef = inject(ElementRef);
@@ -2515,6 +2524,9 @@ class ColorPickerDirective {
2515
2524
  appRef = inject(ApplicationRef);
2516
2525
  injector = inject(Injector);
2517
2526
  onClick() {
2527
+ if (this.disabled()) {
2528
+ return;
2529
+ }
2518
2530
  if (this.componentRef) {
2519
2531
  this.closeColorPicker();
2520
2532
  return;
@@ -2522,7 +2534,7 @@ class ColorPickerDirective {
2522
2534
  this.initializeColorPicker();
2523
2535
  }
2524
2536
  initializeColorPicker() {
2525
- if (this.componentRef !== null) {
2537
+ if (this.disabled() || this.componentRef !== null) {
2526
2538
  return;
2527
2539
  }
2528
2540
  const componentRef = createComponent(ColorPickerComponent, {
@@ -2530,8 +2542,12 @@ class ColorPickerDirective {
2530
2542
  elementInjector: this.injector,
2531
2543
  });
2532
2544
  this.componentRef = componentRef;
2545
+ componentRef.setInput('hexColor', this.initialHexColor() || '#000000');
2546
+ componentRef.setInput('enableAlpha', this.enableAlpha());
2547
+ componentRef.setInput('enableAdditionalColor', this.enableAdditionalColor());
2548
+ componentRef.changeDetectorRef.detectChanges();
2533
2549
  this.appRef.attachView(componentRef.hostView);
2534
- const [domElement] = componentRef.hostView.rootNodes;
2550
+ const pickerElement = componentRef.location.nativeElement;
2535
2551
  const elementRect = this.elementRef.nativeElement.getBoundingClientRect();
2536
2552
  this.overlay = document.createElement('div');
2537
2553
  this.overlay.id = 'ng-color-picker';
@@ -2542,10 +2558,10 @@ class ColorPickerDirective {
2542
2558
  this.overlay.style.zIndex = '2000';
2543
2559
  this.overlay.style.top = '0';
2544
2560
  this.overlay.style.left = '0';
2545
- componentRef.location.nativeElement.style.position = 'absolute';
2546
- componentRef.location.nativeElement.style.zIndex = '2001';
2547
- componentRef.location.nativeElement.style.top = `${elementRect.bottom + 20}px`;
2548
- componentRef.location.nativeElement.style.left = `${elementRect.left}px`;
2561
+ pickerElement.style.position = 'absolute';
2562
+ pickerElement.style.zIndex = '2001';
2563
+ pickerElement.style.top = `${elementRect.bottom + 20}px`;
2564
+ pickerElement.style.left = `${elementRect.left}px`;
2549
2565
  componentRef.instance.COLOR_PICKER_HEIGHT.set(140);
2550
2566
  componentRef.instance.COLOR_PICKER_WIDTH.set(250);
2551
2567
  componentRef.instance.isTooltip.set(true);
@@ -2557,7 +2573,8 @@ class ColorPickerDirective {
2557
2573
  this.closeColorPicker();
2558
2574
  });
2559
2575
  document.body.appendChild(this.overlay);
2560
- document.body.appendChild(domElement);
2576
+ document.body.appendChild(pickerElement);
2577
+ componentRef.changeDetectorRef.detectChanges();
2561
2578
  }
2562
2579
  closeColorPicker() {
2563
2580
  if (!this.componentRef) {
@@ -2568,12 +2585,13 @@ class ColorPickerDirective {
2568
2585
  this.overlay?.remove();
2569
2586
  this.overlay = null;
2570
2587
  this.componentRef = null;
2588
+ this.pickerClosed.emit();
2571
2589
  }
2572
2590
  ngOnDestroy() {
2573
2591
  this.closeColorPicker();
2574
2592
  }
2575
2593
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: ColorPickerDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
2576
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.1", type: ColorPickerDirective, isStandalone: true, selector: "[appColorPicker]", outputs: { colorChanged: "colorChanged" }, host: { listeners: { "click": "onClick()" } }, ngImport: i0 });
2594
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.1", type: ColorPickerDirective, isStandalone: true, selector: "[appColorPicker]", inputs: { initialHexColor: { classPropertyName: "initialHexColor", publicName: "initialHexColor", isSignal: true, isRequired: false, transformFunction: null }, enableAlpha: { classPropertyName: "enableAlpha", publicName: "enableAlpha", isSignal: true, isRequired: false, transformFunction: null }, enableAdditionalColor: { classPropertyName: "enableAdditionalColor", publicName: "enableAdditionalColor", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { colorChanged: "colorChanged", pickerClosed: "pickerClosed" }, host: { listeners: { "click": "onClick()" } }, ngImport: i0 });
2577
2595
  }
2578
2596
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: ColorPickerDirective, decorators: [{
2579
2597
  type: Directive,
@@ -2581,9 +2599,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImpor
2581
2599
  selector: '[appColorPicker]',
2582
2600
  standalone: true,
2583
2601
  }]
2584
- }], propDecorators: { colorChanged: [{
2585
- type: Output
2586
- }], onClick: [{
2602
+ }], propDecorators: { initialHexColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "initialHexColor", required: false }] }], enableAlpha: [{ type: i0.Input, args: [{ isSignal: true, alias: "enableAlpha", required: false }] }], enableAdditionalColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "enableAdditionalColor", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], colorChanged: [{ type: i0.Output, args: ["colorChanged"] }], pickerClosed: [{ type: i0.Output, args: ["pickerClosed"] }], onClick: [{
2587
2603
  type: HostListener,
2588
2604
  args: ['click']
2589
2605
  }] } });
@@ -14697,6 +14713,82 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImpor
14697
14713
  args: ['trackRef']
14698
14714
  }] } });
14699
14715
 
14716
+ let nextColorFieldId = 0;
14717
+ const DEFAULT_COLOR = '#000000';
14718
+ const HEX_COLOR_PATTERN = /^#[0-9A-Fa-f]{6}$/;
14719
+ class SignalColorField extends BaseSignalTextInputControl {
14720
+ label = input('', /* @ts-ignore */
14721
+ ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
14722
+ hint = input('', /* @ts-ignore */
14723
+ ...(ngDevMode ? [{ debugName: "hint" }] : /* istanbul ignore next */ []));
14724
+ id = input(/* @ts-ignore */
14725
+ ...(ngDevMode ? [undefined, { debugName: "id" }] : /* istanbul ignore next */ []));
14726
+ valueChange = output();
14727
+ colorInputRef;
14728
+ instanceId = ++nextColorFieldId;
14729
+ colorInputId = computed(() => this.id() ?? `signal-color-field-${this.instanceId}`, /* @ts-ignore */
14730
+ ...(ngDevMode ? [{ debugName: "colorInputId" }] : /* istanbul ignore next */ []));
14731
+ isInteractive = computed(() => !this.disabled() && !this.readonly(), /* @ts-ignore */
14732
+ ...(ngDevMode ? [{ debugName: "isInteractive" }] : /* istanbul ignore next */ []));
14733
+ usesPeerFloatingLabel = computed(() => usesPeerFloatingLabel(this.appearance()), /* @ts-ignore */
14734
+ ...(ngDevMode ? [{ debugName: "usesPeerFloatingLabel" }] : /* istanbul ignore next */ []));
14735
+ resolvedColor = computed(() => {
14736
+ const current = this.value();
14737
+ return current && HEX_COLOR_PATTERN.test(current) ? current : DEFAULT_COLOR;
14738
+ }, /* @ts-ignore */
14739
+ ...(ngDevMode ? [{ debugName: "resolvedColor" }] : /* istanbul ignore next */ []));
14740
+ displayHex = computed(() => {
14741
+ const current = this.value();
14742
+ return current && HEX_COLOR_PATTERN.test(current) ? current : this.resolvedColor();
14743
+ }, /* @ts-ignore */
14744
+ ...(ngDevMode ? [{ debugName: "displayHex" }] : /* istanbul ignore next */ []));
14745
+ appearanceWrapperClasses = computed(() => {
14746
+ const base = getAppearanceWrapperClasses(this.appearance(), this.isFocused(), this.disabled());
14747
+ if (this.showError() && !this.disabled()) {
14748
+ return `${base} border-error ring-4 ring-error-subtle`;
14749
+ }
14750
+ return base;
14751
+ }, /* @ts-ignore */
14752
+ ...(ngDevMode ? [{ debugName: "appearanceWrapperClasses" }] : /* istanbul ignore next */ []));
14753
+ wrapperHeightClasses = computed(() => getWrapperHeightClasses(this.appearance(), this.size()), /* @ts-ignore */
14754
+ ...(ngDevMode ? [{ debugName: "wrapperHeightClasses" }] : /* istanbul ignore next */ []));
14755
+ inputSizeClasses = computed(() => getInputSizeClasses(this.appearance(), this.size(), this.isFocused(), this.displayHex()), /* @ts-ignore */
14756
+ ...(ngDevMode ? [{ debugName: "inputSizeClasses" }] : /* istanbul ignore next */ []));
14757
+ horizontalPaddingClasses = computed(() => getHorizontalPaddingClasses(this.appearance(), this.size(), false, true, false, false, false, false), /* @ts-ignore */
14758
+ ...(ngDevMode ? [{ debugName: "horizontalPaddingClasses" }] : /* istanbul ignore next */ []));
14759
+ inFieldLabelLeftClasses = computed(() => getInFieldLabelLeftClasses(this.size(), false), /* @ts-ignore */
14760
+ ...(ngDevMode ? [{ debugName: "inFieldLabelLeftClasses" }] : /* istanbul ignore next */ []));
14761
+ floatingLabelClasses = computed(() => getFloatingLabelClasses(this.size()), /* @ts-ignore */
14762
+ ...(ngDevMode ? [{ debugName: "floatingLabelClasses" }] : /* istanbul ignore next */ []));
14763
+ iftaLabelClasses = computed(() => getIftaLabelClasses(this.size()), /* @ts-ignore */
14764
+ ...(ngDevMode ? [{ debugName: "iftaLabelClasses" }] : /* istanbul ignore next */ []));
14765
+ floatingOutlineLabelClasses = computed(() => getFloatingOutlineLabelClasses(this.size(), false), /* @ts-ignore */
14766
+ ...(ngDevMode ? [{ debugName: "floatingOutlineLabelClasses" }] : /* istanbul ignore next */ []));
14767
+ openColorPicker() {
14768
+ if (!this.isInteractive()) {
14769
+ return;
14770
+ }
14771
+ this.colorInputRef?.nativeElement.click();
14772
+ }
14773
+ onInput(event) {
14774
+ if (!this.isInteractive()) {
14775
+ return;
14776
+ }
14777
+ const nextValue = event.target.value;
14778
+ this.setValue(nextValue);
14779
+ this.valueChange.emit(nextValue);
14780
+ }
14781
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: SignalColorField, deps: null, target: i0.ɵɵFactoryTarget.Component });
14782
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.1", type: SignalColorField, isStandalone: true, selector: "lib-signal-color-field", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, hint: { classPropertyName: "hint", publicName: "hint", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange" }, viewQueries: [{ propertyName: "colorInputRef", first: true, predicate: ["colorInputRef"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<lib-base-signal-input\n [label]=\"label()\"\n [showExternalLabel]=\"appearance() === 'outline' || appearance() === 'fill'\"\n [showRequired]=\"showRequiredIndicator()\"\n [showError]=\"showError()\"\n [errorMessage]=\"errorMessage()\"\n [disabled]=\"disabled()\"\n [hint]=\"hint()\"\n [inputId]=\"colorInputId()\">\n\n <div\n input\n class=\"relative flex items-center w-full rounded-xl transition-colors duration-200 ease-in-out\"\n [class.overflow-hidden]=\"appearance() !== 'floatingOutline'\"\n [class.overflow-visible]=\"appearance() === 'floatingOutline'\"\n [class.opacity-70]=\"disabled()\"\n [class]=\"appearanceWrapperClasses() + ' ' + wrapperHeightClasses()\">\n\n <div class=\"relative flex h-full min-w-0 flex-1 items-center\">\n @if (usesPeerFloatingLabel()) {\n <input\n type=\"text\"\n tabindex=\"-1\"\n aria-hidden=\"true\"\n readonly\n class=\"peer pointer-events-none absolute h-full w-full opacity-0 border-0 bg-transparent placeholder-transparent\"\n placeholder=\" \"\n [id]=\"colorInputId()\"\n [value]=\"displayHex()\" />\n }\n\n <button\n type=\"button\"\n class=\"relative h-full w-full text-left font-mono transition outline-none bg-transparent border-0 rounded-none truncate\"\n [class]=\"inputSizeClasses() + ' ' + horizontalPaddingClasses()\"\n [class.text-role-disabled]=\"disabled()\"\n [class.text-role-body]=\"!disabled()\"\n [class.cursor-pointer]=\"isInteractive()\"\n [class.cursor-default]=\"readonly() && !disabled()\"\n [class.cursor-not-allowed]=\"disabled()\"\n [id]=\"usesPeerFloatingLabel() ? null : colorInputId()\"\n [disabled]=\"disabled()\"\n [attr.aria-readonly]=\"readonly() || null\"\n [attr.aria-required]=\"showRequiredIndicator() || null\"\n [attr.aria-invalid]=\"showError() || null\"\n (click)=\"openColorPicker()\"\n (focus)=\"onFocus()\"\n (blur)=\"onBlur()\">\n {{ displayHex() }}\n </button>\n\n @if (appearance() === 'floating' && label()) {\n <label\n [attr.for]=\"colorInputId()\"\n [class]=\"floatingLabelClasses() + ' ' + inFieldLabelLeftClasses()\"\n [class.text-primary]=\"isFocused() && !showError() && !disabled()\"\n [class.text-error]=\"showError() && !disabled()\"\n [class.text-role-disabled]=\"disabled()\">\n {{ label() }}\n @if (showRequiredIndicator()) {\n <span class=\"text-error\" aria-hidden=\"true\">*</span>\n }\n </label>\n }\n\n @if (appearance() === 'floatingOutline' && label()) {\n <label\n [attr.for]=\"colorInputId()\"\n [class]=\"floatingOutlineLabelClasses()\"\n [class.text-primary]=\"isFocused() && !showError() && !disabled()\"\n [class.text-error]=\"showError() && !disabled()\"\n [class.text-role-disabled]=\"disabled()\">\n {{ label() }}\n @if (showRequiredIndicator()) {\n <span class=\"text-error\" aria-hidden=\"true\">*</span>\n }\n </label>\n }\n\n @if (appearance() === 'ifta' && label()) {\n <label\n [attr.for]=\"colorInputId()\"\n [class]=\"iftaLabelClasses() + ' ' + inFieldLabelLeftClasses()\"\n [class.text-primary]=\"isFocused() && !showError() && !disabled()\"\n [class.text-error]=\"showError() && !disabled()\"\n [class.text-role-disabled]=\"disabled()\">\n {{ label() }}\n @if (showRequiredIndicator()) {\n <span class=\"text-error\" aria-hidden=\"true\">*</span>\n }\n </label>\n }\n </div>\n\n <span class=\"relative mr-3 h-7 w-7 shrink-0\">\n <span\n aria-hidden=\"true\"\n class=\"block h-7 w-7 rounded-full border border-default\"\n [style.background-color]=\"resolvedColor()\"></span>\n\n <input\n #colorInputRef\n type=\"color\"\n class=\"absolute inset-0 h-full w-full cursor-pointer opacity-0\"\n [class.cursor-default]=\"readonly()\"\n [class.cursor-not-allowed]=\"disabled()\"\n [class.pointer-events-none]=\"!isInteractive()\"\n [value]=\"resolvedColor()\"\n [disabled]=\"disabled()\"\n [attr.aria-readonly]=\"readonly() || null\"\n [attr.aria-required]=\"showRequiredIndicator() || null\"\n [attr.aria-invalid]=\"showError() || null\"\n (input)=\"onInput($event)\"\n (focus)=\"onFocus()\"\n (blur)=\"onBlur()\" />\n </span>\n </div>\n\n</lib-base-signal-input>\n", dependencies: [{ kind: "component", type: BaseSignalInput, selector: "lib-base-signal-input", inputs: ["label", "showExternalLabel", "showRequired", "showError", "errorMessage", "disabled", "hint", "inputId"] }] });
14783
+ }
14784
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: SignalColorField, decorators: [{
14785
+ type: Component,
14786
+ args: [{ selector: 'lib-signal-color-field', imports: [BaseSignalInput], template: "<lib-base-signal-input\n [label]=\"label()\"\n [showExternalLabel]=\"appearance() === 'outline' || appearance() === 'fill'\"\n [showRequired]=\"showRequiredIndicator()\"\n [showError]=\"showError()\"\n [errorMessage]=\"errorMessage()\"\n [disabled]=\"disabled()\"\n [hint]=\"hint()\"\n [inputId]=\"colorInputId()\">\n\n <div\n input\n class=\"relative flex items-center w-full rounded-xl transition-colors duration-200 ease-in-out\"\n [class.overflow-hidden]=\"appearance() !== 'floatingOutline'\"\n [class.overflow-visible]=\"appearance() === 'floatingOutline'\"\n [class.opacity-70]=\"disabled()\"\n [class]=\"appearanceWrapperClasses() + ' ' + wrapperHeightClasses()\">\n\n <div class=\"relative flex h-full min-w-0 flex-1 items-center\">\n @if (usesPeerFloatingLabel()) {\n <input\n type=\"text\"\n tabindex=\"-1\"\n aria-hidden=\"true\"\n readonly\n class=\"peer pointer-events-none absolute h-full w-full opacity-0 border-0 bg-transparent placeholder-transparent\"\n placeholder=\" \"\n [id]=\"colorInputId()\"\n [value]=\"displayHex()\" />\n }\n\n <button\n type=\"button\"\n class=\"relative h-full w-full text-left font-mono transition outline-none bg-transparent border-0 rounded-none truncate\"\n [class]=\"inputSizeClasses() + ' ' + horizontalPaddingClasses()\"\n [class.text-role-disabled]=\"disabled()\"\n [class.text-role-body]=\"!disabled()\"\n [class.cursor-pointer]=\"isInteractive()\"\n [class.cursor-default]=\"readonly() && !disabled()\"\n [class.cursor-not-allowed]=\"disabled()\"\n [id]=\"usesPeerFloatingLabel() ? null : colorInputId()\"\n [disabled]=\"disabled()\"\n [attr.aria-readonly]=\"readonly() || null\"\n [attr.aria-required]=\"showRequiredIndicator() || null\"\n [attr.aria-invalid]=\"showError() || null\"\n (click)=\"openColorPicker()\"\n (focus)=\"onFocus()\"\n (blur)=\"onBlur()\">\n {{ displayHex() }}\n </button>\n\n @if (appearance() === 'floating' && label()) {\n <label\n [attr.for]=\"colorInputId()\"\n [class]=\"floatingLabelClasses() + ' ' + inFieldLabelLeftClasses()\"\n [class.text-primary]=\"isFocused() && !showError() && !disabled()\"\n [class.text-error]=\"showError() && !disabled()\"\n [class.text-role-disabled]=\"disabled()\">\n {{ label() }}\n @if (showRequiredIndicator()) {\n <span class=\"text-error\" aria-hidden=\"true\">*</span>\n }\n </label>\n }\n\n @if (appearance() === 'floatingOutline' && label()) {\n <label\n [attr.for]=\"colorInputId()\"\n [class]=\"floatingOutlineLabelClasses()\"\n [class.text-primary]=\"isFocused() && !showError() && !disabled()\"\n [class.text-error]=\"showError() && !disabled()\"\n [class.text-role-disabled]=\"disabled()\">\n {{ label() }}\n @if (showRequiredIndicator()) {\n <span class=\"text-error\" aria-hidden=\"true\">*</span>\n }\n </label>\n }\n\n @if (appearance() === 'ifta' && label()) {\n <label\n [attr.for]=\"colorInputId()\"\n [class]=\"iftaLabelClasses() + ' ' + inFieldLabelLeftClasses()\"\n [class.text-primary]=\"isFocused() && !showError() && !disabled()\"\n [class.text-error]=\"showError() && !disabled()\"\n [class.text-role-disabled]=\"disabled()\">\n {{ label() }}\n @if (showRequiredIndicator()) {\n <span class=\"text-error\" aria-hidden=\"true\">*</span>\n }\n </label>\n }\n </div>\n\n <span class=\"relative mr-3 h-7 w-7 shrink-0\">\n <span\n aria-hidden=\"true\"\n class=\"block h-7 w-7 rounded-full border border-default\"\n [style.background-color]=\"resolvedColor()\"></span>\n\n <input\n #colorInputRef\n type=\"color\"\n class=\"absolute inset-0 h-full w-full cursor-pointer opacity-0\"\n [class.cursor-default]=\"readonly()\"\n [class.cursor-not-allowed]=\"disabled()\"\n [class.pointer-events-none]=\"!isInteractive()\"\n [value]=\"resolvedColor()\"\n [disabled]=\"disabled()\"\n [attr.aria-readonly]=\"readonly() || null\"\n [attr.aria-required]=\"showRequiredIndicator() || null\"\n [attr.aria-invalid]=\"showError() || null\"\n (input)=\"onInput($event)\"\n (focus)=\"onFocus()\"\n (blur)=\"onBlur()\" />\n </span>\n </div>\n\n</lib-base-signal-input>\n" }]
14787
+ }], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], hint: [{ type: i0.Input, args: [{ isSignal: true, alias: "hint", required: false }] }], id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }], valueChange: [{ type: i0.Output, args: ["valueChange"] }], colorInputRef: [{
14788
+ type: ViewChild,
14789
+ args: ['colorInputRef']
14790
+ }] } });
14791
+
14700
14792
  function signalValidationError(kind, message) {
14701
14793
  return { kind, message };
14702
14794
  }
@@ -15398,5 +15490,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImpor
15398
15490
  * Generated bundle index. Do not edit.
15399
15491
  */
15400
15492
 
15401
- export { AlertDialogComponent, AppErrorComponent, AppSvgIconComponent, BaseApiService, BaseControlValueAccessor, BaseControlValueAccessorV2, BaseControlValueAccessorV3, BaseInputComponent, BaseOverlayComponent, BaseSignalInput, BaseTableComponent, BreadcrumbComponent, ButtonComponent, CheckboxComponent, ClickOutsideDirective, CloseButtonComponent, ColorConverterService, ColorFormats, ColorPickerComponent, ColorPickerDirective, ContextMenuButtonComponent, ContextMenuIconComponent, DEFAULT_NGL_BUTTON_CONFIG, DEFAULT_NGL_INPUT_CONFIG, DEFAULT_NGL_LIST_RESPONSE, DEFAULT_PHONE_COUNTRIES, DataTableComponent, DateInputComponent, DatePickerComponent, DatePickerOverlayComponent, DateRangePickerComponent, DateUtils, DropdownComponent, DynamicRendererComponent, EnvBannerComponent, FORM_ERRORS, FileUploaderComponent, FormValidationUtils, HumanizeFormMessagesPipe, InfiniteScrollDirective, InfiniteScrollModule, InputDateFormat, InvalidControlScrollContainerDirective, InvalidControlScrollDirective, InvalidTokenError, ListviewComponent, LoaderComponent, LoaderService, MultiSelectDropdownAppearance, MultiSelectDropdownComponent, MultiSelectionFieldComponent, NGL_CONFIG, NetworkImageComponent, NglService, NoDataComponent, NoDataTableComponent, NumberInputComponent, OpenFloatingMenuDirective, OverlayContextMenuComponent, OverlayService, OverlayWizardUtils, PaginationComponent, PaginationState, PhoneNumberInputComponent, RadioButtonComponent, RequestState, ResizableColumnDirective, ResponsiveHelperComponent, SIGNAL_FORM_ERRORS, SharedConstants, ShimmerComponent, SignalButton, SignalCheckbox, SignalDataTableComponent, SignalDateField, SignalDatePicker, SignalDateRangeField, SignalDateRangePicker, SignalDropdown, SignalError, SignalFormDirective, SignalFormValidators, SignalMultiSelectDropdown, SignalNumberField, SignalOtpField, SignalPhoneNumberField, SignalRadio, SignalRadioGroup, SignalRangeSlider, SignalRating, SignalSlider, SignalSwitch, SignalTextField, SignalTextarea, SignalTimeField, SignalTimePicker, SingleItemPickerInputComponent, SingleSelectionFieldComponent, SortableTableDirective, SpinnerComponent, State, StatusBadgeComponent, SvgUrlIconComponent, SwitchComponent, TableCustomComponent, TableResizableColumnsDirective, TemplateResolverArrayUtil, TemplateResolverFormat, TextAreaInputComponent, TextInputComponent, ThemeService, TimePickerComponent, ToastComponent, ToastService, ToasterComponent, TooltipDirective, UnsavedAwareDirective, arrayToCSV, arrayToSeparator, arrayToSpaceSeparator, deepEqual, defaultErrors, defaultSignalFormErrors, getDynamicTypeStructure, getSignalButtonClasses, getSignalButtonIconClasses, getSignalButtonSpinnerBorderClass, getSignalFieldErrorMessage, getSignalValidationErrorMessage, isDynamicType, isValid, jsonEqual, jwtDecode, mmddyyyyDateValidatorAsync, onlyFutureDateValidator, onlyPastDateValidator, openLink, phoneNumbers, phoneNumbersAll, printInvalidFields, provideNglConfig, resolveTemplateWithObject, toSentenceCase, validateSignalForm };
15493
+ export { AlertDialogComponent, AppErrorComponent, AppSvgIconComponent, BaseApiService, BaseControlValueAccessor, BaseControlValueAccessorV2, BaseControlValueAccessorV3, BaseInputComponent, BaseOverlayComponent, BaseSignalInput, BaseTableComponent, BreadcrumbComponent, ButtonComponent, CheckboxComponent, ClickOutsideDirective, CloseButtonComponent, ColorConverterService, ColorFormats, ColorPickerComponent, ColorPickerDirective, ContextMenuButtonComponent, ContextMenuIconComponent, DEFAULT_NGL_BUTTON_CONFIG, DEFAULT_NGL_INPUT_CONFIG, DEFAULT_NGL_LIST_RESPONSE, DEFAULT_PHONE_COUNTRIES, DataTableComponent, DateInputComponent, DatePickerComponent, DatePickerOverlayComponent, DateRangePickerComponent, DateUtils, DropdownComponent, DynamicRendererComponent, EnvBannerComponent, FORM_ERRORS, FileUploaderComponent, FormValidationUtils, HumanizeFormMessagesPipe, InfiniteScrollDirective, InfiniteScrollModule, InputDateFormat, InvalidControlScrollContainerDirective, InvalidControlScrollDirective, InvalidTokenError, ListviewComponent, LoaderComponent, LoaderService, MultiSelectDropdownAppearance, MultiSelectDropdownComponent, MultiSelectionFieldComponent, NGL_CONFIG, NetworkImageComponent, NglService, NoDataComponent, NoDataTableComponent, NumberInputComponent, OpenFloatingMenuDirective, OverlayContextMenuComponent, OverlayService, OverlayWizardUtils, PaginationComponent, PaginationState, PhoneNumberInputComponent, RadioButtonComponent, RequestState, ResizableColumnDirective, ResponsiveHelperComponent, SIGNAL_FORM_ERRORS, SharedConstants, ShimmerComponent, SignalButton, SignalCheckbox, SignalColorField, SignalDataTableComponent, SignalDateField, SignalDatePicker, SignalDateRangeField, SignalDateRangePicker, SignalDropdown, SignalError, SignalFormDirective, SignalFormValidators, SignalMultiSelectDropdown, SignalNumberField, SignalOtpField, SignalPhoneNumberField, SignalRadio, SignalRadioGroup, SignalRangeSlider, SignalRating, SignalSlider, SignalSwitch, SignalTextField, SignalTextarea, SignalTimeField, SignalTimePicker, SingleItemPickerInputComponent, SingleSelectionFieldComponent, SortableTableDirective, SpinnerComponent, State, StatusBadgeComponent, SvgUrlIconComponent, SwitchComponent, TableCustomComponent, TableResizableColumnsDirective, TemplateResolverArrayUtil, TemplateResolverFormat, TextAreaInputComponent, TextInputComponent, ThemeService, TimePickerComponent, ToastComponent, ToastService, ToasterComponent, TooltipDirective, UnsavedAwareDirective, arrayToCSV, arrayToSeparator, arrayToSpaceSeparator, deepEqual, defaultErrors, defaultSignalFormErrors, getDynamicTypeStructure, getSignalButtonClasses, getSignalButtonIconClasses, getSignalButtonSpinnerBorderClass, getSignalFieldErrorMessage, getSignalValidationErrorMessage, isDynamicType, isValid, jsonEqual, jwtDecode, mmddyyyyDateValidatorAsync, onlyFutureDateValidator, onlyPastDateValidator, openLink, phoneNumbers, phoneNumbersAll, printInvalidFields, provideNglConfig, resolveTemplateWithObject, toSentenceCase, validateSignalForm };
15402
15494
  //# sourceMappingURL=vallift-ngl.mjs.map