q2-tecton-elements 1.71.4 → 1.73.0

package/dist/q2-tecton-elements/tecton-tab-pane.entry.js

@@ -14,7 +14,8 @@ const o = class {
   }
   componentWillRender() {
     const e = this.hostElement.shadowRoot.querySelector(".loading-wrapper");
-    /* istanbul ignore next */    e && (e.style.minHeight = this.minHeight, e.hidden = !this.selected);
+    /* istanbul ignore next */    e && (e.querySelector(".q2-row") && (e.style.minHeight = this.minHeight), 
+    e.hidden = !this.selected);
   }
   componentDidRender() {
     const e = this.hostElement.shadowRoot.querySelector("form");
@@ -40,7 +41,7 @@ const o = class {
   // #region Render Methods
   render() {
     return i("div", {
-      key: "68c7250777ec0c700107df4997634d4aee8f8e91",
+      key: "b55643965ef49af2e41a683686db00b97e1c90b7",
       id: `tab-pane-${this.guid}-${this.index}`,
       class: "tab-pane" + (this.selected ? "" : " hidden"),
       role: "tabpanel",
@@ -48,12 +49,12 @@ const o = class {
       "aria-hidden": `${!this.selected}`,
       "aria-labelledby": `tab-${this.guid}-${this.index}`
     }, this.selected && void 0 !== this.provided && !this.provided && i("div", {
-      key: "7b8c74b691fc1c599766900125e09afe79e53859"
+      key: "f04f1594eba66d962d9adbab48bf3559f658c650"
     }, i("slot", {
-      key: "bbf7c58bef21ab334059655e958e976b9bdf327e",
+      key: "08804102412a6b57ac9b9db2002d1608f8b22c19",
       name: "loading-wrapper"
     }), i("iframe", {
-      key: "6a262f757dd78294fcf49242b337b02c13842ee8",
+      key: "a2524435de8072fb27ebdcc9762a1f20367df098",
       hidden: !0,
       name: this.moduleId,
       scrolling: "no",
@@ -76,11 +77,11 @@ const o = class {
       value: e.value,
       name: e.key
     })))) : ""), i("div", {
-      key: "d9be64623c99011b7f30256d0abfaeab23f72c00",
+      key: "59e9d5ddbabadb0e66615d998403d267c259f937",
       class: "slot-wrapper",
       hidden: this.selected && void 0 !== this.provided && !this.provided
     }, i("slot", {
-      key: "a1a3a9772b2875c7d4ab510e9014d99b6e036ad3"
+      key: "450c5724cf32ba05a2fc93b8adeba83b08e871e4"
     })));
   }
   get hostElement() {

package/dist/types/components/q2-action-sheet/q2-action-sheet.d.ts

@@ -1,12 +1,14 @@
 import { ComponentInterface, EventEmitter } from '../../stencil-public-runtime';
 import { Q2OptionListCustomEvent } from "../../components";
-import type { ActionSheetListCloseData, ActionSheetData, ActionSheetListData, ActionSheetMessageData, ActionSheetSelectedOption, ActionSheetListOption, ActionSheetListOptgroup } from 'q2-tecton-common/lib/types/action-sheet';
+import type { ActionSheetDatePickerData, ActionSheetListCloseData, ActionSheetData, ActionSheetListData, ActionSheetMessageData, ActionSheetSelectedOption, ActionSheetListOption, ActionSheetListOptgroup } from 'q2-tecton-common/lib/types/action-sheet';
+import type { DatePickerCloseDetail } from "../../utils/date-picker/date-picker-types";
 /**
  * @name Action Sheet
  * @category Display
  * @summary Use for presenting a modal sheet.
  */
 export declare class Q2ActionSheet implements ComponentInterface {
+    bodyOverflow: string;
     closeButtonElement: HTMLQ2BtnElement;
     contentElement: HTMLDivElement;
     dialogElement: HTMLDialogElement;
@@ -15,6 +17,12 @@ export declare class Q2ActionSheet implements ComponentInterface {
     maxHeight: number;
     minHeight: number;
     optionListElement: HTMLQ2OptionListElement;
+    rootOverflow: string;
+    selectedDate: {
+        rangeEnd?: string;
+        rangeStart?: string;
+        value?: string;
+    };
     selectedOptions: {
         values: ActionSheetSelectedOption[];
         value: string;
@@ -69,6 +77,13 @@ export declare class Q2ActionSheet implements ComponentInterface {
     hidePostHook(): void;
     onCancel: (event: Event) => void;
     onClick: (event: MouseEvent) => void;
+    onDatePickerCancel: (event: Event) => void;
+    onDatePickerChange: (event: CustomEvent<{
+        rangeEnd?: string;
+        rangeStart?: string;
+        value?: string;
+    }>) => void;
+    onDatePickerClose: (event: CustomEvent<DatePickerCloseDetail | void>) => void;
     onListChange: (event: Q2OptionListCustomEvent<{
         value: string;
         values: ActionSheetSelectedOption[];
@@ -78,9 +93,14 @@ export declare class Q2ActionSheet implements ComponentInterface {
         open: boolean;
         action: "close" | "select" | "open";
     }>) => void;
+    onViewportResize: () => void;
+    restorePageScroll(): void;
     showPreHook(): void;
     storeInitialValues(): void;
     updateDialogMinMaxHeight(): void;
+    renderDatePicker: ({ data }: {
+        data: ActionSheetDatePickerData;
+    }) => any;
     renderList: ({ data }: {
         data: ActionSheetListData;
     }) => any;

package/dist/types/components/q2-action-sheet/test/q2-action-sheet-test.vr.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/types/components/q2-btn/q2-btn.d.ts

@@ -53,16 +53,20 @@ export declare class Q2Btn implements ComponentInterface {
     form: string;
     /**
      * Hides the `label`, and assigns its value to the `aria-label` attribute on the `<button>` element.
+     * @warning
+     * Hides the label visually. `label` text is still required for screenreader compliance. Use for icon-only buttons.
      */
     hideLabel: boolean;
     /**
-     * Indicates the role of the component in the workflow, which will apply appropriate styling to the component.
+     * Indicates the intended action type, which applies the appropriate styling.
+     * Use unprefixed values by default. The legacy `workflow-` prefix remains supported for backward compatibility.
      */
-    intent: 'coin' | 'neutral-text' | 'neutral' | 'workflow-destroy' | 'workflow-escape' | 'workflow-primary' | 'workflow-secondary';
+    intent: 'coin' | 'destroy' | 'escape' | 'neutral-text' | 'neutral' | 'primary' | 'secondary' | 'workflow-destroy' | 'workflow-escape' | 'workflow-primary' | 'workflow-secondary';
     /**
      * Defines the text content of the button if it is not provided in the `<slot>` of the element.
      * Also used for the `aria-label` of the `<button>` element when only displaying an icon.
-     *
+     * @warning
+     * Required for screen reader compliance even when `hideLabel` is `true`.
      * @localizable
      */
     label: string;

package/dist/types/components/q2-calendar/q2-calendar.d.ts

@@ -106,7 +106,11 @@ export declare class Q2Calendar implements ComponentInterface {
      * @localizable
      */
     errors: string[];
-    /** Hide the input field's ` <label> ` element from view. */
+    /**
+     * Hide the input field's ` <label> ` element from view.
+     * @warning
+     * Hides the label visually. `label` text is still required for screenreader compliance.
+     */
     hideLabel: boolean;
     /**
      * Each item in the `hints` array will appear below the input field when the field is focused and `typeable` is true.
@@ -125,7 +129,11 @@ export declare class Q2Calendar implements ComponentInterface {
      * When explicit date definitions like `invalidDates` is used, other date validity methods like `daysOfWeekChecksum` are overriden.
      */
     invalidDates: string[];
-    /** The visible label for the `q2-calendar` input field. */
+    /**
+     * The visible label for the `q2-calendar` input field.
+     * @warning
+     * Required for screen reader compliance even when `hideLabel` is `true`.
+     */
     label: string;
     /** @deprecated */
     onsuccess: (e: CustomEvent) => void;

package/dist/types/components/q2-card-image/q2-card-image.d.ts

@@ -43,7 +43,7 @@ export declare class Q2CardImage implements ComponentInterface {
     /**
      * The status of the card. When set, renders a status banner at the top of the card for card sizes medium and up.
      */
-    cardStatus?: 'digital' | 'enabled' | 'disabled' | 'locked' | 'damaged' | 'lost' | 'stolen' | 'lost or stolen';
+    cardStatus?: 'digital' | 'enabled' | 'new' | 'disabled' | 'locked' | 'damaged' | 'lost' | 'stolen' | 'lost or stolen';
     /**
      * The card type label displayed alongside the expiration date. Not rendered at tiny size.
      */

package/dist/types/components/q2-carousel/q2-carousel.d.ts

@@ -13,6 +13,10 @@ export declare class Q2Carousel implements ComponentInterface {
     guid: number;
     mutationObserver: MutationObserver;
     paneResizeObserver?: ResizeObserver;
+    pendingPaginationFocus?: {
+        index: number;
+        source: Element;
+    };
     swiper?: Swiper;
     syncPaneHeightFrame?: number;
     universalCarouselOptions: SwiperOptions;
@@ -78,6 +82,7 @@ export declare class Q2Carousel implements ComponentInterface {
     disconnectedCallback(): void;
     componentWillLoad(): void;
     componentDidLoad(): void;
+    componentDidRender(): void;
     carouselPaneClicked(event: any): void;
     delegateFocus(event: FocusEvent): void;
     /**

package/dist/types/components/q2-chart-area/q2-chart-area.d.ts

@@ -11,8 +11,15 @@ export declare class Q2ChartArea implements ComponentInterface {
     chartContainer: HTMLDivElement;
     chartContainerStyles: CSSStyleDeclaration;
     hostElementStyles: CSSStyleDeclaration;
+    keyboard: {
+        onFocus: () => void;
+        onBlur: () => void;
+        onKeyDown: (event: KeyboardEvent) => void;
+        refresh: () => void;
+    };
     resizeEventListener: EventListener;
     hostElement: HTMLElement;
+    keyboardIndex: number | null;
     /** Controls alignment of the chart name when its visible. */
     alignChartName: 'left' | 'right' | 'center';
     /**
@@ -123,7 +130,7 @@ export declare class Q2ChartArea implements ComponentInterface {
     /** Controls the yAxis min value. */
     yMin: number;
     /**
-     * Emitted when a data point is clicked.
+     * Emitted when a data point is explored using the chart pointer or keyboard.
      * @deprecated Use 'tctChange' instead
      */
     change: EventEmitter<{
@@ -131,7 +138,7 @@ export declare class Q2ChartArea implements ComponentInterface {
         data: ChartData;
     }>;
     /**
-     * Emitted when a data point is clicked.
+     * Emitted when a data point is explored using the chart pointer or keyboard.
      */
     tctChange: EventEmitter<{
         index: number;
@@ -139,6 +146,7 @@ export declare class Q2ChartArea implements ComponentInterface {
     }>;
     disconnectedCallback(): void;
     componentDidLoad(): void;
+    delegateFocus(event: FocusEvent): void;
     /**
      * A method to fire change event on hover on a point.
      *
@@ -146,6 +154,7 @@ export declare class Q2ChartArea implements ComponentInterface {
      */
     hoverDataPoint(index: number): Promise<void>;
     propsUpdates(): void;
+    get keyboardDescription(): string;
     cacheComputedStyles(): void;
     getAreaFill(): any;
     getColor(color: string): any;

package/dist/types/components/q2-chart-bar/q2-chart-bar.d.ts

@@ -12,8 +12,15 @@ export declare class Q2ChartBar implements ComponentInterface {
     chartContainerStyles: CSSStyleDeclaration;
     chartFinishedListener: () => void;
     hostElementStyles: CSSStyleDeclaration;
+    keyboard: {
+        onFocus: () => void;
+        onBlur: () => void;
+        onKeyDown: (event: KeyboardEvent) => void;
+        refresh: () => void;
+    };
     resizeEventListener: EventListener;
     hostElement: HTMLElement;
+    keyboardIndex: number | null;
     /** Controls alignment of the chart name when its visible. */
     alignChartName: 'left' | 'right' | 'center';
     /**
@@ -98,7 +105,9 @@ export declare class Q2ChartBar implements ComponentInterface {
     sort: boolean;
     disconnectedCallback(): void;
     componentDidLoad(): void;
+    delegateFocus(event: FocusEvent): void;
     propsUpdates(): void;
+    get keyboardDescription(): string;
     cacheComputedStyles(): void;
     getColor(color: string): any;
     processData(data: ChartData[]): {

package/dist/types/components/q2-chart-donut/q2-chart-donut.d.ts

@@ -23,6 +23,7 @@ export declare class Q2ChartDonut implements ComponentInterface {
     resizeObserver: ResizeObserver;
     hostElement: HTMLElement;
     hoveredId: string;
+    keyboardAnnouncement: string;
     legendData: DonutChartData[];
     /**
      * The title of the chart. We recommend always including this for accessibility purposes.

package/dist/types/components/q2-checkbox/q2-checkbox.d.ts

@@ -44,10 +44,9 @@ export declare class Q2Checkbox implements ComponentInterface {
     /** Determines if the component should display in an errant state. */
     hasError: boolean;
     /**
-     * Hide's the field's `<label>` element from view.
-     *
+     * Hides the field's `<label>` element from view.
      * @warning
-     * Only use when a visible label is impractical.
+     * Hides the label visually. `label` text is still required for screenreader compliance.
      */
     hideLabel: boolean;
     /**
@@ -60,6 +59,8 @@ export declare class Q2Checkbox implements ComponentInterface {
     /**
      * The visible label text for the checkbox. Appears to the right of the box for 'default' and 'favorite' checkboxes, and to the left for 'toggle' checkboxes.
      * Yielded content will be adjacent to this text.
+     * @warning
+     * Required for screen reader compliance even when `hideLabel` is `true`.
      * @localizable
      */
     label: string;

package/dist/types/components/q2-checkbox-group/q2-checkbox-group.d.ts

@@ -14,13 +14,15 @@ export declare class Q2CheckboxGroup implements ComponentInterface {
     /** Determines if the component should display in an errant state. */
     hasError: boolean;
     /**
-     * Hide's the group's `<label>` element from view.
+     * Hides the group's `<label>` element from view.
      * @warning
-     * Only use when a visible label is impractical.
+     * Hides the label visually. `label` text is still required for screenreader compliance.
      */
     hideLabel: boolean;
     /**
      * The label that displays above all the checkboxes.
+     * @warning
+     * Required for screen reader compliance even when `hideLabel` is `true`.
      * @localizable
      */
     label: string;

package/dist/types/components/q2-date-calendar/q2-date-calendar.d.ts

@@ -0,0 +1,122 @@
+import { ComponentInterface, EventEmitter } from '../../stencil-public-runtime';
+import type { DatePickerChangeDetail, DatePickerDay, DatePickerDisplayFormat, DatePickerMode, DatePickerNavigationAction, DatePickerSelectedMonthYear } from "../../utils/date-picker/date-picker-types";
+/**
+ * @name Date Calendar
+ * @category Forms
+ * @summary Use for selecting dates from a standalone calendar.
+ */
+export declare class Q2DateCalendar implements ComponentInterface {
+    dayAbbrStrings: string[];
+    dayStrings: string[];
+    hostElement: HTMLElement;
+    activeDate: Date;
+    rangeDraftEnd: Date;
+    rangeDraftStart: Date;
+    rangeError: string;
+    rangeHoverDate: Date;
+    selectedMonthYear: DatePickerSelectedMonthYear;
+    /** Accessible calendar dialog label. */
+    accessibleLabel: string;
+    /** Uses the action-sheet calendar presentation. */
+    actionSheet: boolean;
+    /** Accessible and visible calendar label. */
+    calendarLabel: string;
+    /** Specifies a time of day after which a date is no longer valid. */
+    cutoffTime: string;
+    /** Defines valid days of the week using calendar checksum values. */
+    daysOfWeekChecksum: number;
+    /** Controls whether navigation appears above or below the date grid. */
+    direction: 'up' | 'down';
+    /** Disables calendar interaction. */
+    disabled: boolean;
+    /** Localized disclaimer content. */
+    disclaimer: string;
+    /** Controls the date format used in range summaries. */
+    displayFormat?: DatePickerDisplayFormat;
+    /** Defines the last selectable date. */
+    endDate: string;
+    /** Defines an explicit date blacklist using ISO date strings. */
+    invalidDates: string[];
+    /** Formats calendar and range labels using the provided locale. */
+    locale: string | string[];
+    /** Selects single-date or range calendar behavior. */
+    mode: DatePickerMode;
+    /** Indicates that a new calendar session has opened. */
+    open: boolean;
+    /** The committed range end as an ISO date string. */
+    rangeEnd: string;
+    /** The committed range start as an ISO date string. */
+    rangeStart: string;
+    /** Prevents calendar selection while retaining calendar visibility. */
+    readonly: boolean;
+    /** Defines the first selectable date. */
+    startDate: string;
+    /** Defines an explicit date whitelist using ISO date strings. */
+    validDates: string[];
+    /** The committed single date as an ISO date string. */
+    value: string;
+    /** Emitted when the user cancels range selection. */
+    tctCalendarCancel: EventEmitter<void>;
+    /** Emitted when the user commits a single date or date range. */
+    tctCalendarCommit: EventEmitter<DatePickerChangeDetail>;
+    /** Emitted when the calendar asks its container to dismiss it. */
+    tctCalendarDismiss: EventEmitter<void>;
+    /** Emitted when range confirmation validation changes. */
+    tctCalendarError: EventEmitter<string>;
+    /** Emitted with the committed date or range for standalone consumers and framework models. */
+    tctChange: EventEmitter<DatePickerChangeDetail>;
+    connectedCallback(): void;
+    focusHandler(event: CustomEvent<{
+        value?: string;
+    }>): void;
+    /** Moves the visible month to the provided date and focuses that day. */
+    focusDate(value: string | Date): Promise<void>;
+    /** Selects the provided date when it satisfies the calendar constraints. */
+    setValue(value: string | Date): Promise<void>;
+    constraintsChanged(): void;
+    modeChanged(): void;
+    openChanged(open: boolean): void;
+    rangeChanged(): void;
+    valueChanged(): void;
+    get constraints(): {
+        cutoffTime: string;
+        daysOfWeekChecksum: number;
+        endDate: string;
+        invalidDates: string[];
+        startDate: string;
+        validDates: string[];
+    };
+    get currentWeeks(): DatePickerDay[][];
+    get dateList(): DatePickerDay[];
+    get isRangeMode(): boolean;
+    get normalizedDisplayFormat(): DatePickerDisplayFormat;
+    get rangeConfirmDisabled(): boolean;
+    get rangeEndDate(): Date | undefined;
+    get rangeSummary(): string;
+    get rangeValidationError(): string;
+    get rovingDate(): Date;
+    get selectedDate(): Date | undefined;
+    get title(): string;
+    activateDate(date: Date): void;
+    emitCommit(detail: DatePickerChangeDetail): void;
+    findValidNavigationDate(date: Date, direction: 1 | -1): Date | undefined;
+    focusRenderedDate(date: Date): void;
+    formatRangeDate(date: Date): string;
+    goToMonthYear(monthIndex: number, selectedYear: number): void;
+    isDateValid(date: Date): boolean;
+    isRangeValid(start: Date, end: Date): boolean;
+    onDateHover: (event: MouseEvent) => void;
+    onDateHoverEnd: () => void;
+    onDateKeydown: (event: KeyboardEvent) => void;
+    onDateSelection: (event: MouseEvent) => void;
+    onNavigate(action: DatePickerNavigationAction): void;
+    onRangeCancel: () => void;
+    onRangeCommit: () => void;
+    resetCalendarSession(): void;
+    resetRangeDraft(): void;
+    selectDate(selectedDate: Date): void;
+    setRangeError(error: string): void;
+    renderNavigation(): any[];
+    renderNavigationButton(action: DatePickerNavigationAction): any;
+    render(): any;
+}

package/dist/types/components/q2-date-calendar/test/q2-date-calendar-test.vr.d.ts

@@ -0,0 +1 @@
+export {};