@gooddata/sdk-ui-filters 11.57.0-alpha.4 → 11.57.0-alpha.6

package/esm/DateFilter/AbsoluteDateFilterForm/AbsoluteDateFilterForm.d.ts

@@ -1,4 +1,4 @@
-import { type ReactNode } from "react";
+import { type ReactNode, type RefObject } from "react";
 import { type DateFilterGranularity, type WeekStart } from "@gooddata/sdk-model";
 import { type IAccessibilityConfigBase } from "@gooddata/sdk-ui-kit";
 import { type DateFilterOption, type IUiAbsoluteDateFilterForm } from "../interfaces/index.js";
@@ -26,6 +26,11 @@ export interface IAbsoluteDateFilterFormProps {
     withoutApply?: boolean;
     submitForm: () => void;
     customRangeHint?: ReactNode;
+    /**
+     * Reports whether the `PeriodRangePicker` branch's fields currently form a submittable range - see
+     * `IPeriodRangePickerProps.onValidityChange`. Not called for the classic `DateRangePicker` branch.
+     */
+    onPeriodRangeValidityChange?: (isValid: boolean) => void;
     /**
      * Enables Day/Week/Month/Quarter/Year granularity switching.
      *
@@ -43,9 +48,14 @@ export interface IAbsoluteDateFilterFormProps {
      * Accessibility configuration for the absolute date filter form.
      */
     accessibilityConfig?: IAbsoluteDateFilterFormAccessibilityConfig;
+    /**
+     * Ref for the granularity tabs' wrapping element - used for keyboard navigation focus management.
+     * Only relevant while {@link IAbsoluteDateFilterFormProps.isGranularityEnabled} renders the tabs.
+     */
+    granularityTabsRef?: RefObject<HTMLDivElement | null>;
 }
 /**
  * @internal
  */
-export declare function AbsoluteDateFilterForm({ dateFormat, isMobile, selectedFilterOption, isTimeEnabled, isSecondsEnabled, weekStart, shouldOverlayDatePicker, withoutApply, onSelectedFilterOptionChange, submitForm, customRangeHint, isGranularityEnabled, availableGranularities, accessibilityConfig, }: IAbsoluteDateFilterFormProps): import("react/jsx-runtime").JSX.Element;
+export declare function AbsoluteDateFilterForm({ dateFormat, isMobile, selectedFilterOption, isTimeEnabled, isSecondsEnabled, weekStart, shouldOverlayDatePicker, withoutApply, onSelectedFilterOptionChange, submitForm, customRangeHint, onPeriodRangeValidityChange, isGranularityEnabled, availableGranularities, accessibilityConfig, granularityTabsRef, }: IAbsoluteDateFilterFormProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=AbsoluteDateFilterForm.d.ts.map

package/esm/DateFilter/AbsoluteDateFilterForm/AbsoluteDateFilterForm.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AbsoluteDateFilterForm.d.ts","sourceRoot":"","sources":["../../../src/DateFilter/AbsoluteDateFilterForm/AbsoluteDateFilterForm.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAIvC,OAAO,EAEH,KAAK,qBAAqB,EAC1B,KAAK,SAAS,EACjB,MAAM,qBAAqB,CAAC;AAC7B,OAAO,EAAE,KAAK,wBAAwB,EAAE,MAAM,sBAAsB,CAAC;AAMrE,OAAO,EAAE,KAAK,gBAAgB,EAAE,KAAK,yBAAyB,EAAE,MAAM,wBAAwB,CAAC;AAU/F;;GAEG;AACH,MAAM,WAAW,0CAA2C,SAAQ,wBAAwB;IACxF;;OAEG;IACH,EAAE,CAAC,EAAE,MAAM,CAAC;CACf;AAED;;GAEG;AACH,MAAM,WAAW,4BAA4B;IACzC,UAAU,EAAE,MAAM,CAAC;IACnB,oBAAoB,EAAE,yBAAyB,CAAC;IAChD,QAAQ,EAAE,OAAO,CAAC;IAClB,4BAA4B,EAAE,CAAC,MAAM,EAAE,gBAAgB,KAAK,IAAI,CAAC;IACjE,aAAa,EAAE,OAAO,CAAC;IACvB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,uBAAuB,CAAC,EAAE,OAAO,CAAC;IAClC,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,UAAU,EAAE,MAAM,IAAI,CAAC;IACvB,eAAe,CAAC,EAAE,SAAS,CAAC;IAC5B;;;;;;;OAOG;IACH,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B;;OAEG;IACH,sBAAsB,EAAE,qBAAqB,EAAE,CAAC;IAChD;;OAEG;IACH,mBAAmB,CAAC,EAAE,0CAA0C,CAAC;CACpE;AAYD;;GAEG;AACH,wBAAgB,sBAAsB,CAAC,EACnC,UAAU,EACV,QAAQ,EACR,oBAAoB,EACpB,aAAa,EACb,gBAAwB,EACxB,SAAS,EACT,uBAAuB,EACvB,YAAY,EACZ,4BAA4B,EAC5B,UAAU,EACV,eAAe,EACf,oBAA4B,EAC5B,sBAAsB,EACtB,mBAAmB,GACtB,EAAE,4BAA4B,2CA+F9B"}
+{"version":3,"file":"AbsoluteDateFilterForm.d.ts","sourceRoot":"","sources":["../../../src/DateFilter/AbsoluteDateFilterForm/AbsoluteDateFilterForm.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,SAAS,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAIvD,OAAO,EAEH,KAAK,qBAAqB,EAC1B,KAAK,SAAS,EACjB,MAAM,qBAAqB,CAAC;AAC7B,OAAO,EAAE,KAAK,wBAAwB,EAAE,MAAM,sBAAsB,CAAC;AAMrE,OAAO,EAAE,KAAK,gBAAgB,EAAE,KAAK,yBAAyB,EAAE,MAAM,wBAAwB,CAAC;AAW/F;;GAEG;AACH,MAAM,WAAW,0CAA2C,SAAQ,wBAAwB;IACxF;;OAEG;IACH,EAAE,CAAC,EAAE,MAAM,CAAC;CACf;AAED;;GAEG;AACH,MAAM,WAAW,4BAA4B;IACzC,UAAU,EAAE,MAAM,CAAC;IACnB,oBAAoB,EAAE,yBAAyB,CAAC;IAChD,QAAQ,EAAE,OAAO,CAAC;IAClB,4BAA4B,EAAE,CAAC,MAAM,EAAE,gBAAgB,KAAK,IAAI,CAAC;IACjE,aAAa,EAAE,OAAO,CAAC;IACvB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,uBAAuB,CAAC,EAAE,OAAO,CAAC;IAClC,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,UAAU,EAAE,MAAM,IAAI,CAAC;IACvB,eAAe,CAAC,EAAE,SAAS,CAAC;IAC5B;;;OAGG;IACH,2BAA2B,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IACzD;;;;;;;OAOG;IACH,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B;;OAEG;IACH,sBAAsB,EAAE,qBAAqB,EAAE,CAAC;IAChD;;OAEG;IACH,mBAAmB,CAAC,EAAE,0CAA0C,CAAC;IACjE;;;OAGG;IACH,kBAAkB,CAAC,EAAE,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,CAAC;CACzD;AAYD;;GAEG;AACH,wBAAgB,sBAAsB,CAAC,EACnC,UAAU,EACV,QAAQ,EACR,oBAAoB,EACpB,aAAa,EACb,gBAAwB,EACxB,SAAS,EACT,uBAAuB,EACvB,YAAY,EACZ,4BAA4B,EAC5B,UAAU,EACV,eAAe,EACf,2BAA2B,EAC3B,oBAA4B,EAC5B,sBAAsB,EACtB,mBAAmB,EACnB,kBAAkB,GACrB,EAAE,4BAA4B,2CAoG9B"}

package/esm/DateFilter/AbsoluteDateFilterForm/AbsoluteDateFilterForm.js

@@ -4,7 +4,7 @@ import { DATE_FILTER_ABSOLUTE_GRANULARITY_TAB_ID } from "../accessibility/elemen
 import { DateRangePicker } from "../DateRangePicker/DateRangePicker.js";
 import { GranularityTabs } from "../GranularityTabs.js";
 import { PeriodRangePicker } from "../PeriodRangePicker/PeriodRangePicker.js";
-import { dateFilterValueToDateRange, dateRangeToDateFilterValue, periodRangeToDateFilterValue, } from "./conversions.js";
+import { dateFilterValueToDateRange, dateFilterValueToPeriodRange, dateRangeToDateFilterValue, periodRangeToDateFilterValue, } from "./conversions.js";
 const dayPickerProps = {
     mode: "range",
     weekStartsOn: 0, // Sunday, regardless of locale
@@ -13,7 +13,7 @@ const isPeriodPickerGranularity = (granularity) => DEFAULT_ABSOLUTE_DATE_FILTER_
 /**
  * @internal
  */
-export function AbsoluteDateFilterForm({ dateFormat, isMobile, selectedFilterOption, isTimeEnabled, isSecondsEnabled = false, weekStart, shouldOverlayDatePicker, withoutApply, onSelectedFilterOptionChange, submitForm, customRangeHint, isGranularityEnabled = false, availableGranularities, accessibilityConfig, }) {
+export function AbsoluteDateFilterForm({ dateFormat, isMobile, selectedFilterOption, isTimeEnabled, isSecondsEnabled = false, weekStart, shouldOverlayDatePicker, withoutApply, onSelectedFilterOptionChange, submitForm, customRangeHint, onPeriodRangeValidityChange, isGranularityEnabled = false, availableGranularities, accessibilityConfig, granularityTabsRef, }) {
     const selectedGranularity = selectedFilterOption.granularity ?? availableGranularities[0];
     const showGranularityTabs = isGranularityEnabled && availableGranularities.length > 0;
     const handleRangeChange = (range) => {
@@ -44,6 +44,6 @@ export function AbsoluteDateFilterForm({ dateFormat, isMobile, selectedFilterOpt
     // TODO MC-5322: time granularity is not supported in the new picker yet - the hour/minute/second can't be
     // modified, so the selected range always spans the whole day (00:00-23:59[:59] once time is enabled).
     // This will be added as part of MC-5322.
-    const picker = showGranularityTabs && isPeriodPickerGranularity(selectedGranularity) ? (_jsx(PeriodRangePicker, { granularity: selectedGranularity, range: { from: selectedFilterOption.from, to: selectedFilterOption.to }, onRangeChange: handlePeriodRangeChange, isMobile: isMobile, weekStart: weekStart, withoutApply: withoutApply, submitForm: submitForm }, selectedGranularity)) : (_jsx(DateRangePicker, { dateFormat: dateFormat, onRangeChange: handleRangeChange, range: dateFilterValueToDateRange(selectedFilterOption, isTimeEnabled, isSecondsEnabled), isMobile: isMobile, dayPickerProps: dayPickerProps, isTimeEnabled: isTimeEnabled, isSecondsEnabled: isSecondsEnabled, weekStart: weekStart, shouldOverlayDatePicker: shouldOverlayDatePicker, submitForm: submitForm, withoutApply: withoutApply, customRangeHint: customRangeHint }));
-    return (_jsxs(_Fragment, { children: [showGranularityTabs ? (_jsx(GranularityTabs, { availableGranularities: availableGranularities, selectedGranularity: selectedGranularity, onSelectedGranularityChange: handleGranularityChange, accessibilityConfig: { ariaControls: accessibilityConfig?.id }, className: "gd-absolute-filter-form-granularity-tabs s-absolute-filter-form-granularity-tabs", selectedTabId: DATE_FILTER_ABSOLUTE_GRANULARITY_TAB_ID })) : null, showGranularityTabs ? (_jsx("div", { id: accessibilityConfig?.id, role: "tabpanel", "aria-labelledby": DATE_FILTER_ABSOLUTE_GRANULARITY_TAB_ID, children: picker })) : (picker)] }));
+    const picker = showGranularityTabs && isPeriodPickerGranularity(selectedGranularity) ? (_jsx(PeriodRangePicker, { granularity: selectedGranularity, range: dateFilterValueToPeriodRange(selectedFilterOption), onRangeChange: handlePeriodRangeChange, isMobile: isMobile, weekStart: weekStart, withoutApply: withoutApply, submitForm: submitForm, dateFormat: dateFormat, customRangeHint: customRangeHint, onValidityChange: onPeriodRangeValidityChange }, selectedGranularity)) : (_jsx(DateRangePicker, { dateFormat: dateFormat, onRangeChange: handleRangeChange, range: dateFilterValueToDateRange(selectedFilterOption, isTimeEnabled, isSecondsEnabled), isMobile: isMobile, dayPickerProps: dayPickerProps, isTimeEnabled: isTimeEnabled, isSecondsEnabled: isSecondsEnabled, weekStart: weekStart, shouldOverlayDatePicker: shouldOverlayDatePicker, submitForm: submitForm, withoutApply: withoutApply, customRangeHint: customRangeHint }));
+    return (_jsxs(_Fragment, { children: [showGranularityTabs ? (_jsx("div", { ref: granularityTabsRef, children: _jsx(GranularityTabs, { availableGranularities: availableGranularities, selectedGranularity: selectedGranularity, onSelectedGranularityChange: handleGranularityChange, accessibilityConfig: { ariaControls: accessibilityConfig?.id }, className: "gd-absolute-filter-form-granularity-tabs s-absolute-filter-form-granularity-tabs", selectedTabId: DATE_FILTER_ABSOLUTE_GRANULARITY_TAB_ID }) })) : null, showGranularityTabs ? (_jsx("div", { id: accessibilityConfig?.id, role: "tabpanel", "aria-labelledby": DATE_FILTER_ABSOLUTE_GRANULARITY_TAB_ID, children: picker })) : (picker)] }));
 }

package/esm/DateFilter/AbsoluteDateFilterForm/conversions.d.ts

@@ -4,6 +4,7 @@ import { type IUiAbsoluteDateFilterForm } from "../interfaces/index.js";
 import { type IPeriodRange } from "../PeriodRangePicker/types.js";
 export declare const dateRangeToDateFilterValue: (range: IDateRange, localIdentifier: string, isTimeForAbsoluteRangeEnabled: boolean, emptyValueHandling?: EmptyValues, isSecondsForAbsoluteRangeEnabled?: boolean) => IUiAbsoluteDateFilterForm;
 export declare const dateFilterValueToDateRange: (value: IUiAbsoluteDateFilterForm, isTimeForAbsoluteRangeEnabled?: boolean, isSecondsForAbsoluteRangeEnabled?: boolean) => IDateRange;
+export declare const dateFilterValueToPeriodRange: (value: IUiAbsoluteDateFilterForm) => IPeriodRange;
 /**
  * @internal
  */

package/esm/DateFilter/AbsoluteDateFilterForm/conversions.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"conversions.d.ts","sourceRoot":"","sources":["../../../src/DateFilter/AbsoluteDateFilterForm/conversions.ts"],"names":[],"mappings":"AAEA,OAAO,EAAmB,KAAK,WAAW,EAAE,MAAM,qBAAqB,CAAC;AAWxE,OAAO,EAAE,KAAK,UAAU,EAAE,MAAM,6BAA6B,CAAC;AAC9D,OAAO,EAAE,KAAK,yBAAyB,EAAE,MAAM,wBAAwB,CAAC;AACxE,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,+BAA+B,CAAC;AAMlE,eAAO,MAAM,0BAA0B,UAC5B,UAAU,mBACA,MAAM,iCACQ,OAAO,uBACjB,WAAW,iDAEjC,yBAeF,CAAC;AAEF,eAAO,MAAM,0BAA0B,UAC5B,yBAAyB,0FAGjC,UAmBF,CAAC;AAEF;;GAEG;AACH,MAAM,WAAW,oCAAoC;IACjD,KAAK,EAAE,YAAY,CAAC;IACpB,eAAe,EAAE,MAAM,CAAC;IACxB,6BAA6B,EAAE,OAAO,CAAC;IACvC,kBAAkB,CAAC,EAAE,WAAW,CAAC;IACjC,gCAAgC,CAAC,EAAE,OAAO,CAAC;CAC9C;AAED;;;GAGG;AACH,eAAO,MAAM,4BAA4B,qHAMtC,oCAAoC,KAAG,yBAmBzC,CAAC"}
+{"version":3,"file":"conversions.d.ts","sourceRoot":"","sources":["../../../src/DateFilter/AbsoluteDateFilterForm/conversions.ts"],"names":[],"mappings":"AAEA,OAAO,EAAmB,KAAK,WAAW,EAAE,MAAM,qBAAqB,CAAC;AAWxE,OAAO,EAAE,KAAK,UAAU,EAAE,MAAM,6BAA6B,CAAC;AAC9D,OAAO,EAAE,KAAK,yBAAyB,EAAE,MAAM,wBAAwB,CAAC;AACxE,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,+BAA+B,CAAC;AAMlE,eAAO,MAAM,0BAA0B,UAC5B,UAAU,mBACA,MAAM,iCACQ,OAAO,uBACjB,WAAW,iDAEjC,yBAeF,CAAC;AAEF,eAAO,MAAM,0BAA0B,UAC5B,yBAAyB,0FAGjC,UAmBF,CAAC;AAEF,eAAO,MAAM,4BAA4B,UAAW,yBAAyB,KAAG,YAQ/E,CAAC;AAEF;;GAEG;AACH,MAAM,WAAW,oCAAoC;IACjD,KAAK,EAAE,YAAY,CAAC;IACpB,eAAe,EAAE,MAAM,CAAC;IACxB,6BAA6B,EAAE,OAAO,CAAC;IACvC,kBAAkB,CAAC,EAAE,WAAW,CAAC;IACjC,gCAAgC,CAAC,EAAE,OAAO,CAAC;CAC9C;AAED;;;GAGG;AACH,eAAO,MAAM,4BAA4B,qHAMtC,oCAAoC,KAAG,yBAmBzC,CAAC"}

package/esm/DateFilter/AbsoluteDateFilterForm/conversions.js

@@ -33,6 +33,14 @@ export const dateFilterValueToDateRange = (value, isTimeForAbsoluteRangeEnabled
     }
     return { from, to };
 };
+export const dateFilterValueToPeriodRange = (value) => {
+    const from = convertPlatformDateStringToDate(value.from);
+    const to = convertPlatformDateStringToDate(value.to);
+    return {
+        from: convertDateToPlatformDateString(from, platformDateFormat) ?? undefined,
+        to: convertDateToPlatformDateString(to, platformDateFormat) ?? undefined,
+    };
+};
 /**
  * Converts a resolved period-picker range into an absolute date filter value, extending it to the
  * start/end of day when time-of-day is enabled.

package/esm/DateFilter/DateFilterBody/DateFilterBody.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DateFilterBody.d.ts","sourceRoot":"","sources":["../../../src/DateFilter/DateFilterBody/DateFilterBody.tsx"],"names":[],"mappings":"AAEA,OAAO,EAGH,KAAK,YAAY,EACjB,KAAK,SAAS,EAMjB,MAAM,OAAO,CAAC;AAMf,OAAO,EACH,KAAK,qBAAqB,EAC1B,KAAK,gBAAgB,EACrB,KAAK,SAAS,EAKjB,MAAM,qBAAqB,CAAC;AAI7B,OAAO,EACH,KAAK,gBAAgB,EACrB,KAAK,wBAAwB,EAC7B,KAAK,yBAAyB,EAGjC,MAAM,wBAAwB,CAAC;AA4BhC,MAAM,WAAW,oBAAoB;IACjC,UAAU,EAAE,MAAM,CAAC;IACnB,aAAa,EAAE,wBAAwB,CAAC;IACxC,oBAAoB,EAAE,gBAAgB,CAAC;IACvC,4BAA4B,EAAE,CAAC,MAAM,EAAE,gBAAgB,KAAK,IAAI,CAAC;IAEjE,oBAAoB,EAAE,OAAO,CAAC;IAC9B,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,6BAA6B,EAAE,OAAO,CAAC;IACvC,4BAA4B,EAAE,CAAC,UAAU,EAAE,OAAO,KAAK,IAAI,CAAC;IAC5D,6BAA6B,EAAE,OAAO,CAAC;IACvC,gCAAgC,CAAC,EAAE,OAAO,CAAC;IAE3C,sCAAsC,EAAE,OAAO,CAAC;IAEhD,sBAAsB,EAAE,qBAAqB,EAAE,CAAC;IAEhD,UAAU,EAAE,OAAO,CAAC;IACpB,QAAQ,EAAE,OAAO,CAAC;IAClB,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAE5B,YAAY,EAAE,MAAM,IAAI,CAAC;IACzB,aAAa,EAAE,MAAM,IAAI,CAAC;IAC1B,aAAa,EAAE,MAAM,IAAI,CAAC;IAE1B,MAAM,CAAC,EAAE,yBAAyB,CAAC;IACnC,gBAAgB,EAAE,YAAY,CAAC;IAE/B,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC,oBAAoB,EAAE,MAAM,IAAI,CAAC;IAEjC,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,EAAE,CAAC,EAAE,MAAM,CAAC;IAEZ;;;OAGG;IACH,eAAe,CAAC,EAAE,gBAAgB,CAAC;IAEnC;;;;OAIG;IACH,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAEhC;;;;OAIG;IACH,eAAe,CAAC,EAAE,SAAS,CAAC;CAC/B;AAED,eAAO,MAAM,cAAc,iHAoczB,CAAC"}
+{"version":3,"file":"DateFilterBody.d.ts","sourceRoot":"","sources":["../../../src/DateFilter/DateFilterBody/DateFilterBody.tsx"],"names":[],"mappings":"AAEA,OAAO,EAGH,KAAK,YAAY,EACjB,KAAK,SAAS,EAMjB,MAAM,OAAO,CAAC;AAMf,OAAO,EACH,KAAK,qBAAqB,EAC1B,KAAK,gBAAgB,EACrB,KAAK,SAAS,EAKjB,MAAM,qBAAqB,CAAC;AAK7B,OAAO,EACH,KAAK,gBAAgB,EACrB,KAAK,wBAAwB,EAC7B,KAAK,yBAAyB,EAGjC,MAAM,wBAAwB,CAAC;AA4BhC,MAAM,WAAW,oBAAoB;IACjC,UAAU,EAAE,MAAM,CAAC;IACnB,aAAa,EAAE,wBAAwB,CAAC;IACxC,oBAAoB,EAAE,gBAAgB,CAAC;IACvC,4BAA4B,EAAE,CAAC,MAAM,EAAE,gBAAgB,KAAK,IAAI,CAAC;IAEjE,oBAAoB,EAAE,OAAO,CAAC;IAC9B,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,6BAA6B,EAAE,OAAO,CAAC;IACvC,4BAA4B,EAAE,CAAC,UAAU,EAAE,OAAO,KAAK,IAAI,CAAC;IAC5D,6BAA6B,EAAE,OAAO,CAAC;IACvC,gCAAgC,CAAC,EAAE,OAAO,CAAC;IAE3C,sCAAsC,EAAE,OAAO,CAAC;IAEhD,sBAAsB,EAAE,qBAAqB,EAAE,CAAC;IAEhD,UAAU,EAAE,OAAO,CAAC;IACpB,QAAQ,EAAE,OAAO,CAAC;IAClB,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAE5B,YAAY,EAAE,MAAM,IAAI,CAAC;IACzB,aAAa,EAAE,MAAM,IAAI,CAAC;IAC1B,aAAa,EAAE,MAAM,IAAI,CAAC;IAE1B,MAAM,CAAC,EAAE,yBAAyB,CAAC;IACnC,gBAAgB,EAAE,YAAY,CAAC;IAE/B,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC,oBAAoB,EAAE,MAAM,IAAI,CAAC;IAEjC,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,EAAE,CAAC,EAAE,MAAM,CAAC;IAEZ;;;OAGG;IACH,eAAe,CAAC,EAAE,gBAAgB,CAAC;IAEnC;;;;OAIG;IACH,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAEhC;;;;OAIG;IACH,eAAe,CAAC,EAAE,SAAS,CAAC;CAC/B;AAED,eAAO,MAAM,cAAc,iHA0czB,CAAC"}

package/esm/DateFilter/DateFilterBody/DateFilterBody.js

@@ -6,6 +6,7 @@ import { isEmpty } from "lodash-es";
 import { useIntl } from "react-intl";
 import { isAbsoluteDateFilterForm, isAllTimeDateFilterOption, isEmptyValuesDateFilterOption, isRelativeDateFilterForm, } from "@gooddata/sdk-model";
 import { useIdPrefixed } from "@gooddata/sdk-ui-kit";
+import { isEditableElement } from "../../shared/utils/domUtilities.js";
 import { CheckboxSection } from "../CheckboxSection/CheckboxSection.js";
 import { getDateFilterOptionGranularity } from "../utils/OptionUtils.js";
 import { ensureCompatibleAbsoluteGranularity, ensureCompatibleGranularity, filterStandardGranularities, getDefaultCalendarTab, getFilteredGranularities, getFilteredPresets, getFiscalTabsConfig, } from "../utils/presetFilterUtils.js";
@@ -31,6 +32,10 @@ export const DateFilterBody = forwardRef((props, ref) => {
     const rootRef = useRef(null);
     const didResetMobileScroll = useRef(false);
     const didSyncInitialMobileRoute = useRef(false);
+    // Gates Apply independently of `errors`: a garbled/emptied PeriodRangePicker field never reaches
+    // `onSelectedFilterOptionChange`, so `errors` alone would stay stale and leave Apply enabled - see
+    // `IPeriodRangePickerProps.onValidityChange`.
+    const [isPeriodRangeValid, setIsPeriodRangeValid] = useState(true);
     const intl = useIntl();
     const fiscalTabsConfig = getFiscalTabsConfig(props.filterOptions.relativePreset, props.activeCalendars);
     const [selectedTab, setSelectedTab] = useState(() => getDefaultCalendarTab(props.activeCalendars, props.selectedFilterOption));
@@ -164,7 +169,7 @@ export const DateFilterBody = forwardRef((props, ref) => {
     const hasFormOptions = !!(filterOptions.absoluteForm ||
         (filterOptions.relativeForm && availableGranularities.length > 0));
     const handleKeyDown = (e) => {
-        if (e.key === "ArrowLeft" && route) {
+        if (e.key === "ArrowLeft" && route && !isEditableElement(e.target)) {
             e.preventDefault();
             e.stopPropagation();
             handleBackNavigation();
@@ -188,7 +193,7 @@ export const DateFilterBody = forwardRef((props, ref) => {
     return (_jsxs("div", { ref: rootRef, className: cx(!isMobile && "gd-extended-date-filter-body-redesigned", "gd-extended-date-filter-body", "s-extended-date-filters-body", isMobile && "gd-extended-date-filter-body-mobile", route && "gd-active-form"), onKeyDown: handleKeyDown, onFocus: handleFocus, role: "dialog", id: formId, "aria-label": formLabel, children: [route === null && isMobile ? (_jsx("div", { className: "gd-extended-date-filter-mobile-header", onClick: () => {
                     onCancelClick();
                     closeDropdown();
-                }, children: dateFilterButton })) : null, route ? (_jsx("div", { className: "gd-extended-date-filter-form-wrapper", ref: ref, children: _jsx(DateFilterFormContent, { filterOptions: filterOptions, selectedFilterOption: selectedFilterOption, onSelectedFilterOptionChange: onSelectedFilterOptionChange, dateFormat: dateFormat, weekStart: weekStart, isTimeForAbsoluteRangeEnabled: isTimeForAbsoluteRangeEnabled, isSecondsForAbsoluteRangeEnabled: isSecondsForAbsoluteRangeEnabled, isAbsoluteDateFilterGranularityEnabled: props.isAbsoluteDateFilterGranularityEnabled, availableGranularities: filteredAvailableGranularities, absoluteAvailableGranularities: filteredAbsoluteAvailableGranularities, isMobile: isMobile, withoutApply: withoutApply, enableEmptyDateValues: props.enableEmptyDateValues, customRangeHint: props.customRangeHint, activeForm: route, onBackNavigation: handleBackNavigation, onClose: closeDropdown, submitForm: () => {
+                }, children: dateFilterButton })) : null, route ? (_jsx("div", { className: "gd-extended-date-filter-form-wrapper", ref: ref, children: _jsx(DateFilterFormContent, { filterOptions: filterOptions, selectedFilterOption: selectedFilterOption, onSelectedFilterOptionChange: onSelectedFilterOptionChange, dateFormat: dateFormat, weekStart: weekStart, isTimeForAbsoluteRangeEnabled: isTimeForAbsoluteRangeEnabled, isSecondsForAbsoluteRangeEnabled: isSecondsForAbsoluteRangeEnabled, isAbsoluteDateFilterGranularityEnabled: props.isAbsoluteDateFilterGranularityEnabled, availableGranularities: filteredAvailableGranularities, absoluteAvailableGranularities: filteredAbsoluteAvailableGranularities, isMobile: isMobile, withoutApply: withoutApply, enableEmptyDateValues: props.enableEmptyDateValues, customRangeHint: props.customRangeHint, onPeriodRangeValidityChange: setIsPeriodRangeValid, activeForm: route, onBackNavigation: handleBackNavigation, onClose: closeDropdown, submitForm: () => {
                         onApplyClick();
                         if (!withoutApply) {
                             closeDropdown();
@@ -224,7 +229,7 @@ export const DateFilterBody = forwardRef((props, ref) => {
                     : undefined }), _jsxs("div", { role: "group", className: cx("gd-extended-date-filter-actions"), children: [_jsx("div", { className: "gd-extended-date-filter-actions-left-content", children: isConfigurationEnabled ? (_jsx(DateFilterConfigurationButton, { onConfiguration: onConfigurationClick })) : null }), _jsxs("div", { className: "gd-extended-date-filter-actions-buttons", children: [_jsx(DateFilterBodyButton, { messageId: withoutApply ? "close" : "cancel", className: cx("gd-button-secondary", isMobile ? "gd-button-medium" : "gd-button-small", withoutApply ? "s-date-filter-close" : "s-date-filter-cancel"), onClick: () => {
                                     onCancelClick();
                                     closeDropdown();
-                                } }), !withoutApply && (_jsx(DateFilterBodyButton, { messageId: "apply", className: cx("gd-button-action", isMobile ? "gd-button-medium" : "gd-button-small", "s-date-filter-apply"), disabled: !isEmpty(errors), onClick: () => {
+                                } }), !withoutApply && (_jsx(DateFilterBodyButton, { messageId: "apply", className: cx("gd-button-action", isMobile ? "gd-button-medium" : "gd-button-small", "s-date-filter-apply"), disabled: !isEmpty(errors) || !isPeriodRangeValid, onClick: () => {
                                     onApplyClick();
                                     closeDropdown();
                                 }, describedByFromValidation: true }))] })] })] }));

package/esm/DateFilter/DateFilterBody/DateFilterFormContent.d.ts

@@ -17,6 +17,7 @@ export interface IDateFilterFormContentProps {
     withoutApply?: boolean;
     enableEmptyDateValues?: boolean;
     customRangeHint?: ReactNode;
+    onPeriodRangeValidityChange?: (isValid: boolean) => void;
     activeForm: DateFilterRoute;
     onBackNavigation: () => void;
     onClose: () => void;
@@ -29,5 +30,5 @@ export interface IDateFilterFormContentProps {
  *
  * @internal
  */
-export declare function DateFilterFormContent({ filterOptions, selectedFilterOption, onSelectedFilterOptionChange, dateFormat, weekStart, isTimeForAbsoluteRangeEnabled, isSecondsForAbsoluteRangeEnabled, isAbsoluteDateFilterGranularityEnabled, availableGranularities, absoluteAvailableGranularities, isMobile, withoutApply, enableEmptyDateValues, customRangeHint, activeForm, onBackNavigation, onClose, submitForm, errors, }: IDateFilterFormContentProps): import("react/jsx-runtime").JSX.Element;
+export declare function DateFilterFormContent({ filterOptions, selectedFilterOption, onSelectedFilterOptionChange, dateFormat, weekStart, isTimeForAbsoluteRangeEnabled, isSecondsForAbsoluteRangeEnabled, isAbsoluteDateFilterGranularityEnabled, availableGranularities, absoluteAvailableGranularities, isMobile, withoutApply, enableEmptyDateValues, customRangeHint, onPeriodRangeValidityChange, activeForm, onBackNavigation, onClose, submitForm, errors, }: IDateFilterFormContentProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=DateFilterFormContent.d.ts.map

package/esm/DateFilter/DateFilterBody/DateFilterFormContent.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DateFilterFormContent.d.ts","sourceRoot":"","sources":["../../../src/DateFilter/DateFilterBody/DateFilterFormContent.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAsB,KAAK,SAAS,EAAuB,MAAM,OAAO,CAAC;AAKhF,OAAO,EACH,KAAK,qBAAqB,EAC1B,KAAK,SAAS,EAKjB,MAAM,qBAAqB,CAAC;AAU7B,OAAO,EACH,KAAK,gBAAgB,EACrB,KAAK,wBAAwB,EAC7B,KAAK,yBAAyB,EAGjC,MAAM,wBAAwB,CAAC;AAIhC,OAAO,EAAE,KAAK,eAAe,EAAE,MAAM,YAAY,CAAC;AAElD,MAAM,WAAW,2BAA2B;IACxC,aAAa,EAAE,wBAAwB,CAAC;IACxC,oBAAoB,EAAE,gBAAgB,CAAC;IACvC,4BAA4B,EAAE,CAAC,MAAM,EAAE,gBAAgB,KAAK,IAAI,CAAC;IAEjE,UAAU,EAAE,MAAM,CAAC;IACnB,SAAS,EAAE,SAAS,CAAC;IACrB,6BAA6B,EAAE,OAAO,CAAC;IACvC,gCAAgC,CAAC,EAAE,OAAO,CAAC;IAC3C,sCAAsC,EAAE,OAAO,CAAC;IAChD,sBAAsB,EAAE,qBAAqB,EAAE,CAAC;IAChD,8BAA8B,EAAE,qBAAqB,EAAE,CAAC;IAExD,QAAQ,EAAE,OAAO,CAAC;IAClB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,eAAe,CAAC,EAAE,SAAS,CAAC;IAE5B,UAAU,EAAE,eAAe,CAAC;IAC5B,gBAAgB,EAAE,MAAM,IAAI,CAAC;IAC7B,OAAO,EAAE,MAAM,IAAI,CAAC;IAEpB,UAAU,EAAE,MAAM,IAAI,CAAC;IACvB,MAAM,CAAC,EAAE,yBAAyB,CAAC;CACtC;AAED;;;;;GAKG;AACH,wBAAgB,qBAAqB,CAAC,EAClC,aAAa,EACb,oBAAoB,EACpB,4BAA4B,EAC5B,UAAU,EACV,SAAS,EACT,6BAA6B,EAC7B,gCAAgC,EAChC,sCAAsC,EACtC,sBAAsB,EACtB,8BAA8B,EAC9B,QAAQ,EACR,YAAY,EACZ,qBAAqB,EACrB,eAAe,EACf,UAAU,EACV,gBAAgB,EAChB,OAAO,EACP,UAAU,EACV,MAAM,GACT,EAAE,2BAA2B,2CA+I7B"}
+{"version":3,"file":"DateFilterFormContent.d.ts","sourceRoot":"","sources":["../../../src/DateFilter/DateFilterBody/DateFilterFormContent.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAsB,KAAK,SAAS,EAAuC,MAAM,OAAO,CAAC;AAKhG,OAAO,EACH,KAAK,qBAAqB,EAC1B,KAAK,SAAS,EAKjB,MAAM,qBAAqB,CAAC;AAU7B,OAAO,EACH,KAAK,gBAAgB,EACrB,KAAK,wBAAwB,EAC7B,KAAK,yBAAyB,EAGjC,MAAM,wBAAwB,CAAC;AAIhC,OAAO,EAAE,KAAK,eAAe,EAAE,MAAM,YAAY,CAAC;AAElD,MAAM,WAAW,2BAA2B;IACxC,aAAa,EAAE,wBAAwB,CAAC;IACxC,oBAAoB,EAAE,gBAAgB,CAAC;IACvC,4BAA4B,EAAE,CAAC,MAAM,EAAE,gBAAgB,KAAK,IAAI,CAAC;IAEjE,UAAU,EAAE,MAAM,CAAC;IACnB,SAAS,EAAE,SAAS,CAAC;IACrB,6BAA6B,EAAE,OAAO,CAAC;IACvC,gCAAgC,CAAC,EAAE,OAAO,CAAC;IAC3C,sCAAsC,EAAE,OAAO,CAAC;IAChD,sBAAsB,EAAE,qBAAqB,EAAE,CAAC;IAChD,8BAA8B,EAAE,qBAAqB,EAAE,CAAC;IAExD,QAAQ,EAAE,OAAO,CAAC;IAClB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,eAAe,CAAC,EAAE,SAAS,CAAC;IAC5B,2BAA2B,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IAEzD,UAAU,EAAE,eAAe,CAAC;IAC5B,gBAAgB,EAAE,MAAM,IAAI,CAAC;IAC7B,OAAO,EAAE,MAAM,IAAI,CAAC;IAEpB,UAAU,EAAE,MAAM,IAAI,CAAC;IACvB,MAAM,CAAC,EAAE,yBAAyB,CAAC;CACtC;AAkBD;;;;;GAKG;AACH,wBAAgB,qBAAqB,CAAC,EAClC,aAAa,EACb,oBAAoB,EACpB,4BAA4B,EAC5B,UAAU,EACV,SAAS,EACT,6BAA6B,EAC7B,gCAAgC,EAChC,sCAAsC,EACtC,sBAAsB,EACtB,8BAA8B,EAC9B,QAAQ,EACR,YAAY,EACZ,qBAAqB,EACrB,eAAe,EACf,2BAA2B,EAC3B,UAAU,EACV,gBAAgB,EAChB,OAAO,EACP,UAAU,EACV,MAAM,GACT,EAAE,2BAA2B,2CA4I7B"}

package/esm/DateFilter/DateFilterBody/DateFilterFormContent.js

@@ -6,18 +6,27 @@ import { useIntl } from "react-intl";
 import { isAbsoluteDateFilterForm, isAllTimeDateFilterOption, isEmptyValuesDateFilterOption, isRelativeDateFilterForm, } from "@gooddata/sdk-model";
 import { useId } from "@gooddata/sdk-ui-kit";
 import { AbsoluteDateFilterForm } from "../AbsoluteDateFilterForm/AbsoluteDateFilterForm.js";
-import { createDateFilterRelativeFormKeyboardHandler, submitRelativeDateFilterForm, } from "../accessibility/keyboardNavigation.js";
+import { createGranularityTabsKeyboardHandler, submitRelativeDateFilterForm, } from "../accessibility/keyboardNavigation.js";
 import { DateFilterFormWrapper } from "../DateFilterFormWrapper/DateFilterFormWrapper.js";
 import { EmptyValuesHandlingToggle } from "../EmptyValuesHandlingToggle/EmptyValuesHandlingToggle.js";
 import { RelativeDateFilterForm } from "../RelativeDateFilterForm/RelativeDateFilterForm.js";
 import { DateFilterFormNavigationWrapper } from "./DateFilterFormNavigationWrapper.js";
+/**
+ * Builds the keydown handler bound to a granularity tabs container, shared by the absolute and relative
+ * form's wrapper `<div>`s below - the only two consumers, hence a local hook rather than a shared export.
+ */
+function useGranularityTabsKeydownHandler(tabGranularityRef, closeDropdown) {
+    return useCallback((event) => {
+        createGranularityTabsKeyboardHandler({ tabGranularityRef, closeDropdown })(event);
+    }, [tabGranularityRef, closeDropdown]);
+}
 /**
  * Component that renders the form content (absolute or relative) for date filter.
  * This component is purely presentational and doesn't manage any navigation state.
  *
  * @internal
  */
-export function DateFilterFormContent({ filterOptions, selectedFilterOption, onSelectedFilterOptionChange, dateFormat, weekStart, isTimeForAbsoluteRangeEnabled, isSecondsForAbsoluteRangeEnabled, isAbsoluteDateFilterGranularityEnabled, availableGranularities, absoluteAvailableGranularities, isMobile, withoutApply, enableEmptyDateValues, customRangeHint, activeForm, onBackNavigation, onClose, submitForm, errors, }) {
+export function DateFilterFormContent({ filterOptions, selectedFilterOption, onSelectedFilterOptionChange, dateFormat, weekStart, isTimeForAbsoluteRangeEnabled, isSecondsForAbsoluteRangeEnabled, isAbsoluteDateFilterGranularityEnabled, availableGranularities, absoluteAvailableGranularities, isMobile, withoutApply, enableEmptyDateValues, customRangeHint, onPeriodRangeValidityChange, activeForm, onBackNavigation, onClose, submitForm, errors, }) {
     const showStaticForm = activeForm === "absoluteForm" && filterOptions.absoluteForm;
     const showRelativeForm = activeForm === "relativeForm" && filterOptions.relativeForm && availableGranularities.length > 0;
     const absoluteSelectedFilterOption = filterOptions.absoluteForm && isAbsoluteDateFilterForm(selectedFilterOption)
@@ -27,8 +36,8 @@ export function DateFilterFormContent({ filterOptions, selectedFilterOption, onS
         ? selectedFilterOption
         : filterOptions.relativeForm;
     const intl = useIntl();
-    const relativeDateFilterRef = useRef(null);
     const tabGranularityRef = useRef(null);
+    const absoluteTabGranularityRef = useRef(null);
     const relativeDateFilterId = useId();
     const absoluteDateFilterId = useId();
     const shouldRenderEmptyValuesHandling = !!enableEmptyDateValues &&
@@ -37,25 +46,19 @@ export function DateFilterFormContent({ filterOptions, selectedFilterOption, onS
         selectedFilterOption.emptyValueHandling !== "only";
     const effectiveEmptyValueHandling = selectedFilterOption.emptyValueHandling ?? "exclude";
     const emptyValueHandlingToggleChecked = effectiveEmptyValueHandling === "include";
-    const handleRelativeDateFilterKeydown = useCallback((event, closeDropdown) => {
-        const keyboardHandler = createDateFilterRelativeFormKeyboardHandler({
-            relativeDateFilterRef,
-            tabGranularityRef,
-            closeDropdown,
-        });
-        keyboardHandler(event);
-    }, [relativeDateFilterRef, tabGranularityRef]);
+    const handleRelativeDateFilterKeydown = useGranularityTabsKeydownHandler(tabGranularityRef, onClose);
+    const handleAbsoluteDateFilterKeydown = useGranularityTabsKeydownHandler(absoluteTabGranularityRef, onClose);
     return (_jsxs("div", { className: "gd-date-filter-form-content", children: [showStaticForm ? (_jsx(DateFilterFormNavigationWrapper, { title: filterOptions.absoluteForm?.name
                     ? filterOptions.absoluteForm.name
-                    : intl.formatMessage({ id: "filters.staticPeriod" }), onBack: onBackNavigation, backLabel: intl.formatMessage({ id: "menu.back" }), isMobile: isMobile, children: _jsxs(DateFilterFormWrapper, { isMobile: isMobile, children: [_jsx(AbsoluteDateFilterForm, { dateFormat: dateFormat, onSelectedFilterOptionChange: onSelectedFilterOptionChange, selectedFilterOption: absoluteSelectedFilterOption, isMobile: isMobile, isTimeEnabled: isTimeForAbsoluteRangeEnabled, isSecondsEnabled: isSecondsForAbsoluteRangeEnabled, isGranularityEnabled: isAbsoluteDateFilterGranularityEnabled, availableGranularities: absoluteAvailableGranularities, accessibilityConfig: { id: absoluteDateFilterId }, weekStart: weekStart, submitForm: submitForm, withoutApply: withoutApply, customRangeHint: customRangeHint }), shouldRenderEmptyValuesHandling ? (_jsx(EmptyValuesHandlingToggle, { mode: "include", className: "gd-date-filter-empty-values-handling-toggle", checked: emptyValueHandlingToggleChecked, onChange: (checked) => {
-                                const emptyValueHandling = checked ? "include" : undefined;
-                                onSelectedFilterOptionChange({
-                                    ...absoluteSelectedFilterOption,
-                                    emptyValueHandling,
-                                });
-                            } })) : null] }) })) : null, showRelativeForm ? (_jsx(DateFilterFormNavigationWrapper, { title: filterOptions.relativeForm?.name
+                    : intl.formatMessage({ id: "filters.staticPeriod" }), onBack: onBackNavigation, backLabel: intl.formatMessage({ id: "menu.back" }), isMobile: isMobile, children: _jsx("div", { onKeyDown: handleAbsoluteDateFilterKeydown, children: _jsxs(DateFilterFormWrapper, { isMobile: isMobile, children: [_jsx(AbsoluteDateFilterForm, { dateFormat: dateFormat, onSelectedFilterOptionChange: onSelectedFilterOptionChange, selectedFilterOption: absoluteSelectedFilterOption, isMobile: isMobile, isTimeEnabled: isTimeForAbsoluteRangeEnabled, isSecondsEnabled: isSecondsForAbsoluteRangeEnabled, isGranularityEnabled: isAbsoluteDateFilterGranularityEnabled, availableGranularities: absoluteAvailableGranularities, accessibilityConfig: { id: absoluteDateFilterId }, weekStart: weekStart, submitForm: submitForm, withoutApply: withoutApply, customRangeHint: customRangeHint, onPeriodRangeValidityChange: onPeriodRangeValidityChange, granularityTabsRef: absoluteTabGranularityRef }), shouldRenderEmptyValuesHandling ? (_jsx(EmptyValuesHandlingToggle, { mode: "include", className: "gd-date-filter-empty-values-handling-toggle", checked: emptyValueHandlingToggleChecked, onChange: (checked) => {
+                                    const emptyValueHandling = checked ? "include" : undefined;
+                                    onSelectedFilterOptionChange({
+                                        ...absoluteSelectedFilterOption,
+                                        emptyValueHandling,
+                                    });
+                                } })) : null] }) }) })) : null, showRelativeForm ? (_jsx(DateFilterFormNavigationWrapper, { title: filterOptions.relativeForm?.name
                     ? filterOptions.relativeForm.name
-                    : intl.formatMessage({ id: "filters.floatingRange" }), onBack: onBackNavigation, backLabel: intl.formatMessage({ id: "menu.back" }), isMobile: isMobile, children: _jsx("div", { ref: relativeDateFilterRef, onKeyDown: (e) => handleRelativeDateFilterKeydown(e, onClose), children: _jsxs(DateFilterFormWrapper, { isMobile: isMobile, children: [_jsx(RelativeDateFilterForm, { onSelectedFilterOptionChange: onSelectedFilterOptionChange, selectedFilterOption: relativeSelectedFilterOption, availableGranularities: availableGranularities, isMobile: isMobile, ref: tabGranularityRef, relativeDateFilterId: relativeDateFilterId, onKeyDown: (event) => submitRelativeDateFilterForm(event, isEmpty(errors), withoutApply ?? false, onClose, submitForm) }), shouldRenderEmptyValuesHandling ? (_jsx(EmptyValuesHandlingToggle, { mode: "include", className: "gd-date-filter-empty-values-handling-toggle", checked: emptyValueHandlingToggleChecked, onChange: (checked) => {
+                    : intl.formatMessage({ id: "filters.floatingRange" }), onBack: onBackNavigation, backLabel: intl.formatMessage({ id: "menu.back" }), isMobile: isMobile, children: _jsx("div", { onKeyDown: handleRelativeDateFilterKeydown, children: _jsxs(DateFilterFormWrapper, { isMobile: isMobile, children: [_jsx(RelativeDateFilterForm, { onSelectedFilterOptionChange: onSelectedFilterOptionChange, selectedFilterOption: relativeSelectedFilterOption, availableGranularities: availableGranularities, isMobile: isMobile, ref: tabGranularityRef, relativeDateFilterId: relativeDateFilterId, onKeyDown: (event) => submitRelativeDateFilterForm(event, isEmpty(errors), withoutApply ?? false, onClose, submitForm) }), shouldRenderEmptyValuesHandling ? (_jsx(EmptyValuesHandlingToggle, { mode: "include", className: "gd-date-filter-empty-values-handling-toggle", checked: emptyValueHandlingToggleChecked, onChange: (checked) => {
                                     const emptyValueHandling = checked ? "include" : undefined;
                                     onSelectedFilterOptionChange({
                                         ...relativeSelectedFilterOption,

package/esm/DateFilter/PeriodRangePicker/AccessibleFieldInput.d.ts

@@ -0,0 +1,19 @@
+import { type InputHTMLAttributes } from "react";
+interface IAccessibleFieldInputProps extends InputHTMLAttributes<HTMLInputElement> {
+    "date-range"?: "start" | "end";
+}
+/**
+ * A drop-in replacement for the plain `<input>` rc-picker renders for each half of the date range,
+ * used only to layer on the accessibility attributes our a11y model needs - a label, an invalid
+ * state, and a description pointing at either a format hint or an error message. Typing, masking,
+ * and focus behavior all still belong to rc-picker; this component just decorates the props it's handed.
+ *
+ * @remarks
+ * rc-picker exposes two facts only this component can observe directly: whether the typed text failed to
+ * parse (as this input's own invalid state) and whether the field is currently blank (its own live displayed
+ * text, which updates on every keystroke including a clear). Both are reported upward, raw and unresolved, via
+ * an effect - the surrounding picker owns everything else needed to turn them into an error kind or message.
+ */
+export declare const AccessibleFieldInput: import("react").ForwardRefExoticComponent<IAccessibleFieldInputProps & import("react").RefAttributes<HTMLInputElement>>;
+export {};
+//# sourceMappingURL=AccessibleFieldInput.d.ts.map

package/esm/DateFilter/PeriodRangePicker/AccessibleFieldInput.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AccessibleFieldInput.d.ts","sourceRoot":"","sources":["../../../src/DateFilter/PeriodRangePicker/AccessibleFieldInput.tsx"],"names":[],"mappings":"AAEA,OAAO,EACH,KAAK,mBAAmB,EAM3B,MAAM,OAAO,CAAC;AAMf,UAAU,0BAA2B,SAAQ,mBAAmB,CAAC,gBAAgB,CAAC;IAC9E,YAAY,CAAC,EAAE,OAAO,GAAG,KAAK,CAAC;CAClC;AAED;;;;;;;;;;;GAWG;AACH,eAAO,MAAM,oBAAoB,yHAgG/B,CAAC"}

package/esm/DateFilter/PeriodRangePicker/AccessibleFieldInput.js

@@ -0,0 +1,91 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+// (C) 2026 GoodData Corporation
+import { forwardRef, useCallback, useContext, useEffect, } from "react";
+import { isArrowDownKey, isArrowKey } from "@gooddata/sdk-ui-kit";
+import { PeriodRangeAccessibilityContext } from "./periodRangePickerAccessibility.js";
+/**
+ * A drop-in replacement for the plain `<input>` rc-picker renders for each half of the date range,
+ * used only to layer on the accessibility attributes our a11y model needs - a label, an invalid
+ * state, and a description pointing at either a format hint or an error message. Typing, masking,
+ * and focus behavior all still belong to rc-picker; this component just decorates the props it's handed.
+ *
+ * @remarks
+ * rc-picker exposes two facts only this component can observe directly: whether the typed text failed to
+ * parse (as this input's own invalid state) and whether the field is currently blank (its own live displayed
+ * text, which updates on every keystroke including a clear). Both are reported upward, raw and unresolved, via
+ * an effect - the surrounding picker owns everything else needed to turn them into an error kind or message.
+ */
+export const AccessibleFieldInput = forwardRef((props, ref) => {
+    const { "date-range": side, "aria-invalid": rcPickerInvalid, onKeyDown, ...restProps } = props;
+    const accessibility = useContext(PeriodRangeAccessibilityContext);
+    const field = side ? accessibility?.[side] : undefined;
+    const isCalendarOpen = accessibility?.isCalendarOpen ?? false;
+    const onRequestOpen = accessibility?.onRequestOpen;
+    const enterCommitRef = accessibility?.enterCommitRef;
+    const onEnterCommit = accessibility?.onEnterCommit;
+    const ignoreEnter = accessibility?.ignoreEnter ?? false;
+    const hasParseError = rcPickerInvalid === true;
+    const isBlank = !props.value;
+    useEffect(() => {
+        if (side) {
+            accessibility?.onFieldStateChange(side, { hasParseError, isBlank });
+        }
+    }, [accessibility, side, hasParseError, isBlank]);
+    // rc-picker's own Enter/Escape field-confirmation logic (forwarded as onKeyDown) must still run first;
+    // stopping propagation afterwards for arrow/Home/End keys - without preventDefault - lets the browser move
+    // the caret normally instead of DateFilterBody/DateFilterCore treating it as back/roving-focus navigation.
+    const handleKeyDown = useCallback((e) => {
+        // rc-picker confirms the field inside the handler forwarded below (its `onSharedKeyDown` calls
+        // `onSubmit()`), but both the resulting `onChange` (when the round completes) and its own
+        // deactivation `onBlur` (rc-picker's `useFocusEvents`, which defers via a microtask so that
+        // tabbing between this picker's own two fields isn't briefly seen as blurring the whole thing)
+        // land one microtask later, not synchronously within this call. The flag has to outlive that
+        // microtask too, so the reset below is deferred with `queueMicrotask` rather than done
+        // immediately - an immediate reset would already have flipped back to false by the time either
+        // callback runs, defeating the guards in handleChange/handleFieldBlur. `finally` still matters
+        // for scheduling the reset even if `onKeyDown`/`onEnterCommit` throws.
+        const isEnter = e.key === "Enter";
+        if (isEnter && ignoreEnter) {
+            // In ALL_AT_ONCE mode the caret has to stay where the user is typing, and
+            // blur is the only commit point.
+            return;
+        }
+        if (isEnter && enterCommitRef) {
+            enterCommitRef.current = true;
+        }
+        try {
+            onKeyDown?.(e);
+            if (isEnter) {
+                onEnterCommit?.();
+            }
+        }
+        finally {
+            if (isEnter && enterCommitRef) {
+                queueMicrotask(() => {
+                    enterCommitRef.current = false;
+                });
+            }
+        }
+        if (isArrowKey(e) || e.key === "Home" || e.key === "End") {
+            e.stopPropagation();
+        }
+        // rc-picker already closes its own calendar on Escape internally; without this, the event keeps
+        // bubbling up to DateFilterFormContent's outer keydown handler, whose `makeLinearKeyboardNavigation`
+        // maps only Escape to closing the whole dropdown. The Tab branch below is not mirroring that
+        // mapping - it's a deliberate extra guard so Tab-ing between the two fields, which the browser
+        // handles natively, never also reaches that outer handler's own key routing.
+        if (isCalendarOpen && (e.key === "Escape" || e.key === "Tab")) {
+            e.stopPropagation();
+        }
+        // rc-picker silently swallows every "open" request while the field is being typed into, so opening
+        // the calendar via keyboard has to be detected explicitly here rather than relying on rc-picker's
+        // own onOpenChange. Alt+ArrowDown rather than plain ArrowDown: it matches the ARIA combobox pattern's
+        // "open the popup without moving focus" binding, and leaves bare ArrowUp/ArrowDown free to move
+        // the caret inside the field, which is what the stopPropagation above is there to preserve.
+        if (!isCalendarOpen && e.altKey && isArrowDownKey(e)) {
+            onRequestOpen?.();
+        }
+    }, [onKeyDown, isCalendarOpen, onRequestOpen, enterCommitRef, onEnterCommit, ignoreEnter]);
+    return (_jsx("input", { ref: ref, ...restProps, "date-range": side, onKeyDown: handleKeyDown, "aria-label": field?.ariaLabel, "aria-invalid": field ? hasParseError || field.errorKind !== undefined : rcPickerInvalid, "aria-describedby": field ? (field.errorKind === undefined ? field.hintId : field.errorId) : undefined }));
+});
+AccessibleFieldInput.displayName = "AccessibleFieldInput";

package/esm/DateFilter/PeriodRangePicker/PeriodRangePickerImpl.d.ts

@@ -1,5 +1,20 @@
-import { type Moment } from "moment";
+import { type PeriodRangeSide } from "./periodRangePickerAccessibility.js";
 import { type IPeriodRange, type IPeriodRangePickerProps, type PeriodRangePickerGranularity } from "./types.js";
+export declare const DATE_FNS_PICKER_FORMATS: {
+    readonly fieldDateFormat: "yyyy-MM-dd";
+    readonly fieldWeekFormat: "Y-ww";
+    readonly fieldMonthFormat: "yyyy-MM";
+    readonly fieldQuarterFormat: "yyyy-QQQ";
+    readonly fieldYearFormat: "yyyy";
+    readonly fieldDateTimeFormat: "yyyy-MM-dd HH:mm";
+    readonly fieldTimeFormat: "HH:mm";
+    readonly yearFormat: "yyyy";
+    readonly cellYearFormat: "yyyy";
+    readonly cellQuarterFormat: "QQQ";
+    readonly cellDateFormat: "d";
+    readonly dayFormat: "d";
+    readonly cellMeridiemFormat: "a";
+};
 /**
  * Resolves the picker's raw selected [start, end] into the exact day-level range this component reports.
  *
@@ -9,7 +24,12 @@ import { type IPeriodRange, type IPeriodRangePickerProps, type PeriodRangePicker
  * within the period" for either bound, so a start-of-unit anchor works as input either way. Day needs no expansion,
  * and `resolvePeriodBoundaries` handles it as a no-op period (start/end of day), so it's routed through uniformly.
  */
-export declare function resolveSelectedRange(granularity: PeriodRangePickerGranularity, start: Moment, end: Moment, weekStart: NonNullable<IPeriodRangePickerProps["weekStart"]>): IPeriodRange;
+export declare function resolveSelectedRange(granularity: PeriodRangePickerGranularity, start: Date, end: Date, weekStart: NonNullable<IPeriodRangePickerProps["weekStart"]>): IPeriodRange;
+/**
+ * Single-sided counterpart to {@link resolveSelectedRange}, used by the blur handler which commits
+ * one field at a time.
+ */
+export declare function resolveSelectedBoundary(granularity: PeriodRangePickerGranularity, date: Date, side: PeriodRangeSide, weekStart: NonNullable<IPeriodRangePickerProps["weekStart"]>): string;
 /**
  * A grid picker for selecting a Week/Month/Quarter/Year period range. Renders the rc-picker panel matching
  * {@link IPeriodRangePickerProps.granularity} and reports the resolved day-level range via `onRangeChange`.
@@ -18,5 +38,5 @@ export declare function resolveSelectedRange(granularity: PeriodRangePickerGranu
  * Loaded lazily by `PeriodRangePicker`, which is the public entry point - this module has to stay out of the
  * package's eager module graph, see the note in PeriodRangePicker.tsx. Import it directly only from tests.
  */
-export declare function PeriodRangePickerImpl({ granularity, range, onRangeChange, isMobile, weekStart, withoutApply, submitForm, }: IPeriodRangePickerProps): import("react/jsx-runtime").JSX.Element;
+export declare function PeriodRangePickerImpl({ granularity, range, onRangeChange, isMobile, weekStart, withoutApply, submitForm, dateFormat, customRangeHint, onValidityChange, }: IPeriodRangePickerProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=PeriodRangePickerImpl.d.ts.map

package/esm/DateFilter/PeriodRangePicker/PeriodRangePickerImpl.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PeriodRangePickerImpl.d.ts","sourceRoot":"","sources":["../../../src/DateFilter/PeriodRangePicker/PeriodRangePickerImpl.tsx"],"names":[],"mappings":"AA4BA,OAAe,EAAE,KAAK,MAAM,EAAE,MAAM,QAAQ,CAAC;AAU7C,OAAO,EACH,KAAK,YAAY,EACjB,KAAK,uBAAuB,EAC5B,KAAK,4BAA4B,EACpC,MAAM,YAAY,CAAC;AAsEpB;;;;;;;;GAQG;AACH,wBAAgB,oBAAoB,CAChC,WAAW,EAAE,4BAA4B,EACzC,KAAK,EAAE,MAAM,EACb,GAAG,EAAE,MAAM,EACX,SAAS,EAAE,WAAW,CAAC,uBAAuB,CAAC,WAAW,CAAC,CAAC,GAC7D,YAAY,CAOd;AAED;;;;;;;GAOG;AACH,wBAAgB,qBAAqB,CAAC,EAClC,WAAW,EACX,KAAK,EACL,aAAa,EACb,QAAQ,EACR,SAAoB,EACpB,YAAoB,EACpB,UAAU,GACb,EAAE,uBAAuB,2CAiEzB"}
+{"version":3,"file":"PeriodRangePickerImpl.d.ts","sourceRoot":"","sources":["../../../src/DateFilter/PeriodRangePicker/PeriodRangePickerImpl.tsx"],"names":[],"mappings":"AAgDA,OAAO,EAKH,KAAK,eAAe,EAGvB,MAAM,qCAAqC,CAAC;AAC7C,OAAO,EACH,KAAK,YAAY,EACjB,KAAK,uBAAuB,EAC5B,KAAK,4BAA4B,EACpC,MAAM,YAAY,CAAC;AAgBpB,eAAO,MAAM,uBAAuB;aAChC,eAAe,EAAE,YAAY;aAI7B,eAAe,EAAE,MAAM;aACvB,gBAAgB,EAAE,SAAS;aAC3B,kBAAkB,EAAE,UAAU;aAC9B,eAAe,EAAE,MAAM;aAEvB,mBAAmB,EAAE,kBAAkB;aACvC,eAAe,EAAE,OAAO;aACxB,UAAU,EAAE,MAAM;aAClB,cAAc,EAAE,MAAM;aACtB,iBAAiB,EAAE,KAAK;aACxB,cAAc,EAAE,GAAG;aACnB,SAAS,EAAE,GAAG;aACd,kBAAkB,EAAE,GAAG;CACjB,CAAC;AAkHX;;;;;;;;GAQG;AACH,wBAAgB,oBAAoB,CAChC,WAAW,EAAE,4BAA4B,EACzC,KAAK,EAAE,IAAI,EACX,GAAG,EAAE,IAAI,EACT,SAAS,EAAE,WAAW,CAAC,uBAAuB,CAAC,WAAW,CAAC,CAAC,GAC7D,YAAY,CAOd;AAED;;;GAGG;AACH,wBAAgB,uBAAuB,CACnC,WAAW,EAAE,4BAA4B,EACzC,IAAI,EAAE,IAAI,EACV,IAAI,EAAE,eAAe,EACrB,SAAS,EAAE,WAAW,CAAC,uBAAuB,CAAC,WAAW,CAAC,CAAC,GAC7D,MAAM,CAER;AAED;;;;;;;GAOG;AACH,wBAAgB,qBAAqB,CAAC,EAClC,WAAW,EACX,KAAK,EACL,aAAa,EACb,QAAQ,EACR,SAAoB,EACpB,YAAoB,EACpB,UAAU,EACV,UAAU,EACV,eAAe,EACf,gBAAgB,GACnB,EAAE,uBAAuB,2CAiXzB"}