@beeq/angular 1.12.4 → 1.13.0

package/fesm2022/beeq-angular.mjs

@@ -888,86 +888,96 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImpor
             }] } });
 let BqDatePicker = class BqDatePicker {
     /**
-   * If `true`, the Date picker input will be focused on component render
+   * If `true`, the Date picker input will be focused on component render. @default false
    */
     set autofocus(_) { }
     ;
     /**
-   * The clear button aria label @default 'Clear value'
+   * The clear button aria label. @default 'Clear value'
    */
     set clearButtonLabel(_) { }
     ;
     /**
-   * If `true`, the clear button won't be displayed @default false
+   * The aria-label for the calendar trigger button. @default 'Open calendar'
+   */
+    set calendarButtonLabel(_) { }
+    ;
+    /**
+   * If `true`, the clear button won't be displayed. @default false
    */
     set disableClear(_) { }
     ;
     /**
-   * Indicates whether the Date picker input is disabled or not.
-If `true`, the Date picker is disabled and cannot be interacted with. @default false
+   * Indicates whether the Date picker input is disabled or not. @default false
    */
     set disabled(_) { }
     ;
     /**
-   * Represents the distance (gutter or margin) between the Date picker panel and the input element. @default 8
+   * Distance (gutter) between the Date picker panel and the input element. @default 8
    */
     set distance(_) { }
     ;
     /**
-   * The first day of the week, where Sunday is 0, Monday is 1, etc @default 1
+   * The first day of the week, where Sunday is 0, Monday is 1, etc. @default 1
    */
     set firstDayOfWeek(_) { }
     ;
     /**
-   * The options to use when formatting the displayed value.
-Details: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat#using_options @default {
-    day: 'numeric',
-    month: 'short',
-    year: 'numeric',
-  }
+   * Options used when formatting the displayed value.
+
+When omitted, sensible defaults are picked based on `precision`:
+- `day`   → `{ day: 'numeric', month: 'short', year: 'numeric' }`
+- `month` → `{ month: 'long', year: 'numeric' }`
+- `year`  → `{ year: 'numeric' }`
    */
     set formatOptions(_) { }
     ;
     /**
-   * The ID of the form that the Date picker input belongs to.
+   * The ID of the form the input belongs to.
    */
     set form(_) { }
     ;
     /**
-   * The native form validation message (mandatory if `required` is set)
+   * Native form validation message (mandatory if `required` is set).
    */
     set formValidationMessage(_) { }
     ;
     /**
-   * A function that takes a date and returns true if the date should not be selectable
+   * The view opened first when the panel becomes visible. @default 'days'
+   */
+    set initialView(_) { }
+    ;
+    /**
+   * Predicate that marks specific dates as unselectable.
    */
     set isDateDisallowed(_) { }
     ;
     /**
-   * The locale for formatting dates. If not set, will use the browser's locale.
-Details: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl#locales_argument @default 'en-GB'
+   * Locale used for formatting dates. @default 'en-GB'
    */
     set locale(_) { }
     ;
     /**
-   * The latest date that can be selected
+   * Latest date that can be selected (ISO).
    */
     set max(_) { }
     ;
     /**
-   * The earliest date that can be selected
+   * Earliest date that can be selected (ISO).
    */
     set min(_) { }
     ;
     /**
-   * Number of months to show when range is `true`
+   * Number of months to show side by side (range / multi). Capped at 2.
+Larger values are silently clamped to keep the popover from overflowing
+the viewport and to preserve keyboard navigation semantics. @default 1
    */
     set months(_) { }
     ;
     /**
-   * Specifies how the next/previous buttons should navigate the calendar.
-- single: The buttons will navigate by a single month at a time.
-- months: The buttons will navigate by the number of months displayed per view. @default 'single'
+   * How the next/previous buttons should navigate the calendar.
+- single: navigate one month at a time.
+- months: navigate by the number of months displayed. @default 'single'
    */
     set monthsPerView(_) { }
     ;
@@ -977,67 +987,80 @@ Details: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Globa
     set name(_) { }
     ;
     /**
-   * If `true`, the Date picker panel will be visible. @default false
+   * If `true`, the panel is visible. @default false
    */
     set open(_) { }
     ;
     /**
-   * When set, it will override the height of the Date picker panel. @default 'auto'
+   * Overrides the height of the Date picker panel. @default 'auto'
    */
     set panelHeight(_) { }
     ;
     /**
-   * The Date picker input placeholder text value
+   * Placeholder text shown when no value is selected.
    */
     set placeholder(_) { }
     ;
     /**
-   * Position of the Date picker panel @default 'bottom-end'
+   * Position of the Date picker panel. @default 'bottom-end'
    */
     set placement(_) { }
     ;
     /**
-   * Indicates whether or not the Date picker input is required to be filled out before submitting the form.
+   * Precision of the value produced by the picker.
+
+- `day`   → `YYYY-MM-DD` (default). Standard drill-down.
+- `month` → `YYYY-MM`. Selection commits on the months view; no days view.
+- `year`  → `YYYY`. Selection commits on the years view; no months/days view.
+
+When precision is coarser than day, `initialView` is forced to match and
+the header title cycles through the views available for that precision. @default 'day'
+   */
+    set precision(_) { }
+    ;
+    /**
+   * Whether a value must be selected before submitting the form. @default false
    */
     set required(_) { }
     ;
     /**
-   * Represents the skidding between the Date picker panel and the input element. @default 0
+   * Skidding between the panel and the input element. @default 0
    */
     set skidding(_) { }
     ;
     /**
-   * Whether to show days outside the month @default false
+   * Whether to render days outside the current month. @default false
    */
     set showOutsideDays(_) { }
     ;
     /**
-   * Defines the strategy to position the Date picker panel @default 'fixed'
+   * Positioning strategy for the panel. @default 'fixed'
    */
     set strategy(_) { }
     ;
     /**
-   * The date that is tentatively selected e.g. the start of a range selection
-   */
-    set tentative(_) { }
-    ;
-    /**
-   * It defines how the calendar will behave, allowing single date selection, range selection, or multiple date selection @default 'single'
+   * Selection type.
+- `single`: single date.
+- `multi`: multiple discrete dates.
+- `range`: contiguous range. @default 'single'
    */
     set type(_) { }
     ;
     /**
-   * The validation status of the Select input. @remarks This property is used to indicate the validation status of the select input. It can be set to one of the following values:
-- `'none'`: No validation status is set.
-- `'error'`: The input has a validation error.
-- `'warning'`: The input has a validation warning.
-- `'success'`: The input has passed validation.,@default 'none'
+   * Validation state applied to the input. @default 'none'
    */
     set validationStatus(_) { }
     ;
     /**
-   * The select input value represents the currently selected date or range and can be used to reset the field to a previous value.
-All dates are expected in ISO-8601 format (YYYY-MM-DD).
+   * Currently selected value, in the precision-aware wire format:
+- `precision="day"`   → tokens are `YYYY-MM-DD`
+- `precision="month"` → tokens are `YYYY-MM`
+- `precision="year"`  → tokens are `YYYY`
+
+How multiple tokens are combined depends on `type`:
+- `single` → a single token (e.g. `"2025-05-15"`, `"2025-05"`, `"2025"`)
+- `range`  → `"start/end"` — two tokens joined with `/`
+- `multi`  → space-separated tokens (e.g. `"2025-05-15 2025-05-20"`)
    */
     set value(_) { }
     ;
@@ -1047,15 +1070,16 @@ All dates are expected in ISO-8601 format (YYYY-MM-DD).
         this.bqChange = new EventEmitter();
         this.bqClear = new EventEmitter();
         this.bqFocus = new EventEmitter();
+        this.bqViewChange = new EventEmitter();
         c.detach();
         this.el = r.nativeElement;
     }
     /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: BqDatePicker, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.1", type: BqDatePicker, isStandalone: false, selector: "bq-date-picker", inputs: { autofocus: "autofocus", clearButtonLabel: "clearButtonLabel", disableClear: "disableClear", disabled: "disabled", distance: "distance", firstDayOfWeek: "firstDayOfWeek", form: "form", formValidationMessage: "formValidationMessage", formatOptions: "formatOptions", isDateDisallowed: "isDateDisallowed", locale: "locale", max: "max", min: "min", months: "months", monthsPerView: "monthsPerView", name: "name", open: "open", panelHeight: "panelHeight", placeholder: "placeholder", placement: "placement", required: "required", showOutsideDays: "showOutsideDays", skidding: "skidding", strategy: "strategy", tentative: "tentative", type: "type", validationStatus: "validationStatus", value: "value" }, outputs: { bqBlur: "bqBlur", bqChange: "bqChange", bqClear: "bqClear", bqFocus: "bqFocus" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.1", type: BqDatePicker, isStandalone: false, selector: "bq-date-picker", inputs: { autofocus: "autofocus", calendarButtonLabel: "calendarButtonLabel", clearButtonLabel: "clearButtonLabel", disableClear: "disableClear", disabled: "disabled", distance: "distance", firstDayOfWeek: "firstDayOfWeek", form: "form", formValidationMessage: "formValidationMessage", formatOptions: "formatOptions", initialView: "initialView", isDateDisallowed: "isDateDisallowed", locale: "locale", max: "max", min: "min", months: "months", monthsPerView: "monthsPerView", name: "name", open: "open", panelHeight: "panelHeight", placeholder: "placeholder", placement: "placement", precision: "precision", required: "required", showOutsideDays: "showOutsideDays", skidding: "skidding", strategy: "strategy", type: "type", validationStatus: "validationStatus", value: "value" }, outputs: { bqBlur: "bqBlur", bqChange: "bqChange", bqClear: "bqClear", bqFocus: "bqFocus", bqViewChange: "bqViewChange" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 };
 BqDatePicker = __decorate([
     ProxyCmp({
-        inputs: ['autofocus', 'clearButtonLabel', 'disableClear', 'disabled', 'distance', 'firstDayOfWeek', 'form', 'formValidationMessage', 'formatOptions', 'isDateDisallowed', 'locale', 'max', 'min', 'months', 'monthsPerView', 'name', 'open', 'panelHeight', 'placeholder', 'placement', 'required', 'showOutsideDays', 'skidding', 'strategy', 'tentative', 'type', 'validationStatus', 'value'],
+        inputs: ['autofocus', 'calendarButtonLabel', 'clearButtonLabel', 'disableClear', 'disabled', 'distance', 'firstDayOfWeek', 'form', 'formValidationMessage', 'formatOptions', 'initialView', 'isDateDisallowed', 'locale', 'max', 'min', 'months', 'monthsPerView', 'name', 'open', 'panelHeight', 'placeholder', 'placement', 'precision', 'required', 'showOutsideDays', 'skidding', 'strategy', 'type', 'validationStatus', 'value'],
         methods: ['clear']
     }),
     __metadata("design:paramtypes", [ChangeDetectorRef, ElementRef, NgZone])
@@ -1067,8 +1091,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImpor
                     changeDetection: ChangeDetectionStrategy.OnPush,
                     template: '<ng-content></ng-content>',
                     // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
-                    inputs: ['autofocus', 'clearButtonLabel', 'disableClear', 'disabled', 'distance', 'firstDayOfWeek', 'form', 'formValidationMessage', 'formatOptions', 'isDateDisallowed', 'locale', 'max', 'min', 'months', 'monthsPerView', { name: 'name', required: true }, 'open', 'panelHeight', 'placeholder', 'placement', 'required', 'showOutsideDays', 'skidding', 'strategy', 'tentative', 'type', 'validationStatus', 'value'],
-                    outputs: ['bqBlur', 'bqChange', 'bqClear', 'bqFocus'],
+                    inputs: ['autofocus', 'calendarButtonLabel', 'clearButtonLabel', 'disableClear', 'disabled', 'distance', 'firstDayOfWeek', 'form', 'formValidationMessage', 'formatOptions', 'initialView', 'isDateDisallowed', 'locale', 'max', 'min', 'months', 'monthsPerView', { name: 'name', required: true }, 'open', 'panelHeight', 'placeholder', 'placement', 'precision', 'required', 'showOutsideDays', 'skidding', 'strategy', 'type', 'validationStatus', 'value'],
+                    outputs: ['bqBlur', 'bqChange', 'bqClear', 'bqFocus', 'bqViewChange'],
                     standalone: false
                 }]
         }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }], propDecorators: { bqBlur: [{
@@ -1079,6 +1103,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImpor
                 type: Output
             }], bqFocus: [{
                 type: Output
+            }], bqViewChange: [{
+                type: Output
             }] } });
 let BqDialog = class BqDialog {
     /**