@skyux/datetime 10.19.0 → 10.20.0

package/lib/modules/date-range-picker/date-range-picker-end-date-resource-key.pipe.d.ts

@@ -4,5 +4,5 @@ import * as i0 from "@angular/core";
 export declare class SkyDateRangePickerEndDateResourceKeyPipe implements PipeTransform {
     transform(calculatorType: SkyDateRangeCalculatorType | undefined): string;
     static ɵfac: i0.ɵɵFactoryDeclaration<SkyDateRangePickerEndDateResourceKeyPipe, never>;
-    static ɵpipe: i0.ɵɵPipeDeclaration<SkyDateRangePickerEndDateResourceKeyPipe, "skyDateRangePickerEndDateResourceKey", false>;
+    static ɵpipe: i0.ɵɵPipeDeclaration<SkyDateRangePickerEndDateResourceKeyPipe, "skyDateRangePickerEndDateResourceKey", true>;
 }

package/lib/modules/date-range-picker/date-range-picker-start-date-resource-key.pipe.d.ts

@@ -4,5 +4,5 @@ import * as i0 from "@angular/core";
 export declare class SkyDateRangePickerStartDateResourceKeyPipe implements PipeTransform {
     transform(calculatorType: SkyDateRangeCalculatorType | undefined): string;
     static ɵfac: i0.ɵɵFactoryDeclaration<SkyDateRangePickerStartDateResourceKeyPipe, never>;
-    static ɵpipe: i0.ɵɵPipeDeclaration<SkyDateRangePickerStartDateResourceKeyPipe, "skyDateRangePickerStartDateResourceKey", false>;
+    static ɵpipe: i0.ɵɵPipeDeclaration<SkyDateRangePickerStartDateResourceKeyPipe, "skyDateRangePickerStartDateResourceKey", true>;
 }

package/lib/modules/date-range-picker/date-range-picker.component.d.ts

@@ -1,30 +1,17 @@
-import { ChangeDetectorRef, NgZone, OnChanges, OnDestroy, OnInit, SimpleChanges, TemplateRef } from '@angular/core';
-import { AbstractControl, ControlValueAccessor, UntypedFormBuilder, UntypedFormGroup, ValidationErrors, Validator } from '@angular/forms';
-import { SkyAppLocaleProvider } from '@skyux/i18n';
-import { SkyThemeService } from '@skyux/theme';
-import { SkyDateRangeService } from './date-range.service';
+import { AfterViewInit, DoCheck, OnDestroy, OnInit, TemplateRef } from '@angular/core';
+import { AbstractControl, ControlValueAccessor, FormGroup, ValidationErrors, Validator } from '@angular/forms';
 import { SkyDateRangeCalculation } from './types/date-range-calculation';
 import { SkyDateRangeCalculator } from './types/date-range-calculator';
 import { SkyDateRangeCalculatorId } from './types/date-range-calculator-id';
 import * as i0 from "@angular/core";
-/**
- * Acts as a form control with a form model of type `SkyDateRangeCalculation`.
- * @example
- * ```
- * <sky-date-range-picker
- *   formControlName="myPicker"
- * >
- * </sky-date-range-picker>
- * ```
- */
-export declare class SkyDateRangePickerComponent implements OnInit, OnChanges, OnDestroy, ControlValueAccessor, Validator {
+export declare class SkyDateRangePickerComponent implements AfterViewInit, ControlValueAccessor, DoCheck, OnDestroy, OnInit, Validator {
     #private;
     /**
      * IDs for the date range options to include in the picker's dropdown.
      * The options specify calculator objects that return two `Date` objects to represent date ranges.
      * By default, this property includes all `SkyDateRangeCalculatorId` values.
      */
-    set calculatorIds(value: SkyDateRangeCalculatorId[] | undefined);
+    set calculatorIds(calculatorIds: SkyDateRangeCalculatorId[] | undefined);
     get calculatorIds(): SkyDateRangeCalculatorId[];
     /**
      * The date format for
@@ -33,36 +20,21 @@ export declare class SkyDateRangePickerComponent implements OnInit, OnChanges, O
      * up to two `sky-datepicker` components.
      * @default "MM/DD/YYYY"
      */
-    set dateFormat(value: string | undefined);
-    get dateFormat(): string | undefined;
+    dateFormat: string | undefined;
     /**
-     * Whether to disable the date range picker on template-driven forms. Don't use this input on reactive forms because they may overwrite the input or leave the control out of sync.
-     * To set the disabled state on reactive forms, use the `FormControl` instead.
+     * Whether to disable the date range picker on template-driven forms. Don't use
+     * this input on reactive forms because they may overwrite the input or leave
+     * the control out of sync. To set the disabled state on reactive forms,
+     * use the `FormControl` instead.
      * @default false
      */
-    set disabled(value: boolean | undefined);
-    get disabled(): boolean | undefined;
-    /**
-     * The label for the date range picker.
-     * @required
-     */
-    label: string | undefined;
-    /**
-     * [Persistent inline help text](https://developer.blackbaud.com/skyux/design/guidelines/user-assistance#inline-help) that provides
-     * additional context to the user.
-     * @preview
-     */
-    hintText: string | undefined;
-    /**
-     * Whether to require users to specify a start date.
-     * @default false
-     */
-    startDateRequired: boolean | undefined;
+    set disabled(value: boolean);
     /**
      * Whether to require users to specify a end date.
-     * @default false
+     * @deprecated Use the `required` directive or Angular's `Validators.required`
+     * on the form control to mark the date range picker as required.
      */
-    endDateRequired: boolean | undefined;
+    endDateRequired: boolean;
     /**
      * The content of the help popover. When specified along with `labelText`, a [help inline](https://developer.blackbaud.com/skyux/components/help-inline)
      * button is added to date range picker. The help inline button displays a [popover](https://developer.blackbaud.com/skyux/components/popover)
@@ -76,33 +48,64 @@ export declare class SkyDateRangePickerComponent implements OnInit, OnChanges, O
      * @preview
      */
     helpPopoverTitle: string | undefined;
+    /**
+     * [Persistent inline help text](https://developer.blackbaud.com/skyux/design/guidelines/user-assistance#inline-help) that provides
+     * additional context to the user.
+     * @preview
+     */
+    hintText: string | undefined;
+    /**
+     * The label for the date range picker.
+     * @required
+     */
+    label: string | undefined;
+    /**
+     * Whether the date range picker requires a value.
+     */
+    required: boolean;
     /**
      * Whether the date range picker is stacked on another form component. When specified, the appropriate
      * vertical spacing is automatically added to the date range picker.
      * @preview
      */
     stacked: boolean;
-    display: string | undefined;
-    selectedCalculator: SkyDateRangeCalculator | undefined;
-    readonly dateRangePickerId: string;
-    calculators: SkyDateRangeCalculator[];
-    dateFormatOrDefault: string | undefined;
-    formGroup: UntypedFormGroup | undefined;
-    isReady: boolean;
-    showEndDatePicker: boolean;
-    showStartDatePicker: boolean;
-    protected hostHintText: string | undefined;
-    constructor(changeDetector: ChangeDetectorRef, dateRangeService: SkyDateRangeService, formBuilder: UntypedFormBuilder, localeProvider: SkyAppLocaleProvider, ngZone: NgZone, themeSvc?: SkyThemeService);
+    /**
+     * Whether to require users to specify a start date.
+     * @deprecated Use the `required` directive or Angular's `Validators.required`
+     * on the form control to mark the date range picker as required.
+     */
+    startDateRequired: boolean;
+    protected display: string | undefined;
+    protected calculators: SkyDateRangeCalculator[];
+    protected formGroup: FormGroup;
+    protected hasErrors: boolean;
+    protected selectedCalculator: SkyDateRangeCalculator;
+    protected showEndDatePicker: boolean;
+    protected showStartDatePicker: boolean;
+    constructor();
     ngOnInit(): void;
-    ngOnChanges(changes: SimpleChanges): void;
+    ngAfterViewInit(): void;
+    /**
+     * Check for touched status in ngDoCheck since Angular does not (currently)
+     * have an API to respond to touched status changes from the host control.
+     * @see https://github.com/angular/angular/issues/17736#issuecomment-310812368
+     * TODO: Angular 18 introduces a new API to respond to these statuses.
+     * @see https://github.com/angular/angular/issues/10887#issuecomment-2035267400
+     */
+    ngDoCheck(): void;
     ngOnDestroy(): void;
-    onFieldBlur(): void;
-    writeValue(value: SkyDateRangeCalculation): void;
+    registerOnChange(fn: (_: unknown) => void): void;
+    registerOnTouched(fn: () => void): void;
+    setDisabledState(isDisabled: boolean): void;
     validate(control: AbstractControl): ValidationErrors | null;
-    registerOnChange(fn: (value: SkyDateRangeCalculation | undefined) => SkyDateRangeCalculation): void;
-    registerOnTouched(fn: () => SkyDateRangeCalculation): void;
-    setDisabledState(disabled: boolean): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<SkyDateRangePickerComponent, [null, null, null, null, null, { optional: true; }]>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<SkyDateRangePickerComponent, "sky-date-range-picker", never, { "calculatorIds": { "alias": "calculatorIds"; "required": false; }; "dateFormat": { "alias": "dateFormat"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "label": { "alias": "label"; "required": false; }; "hintText": { "alias": "hintText"; "required": false; }; "startDateRequired": { "alias": "startDateRequired"; "required": false; }; "endDateRequired": { "alias": "endDateRequired"; "required": false; }; "helpPopoverContent": { "alias": "helpPopoverContent"; "required": false; }; "helpPopoverTitle": { "alias": "helpPopoverTitle"; "required": false; }; "stacked": { "alias": "stacked"; "required": false; }; }, {}, never, never, false, never>;
+    writeValue(value: Partial<SkyDateRangeCalculation> | undefined): void;
+    protected isRequired(): boolean;
+    protected onBlur(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SkyDateRangePickerComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SkyDateRangePickerComponent, "sky-date-range-picker", never, { "calculatorIds": { "alias": "calculatorIds"; "required": false; }; "dateFormat": { "alias": "dateFormat"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "endDateRequired": { "alias": "endDateRequired"; "required": false; }; "helpPopoverContent": { "alias": "helpPopoverContent"; "required": false; }; "helpPopoverTitle": { "alias": "helpPopoverTitle"; "required": false; }; "hintText": { "alias": "hintText"; "required": false; }; "label": { "alias": "label"; "required": false; }; "required": { "alias": "required"; "required": false; }; "stacked": { "alias": "stacked"; "required": false; }; "startDateRequired": { "alias": "startDateRequired"; "required": false; }; }, {}, never, never, true, never>;
+    static ngAcceptInputType_disabled: unknown;
+    static ngAcceptInputType_endDateRequired: unknown;
+    static ngAcceptInputType_required: unknown;
     static ngAcceptInputType_stacked: unknown;
+    static ngAcceptInputType_startDateRequired: unknown;
 }

package/lib/modules/date-range-picker/date-range-picker.module.d.ts

@@ -1,15 +1,7 @@
 import * as i0 from "@angular/core";
 import * as i1 from "./date-range-picker.component";
-import * as i2 from "./date-range-picker-end-date-resource-key.pipe";
-import * as i3 from "./date-range-picker-start-date-resource-key.pipe";
-import * as i4 from "@angular/common";
-import * as i5 from "@angular/forms";
-import * as i6 from "../datepicker/datepicker.module";
-import * as i7 from "../shared/sky-datetime-resources.module";
-import * as i8 from "@skyux/core";
-import * as i9 from "@skyux/forms";
 export declare class SkyDateRangePickerModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<SkyDateRangePickerModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<SkyDateRangePickerModule, [typeof i1.SkyDateRangePickerComponent, typeof i2.SkyDateRangePickerEndDateResourceKeyPipe, typeof i3.SkyDateRangePickerStartDateResourceKeyPipe], [typeof i4.CommonModule, typeof i5.FormsModule, typeof i5.ReactiveFormsModule, typeof i6.SkyDatepickerModule, typeof i7.SkyDatetimeResourcesModule, typeof i8.SkyIdModule, typeof i9.SkyInputBoxModule], [typeof i1.SkyDateRangePickerComponent]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<SkyDateRangePickerModule, never, [typeof i1.SkyDateRangePickerComponent], [typeof i1.SkyDateRangePickerComponent]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<SkyDateRangePickerModule>;
 }

package/lib/modules/date-range-picker/date-range.service.d.ts

@@ -1,3 +1,4 @@
+import { OnDestroy } from '@angular/core';
 import { SkyLibResourcesService } from '@skyux/i18n';
 import { SkyDateRangeCalculator } from './types/date-range-calculator';
 import { SkyDateRangeCalculatorConfig } from './types/date-range-calculator-config';
@@ -6,23 +7,32 @@ import * as i0 from "@angular/core";
 /**
  * Creates and manages `SkyDateRangeCalculator` instances.
  */
-export declare class SkyDateRangeService {
+export declare class SkyDateRangeService implements OnDestroy {
     #private;
+    get calculators(): SkyDateRangeCalculator[];
     private static lastId;
     constructor(resourcesService: SkyLibResourcesService);
+    ngOnDestroy(): void;
     /**
      * Creates a custom date range calculator.
      * @param config The calculator config.
      */
     createCalculator(config: SkyDateRangeCalculatorConfig): SkyDateRangeCalculator;
+    /**
+     * Returns calculators from an array of calculator IDs.
+     * @param calculatorIds The array of calculator IDs.
+     */
+    filterCalculators(calculatorIds: SkyDateRangeCalculatorId[]): SkyDateRangeCalculator[];
     /**
      * Returns calculators from an array of calculator IDs.
      * @param ids The array of calculator IDs.
+     * @deprecated Call `filterCalculators()` instead.
      */
     getCalculators(ids: SkyDateRangeCalculatorId[]): Promise<SkyDateRangeCalculator[]>;
     /**
      * Returns a calculator from a calculator ID.
      * @param id The calculator ID.
+     * @deprecated Call `filterCalculators()` instead.
      */
     getCalculatorById(id: SkyDateRangeCalculatorId): Promise<SkyDateRangeCalculator>;
     static ɵfac: i0.ɵɵFactoryDeclaration<SkyDateRangeService, never>;

package/lib/modules/date-range-picker/types/date-range-calculator.d.ts

@@ -16,7 +16,11 @@ export declare class SkyDateRangeCalculator {
     /**
      * The text to display in the calculator select menu.
      */
-    readonly shortDescription: string;
+    shortDescription: string;
+    /**
+     * @internal
+     */
+    readonly _shortDescriptionResourceKey: string | undefined;
     /**
      * The type of calculations available for the date range.
      */
@@ -25,7 +29,9 @@ export declare class SkyDateRangeCalculator {
     /**
      * The calculator ID that specifies calculator objects that represent date ranges.
      */
-    calculatorId: SkyDateRangeCalculatorId, config: SkyDateRangeCalculatorConfig);
+    calculatorId: SkyDateRangeCalculatorId, config: SkyDateRangeCalculatorConfig & {
+        _shortDescriptionResourceKey?: string;
+    });
     /**
      * Gets the current value of the calculator.
      * @param startDateInput The start date.

package/lib/modules/date-range-picker/types/date-range-default-calculator-configs.d.ts

@@ -1,2 +1,4 @@
+import { SkyDateRangeCalculatorId } from './date-range-calculator-id';
 import { SkyDateRangeDefaultCalculatorConfig } from './date-range-default-calculator-config';
+export declare const SKY_DEFAULT_CALCULATOR_IDS: SkyDateRangeCalculatorId[];
 export declare const SKY_DEFAULT_CALCULATOR_CONFIGS: SkyDateRangeDefaultCalculatorConfig[];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@skyux/datetime",
-  "version": "10.19.0",
+  "version": "10.20.0",
   "author": "Blackbaud, Inc.",
   "keywords": [
     "blackbaud",
@@ -41,13 +41,13 @@
     "@angular/core": "^17.3.4",
     "@angular/forms": "^17.3.4",
     "@angular/platform-browser": "^17.3.4",
-    "@skyux-sdk/testing": "10.19.0",
-    "@skyux/core": "10.19.0",
-    "@skyux/forms": "10.19.0",
-    "@skyux/i18n": "10.19.0",
-    "@skyux/indicators": "10.19.0",
-    "@skyux/popovers": "10.19.0",
-    "@skyux/theme": "10.19.0",
+    "@skyux-sdk/testing": "10.20.0",
+    "@skyux/core": "10.20.0",
+    "@skyux/forms": "10.20.0",
+    "@skyux/i18n": "10.20.0",
+    "@skyux/indicators": "10.20.0",
+    "@skyux/popovers": "10.20.0",
+    "@skyux/theme": "10.20.0",
     "moment": "^2.30.1"
   },
   "dependencies": {