npm - @dynatrace/strato-components - Versions diffs - 3.12.2 → 3.13.0 - Mend

@dynatrace/strato-components 3.12.2 → 3.13.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (3039) hide show

package/esm/filters/segment-selector/parts/selectionBar/ValueSelect.js.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../src/filters/segment-selector/parts/selectionBar/ValueSelect.tsx"],
-  "sourcesContent": ["import { useQuery } from '@tanstack/react-query';\nimport clsx from 'clsx';\nimport { isArray } from 'lodash-es';\nimport { useContext, useEffect, useMemo, useRef } from 'react';\nimport { FormattedMessage, useIntl } from 'react-intl';\n\nimport Colors from '@dynatrace/strato-design-tokens/colors';\nimport type { ResultRecord } from '@dynatrace-sdk/client-query';\nimport { useDql } from '@dynatrace-sdk/react-hooks';\nimport { getSegmentVariables } from '@dynatrace-sdk/segments-presets';\n\nimport * as styles from './SegmentSelect.sty.js';\nimport { StratoLoggerContext } from '../../../../core/sdk/StratoLoggerContext.js';\nimport { useFormFieldMessagesContext } from '../../../../forms/forms-core/hooks/useFormFieldMessagesContext.js';\nimport { FormFieldMessagesAction } from '../../../../forms/forms-core/state/formfield-messages-state-reducer.js';\nimport { Select } from '../../../../forms/select/Select.js';\nimport type { FormControlWithOverlayRef } from '../../../../forms/shared-types.js';\nimport { Grid } from '../../../../layouts/grid/Grid.js';\nimport { Link } from '../../../../typography/link/Link.js';\nimport { Text } from '../../../../typography/text/Text.js';\nimport { TextEllipsis } from '../../../../typography/text-ellipsis/TextEllipsis.js';\nimport {\n  segmentsClient,\n  type CachedSegment,\n} from '../../contexts/SegmentsCache/SegmentsCache.js';\nimport {\n  UISegmentsContext,\n  useSegmentsUIContext,\n} from '../../contexts/SegmentsUI/SegmentsUIContext.js';\nimport { SEGMENTSELECTOR_MESSAGES } from '../../segmentMessages.js';\nimport {\n  convertQueryRecordToStoreSegmentVariables,\n  getReadableValue,\n} from '../../utils.js';\nimport { getSegmentHref } from '../segmentManagementHref.js';\n\ntype ValueSelectProps = {\n  readOnly?: boolean;\n  segment: CachedSegment;\n  variables?: string[];\n  triggerClassName?: string;\n  unavailableVariables?: Set<string>;\n  'aria-describedby'?: string;\n};\n\n/**\n * ValueSelect component that allows the selection of variables of the segment.\n * Handles DQL-based segment variable loading, permission validation, and unavailable variable tracking.\n * @internal\n */\nexport const ValueSelect = (props: ValueSelectProps) => {\n  const {\n    triggerClassName,\n    readOnly,\n    segment,\n    variables = [],\n    unavailableVariables,\n    'aria-describedby': ariaDescribedBy,\n  } = props;\n  const variableSelectRef =\n    useRef<FormControlWithOverlayRef<HTMLDivElement>>(null);\n\n  const { focusedSegmentId, isTouched } = useContext(UISegmentsContext);\n  const { updateUISegment, setArrayIdentifierError, setUnavailableVariables } =\n    useSegmentsUIContext();\n  const { dispatch: messagesDispatch } = useFormFieldMessagesContext();\n  // Tracks whether unavailable variable hint was shown in this session\n  const hasSelectedUnavailableVariables = useRef(false);\n\n  const intl = useIntl();\n\n  const stratoLogger = useContext(StratoLoggerContext);\n\n  const segmentId = segment?.segment?.id;\n\n  const dtClientContext = useMemo(\n    () =>\n      JSON.stringify({\n        source: 'SegmentSelector',\n        package: '@dynatrace/strato-components',\n        segmentId,\n      }),\n    [segmentId],\n  );\n\n  /* Extract DQL query if segment uses query-based variables; empty string triggers no fetch */\n  const query =\n    segment?.segment?.variables !== undefined &&\n    segment?.segment?.variables?.type === 'query'\n      ? segment.segment.variables.value\n      : '';\n\n  const { data: faasResult, isLoading: isFaasLoading } = useQuery(\n    // excluded segment.segment.version: keying on it would refetch on every segment edit,\n    // not just ones that change the query; overlay-reopen invalidation covers the rest.\n    // eslint-disable-next-line @tanstack/query/exhaustive-deps\n    {\n      queryKey: ['getSegmentVariables', segment.segment.id, query],\n      queryFn: () =>\n        getSegmentVariables(segment.segment.id, segment.segment.version),\n    },\n    segmentsClient.queryClient,\n  );\n\n  const faasVariables =\n    faasResult !== null && faasResult !== undefined && 'variables' in faasResult\n      ? faasResult.variables\n      : undefined;\n\n  useEffect(() => {\n    if (\n      faasResult?.accessible === true &&\n      'error' in faasResult &&\n      faasResult.error\n    ) {\n      stratoLogger?.warn(\n        'getSegmentVariables FaaS returned an error response.',\n        faasResult.error,\n        { id: segmentId, code: faasResult.error.code },\n      );\n    }\n  }, [faasResult, segmentId, stratoLogger]);\n\n  const { data, isLoading: isDqlLoading } = useDql(\n    {\n      query,\n      maxResultRecords: 15_000,\n      maxResultBytes: 5_242_880, // 5 MB\n      dtClientContext,\n    },\n    {\n      enabled: faasResult?.accessible === false,\n      staleTime: 60 * 1000, // 1 minute\n    },\n  );\n\n  const effectiveRecords: ResultRecord[] | undefined =\n    faasVariables ?? data?.records;\n  const isLoading = isFaasLoading || isDqlLoading;\n\n  /* Log and display hint when query completes with no records (typically permission denied) */\n  useEffect(() => {\n    if (!isLoading && !effectiveRecords?.length) {\n      stratoLogger?.info(\n        'Failed to retrieve segment variables: query returned no records.',\n        {\n          query: query.split('|')[0], // log query until first pipe to avoid reporting sensitive data.\n          id: segmentId,\n        },\n      );\n\n      messagesDispatch?.({\n        type: FormFieldMessagesAction.ADDMESSAGE,\n        payload: {\n          variant: 'hint',\n          messageType: 'formcontrol',\n          id: 'no-records',\n          validityStateKey: 'customError',\n          message: <FormattedMessage {...SEGMENTSELECTOR_MESSAGES.noRecords} />,\n        },\n      });\n    }\n\n    // only update when the query changed and is not loading, to prevent multiple logs.\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [query, isLoading]);\n\n  /**\n   * Identifies variables that were previously selected but are no longer available.\n   * Returns three states:\n   * - undefined: query is still loading\n   * - Set with items: variables no longer in query results (permission lost or deleted)\n   * - Set empty: all variables available\n   */\n  const computedUnavailableVariables = useMemo(() => {\n    if (isLoading) {\n      return undefined;\n    }\n\n    if (effectiveRecords) {\n      const firstKey = Object.keys(effectiveRecords?.[0] ?? {})[0];\n      const dataRecordIds = new Set(\n        effectiveRecords.map((record) => record?.[firstKey]),\n      );\n      const unavailable = variables.filter(\n        (variable) => !dataRecordIds.has(variable),\n      );\n      return new Set([...unavailable, ...(unavailableVariables ?? [])]);\n    }\n\n    // DQL failed or forbidden \u2014 all initially-applied variables are unavailable\n    return new Set(variables);\n    // excluded variables as the selection doesn't change while open (avoids unexpected re-renders).\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [effectiveRecords, isLoading]);\n\n  /* Update parent state with unavailable variables once DQL settles; ref guards against duplicate dispatches */\n  useEffect(() => {\n    if (\n      !isLoading &&\n      computedUnavailableVariables &&\n      computedUnavailableVariables.size > 0\n    ) {\n      setUnavailableVariables(\n        segment.segment.id,\n        new Set([\n          ...computedUnavailableVariables,\n          ...(unavailableVariables ?? []),\n        ]),\n      );\n\n      // Show hint only once when unavailable variables are first detected (with data present)\n      if (!unavailableVariables && effectiveRecords) {\n        messagesDispatch?.({\n          type: FormFieldMessagesAction.ADDMESSAGE,\n          payload: {\n            variant: 'hint',\n            messageType: 'formcontrol',\n            id: 'unavailable-variables',\n            validityStateKey: 'customError',\n            message: (\n              <FormattedMessage\n                {...SEGMENTSELECTOR_MESSAGES.unavailableVariableValuesHint}\n              />\n            ),\n          },\n        });\n        hasSelectedUnavailableVariables.current = true;\n      }\n    }\n    // excluded propUnavailableVariables as it is derrived from the created state and might cause unnecessary re-renders. The state is only set once when the DQL settles, and then managed internally.\n    // excluded messagesDispatch from deps to avoid re-adding the hint when the parent component re-renders with a new prop value. The state is only set once when the DQL settles, and then managed internally.\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [isLoading, computedUnavailableVariables, segment.segment.id]);\n\n  /**\n   * Extracts all unique variable identifiers from DQL results and validates for unsupported array fields.\n   * Uses queueMicrotask to delay array error dispatch, ensuring state consistency before render.\n   */\n  const availableVariables = useMemo(() => {\n    if (effectiveRecords) {\n      let hasArrayIdentifier = false;\n      const recordsArray = effectiveRecords\n        .map((singleRow) => {\n          const firstKey = singleRow ? Object.keys(singleRow)[0] : null;\n\n          if (!singleRow || !firstKey) {\n            return null;\n          }\n\n          // Detect if query returns array-type fields (not supported for segment selection)\n          if (isArray(singleRow[firstKey])) {\n            hasArrayIdentifier = true;\n          }\n\n          return `${singleRow[firstKey]}`;\n        })\n        .filter((value) => value !== 'null' && value !== null);\n\n      /**\n       * Array field detection requires iterating over data; to avoid re-examining data,\n       * dispatch error via queueMicrotask after this render to maintain state consistency.\n       */\n      queueMicrotask(() => {\n        if (hasArrayIdentifier) {\n          messagesDispatch?.({\n            type: FormFieldMessagesAction.ADDMESSAGE,\n            payload: {\n              variant: 'error',\n              messageType: 'formcontrol',\n              id: 'array-identifier',\n              validityStateKey: 'customError',\n              message: (\n                <FormattedMessage\n                  {...SEGMENTSELECTOR_MESSAGES.arrayIdentifierError}\n                />\n              ),\n            },\n          });\n        }\n        setArrayIdentifierError(hasArrayIdentifier, segment.segment.id);\n      });\n\n      return Array.from(new Set(recordsArray));\n    }\n\n    return undefined;\n    // Excluded messagesDispatch and setArrayIdentifierError from deps to avoid rerenders due to unstable function references.\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [effectiveRecords, segment.segment.id]);\n\n  // Auto-open select dropdown when segment is focused and user is interacting\n  const shouldOpen =\n    focusedSegmentId === segment.segment.id &&\n    variables.length === 0 &&\n    isTouched;\n\n  useEffect(() => {\n    shouldOpen && variableSelectRef.current?.open();\n  }, [shouldOpen]);\n\n  // Validate select when touched state changes or selected variables change\n  useEffect(() => {\n    // initially\n    !isTouched && variableSelectRef.current?.validate();\n    // we need to validate the select when the variables change\n    // this needs to be properly resolved in the select component,\n    // as this one needs to validate controlled values automatically.\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [isTouched, JSON.stringify(variables)]);\n\n  return (\n    <Select\n      ref={variableSelectRef}\n      multiple\n      className={styles.variablesSelectCSS}\n      required\n      readOnly={readOnly || segment?.temporarilyApplied}\n      clearable={false}\n      value={variables}\n      onChange={(newVariables) => {\n        // Clear selection when user removes all variables\n        if (!newVariables || newVariables.length === 0) {\n          updateUISegment(\n            {\n              ...segment.segment,\n              variables: [],\n            },\n            {\n              ...segment.segment,\n              variables: [],\n            },\n          );\n          return;\n        }\n\n        if (!effectiveRecords || effectiveRecords.length === 0) {\n          return;\n        }\n\n        // Enrich selected variable IDs with full record containing all fields\n        const firstKey = Object.keys(effectiveRecords?.[0] ?? {})[0];\n        const dataEnrichedVariables = newVariables\n          .map((variable) => {\n            return (\n              effectiveRecords?.find((singleRow) => {\n                if (isArray(singleRow?.[firstKey])) {\n                  const values = singleRow?.[firstKey].includes(variable);\n                  return values;\n                }\n\n                return singleRow && singleRow[firstKey] === variable;\n              }) ?? null\n            );\n          })\n          .filter((value) => value !== null);\n\n        const segmentVariables = convertQueryRecordToStoreSegmentVariables(\n          dataEnrichedVariables,\n        );\n\n        if (segmentVariables) {\n          updateUISegment(\n            {\n              ...segment.segment,\n              variables: [],\n            },\n            {\n              ...segment.segment,\n              variables: segmentVariables,\n            },\n          );\n        }\n\n        if (\n          segmentVariables &&\n          computedUnavailableVariables &&\n          computedUnavailableVariables.size > 0 &&\n          hasSelectedUnavailableVariables.current\n        ) {\n          hasSelectedUnavailableVariables.current = false;\n          // Replace hint about unavailable variables during selection with summary after close\n          messagesDispatch?.({\n            type: FormFieldMessagesAction.REMOVEMESSAGE,\n            payload: {\n              id: 'unavailable-variables',\n              messageType: 'formcontrol',\n            },\n          });\n\n          messagesDispatch?.({\n            type: FormFieldMessagesAction.ADDMESSAGE,\n            payload: {\n              variant: 'hint',\n              messageType: 'formcontrol',\n              id: 'unavailable-variables',\n              validityStateKey: 'customError',\n              message: (\n                <FormattedMessage\n                  {...SEGMENTSELECTOR_MESSAGES.unavailableRemovedHint}\n                  values={{ count: computedUnavailableVariables?.size ?? 0 }}\n                />\n              ),\n            },\n          });\n        }\n      }}\n      aria-describedby={ariaDescribedBy}\n      data-dt-name=\"segment-variable-select\"\n      name={`segment-variable-select${segment.segment.id}`}\n    >\n      <Select.Trigger\n        className={clsx(styles.variablesSelectTriggerCSS, triggerClassName)}\n        placeholder={intl.formatMessage(\n          SEGMENTSELECTOR_MESSAGES.segmentsVariableTriggerPlaceholder,\n        )}\n      >\n        {variables?.length > 0 && (\n          <Select.DisplayValue>\n            <TextEllipsis>\n              {variables\n                .map((variable) => getReadableValue(variable, intl))\n                .join(', ')}\n            </TextEllipsis>\n          </Select.DisplayValue>\n        )}\n      </Select.Trigger>\n      <Select.Filter />\n      <Select.Content\n        loading={isLoading}\n        showSelectedOptionsFirst\n        width=\"trigger\"\n      >\n        {/** Show currently selected variables while DQL loads (prevents flicker) */}\n        {!effectiveRecords &&\n          variables?.map((variable) => (\n            <Select.Option\n              key={variable}\n              value={variable}\n              textValue={getReadableValue(variable, intl) ?? undefined}\n            >\n              {getReadableValue(variable, intl)}\n            </Select.Option>\n          ))}\n        {/** Always render unavailable variables as disabled options (shows user why selections are locked) */}\n        {Array.from(computedUnavailableVariables ?? []).map(\n          (unlistedVariable) => (\n            <Select.Option\n              key={unlistedVariable}\n              value={unlistedVariable}\n              textValue={getReadableValue(unlistedVariable, intl) ?? undefined}\n              aria-label={`${\n                getReadableValue(unlistedVariable, intl) ?? unlistedVariable\n              } ${intl.formatMessage(SEGMENTSELECTOR_MESSAGES.unavailable)}`}\n              disabled={true}\n            >\n              <Grid\n                gridTemplateColumns=\"auto auto\"\n                width=\"100%\"\n                alignItems=\"baseline\"\n              >\n                <Text>{getReadableValue(unlistedVariable, intl)}</Text>\n                <Text\n                  textStyle=\"small\"\n                  style={{\n                    color: Colors.Text.Neutral.Subdued,\n                    textAlign: 'right',\n                    textWrap: 'nowrap',\n                  }}\n                >\n                  {intl.formatMessage(SEGMENTSELECTOR_MESSAGES.unavailable)}\n                </Text>\n              </Grid>\n            </Select.Option>\n          ),\n        )}\n        {availableVariables?.map((variable) => (\n          <Select.Option\n            key={variable}\n            value={variable}\n            textValue={getReadableValue(variable, intl) ?? undefined}\n          >\n            {/** The option should wrap and not truncate, therefore, it is wrapped in a Text. */}{' '}\n            <Text>{getReadableValue(variable, intl)}</Text>\n          </Select.Option>\n        ))}\n        <Select.EmptyState>\n          {effectiveRecords?.length ? (\n            <FormattedMessage\n              id=\"nIw/xeiGNJsj+a+5\"\n              defaultMessage=\"No matching values for this segment found.\"\n              description=\"Hint shown when searching for a segment variable that isn't in the list.\"\n            />\n          ) : (\n            <FormattedMessage\n              defaultMessage=\"No values for this segment available. You can manage this segment in {link}.\"\n              id=\"72DlIwYKB9UTEzlA\"\n              description=\"Empty state message if no variables for the segment are available.\"\n              values={{\n                link: (\n                  <Link\n                    href={getSegmentHref(segment.segment.id)}\n                    target=\"_blank\"\n                    rel=\"noopener noreferrer\"\n                  >\n                    <FormattedMessage\n                      defaultMessage=\"settings\"\n                      id=\"u55UYpLvXi//xGEn\"\n                      description=\"Link text to segments app in empty state message if no variables for the segment are available.\"\n                    />\n                  </Link>\n                ),\n              }}\n            />\n          )}\n        </Select.EmptyState>\n      </Select.Content>\n    </Select>\n  );\n};\n"],
+  "sourcesContent": ["import { useQuery } from '@tanstack/react-query';\nimport clsx from 'clsx';\nimport { isArray } from 'lodash-es';\nimport { useContext, useEffect, useMemo, useRef } from 'react';\nimport { FormattedMessage, useIntl } from 'react-intl';\n\nimport Colors from '@dynatrace/strato-design-tokens/colors';\nimport type { ResultRecord } from '@dynatrace-sdk/client-query';\nimport { useDql } from '@dynatrace-sdk/react-hooks';\nimport { getSegmentVariables } from '@dynatrace-sdk/segments-presets';\n\nimport * as styles from './SegmentSelect.sty.js';\nimport { StratoLoggerContext } from '../../../../core/sdk/StratoLoggerContext.js';\nimport { useFormFieldMessagesContext } from '../../../../forms/forms-core/hooks/useFormFieldMessagesContext.js';\nimport { FormFieldMessagesAction } from '../../../../forms/forms-core/state/formfield-messages-state-reducer.js';\nimport { Select } from '../../../../forms/select/Select.js';\nimport type { FormControlWithOverlayRef } from '../../../../forms/shared-types.js';\nimport { Grid } from '../../../../layouts/grid/Grid.js';\nimport { Link } from '../../../../typography/link/Link.js';\nimport { Text } from '../../../../typography/text/Text.js';\nimport { TextEllipsis } from '../../../../typography/text-ellipsis/TextEllipsis.js';\nimport {\n  segmentsClient,\n  type CachedSegment,\n} from '../../contexts/SegmentsCache/SegmentsCache.js';\nimport {\n  UISegmentsContext,\n  useSegmentsUIContext,\n} from '../../contexts/SegmentsUI/SegmentsUIContext.js';\nimport { SEGMENTSELECTOR_MESSAGES } from '../../segmentMessages.js';\nimport {\n  convertQueryRecordToStoreSegmentVariables,\n  getReadableValue,\n} from '../../utils.js';\nimport { getSegmentHref } from '../segmentManagementHref.js';\n\ntype ValueSelectProps = {\n  readOnly?: boolean;\n  segment: CachedSegment;\n  variables?: string[];\n  triggerClassName?: string;\n  unavailableVariables?: Set<string>;\n  'aria-describedby'?: string;\n};\n\n/**\n * ValueSelect component that allows the selection of variables of the segment.\n * Handles DQL-based segment variable loading, permission validation, and unavailable variable tracking.\n * @internal\n */\nexport const ValueSelect = (props: ValueSelectProps) => {\n  const {\n    triggerClassName,\n    readOnly,\n    segment,\n    variables = [],\n    unavailableVariables,\n    'aria-describedby': ariaDescribedBy,\n  } = props;\n  const variableSelectRef =\n    useRef<FormControlWithOverlayRef<HTMLDivElement>>(null);\n\n  const { focusedSegmentId, isTouched } = useContext(UISegmentsContext);\n  const { updateUISegment, setArrayIdentifierError, setUnavailableVariables } =\n    useSegmentsUIContext();\n  const { dispatch: messagesDispatch } = useFormFieldMessagesContext();\n  // Tracks whether unavailable variable hint was shown in this session\n  const hasSelectedUnavailableVariables = useRef(false);\n\n  const intl = useIntl();\n\n  const stratoLogger = useContext(StratoLoggerContext);\n\n  const segmentId = segment?.segment?.id;\n\n  const dtClientContext = useMemo(\n    () =>\n      JSON.stringify({\n        source: 'SegmentSelector',\n        package: '@dynatrace/strato-components',\n        segmentId,\n      }),\n    [segmentId],\n  );\n\n  /* Extract DQL query if segment uses query-based variables; empty string triggers no fetch */\n  const query =\n    segment?.segment?.variables !== undefined &&\n    segment?.segment?.variables?.type === 'query'\n      ? segment.segment.variables.value\n      : '';\n\n  const { data: faasResult, isLoading: isFaasLoading } = useQuery(\n    // excluded segment.segment.version: keying on it would refetch on every segment edit,\n    // not just ones that change the query; overlay-reopen invalidation covers the rest.\n    // oxlint-disable-next-line @tanstack/query/exhaustive-deps\n    {\n      queryKey: ['getSegmentVariables', segment.segment.id, query],\n      queryFn: () =>\n        getSegmentVariables(segment.segment.id, segment.segment.version),\n    },\n    segmentsClient.queryClient,\n  );\n\n  const faasVariables =\n    faasResult !== null && faasResult !== undefined && 'variables' in faasResult\n      ? faasResult.variables\n      : undefined;\n\n  useEffect(() => {\n    if (\n      faasResult?.accessible === true &&\n      'error' in faasResult &&\n      faasResult.error\n    ) {\n      stratoLogger?.warn(\n        'getSegmentVariables FaaS returned an error response.',\n        faasResult.error,\n        { id: segmentId, code: faasResult.error.code },\n      );\n    }\n  }, [faasResult, segmentId, stratoLogger]);\n\n  const { data, isLoading: isDqlLoading } = useDql(\n    {\n      query,\n      maxResultRecords: 15_000,\n      maxResultBytes: 5_242_880, // 5 MB\n      dtClientContext,\n    },\n    {\n      enabled: faasResult?.accessible === false,\n      staleTime: 60 * 1000, // 1 minute\n    },\n  );\n\n  const effectiveRecords: ResultRecord[] | undefined =\n    faasVariables ?? data?.records;\n  const isLoading = isFaasLoading || isDqlLoading;\n\n  /* Log and display hint when query completes with no records (typically permission denied) */\n  useEffect(() => {\n    if (!isLoading && !effectiveRecords?.length) {\n      stratoLogger?.info(\n        'Failed to retrieve segment variables: query returned no records.',\n        {\n          query: query.split('|')[0], // log query until first pipe to avoid reporting sensitive data.\n          id: segmentId,\n        },\n      );\n\n      messagesDispatch?.({\n        type: FormFieldMessagesAction.ADDMESSAGE,\n        payload: {\n          variant: 'hint',\n          messageType: 'formcontrol',\n          id: 'no-records',\n          validityStateKey: 'customError',\n          message: <FormattedMessage {...SEGMENTSELECTOR_MESSAGES.noRecords} />,\n        },\n      });\n    }\n\n    // only update when the query changed and is not loading, to prevent multiple logs.\n    // oxlint-disable-next-line react-hooks/exhaustive-deps\n  }, [query, isLoading]);\n\n  /**\n   * Identifies variables that were previously selected but are no longer available.\n   * Returns three states:\n   * - undefined: query is still loading\n   * - Set with items: variables no longer in query results (permission lost or deleted)\n   * - Set empty: all variables available\n   */\n  const computedUnavailableVariables = useMemo(() => {\n    if (isLoading) {\n      return undefined;\n    }\n\n    if (effectiveRecords) {\n      const firstKey = Object.keys(effectiveRecords?.[0] ?? {})[0];\n      const dataRecordIds = new Set(\n        effectiveRecords.map((record) => record?.[firstKey]),\n      );\n      const unavailable = variables.filter(\n        (variable) => !dataRecordIds.has(variable),\n      );\n      return new Set([...unavailable, ...(unavailableVariables ?? [])]);\n    }\n\n    // DQL failed or forbidden \u2014 all initially-applied variables are unavailable\n    return new Set(variables);\n    // excluded variables as the selection doesn't change while open (avoids unexpected re-renders).\n    // oxlint-disable-next-line react-hooks/exhaustive-deps\n  }, [effectiveRecords, isLoading]);\n\n  /* Update parent state with unavailable variables once DQL settles; ref guards against duplicate dispatches */\n  useEffect(() => {\n    if (\n      !isLoading &&\n      computedUnavailableVariables &&\n      computedUnavailableVariables.size > 0\n    ) {\n      setUnavailableVariables(\n        segment.segment.id,\n        new Set([\n          ...computedUnavailableVariables,\n          ...(unavailableVariables ?? []),\n        ]),\n      );\n\n      // Show hint only once when unavailable variables are first detected (with data present)\n      if (!unavailableVariables && effectiveRecords) {\n        messagesDispatch?.({\n          type: FormFieldMessagesAction.ADDMESSAGE,\n          payload: {\n            variant: 'hint',\n            messageType: 'formcontrol',\n            id: 'unavailable-variables',\n            validityStateKey: 'customError',\n            message: (\n              <FormattedMessage\n                {...SEGMENTSELECTOR_MESSAGES.unavailableVariableValuesHint}\n              />\n            ),\n          },\n        });\n        hasSelectedUnavailableVariables.current = true;\n      }\n    }\n    // excluded propUnavailableVariables as it is derrived from the created state and might cause unnecessary re-renders. The state is only set once when the DQL settles, and then managed internally.\n    // excluded messagesDispatch from deps to avoid re-adding the hint when the parent component re-renders with a new prop value. The state is only set once when the DQL settles, and then managed internally.\n    // oxlint-disable-next-line react-hooks/exhaustive-deps\n  }, [isLoading, computedUnavailableVariables, segment.segment.id]);\n\n  /**\n   * Extracts all unique variable identifiers from DQL results and validates for unsupported array fields.\n   * Uses queueMicrotask to delay array error dispatch, ensuring state consistency before render.\n   */\n  const availableVariables = useMemo(() => {\n    if (effectiveRecords) {\n      let hasArrayIdentifier = false;\n      const recordsArray = effectiveRecords\n        .map((singleRow) => {\n          const firstKey = singleRow ? Object.keys(singleRow)[0] : null;\n\n          if (!singleRow || !firstKey) {\n            return null;\n          }\n\n          // Detect if query returns array-type fields (not supported for segment selection)\n          if (isArray(singleRow[firstKey])) {\n            hasArrayIdentifier = true;\n          }\n\n          return `${singleRow[firstKey]}`;\n        })\n        .filter((value) => value !== 'null' && value !== null);\n\n      /**\n       * Array field detection requires iterating over data; to avoid re-examining data,\n       * dispatch error via queueMicrotask after this render to maintain state consistency.\n       */\n      queueMicrotask(() => {\n        if (hasArrayIdentifier) {\n          messagesDispatch?.({\n            type: FormFieldMessagesAction.ADDMESSAGE,\n            payload: {\n              variant: 'error',\n              messageType: 'formcontrol',\n              id: 'array-identifier',\n              validityStateKey: 'customError',\n              message: (\n                <FormattedMessage\n                  {...SEGMENTSELECTOR_MESSAGES.arrayIdentifierError}\n                />\n              ),\n            },\n          });\n        }\n        setArrayIdentifierError(hasArrayIdentifier, segment.segment.id);\n      });\n\n      return Array.from(new Set(recordsArray));\n    }\n\n    return undefined;\n    // Excluded messagesDispatch and setArrayIdentifierError from deps to avoid rerenders due to unstable function references.\n    // oxlint-disable-next-line react-hooks/exhaustive-deps\n  }, [effectiveRecords, segment.segment.id]);\n\n  // Auto-open select dropdown when segment is focused and user is interacting\n  const shouldOpen =\n    focusedSegmentId === segment.segment.id &&\n    variables.length === 0 &&\n    isTouched;\n\n  useEffect(() => {\n    shouldOpen && variableSelectRef.current?.open();\n  }, [shouldOpen]);\n\n  // Validate select when touched state changes or selected variables change\n  useEffect(() => {\n    // initially\n    !isTouched && variableSelectRef.current?.validate();\n    // we need to validate the select when the variables change\n    // this needs to be properly resolved in the select component,\n    // as this one needs to validate controlled values automatically.\n    // oxlint-disable-next-line react-hooks/exhaustive-deps\n  }, [isTouched, JSON.stringify(variables)]);\n\n  return (\n    <Select\n      ref={variableSelectRef}\n      multiple\n      className={styles.variablesSelectCSS}\n      required\n      readOnly={readOnly || segment?.temporarilyApplied}\n      clearable={false}\n      value={variables}\n      onChange={(newVariables) => {\n        // Clear selection when user removes all variables\n        if (!newVariables || newVariables.length === 0) {\n          updateUISegment(\n            {\n              ...segment.segment,\n              variables: [],\n            },\n            {\n              ...segment.segment,\n              variables: [],\n            },\n          );\n          return;\n        }\n\n        if (!effectiveRecords || effectiveRecords.length === 0) {\n          return;\n        }\n\n        // Enrich selected variable IDs with full record containing all fields\n        const firstKey = Object.keys(effectiveRecords?.[0] ?? {})[0];\n        const dataEnrichedVariables = newVariables\n          .map((variable) => {\n            return (\n              effectiveRecords?.find((singleRow) => {\n                if (isArray(singleRow?.[firstKey])) {\n                  const values = singleRow?.[firstKey].includes(variable);\n                  return values;\n                }\n\n                return singleRow && singleRow[firstKey] === variable;\n              }) ?? null\n            );\n          })\n          .filter((value) => value !== null);\n\n        const segmentVariables = convertQueryRecordToStoreSegmentVariables(\n          dataEnrichedVariables,\n        );\n\n        if (segmentVariables) {\n          updateUISegment(\n            {\n              ...segment.segment,\n              variables: [],\n            },\n            {\n              ...segment.segment,\n              variables: segmentVariables,\n            },\n          );\n        }\n\n        if (\n          segmentVariables &&\n          computedUnavailableVariables &&\n          computedUnavailableVariables.size > 0 &&\n          hasSelectedUnavailableVariables.current\n        ) {\n          hasSelectedUnavailableVariables.current = false;\n          // Replace hint about unavailable variables during selection with summary after close\n          messagesDispatch?.({\n            type: FormFieldMessagesAction.REMOVEMESSAGE,\n            payload: {\n              id: 'unavailable-variables',\n              messageType: 'formcontrol',\n            },\n          });\n\n          messagesDispatch?.({\n            type: FormFieldMessagesAction.ADDMESSAGE,\n            payload: {\n              variant: 'hint',\n              messageType: 'formcontrol',\n              id: 'unavailable-variables',\n              validityStateKey: 'customError',\n              message: (\n                <FormattedMessage\n                  {...SEGMENTSELECTOR_MESSAGES.unavailableRemovedHint}\n                  values={{ count: computedUnavailableVariables?.size ?? 0 }}\n                />\n              ),\n            },\n          });\n        }\n      }}\n      aria-describedby={ariaDescribedBy}\n      data-dt-name=\"segment-variable-select\"\n      name={`segment-variable-select${segment.segment.id}`}\n    >\n      <Select.Trigger\n        className={clsx(styles.variablesSelectTriggerCSS, triggerClassName)}\n        placeholder={intl.formatMessage(\n          SEGMENTSELECTOR_MESSAGES.segmentsVariableTriggerPlaceholder,\n        )}\n      >\n        {variables?.length > 0 && (\n          <Select.DisplayValue>\n            <TextEllipsis>\n              {variables\n                .map((variable) => getReadableValue(variable, intl))\n                .join(', ')}\n            </TextEllipsis>\n          </Select.DisplayValue>\n        )}\n      </Select.Trigger>\n      <Select.Filter />\n      <Select.Content\n        loading={isLoading}\n        showSelectedOptionsFirst\n        width=\"trigger\"\n      >\n        {/** Show currently selected variables while DQL loads (prevents flicker) */}\n        {!effectiveRecords &&\n          variables?.map((variable) => (\n            <Select.Option\n              key={variable}\n              value={variable}\n              textValue={getReadableValue(variable, intl) ?? undefined}\n            >\n              {getReadableValue(variable, intl)}\n            </Select.Option>\n          ))}\n        {/** Always render unavailable variables as disabled options (shows user why selections are locked) */}\n        {Array.from(computedUnavailableVariables ?? []).map(\n          (unlistedVariable) => (\n            <Select.Option\n              key={unlistedVariable}\n              value={unlistedVariable}\n              textValue={getReadableValue(unlistedVariable, intl) ?? undefined}\n              aria-label={`${\n                getReadableValue(unlistedVariable, intl) ?? unlistedVariable\n              } ${intl.formatMessage(SEGMENTSELECTOR_MESSAGES.unavailable)}`}\n              disabled={true}\n            >\n              <Grid\n                gridTemplateColumns=\"auto auto\"\n                width=\"100%\"\n                alignItems=\"baseline\"\n              >\n                <Text>{getReadableValue(unlistedVariable, intl)}</Text>\n                <Text\n                  textStyle=\"small\"\n                  style={{\n                    color: Colors.Text.Neutral.Subdued,\n                    textAlign: 'right',\n                    textWrap: 'nowrap',\n                  }}\n                >\n                  {intl.formatMessage(SEGMENTSELECTOR_MESSAGES.unavailable)}\n                </Text>\n              </Grid>\n            </Select.Option>\n          ),\n        )}\n        {availableVariables?.map((variable) => (\n          <Select.Option\n            key={variable}\n            value={variable}\n            textValue={getReadableValue(variable, intl) ?? undefined}\n          >\n            {/** The option should wrap and not truncate, therefore, it is wrapped in a Text. */}{' '}\n            <Text>{getReadableValue(variable, intl)}</Text>\n          </Select.Option>\n        ))}\n        <Select.EmptyState>\n          {effectiveRecords?.length ? (\n            <FormattedMessage\n              id=\"nIw/xeiGNJsj+a+5\"\n              defaultMessage=\"No matching values for this segment found.\"\n              description=\"Hint shown when searching for a segment variable that isn't in the list.\"\n            />\n          ) : (\n            <FormattedMessage\n              defaultMessage=\"No values for this segment available. You can manage this segment in {link}.\"\n              id=\"72DlIwYKB9UTEzlA\"\n              description=\"Empty state message if no variables for the segment are available.\"\n              values={{\n                link: (\n                  <Link\n                    href={getSegmentHref(segment.segment.id)}\n                    target=\"_blank\"\n                    rel=\"noopener noreferrer\"\n                  >\n                    <FormattedMessage\n                      defaultMessage=\"settings\"\n                      id=\"u55UYpLvXi//xGEn\"\n                      description=\"Link text to segments app in empty state message if no variables for the segment are available.\"\n                    />\n                  </Link>\n                ),\n              }}\n            />\n          )}\n        </Select.EmptyState>\n      </Select.Content>\n    </Select>\n  );\n};\n"],
   "mappings": "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",
   "names": []
 }

package/esm/filters/timeframe-selector/TimeframeSelector.css CHANGED Viewed

@@ -1,8 +1,8 @@
-._1sqhmjg0-3-12-2 {
+._1sqhmjg0-3-13-0 {
   min-width: 0;
   box-sizing: border-box;
 }
-._1sqhmjg1-3-12-2 {
+._1sqhmjg1-3-13-0 {
   display: inline-flex;
   align-self: start;
 }

package/esm/filters/timeframe-selector/TimeframeSelector.js CHANGED Viewed

@@ -77,7 +77,7 @@ function useSyncPropsAndState(store, memoedValue, isControlled, precision, forma
       });
     },
     // timeframeSelectorRef and debouncedOnChangeRef are stable refs — no need to include in deps
-    // eslint-disable-next-line react-hooks/exhaustive-deps
+    // oxlint-disable-next-line react-hooks/exhaustive-deps
     [
       formFieldMessagesDispatch,
       formatString,
@@ -115,9 +115,9 @@ const _TimeframeSelector = forwardRef(
     readOnly: propReadOnly,
     id: propId,
     "aria-disabled": propAriaDisabled,
-    // eslint-disable-next-line @typescript-eslint/no-deprecated -- APPDEV-18321
+    // oxlint-disable-next-line typescript/no-deprecated -- APPDEV-18321
     controlState,
-    // eslint-disable-next-line @typescript-eslint/no-deprecated -- APPDEV-18321
+    // oxlint-disable-next-line typescript/no-deprecated -- APPDEV-18321
     precision = "minutes",
     ...remainingProps
   }, forwardedRef) => {
@@ -130,7 +130,7 @@ const _TimeframeSelector = forwardRef(
     const memoedDefaultValue = useMemo(
       () => mapToPartialTimeframe(propDefaultValue, precision),
       /** We're ignoring updates to defaultValue as it only considers the initial state. */
-      // eslint-disable-next-line react-hooks/exhaustive-deps
+      // oxlint-disable-next-line react-hooks/exhaustive-deps
       []
     );
     const { min, max } = useMinMax(propMin, propMax);

package/esm/filters/timeframe-selector/TimeframeSelector.js.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/filters/timeframe-selector/TimeframeSelector.tsx"],
-  "sourcesContent": ["import { debounce } from 'lodash-es';\nimport {\n  type Dispatch,\n  type RefObject,\n  forwardRef,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport type { StoreApi } from 'zustand';\n\nimport { PresetItem } from './components/presets/PresetItem.js';\nimport { Presets } from './components/presets/Presets.js';\nimport { CustomTrigger } from './components/trigger/CustomTrigger.js';\nimport { DisplayValue } from './components/trigger/DisplayValue.js';\nimport { Trigger } from './components/trigger/Trigger.js';\nimport { TIMEFRAMESELECTOR_ERROR_MESSAGES } from './constants/timeframeSelectorMessages.js';\nimport type { TimeframeSelectorProps } from './TimeframeSelector.types.js';\nimport { TimeframeSelectorRoot } from './TimeframeSelectorRoot.js';\nimport { saveRecentTimeframe } from './utils/presets-helpers.js';\nimport { useCallbackRef } from '../../core/hooks/useCallbackRef.js';\nimport { useMergeRefs } from '../../core/hooks/useMergeRefs.js';\nimport type { Precision } from '../../core/time/shared.types.js';\nimport { getTimeframeSelectorActions } from '../../core/time/timeframeStore/actions/timeframeSelector.js';\nimport { createTimeframeStore } from '../../core/time/timeframeStore/createTimeframeStore.js';\nimport type {\n  TimeframeSelectorState,\n  TimeframeSelectorStoreActions,\n} from '../../core/time/timeframeStore/timeframeSelector.types.js';\nimport { TimeframeSelectorStoreProvider } from '../../core/time/timeframeStore/timeframeStoreProvider.js';\nimport { useDateTimeMessages } from '../../core/time/useDateTimeMessages.js';\nimport { useMinMax, useMinMaxStoreSync } from '../../core/time/useMinMax.js';\nimport { validate } from '../../core/time/validation.js';\nimport { type Timeframe, type TimeValue } from '../../core/types/time.js';\nimport { getTimeOffsetFromInitialValue } from '../../forms/calendar/utils/helpers.js';\nimport type {\n  DateTimeInputRef,\n  DateTimeRangePickerRef,\n} from '../../forms/date-time-range-picker/types.js';\nimport { useFormControl } from '../../forms/forms-core/hooks/useFormControl.js';\nimport type { FormFieldMessagesReducerAction } from '../../forms/forms-core/state/formfield-messages-state-reducer.js';\nimport {\n  GRAIL_MAX_DATE,\n  GRAIL_MIN_DATE,\n} from '../../forms/forms-core/time/date-time.js';\nimport {\n  removePrecisionFromTimeFrame,\n  mapToPartialTimeframe,\n} from '../../forms/forms-core/time/timeParser.js';\nimport type {\n  FormControlRef,\n  TimeRangePickerRef,\n} from '../../forms/shared-types.js';\n\nconst STEPPER_DEBOUNCE_MS = 300;\n\ntype TimeframeSelectorStore = StoreApi<\n  TimeframeSelectorState & TimeframeSelectorStoreActions\n>;\n\n/**\n * Extracts the prop-to-store syncing effects into a dedicated hook so the\n * component body stays focused on wiring rather than implementation details.\n *\n * According to the zustand maintainer, the recommended way to keep a zustand\n * store in sync with React props is via useEffect.\n * see https://github.com/pmndrs/zustand/discussions/1390#discussion-4505803\n */\nfunction useSyncPropsAndState(\n  store: TimeframeSelectorStore,\n  memoedValue:\n    | { from: TimeValue | null; to: TimeValue | null }\n    | null\n    | undefined,\n  isControlled: boolean,\n  precision: Exclude<Precision, 'day'>,\n  formatString: string | undefined,\n  required: boolean | undefined,\n  formFieldMessagesDispatch:\n    | Dispatch<FormFieldMessagesReducerAction>\n    | undefined,\n  timeframeSelectorRef: RefObject<TimeRangePickerRef | null>,\n  debouncedOnChangeRef: RefObject<ReturnType<typeof debounce>>,\n) {\n  // Sync the controlled value into the store whenever it changes.\n  useEffect(\n    () => {\n      isControlled &&\n        store.setState((state) => {\n          debouncedOnChangeRef?.current?.cancel();\n          const error = validate(memoedValue ?? null, state.min, state.max, {\n            formMessageDispatch: formFieldMessagesDispatch,\n            showError: false,\n            checkOrder: true,\n            ref: timeframeSelectorRef,\n            expectedFormat: formatString,\n            valueMode: 'timeframeSelector',\n            required,\n            errorMessages: TIMEFRAMESELECTOR_ERROR_MESSAGES,\n            formerError: state.timeframeSelectorError,\n          });\n\n          const value = removePrecisionFromTimeFrame(\n            memoedValue,\n            state.precision,\n          );\n          const timeOffset = getTimeOffsetFromInitialValue(\n            value,\n            'range',\n            state.min,\n            state.max,\n            precision,\n          );\n\n          return {\n            ...state,\n            timeframeSelectorTimeframe: value,\n            calendarValue: value,\n            dateTimeRangePickerTimeframe: value,\n            referenceTimeframe: null,\n            timeframeSelectorError: error,\n            calendarError: error,\n            dateTimeRangePickerError: error,\n            timeOffset,\n            required,\n          };\n        });\n    },\n    // timeframeSelectorRef and debouncedOnChangeRef are stable refs \u2014 no need to include in deps\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    [\n      formFieldMessagesDispatch,\n      formatString,\n      isControlled,\n      memoedValue,\n      precision,\n      required,\n      store,\n    ],\n  );\n\n  // Sync precision and formatString into the store whenever they change.\n  useEffect(() => {\n    store.setState((state) => {\n      const preciseValue = isControlled\n        ? memoedValue\n        : state.timeframeSelectorTimeframe;\n      const value = removePrecisionFromTimeFrame(preciseValue, precision);\n\n      return {\n        ...state,\n        precision,\n        formatString,\n        timeframeSelectorTimeframe: value,\n        calendarValue: value,\n        dateTimeRangePickerTimeframe: value,\n      };\n    });\n  }, [precision, formatString, store, isControlled, memoedValue]);\n}\n\nconst _TimeframeSelector = forwardRef<\n  TimeRangePickerRef,\n  TimeframeSelectorProps\n>(\n  (\n    {\n      value: propValue,\n      defaultValue: propDefaultValue,\n      onChange,\n      min: propMin = GRAIL_MIN_DATE,\n      max: propMax = GRAIL_MAX_DATE,\n      disabled: propDisabled,\n      required: propRequired,\n      readOnly: propReadOnly,\n      id: propId,\n      'aria-disabled': propAriaDisabled,\n      // eslint-disable-next-line @typescript-eslint/no-deprecated -- APPDEV-18321\n      controlState,\n      // eslint-disable-next-line @typescript-eslint/no-deprecated -- APPDEV-18321\n      precision = 'minutes',\n      ...remainingProps\n    },\n    forwardedRef,\n  ) => {\n    const [isControlled] = useState(propValue !== undefined);\n    const onChangeProp = useCallbackRef(onChange);\n\n    const memoedValue = useMemo(\n      () => mapToPartialTimeframe(propValue, precision),\n      [precision, propValue],\n    );\n    const memoedDefaultValue = useMemo(\n      () => mapToPartialTimeframe(propDefaultValue, precision),\n      /** We're ignoring updates to defaultValue as it only considers the initial state. */\n      // eslint-disable-next-line react-hooks/exhaustive-deps\n      [],\n    );\n\n    // Keep min and max updated at midnight\n    const { min, max } = useMinMax(propMin, propMax);\n\n    const calendarRef = useRef<\n      | FormControlRef<HTMLDivElement>\n      | (Omit<FormControlRef<HTMLDivElement>, 'inputRef'> &\n          Pick<TimeRangePickerRef<HTMLDivElement>, 'inputRef'>)\n    >(null);\n    const dateTimeFromRef = useRef<DateTimeInputRef>(null);\n    const dateTimeRangePickerRef = useRef<DateTimeRangePickerRef>(null);\n    const timeframeSelectorRef = useRef<TimeRangePickerRef>(null);\n\n    const { formatString } = useDateTimeMessages({ precision });\n    const formControl = useFormControl({\n      propDisabled,\n      propRequired,\n      propId,\n      propAriaDisabled,\n      propReadOnly,\n      controlState,\n    });\n    const { required, messageDispatch: formFieldMessagesDispatch } =\n      formControl;\n\n    const debouncedOnChangeRef = useRef(\n      debounce((timeframe: Timeframe | null) => {\n        onChangeProp?.(timeframe);\n        if (timeframe) {\n          saveRecentTimeframe(timeframe);\n        }\n      }, STEPPER_DEBOUNCE_MS),\n    );\n\n    // Cancel the debounced call on unmount.\n    useEffect(() => {\n      const debouncedOnChange = debouncedOnChangeRef.current;\n      return () => debouncedOnChange.cancel();\n    }, []);\n\n    const [initialState] = useState<TimeframeSelectorState>(() => {\n      const value = isControlled ? memoedValue : memoedDefaultValue;\n\n      const error = validate(value, min, max, {\n        formMessageDispatch: formFieldMessagesDispatch,\n        precision,\n        showError: false,\n        checkOrder: true,\n        ref: timeframeSelectorRef,\n        expectedFormat: formatString,\n        valueMode: 'timeframeSelector',\n        required,\n        errorMessages: TIMEFRAMESELECTOR_ERROR_MESSAGES,\n      });\n      const timeOffset = getTimeOffsetFromInitialValue(\n        value,\n        'range',\n        min,\n        max,\n        precision,\n      );\n\n      return {\n        calendarValue: value,\n        dateTimeRangePickerTimeframe: value,\n        timeframeSelectorTimeframe: value,\n        referenceTimeframe: null,\n        min,\n        max,\n        precision,\n        isFullDay: false,\n        calendarRef,\n        dateTimeFromRef,\n        dateTimeRangePickerRef,\n        timeframeSelectorRef,\n        required,\n        timeframeSelectorError: error,\n        calendarError: error,\n        dateTimeRangePickerError: error,\n        previousTimeframe: null,\n        timeOffset,\n        formatString,\n      };\n    });\n\n    const [store] = useState(() =>\n      createTimeframeStore<\n        TimeframeSelectorState,\n        TimeframeSelectorStoreActions\n      >(\n        initialState,\n        getTimeframeSelectorActions(\n          isControlled,\n          timeframeSelectorRef,\n          formFieldMessagesDispatch,\n          onChangeProp,\n          debouncedOnChangeRef,\n          TIMEFRAMESELECTOR_ERROR_MESSAGES,\n        ),\n      ),\n    );\n\n    useSyncPropsAndState(\n      store,\n      memoedValue,\n      isControlled,\n      precision,\n      formatString,\n      required,\n      formFieldMessagesDispatch,\n      timeframeSelectorRef,\n      debouncedOnChangeRef,\n    );\n\n    // Keep min and max updated at midnight\n    useMinMaxStoreSync(\n      store,\n      min,\n      max,\n      useCallback(\n        (\n          state: TimeframeSelectorState,\n          min: TimeValue | null,\n          max: TimeValue | null,\n        ) => {\n          const error = validate(state.timeframeSelectorTimeframe, min, max, {\n            formMessageDispatch: formFieldMessagesDispatch,\n            formerError: state.timeframeSelectorError,\n            precision: state.precision,\n            showError: false,\n            checkOrder: true,\n            ref: timeframeSelectorRef,\n            expectedFormat: state.formatString,\n            valueMode: 'timeframeSelector',\n            required: state.required,\n            errorMessages: TIMEFRAMESELECTOR_ERROR_MESSAGES,\n          });\n          return {\n            timeframeSelectorError: error,\n            calendarError: error,\n            dateTimeRangePickerError: error,\n          };\n        },\n        [formFieldMessagesDispatch],\n      ),\n    );\n\n    const mergedRef = useMergeRefs<TimeRangePickerRef>([\n      timeframeSelectorRef,\n      forwardedRef,\n    ]);\n\n    return (\n      <TimeframeSelectorStoreProvider store={store}>\n        <TimeframeSelectorRoot\n          {...remainingProps}\n          formControl={formControl}\n          ref={mergedRef}\n        />\n      </TimeframeSelectorStoreProvider>\n    );\n  },\n);\n\n(\n  _TimeframeSelector as typeof _TimeframeSelector & { displayName: string }\n).displayName = 'TimeframeSelector';\n\n/**\n * Use the `TimeframeSelector` to let users filter data by time, choosing from preset timeframes or entering a custom start and end time.\n * @public\n */\nexport const TimeframeSelector = Object.assign(_TimeframeSelector, {\n  Trigger,\n  DisplayValue,\n  CustomTrigger,\n  Presets,\n  PresetItem,\n});\n"],
+  "sourcesContent": ["import { debounce } from 'lodash-es';\nimport {\n  type Dispatch,\n  type RefObject,\n  forwardRef,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport type { StoreApi } from 'zustand';\n\nimport { PresetItem } from './components/presets/PresetItem.js';\nimport { Presets } from './components/presets/Presets.js';\nimport { CustomTrigger } from './components/trigger/CustomTrigger.js';\nimport { DisplayValue } from './components/trigger/DisplayValue.js';\nimport { Trigger } from './components/trigger/Trigger.js';\nimport { TIMEFRAMESELECTOR_ERROR_MESSAGES } from './constants/timeframeSelectorMessages.js';\nimport type { TimeframeSelectorProps } from './TimeframeSelector.types.js';\nimport { TimeframeSelectorRoot } from './TimeframeSelectorRoot.js';\nimport { saveRecentTimeframe } from './utils/presets-helpers.js';\nimport { useCallbackRef } from '../../core/hooks/useCallbackRef.js';\nimport { useMergeRefs } from '../../core/hooks/useMergeRefs.js';\nimport type { Precision } from '../../core/time/shared.types.js';\nimport { getTimeframeSelectorActions } from '../../core/time/timeframeStore/actions/timeframeSelector.js';\nimport { createTimeframeStore } from '../../core/time/timeframeStore/createTimeframeStore.js';\nimport type {\n  TimeframeSelectorState,\n  TimeframeSelectorStoreActions,\n} from '../../core/time/timeframeStore/timeframeSelector.types.js';\nimport { TimeframeSelectorStoreProvider } from '../../core/time/timeframeStore/timeframeStoreProvider.js';\nimport { useDateTimeMessages } from '../../core/time/useDateTimeMessages.js';\nimport { useMinMax, useMinMaxStoreSync } from '../../core/time/useMinMax.js';\nimport { validate } from '../../core/time/validation.js';\nimport { type Timeframe, type TimeValue } from '../../core/types/time.js';\nimport { getTimeOffsetFromInitialValue } from '../../forms/calendar/utils/helpers.js';\nimport type {\n  DateTimeInputRef,\n  DateTimeRangePickerRef,\n} from '../../forms/date-time-range-picker/types.js';\nimport { useFormControl } from '../../forms/forms-core/hooks/useFormControl.js';\nimport type { FormFieldMessagesReducerAction } from '../../forms/forms-core/state/formfield-messages-state-reducer.js';\nimport {\n  GRAIL_MAX_DATE,\n  GRAIL_MIN_DATE,\n} from '../../forms/forms-core/time/date-time.js';\nimport {\n  removePrecisionFromTimeFrame,\n  mapToPartialTimeframe,\n} from '../../forms/forms-core/time/timeParser.js';\nimport type {\n  FormControlRef,\n  TimeRangePickerRef,\n} from '../../forms/shared-types.js';\n\nconst STEPPER_DEBOUNCE_MS = 300;\n\ntype TimeframeSelectorStore = StoreApi<\n  TimeframeSelectorState & TimeframeSelectorStoreActions\n>;\n\n/**\n * Extracts the prop-to-store syncing effects into a dedicated hook so the\n * component body stays focused on wiring rather than implementation details.\n *\n * According to the zustand maintainer, the recommended way to keep a zustand\n * store in sync with React props is via useEffect.\n * see https://github.com/pmndrs/zustand/discussions/1390#discussion-4505803\n */\nfunction useSyncPropsAndState(\n  store: TimeframeSelectorStore,\n  memoedValue:\n    | { from: TimeValue | null; to: TimeValue | null }\n    | null\n    | undefined,\n  isControlled: boolean,\n  precision: Exclude<Precision, 'day'>,\n  formatString: string | undefined,\n  required: boolean | undefined,\n  formFieldMessagesDispatch:\n    | Dispatch<FormFieldMessagesReducerAction>\n    | undefined,\n  timeframeSelectorRef: RefObject<TimeRangePickerRef | null>,\n  debouncedOnChangeRef: RefObject<ReturnType<typeof debounce>>,\n) {\n  // Sync the controlled value into the store whenever it changes.\n  useEffect(\n    () => {\n      isControlled &&\n        store.setState((state) => {\n          debouncedOnChangeRef?.current?.cancel();\n          const error = validate(memoedValue ?? null, state.min, state.max, {\n            formMessageDispatch: formFieldMessagesDispatch,\n            showError: false,\n            checkOrder: true,\n            ref: timeframeSelectorRef,\n            expectedFormat: formatString,\n            valueMode: 'timeframeSelector',\n            required,\n            errorMessages: TIMEFRAMESELECTOR_ERROR_MESSAGES,\n            formerError: state.timeframeSelectorError,\n          });\n\n          const value = removePrecisionFromTimeFrame(\n            memoedValue,\n            state.precision,\n          );\n          const timeOffset = getTimeOffsetFromInitialValue(\n            value,\n            'range',\n            state.min,\n            state.max,\n            precision,\n          );\n\n          return {\n            ...state,\n            timeframeSelectorTimeframe: value,\n            calendarValue: value,\n            dateTimeRangePickerTimeframe: value,\n            referenceTimeframe: null,\n            timeframeSelectorError: error,\n            calendarError: error,\n            dateTimeRangePickerError: error,\n            timeOffset,\n            required,\n          };\n        });\n    },\n    // timeframeSelectorRef and debouncedOnChangeRef are stable refs \u2014 no need to include in deps\n    // oxlint-disable-next-line react-hooks/exhaustive-deps\n    [\n      formFieldMessagesDispatch,\n      formatString,\n      isControlled,\n      memoedValue,\n      precision,\n      required,\n      store,\n    ],\n  );\n\n  // Sync precision and formatString into the store whenever they change.\n  useEffect(() => {\n    store.setState((state) => {\n      const preciseValue = isControlled\n        ? memoedValue\n        : state.timeframeSelectorTimeframe;\n      const value = removePrecisionFromTimeFrame(preciseValue, precision);\n\n      return {\n        ...state,\n        precision,\n        formatString,\n        timeframeSelectorTimeframe: value,\n        calendarValue: value,\n        dateTimeRangePickerTimeframe: value,\n      };\n    });\n  }, [precision, formatString, store, isControlled, memoedValue]);\n}\n\nconst _TimeframeSelector = forwardRef<\n  TimeRangePickerRef,\n  TimeframeSelectorProps\n>(\n  (\n    {\n      value: propValue,\n      defaultValue: propDefaultValue,\n      onChange,\n      min: propMin = GRAIL_MIN_DATE,\n      max: propMax = GRAIL_MAX_DATE,\n      disabled: propDisabled,\n      required: propRequired,\n      readOnly: propReadOnly,\n      id: propId,\n      'aria-disabled': propAriaDisabled,\n      // oxlint-disable-next-line typescript/no-deprecated -- APPDEV-18321\n      controlState,\n      // oxlint-disable-next-line typescript/no-deprecated -- APPDEV-18321\n      precision = 'minutes',\n      ...remainingProps\n    },\n    forwardedRef,\n  ) => {\n    const [isControlled] = useState(propValue !== undefined);\n    const onChangeProp = useCallbackRef(onChange);\n\n    const memoedValue = useMemo(\n      () => mapToPartialTimeframe(propValue, precision),\n      [precision, propValue],\n    );\n    const memoedDefaultValue = useMemo(\n      () => mapToPartialTimeframe(propDefaultValue, precision),\n      /** We're ignoring updates to defaultValue as it only considers the initial state. */\n      // oxlint-disable-next-line react-hooks/exhaustive-deps\n      [],\n    );\n\n    // Keep min and max updated at midnight\n    const { min, max } = useMinMax(propMin, propMax);\n\n    const calendarRef = useRef<\n      | FormControlRef<HTMLDivElement>\n      | (Omit<FormControlRef<HTMLDivElement>, 'inputRef'> &\n          Pick<TimeRangePickerRef<HTMLDivElement>, 'inputRef'>)\n    >(null);\n    const dateTimeFromRef = useRef<DateTimeInputRef>(null);\n    const dateTimeRangePickerRef = useRef<DateTimeRangePickerRef>(null);\n    const timeframeSelectorRef = useRef<TimeRangePickerRef>(null);\n\n    const { formatString } = useDateTimeMessages({ precision });\n    const formControl = useFormControl({\n      propDisabled,\n      propRequired,\n      propId,\n      propAriaDisabled,\n      propReadOnly,\n      controlState,\n    });\n    const { required, messageDispatch: formFieldMessagesDispatch } =\n      formControl;\n\n    const debouncedOnChangeRef = useRef(\n      debounce((timeframe: Timeframe | null) => {\n        onChangeProp?.(timeframe);\n        if (timeframe) {\n          saveRecentTimeframe(timeframe);\n        }\n      }, STEPPER_DEBOUNCE_MS),\n    );\n\n    // Cancel the debounced call on unmount.\n    useEffect(() => {\n      const debouncedOnChange = debouncedOnChangeRef.current;\n      return () => debouncedOnChange.cancel();\n    }, []);\n\n    const [initialState] = useState<TimeframeSelectorState>(() => {\n      const value = isControlled ? memoedValue : memoedDefaultValue;\n\n      const error = validate(value, min, max, {\n        formMessageDispatch: formFieldMessagesDispatch,\n        precision,\n        showError: false,\n        checkOrder: true,\n        ref: timeframeSelectorRef,\n        expectedFormat: formatString,\n        valueMode: 'timeframeSelector',\n        required,\n        errorMessages: TIMEFRAMESELECTOR_ERROR_MESSAGES,\n      });\n      const timeOffset = getTimeOffsetFromInitialValue(\n        value,\n        'range',\n        min,\n        max,\n        precision,\n      );\n\n      return {\n        calendarValue: value,\n        dateTimeRangePickerTimeframe: value,\n        timeframeSelectorTimeframe: value,\n        referenceTimeframe: null,\n        min,\n        max,\n        precision,\n        isFullDay: false,\n        calendarRef,\n        dateTimeFromRef,\n        dateTimeRangePickerRef,\n        timeframeSelectorRef,\n        required,\n        timeframeSelectorError: error,\n        calendarError: error,\n        dateTimeRangePickerError: error,\n        previousTimeframe: null,\n        timeOffset,\n        formatString,\n      };\n    });\n\n    const [store] = useState(() =>\n      createTimeframeStore<\n        TimeframeSelectorState,\n        TimeframeSelectorStoreActions\n      >(\n        initialState,\n        getTimeframeSelectorActions(\n          isControlled,\n          timeframeSelectorRef,\n          formFieldMessagesDispatch,\n          onChangeProp,\n          debouncedOnChangeRef,\n          TIMEFRAMESELECTOR_ERROR_MESSAGES,\n        ),\n      ),\n    );\n\n    useSyncPropsAndState(\n      store,\n      memoedValue,\n      isControlled,\n      precision,\n      formatString,\n      required,\n      formFieldMessagesDispatch,\n      timeframeSelectorRef,\n      debouncedOnChangeRef,\n    );\n\n    // Keep min and max updated at midnight\n    useMinMaxStoreSync(\n      store,\n      min,\n      max,\n      useCallback(\n        (\n          state: TimeframeSelectorState,\n          min: TimeValue | null,\n          max: TimeValue | null,\n        ) => {\n          const error = validate(state.timeframeSelectorTimeframe, min, max, {\n            formMessageDispatch: formFieldMessagesDispatch,\n            formerError: state.timeframeSelectorError,\n            precision: state.precision,\n            showError: false,\n            checkOrder: true,\n            ref: timeframeSelectorRef,\n            expectedFormat: state.formatString,\n            valueMode: 'timeframeSelector',\n            required: state.required,\n            errorMessages: TIMEFRAMESELECTOR_ERROR_MESSAGES,\n          });\n          return {\n            timeframeSelectorError: error,\n            calendarError: error,\n            dateTimeRangePickerError: error,\n          };\n        },\n        [formFieldMessagesDispatch],\n      ),\n    );\n\n    const mergedRef = useMergeRefs<TimeRangePickerRef>([\n      timeframeSelectorRef,\n      forwardedRef,\n    ]);\n\n    return (\n      <TimeframeSelectorStoreProvider store={store}>\n        <TimeframeSelectorRoot\n          {...remainingProps}\n          formControl={formControl}\n          ref={mergedRef}\n        />\n      </TimeframeSelectorStoreProvider>\n    );\n  },\n);\n\n(\n  _TimeframeSelector as typeof _TimeframeSelector & { displayName: string }\n).displayName = 'TimeframeSelector';\n\n/**\n * Use the `TimeframeSelector` to let users filter data by time, choosing from preset timeframes or entering a custom start and end time.\n * @public\n */\nexport const TimeframeSelector = Object.assign(_TimeframeSelector, {\n  Trigger,\n  DisplayValue,\n  CustomTrigger,\n  Presets,\n  PresetItem,\n});\n"],
   "mappings": "AAkWQ;AAlWR,SAAS,gBAAgB;AACzB;AAAA,EAGE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAGP,SAAS,kBAAkB;AAC3B,SAAS,eAAe;AACxB,SAAS,qBAAqB;AAC9B,SAAS,oBAAoB;AAC7B,SAAS,eAAe;AACxB,SAAS,wCAAwC;AAEjD,SAAS,6BAA6B;AACtC,SAAS,2BAA2B;AACpC,SAAS,sBAAsB;AAC/B,SAAS,oBAAoB;AAE7B,SAAS,mCAAmC;AAC5C,SAAS,4BAA4B;AAKrC,SAAS,sCAAsC;AAC/C,SAAS,2BAA2B;AACpC,SAAS,WAAW,0BAA0B;AAC9C,SAAS,gBAAgB;AAEzB,SAAS,qCAAqC;AAK9C,SAAS,sBAAsB;AAE/B;AAAA,EACE;AAAA,EACA;AAAA,OACK;AACP;AAAA,EACE;AAAA,EACA;AAAA,OACK;AAMP,MAAM,sBAAsB;AAc5B,SAAS,qBACP,OACA,aAIA,cACA,WACA,cACA,UACA,2BAGA,sBACA,sBACA;AAEA;AAAA,IACE,MAAM;AACJ,sBACE,MAAM,SAAS,CAAC,UAAU;AACxB,8BAAsB,SAAS,OAAO;AACtC,cAAM,QAAQ,SAAS,eAAe,MAAM,MAAM,KAAK,MAAM,KAAK;AAAA,UAChE,qBAAqB;AAAA,UACrB,WAAW;AAAA,UACX,YAAY;AAAA,UACZ,KAAK;AAAA,UACL,gBAAgB;AAAA,UAChB,WAAW;AAAA,UACX;AAAA,UACA,eAAe;AAAA,UACf,aAAa,MAAM;AAAA,QACrB,CAAC;AAED,cAAM,QAAQ;AAAA,UACZ;AAAA,UACA,MAAM;AAAA,QACR;AACA,cAAM,aAAa;AAAA,UACjB;AAAA,UACA;AAAA,UACA,MAAM;AAAA,UACN,MAAM;AAAA,UACN;AAAA,QACF;AAEA,eAAO;AAAA,UACL,GAAG;AAAA,UACH,4BAA4B;AAAA,UAC5B,eAAe;AAAA,UACf,8BAA8B;AAAA,UAC9B,oBAAoB;AAAA,UACpB,wBAAwB;AAAA,UACxB,eAAe;AAAA,UACf,0BAA0B;AAAA,UAC1B;AAAA,UACA;AAAA,QACF;AAAA,MACF,CAAC;AAAA,IACL;AAAA;AAAA;AAAA,IAGA;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AAGA,YAAU,MAAM;AACd,UAAM,SAAS,CAAC,UAAU;AACxB,YAAM,eAAe,eACjB,cACA,MAAM;AACV,YAAM,QAAQ,6BAA6B,cAAc,SAAS;AAElE,aAAO;AAAA,QACL,GAAG;AAAA,QACH;AAAA,QACA;AAAA,QACA,4BAA4B;AAAA,QAC5B,eAAe;AAAA,QACf,8BAA8B;AAAA,MAChC;AAAA,IACF,CAAC;AAAA,EACH,GAAG,CAAC,WAAW,cAAc,OAAO,cAAc,WAAW,CAAC;AAChE;AAEA,MAAM,qBAAqB;AAAA,EAIzB,CACE;AAAA,IACE,OAAO;AAAA,IACP,cAAc;AAAA,IACd;AAAA,IACA,KAAK,UAAU;AAAA,IACf,KAAK,UAAU;AAAA,IACf,UAAU;AAAA,IACV,UAAU;AAAA,IACV,UAAU;AAAA,IACV,IAAI;AAAA,IACJ,iBAAiB;AAAA;AAAA,IAEjB;AAAA;AAAA,IAEA,YAAY;AAAA,IACZ,GAAG;AAAA,EACL,GACA,iBACG;AACH,UAAM,CAAC,YAAY,IAAI,SAAS,cAAc,MAAS;AACvD,UAAM,eAAe,eAAe,QAAQ;AAE5C,UAAM,cAAc;AAAA,MAClB,MAAM,sBAAsB,WAAW,SAAS;AAAA,MAChD,CAAC,WAAW,SAAS;AAAA,IACvB;AACA,UAAM,qBAAqB;AAAA,MACzB,MAAM,sBAAsB,kBAAkB,SAAS;AAAA;AAAA;AAAA,MAGvD,CAAC;AAAA,IACH;AAGA,UAAM,EAAE,KAAK,IAAI,IAAI,UAAU,SAAS,OAAO;AAE/C,UAAM,cAAc,OAIlB,IAAI;AACN,UAAM,kBAAkB,OAAyB,IAAI;AACrD,UAAM,yBAAyB,OAA+B,IAAI;AAClE,UAAM,uBAAuB,OAA2B,IAAI;AAE5D,UAAM,EAAE,aAAa,IAAI,oBAAoB,EAAE,UAAU,CAAC;AAC1D,UAAM,cAAc,eAAe;AAAA,MACjC;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF,CAAC;AACD,UAAM,EAAE,UAAU,iBAAiB,0BAA0B,IAC3D;AAEF,UAAM,uBAAuB;AAAA,MAC3B,SAAS,CAAC,cAAgC;AACxC,uBAAe,SAAS;AACxB,YAAI,WAAW;AACb,8BAAoB,SAAS;AAAA,QAC/B;AAAA,MACF,GAAG,mBAAmB;AAAA,IACxB;AAGA,cAAU,MAAM;AACd,YAAM,oBAAoB,qBAAqB;AAC/C,aAAO,MAAM,kBAAkB,OAAO;AAAA,IACxC,GAAG,CAAC,CAAC;AAEL,UAAM,CAAC,YAAY,IAAI,SAAiC,MAAM;AAC5D,YAAM,QAAQ,eAAe,cAAc;AAE3C,YAAM,QAAQ,SAAS,OAAO,KAAK,KAAK;AAAA,QACtC,qBAAqB;AAAA,QACrB;AAAA,QACA,WAAW;AAAA,QACX,YAAY;AAAA,QACZ,KAAK;AAAA,QACL,gBAAgB;AAAA,QAChB,WAAW;AAAA,QACX;AAAA,QACA,eAAe;AAAA,MACjB,CAAC;AACD,YAAM,aAAa;AAAA,QACjB;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF;AAEA,aAAO;AAAA,QACL,eAAe;AAAA,QACf,8BAA8B;AAAA,QAC9B,4BAA4B;AAAA,QAC5B,oBAAoB;AAAA,QACpB;AAAA,QACA;AAAA,QACA;AAAA,QACA,WAAW;AAAA,QACX;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA,wBAAwB;AAAA,QACxB,eAAe;AAAA,QACf,0BAA0B;AAAA,QAC1B,mBAAmB;AAAA,QACnB;AAAA,QACA;AAAA,MACF;AAAA,IACF,CAAC;AAED,UAAM,CAAC,KAAK,IAAI;AAAA,MAAS,MACvB;AAAA,QAIE;AAAA,QACA;AAAA,UACE;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,QACF;AAAA,MACF;AAAA,IACF;AAEA;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAGA;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,QACE,CACE,OACAA,MACAC,SACG;AACH,gBAAM,QAAQ,SAAS,MAAM,4BAA4BD,MAAKC,MAAK;AAAA,YACjE,qBAAqB;AAAA,YACrB,aAAa,MAAM;AAAA,YACnB,WAAW,MAAM;AAAA,YACjB,WAAW;AAAA,YACX,YAAY;AAAA,YACZ,KAAK;AAAA,YACL,gBAAgB,MAAM;AAAA,YACtB,WAAW;AAAA,YACX,UAAU,MAAM;AAAA,YAChB,eAAe;AAAA,UACjB,CAAC;AACD,iBAAO;AAAA,YACL,wBAAwB;AAAA,YACxB,eAAe;AAAA,YACf,0BAA0B;AAAA,UAC5B;AAAA,QACF;AAAA,QACA,CAAC,yBAAyB;AAAA,MAC5B;AAAA,IACF;AAEA,UAAM,YAAY,aAAiC;AAAA,MACjD;AAAA,MACA;AAAA,IACF,CAAC;AAED,WACE,oBAAC,kCAA+B,OAC9B;AAAA,MAAC;AAAA;AAAA,QACE,GAAG;AAAA,QACJ;AAAA,QACA,KAAK;AAAA;AAAA,IACP,GACF;AAAA,EAEJ;AACF;AAGE,mBACA,cAAc;AAMT,MAAM,oBAAoB,OAAO,OAAO,oBAAoB;AAAA,EACjE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,CAAC;",
   "names": ["min", "max"]
 }

package/esm/filters/timeframe-selector/TimeframeSelector.sty.js CHANGED Viewed

@@ -1,6 +1,6 @@
 import "./TimeframeSelector.css";
-var displayValueParts = "_1sqhmjg0-3-12-2";
-var root = "_1sqhmjg1-3-12-2";
+var displayValueParts = "_1sqhmjg0-3-13-0";
+var root = "_1sqhmjg1-3-13-0";
 export {
   displayValueParts,
   root

package/esm/filters/timeframe-selector/TimeframeSelector.sty.js.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/filters/timeframe-selector/TimeframeSelector.css.ts"],
-  "sourcesContent": ["import './TimeframeSelector.css';\nexport var displayValueParts = '_1sqhmjg0-3-12-2';\nexport var root = '_1sqhmjg1-3-12-2';"],
+  "sourcesContent": ["import './TimeframeSelector.css';\nexport var displayValueParts = '_1sqhmjg0-3-13-0';\nexport var root = '_1sqhmjg1-3-13-0';"],
   "mappings": "AAAA,OAAO;AACA,IAAI,oBAAoB;AACxB,IAAI,OAAO;",
   "names": []
 }

package/esm/filters/timeframe-selector/TimeframeSelectorRoot.js CHANGED Viewed

@@ -103,7 +103,7 @@ const TimeframeSelectorRoot = forwardRef((props, forwardedRef) => {
   const {
     value: propValue,
     defaultValue,
-    // eslint-disable-next-line @typescript-eslint/no-deprecated
+    // oxlint-disable-next-line typescript/no-deprecated
     clearable = false,
     children,
     onChange,

package/esm/filters/timeframe-selector/TimeframeSelectorRoot.js.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/filters/timeframe-selector/TimeframeSelectorRoot.tsx"],
-  "sourcesContent": ["import clsx from 'clsx';\nimport {\n  Children,\n  forwardRef,\n  useCallback,\n  useEffect,\n  useImperativeHandle,\n  useMemo,\n  useRef,\n  type ReactElement,\n  type ReactNode,\n} from 'react';\nimport { useIntl } from 'react-intl';\n\nimport { TimeframeSelectorOverlay } from './components/overlay/TimeframeSelectorOverlay.js';\nimport { PresetItem } from './components/presets/PresetItem.js';\nimport { Presets } from './components/presets/Presets.js';\nimport { StepperButton } from './components/stepper/StepperButton.js';\nimport { TimeframeSelectorTooltip } from './components/TimeframeSelectorTooltip.js';\nimport {\n  isTimeframeSelectorCustomTriggerElement,\n  type TimeframeSelectorCustomTriggerProps,\n} from './components/trigger/CustomTrigger.js';\nimport {\n  isTimeframeSelectorTriggerElement,\n  Trigger,\n  type TimeframeSelectorTriggerProps,\n} from './components/trigger/Trigger.js';\nimport {\n  TIMEFRAMESELECTOR_ERROR_MESSAGES,\n  TIMEFRAME_SELECTOR_MESSAGES,\n} from './constants/timeframeSelectorMessages.js';\nimport { TimeframeSelectorContext } from './contexts/TimeframeSelectorContext.js';\nimport * as styles from './TimeframeSelector.sty.js';\nimport type {\n  TimeframeValueDetails,\n  TimeframeSelectorProps,\n} from './TimeframeSelector.types.js';\nimport { getTimeframeDisplayValueProps } from './utils/getTimeframeDisplayValueProps.js';\nimport { getTimeframePresets } from './utils/presets-helpers.js';\nimport {\n  TIMEFRAME_PRESETS_QUERY_KEY,\n  timeframeQueryClient,\n} from './utils/TimeframePresetsClient.js';\nimport { VisuallyHidden } from '../../core/components/visually-hidden/VisuallyHidden.js';\nimport { useId } from '../../core/hooks/useId.js';\nimport { useMergeRefs } from '../../core/hooks/useMergeRefs.js';\nimport type { Precision, TimeErrorKey } from '../../core/time/shared.types.js';\nimport { useTimeframeSelectorStore } from '../../core/time/timeframeStore/useTimeframeStore.js';\nimport {\n  formatTimeValidationMessage,\n  validate,\n} from '../../core/time/validation.js';\nimport { isSlot } from '../../core/utils/is-slot.js';\nimport { devLog } from '../../core/utils/logging.js';\nimport type { ValidateFieldOptions } from '../../forms/form/form.types.js';\nimport { useInternalFormRegistration } from '../../forms/form/hooks/useInternalFormRegistration.js';\nimport { InternalBaseItem as BaseItem } from '../../forms/forms-core/components/form-field-messages/FormFieldMessageBaseItem.js';\nimport type { UseFormControlReturnType } from '../../forms/forms-core/hooks/useFormControl.js';\nimport { useFormFieldContext } from '../../forms/forms-core/hooks/useFormFieldContext.js';\nimport { useFormFieldValidationAriaProps } from '../../forms/forms-core/hooks/useFormFieldValidation.js';\nimport { useMinMaxLogger } from '../../forms/forms-core/hooks/useMinMaxLogger.js';\nimport { FormFieldMessagesAction } from '../../forms/forms-core/state/formfield-messages-state-reducer.js';\nimport {\n  parseValue,\n  removePrecision,\n} from '../../forms/forms-core/time/timeParser.js';\nimport { useContainerFocus } from '../../forms/hooks/useContainerFocus.js';\nimport type { TimeRangePickerRef } from '../../forms/shared-types.js';\nimport {\n  ValidityStateKey,\n  type ValidationState,\n} from '../../forms/validation/types.js';\nimport { useCustomMessageEmitter } from '../../forms/validation/useCustomMessageEmitter.js';\nimport { useValidationStateEmitter } from '../../forms/validation/useValidationStateEmitter.js';\nimport { getValidationState } from '../../forms/validation/validation-builders.js';\nimport { Flex } from '../../layouts/flex/Flex.js';\nimport { InputGroup } from '../../layouts/input-group/InputGroup.js';\nimport { useOverlayWithTrigger } from '../../overlays/hooks/useOverlayWithTrigger.js';\n\nconst COMPONENT_NAME = 'TimeframeSelector';\n\n//#region Typings\ntype TimeframeSelectorSlotsAndPresetItemsMap = {\n  trigger: ReactElement<TimeframeSelectorTriggerProps> | null;\n  customTrigger: ReactElement<TimeframeSelectorCustomTriggerProps> | null;\n  presets: ReactNode;\n  presetItemsDisplayValuesMap: Map<string, ReactNode | undefined>;\n};\n//#endregion\n\n/** Iterates over child nodes to extract specific component slots. */\nfunction getItemSlots(children: ReactNode, precision?: Precision) {\n  const presetItemsDisplayValuesMap = new Map();\n  const slots: TimeframeSelectorSlotsAndPresetItemsMap = {\n    trigger: null,\n    customTrigger: null,\n    presets: null,\n    presetItemsDisplayValuesMap,\n  };\n\n  for (const child of Children.toArray(children)) {\n    if (isSlot(child, Presets)) {\n      slots.presets = child;\n      for (const childItem of Children.toArray(child.props.children)) {\n        if (isSlot(childItem, PresetItem)) {\n          slots.presetItemsDisplayValuesMap.set(\n            `${removePrecision(\n              childItem.props.value.from,\n              precision,\n            )} ${removePrecision(childItem.props.value.to, precision)}`,\n            childItem.props.children,\n          );\n        }\n      }\n    } else if (isTimeframeSelectorCustomTriggerElement(child)) {\n      slots.customTrigger = child;\n    } else if (isTimeframeSelectorTriggerElement(child)) {\n      slots.trigger = child;\n    } else {\n      // do nothing if the child is null (when rendered conditionally for example) and throw a warning otherwise\n      devLog('The used child is not supported by the TimeframeSelector.');\n    }\n  }\n\n  return slots;\n}\n\n/** @internal */\nexport const TimeframeSelectorRoot = forwardRef<\n  TimeRangePickerRef,\n  Omit<\n    TimeframeSelectorProps,\n    | 'disabled'\n    | 'required'\n    | 'id'\n    | 'aria-disabled'\n    | 'readOnly'\n    | 'controlState'\n  > & {\n    formControl: UseFormControlReturnType;\n  }\n>((props, forwardedRef) => {\n  const intl = useIntl();\n  const { formFieldLabelId } = useFormFieldContext();\n  const {\n    value: propValue,\n    defaultValue,\n    // eslint-disable-next-line @typescript-eslint/no-deprecated\n    clearable = false,\n    children,\n    onChange,\n    onFocus,\n    onBlur,\n    className: consumerClassName,\n    style: consumerStyle,\n    'data-testid': dataTestId,\n    'data-dtrum-mask': dataDtrumMask,\n    'data-dtrum-allow': dataDtrumAllow,\n    name,\n    _form,\n    _messageTarget,\n    stepper = true,\n    onValidityChange,\n    'aria-label': ariaLabelProp,\n    'aria-labelledby': ariaLabelledByProp,\n    'aria-describedby': ariaDescribedByProp,\n    'aria-details': ariaDetailsProp,\n    formControl,\n    ...remainingProps\n  } = props;\n  const {\n    disabled,\n    required,\n    id,\n    ariaDisabled,\n    readOnly = false,\n    hint,\n    hintProps,\n    showError,\n    messageState: formFieldMessagesState,\n    messageDispatch: formFieldMessagesDispatch,\n  } = formControl;\n  const value = useTimeframeSelectorStore(\n    (state) => state.timeframeSelectorTimeframe,\n  );\n  const precision = useTimeframeSelectorStore((state) => state.precision);\n  const min = useTimeframeSelectorStore((state) => state.min);\n  const max = useTimeframeSelectorStore((state) => state.max);\n  const formatString = useTimeframeSelectorStore((state) => state.formatString);\n  const timeframeSelectorRef = useTimeframeSelectorStore(\n    (state) => state.timeframeSelectorRef,\n  );\n  const setDateTimeRangePickerTimeframe = useTimeframeSelectorStore(\n    (state) => state.setDateTimeRangePickerTimeframe,\n  );\n\n  const placeholder = intl.formatMessage({\n    defaultMessage: 'Select timeframe',\n    id: 'W+rTy8UuFKDho3mc',\n    description: 'Placeholder shown for the timeframe selector.',\n  });\n\n  const defaultTriggerLabel = intl.formatMessage(\n    TIMEFRAME_SELECTOR_MESSAGES.timeframeLabel,\n  );\n\n  // log to the sdk when min is larger than max.\n  useMinMaxLogger(min, max, 'TimeframeSelector');\n\n  const formValidityChangeRef = useRef<\n    ((state: ValidationState) => void) | undefined\n  >(undefined);\n  const _emitValidationState = useValidationStateEmitter((state) =>\n    formValidityChangeRef.current?.(state),\n  );\n  const emitValidationState = useCustomMessageEmitter(\n    _emitValidationState,\n    () => {\n      const errorKey = validate(value, min, max, {\n        precision,\n        checkOrder: true,\n        ref: timeframeSelectorRef,\n        expectedFormat: formatString,\n        valueMode: 'timeframeSelector',\n        required,\n        errorMessages: TIMEFRAMESELECTOR_ERROR_MESSAGES,\n      });\n      return getValidationState(\n        errorKey !== undefined ? new ValidityStateKey(errorKey) : undefined,\n        'manual',\n        getValidationMessage(errorKey),\n        [inputId],\n      );\n    },\n  );\n\n  const getValidationMessage = useCallback(\n    (errorKey: TimeErrorKey | undefined): string | undefined => {\n      if (!errorKey) {\n        return undefined;\n      }\n      return formatTimeValidationMessage(errorKey, intl, {\n        value,\n        min,\n        max,\n        precision,\n        expectedFormat: formatString,\n        errorMessages: TIMEFRAMESELECTOR_ERROR_MESSAGES,\n      });\n    },\n    [intl, value, min, max, precision, formatString],\n  );\n\n  /** Handle overlay on open change. */\n  const onOpenChange = useCallback(\n    (isOpen: boolean) => {\n      if (!isOpen) {\n        formFieldMessagesDispatch?.({\n          type: FormFieldMessagesAction.SETISTOUCHED,\n          payload: { isTouched: true },\n        });\n        setDateTimeRangePickerTimeframe(value);\n\n        if (!formFieldMessagesState.isTouched) {\n          const errorKey = validate(value, min, max, {\n            precision,\n            checkOrder: true,\n            ref: timeframeSelectorRef,\n            expectedFormat: formatString,\n            valueMode: 'timeframeSelector',\n            required,\n            errorMessages: TIMEFRAMESELECTOR_ERROR_MESSAGES,\n          });\n          emitValidationState(\n            getValidationState(\n              errorKey !== undefined\n                ? new ValidityStateKey(errorKey)\n                : undefined,\n              'blur',\n              getValidationMessage(errorKey),\n              [inputId],\n            ),\n          );\n        }\n      }\n    },\n    [\n      emitValidationState,\n      formFieldMessagesDispatch,\n      formFieldMessagesState.isTouched,\n      formatString,\n      max,\n      min,\n      precision,\n      required,\n      setDateTimeRangePickerTimeframe,\n      timeframeSelectorRef,\n      value,\n    ],\n  );\n\n  const {\n    targetRef,\n    overlayRef,\n    triggerRef,\n    overlayProps,\n    overlayState,\n    overlayTriggerProps,\n  } = useOverlayWithTrigger({\n    offset: 4,\n    placement: 'bottom-start',\n    placementFallbacks: ['bottom-end', 'top-start', 'top-end'],\n    heightStrategy: 'maxViewport',\n    disabled,\n    onOpenChange,\n  });\n\n  // Prefetch timeframe presets on mount so opening the overlay can use cached data immediately.\n  useEffect(() => {\n    if (timeframeQueryClient.getQueryData(TIMEFRAME_PRESETS_QUERY_KEY)) {\n      return;\n    }\n\n    timeframeQueryClient\n      .prefetchQuery({\n        queryKey: TIMEFRAME_PRESETS_QUERY_KEY,\n        queryFn: getTimeframePresets,\n      })\n      .catch(() => undefined);\n  }, []);\n\n  const details = useMemo((): TimeframeValueDetails | null => {\n    const { from, to } = parseValue(value);\n    return from && to ? { from, to } : null;\n  }, [value]);\n\n  const { customTrigger, trigger, presets, presetItemsDisplayValuesMap } =\n    useMemo(() => getItemSlots(children, precision), [children, precision]);\n\n  const presetItemName = presetItemsDisplayValuesMap.get(\n    `${details?.from?.value} ${details?.to?.value}`,\n  );\n\n  const {\n    displayValue,\n    isInvalid: displayValueError,\n    hint: displayValueHint,\n  } = getTimeframeDisplayValueProps(\n    value,\n    intl,\n    placeholder,\n    precision,\n    presetItemName,\n    required,\n    min?.value,\n    max?.value,\n  );\n\n  const triggerErrorId = useId();\n  const inputId = useId();\n  const overlayOwnerId = useId();\n\n  // We need to create a ref to give access to the trigger in our imperative handle.\n  const imperativeTriggerRef = useRef<HTMLButtonElement>(null);\n  const containerRef = useRef<HTMLDivElement>(null);\n  const fromInputRef = useRef<HTMLInputElement>(null);\n  const toInputRef = useRef<HTMLInputElement>(null);\n  const ariaLabelingProps = {\n    'aria-label':\n      ariaLabelProp ??\n      (!ariaLabelledByProp && !formFieldLabelId\n        ? defaultTriggerLabel\n        : undefined),\n    'aria-labelledby': ariaLabelledByProp,\n    'aria-describedby': ariaDescribedByProp,\n    'aria-details': ariaDetailsProp,\n  };\n  const ariaFormProps = useFormFieldValidationAriaProps(ariaLabelingProps);\n\n  const validateField = useCallback(\n    ({ reveal, trigger }: ValidateFieldOptions): ValidationState => {\n      if (reveal) {\n        formFieldMessagesDispatch?.({\n          type: FormFieldMessagesAction.SETISTOUCHED,\n          payload: { isTouched: true },\n        });\n      }\n      const errorKey = validate(value, min, max, {\n        precision,\n        checkOrder: true,\n        ref: timeframeSelectorRef,\n        expectedFormat: formatString,\n        valueMode: 'timeframeSelector',\n        required,\n        errorMessages: TIMEFRAMESELECTOR_ERROR_MESSAGES,\n      });\n      return emitValidationState(\n        getValidationState(\n          errorKey !== undefined ? new ValidityStateKey(errorKey) : undefined,\n          trigger,\n          getValidationMessage(errorKey),\n          [inputId],\n        ),\n      );\n    },\n    [\n      formFieldMessagesDispatch,\n      emitValidationState,\n      value,\n      min,\n      max,\n      precision,\n      timeframeSelectorRef,\n      formatString,\n      required,\n      getValidationMessage,\n      inputId,\n    ],\n  );\n\n  const formRegistration = useInternalFormRegistration({\n    id,\n    name,\n    form: _form,\n    messageTarget: _messageTarget,\n    onValidityChange,\n    getValue: () => value,\n    focus: () => imperativeTriggerRef.current?.focus(),\n    validateField: (options) => Promise.resolve(validateField(options)),\n    resetValidation: () => {\n      formFieldMessagesDispatch?.({\n        type: FormFieldMessagesAction.SETISTOUCHED,\n        payload: { isTouched: false },\n      });\n      formFieldMessagesDispatch?.({\n        type: FormFieldMessagesAction.REMOVEMESSAGE,\n        payload: {\n          id: triggerErrorId,\n          messageType: 'formcontrol',\n          controlId: inputId,\n        },\n      });\n      for (const msg of formFieldMessagesState.customMessages) {\n        formFieldMessagesDispatch?.({\n          type: FormFieldMessagesAction.REMOVEMESSAGE,\n          payload: { id: msg.id, messageType: 'custom' },\n        });\n      }\n    },\n  });\n  formValidityChangeRef.current = formRegistration.onValidityChange;\n\n  useImperativeHandle(\n    forwardedRef,\n    (): TimeRangePickerRef => ({\n      element: containerRef.current,\n      triggerRef: imperativeTriggerRef.current,\n      inputRef: { from: fromInputRef.current, to: toInputRef.current },\n      open: overlayState.open,\n      close: overlayState.close,\n      focus() {\n        imperativeTriggerRef.current?.focus?.();\n      },\n      validate() {\n        formFieldMessagesDispatch?.({\n          type: FormFieldMessagesAction.SETISTOUCHED,\n          payload: { isTouched: true },\n        });\n\n        const errorKey = validate(value, min, max, {\n          formMessageDispatch: formFieldMessagesDispatch,\n          precision,\n          showError: false,\n          checkOrder: true,\n          ref: timeframeSelectorRef,\n          expectedFormat: formatString,\n          valueMode: 'timeframeSelector',\n          required,\n          errorMessages: TIMEFRAMESELECTOR_ERROR_MESSAGES,\n        });\n\n        emitValidationState(\n          getValidationState(\n            errorKey !== undefined ? new ValidityStateKey(errorKey) : undefined,\n            'manual',\n            getValidationMessage(errorKey),\n            [inputId],\n          ),\n        );\n      },\n      // DEPRECATION: [APPDEV-18178] BREAKING-CHANGE: Remove validateAsync() and change validate() to return Promise<ValidationState>.\n      validateAsync: async () => {\n        formFieldMessagesDispatch?.({\n          type: FormFieldMessagesAction.SETISTOUCHED,\n          payload: { isTouched: true },\n        });\n\n        const errorKey = validate(value, min, max, {\n          formMessageDispatch: formFieldMessagesDispatch,\n          precision,\n          showError: false,\n          checkOrder: true,\n          ref: timeframeSelectorRef,\n          expectedFormat: formatString,\n          valueMode: 'timeframeSelector',\n          required,\n          errorMessages: TIMEFRAMESELECTOR_ERROR_MESSAGES,\n        });\n\n        const state = getValidationState(\n          errorKey !== undefined ? new ValidityStateKey(errorKey) : undefined,\n          'manual',\n          getValidationMessage(errorKey),\n          [inputId],\n        );\n        return emitValidationState(state);\n      },\n    }),\n    [\n      formFieldMessagesDispatch,\n      emitValidationState,\n      getValidationMessage,\n      overlayState.close,\n      overlayState.open,\n    ],\n  );\n\n  useEffect(() => {\n    if (overlayState.isOpen) {\n      return;\n    }\n\n    if (!displayValueError && triggerErrorId) {\n      formFieldMessagesDispatch?.({\n        type: FormFieldMessagesAction.REMOVEMESSAGE,\n        payload: {\n          id: triggerErrorId,\n          messageType: 'formcontrol',\n          controlId: inputId,\n        },\n      });\n    }\n  }, [\n    displayValueError,\n    displayValueHint,\n    overlayState.isOpen,\n    triggerErrorId,\n    formFieldMessagesDispatch,\n    inputId,\n  ]);\n\n  // Surface the validation state on every value change (automatic `change`\n  // trigger) so `onValidityChange` stays in sync as the timeframe is edited, not just\n  // on blur or manual validation. The error key is computed without dispatching\n  // messages \u2014 the displayed error is already driven by the value pipeline.\n  useEffect(() => {\n    const errorKey = validate(value, min, max, {\n      precision,\n      checkOrder: true,\n      ref: timeframeSelectorRef,\n      expectedFormat: formatString,\n      valueMode: 'timeframeSelector',\n      required,\n      errorMessages: TIMEFRAMESELECTOR_ERROR_MESSAGES,\n    });\n    emitValidationState(\n      getValidationState(\n        errorKey !== undefined ? new ValidityStateKey(errorKey) : undefined,\n        'change',\n        getValidationMessage(errorKey),\n        [inputId],\n      ),\n    );\n  }, [\n    value,\n    min,\n    max,\n    precision,\n    formatString,\n    required,\n    timeframeSelectorRef,\n    emitValidationState,\n    getValidationMessage,\n  ]);\n\n  const triggerButtonRef = useMergeRefs([\n    targetRef,\n    triggerRef,\n    imperativeTriggerRef,\n  ]);\n\n  const handleOnBlur = useCallback(() => {\n    if (!overlayState.isOpen) {\n      fromInputRef.current?.reportValidity();\n      formFieldMessagesDispatch?.({\n        type: FormFieldMessagesAction.SETISTOUCHED,\n        payload: { isTouched: true },\n      });\n\n      if (!formFieldMessagesState.isTouched) {\n        const errorKey = validate(value, min, max, {\n          precision,\n          checkOrder: true,\n          ref: timeframeSelectorRef,\n          expectedFormat: formatString,\n          valueMode: 'timeframeSelector',\n          required,\n          errorMessages: TIMEFRAMESELECTOR_ERROR_MESSAGES,\n        });\n        emitValidationState(\n          getValidationState(\n            errorKey !== undefined ? new ValidityStateKey(errorKey) : undefined,\n            'blur',\n            getValidationMessage(errorKey),\n            [inputId],\n          ),\n        );\n      }\n    }\n  }, [\n    overlayState.isOpen,\n    formFieldMessagesDispatch,\n    formFieldMessagesState.isTouched,\n    emitValidationState,\n    getValidationMessage,\n    value,\n    min,\n    max,\n    precision,\n    timeframeSelectorRef,\n    formatString,\n    required,\n  ]);\n\n  const { containerClassName, ...containerFocusProps } = useContainerFocus({\n    onFocus,\n    onBlur,\n    disabled,\n    overlayOwnerId,\n    // When the overlay is open, autoFocus moves focus into the portal. The browser\n    // fires a blur on the trigger with relatedTarget=null (the portal is outside the\n    // container DOM). Suppress that blur so hasFocusRef stays true and focus\n    // returning to the trigger on close does not re-fire onFocus.\n    shouldSuppressBlur: () => overlayState.isOpen,\n  });\n\n  const triggerProps = useMemo(\n    () => ({\n      disabled,\n      onBlur: handleOnBlur,\n      ref: triggerButtonRef,\n      id,\n      'aria-disabled': ariaDisabled,\n      ...ariaFormProps,\n      ...(readOnly ? {} : overlayTriggerProps),\n      'data-dt-component': COMPONENT_NAME,\n    }),\n    [\n      disabled,\n      handleOnBlur,\n      triggerButtonRef,\n      id,\n      ariaDisabled,\n      ariaFormProps,\n      readOnly,\n      overlayTriggerProps,\n    ],\n  );\n\n  const timeframeSelectorContextValue = useMemo(\n    () => ({\n      details,\n      displayValue,\n      triggerProps,\n      hint: displayValueHint,\n      readOnly,\n      showError,\n      disabled,\n    }),\n    [\n      disabled,\n      details,\n      readOnly,\n      displayValue,\n      triggerProps,\n      displayValueHint,\n      showError,\n    ],\n  );\n\n  return (\n    <TimeframeSelectorContext.Provider value={timeframeSelectorContextValue}>\n      <Flex\n        gap={4}\n        flexDirection=\"column\"\n        data-testid={dataTestId}\n        data-dtrum-mask={dataDtrumMask}\n        data-dtrum-allow={dataDtrumAllow}\n        ref={containerRef}\n        className={clsx(consumerClassName, containerClassName, styles.root)}\n        style={consumerStyle}\n        {...remainingProps}\n        data-dt-component=\"TimeframeSelector\"\n        {...containerFocusProps}\n      >\n        <VisuallyHidden>\n          <input\n            id={inputId}\n            type=\"text\"\n            ref={fromInputRef}\n            name={name && `${name}-from`}\n            form={_form}\n            aria-hidden={true}\n            readOnly={readOnly}\n            required={required}\n            disabled={disabled}\n            value={details?.from.value ?? ''}\n            onInvalid={(event) => {\n              formFieldMessagesDispatch?.({\n                type: FormFieldMessagesAction.SETISTOUCHED,\n                payload: { isTouched: true },\n              });\n\n              // Prevents the browser validation pop up.\n              event.preventDefault();\n            }}\n            onChange={() => {\n              /** noop */\n            }}\n            tabIndex={-1}\n            {...ariaFormProps}\n          />\n          <input\n            type=\"text\"\n            ref={toInputRef}\n            name={name && `${name}-to`}\n            form={_form}\n            aria-hidden={true}\n            readOnly={readOnly}\n            required={required}\n            disabled={disabled}\n            value={details?.to.value ?? ''}\n            onInvalid={(event) => event.preventDefault()}\n            onChange={() => {\n              /**noop */\n            }}\n            tabIndex={-1}\n            {...ariaFormProps}\n          />\n        </VisuallyHidden>\n        <InputGroup style={{ gridAutoColumns: '1fr max-content max-content' }}>\n          <TimeframeSelectorTooltip\n            displayValue={displayValue}\n            value={value}\n            disabled={disabled}\n          >\n            {customTrigger ?? trigger ?? <Trigger />}\n          </TimeframeSelectorTooltip>\n          {stepper && (\n            <>\n              <StepperButton\n                disabled={disabled || readOnly}\n                direction=\"backward\"\n                aria-disabled={ariaDisabled}\n                onBlur={handleOnBlur}\n              />\n              <StepperButton\n                disabled={disabled || readOnly}\n                direction=\"forward\"\n                aria-disabled={ariaDisabled}\n                onBlur={handleOnBlur}\n              />\n            </>\n          )}\n        </InputGroup>\n        {hint && (\n          <BaseItem\n            variant={showError ? 'error' : 'hint'}\n            disabled={disabled || !!ariaDisabled}\n            {...hintProps}\n          >\n            {hint}\n          </BaseItem>\n        )}\n        {overlayState.isOpen && (\n          <TimeframeSelectorOverlay\n            ref={overlayRef}\n            overlayProps={overlayProps}\n            overlayClose={overlayState.close}\n            overlayOwnerId={overlayOwnerId}\n            // eslint-disable-next-line @typescript-eslint/no-deprecated\n            clearable={clearable}\n            data-dtrum-mask={dataDtrumMask}\n            data-dtrum-allow={dataDtrumAllow}\n          >\n            {presets}\n          </TimeframeSelectorOverlay>\n        )}\n      </Flex>\n    </TimeframeSelectorContext.Provider>\n  );\n});\n"],
+  "sourcesContent": ["import clsx from 'clsx';\nimport {\n  Children,\n  forwardRef,\n  useCallback,\n  useEffect,\n  useImperativeHandle,\n  useMemo,\n  useRef,\n  type ReactElement,\n  type ReactNode,\n} from 'react';\nimport { useIntl } from 'react-intl';\n\nimport { TimeframeSelectorOverlay } from './components/overlay/TimeframeSelectorOverlay.js';\nimport { PresetItem } from './components/presets/PresetItem.js';\nimport { Presets } from './components/presets/Presets.js';\nimport { StepperButton } from './components/stepper/StepperButton.js';\nimport { TimeframeSelectorTooltip } from './components/TimeframeSelectorTooltip.js';\nimport {\n  isTimeframeSelectorCustomTriggerElement,\n  type TimeframeSelectorCustomTriggerProps,\n} from './components/trigger/CustomTrigger.js';\nimport {\n  isTimeframeSelectorTriggerElement,\n  Trigger,\n  type TimeframeSelectorTriggerProps,\n} from './components/trigger/Trigger.js';\nimport {\n  TIMEFRAMESELECTOR_ERROR_MESSAGES,\n  TIMEFRAME_SELECTOR_MESSAGES,\n} from './constants/timeframeSelectorMessages.js';\nimport { TimeframeSelectorContext } from './contexts/TimeframeSelectorContext.js';\nimport * as styles from './TimeframeSelector.sty.js';\nimport type {\n  TimeframeValueDetails,\n  TimeframeSelectorProps,\n} from './TimeframeSelector.types.js';\nimport { getTimeframeDisplayValueProps } from './utils/getTimeframeDisplayValueProps.js';\nimport { getTimeframePresets } from './utils/presets-helpers.js';\nimport {\n  TIMEFRAME_PRESETS_QUERY_KEY,\n  timeframeQueryClient,\n} from './utils/TimeframePresetsClient.js';\nimport { VisuallyHidden } from '../../core/components/visually-hidden/VisuallyHidden.js';\nimport { useId } from '../../core/hooks/useId.js';\nimport { useMergeRefs } from '../../core/hooks/useMergeRefs.js';\nimport type { Precision, TimeErrorKey } from '../../core/time/shared.types.js';\nimport { useTimeframeSelectorStore } from '../../core/time/timeframeStore/useTimeframeStore.js';\nimport {\n  formatTimeValidationMessage,\n  validate,\n} from '../../core/time/validation.js';\nimport { isSlot } from '../../core/utils/is-slot.js';\nimport { devLog } from '../../core/utils/logging.js';\nimport type { ValidateFieldOptions } from '../../forms/form/form.types.js';\nimport { useInternalFormRegistration } from '../../forms/form/hooks/useInternalFormRegistration.js';\nimport { InternalBaseItem as BaseItem } from '../../forms/forms-core/components/form-field-messages/FormFieldMessageBaseItem.js';\nimport type { UseFormControlReturnType } from '../../forms/forms-core/hooks/useFormControl.js';\nimport { useFormFieldContext } from '../../forms/forms-core/hooks/useFormFieldContext.js';\nimport { useFormFieldValidationAriaProps } from '../../forms/forms-core/hooks/useFormFieldValidation.js';\nimport { useMinMaxLogger } from '../../forms/forms-core/hooks/useMinMaxLogger.js';\nimport { FormFieldMessagesAction } from '../../forms/forms-core/state/formfield-messages-state-reducer.js';\nimport {\n  parseValue,\n  removePrecision,\n} from '../../forms/forms-core/time/timeParser.js';\nimport { useContainerFocus } from '../../forms/hooks/useContainerFocus.js';\nimport type { TimeRangePickerRef } from '../../forms/shared-types.js';\nimport {\n  ValidityStateKey,\n  type ValidationState,\n} from '../../forms/validation/types.js';\nimport { useCustomMessageEmitter } from '../../forms/validation/useCustomMessageEmitter.js';\nimport { useValidationStateEmitter } from '../../forms/validation/useValidationStateEmitter.js';\nimport { getValidationState } from '../../forms/validation/validation-builders.js';\nimport { Flex } from '../../layouts/flex/Flex.js';\nimport { InputGroup } from '../../layouts/input-group/InputGroup.js';\nimport { useOverlayWithTrigger } from '../../overlays/hooks/useOverlayWithTrigger.js';\n\nconst COMPONENT_NAME = 'TimeframeSelector';\n\n//#region Typings\ntype TimeframeSelectorSlotsAndPresetItemsMap = {\n  trigger: ReactElement<TimeframeSelectorTriggerProps> | null;\n  customTrigger: ReactElement<TimeframeSelectorCustomTriggerProps> | null;\n  presets: ReactNode;\n  presetItemsDisplayValuesMap: Map<string, ReactNode | undefined>;\n};\n//#endregion\n\n/** Iterates over child nodes to extract specific component slots. */\nfunction getItemSlots(children: ReactNode, precision?: Precision) {\n  const presetItemsDisplayValuesMap = new Map();\n  const slots: TimeframeSelectorSlotsAndPresetItemsMap = {\n    trigger: null,\n    customTrigger: null,\n    presets: null,\n    presetItemsDisplayValuesMap,\n  };\n\n  for (const child of Children.toArray(children)) {\n    if (isSlot(child, Presets)) {\n      slots.presets = child;\n      for (const childItem of Children.toArray(child.props.children)) {\n        if (isSlot(childItem, PresetItem)) {\n          slots.presetItemsDisplayValuesMap.set(\n            `${removePrecision(\n              childItem.props.value.from,\n              precision,\n            )} ${removePrecision(childItem.props.value.to, precision)}`,\n            childItem.props.children,\n          );\n        }\n      }\n    } else if (isTimeframeSelectorCustomTriggerElement(child)) {\n      slots.customTrigger = child;\n    } else if (isTimeframeSelectorTriggerElement(child)) {\n      slots.trigger = child;\n    } else {\n      // do nothing if the child is null (when rendered conditionally for example) and throw a warning otherwise\n      devLog('The used child is not supported by the TimeframeSelector.');\n    }\n  }\n\n  return slots;\n}\n\n/** @internal */\nexport const TimeframeSelectorRoot = forwardRef<\n  TimeRangePickerRef,\n  Omit<\n    TimeframeSelectorProps,\n    | 'disabled'\n    | 'required'\n    | 'id'\n    | 'aria-disabled'\n    | 'readOnly'\n    | 'controlState'\n  > & {\n    formControl: UseFormControlReturnType;\n  }\n>((props, forwardedRef) => {\n  const intl = useIntl();\n  const { formFieldLabelId } = useFormFieldContext();\n  const {\n    value: propValue,\n    defaultValue,\n    // oxlint-disable-next-line typescript/no-deprecated\n    clearable = false,\n    children,\n    onChange,\n    onFocus,\n    onBlur,\n    className: consumerClassName,\n    style: consumerStyle,\n    'data-testid': dataTestId,\n    'data-dtrum-mask': dataDtrumMask,\n    'data-dtrum-allow': dataDtrumAllow,\n    name,\n    _form,\n    _messageTarget,\n    stepper = true,\n    onValidityChange,\n    'aria-label': ariaLabelProp,\n    'aria-labelledby': ariaLabelledByProp,\n    'aria-describedby': ariaDescribedByProp,\n    'aria-details': ariaDetailsProp,\n    formControl,\n    ...remainingProps\n  } = props;\n  const {\n    disabled,\n    required,\n    id,\n    ariaDisabled,\n    readOnly = false,\n    hint,\n    hintProps,\n    showError,\n    messageState: formFieldMessagesState,\n    messageDispatch: formFieldMessagesDispatch,\n  } = formControl;\n  const value = useTimeframeSelectorStore(\n    (state) => state.timeframeSelectorTimeframe,\n  );\n  const precision = useTimeframeSelectorStore((state) => state.precision);\n  const min = useTimeframeSelectorStore((state) => state.min);\n  const max = useTimeframeSelectorStore((state) => state.max);\n  const formatString = useTimeframeSelectorStore((state) => state.formatString);\n  const timeframeSelectorRef = useTimeframeSelectorStore(\n    (state) => state.timeframeSelectorRef,\n  );\n  const setDateTimeRangePickerTimeframe = useTimeframeSelectorStore(\n    (state) => state.setDateTimeRangePickerTimeframe,\n  );\n\n  const placeholder = intl.formatMessage({\n    defaultMessage: 'Select timeframe',\n    id: 'W+rTy8UuFKDho3mc',\n    description: 'Placeholder shown for the timeframe selector.',\n  });\n\n  const defaultTriggerLabel = intl.formatMessage(\n    TIMEFRAME_SELECTOR_MESSAGES.timeframeLabel,\n  );\n\n  // log to the sdk when min is larger than max.\n  useMinMaxLogger(min, max, 'TimeframeSelector');\n\n  const formValidityChangeRef = useRef<\n    ((state: ValidationState) => void) | undefined\n  >(undefined);\n  const _emitValidationState = useValidationStateEmitter((state) =>\n    formValidityChangeRef.current?.(state),\n  );\n  const emitValidationState = useCustomMessageEmitter(\n    _emitValidationState,\n    () => {\n      const errorKey = validate(value, min, max, {\n        precision,\n        checkOrder: true,\n        ref: timeframeSelectorRef,\n        expectedFormat: formatString,\n        valueMode: 'timeframeSelector',\n        required,\n        errorMessages: TIMEFRAMESELECTOR_ERROR_MESSAGES,\n      });\n      return getValidationState(\n        errorKey !== undefined ? new ValidityStateKey(errorKey) : undefined,\n        'manual',\n        getValidationMessage(errorKey),\n        [inputId],\n      );\n    },\n  );\n\n  const getValidationMessage = useCallback(\n    (errorKey: TimeErrorKey | undefined): string | undefined => {\n      if (!errorKey) {\n        return undefined;\n      }\n      return formatTimeValidationMessage(errorKey, intl, {\n        value,\n        min,\n        max,\n        precision,\n        expectedFormat: formatString,\n        errorMessages: TIMEFRAMESELECTOR_ERROR_MESSAGES,\n      });\n    },\n    [intl, value, min, max, precision, formatString],\n  );\n\n  /** Handle overlay on open change. */\n  const onOpenChange = useCallback(\n    (isOpen: boolean) => {\n      if (!isOpen) {\n        formFieldMessagesDispatch?.({\n          type: FormFieldMessagesAction.SETISTOUCHED,\n          payload: { isTouched: true },\n        });\n        setDateTimeRangePickerTimeframe(value);\n\n        if (!formFieldMessagesState.isTouched) {\n          const errorKey = validate(value, min, max, {\n            precision,\n            checkOrder: true,\n            ref: timeframeSelectorRef,\n            expectedFormat: formatString,\n            valueMode: 'timeframeSelector',\n            required,\n            errorMessages: TIMEFRAMESELECTOR_ERROR_MESSAGES,\n          });\n          emitValidationState(\n            getValidationState(\n              errorKey !== undefined\n                ? new ValidityStateKey(errorKey)\n                : undefined,\n              'blur',\n              getValidationMessage(errorKey),\n              [inputId],\n            ),\n          );\n        }\n      }\n    },\n    [\n      emitValidationState,\n      formFieldMessagesDispatch,\n      formFieldMessagesState.isTouched,\n      formatString,\n      max,\n      min,\n      precision,\n      required,\n      setDateTimeRangePickerTimeframe,\n      timeframeSelectorRef,\n      value,\n    ],\n  );\n\n  const {\n    targetRef,\n    overlayRef,\n    triggerRef,\n    overlayProps,\n    overlayState,\n    overlayTriggerProps,\n  } = useOverlayWithTrigger({\n    offset: 4,\n    placement: 'bottom-start',\n    placementFallbacks: ['bottom-end', 'top-start', 'top-end'],\n    heightStrategy: 'maxViewport',\n    disabled,\n    onOpenChange,\n  });\n\n  // Prefetch timeframe presets on mount so opening the overlay can use cached data immediately.\n  useEffect(() => {\n    if (timeframeQueryClient.getQueryData(TIMEFRAME_PRESETS_QUERY_KEY)) {\n      return;\n    }\n\n    timeframeQueryClient\n      .prefetchQuery({\n        queryKey: TIMEFRAME_PRESETS_QUERY_KEY,\n        queryFn: getTimeframePresets,\n      })\n      .catch(() => undefined);\n  }, []);\n\n  const details = useMemo((): TimeframeValueDetails | null => {\n    const { from, to } = parseValue(value);\n    return from && to ? { from, to } : null;\n  }, [value]);\n\n  const { customTrigger, trigger, presets, presetItemsDisplayValuesMap } =\n    useMemo(() => getItemSlots(children, precision), [children, precision]);\n\n  const presetItemName = presetItemsDisplayValuesMap.get(\n    `${details?.from?.value} ${details?.to?.value}`,\n  );\n\n  const {\n    displayValue,\n    isInvalid: displayValueError,\n    hint: displayValueHint,\n  } = getTimeframeDisplayValueProps(\n    value,\n    intl,\n    placeholder,\n    precision,\n    presetItemName,\n    required,\n    min?.value,\n    max?.value,\n  );\n\n  const triggerErrorId = useId();\n  const inputId = useId();\n  const overlayOwnerId = useId();\n\n  // We need to create a ref to give access to the trigger in our imperative handle.\n  const imperativeTriggerRef = useRef<HTMLButtonElement>(null);\n  const containerRef = useRef<HTMLDivElement>(null);\n  const fromInputRef = useRef<HTMLInputElement>(null);\n  const toInputRef = useRef<HTMLInputElement>(null);\n  const ariaLabelingProps = {\n    'aria-label':\n      ariaLabelProp ??\n      (!ariaLabelledByProp && !formFieldLabelId\n        ? defaultTriggerLabel\n        : undefined),\n    'aria-labelledby': ariaLabelledByProp,\n    'aria-describedby': ariaDescribedByProp,\n    'aria-details': ariaDetailsProp,\n  };\n  const ariaFormProps = useFormFieldValidationAriaProps(ariaLabelingProps);\n\n  const validateField = useCallback(\n    ({ reveal, trigger }: ValidateFieldOptions): ValidationState => {\n      if (reveal) {\n        formFieldMessagesDispatch?.({\n          type: FormFieldMessagesAction.SETISTOUCHED,\n          payload: { isTouched: true },\n        });\n      }\n      const errorKey = validate(value, min, max, {\n        precision,\n        checkOrder: true,\n        ref: timeframeSelectorRef,\n        expectedFormat: formatString,\n        valueMode: 'timeframeSelector',\n        required,\n        errorMessages: TIMEFRAMESELECTOR_ERROR_MESSAGES,\n      });\n      return emitValidationState(\n        getValidationState(\n          errorKey !== undefined ? new ValidityStateKey(errorKey) : undefined,\n          trigger,\n          getValidationMessage(errorKey),\n          [inputId],\n        ),\n      );\n    },\n    [\n      formFieldMessagesDispatch,\n      emitValidationState,\n      value,\n      min,\n      max,\n      precision,\n      timeframeSelectorRef,\n      formatString,\n      required,\n      getValidationMessage,\n      inputId,\n    ],\n  );\n\n  const formRegistration = useInternalFormRegistration({\n    id,\n    name,\n    form: _form,\n    messageTarget: _messageTarget,\n    onValidityChange,\n    getValue: () => value,\n    focus: () => imperativeTriggerRef.current?.focus(),\n    validateField: (options) => Promise.resolve(validateField(options)),\n    resetValidation: () => {\n      formFieldMessagesDispatch?.({\n        type: FormFieldMessagesAction.SETISTOUCHED,\n        payload: { isTouched: false },\n      });\n      formFieldMessagesDispatch?.({\n        type: FormFieldMessagesAction.REMOVEMESSAGE,\n        payload: {\n          id: triggerErrorId,\n          messageType: 'formcontrol',\n          controlId: inputId,\n        },\n      });\n      for (const msg of formFieldMessagesState.customMessages) {\n        formFieldMessagesDispatch?.({\n          type: FormFieldMessagesAction.REMOVEMESSAGE,\n          payload: { id: msg.id, messageType: 'custom' },\n        });\n      }\n    },\n  });\n  formValidityChangeRef.current = formRegistration.onValidityChange;\n\n  useImperativeHandle(\n    forwardedRef,\n    (): TimeRangePickerRef => ({\n      element: containerRef.current,\n      triggerRef: imperativeTriggerRef.current,\n      inputRef: { from: fromInputRef.current, to: toInputRef.current },\n      open: overlayState.open,\n      close: overlayState.close,\n      focus() {\n        imperativeTriggerRef.current?.focus?.();\n      },\n      validate() {\n        formFieldMessagesDispatch?.({\n          type: FormFieldMessagesAction.SETISTOUCHED,\n          payload: { isTouched: true },\n        });\n\n        const errorKey = validate(value, min, max, {\n          formMessageDispatch: formFieldMessagesDispatch,\n          precision,\n          showError: false,\n          checkOrder: true,\n          ref: timeframeSelectorRef,\n          expectedFormat: formatString,\n          valueMode: 'timeframeSelector',\n          required,\n          errorMessages: TIMEFRAMESELECTOR_ERROR_MESSAGES,\n        });\n\n        emitValidationState(\n          getValidationState(\n            errorKey !== undefined ? new ValidityStateKey(errorKey) : undefined,\n            'manual',\n            getValidationMessage(errorKey),\n            [inputId],\n          ),\n        );\n      },\n      // DEPRECATION: [APPDEV-18178] BREAKING-CHANGE: Remove validateAsync() and change validate() to return Promise<ValidationState>.\n      validateAsync: async () => {\n        formFieldMessagesDispatch?.({\n          type: FormFieldMessagesAction.SETISTOUCHED,\n          payload: { isTouched: true },\n        });\n\n        const errorKey = validate(value, min, max, {\n          formMessageDispatch: formFieldMessagesDispatch,\n          precision,\n          showError: false,\n          checkOrder: true,\n          ref: timeframeSelectorRef,\n          expectedFormat: formatString,\n          valueMode: 'timeframeSelector',\n          required,\n          errorMessages: TIMEFRAMESELECTOR_ERROR_MESSAGES,\n        });\n\n        const state = getValidationState(\n          errorKey !== undefined ? new ValidityStateKey(errorKey) : undefined,\n          'manual',\n          getValidationMessage(errorKey),\n          [inputId],\n        );\n        return emitValidationState(state);\n      },\n    }),\n    [\n      formFieldMessagesDispatch,\n      emitValidationState,\n      getValidationMessage,\n      overlayState.close,\n      overlayState.open,\n    ],\n  );\n\n  useEffect(() => {\n    if (overlayState.isOpen) {\n      return;\n    }\n\n    if (!displayValueError && triggerErrorId) {\n      formFieldMessagesDispatch?.({\n        type: FormFieldMessagesAction.REMOVEMESSAGE,\n        payload: {\n          id: triggerErrorId,\n          messageType: 'formcontrol',\n          controlId: inputId,\n        },\n      });\n    }\n  }, [\n    displayValueError,\n    displayValueHint,\n    overlayState.isOpen,\n    triggerErrorId,\n    formFieldMessagesDispatch,\n    inputId,\n  ]);\n\n  // Surface the validation state on every value change (automatic `change`\n  // trigger) so `onValidityChange` stays in sync as the timeframe is edited, not just\n  // on blur or manual validation. The error key is computed without dispatching\n  // messages \u2014 the displayed error is already driven by the value pipeline.\n  useEffect(() => {\n    const errorKey = validate(value, min, max, {\n      precision,\n      checkOrder: true,\n      ref: timeframeSelectorRef,\n      expectedFormat: formatString,\n      valueMode: 'timeframeSelector',\n      required,\n      errorMessages: TIMEFRAMESELECTOR_ERROR_MESSAGES,\n    });\n    emitValidationState(\n      getValidationState(\n        errorKey !== undefined ? new ValidityStateKey(errorKey) : undefined,\n        'change',\n        getValidationMessage(errorKey),\n        [inputId],\n      ),\n    );\n  }, [\n    value,\n    min,\n    max,\n    precision,\n    formatString,\n    required,\n    timeframeSelectorRef,\n    emitValidationState,\n    getValidationMessage,\n  ]);\n\n  const triggerButtonRef = useMergeRefs([\n    targetRef,\n    triggerRef,\n    imperativeTriggerRef,\n  ]);\n\n  const handleOnBlur = useCallback(() => {\n    if (!overlayState.isOpen) {\n      fromInputRef.current?.reportValidity();\n      formFieldMessagesDispatch?.({\n        type: FormFieldMessagesAction.SETISTOUCHED,\n        payload: { isTouched: true },\n      });\n\n      if (!formFieldMessagesState.isTouched) {\n        const errorKey = validate(value, min, max, {\n          precision,\n          checkOrder: true,\n          ref: timeframeSelectorRef,\n          expectedFormat: formatString,\n          valueMode: 'timeframeSelector',\n          required,\n          errorMessages: TIMEFRAMESELECTOR_ERROR_MESSAGES,\n        });\n        emitValidationState(\n          getValidationState(\n            errorKey !== undefined ? new ValidityStateKey(errorKey) : undefined,\n            'blur',\n            getValidationMessage(errorKey),\n            [inputId],\n          ),\n        );\n      }\n    }\n  }, [\n    overlayState.isOpen,\n    formFieldMessagesDispatch,\n    formFieldMessagesState.isTouched,\n    emitValidationState,\n    getValidationMessage,\n    value,\n    min,\n    max,\n    precision,\n    timeframeSelectorRef,\n    formatString,\n    required,\n  ]);\n\n  const { containerClassName, ...containerFocusProps } = useContainerFocus({\n    onFocus,\n    onBlur,\n    disabled,\n    overlayOwnerId,\n    // When the overlay is open, autoFocus moves focus into the portal. The browser\n    // fires a blur on the trigger with relatedTarget=null (the portal is outside the\n    // container DOM). Suppress that blur so hasFocusRef stays true and focus\n    // returning to the trigger on close does not re-fire onFocus.\n    shouldSuppressBlur: () => overlayState.isOpen,\n  });\n\n  const triggerProps = useMemo(\n    () => ({\n      disabled,\n      onBlur: handleOnBlur,\n      ref: triggerButtonRef,\n      id,\n      'aria-disabled': ariaDisabled,\n      ...ariaFormProps,\n      ...(readOnly ? {} : overlayTriggerProps),\n      'data-dt-component': COMPONENT_NAME,\n    }),\n    [\n      disabled,\n      handleOnBlur,\n      triggerButtonRef,\n      id,\n      ariaDisabled,\n      ariaFormProps,\n      readOnly,\n      overlayTriggerProps,\n    ],\n  );\n\n  const timeframeSelectorContextValue = useMemo(\n    () => ({\n      details,\n      displayValue,\n      triggerProps,\n      hint: displayValueHint,\n      readOnly,\n      showError,\n      disabled,\n    }),\n    [\n      disabled,\n      details,\n      readOnly,\n      displayValue,\n      triggerProps,\n      displayValueHint,\n      showError,\n    ],\n  );\n\n  return (\n    <TimeframeSelectorContext.Provider value={timeframeSelectorContextValue}>\n      <Flex\n        gap={4}\n        flexDirection=\"column\"\n        data-testid={dataTestId}\n        data-dtrum-mask={dataDtrumMask}\n        data-dtrum-allow={dataDtrumAllow}\n        ref={containerRef}\n        className={clsx(consumerClassName, containerClassName, styles.root)}\n        style={consumerStyle}\n        {...remainingProps}\n        data-dt-component=\"TimeframeSelector\"\n        {...containerFocusProps}\n      >\n        <VisuallyHidden>\n          <input\n            id={inputId}\n            type=\"text\"\n            ref={fromInputRef}\n            name={name && `${name}-from`}\n            form={_form}\n            aria-hidden={true}\n            readOnly={readOnly}\n            required={required}\n            disabled={disabled}\n            value={details?.from.value ?? ''}\n            onInvalid={(event) => {\n              formFieldMessagesDispatch?.({\n                type: FormFieldMessagesAction.SETISTOUCHED,\n                payload: { isTouched: true },\n              });\n\n              // Prevents the browser validation pop up.\n              event.preventDefault();\n            }}\n            onChange={() => {\n              /** noop */\n            }}\n            tabIndex={-1}\n            {...ariaFormProps}\n          />\n          <input\n            type=\"text\"\n            ref={toInputRef}\n            name={name && `${name}-to`}\n            form={_form}\n            aria-hidden={true}\n            readOnly={readOnly}\n            required={required}\n            disabled={disabled}\n            value={details?.to.value ?? ''}\n            onInvalid={(event) => event.preventDefault()}\n            onChange={() => {\n              /**noop */\n            }}\n            tabIndex={-1}\n            {...ariaFormProps}\n          />\n        </VisuallyHidden>\n        <InputGroup style={{ gridAutoColumns: '1fr max-content max-content' }}>\n          <TimeframeSelectorTooltip\n            displayValue={displayValue}\n            value={value}\n            disabled={disabled}\n          >\n            {customTrigger ?? trigger ?? <Trigger />}\n          </TimeframeSelectorTooltip>\n          {stepper && (\n            <>\n              <StepperButton\n                disabled={disabled || readOnly}\n                direction=\"backward\"\n                aria-disabled={ariaDisabled}\n                onBlur={handleOnBlur}\n              />\n              <StepperButton\n                disabled={disabled || readOnly}\n                direction=\"forward\"\n                aria-disabled={ariaDisabled}\n                onBlur={handleOnBlur}\n              />\n            </>\n          )}\n        </InputGroup>\n        {hint && (\n          <BaseItem\n            variant={showError ? 'error' : 'hint'}\n            disabled={disabled || !!ariaDisabled}\n            {...hintProps}\n          >\n            {hint}\n          </BaseItem>\n        )}\n        {overlayState.isOpen && (\n          <TimeframeSelectorOverlay\n            ref={overlayRef}\n            overlayProps={overlayProps}\n            overlayClose={overlayState.close}\n            overlayOwnerId={overlayOwnerId}\n            // oxlint-disable-next-line typescript/no-deprecated\n            clearable={clearable}\n            data-dtrum-mask={dataDtrumMask}\n            data-dtrum-allow={dataDtrumAllow}\n          >\n            {presets}\n          </TimeframeSelectorOverlay>\n        )}\n      </Flex>\n    </TimeframeSelectorContext.Provider>\n  );\n});\n"],
   "mappings": "AAksBQ,SAsDI,UArDF,KADF;AAlsBR,OAAO,UAAU;AACjB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OAGK;AACP,SAAS,eAAe;AAExB,SAAS,gCAAgC;AACzC,SAAS,kBAAkB;AAC3B,SAAS,eAAe;AACxB,SAAS,qBAAqB;AAC9B,SAAS,gCAAgC;AACzC;AAAA,EACE;AAAA,OAEK;AACP;AAAA,EACE;AAAA,EACA;AAAA,OAEK;AACP;AAAA,EACE;AAAA,EACA;AAAA,OACK;AACP,SAAS,gCAAgC;AACzC,YAAY,YAAY;AAKxB,SAAS,qCAAqC;AAC9C,SAAS,2BAA2B;AACpC;AAAA,EACE;AAAA,EACA;AAAA,OACK;AACP,SAAS,sBAAsB;AAC/B,SAAS,aAAa;AACtB,SAAS,oBAAoB;AAE7B,SAAS,iCAAiC;AAC1C;AAAA,EACE;AAAA,EACA;AAAA,OACK;AACP,SAAS,cAAc;AACvB,SAAS,cAAc;AAEvB,SAAS,mCAAmC;AAC5C,SAAS,oBAAoB,gBAAgB;AAE7C,SAAS,2BAA2B;AACpC,SAAS,uCAAuC;AAChD,SAAS,uBAAuB;AAChC,SAAS,+BAA+B;AACxC;AAAA,EACE;AAAA,EACA;AAAA,OACK;AACP,SAAS,yBAAyB;AAElC;AAAA,EACE;AAAA,OAEK;AACP,SAAS,+BAA+B;AACxC,SAAS,iCAAiC;AAC1C,SAAS,0BAA0B;AACnC,SAAS,YAAY;AACrB,SAAS,kBAAkB;AAC3B,SAAS,6BAA6B;AAEtC,MAAM,iBAAiB;AAYvB,SAAS,aAAa,UAAqB,WAAuB;AAChE,QAAM,8BAA8B,oBAAI,IAAI;AAC5C,QAAM,QAAiD;AAAA,IACrD,SAAS;AAAA,IACT,eAAe;AAAA,IACf,SAAS;AAAA,IACT;AAAA,EACF;AAEA,aAAW,SAAS,SAAS,QAAQ,QAAQ,GAAG;AAC9C,QAAI,OAAO,OAAO,OAAO,GAAG;AAC1B,YAAM,UAAU;AAChB,iBAAW,aAAa,SAAS,QAAQ,MAAM,MAAM,QAAQ,GAAG;AAC9D,YAAI,OAAO,WAAW,UAAU,GAAG;AACjC,gBAAM,4BAA4B;AAAA,YAChC,GAAG;AAAA,cACD,UAAU,MAAM,MAAM;AAAA,cACtB;AAAA,YACF,CAAC,IAAI,gBAAgB,UAAU,MAAM,MAAM,IAAI,SAAS,CAAC;AAAA,YACzD,UAAU,MAAM;AAAA,UAClB;AAAA,QACF;AAAA,MACF;AAAA,IACF,WAAW,wCAAwC,KAAK,GAAG;AACzD,YAAM,gBAAgB;AAAA,IACxB,WAAW,kCAAkC,KAAK,GAAG;AACnD,YAAM,UAAU;AAAA,IAClB,OAAO;AAEL,aAAO,2DAA2D;AAAA,IACpE;AAAA,EACF;AAEA,SAAO;AACT;AAGO,MAAM,wBAAwB,WAanC,CAAC,OAAO,iBAAiB;AACzB,QAAM,OAAO,QAAQ;AACrB,QAAM,EAAE,iBAAiB,IAAI,oBAAoB;AACjD,QAAM;AAAA,IACJ,OAAO;AAAA,IACP;AAAA;AAAA,IAEA,YAAY;AAAA,IACZ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,WAAW;AAAA,IACX,OAAO;AAAA,IACP,eAAe;AAAA,IACf,mBAAmB;AAAA,IACnB,oBAAoB;AAAA,IACpB;AAAA,IACA;AAAA,IACA;AAAA,IACA,UAAU;AAAA,IACV;AAAA,IACA,cAAc;AAAA,IACd,mBAAmB;AAAA,IACnB,oBAAoB;AAAA,IACpB,gBAAgB;AAAA,IAChB;AAAA,IACA,GAAG;AAAA,EACL,IAAI;AACJ,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,WAAW;AAAA,IACX;AAAA,IACA;AAAA,IACA;AAAA,IACA,cAAc;AAAA,IACd,iBAAiB;AAAA,EACnB,IAAI;AACJ,QAAM,QAAQ;AAAA,IACZ,CAAC,UAAU,MAAM;AAAA,EACnB;AACA,QAAM,YAAY,0BAA0B,CAAC,UAAU,MAAM,SAAS;AACtE,QAAM,MAAM,0BAA0B,CAAC,UAAU,MAAM,GAAG;AAC1D,QAAM,MAAM,0BAA0B,CAAC,UAAU,MAAM,GAAG;AAC1D,QAAM,eAAe,0BAA0B,CAAC,UAAU,MAAM,YAAY;AAC5E,QAAM,uBAAuB;AAAA,IAC3B,CAAC,UAAU,MAAM;AAAA,EACnB;AACA,QAAM,kCAAkC;AAAA,IACtC,CAAC,UAAU,MAAM;AAAA,EACnB;AAEA,QAAM,cAAc,KAAK,cAAc;AAAA,IACrC,gBAAgB;AAAA,IAChB,IAAI;AAAA,IACJ,aAAa;AAAA,EACf,CAAC;AAED,QAAM,sBAAsB,KAAK;AAAA,IAC/B,4BAA4B;AAAA,EAC9B;AAGA,kBAAgB,KAAK,KAAK,mBAAmB;AAE7C,QAAM,wBAAwB,OAE5B,MAAS;AACX,QAAM,uBAAuB;AAAA,IAA0B,CAAC,UACtD,sBAAsB,UAAU,KAAK;AAAA,EACvC;AACA,QAAM,sBAAsB;AAAA,IAC1B;AAAA,IACA,MAAM;AACJ,YAAM,WAAW,SAAS,OAAO,KAAK,KAAK;AAAA,QACzC;AAAA,QACA,YAAY;AAAA,QACZ,KAAK;AAAA,QACL,gBAAgB;AAAA,QAChB,WAAW;AAAA,QACX;AAAA,QACA,eAAe;AAAA,MACjB,CAAC;AACD,aAAO;AAAA,QACL,aAAa,SAAY,IAAI,iBAAiB,QAAQ,IAAI;AAAA,QAC1D;AAAA,QACA,qBAAqB,QAAQ;AAAA,QAC7B,CAAC,OAAO;AAAA,MACV;AAAA,IACF;AAAA,EACF;AAEA,QAAM,uBAAuB;AAAA,IAC3B,CAAC,aAA2D;AAC1D,UAAI,CAAC,UAAU;AACb,eAAO;AAAA,MACT;AACA,aAAO,4BAA4B,UAAU,MAAM;AAAA,QACjD;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA,gBAAgB;AAAA,QAChB,eAAe;AAAA,MACjB,CAAC;AAAA,IACH;AAAA,IACA,CAAC,MAAM,OAAO,KAAK,KAAK,WAAW,YAAY;AAAA,EACjD;AAGA,QAAM,eAAe;AAAA,IACnB,CAAC,WAAoB;AACnB,UAAI,CAAC,QAAQ;AACX,oCAA4B;AAAA,UAC1B,MAAM,wBAAwB;AAAA,UAC9B,SAAS,EAAE,WAAW,KAAK;AAAA,QAC7B,CAAC;AACD,wCAAgC,KAAK;AAErC,YAAI,CAAC,uBAAuB,WAAW;AACrC,gBAAM,WAAW,SAAS,OAAO,KAAK,KAAK;AAAA,YACzC;AAAA,YACA,YAAY;AAAA,YACZ,KAAK;AAAA,YACL,gBAAgB;AAAA,YAChB,WAAW;AAAA,YACX;AAAA,YACA,eAAe;AAAA,UACjB,CAAC;AACD;AAAA,YACE;AAAA,cACE,aAAa,SACT,IAAI,iBAAiB,QAAQ,IAC7B;AAAA,cACJ;AAAA,cACA,qBAAqB,QAAQ;AAAA,cAC7B,CAAC,OAAO;AAAA,YACV;AAAA,UACF;AAAA,QACF;AAAA,MACF;AAAA,IACF;AAAA,IACA;AAAA,MACE;AAAA,MACA;AAAA,MACA,uBAAuB;AAAA,MACvB;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AAEA,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI,sBAAsB;AAAA,IACxB,QAAQ;AAAA,IACR,WAAW;AAAA,IACX,oBAAoB,CAAC,cAAc,aAAa,SAAS;AAAA,IACzD,gBAAgB;AAAA,IAChB;AAAA,IACA;AAAA,EACF,CAAC;AAGD,YAAU,MAAM;AACd,QAAI,qBAAqB,aAAa,2BAA2B,GAAG;AAClE;AAAA,IACF;AAEA,yBACG,cAAc;AAAA,MACb,UAAU;AAAA,MACV,SAAS;AAAA,IACX,CAAC,EACA,MAAM,MAAM,MAAS;AAAA,EAC1B,GAAG,CAAC,CAAC;AAEL,QAAM,UAAU,QAAQ,MAAoC;AAC1D,UAAM,EAAE,MAAM,GAAG,IAAI,WAAW,KAAK;AACrC,WAAO,QAAQ,KAAK,EAAE,MAAM,GAAG,IAAI;AAAA,EACrC,GAAG,CAAC,KAAK,CAAC;AAEV,QAAM,EAAE,eAAe,SAAS,SAAS,4BAA4B,IACnE,QAAQ,MAAM,aAAa,UAAU,SAAS,GAAG,CAAC,UAAU,SAAS,CAAC;AAExE,QAAM,iBAAiB,4BAA4B;AAAA,IACjD,GAAG,SAAS,MAAM,KAAK,IAAI,SAAS,IAAI,KAAK;AAAA,EAC/C;AAEA,QAAM;AAAA,IACJ;AAAA,IACA,WAAW;AAAA,IACX,MAAM;AAAA,EACR,IAAI;AAAA,IACF;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,KAAK;AAAA,IACL,KAAK;AAAA,EACP;AAEA,QAAM,iBAAiB,MAAM;AAC7B,QAAM,UAAU,MAAM;AACtB,QAAM,iBAAiB,MAAM;AAG7B,QAAM,uBAAuB,OAA0B,IAAI;AAC3D,QAAM,eAAe,OAAuB,IAAI;AAChD,QAAM,eAAe,OAAyB,IAAI;AAClD,QAAM,aAAa,OAAyB,IAAI;AAChD,QAAM,oBAAoB;AAAA,IACxB,cACE,kBACC,CAAC,sBAAsB,CAAC,mBACrB,sBACA;AAAA,IACN,mBAAmB;AAAA,IACnB,oBAAoB;AAAA,IACpB,gBAAgB;AAAA,EAClB;AACA,QAAM,gBAAgB,gCAAgC,iBAAiB;AAEvE,QAAM,gBAAgB;AAAA,IACpB,CAAC,EAAE,QAAQ,SAAAA,SAAQ,MAA6C;AAC9D,UAAI,QAAQ;AACV,oCAA4B;AAAA,UAC1B,MAAM,wBAAwB;AAAA,UAC9B,SAAS,EAAE,WAAW,KAAK;AAAA,QAC7B,CAAC;AAAA,MACH;AACA,YAAM,WAAW,SAAS,OAAO,KAAK,KAAK;AAAA,QACzC;AAAA,QACA,YAAY;AAAA,QACZ,KAAK;AAAA,QACL,gBAAgB;AAAA,QAChB,WAAW;AAAA,QACX;AAAA,QACA,eAAe;AAAA,MACjB,CAAC;AACD,aAAO;AAAA,QACL;AAAA,UACE,aAAa,SAAY,IAAI,iBAAiB,QAAQ,IAAI;AAAA,UAC1DA;AAAA,UACA,qBAAqB,QAAQ;AAAA,UAC7B,CAAC,OAAO;AAAA,QACV;AAAA,MACF;AAAA,IACF;AAAA,IACA;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AAEA,QAAM,mBAAmB,4BAA4B;AAAA,IACnD;AAAA,IACA;AAAA,IACA,MAAM;AAAA,IACN,eAAe;AAAA,IACf;AAAA,IACA,UAAU,MAAM;AAAA,IAChB,OAAO,MAAM,qBAAqB,SAAS,MAAM;AAAA,IACjD,eAAe,CAAC,YAAY,QAAQ,QAAQ,cAAc,OAAO,CAAC;AAAA,IAClE,iBAAiB,MAAM;AACrB,kCAA4B;AAAA,QAC1B,MAAM,wBAAwB;AAAA,QAC9B,SAAS,EAAE,WAAW,MAAM;AAAA,MAC9B,CAAC;AACD,kCAA4B;AAAA,QAC1B,MAAM,wBAAwB;AAAA,QAC9B,SAAS;AAAA,UACP,IAAI;AAAA,UACJ,aAAa;AAAA,UACb,WAAW;AAAA,QACb;AAAA,MACF,CAAC;AACD,iBAAW,OAAO,uBAAuB,gBAAgB;AACvD,oCAA4B;AAAA,UAC1B,MAAM,wBAAwB;AAAA,UAC9B,SAAS,EAAE,IAAI,IAAI,IAAI,aAAa,SAAS;AAAA,QAC/C,CAAC;AAAA,MACH;AAAA,IACF;AAAA,EACF,CAAC;AACD,wBAAsB,UAAU,iBAAiB;AAEjD;AAAA,IACE;AAAA,IACA,OAA2B;AAAA,MACzB,SAAS,aAAa;AAAA,MACtB,YAAY,qBAAqB;AAAA,MACjC,UAAU,EAAE,MAAM,aAAa,SAAS,IAAI,WAAW,QAAQ;AAAA,MAC/D,MAAM,aAAa;AAAA,MACnB,OAAO,aAAa;AAAA,MACpB,QAAQ;AACN,6BAAqB,SAAS,QAAQ;AAAA,MACxC;AAAA,MACA,WAAW;AACT,oCAA4B;AAAA,UAC1B,MAAM,wBAAwB;AAAA,UAC9B,SAAS,EAAE,WAAW,KAAK;AAAA,QAC7B,CAAC;AAED,cAAM,WAAW,SAAS,OAAO,KAAK,KAAK;AAAA,UACzC,qBAAqB;AAAA,UACrB;AAAA,UACA,WAAW;AAAA,UACX,YAAY;AAAA,UACZ,KAAK;AAAA,UACL,gBAAgB;AAAA,UAChB,WAAW;AAAA,UACX;AAAA,UACA,eAAe;AAAA,QACjB,CAAC;AAED;AAAA,UACE;AAAA,YACE,aAAa,SAAY,IAAI,iBAAiB,QAAQ,IAAI;AAAA,YAC1D;AAAA,YACA,qBAAqB,QAAQ;AAAA,YAC7B,CAAC,OAAO;AAAA,UACV;AAAA,QACF;AAAA,MACF;AAAA;AAAA,MAEA,eAAe,YAAY;AACzB,oCAA4B;AAAA,UAC1B,MAAM,wBAAwB;AAAA,UAC9B,SAAS,EAAE,WAAW,KAAK;AAAA,QAC7B,CAAC;AAED,cAAM,WAAW,SAAS,OAAO,KAAK,KAAK;AAAA,UACzC,qBAAqB;AAAA,UACrB;AAAA,UACA,WAAW;AAAA,UACX,YAAY;AAAA,UACZ,KAAK;AAAA,UACL,gBAAgB;AAAA,UAChB,WAAW;AAAA,UACX;AAAA,UACA,eAAe;AAAA,QACjB,CAAC;AAED,cAAM,QAAQ;AAAA,UACZ,aAAa,SAAY,IAAI,iBAAiB,QAAQ,IAAI;AAAA,UAC1D;AAAA,UACA,qBAAqB,QAAQ;AAAA,UAC7B,CAAC,OAAO;AAAA,QACV;AACA,eAAO,oBAAoB,KAAK;AAAA,MAClC;AAAA,IACF;AAAA,IACA;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA,aAAa;AAAA,MACb,aAAa;AAAA,IACf;AAAA,EACF;AAEA,YAAU,MAAM;AACd,QAAI,aAAa,QAAQ;AACvB;AAAA,IACF;AAEA,QAAI,CAAC,qBAAqB,gBAAgB;AACxC,kCAA4B;AAAA,QAC1B,MAAM,wBAAwB;AAAA,QAC9B,SAAS;AAAA,UACP,IAAI;AAAA,UACJ,aAAa;AAAA,UACb,WAAW;AAAA,QACb;AAAA,MACF,CAAC;AAAA,IACH;AAAA,EACF,GAAG;AAAA,IACD;AAAA,IACA;AAAA,IACA,aAAa;AAAA,IACb;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAMD,YAAU,MAAM;AACd,UAAM,WAAW,SAAS,OAAO,KAAK,KAAK;AAAA,MACzC;AAAA,MACA,YAAY;AAAA,MACZ,KAAK;AAAA,MACL,gBAAgB;AAAA,MAChB,WAAW;AAAA,MACX;AAAA,MACA,eAAe;AAAA,IACjB,CAAC;AACD;AAAA,MACE;AAAA,QACE,aAAa,SAAY,IAAI,iBAAiB,QAAQ,IAAI;AAAA,QAC1D;AAAA,QACA,qBAAqB,QAAQ;AAAA,QAC7B,CAAC,OAAO;AAAA,MACV;AAAA,IACF;AAAA,EACF,GAAG;AAAA,IACD;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAED,QAAM,mBAAmB,aAAa;AAAA,IACpC;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAED,QAAM,eAAe,YAAY,MAAM;AACrC,QAAI,CAAC,aAAa,QAAQ;AACxB,mBAAa,SAAS,eAAe;AACrC,kCAA4B;AAAA,QAC1B,MAAM,wBAAwB;AAAA,QAC9B,SAAS,EAAE,WAAW,KAAK;AAAA,MAC7B,CAAC;AAED,UAAI,CAAC,uBAAuB,WAAW;AACrC,cAAM,WAAW,SAAS,OAAO,KAAK,KAAK;AAAA,UACzC;AAAA,UACA,YAAY;AAAA,UACZ,KAAK;AAAA,UACL,gBAAgB;AAAA,UAChB,WAAW;AAAA,UACX;AAAA,UACA,eAAe;AAAA,QACjB,CAAC;AACD;AAAA,UACE;AAAA,YACE,aAAa,SAAY,IAAI,iBAAiB,QAAQ,IAAI;AAAA,YAC1D;AAAA,YACA,qBAAqB,QAAQ;AAAA,YAC7B,CAAC,OAAO;AAAA,UACV;AAAA,QACF;AAAA,MACF;AAAA,IACF;AAAA,EACF,GAAG;AAAA,IACD,aAAa;AAAA,IACb;AAAA,IACA,uBAAuB;AAAA,IACvB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAED,QAAM,EAAE,oBAAoB,GAAG,oBAAoB,IAAI,kBAAkB;AAAA,IACvE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA,IAKA,oBAAoB,MAAM,aAAa;AAAA,EACzC,CAAC;AAED,QAAM,eAAe;AAAA,IACnB,OAAO;AAAA,MACL;AAAA,MACA,QAAQ;AAAA,MACR,KAAK;AAAA,MACL;AAAA,MACA,iBAAiB;AAAA,MACjB,GAAG;AAAA,MACH,GAAI,WAAW,CAAC,IAAI;AAAA,MACpB,qBAAqB;AAAA,IACvB;AAAA,IACA;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AAEA,QAAM,gCAAgC;AAAA,IACpC,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA,MAAM;AAAA,MACN;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACA;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AAEA,SACE,oBAAC,yBAAyB,UAAzB,EAAkC,OAAO,+BACxC;AAAA,IAAC;AAAA;AAAA,MACC,KAAK;AAAA,MACL,eAAc;AAAA,MACd,eAAa;AAAA,MACb,mBAAiB;AAAA,MACjB,oBAAkB;AAAA,MAClB,KAAK;AAAA,MACL,WAAW,KAAK,mBAAmB,oBAAoB,OAAO,IAAI;AAAA,MAClE,OAAO;AAAA,MACN,GAAG;AAAA,MACJ,qBAAkB;AAAA,MACjB,GAAG;AAAA,MAEJ;AAAA,6BAAC,kBACC;AAAA;AAAA,YAAC;AAAA;AAAA,cACC,IAAI;AAAA,cACJ,MAAK;AAAA,cACL,KAAK;AAAA,cACL,MAAM,QAAQ,GAAG,IAAI;AAAA,cACrB,MAAM;AAAA,cACN,eAAa;AAAA,cACb;AAAA,cACA;AAAA,cACA;AAAA,cACA,OAAO,SAAS,KAAK,SAAS;AAAA,cAC9B,WAAW,CAAC,UAAU;AACpB,4CAA4B;AAAA,kBAC1B,MAAM,wBAAwB;AAAA,kBAC9B,SAAS,EAAE,WAAW,KAAK;AAAA,gBAC7B,CAAC;AAGD,sBAAM,eAAe;AAAA,cACvB;AAAA,cACA,UAAU,MAAM;AAAA,cAEhB;AAAA,cACA,UAAU;AAAA,cACT,GAAG;AAAA;AAAA,UACN;AAAA,UACA;AAAA,YAAC;AAAA;AAAA,cACC,MAAK;AAAA,cACL,KAAK;AAAA,cACL,MAAM,QAAQ,GAAG,IAAI;AAAA,cACrB,MAAM;AAAA,cACN,eAAa;AAAA,cACb;AAAA,cACA;AAAA,cACA;AAAA,cACA,OAAO,SAAS,GAAG,SAAS;AAAA,cAC5B,WAAW,CAAC,UAAU,MAAM,eAAe;AAAA,cAC3C,UAAU,MAAM;AAAA,cAEhB;AAAA,cACA,UAAU;AAAA,cACT,GAAG;AAAA;AAAA,UACN;AAAA,WACF;AAAA,QACA,qBAAC,cAAW,OAAO,EAAE,iBAAiB,8BAA8B,GAClE;AAAA;AAAA,YAAC;AAAA;AAAA,cACC;AAAA,cACA;AAAA,cACA;AAAA,cAEC,2BAAiB,WAAW,oBAAC,WAAQ;AAAA;AAAA,UACxC;AAAA,UACC,WACC,iCACE;AAAA;AAAA,cAAC;AAAA;AAAA,gBACC,UAAU,YAAY;AAAA,gBACtB,WAAU;AAAA,gBACV,iBAAe;AAAA,gBACf,QAAQ;AAAA;AAAA,YACV;AAAA,YACA;AAAA,cAAC;AAAA;AAAA,gBACC,UAAU,YAAY;AAAA,gBACtB,WAAU;AAAA,gBACV,iBAAe;AAAA,gBACf,QAAQ;AAAA;AAAA,YACV;AAAA,aACF;AAAA,WAEJ;AAAA,QACC,QACC;AAAA,UAAC;AAAA;AAAA,YACC,SAAS,YAAY,UAAU;AAAA,YAC/B,UAAU,YAAY,CAAC,CAAC;AAAA,YACvB,GAAG;AAAA,YAEH;AAAA;AAAA,QACH;AAAA,QAED,aAAa,UACZ;AAAA,UAAC;AAAA;AAAA,YACC,KAAK;AAAA,YACL;AAAA,YACA,cAAc,aAAa;AAAA,YAC3B;AAAA,YAEA;AAAA,YACA,mBAAiB;AAAA,YACjB,oBAAkB;AAAA,YAEjB;AAAA;AAAA,QACH;AAAA;AAAA;AAAA,EAEJ,GACF;AAEJ,CAAC;",
   "names": ["trigger"]
 }

package/esm/filters/timeframe-selector/components/custom-timeframe-selector/CustomTimeframeSelector.css CHANGED Viewed

@@ -1,4 +1,4 @@
-._at2xro0-3-12-2 {
+._at2xro0-3-13-0 {
   display: flex;
   flex-direction: column;
   flex: 1;
@@ -7,7 +7,7 @@
   padding: var(--dt-spacings-size-0, 0);
   border: var(--dt-spacings-size-0, 0);
 }
-._at2xro1-3-12-2 {
+._at2xro1-3-13-0 {
   display: flex;
   gap: var(--dt-spacings-size-4, 4px);
   padding-top: var(--dt-spacings-size-8, 8px);
@@ -18,14 +18,14 @@
   width: 100%;
   flex-direction: column;
 }
-._at2xro2-3-12-2 {
+._at2xro2-3-13-0 {
   flex-direction: column;
   flex: 1;
   min-width: var(--dt-spacings-size-0, 0);
   gap: var(--dt-spacings-size-4, 4px);
 }
 @media screen and (min-width: 640px) {
-  ._at2xro1-3-12-2 {
+  ._at2xro1-3-13-0 {
     flex-direction: row;
   }
 }

package/esm/filters/timeframe-selector/components/custom-timeframe-selector/CustomTimeframeSelector.sty.js CHANGED Viewed

@@ -1,7 +1,7 @@
 import "./CustomTimeframeSelector.css";
-var fieldset = "_at2xro0-3-12-2";
-var overlayRoot = "_at2xro1-3-12-2";
-var wrapper = "_at2xro2-3-12-2";
+var fieldset = "_at2xro0-3-13-0";
+var overlayRoot = "_at2xro1-3-13-0";
+var wrapper = "_at2xro2-3-13-0";
 export {
   fieldset,
   overlayRoot,

package/esm/filters/timeframe-selector/components/custom-timeframe-selector/CustomTimeframeSelector.sty.js.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../src/filters/timeframe-selector/components/custom-timeframe-selector/CustomTimeframeSelector.css.ts"],
-  "sourcesContent": ["import './CustomTimeframeSelector.css';\nexport var fieldset = '_at2xro0-3-12-2';\nexport var overlayRoot = '_at2xro1-3-12-2';\nexport var wrapper = '_at2xro2-3-12-2';"],
+  "sourcesContent": ["import './CustomTimeframeSelector.css';\nexport var fieldset = '_at2xro0-3-13-0';\nexport var overlayRoot = '_at2xro1-3-13-0';\nexport var wrapper = '_at2xro2-3-13-0';"],
   "mappings": "AAAA,OAAO;AACA,IAAI,WAAW;AACf,IAAI,cAAc;AAClB,IAAI,UAAU;",
   "names": []
 }

package/esm/filters/timeframe-selector/components/overlay/TimeframeSelectorOverlay.css CHANGED Viewed

@@ -1,4 +1,4 @@
-._14xc6b0-3-12-2 {
+._14xc6b0-3-13-0 {
   background: var(--dt-colors-background-surface-default, #fff);
   box-shadow: var(--dt-box-shadows-surface-floating-rest, 0px 0px 0px 1px #2d2e4e08, 0px 1px 2px #2d2e4e0d, 0px 5px 11px -2px #2d2e4e29);
   border-radius: var(--dt-borders-radius-surface-subdued, 9px);
@@ -9,18 +9,18 @@
   min-height: 0;
   max-width: 100vw;
 }
-._14xc6b1-3-12-2 {
+._14xc6b1-3-13-0 {
   overflow-y: auto;
   overflow-x: hidden;
   width: 100%;
 }
-._14xc6b2-3-12-2 {
+._14xc6b2-3-13-0 {
   box-sizing: border-box;
   min-width: 0;
   width: 100%;
   padding: var(--dt-spacings-size-6, 6px);
 }
-._14xc6b3-3-12-2 {
+._14xc6b3-3-13-0 {
   overflow-wrap: break-word;
   font-size: var(--dt-typography-text-small-default-size, 12px);
   line-height: var(--dt-typography-text-small-default-line-height, 1.333333333);

package/esm/filters/timeframe-selector/components/overlay/TimeframeSelectorOverlay.js CHANGED Viewed

@@ -35,7 +35,7 @@ function getMaxWidth(toParts) {
 const TimeframeSelectorOverlay = forwardRef((props, forwardedRef) => {
   const {
     overlayProps,
-    /* eslint-disable @typescript-eslint/no-deprecated */
+    /* oxlint-disable typescript/no-deprecated */
     clearable,
     children,
     overlayClose,

package/esm/filters/timeframe-selector/components/overlay/TimeframeSelectorOverlay.js.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../src/filters/timeframe-selector/components/overlay/TimeframeSelectorOverlay.tsx"],
-  "sourcesContent": ["import { TZDateMini } from '@date-fns/tz';\nimport { forwardRef } from 'react';\nimport { useIntl } from 'react-intl';\n\nimport * as styles from './TimeframeSelectorOverlay.sty.js';\nimport { TimeframeSelectorOverlayFooter } from './TimeframeSelectorOverlayFooter.js';\nimport { FocusScope } from '../../../../core/components/focus-scope/FocusScope.js';\nimport { OverlayContainer } from '../../../../core/components/OverlayContainer.js';\nimport { useOverlayStacking } from '../../../../core/hooks/useOverlayStacking.js';\nimport { useRovingFocus } from '../../../../core/hooks/useRovingFocus.js';\nimport { OverlayStackingProvider } from '../../../../core/providers/OverlayStackingProvider.js';\nimport { useTimeframeSelectorStore } from '../../../../core/time/timeframeStore/useTimeframeStore.js';\nimport type { MaskingProps } from '../../../../core/types/masking-props.js';\nimport type { WithChildren } from '../../../../core/types/with-children.js';\nimport { useDateTimeFormat } from '../../../../forms/date-time-picker/hooks/useDateTimeFormat.js';\nimport { Flex } from '../../../../layouts/flex/Flex.js';\nimport type { OverlayTriggerState } from '../../../../overlays/hooks/useOverlay.js';\nimport { DismissButton } from '../../../../overlays/hooks/useOverlay.js';\nimport type { OverlayProps } from '../../../../overlays/hooks/useOverlayWithTrigger.js';\nimport { TIMEFRAME_SELECTOR_MESSAGES } from '../../constants/timeframeSelectorMessages.js';\nimport type { TimeframeSelectorProps } from '../../TimeframeSelector.types.js';\nimport { CustomTimeframeSelector } from '../custom-timeframe-selector/CustomTimeframeSelector.js';\nimport { Presets } from '../presets/Presets.js';\nimport { RecentTimeframes } from '../presets/RecentTimeframes.js';\n\n//#region Typings\ninterface TimeframeSelectorOverlayProps\n  extends WithChildren,\n    MaskingProps,\n    Pick<TimeframeSelectorProps, 'clearable'> {\n  /** The props of the overlay. */\n  overlayProps: OverlayProps['overlayProps'];\n  /** The state of the overlay. */\n  overlayClose: OverlayTriggerState['close'];\n  /** Owner ID used to tag this overlay so focus changes into it are treated as internal. */\n  overlayOwnerId: string;\n}\n//#endregion\n\nfunction getMaxWidth(toParts: (date: Date) => Intl.DateTimeFormatPart[]) {\n  const placeholderFromOrToParts = toParts(new TZDateMini()).map(\n    (part: Intl.DateTimeFormatPart) => {\n      if (part.type === 'dayPeriod') {\n        return 'AM/PM';\n      }\n\n      return part.value;\n    },\n  );\n  const placeholderFromOrTo = placeholderFromOrToParts.join('');\n  const placeholdersNumberOfChars = 2 * placeholderFromOrTo.length;\n  const surroundingSpace = 22; // this is an approximation in ch units of the space around the placeholders (including the inline padding inside each placeholder part)\n\n  return `${\n    placeholdersNumberOfChars * 1.05 + // try to compensate for the ch unit being calculated for \"0\" instead of a placeholder char, which needs slightly more width\n    surroundingSpace\n  }ch`;\n}\n\n/**\n * Relative Timeframe Selector Overlay component\n */\nexport const TimeframeSelectorOverlay = forwardRef<\n  HTMLDivElement,\n  TimeframeSelectorOverlayProps\n>((props, forwardedRef) => {\n  const {\n    overlayProps,\n    /* eslint-disable @typescript-eslint/no-deprecated */\n    clearable,\n    children,\n    overlayClose,\n    overlayOwnerId,\n    'data-dtrum-mask': dataDtrumMask,\n    'data-dtrum-allow': dataDtrumAllow,\n  } = props;\n  const intl = useIntl();\n  const {\n    trapFocus,\n    style: overlayPropsStyle,\n    ...remainingOverlayProps\n  } = overlayProps;\n  const overlayContainerProps = useOverlayStacking(undefined, 'overlay');\n\n  const precision = useTimeframeSelectorStore((state) => state.precision);\n  const { toParts } = useDateTimeFormat('datetime', precision);\n\n  const { containerRef } = useRovingFocus<HTMLDivElement>({\n    initialIndex: 0,\n    direction: 'vertical',\n    focusableChildrenSelector: \"[role='option'][aria-disabled='false']\",\n  });\n\n  return (\n    <OverlayContainer\n      {...overlayContainerProps}\n      data-dt-owner={overlayOwnerId}\n      data-dtrum-mask={dataDtrumMask}\n      data-dtrum-allow={dataDtrumAllow}\n    >\n      <OverlayStackingProvider>\n        <FocusScope autoFocus>\n          <Flex\n            ref={forwardedRef}\n            gap={4}\n            flexDirection=\"column\"\n            padding={4}\n            className={styles.wrapper}\n            style={{\n              ...overlayPropsStyle,\n              width: getMaxWidth(toParts),\n              maxHeight: `min(${overlayPropsStyle?.maxHeight}, 600px)`,\n            }}\n            aria-label={intl.formatMessage(\n              TIMEFRAME_SELECTOR_MESSAGES.overlayContainer,\n            )}\n            {...remainingOverlayProps}\n          >\n            <CustomTimeframeSelector />\n            <Flex\n              ref={containerRef}\n              gap={4}\n              paddingLeft={0}\n              paddingRight={0}\n              flexDirection=\"column\"\n              className={styles.scrollContainer}\n            >\n              {children ?? <Presets />}\n              <RecentTimeframes />\n            </Flex>\n            {/* eslint-disable @typescript-eslint/no-deprecated */}\n            <TimeframeSelectorOverlayFooter clearable={clearable} />\n          </Flex>\n          <DismissButton onDismiss={overlayClose} />\n        </FocusScope>\n      </OverlayStackingProvider>\n    </OverlayContainer>\n  );\n});\n\n(\n  TimeframeSelectorOverlay as typeof TimeframeSelectorOverlay & {\n    displayName: string;\n  }\n).displayName = 'TimeframeSelectorOverlay';\n"],
-  "mappings": "AAsHY,cACA,YADA;AAtHZ,SAAS,kBAAkB;AAC3B,SAAS,kBAAkB;AAC3B,SAAS,eAAe;AAExB,YAAY,YAAY;AACxB,SAAS,sCAAsC;AAC/C,SAAS,kBAAkB;AAC3B,SAAS,wBAAwB;AACjC,SAAS,0BAA0B;AACnC,SAAS,sBAAsB;AAC/B,SAAS,+BAA+B;AACxC,SAAS,iCAAiC;AAG1C,SAAS,yBAAyB;AAClC,SAAS,YAAY;AAErB,SAAS,qBAAqB;AAE9B,SAAS,mCAAmC;AAE5C,SAAS,+BAA+B;AACxC,SAAS,eAAe;AACxB,SAAS,wBAAwB;AAgBjC,SAAS,YAAY,SAAoD;AACvE,QAAM,2BAA2B,QAAQ,IAAI,WAAW,CAAC,EAAE;AAAA,IACzD,CAAC,SAAkC;AACjC,UAAI,KAAK,SAAS,aAAa;AAC7B,eAAO;AAAA,MACT;AAEA,aAAO,KAAK;AAAA,IACd;AAAA,EACF;AACA,QAAM,sBAAsB,yBAAyB,KAAK,EAAE;AAC5D,QAAM,4BAA4B,IAAI,oBAAoB;AAC1D,QAAM,mBAAmB;AAEzB,SAAO,GACL,4BAA4B;AAAA,EAC5B,gBACF;AACF;AAKO,MAAM,2BAA2B,WAGtC,CAAC,OAAO,iBAAiB;AACzB,QAAM;AAAA,IACJ;AAAA;AAAA,IAEA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,mBAAmB;AAAA,IACnB,oBAAoB;AAAA,EACtB,IAAI;AACJ,QAAM,OAAO,QAAQ;AACrB,QAAM;AAAA,IACJ;AAAA,IACA,OAAO;AAAA,IACP,GAAG;AAAA,EACL,IAAI;AACJ,QAAM,wBAAwB,mBAAmB,QAAW,SAAS;AAErE,QAAM,YAAY,0BAA0B,CAAC,UAAU,MAAM,SAAS;AACtE,QAAM,EAAE,QAAQ,IAAI,kBAAkB,YAAY,SAAS;AAE3D,QAAM,EAAE,aAAa,IAAI,eAA+B;AAAA,IACtD,cAAc;AAAA,IACd,WAAW;AAAA,IACX,2BAA2B;AAAA,EAC7B,CAAC;AAED,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ,iBAAe;AAAA,MACf,mBAAiB;AAAA,MACjB,oBAAkB;AAAA,MAElB,8BAAC,2BACC,+BAAC,cAAW,WAAS,MACnB;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,KAAK;AAAA,YACL,KAAK;AAAA,YACL,eAAc;AAAA,YACd,SAAS;AAAA,YACT,WAAW,OAAO;AAAA,YAClB,OAAO;AAAA,cACL,GAAG;AAAA,cACH,OAAO,YAAY,OAAO;AAAA,cAC1B,WAAW,OAAO,mBAAmB,SAAS;AAAA,YAChD;AAAA,YACA,cAAY,KAAK;AAAA,cACf,4BAA4B;AAAA,YAC9B;AAAA,YACC,GAAG;AAAA,YAEJ;AAAA,kCAAC,2BAAwB;AAAA,cACzB;AAAA,gBAAC;AAAA;AAAA,kBACC,KAAK;AAAA,kBACL,KAAK;AAAA,kBACL,aAAa;AAAA,kBACb,cAAc;AAAA,kBACd,eAAc;AAAA,kBACd,WAAW,OAAO;AAAA,kBAEjB;AAAA,gCAAY,oBAAC,WAAQ;AAAA,oBACtB,oBAAC,oBAAiB;AAAA;AAAA;AAAA,cACpB;AAAA,cAEA,oBAAC,kCAA+B,WAAsB;AAAA;AAAA;AAAA,QACxD;AAAA,QACA,oBAAC,iBAAc,WAAW,cAAc;AAAA,SAC1C,GACF;AAAA;AAAA,EACF;AAEJ,CAAC;AAGC,yBAGA,cAAc;",
+  "sourcesContent": ["import { TZDateMini } from '@date-fns/tz';\nimport { forwardRef } from 'react';\nimport { useIntl } from 'react-intl';\n\nimport * as styles from './TimeframeSelectorOverlay.sty.js';\nimport { TimeframeSelectorOverlayFooter } from './TimeframeSelectorOverlayFooter.js';\nimport { FocusScope } from '../../../../core/components/focus-scope/FocusScope.js';\nimport { OverlayContainer } from '../../../../core/components/OverlayContainer.js';\nimport { useOverlayStacking } from '../../../../core/hooks/useOverlayStacking.js';\nimport { useRovingFocus } from '../../../../core/hooks/useRovingFocus.js';\nimport { OverlayStackingProvider } from '../../../../core/providers/OverlayStackingProvider.js';\nimport { useTimeframeSelectorStore } from '../../../../core/time/timeframeStore/useTimeframeStore.js';\nimport type { MaskingProps } from '../../../../core/types/masking-props.js';\nimport type { WithChildren } from '../../../../core/types/with-children.js';\nimport { useDateTimeFormat } from '../../../../forms/date-time-picker/hooks/useDateTimeFormat.js';\nimport { Flex } from '../../../../layouts/flex/Flex.js';\nimport type { OverlayTriggerState } from '../../../../overlays/hooks/useOverlay.js';\nimport { DismissButton } from '../../../../overlays/hooks/useOverlay.js';\nimport type { OverlayProps } from '../../../../overlays/hooks/useOverlayWithTrigger.js';\nimport { TIMEFRAME_SELECTOR_MESSAGES } from '../../constants/timeframeSelectorMessages.js';\nimport type { TimeframeSelectorProps } from '../../TimeframeSelector.types.js';\nimport { CustomTimeframeSelector } from '../custom-timeframe-selector/CustomTimeframeSelector.js';\nimport { Presets } from '../presets/Presets.js';\nimport { RecentTimeframes } from '../presets/RecentTimeframes.js';\n\n//#region Typings\ninterface TimeframeSelectorOverlayProps\n  extends\n    WithChildren,\n    MaskingProps,\n    Pick<TimeframeSelectorProps, 'clearable'> {\n  /** The props of the overlay. */\n  overlayProps: OverlayProps['overlayProps'];\n  /** The state of the overlay. */\n  overlayClose: OverlayTriggerState['close'];\n  /** Owner ID used to tag this overlay so focus changes into it are treated as internal. */\n  overlayOwnerId: string;\n}\n//#endregion\n\nfunction getMaxWidth(toParts: (date: Date) => Intl.DateTimeFormatPart[]) {\n  const placeholderFromOrToParts = toParts(new TZDateMini()).map(\n    (part: Intl.DateTimeFormatPart) => {\n      if (part.type === 'dayPeriod') {\n        return 'AM/PM';\n      }\n\n      return part.value;\n    },\n  );\n  const placeholderFromOrTo = placeholderFromOrToParts.join('');\n  const placeholdersNumberOfChars = 2 * placeholderFromOrTo.length;\n  const surroundingSpace = 22; // this is an approximation in ch units of the space around the placeholders (including the inline padding inside each placeholder part)\n\n  return `${\n    placeholdersNumberOfChars * 1.05 + // try to compensate for the ch unit being calculated for \"0\" instead of a placeholder char, which needs slightly more width\n    surroundingSpace\n  }ch`;\n}\n\n/**\n * Relative Timeframe Selector Overlay component\n */\nexport const TimeframeSelectorOverlay = forwardRef<\n  HTMLDivElement,\n  TimeframeSelectorOverlayProps\n>((props, forwardedRef) => {\n  const {\n    overlayProps,\n    /* oxlint-disable typescript/no-deprecated */\n    clearable,\n    children,\n    overlayClose,\n    overlayOwnerId,\n    'data-dtrum-mask': dataDtrumMask,\n    'data-dtrum-allow': dataDtrumAllow,\n  } = props;\n  const intl = useIntl();\n  const {\n    trapFocus,\n    style: overlayPropsStyle,\n    ...remainingOverlayProps\n  } = overlayProps;\n  const overlayContainerProps = useOverlayStacking(undefined, 'overlay');\n\n  const precision = useTimeframeSelectorStore((state) => state.precision);\n  const { toParts } = useDateTimeFormat('datetime', precision);\n\n  const { containerRef } = useRovingFocus<HTMLDivElement>({\n    initialIndex: 0,\n    direction: 'vertical',\n    focusableChildrenSelector: \"[role='option'][aria-disabled='false']\",\n  });\n\n  return (\n    <OverlayContainer\n      {...overlayContainerProps}\n      data-dt-owner={overlayOwnerId}\n      data-dtrum-mask={dataDtrumMask}\n      data-dtrum-allow={dataDtrumAllow}\n    >\n      <OverlayStackingProvider>\n        <FocusScope autoFocus>\n          <Flex\n            ref={forwardedRef}\n            gap={4}\n            flexDirection=\"column\"\n            padding={4}\n            className={styles.wrapper}\n            style={{\n              ...overlayPropsStyle,\n              width: getMaxWidth(toParts),\n              maxHeight: `min(${overlayPropsStyle?.maxHeight}, 600px)`,\n            }}\n            aria-label={intl.formatMessage(\n              TIMEFRAME_SELECTOR_MESSAGES.overlayContainer,\n            )}\n            {...remainingOverlayProps}\n          >\n            <CustomTimeframeSelector />\n            <Flex\n              ref={containerRef}\n              gap={4}\n              paddingLeft={0}\n              paddingRight={0}\n              flexDirection=\"column\"\n              className={styles.scrollContainer}\n            >\n              {children ?? <Presets />}\n              <RecentTimeframes />\n            </Flex>\n            {/* oxlint-disable-next-line typescript/no-deprecated */}\n            <TimeframeSelectorOverlayFooter clearable={clearable} />\n          </Flex>\n          <DismissButton onDismiss={overlayClose} />\n        </FocusScope>\n      </OverlayStackingProvider>\n    </OverlayContainer>\n  );\n});\n\n(\n  TimeframeSelectorOverlay as typeof TimeframeSelectorOverlay & {\n    displayName: string;\n  }\n).displayName = 'TimeframeSelectorOverlay';\n"],
+  "mappings": "AAuHY,cACA,YADA;AAvHZ,SAAS,kBAAkB;AAC3B,SAAS,kBAAkB;AAC3B,SAAS,eAAe;AAExB,YAAY,YAAY;AACxB,SAAS,sCAAsC;AAC/C,SAAS,kBAAkB;AAC3B,SAAS,wBAAwB;AACjC,SAAS,0BAA0B;AACnC,SAAS,sBAAsB;AAC/B,SAAS,+BAA+B;AACxC,SAAS,iCAAiC;AAG1C,SAAS,yBAAyB;AAClC,SAAS,YAAY;AAErB,SAAS,qBAAqB;AAE9B,SAAS,mCAAmC;AAE5C,SAAS,+BAA+B;AACxC,SAAS,eAAe;AACxB,SAAS,wBAAwB;AAiBjC,SAAS,YAAY,SAAoD;AACvE,QAAM,2BAA2B,QAAQ,IAAI,WAAW,CAAC,EAAE;AAAA,IACzD,CAAC,SAAkC;AACjC,UAAI,KAAK,SAAS,aAAa;AAC7B,eAAO;AAAA,MACT;AAEA,aAAO,KAAK;AAAA,IACd;AAAA,EACF;AACA,QAAM,sBAAsB,yBAAyB,KAAK,EAAE;AAC5D,QAAM,4BAA4B,IAAI,oBAAoB;AAC1D,QAAM,mBAAmB;AAEzB,SAAO,GACL,4BAA4B;AAAA,EAC5B,gBACF;AACF;AAKO,MAAM,2BAA2B,WAGtC,CAAC,OAAO,iBAAiB;AACzB,QAAM;AAAA,IACJ;AAAA;AAAA,IAEA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,mBAAmB;AAAA,IACnB,oBAAoB;AAAA,EACtB,IAAI;AACJ,QAAM,OAAO,QAAQ;AACrB,QAAM;AAAA,IACJ;AAAA,IACA,OAAO;AAAA,IACP,GAAG;AAAA,EACL,IAAI;AACJ,QAAM,wBAAwB,mBAAmB,QAAW,SAAS;AAErE,QAAM,YAAY,0BAA0B,CAAC,UAAU,MAAM,SAAS;AACtE,QAAM,EAAE,QAAQ,IAAI,kBAAkB,YAAY,SAAS;AAE3D,QAAM,EAAE,aAAa,IAAI,eAA+B;AAAA,IACtD,cAAc;AAAA,IACd,WAAW;AAAA,IACX,2BAA2B;AAAA,EAC7B,CAAC;AAED,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ,iBAAe;AAAA,MACf,mBAAiB;AAAA,MACjB,oBAAkB;AAAA,MAElB,8BAAC,2BACC,+BAAC,cAAW,WAAS,MACnB;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,KAAK;AAAA,YACL,KAAK;AAAA,YACL,eAAc;AAAA,YACd,SAAS;AAAA,YACT,WAAW,OAAO;AAAA,YAClB,OAAO;AAAA,cACL,GAAG;AAAA,cACH,OAAO,YAAY,OAAO;AAAA,cAC1B,WAAW,OAAO,mBAAmB,SAAS;AAAA,YAChD;AAAA,YACA,cAAY,KAAK;AAAA,cACf,4BAA4B;AAAA,YAC9B;AAAA,YACC,GAAG;AAAA,YAEJ;AAAA,kCAAC,2BAAwB;AAAA,cACzB;AAAA,gBAAC;AAAA;AAAA,kBACC,KAAK;AAAA,kBACL,KAAK;AAAA,kBACL,aAAa;AAAA,kBACb,cAAc;AAAA,kBACd,eAAc;AAAA,kBACd,WAAW,OAAO;AAAA,kBAEjB;AAAA,gCAAY,oBAAC,WAAQ;AAAA,oBACtB,oBAAC,oBAAiB;AAAA;AAAA;AAAA,cACpB;AAAA,cAEA,oBAAC,kCAA+B,WAAsB;AAAA;AAAA;AAAA,QACxD;AAAA,QACA,oBAAC,iBAAc,WAAW,cAAc;AAAA,SAC1C,GACF;AAAA;AAAA,EACF;AAEJ,CAAC;AAGC,yBAGA,cAAc;",
   "names": []
 }

package/esm/filters/timeframe-selector/components/overlay/TimeframeSelectorOverlay.sty.js CHANGED Viewed

@@ -1,8 +1,8 @@
 import "./TimeframeSelectorOverlay.css";
-var footer = "_14xc6b2-3-12-2";
-var hint = "_14xc6b3-3-12-2";
-var scrollContainer = "_14xc6b1-3-12-2";
-var wrapper = "_14xc6b0-3-12-2";
+var footer = "_14xc6b2-3-13-0";
+var hint = "_14xc6b3-3-13-0";
+var scrollContainer = "_14xc6b1-3-13-0";
+var wrapper = "_14xc6b0-3-13-0";
 export {
   footer,
   hint,

package/esm/filters/timeframe-selector/components/overlay/TimeframeSelectorOverlay.sty.js.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../src/filters/timeframe-selector/components/overlay/TimeframeSelectorOverlay.css.ts"],
-  "sourcesContent": ["import './TimeframeSelectorOverlay.css';\nexport var footer = '_14xc6b2-3-12-2';\nexport var hint = '_14xc6b3-3-12-2';\nexport var scrollContainer = '_14xc6b1-3-12-2';\nexport var wrapper = '_14xc6b0-3-12-2';"],
+  "sourcesContent": ["import './TimeframeSelectorOverlay.css';\nexport var footer = '_14xc6b2-3-13-0';\nexport var hint = '_14xc6b3-3-13-0';\nexport var scrollContainer = '_14xc6b1-3-13-0';\nexport var wrapper = '_14xc6b0-3-13-0';"],
   "mappings": "AAAA,OAAO;AACA,IAAI,SAAS;AACb,IAAI,OAAO;AACX,IAAI,kBAAkB;AACtB,IAAI,UAAU;",
   "names": []
 }