@persona/design-system 0.1.7 → 0.1.8

package/dist/components/DatePicker/index.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.cjs","names":["Spacing","Typography","IconButton","Typography","Color","BorderRadius","Color","Typography","GregorianCalendar","ArrowLeftIcon","ArrowRightIcon","isFocused","Color","Spacing","inputMixin","isFocusedVisible","isNotDisabled","focusWithinOutline","OpenButton","Popover","Z_INDICES","VisuallyHidden","MenuItem","isNotDisabled","isHovered","isFocused","Color","Settings","MenuList","Spacing","BorderRadius","Card","Color","Settings","ArrowLeftIcon","ArrowRightIcon","RangeCalendarPresets","VisuallyHidden","FormLabel","Spacing","Typography","ClearButton","isDisabled","Settings","CalendarDate","Popover","CircleXInverseIcon","VisuallyHidden"],"sources":["../../../components/DatePicker/Calendar/CalendarBase.tsx","../../../components/DatePicker/Calendar/CalendarCell.tsx","../../../components/DatePicker/Calendar/CalendarGrid.tsx","../../../components/DatePicker/common.ts","../../../components/DatePicker/Calendar/Calendar.tsx","../../../components/DatePicker/DateField.tsx","../../../components/DatePicker/DatePicker.tsx","../../../components/DatePicker/Calendar/RangeCalendarPresets.tsx","../../../components/DatePicker/Calendar/RangeCalendar.tsx","../../../components/DatePicker/DateRangePicker.tsx"],"sourcesContent":["import { useRef } from 'react';\nimport { useButton } from 'react-aria';\nimport styled from 'styled-components';\n\nimport { Spacing, Typography } from '@persona/design-tokens';\nimport { IconButton } from 'design-system/components/Button';\nimport type { IconButtonProps } from 'design-system/components/Button/IconButton';\n\nexport const CalendarContainer = styled.div`\n  display: inline-block;\n`;\n\nexport const CalendarHeader = styled.div`\n  display: flex;\n  align-items: center;\n  margin-bottom: ${Spacing[2]};\n`;\n\nexport const CalendarHeading = styled.div`\n  ${Typography.TextLargeBold};\n  flex: 1;\n  text-align: center;\n`;\n\nconst StyledCalendarButton = styled(IconButton)`\n  width: 32px;\n  height: 32px;\n`;\n\nexport const CalendarButton = (props: IconButtonProps) => {\n  const ref = useRef();\n  /* @ts-expect-error [strict-migration] The following line is not strict; please fix! */\n  const { buttonProps } = useButton(props, ref);\n\n  return (\n    /* @ts-expect-error [strict-migration] The following line is not strict; please fix! */\n    <StyledCalendarButton {...buttonProps} className={props.className} ref={ref}>\n      {props.children}\n    </StyledCalendarButton>\n  );\n};\n","import { type CalendarDate, type DateValue, isSameDay, isSameMonth } from '@internationalized/date';\nimport { useRef } from 'react';\nimport { useCalendarCell } from 'react-aria';\nimport type { CalendarState, RangeCalendarState } from 'react-stately';\nimport styled, { css } from 'styled-components';\n\nimport { BorderRadius, Color, Typography } from '@persona/design-tokens';\n\nconst CalendarCellContainer = styled.td`\n  text-align: center;\n  width: 38px;\n  height: 38px;\n  padding: 0px;\n`;\n\ninterface CalendarCellButtonProps {\n  isSelected?: boolean;\n  isSelectionStart?: boolean;\n  isSelectionEnd?: boolean;\n  isInvalid?: boolean;\n  isDisabled?: boolean;\n}\n\nconst CalendarCellButton = styled.button<CalendarCellButtonProps>`\n  ${Typography.TextMedium};\n  border-style: none;\n  padding: 0;\n  background: none;\n  width: 100%;\n  height: 100%;\n  cursor: pointer;\n  position: relative;\n\n  ${({ isSelected }) =>\n    isSelected &&\n    css`\n      background: ${Color.CorePurple100};\n    `}\n\n  ${({ isSelectionStart }) =>\n    isSelectionStart &&\n    css`\n      background: ${Color.BackgroundButtonPrimary};\n      color: ${Color.TextInverse};\n      border-top-left-radius: ${BorderRadius.Sm};\n      border-bottom-left-radius: ${BorderRadius.Sm};\n    `}\n\n  ${({ isSelectionEnd }) =>\n    isSelectionEnd &&\n    css`\n      background: ${Color.BackgroundButtonPrimary};\n      color: ${Color.TextInverse};\n      border-top-right-radius: ${BorderRadius.Sm};\n      border-bottom-right-radius: ${BorderRadius.Sm};\n    `}\n\n  ${({ isDisabled }) =>\n    isDisabled &&\n    css`\n      color: ${Color.CoreSlate300};\n    `}\n\n  ${({ isInvalid }) =>\n    isInvalid &&\n    css`\n      background: ${Color.BackgroundButtonDanger};\n      color: ${Color.TextInverse};\n    `}\n\n  &:focus-visible {\n    outline: 2px solid ${Color.BorderFocus};\n    outline-offset: -2px;\n    box-shadow: ${Color.PrimaryWhite} 0px 0px 0px 3px inset;\n    z-index: 1;\n  }\n`;\n\ninterface CalendarCellProps {\n  state: CalendarState | RangeCalendarState;\n  date: CalendarDate;\n  currentMonth: DateValue;\n}\n\nconst CalendarCell = ({ state, date, currentMonth }: CalendarCellProps) => {\n  const ref = useRef();\n  const { cellProps, buttonProps, isSelected, isInvalid, isDisabled, formattedDate } =\n    /* @ts-expect-error [strict-migration] The following line is not strict; please fix! */\n    useCalendarCell({ date }, state, ref);\n\n  const highlightedRange = 'highlightedRange' in state && state.highlightedRange;\n\n  const isOutsideMonth = !isSameMonth(currentMonth, date);\n  const isSelectionStart = highlightedRange ? isSameDay(date, highlightedRange.start) : isSelected;\n  const isSelectionEnd = highlightedRange ? isSameDay(date, highlightedRange.end) : isSelected;\n\n  return (\n    <CalendarCellContainer {...cellProps}>\n      <CalendarCellButton\n        {...buttonProps}\n        hidden={isOutsideMonth}\n        isSelected={isSelected}\n        isSelectionStart={isSelectionStart}\n        isSelectionEnd={isSelectionEnd}\n        isInvalid={isInvalid}\n        isDisabled={isDisabled}\n        /* @ts-expect-error [strict-migration] The following line is not strict; please fix! */\n        ref={ref}\n      >\n        {formattedDate}\n      </CalendarCellButton>\n    </CalendarCellContainer>\n  );\n};\n\nexport default CalendarCell;\n","import { type DateDuration, endOfMonth, getWeeksInMonth } from '@internationalized/date';\nimport { useCalendarGrid, useLocale } from 'react-aria';\nimport type { CalendarState, RangeCalendarState } from 'react-stately';\nimport styled from 'styled-components';\n\nimport { Color, Typography } from '@persona/design-tokens';\n\nimport CalendarCell from './CalendarCell';\n\nconst CalendarGridContainer = styled.table`\n  width: 266px;\n  border-spacing: 0px;\n  border-collapse: collapse;\n\n  &:focus-visible {\n    outline: 2px solid ${Color.BorderFocus};\n    outline-offset: 1px;\n  }\n`;\n\nconst CalendarGridDayHeader = styled.th`\n  ${Typography.TextMedium};\n  color: ${Color.TextSecondary};\n`;\n\ninterface CalendarGridProps {\n  state: CalendarState | RangeCalendarState;\n  offset?: DateDuration;\n  skipFromTabOrder?: boolean;\n}\n\nconst CalendarGrid = ({ state, offset = {}, skipFromTabOrder = false }: CalendarGridProps) => {\n  const { locale } = useLocale();\n  const startDate = state.visibleRange.start.add(offset);\n  const endDate = endOfMonth(startDate);\n\n  const { gridProps, headerProps, weekDays } = useCalendarGrid(\n    {\n      startDate,\n      endDate,\n    },\n    state,\n  );\n\n  const weeksInMonth = getWeeksInMonth(startDate, locale);\n\n  // Remove second calendar grid from tab order - use arrow keys to navigate between months\n  const modifiedGridProps = skipFromTabOrder ? { ...gridProps, tabIndex: -1 } : gridProps;\n\n  return (\n    <CalendarGridContainer {...modifiedGridProps}>\n      <thead {...headerProps}>\n        <tr>\n          {weekDays.map((day, index) => (\n            <CalendarGridDayHeader key={index}>{day}</CalendarGridDayHeader>\n          ))}\n        </tr>\n      </thead>\n      <tbody>\n        {[...new Array(weeksInMonth).keys()].map((weekIndex) => (\n          <tr key={weekIndex}>\n            {state\n              .getDatesInWeek(weekIndex, startDate)\n              .map((date, i) =>\n                date ? (\n                  <CalendarCell key={i} state={state} date={date} currentMonth={startDate} />\n                ) : (\n                  <td key={i} />\n                ),\n              )}\n          </tr>\n        ))}\n      </tbody>\n    </CalendarGridContainer>\n  );\n};\n\nexport default CalendarGrid;\n","import { GregorianCalendar } from '@internationalized/date';\n\nexport const createCalendar = () => new GregorianCalendar();\n","import type { Ref } from 'react';\nimport { type AriaCalendarProps, type DateValue, useCalendar, useLocale } from 'react-aria';\nimport { useCalendarState } from 'react-stately';\n\nimport { ArrowLeftIcon, ArrowRightIcon } from '@persona/icons';\nimport {\n  CalendarButton,\n  CalendarContainer,\n  CalendarHeader,\n  CalendarHeading,\n} from 'design-system/components/DatePicker/Calendar/CalendarBase';\nimport CalendarGrid from 'design-system/components/DatePicker/Calendar/CalendarGrid';\nimport { createCalendar } from 'design-system/components/DatePicker/common';\n\ninterface CalendarProps extends AriaCalendarProps<DateValue> {\n  calendarRef?: Ref<HTMLDivElement>;\n}\n\nconst Calendar = (props: CalendarProps) => {\n  const { locale } = useLocale();\n  const state = useCalendarState({ ...props, locale, createCalendar });\n  const { calendarProps, prevButtonProps, nextButtonProps, title } = useCalendar(props, state);\n\n  return (\n    <CalendarContainer {...calendarProps} ref={props.calendarRef}>\n      <CalendarHeader>\n        <CalendarButton {...prevButtonProps}>\n          <ArrowLeftIcon />\n        </CalendarButton>\n        <CalendarHeading>{title}</CalendarHeading>\n        <CalendarButton {...nextButtonProps}>\n          <ArrowRightIcon />\n        </CalendarButton>\n      </CalendarHeader>\n      <CalendarGrid state={state} />\n    </CalendarContainer>\n  );\n};\n\nexport default Calendar;\n","import type { DateValue } from '@internationalized/date';\nimport { type AriaDateFieldProps, useDateField, useDateSegment } from '@react-aria/datepicker';\nimport { useLocale } from '@react-aria/i18n';\nimport { mergeRefs } from '@react-aria/utils';\nimport {\n  type DateFieldState,\n  type DateSegment as DateSegmentObj,\n  type SegmentType,\n  useDateFieldState,\n} from '@react-stately/datepicker';\nimport { forwardRef, useRef } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { Color, Spacing } from '@persona/design-tokens';\nimport { createCalendar } from 'design-system/components/DatePicker/common';\nimport { isFocused, isFocusedVisible, isNotDisabled } from 'design-system/lib/pseudoClass';\nimport { focusWithinOutline } from 'design-system/mixins/focus';\nimport inputMixin, { type InputMixinProps, type InputSizes } from 'design-system/mixins/input';\nimport type PseudoClassProps from 'design-system/types/PseudoClassProps';\n\ntype DateSegmentContainerProps = { $isComma?: boolean; $isTimezone?: boolean } & PseudoClassProps;\nconst DateSegmentContainer = styled.div<DateSegmentContainerProps>`\n  font-variant-numeric: tabular-nums;\n  box-sizing: content-box;\n  text-align: end;\n\n  ${isFocused} {\n    outline: 2px solid ${Color.BorderFocus};\n    outline-offset: 1px;\n    background-color: ${Color.CorePurple200};\n  }\n\n  ${({ $isComma, $isTimezone }) =>\n    ($isComma || $isTimezone) &&\n    css`\n      margin-left: 0.25ch;\n      margin-right: 0.25ch;\n    `}\n\n  ${({ $isTimezone }) =>\n    $isTimezone &&\n    css`\n      color: ${Color.TextSecondary};\n      pointer-events: none;\n\n      &:focus {\n        outline: none;\n        background-color: transparent;\n      }\n    `}\n`;\n\ntype DateSegmentPlaceholderProps = { isPlaceholder?: boolean; type: SegmentType };\nconst DateSegmentPlaceholder = styled.span<DateSegmentPlaceholderProps>`\n  display: block;\n  width: 100%;\n  pointer-events: none;\n\n  &:focus {\n    outline: none;\n  }\n\n  ${({ isPlaceholder }) =>\n    isPlaceholder\n      ? css`\n          height: 100%;\n          color: ${({ theme }) => theme.color.text.tertiary};\n        `\n      : css`\n          visibility: hidden;\n          height: 0;\n        `}\n  ${({ type }) =>\n    type === 'literal' &&\n    css`\n      padding-left: ${Spacing[1]};\n      padding-right: ${Spacing[1]};\n    `}\n  ${({ type, isPlaceholder }) =>\n    type === 'month' &&\n    isPlaceholder &&\n    css`\n      width: 3ch;\n    `}\n`;\n\ninterface DateSegmentProps {\n  segment: DateSegmentObj;\n  state: DateFieldState;\n}\n\nfunction DateSegment({ segment, state }: DateSegmentProps) {\n  const ref = useRef();\n  /* @ts-expect-error [strict-migration] The following line is not strict; please fix! */\n  const { segmentProps } = useDateSegment(segment, state, ref);\n\n  let minWidth: string;\n\n  switch (segment.type) {\n    case 'dayPeriod': {\n      minWidth = '2.75ch';\n      break;\n    }\n    default: {\n      minWidth = `${segment.maxValue != null && String(segment.maxValue).length + 0.25}ch`;\n      break;\n    }\n  }\n\n  const isComma = segment.type === 'literal' && segment.text === ', ';\n  const isTimezone = segment.type === 'timeZoneName';\n\n  return (\n    <DateSegmentContainer\n      {...segmentProps}\n      /* @ts-expect-error [strict-migration] The following line is not strict; please fix! */\n      ref={ref}\n      style={{\n        ...segmentProps.style,\n        minWidth,\n      }}\n      $isComma={isComma}\n      $isTimezone={isTimezone}\n      {...(isTimezone && { tabIndex: -1, role: 'presentation' })}\n    >\n      {/* Always reserve space for the placeholder, to prevent layout shift when editing. */}\n      {segment.placeholder && (\n        <DateSegmentPlaceholder\n          aria-hidden='true'\n          isPlaceholder={segment.isPlaceholder}\n          type={segment.type}\n        >\n          {segment.placeholder}\n        </DateSegmentPlaceholder>\n      )}\n      {segment.isPlaceholder ? '' : segment.text}\n    </DateSegmentContainer>\n  );\n}\n\nconst InputBox = styled.div<InputMixinProps & { $inputPosition: 'start' | 'end' }>`\n  ${inputMixin};\n  display: flex;\n  padding-left: ${Spacing[2]};\n  padding-right: ${Spacing[2]};\n  line-height: 1;\n  position: relative;\n\n  &${isFocusedVisible}${isNotDisabled} {\n    position: relative;\n    z-index: 1;\n  }\n\n  ${focusWithinOutline}\n\n  ${({ $inputPosition }) => {\n    switch ($inputPosition) {\n      case 'start': {\n        return css`\n          border-top-right-radius: 0px;\n          border-bottom-right-radius: 0px;\n        `;\n      }\n      case 'end': {\n        return css`\n          margin-left: -1px;\n          border-top-left-radius: 0px;\n          border-bottom-left-radius: 0px;\n        `;\n      }\n    }\n  }}\n`;\n\ninterface DateFieldProps extends AriaDateFieldProps<DateValue> {\n  inputPosition?: 'start' | 'end';\n  focused?: boolean;\n  readOnly?: boolean;\n  value?: DateValue;\n  disabled?: boolean;\n  size?: InputSizes;\n  style?: React.CSSProperties;\n  dateFieldProps?: {\n    style?: React.CSSProperties;\n  };\n  hasError?: boolean;\n}\n\nexport const DateField = forwardRef<HTMLDivElement, DateFieldProps>(function DateField(\n  props: DateFieldProps,\n  forwardedRef,\n) {\n  const { locale } = useLocale();\n  const state = useDateFieldState({\n    ...props,\n    locale,\n    createCalendar,\n  });\n\n  const ref = useRef<HTMLDivElement>();\n  /* @ts-expect-error [strict-migration] The following line is not strict; please fix! */\n  const { fieldProps } = useDateField(props, state, ref);\n\n  return (\n    <InputBox\n      {...fieldProps}\n      {...(props.dateFieldProps || {})}\n      /* @ts-expect-error [strict-migration] The following line is not strict; please fix! */\n      ref={mergeRefs<HTMLDivElement>(ref, forwardedRef)}\n      focused={props.focused}\n      disabled={props.disabled}\n      aria-label={props['aria-label']}\n      $size={props.size ?? 'md'}\n      /* @ts-expect-error [strict-migration] The following line is not strict; please fix! */\n      $inputPosition={props.inputPosition}\n      hasError={props.hasError}\n    >\n      {state.segments.map((segment, i) => (\n        <DateSegment key={i} segment={segment} state={state} />\n      ))}\n    </InputBox>\n  );\n});\n\nexport default DateField;\n","import type { DateValue } from '@internationalized/date';\nimport type { DatePickerProps as DatePickerBase } from '@react-types/datepicker';\nimport { type RefObject, useCallback, useRef, useState } from 'react';\nimport { mergeProps, useButton, useDatePicker, useFocusWithin, VisuallyHidden } from 'react-aria';\nimport { useDatePickerState } from 'react-stately';\n\nimport Calendar from 'design-system/components/DatePicker/Calendar/Calendar';\nimport DateField from 'design-system/components/DatePicker/DateField';\nimport Popover from 'design-system/components/Popover';\nimport { Z_INDICES } from 'design-system/lib/zindex';\nimport type { InputSizes } from 'design-system/mixins/input';\n\nexport interface DatePickerProps extends DatePickerBase<DateValue> {\n  id?: string;\n  dateFieldProps?: {\n    style?: React.CSSProperties;\n  };\n  disabled?: boolean;\n  size?: InputSizes;\n  useModalZIndex?: boolean;\n}\n\nconst OpenButton = ({ calendarRef }: { calendarRef: RefObject<HTMLElement> }) => {\n  const openCalBtnRef = useRef<HTMLButtonElement>(null);\n  const { buttonProps } = useButton(\n    {\n      onPress: () => {\n        if (calendarRef.current) {\n          (\n            calendarRef.current.querySelector('button[aria-label=\"Previous\"]') as HTMLButtonElement\n          ).focus();\n        }\n      },\n    },\n    openCalBtnRef,\n  );\n\n  return <button {...buttonProps} ref={openCalBtnRef} aria-label='Open calendar' />;\n};\n\nexport const DatePicker = (props: DatePickerProps) => {\n  const state = useDatePickerState(props);\n  const ref = useRef<HTMLDivElement>(null);\n  const fieldRef = useRef<HTMLDivElement>(null);\n  const { groupProps, fieldProps, calendarProps } = useDatePicker(props, state, ref);\n  const calendarRef = useRef<HTMLDivElement>(null);\n  const [isClosing, setIsClosing] = useState(false);\n\n  const { focusWithinProps } = useFocusWithin({\n    onFocusWithin: () => {\n      if (!state.isOpen && !isClosing) {\n        state.setOpen(true);\n      }\n    },\n    onBlurWithin: (e) => {\n      // Close calendar if next target is not within the calendar\n      if (e.relatedTarget && !calendarRef?.current?.contains(e.relatedTarget) && state.isOpen) {\n        state.setOpen(false);\n      }\n    },\n  });\n\n  const handleOutsideClick = (e: Event) => {\n    const target = e.target as Node;\n    // Don't close if clicking on the date input itself\n    if (ref.current?.contains(target)) {\n      return;\n    }\n    if (state.isOpen) {\n      state.setOpen(false);\n    }\n  };\n\n  const handleKeyDown = useCallback(\n    (event: React.KeyboardEvent) => {\n      if (event.key === 'Enter' && !state.isOpen) {\n        event.preventDefault();\n        state.setOpen(true);\n      }\n    },\n    [state],\n  );\n\n  return (\n    <div style={{ display: 'flex', flexDirection: 'column' }}>\n      <Popover\n        open={state.isOpen}\n        modal={false}\n        contentProps={{\n          style: { zIndex: props.useModalZIndex ? Z_INDICES.modalDropdown : Z_INDICES.dropdown },\n          align: 'start',\n          'aria-modal': true,\n          onInteractOutside: handleOutsideClick,\n          onEscapeKeyDown: () => {\n            state.setOpen(false);\n          },\n          onCloseAutoFocus: (e: Event) => {\n            // Prevent Radix's default focus restoration\n            e.preventDefault();\n            setIsClosing(true);\n\n            // Manually restore focus to the date field\n            if (fieldRef.current) {\n              const firstEditableSegment = fieldRef.current.querySelector('[tabindex=\"0\"]');\n              if (firstEditableSegment instanceof HTMLElement) {\n                firstEditableSegment.focus();\n              }\n            }\n\n            // Reset flag after focus is done\n            requestAnimationFrame(() => setIsClosing(false));\n          },\n          noPadding: true,\n        }}\n      >\n        <Popover.Trigger asChild>\n          <div\n            {...mergeProps(groupProps, focusWithinProps)}\n            ref={ref}\n            style={{ display: 'flex', position: 'relative' }}\n          >\n            <DateField\n              ref={fieldRef}\n              id={props.id}\n              dateFieldProps={props.dateFieldProps}\n              disabled={props.disabled}\n              size={props.size}\n              {...mergeProps(fieldProps, { onKeyDown: handleKeyDown })}\n              value={fieldProps.value ?? undefined}\n            />\n            <VisuallyHidden>\n              <OpenButton calendarRef={calendarRef} />\n            </VisuallyHidden>\n          </div>\n        </Popover.Trigger>\n        <Calendar\n          {...{ ...calendarProps, autoFocus: undefined }}\n          calendarRef={calendarRef}\n          id='calendar-popover'\n        />\n      </Popover>\n    </div>\n  );\n};\n\nexport default DatePicker;\n","import {\n  type CalendarDate,\n  type DateValue,\n  endOfMonth,\n  endOfYear,\n  startOfMonth,\n  startOfYear,\n  today,\n} from '@internationalized/date';\nimport type { RangeValue } from '@react-types/shared';\nimport { Settings } from 'luxon';\nimport { memo, useRef } from 'react';\nimport { mergeProps, useButton } from 'react-aria';\nimport type { RangeCalendarState } from 'react-stately';\nimport styled, { css } from 'styled-components';\n\nimport { Color } from '@persona/design-tokens';\nimport { MenuItem, MenuList } from 'design-system/components/Menu';\nimport { isFocused, isHovered, isNotDisabled } from 'design-system/lib/pseudoClass';\n\ninterface DateRangePreset {\n  label: string;\n  range: RangeValue<CalendarDate>;\n}\n\nconst getDefaultPresets = (tz: string) => {\n  const now = today(tz);\n  return [\n    {\n      label: 'Last 7 days',\n      range: {\n        start: now.subtract({ days: 7 }),\n        end: now,\n      },\n    },\n    {\n      label: 'Last 14 days',\n      range: {\n        start: now.subtract({ days: 14 }),\n        end: now,\n      },\n    },\n    {\n      label: 'Last 30 days',\n      range: {\n        start: now.subtract({ days: 30 }),\n        end: now,\n      },\n    },\n    {\n      label: 'This month',\n      range: {\n        start: startOfMonth(now),\n        // Effectively, this should always be today, since we can't look forward\n        end: now,\n      },\n    },\n    {\n      label: 'Last month',\n      range: {\n        start: startOfMonth(now.subtract({ months: 1 })),\n        end: endOfMonth(now.subtract({ months: 1 })),\n      },\n    },\n    {\n      label: 'This year',\n      range: {\n        start: startOfYear(now),\n        end: now,\n      },\n    },\n    {\n      label: 'Last year',\n      range: {\n        start: startOfYear(now.subtract({ years: 1 })),\n        end: endOfYear(now.subtract({ years: 1 })),\n      },\n    },\n  ];\n};\n\n/**\n * Compare two date values by year/month/day only, ignoring time components.\n */\nconst datesMatchByDay = (a: CalendarDate, b: DateValue): boolean =>\n  a.year === b.year && a.month === b.month && a.day === b.day;\n\nconst Container = styled.div`\n  display: flex;\n  flex-direction: column;\n`;\n\ninterface PresetButtonProps {\n  state: RangeCalendarState;\n  preset: DateRangePreset;\n  isSelected: boolean;\n  setDateMode: (mode: 'start' | 'end' | null) => void;\n}\n\nconst StyledPresetButton = styled(MenuItem)`\n  ${({ selected }) =>\n    !selected &&\n    css`\n      &${isNotDisabled}${isHovered}, &${isNotDisabled}${isFocused} {\n        background-color: transparent;\n      }\n    `}\n\n  &:focus-visible {\n    // MenuItems default to outline: none, so we need to override it here.\n    outline: 2px solid ${Color.BorderFocus} !important;\n    outline-offset: 1px;\n  }\n`;\n\ninterface DateRangePickerPresetsProps {\n  presetsFn?: (tz: string) => DateRangePreset[];\n  state: RangeCalendarState;\n  setDateMode: (mode: 'start' | 'end' | null) => void;\n}\n\nconst PresetButton = ({ state, preset, isSelected, setDateMode, ...props }: PresetButtonProps) => {\n  const ref = useRef<HTMLDivElement>();\n  const { buttonProps } = useButton(\n    {\n      onPress: () => {\n        state.setValue(preset.range);\n        setDateMode(null);\n      },\n    },\n    /* @ts-expect-error [strict-migration] The following line is not strict; please fix! */\n    ref,\n  );\n\n  // Strip aria-current from useButton's props so it doesn't override MenuItem's.\n  const { 'aria-current': _ariaCurrent, ...mergedProps } = mergeProps(props, buttonProps);\n\n  return (\n    <StyledPresetButton\n      selected={isSelected}\n      {...mergedProps}\n      /* @ts-expect-error [strict-migration] The following line is not strict; please fix! */\n      ref={ref}\n    >\n      {preset.label}\n    </StyledPresetButton>\n  );\n};\n\nconst DateRangePickerPresets = ({\n  presetsFn = getDefaultPresets,\n  state,\n  setDateMode,\n  ...props\n}: DateRangePickerPresetsProps) => {\n  // The reason that we need to do this at render time is because the default timezone for moment is set after\n  // the current User's timezone is loaded. Thus we woudln't be getting the right timezone unless if we defer getting\n  // the timezone.\n  const presets = presetsFn(Settings.defaultZone.name);\n\n  // First match wins — prevents multiple presets appearing selected when ranges overlap.\n  const { value } = state;\n  const selectedPresetIndex = value\n    ? presets.findIndex(\n        (preset) =>\n          datesMatchByDay(preset.range.start, value.start) &&\n          datesMatchByDay(preset.range.end, value.end),\n      )\n    : -1;\n\n  return (\n    <Container {...props}>\n      <MenuList aria-label='Date range presets'>\n        {presets.map((preset, i) => (\n          <PresetButton\n            key={i}\n            preset={preset}\n            state={state}\n            setDateMode={setDateMode}\n            isSelected={i === selectedPresetIndex}\n          />\n        ))}\n      </MenuList>\n    </Container>\n  );\n};\n\n// Memoize to prevent re-renders when irrelevant state properties change\n// Only re-render when the actual selected date range (state.value) changes\nconst arePropsEqual = (\n  prevProps: DateRangePickerPresetsProps,\n  nextProps: DateRangePickerPresetsProps,\n) => {\n  // Only care about the selected date range, not internal calendar state like isInvalid, visibleRange, etc.\n  const prevValue = prevProps.state.value;\n  const nextValue = nextProps.state.value;\n\n  // If both are null/undefined, they're equal\n  if (!prevValue && !nextValue) {\n    return true;\n  }\n  // If only one is null/undefined, they're different\n  if (!prevValue || !nextValue) {\n    return false;\n  }\n\n  // Compare the actual date values\n  return (\n    prevValue.start.compare(nextValue.start) === 0 && prevValue.end.compare(nextValue.end) === 0\n  );\n};\n\nexport default memo(DateRangePickerPresets, arePropsEqual);\n","import { type CalendarDate, type DateValue, toCalendarDateTime } from '@internationalized/date';\nimport { range } from 'lodash/fp';\nimport { Settings } from 'luxon';\nimport { type Ref, useRef } from 'react';\nimport {\n  type DateRange,\n  type RangeCalendarProps as RangeCalendarBaseProps,\n  useDateFormatter,\n  useLocale,\n  useRangeCalendar,\n  VisuallyHidden,\n} from 'react-aria';\nimport { type RangeCalendarState, useRangeCalendarState } from 'react-stately';\nimport styled from 'styled-components';\n\nimport { BorderRadius, Color, Spacing } from '@persona/design-tokens';\nimport { ArrowLeftIcon, ArrowRightIcon } from '@persona/icons';\nimport Card from 'design-system/components/Card';\nimport {\n  CalendarButton,\n  CalendarContainer,\n  CalendarHeader,\n  CalendarHeading,\n} from 'design-system/components/DatePicker/Calendar/CalendarBase';\nimport CalendarGrid from 'design-system/components/DatePicker/Calendar/CalendarGrid';\nimport RangeCalendarPresets from 'design-system/components/DatePicker/Calendar/RangeCalendarPresets';\nimport { createCalendar } from 'design-system/components/DatePicker/common';\n\nconst RangeCalendarHeader = styled(CalendarHeader)`\n  gap: ${Spacing[5]};\n`;\n\nconst CalendarHeaderMonth = styled.div`\n  display: grid;\n  grid-template-columns: minmax(auto, 1fr) auto minmax(auto, 1fr);\n  grid-template-areas: 'prev title next';\n  width: 266px;\n  align-items: center;\n`;\n\nconst CalendarGrids = styled.div`\n  display: flex;\n  gap: ${Spacing[5]};\n  align-items: start;\n`;\n\nconst PrevButton = styled(CalendarButton)`\n  grid-area: prev;\n  justify-self: start;\n  border-radius: ${BorderRadius.Sm};\n`;\n\nconst NextButton = styled(CalendarButton)`\n  grid-area: next;\n  justify-self: end;\n  border-radius: ${BorderRadius.Sm};\n`;\n\nconst RangeCalendarHeading = styled(CalendarHeading)`\n  grid-area: title;\n`;\n\nconst RangeCalendarContainer = styled.div`\n  display: flex;\n`;\n\nconst PresetsContainer = styled(Card.Body)`\n  border-right: 1px solid ${Color.BorderHairline};\n`;\n\nexport interface RangeCalendarProps extends RangeCalendarBaseProps<DateValue> {\n  minDate?: RangeCalendarBaseProps<DateValue>['minValue'];\n  maxDate?: RangeCalendarBaseProps<DateValue>['maxValue'];\n  calendarRef?: Ref<HTMLDivElement>;\n  hidePresets?: boolean;\n  onSelectDate?: (d: CalendarDate) => void;\n  setDateMode: (mode: 'start' | 'end' | null) => void;\n  /**\n   * From setValue of DateRangePicker\n   */\n  setValue: (value: DateRange | null) => void;\n  granularity: 'day' | 'hour' | 'minute' | 'second';\n}\n\nconst RangeCalendar = ({\n  calendarRef,\n  onSelectDate,\n  minDate,\n  maxDate,\n  hidePresets,\n  setDateMode,\n  setValue,\n  granularity,\n  ...props\n}: RangeCalendarProps) => {\n  const visibleMonths = 2;\n  const { locale } = useLocale();\n  // Must gather the TZ from the user's settings.\n  const timezoneName = Settings.defaultZone.name;\n  const rangeCalendarState = useRangeCalendarState({\n    ...props,\n    minValue: minDate,\n    maxValue: maxDate,\n    visibleDuration: {\n      months: visibleMonths,\n    },\n    locale,\n    createCalendar,\n  });\n\n  const state: RangeCalendarState = {\n    ...rangeCalendarState,\n    setValue: (value) => {\n      if (!value || granularity === 'day') {\n        rangeCalendarState.setValue(value);\n        return;\n      }\n\n      setValue({\n        start: toCalendarDateTime(value.start),\n        end: toCalendarDateTime(value.end),\n      });\n    },\n    selectDate: (date) => {\n      if (onSelectDate) {\n        onSelectDate(date);\n        rangeCalendarState.setAnchorDate(null);\n      } else {\n        rangeCalendarState.selectDate(date);\n      }\n    },\n  };\n\n  const ref = useRef();\n\n  /* @ts-expect-error [strict-migration] The following line is not strict; please fix! */\n  const { calendarProps, prevButtonProps, nextButtonProps } = useRangeCalendar(props, state, ref);\n\n  const monthDateFormatter = useDateFormatter({\n    month: 'long',\n    year: 'numeric',\n    timeZone: timezoneName,\n  });\n\n  const monthHeaders = range(0, visibleMonths).map((i) => {\n    return (\n      <CalendarHeaderMonth key={`calendar-month-${i}`}>\n        {i === 0 && (\n          <PrevButton {...prevButtonProps}>\n            <ArrowLeftIcon />\n          </PrevButton>\n        )}\n        <RangeCalendarHeading aria-hidden>\n          {monthDateFormatter.format(\n            state.visibleRange.start.add({ months: i }).toDate(timezoneName),\n          )}\n        </RangeCalendarHeading>\n        {i === visibleMonths - 1 && (\n          <NextButton {...nextButtonProps}>\n            <ArrowRightIcon />\n          </NextButton>\n        )}\n      </CalendarHeaderMonth>\n    );\n  });\n\n  const monthGrids = range(0, visibleMonths).map((i) => {\n    return (\n      <CalendarGrid\n        key={`calendar-grid-${i}`}\n        state={state}\n        offset={{ months: i }}\n        skipFromTabOrder={i > 0}\n      />\n    );\n  });\n\n  return (\n    <RangeCalendarContainer ref={calendarRef}>\n      {!hidePresets && (\n        <PresetsContainer padding={Spacing[3]}>\n          <RangeCalendarPresets state={state} setDateMode={setDateMode} />\n        </PresetsContainer>\n      )}\n      <Card.Body padding={Spacing[3]}>\n        {/* @ts-expect-error [strict-migration] The following line is not strict; please fix! */}\n        <CalendarContainer {...calendarProps} ref={ref}>\n          {/* Calendar header is separate from grid like this to facilitate a11y. */}\n          <RangeCalendarHeader>\n            <VisuallyHidden isFocusable={false}>{calendarProps['aria-label']}</VisuallyHidden>\n            {monthHeaders}\n          </RangeCalendarHeader>\n          <CalendarGrids>{monthGrids}</CalendarGrids>\n        </CalendarContainer>\n      </Card.Body>\n    </RangeCalendarContainer>\n  );\n};\n\nexport default RangeCalendar;\n","import {\n  CalendarDate,\n  type DateValue,\n  parseAbsolute,\n  toCalendarDateTime,\n} from '@internationalized/date';\nimport type { DateRangePickerProps as DateRangePickerBase } from '@react-types/datepicker';\nimport type { AriaLabelingProps, RangeValue } from '@react-types/shared';\nimport { type DateTime, Settings } from 'luxon';\nimport { useCallback, useEffect, useRef, useState } from 'react';\nimport {\n  mergeProps,\n  useButton,\n  useDateRangePicker,\n  useFocusWithin,\n  usePress,\n  VisuallyHidden,\n} from 'react-aria';\nimport { useDateRangePickerState } from 'react-stately';\nimport styled from 'styled-components';\n\nimport { Spacing, Typography } from '@persona/design-tokens';\nimport { CircleXInverseIcon } from '@persona/icons';\nimport RangeCalendar from 'design-system/components/DatePicker/Calendar/RangeCalendar';\nimport DateField from 'design-system/components/DatePicker/DateField';\nimport { FormLabel } from 'design-system/components/FormControl';\nimport { ClearButton } from 'design-system/components/Input';\nimport Popover from 'design-system/components/Popover';\nimport { isDisabled } from 'design-system/lib/pseudoClass';\nimport type { InputSizes } from 'design-system/mixins/input';\n\nconst DateRangeContainer = styled.div`\n  display: inline-flex;\n  flex-direction: column;\n  width: 100%;\n`;\n\nconst DateRangeInputs = styled.div`\n  display: flex;\n  align-items: center;\n`;\n\nconst CustomFormLabel = styled(FormLabel)`\n  margin-bottom: ${Spacing[2]};\n  ${Typography.TextMediumBold};\n`;\n\nexport type DateRange = {\n  startDate?: DateTime;\n  endDate?: DateTime;\n};\n\nexport interface DateRangePickerProps extends DateRangePickerBase<DateValue>, AriaLabelingProps {\n  dateRange: DateRange;\n  onChange: (range: RangeValue<DateValue> | null) => void;\n  disabled?: boolean;\n  size?: InputSizes;\n  minDate?: DateValue;\n  maxDate?: DateValue;\n  label?: string | null;\n  dataTest?: string;\n  id?: string;\n  hidePresets?: boolean;\n  className?: string;\n  /**\n   * Whether or not to display clear button\n   */\n  showClear?: boolean;\n  /**\n   * Called when the clear button is clicked/pressed\n   */\n  onClear?: () => void;\n  /**\n   * z-index of the calendar popover\n   */\n  calendarZIndex?: number;\n  /**\n   * Element that should contain the calendar portal.\n   */\n  portalContainer?: HTMLElement | null;\n}\n\nconst OpenButton = ({ onOpen, disabled }: { onOpen: () => void; disabled?: boolean }) => {\n  const openCalBtnRef = useRef<HTMLButtonElement>(null);\n  const { buttonProps } = useButton(\n    {\n      isDisabled: disabled,\n      onPress: onOpen,\n    },\n    openCalBtnRef,\n  );\n\n  return (\n    <button\n      {...buttonProps}\n      type='button'\n      ref={openCalBtnRef}\n      aria-label='Open calendar'\n      tabIndex={-1}\n    />\n  );\n};\n\nconst ClearRangeButton = styled(ClearButton)`\n  height: 16px;\n  width: 16px;\n  margin-left: ${Spacing[2]};\n\n  &${isDisabled}, &:disabled {\n    background-color: transparent;\n  }\n`;\n\nconst DateRangePicker = ({\n  granularity = 'day',\n  hideTimeZone = true,\n  className,\n  calendarZIndex,\n  portalContainer,\n  ...props\n}: DateRangePickerProps) => {\n  const state = useDateRangePickerState({ granularity, hideTimeZone, ...props });\n  const ref = useRef<HTMLDivElement>(null);\n  const startFieldRef = useRef<HTMLDivElement>(null);\n  const endFieldRef = useRef<HTMLDivElement>(null);\n  const calendarRef = useRef<HTMLDivElement>(null);\n  const [dateMode, setDateMode] = useState<'start' | 'end' | null>(null);\n  const [isClosing, setIsClosing] = useState(false);\n  const { groupProps, startFieldProps, endFieldProps, calendarProps, labelProps } =\n    useDateRangePicker({ granularity, hideTimeZone, ...props }, state, ref);\n\n  const focusCalendar = useCallback(() => {\n    requestAnimationFrame(() => {\n      const firstFocusableCalendarElement = calendarRef.current?.querySelector<HTMLElement>(\n        '[role=\"menuitem\"], button:not(:disabled), [tabindex=\"0\"]',\n      );\n      firstFocusableCalendarElement?.focus();\n    });\n  }, []);\n\n  const openCalendar = useCallback(() => {\n    if (!props.disabled && !state.isOpen && !isClosing) {\n      state.setOpen(true);\n    }\n  }, [isClosing, props.disabled, state]);\n\n  const openCalendarWithFocus = useCallback(() => {\n    openCalendar();\n    focusCalendar();\n  }, [focusCalendar, openCalendar]);\n\n  useEffect(() => {\n    // If not set, return early\n    if (!props.dateRange.startDate || !props.dateRange.endDate) {\n      return;\n    }\n\n    if (!props.dateRange.startDate.isValid || !props.dateRange.endDate.isValid) {\n      return;\n    }\n\n    // Find out the real time by adjusting the date to the user's timezone\n    const startDate = props.dateRange.startDate.setZone(Settings.defaultZone);\n    const endDate = props.dateRange.endDate.setZone(Settings.defaultZone);\n\n    if (!startDate.isValid || !endDate.isValid) {\n      return;\n    }\n\n    // Months are 1-indexed, no translations need to happen to CalendarDates\n    const startCalendar = state.hasTime\n      ? parseAbsolute(startDate.toISO(), Settings.defaultZone.name)\n      : new CalendarDate(startDate.year, startDate.month, startDate.day);\n    const endCalendar = state.hasTime\n      ? parseAbsolute(endDate.toISO(), Settings.defaultZone.name)\n      : new CalendarDate(endDate.year, endDate.month, endDate.day);\n\n    const dateRangeV2: RangeValue<DateValue> = {\n      start: startCalendar,\n      end: endCalendar,\n    };\n\n    state.setValue(dateRangeV2);\n  }, [props.dateRange.startDate, props.dateRange.endDate, granularity]);\n\n  // Auto-close overlay when a complete range is selected (e.g., from presets with time enabled)\n  const prevValueRef = useRef<RangeValue<DateValue | null> | null>(state.value);\n  useEffect(() => {\n    const prevValue = prevValueRef.current;\n    const currentValue = state.value;\n\n    // Update ref for next comparison\n    prevValueRef.current = currentValue;\n\n    // Close overlay only if BOTH start and end changed simultaneously to DIFFERENT dates (e.g., preset selection)\n    // Do not close during manual date selection where:\n    // 1. Only one date changes at a time, OR\n    // 2. Both dates are set to the same value (initial selection from empty state)\n    // Use value comparison (.compare) instead of object identity to handle controlled component re-renders\n    const startChanged =\n      prevValue?.start && currentValue?.start\n        ? prevValue.start.compare(currentValue.start) !== 0\n        : prevValue?.start !== currentValue?.start;\n    const endChanged =\n      prevValue?.end && currentValue?.end\n        ? prevValue.end.compare(currentValue.end) !== 0\n        : prevValue?.end !== currentValue?.end;\n    const datesAreDifferent =\n      currentValue?.start &&\n      currentValue?.end &&\n      currentValue.start.compare(currentValue.end) !== 0;\n\n    if (state.isOpen && startChanged && endChanged && datesAreDifferent) {\n      state.setOpen(false);\n    }\n  }, [state.value, state.isOpen]);\n\n  const { focusWithinProps: startFocusWithinProps } = useFocusWithin({\n    onFocusWithin: () => {\n      setDateMode('start');\n      openCalendar();\n    },\n  });\n\n  const { focusWithinProps: endFocusWithinProps } = useFocusWithin({\n    onFocusWithin: () => {\n      setDateMode('end');\n      openCalendar();\n    },\n  });\n\n  const { focusWithinProps: containerFocusProps } = useFocusWithin({\n    onBlurWithin: () => {\n      requestAnimationFrame(() => {\n        // Wait for popover focus transitions to settle before closing.\n        const activeElement = document.activeElement;\n        const isFocusInDateRangeInput =\n          activeElement instanceof Node && ref.current?.contains(activeElement);\n        const isFocusInCalendar =\n          activeElement instanceof Node && calendarRef.current?.contains(activeElement);\n\n        if (isFocusInDateRangeInput || isFocusInCalendar) {\n          return;\n        }\n\n        setDateMode(null);\n        if (state.isOpen) {\n          state.setOpen(false);\n        }\n      });\n    },\n  });\n\n  const handleOutsideClick = (e: Event) => {\n    const target = e.target as Node;\n    // Don't close if clicking on the date inputs themselves\n    if (ref.current?.contains(target)) {\n      return;\n    }\n\n    // When there's a click outside of the containers + calendars, reset the highlighted date\n    // Only close the calendar if it's open\n    // Note: Radix UI's onInteractOutside already ensures the interaction is outside the popover content\n    if (state.isOpen) {\n      setDateMode(null);\n      state.setOpen(false);\n    }\n  };\n\n  const { pressProps: pressClearProps } = usePress({\n    onPress: () => {\n      state.setValue(null);\n\n      if (props.onClear) {\n        props.onClear();\n      }\n    },\n  });\n\n  const handleKeyDown = useCallback(\n    (event: React.KeyboardEvent) => {\n      if (event.key === 'Enter') {\n        event.preventDefault(); // Prevent form submission\n        openCalendarWithFocus();\n      }\n    },\n    [openCalendarWithFocus],\n  );\n\n  const isValueNull = state.value && state.value.start == null && state.value.end == null;\n\n  return (\n    <DateRangeContainer data-test={props.dataTest} className={className}>\n      {props.label && <CustomFormLabel {...labelProps}>{props.label}</CustomFormLabel>}\n      <Popover\n        open={state.isOpen}\n        modal={false}\n        portalProps={portalContainer ? { container: portalContainer } : undefined}\n        contentProps={{\n          align: 'start',\n          'aria-modal': true,\n          'aria-label': props['aria-label'] ?? undefined,\n          onInteractOutside: handleOutsideClick,\n          onOpenAutoFocus: (e: Event) => {\n            // Field focus opens the calendar for editing, while Enter/Open calendar moves focus inside.\n            e.preventDefault();\n          },\n          onEscapeKeyDown: () => {\n            state.setOpen(false);\n            // Restore focus to the date field for keyboard users\n            if (dateMode) {\n              const fieldRef = dateMode === 'start' ? startFieldRef : endFieldRef;\n              const seg = fieldRef.current?.querySelector('[tabindex=\"0\"]');\n              if (seg instanceof HTMLElement) {\n                seg.focus();\n              }\n            }\n          },\n          onCloseAutoFocus: (e: Event) => {\n            // Prevent Radix's default focus restoration — Escape handles its own above.\n            e.preventDefault();\n            setIsClosing(true);\n            requestAnimationFrame(() => setIsClosing(false));\n          },\n          noPadding: true,\n          style: { zIndex: calendarZIndex },\n          zIndex: calendarZIndex,\n        }}\n      >\n        <Popover.Trigger asChild>\n          <DateRangeInputs {...mergeProps(groupProps, containerFocusProps)} ref={ref}>\n            {/* @ts-expect-error [strict-migration] The following line is not strict; please fix! */}\n            <DateField\n              ref={startFieldRef}\n              inputPosition='start'\n              focused={dateMode === 'start'}\n              disabled={props.disabled}\n              size={props.size}\n              {...mergeProps(startFieldProps, startFocusWithinProps, { onKeyDown: handleKeyDown })}\n            />\n            {/* @ts-expect-error [strict-migration] The following line is not strict; please fix! */}\n            <DateField\n              ref={endFieldRef}\n              inputPosition='end'\n              focused={dateMode === 'end'}\n              disabled={props.disabled}\n              size={props.size}\n              {...mergeProps(endFieldProps, endFocusWithinProps, { onKeyDown: handleKeyDown })}\n            />\n            {props.showClear && (\n              <ClearRangeButton\n                {...pressClearProps}\n                type='button'\n                disabled={isValueNull}\n                aria-label='Clear date range'\n              >\n                <CircleXInverseIcon />\n              </ClearRangeButton>\n            )}\n            <VisuallyHidden>\n              <OpenButton onOpen={openCalendarWithFocus} disabled={props.disabled} />\n            </VisuallyHidden>\n          </DateRangeInputs>\n        </Popover.Trigger>\n        <RangeCalendar\n          {...{ ...calendarProps, autoFocus: undefined }}\n          calendarRef={calendarRef}\n          setDateMode={setDateMode}\n          setValue={state.setValue}\n          granularity={granularity}\n          hidePresets={props.hidePresets}\n          onSelectDate={(dateVal) => {\n            /**\n             * Please use caution when editing the logic below.\n             * It is specific to react-aria's date picker and can be brittle.\n             */\n            if (dateVal) {\n              const date = state.hasTime ? toCalendarDateTime(dateVal) : dateVal;\n\n              if (dateMode === 'start') {\n                // Handle a case where we've deleted both dates\n                if (state.value.end == null && state.value.start == null) {\n                  state.setValue({\n                    start: date,\n                    end: date,\n                  });\n                }\n                // If end becomes the start\n                else if (state.value.end && date.compare(state.value.end) > 0) {\n                  state.setValue({\n                    start: state.value.end,\n                    end: state.value.end.set(dateVal), // Preserve time\n                  });\n                } else {\n                  state.setValue({\n                    // if start is not set, set it to the date or date + time value, otherwise set the dateVal to preserve time\n                    start: state.value.start == null ? date : state.value.start.set(dateVal),\n                    /* @ts-expect-error [strict-migration] The following line is not strict; please fix! */\n\n                    end: state.value.end,\n                  });\n                }\n                setDateMode('end');\n              } else {\n                // Handle a case where we've deleted both dates\n                if (state.value.end == null && state.value.start == null) {\n                  state.setValue({\n                    start: date,\n                    end: date,\n                  });\n                }\n                // If start becomes the end\n                else if (state.value.start && date.compare(state.value.start) < 0) {\n                  state.setValue({\n                    start: state.value.start.set(dateVal),\n                    end: state.value.start,\n                  });\n                } else {\n                  state.setValue({\n                    /* @ts-expect-error [strict-migration] The following line is not strict; please fix! */\n                    start: state.value.start,\n                    // if end is not set, set it to the date or date + time value, otherwise set the dateVal to preserve time\n                    end: state.value.end == null ? date : state.value.end.set(dateVal),\n                  });\n                }\n                // Close popover and keep focus on end field\n                state.setOpen(false);\n              }\n            }\n          }}\n          minDate={props.minDate}\n          maxDate={props.maxDate}\n        />\n      </Popover>\n    </DateRangeContainer>\n  );\n};\n\nexport default DateRangePicker;\n"],"mappings":"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"}

package/dist/components/DatePicker/index.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.mjs","names":["useLocale","OpenButton","Popover","Card","RangeCalendarPresets","Popover"],"sources":["../../../components/DatePicker/Calendar/CalendarBase.tsx","../../../components/DatePicker/Calendar/CalendarCell.tsx","../../../components/DatePicker/Calendar/CalendarGrid.tsx","../../../components/DatePicker/common.ts","../../../components/DatePicker/Calendar/Calendar.tsx","../../../components/DatePicker/DateField.tsx","../../../components/DatePicker/DatePicker.tsx","../../../components/DatePicker/Calendar/RangeCalendarPresets.tsx","../../../components/DatePicker/Calendar/RangeCalendar.tsx","../../../components/DatePicker/DateRangePicker.tsx"],"sourcesContent":["import { useRef } from 'react';\nimport { useButton } from 'react-aria';\nimport styled from 'styled-components';\n\nimport { Spacing, Typography } from '@persona/design-tokens';\nimport { IconButton } from 'design-system/components/Button';\nimport type { IconButtonProps } from 'design-system/components/Button/IconButton';\n\nexport const CalendarContainer = styled.div`\n  display: inline-block;\n`;\n\nexport const CalendarHeader = styled.div`\n  display: flex;\n  align-items: center;\n  margin-bottom: ${Spacing[2]};\n`;\n\nexport const CalendarHeading = styled.div`\n  ${Typography.TextLargeBold};\n  flex: 1;\n  text-align: center;\n`;\n\nconst StyledCalendarButton = styled(IconButton)`\n  width: 32px;\n  height: 32px;\n`;\n\nexport const CalendarButton = (props: IconButtonProps) => {\n  const ref = useRef();\n  /* @ts-expect-error [strict-migration] The following line is not strict; please fix! */\n  const { buttonProps } = useButton(props, ref);\n\n  return (\n    /* @ts-expect-error [strict-migration] The following line is not strict; please fix! */\n    <StyledCalendarButton {...buttonProps} className={props.className} ref={ref}>\n      {props.children}\n    </StyledCalendarButton>\n  );\n};\n","import { type CalendarDate, type DateValue, isSameDay, isSameMonth } from '@internationalized/date';\nimport { useRef } from 'react';\nimport { useCalendarCell } from 'react-aria';\nimport type { CalendarState, RangeCalendarState } from 'react-stately';\nimport styled, { css } from 'styled-components';\n\nimport { BorderRadius, Color, Typography } from '@persona/design-tokens';\n\nconst CalendarCellContainer = styled.td`\n  text-align: center;\n  width: 38px;\n  height: 38px;\n  padding: 0px;\n`;\n\ninterface CalendarCellButtonProps {\n  isSelected?: boolean;\n  isSelectionStart?: boolean;\n  isSelectionEnd?: boolean;\n  isInvalid?: boolean;\n  isDisabled?: boolean;\n}\n\nconst CalendarCellButton = styled.button<CalendarCellButtonProps>`\n  ${Typography.TextMedium};\n  border-style: none;\n  padding: 0;\n  background: none;\n  width: 100%;\n  height: 100%;\n  cursor: pointer;\n  position: relative;\n\n  ${({ isSelected }) =>\n    isSelected &&\n    css`\n      background: ${Color.CorePurple100};\n    `}\n\n  ${({ isSelectionStart }) =>\n    isSelectionStart &&\n    css`\n      background: ${Color.BackgroundButtonPrimary};\n      color: ${Color.TextInverse};\n      border-top-left-radius: ${BorderRadius.Sm};\n      border-bottom-left-radius: ${BorderRadius.Sm};\n    `}\n\n  ${({ isSelectionEnd }) =>\n    isSelectionEnd &&\n    css`\n      background: ${Color.BackgroundButtonPrimary};\n      color: ${Color.TextInverse};\n      border-top-right-radius: ${BorderRadius.Sm};\n      border-bottom-right-radius: ${BorderRadius.Sm};\n    `}\n\n  ${({ isDisabled }) =>\n    isDisabled &&\n    css`\n      color: ${Color.CoreSlate300};\n    `}\n\n  ${({ isInvalid }) =>\n    isInvalid &&\n    css`\n      background: ${Color.BackgroundButtonDanger};\n      color: ${Color.TextInverse};\n    `}\n\n  &:focus-visible {\n    outline: 2px solid ${Color.BorderFocus};\n    outline-offset: -2px;\n    box-shadow: ${Color.PrimaryWhite} 0px 0px 0px 3px inset;\n    z-index: 1;\n  }\n`;\n\ninterface CalendarCellProps {\n  state: CalendarState | RangeCalendarState;\n  date: CalendarDate;\n  currentMonth: DateValue;\n}\n\nconst CalendarCell = ({ state, date, currentMonth }: CalendarCellProps) => {\n  const ref = useRef();\n  const { cellProps, buttonProps, isSelected, isInvalid, isDisabled, formattedDate } =\n    /* @ts-expect-error [strict-migration] The following line is not strict; please fix! */\n    useCalendarCell({ date }, state, ref);\n\n  const highlightedRange = 'highlightedRange' in state && state.highlightedRange;\n\n  const isOutsideMonth = !isSameMonth(currentMonth, date);\n  const isSelectionStart = highlightedRange ? isSameDay(date, highlightedRange.start) : isSelected;\n  const isSelectionEnd = highlightedRange ? isSameDay(date, highlightedRange.end) : isSelected;\n\n  return (\n    <CalendarCellContainer {...cellProps}>\n      <CalendarCellButton\n        {...buttonProps}\n        hidden={isOutsideMonth}\n        isSelected={isSelected}\n        isSelectionStart={isSelectionStart}\n        isSelectionEnd={isSelectionEnd}\n        isInvalid={isInvalid}\n        isDisabled={isDisabled}\n        /* @ts-expect-error [strict-migration] The following line is not strict; please fix! */\n        ref={ref}\n      >\n        {formattedDate}\n      </CalendarCellButton>\n    </CalendarCellContainer>\n  );\n};\n\nexport default CalendarCell;\n","import { type DateDuration, endOfMonth, getWeeksInMonth } from '@internationalized/date';\nimport { useCalendarGrid, useLocale } from 'react-aria';\nimport type { CalendarState, RangeCalendarState } from 'react-stately';\nimport styled from 'styled-components';\n\nimport { Color, Typography } from '@persona/design-tokens';\n\nimport CalendarCell from './CalendarCell';\n\nconst CalendarGridContainer = styled.table`\n  width: 266px;\n  border-spacing: 0px;\n  border-collapse: collapse;\n\n  &:focus-visible {\n    outline: 2px solid ${Color.BorderFocus};\n    outline-offset: 1px;\n  }\n`;\n\nconst CalendarGridDayHeader = styled.th`\n  ${Typography.TextMedium};\n  color: ${Color.TextSecondary};\n`;\n\ninterface CalendarGridProps {\n  state: CalendarState | RangeCalendarState;\n  offset?: DateDuration;\n  skipFromTabOrder?: boolean;\n}\n\nconst CalendarGrid = ({ state, offset = {}, skipFromTabOrder = false }: CalendarGridProps) => {\n  const { locale } = useLocale();\n  const startDate = state.visibleRange.start.add(offset);\n  const endDate = endOfMonth(startDate);\n\n  const { gridProps, headerProps, weekDays } = useCalendarGrid(\n    {\n      startDate,\n      endDate,\n    },\n    state,\n  );\n\n  const weeksInMonth = getWeeksInMonth(startDate, locale);\n\n  // Remove second calendar grid from tab order - use arrow keys to navigate between months\n  const modifiedGridProps = skipFromTabOrder ? { ...gridProps, tabIndex: -1 } : gridProps;\n\n  return (\n    <CalendarGridContainer {...modifiedGridProps}>\n      <thead {...headerProps}>\n        <tr>\n          {weekDays.map((day, index) => (\n            <CalendarGridDayHeader key={index}>{day}</CalendarGridDayHeader>\n          ))}\n        </tr>\n      </thead>\n      <tbody>\n        {[...new Array(weeksInMonth).keys()].map((weekIndex) => (\n          <tr key={weekIndex}>\n            {state\n              .getDatesInWeek(weekIndex, startDate)\n              .map((date, i) =>\n                date ? (\n                  <CalendarCell key={i} state={state} date={date} currentMonth={startDate} />\n                ) : (\n                  <td key={i} />\n                ),\n              )}\n          </tr>\n        ))}\n      </tbody>\n    </CalendarGridContainer>\n  );\n};\n\nexport default CalendarGrid;\n","import { GregorianCalendar } from '@internationalized/date';\n\nexport const createCalendar = () => new GregorianCalendar();\n","import type { Ref } from 'react';\nimport { type AriaCalendarProps, type DateValue, useCalendar, useLocale } from 'react-aria';\nimport { useCalendarState } from 'react-stately';\n\nimport { ArrowLeftIcon, ArrowRightIcon } from '@persona/icons';\nimport {\n  CalendarButton,\n  CalendarContainer,\n  CalendarHeader,\n  CalendarHeading,\n} from 'design-system/components/DatePicker/Calendar/CalendarBase';\nimport CalendarGrid from 'design-system/components/DatePicker/Calendar/CalendarGrid';\nimport { createCalendar } from 'design-system/components/DatePicker/common';\n\ninterface CalendarProps extends AriaCalendarProps<DateValue> {\n  calendarRef?: Ref<HTMLDivElement>;\n}\n\nconst Calendar = (props: CalendarProps) => {\n  const { locale } = useLocale();\n  const state = useCalendarState({ ...props, locale, createCalendar });\n  const { calendarProps, prevButtonProps, nextButtonProps, title } = useCalendar(props, state);\n\n  return (\n    <CalendarContainer {...calendarProps} ref={props.calendarRef}>\n      <CalendarHeader>\n        <CalendarButton {...prevButtonProps}>\n          <ArrowLeftIcon />\n        </CalendarButton>\n        <CalendarHeading>{title}</CalendarHeading>\n        <CalendarButton {...nextButtonProps}>\n          <ArrowRightIcon />\n        </CalendarButton>\n      </CalendarHeader>\n      <CalendarGrid state={state} />\n    </CalendarContainer>\n  );\n};\n\nexport default Calendar;\n","import type { DateValue } from '@internationalized/date';\nimport { type AriaDateFieldProps, useDateField, useDateSegment } from '@react-aria/datepicker';\nimport { useLocale } from '@react-aria/i18n';\nimport { mergeRefs } from '@react-aria/utils';\nimport {\n  type DateFieldState,\n  type DateSegment as DateSegmentObj,\n  type SegmentType,\n  useDateFieldState,\n} from '@react-stately/datepicker';\nimport { forwardRef, useRef } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { Color, Spacing } from '@persona/design-tokens';\nimport { createCalendar } from 'design-system/components/DatePicker/common';\nimport { isFocused, isFocusedVisible, isNotDisabled } from 'design-system/lib/pseudoClass';\nimport { focusWithinOutline } from 'design-system/mixins/focus';\nimport inputMixin, { type InputMixinProps, type InputSizes } from 'design-system/mixins/input';\nimport type PseudoClassProps from 'design-system/types/PseudoClassProps';\n\ntype DateSegmentContainerProps = { $isComma?: boolean; $isTimezone?: boolean } & PseudoClassProps;\nconst DateSegmentContainer = styled.div<DateSegmentContainerProps>`\n  font-variant-numeric: tabular-nums;\n  box-sizing: content-box;\n  text-align: end;\n\n  ${isFocused} {\n    outline: 2px solid ${Color.BorderFocus};\n    outline-offset: 1px;\n    background-color: ${Color.CorePurple200};\n  }\n\n  ${({ $isComma, $isTimezone }) =>\n    ($isComma || $isTimezone) &&\n    css`\n      margin-left: 0.25ch;\n      margin-right: 0.25ch;\n    `}\n\n  ${({ $isTimezone }) =>\n    $isTimezone &&\n    css`\n      color: ${Color.TextSecondary};\n      pointer-events: none;\n\n      &:focus {\n        outline: none;\n        background-color: transparent;\n      }\n    `}\n`;\n\ntype DateSegmentPlaceholderProps = { isPlaceholder?: boolean; type: SegmentType };\nconst DateSegmentPlaceholder = styled.span<DateSegmentPlaceholderProps>`\n  display: block;\n  width: 100%;\n  pointer-events: none;\n\n  &:focus {\n    outline: none;\n  }\n\n  ${({ isPlaceholder }) =>\n    isPlaceholder\n      ? css`\n          height: 100%;\n          color: ${({ theme }) => theme.color.text.tertiary};\n        `\n      : css`\n          visibility: hidden;\n          height: 0;\n        `}\n  ${({ type }) =>\n    type === 'literal' &&\n    css`\n      padding-left: ${Spacing[1]};\n      padding-right: ${Spacing[1]};\n    `}\n  ${({ type, isPlaceholder }) =>\n    type === 'month' &&\n    isPlaceholder &&\n    css`\n      width: 3ch;\n    `}\n`;\n\ninterface DateSegmentProps {\n  segment: DateSegmentObj;\n  state: DateFieldState;\n}\n\nfunction DateSegment({ segment, state }: DateSegmentProps) {\n  const ref = useRef();\n  /* @ts-expect-error [strict-migration] The following line is not strict; please fix! */\n  const { segmentProps } = useDateSegment(segment, state, ref);\n\n  let minWidth: string;\n\n  switch (segment.type) {\n    case 'dayPeriod': {\n      minWidth = '2.75ch';\n      break;\n    }\n    default: {\n      minWidth = `${segment.maxValue != null && String(segment.maxValue).length + 0.25}ch`;\n      break;\n    }\n  }\n\n  const isComma = segment.type === 'literal' && segment.text === ', ';\n  const isTimezone = segment.type === 'timeZoneName';\n\n  return (\n    <DateSegmentContainer\n      {...segmentProps}\n      /* @ts-expect-error [strict-migration] The following line is not strict; please fix! */\n      ref={ref}\n      style={{\n        ...segmentProps.style,\n        minWidth,\n      }}\n      $isComma={isComma}\n      $isTimezone={isTimezone}\n      {...(isTimezone && { tabIndex: -1, role: 'presentation' })}\n    >\n      {/* Always reserve space for the placeholder, to prevent layout shift when editing. */}\n      {segment.placeholder && (\n        <DateSegmentPlaceholder\n          aria-hidden='true'\n          isPlaceholder={segment.isPlaceholder}\n          type={segment.type}\n        >\n          {segment.placeholder}\n        </DateSegmentPlaceholder>\n      )}\n      {segment.isPlaceholder ? '' : segment.text}\n    </DateSegmentContainer>\n  );\n}\n\nconst InputBox = styled.div<InputMixinProps & { $inputPosition: 'start' | 'end' }>`\n  ${inputMixin};\n  display: flex;\n  padding-left: ${Spacing[2]};\n  padding-right: ${Spacing[2]};\n  line-height: 1;\n  position: relative;\n\n  &${isFocusedVisible}${isNotDisabled} {\n    position: relative;\n    z-index: 1;\n  }\n\n  ${focusWithinOutline}\n\n  ${({ $inputPosition }) => {\n    switch ($inputPosition) {\n      case 'start': {\n        return css`\n          border-top-right-radius: 0px;\n          border-bottom-right-radius: 0px;\n        `;\n      }\n      case 'end': {\n        return css`\n          margin-left: -1px;\n          border-top-left-radius: 0px;\n          border-bottom-left-radius: 0px;\n        `;\n      }\n    }\n  }}\n`;\n\ninterface DateFieldProps extends AriaDateFieldProps<DateValue> {\n  inputPosition?: 'start' | 'end';\n  focused?: boolean;\n  readOnly?: boolean;\n  value?: DateValue;\n  disabled?: boolean;\n  size?: InputSizes;\n  style?: React.CSSProperties;\n  dateFieldProps?: {\n    style?: React.CSSProperties;\n  };\n  hasError?: boolean;\n}\n\nexport const DateField = forwardRef<HTMLDivElement, DateFieldProps>(function DateField(\n  props: DateFieldProps,\n  forwardedRef,\n) {\n  const { locale } = useLocale();\n  const state = useDateFieldState({\n    ...props,\n    locale,\n    createCalendar,\n  });\n\n  const ref = useRef<HTMLDivElement>();\n  /* @ts-expect-error [strict-migration] The following line is not strict; please fix! */\n  const { fieldProps } = useDateField(props, state, ref);\n\n  return (\n    <InputBox\n      {...fieldProps}\n      {...(props.dateFieldProps || {})}\n      /* @ts-expect-error [strict-migration] The following line is not strict; please fix! */\n      ref={mergeRefs<HTMLDivElement>(ref, forwardedRef)}\n      focused={props.focused}\n      disabled={props.disabled}\n      aria-label={props['aria-label']}\n      $size={props.size ?? 'md'}\n      /* @ts-expect-error [strict-migration] The following line is not strict; please fix! */\n      $inputPosition={props.inputPosition}\n      hasError={props.hasError}\n    >\n      {state.segments.map((segment, i) => (\n        <DateSegment key={i} segment={segment} state={state} />\n      ))}\n    </InputBox>\n  );\n});\n\nexport default DateField;\n","import type { DateValue } from '@internationalized/date';\nimport type { DatePickerProps as DatePickerBase } from '@react-types/datepicker';\nimport { type RefObject, useCallback, useRef, useState } from 'react';\nimport { mergeProps, useButton, useDatePicker, useFocusWithin, VisuallyHidden } from 'react-aria';\nimport { useDatePickerState } from 'react-stately';\n\nimport Calendar from 'design-system/components/DatePicker/Calendar/Calendar';\nimport DateField from 'design-system/components/DatePicker/DateField';\nimport Popover from 'design-system/components/Popover';\nimport { Z_INDICES } from 'design-system/lib/zindex';\nimport type { InputSizes } from 'design-system/mixins/input';\n\nexport interface DatePickerProps extends DatePickerBase<DateValue> {\n  id?: string;\n  dateFieldProps?: {\n    style?: React.CSSProperties;\n  };\n  disabled?: boolean;\n  size?: InputSizes;\n  useModalZIndex?: boolean;\n}\n\nconst OpenButton = ({ calendarRef }: { calendarRef: RefObject<HTMLElement> }) => {\n  const openCalBtnRef = useRef<HTMLButtonElement>(null);\n  const { buttonProps } = useButton(\n    {\n      onPress: () => {\n        if (calendarRef.current) {\n          (\n            calendarRef.current.querySelector('button[aria-label=\"Previous\"]') as HTMLButtonElement\n          ).focus();\n        }\n      },\n    },\n    openCalBtnRef,\n  );\n\n  return <button {...buttonProps} ref={openCalBtnRef} aria-label='Open calendar' />;\n};\n\nexport const DatePicker = (props: DatePickerProps) => {\n  const state = useDatePickerState(props);\n  const ref = useRef<HTMLDivElement>(null);\n  const fieldRef = useRef<HTMLDivElement>(null);\n  const { groupProps, fieldProps, calendarProps } = useDatePicker(props, state, ref);\n  const calendarRef = useRef<HTMLDivElement>(null);\n  const [isClosing, setIsClosing] = useState(false);\n\n  const { focusWithinProps } = useFocusWithin({\n    onFocusWithin: () => {\n      if (!state.isOpen && !isClosing) {\n        state.setOpen(true);\n      }\n    },\n    onBlurWithin: (e) => {\n      // Close calendar if next target is not within the calendar\n      if (e.relatedTarget && !calendarRef?.current?.contains(e.relatedTarget) && state.isOpen) {\n        state.setOpen(false);\n      }\n    },\n  });\n\n  const handleOutsideClick = (e: Event) => {\n    const target = e.target as Node;\n    // Don't close if clicking on the date input itself\n    if (ref.current?.contains(target)) {\n      return;\n    }\n    if (state.isOpen) {\n      state.setOpen(false);\n    }\n  };\n\n  const handleKeyDown = useCallback(\n    (event: React.KeyboardEvent) => {\n      if (event.key === 'Enter' && !state.isOpen) {\n        event.preventDefault();\n        state.setOpen(true);\n      }\n    },\n    [state],\n  );\n\n  return (\n    <div style={{ display: 'flex', flexDirection: 'column' }}>\n      <Popover\n        open={state.isOpen}\n        modal={false}\n        contentProps={{\n          style: { zIndex: props.useModalZIndex ? Z_INDICES.modalDropdown : Z_INDICES.dropdown },\n          align: 'start',\n          'aria-modal': true,\n          onInteractOutside: handleOutsideClick,\n          onEscapeKeyDown: () => {\n            state.setOpen(false);\n          },\n          onCloseAutoFocus: (e: Event) => {\n            // Prevent Radix's default focus restoration\n            e.preventDefault();\n            setIsClosing(true);\n\n            // Manually restore focus to the date field\n            if (fieldRef.current) {\n              const firstEditableSegment = fieldRef.current.querySelector('[tabindex=\"0\"]');\n              if (firstEditableSegment instanceof HTMLElement) {\n                firstEditableSegment.focus();\n              }\n            }\n\n            // Reset flag after focus is done\n            requestAnimationFrame(() => setIsClosing(false));\n          },\n          noPadding: true,\n        }}\n      >\n        <Popover.Trigger asChild>\n          <div\n            {...mergeProps(groupProps, focusWithinProps)}\n            ref={ref}\n            style={{ display: 'flex', position: 'relative' }}\n          >\n            <DateField\n              ref={fieldRef}\n              id={props.id}\n              dateFieldProps={props.dateFieldProps}\n              disabled={props.disabled}\n              size={props.size}\n              {...mergeProps(fieldProps, { onKeyDown: handleKeyDown })}\n              value={fieldProps.value ?? undefined}\n            />\n            <VisuallyHidden>\n              <OpenButton calendarRef={calendarRef} />\n            </VisuallyHidden>\n          </div>\n        </Popover.Trigger>\n        <Calendar\n          {...{ ...calendarProps, autoFocus: undefined }}\n          calendarRef={calendarRef}\n          id='calendar-popover'\n        />\n      </Popover>\n    </div>\n  );\n};\n\nexport default DatePicker;\n","import {\n  type CalendarDate,\n  type DateValue,\n  endOfMonth,\n  endOfYear,\n  startOfMonth,\n  startOfYear,\n  today,\n} from '@internationalized/date';\nimport type { RangeValue } from '@react-types/shared';\nimport { Settings } from 'luxon';\nimport { memo, useRef } from 'react';\nimport { mergeProps, useButton } from 'react-aria';\nimport type { RangeCalendarState } from 'react-stately';\nimport styled, { css } from 'styled-components';\n\nimport { Color } from '@persona/design-tokens';\nimport { MenuItem, MenuList } from 'design-system/components/Menu';\nimport { isFocused, isHovered, isNotDisabled } from 'design-system/lib/pseudoClass';\n\ninterface DateRangePreset {\n  label: string;\n  range: RangeValue<CalendarDate>;\n}\n\nconst getDefaultPresets = (tz: string) => {\n  const now = today(tz);\n  return [\n    {\n      label: 'Last 7 days',\n      range: {\n        start: now.subtract({ days: 7 }),\n        end: now,\n      },\n    },\n    {\n      label: 'Last 14 days',\n      range: {\n        start: now.subtract({ days: 14 }),\n        end: now,\n      },\n    },\n    {\n      label: 'Last 30 days',\n      range: {\n        start: now.subtract({ days: 30 }),\n        end: now,\n      },\n    },\n    {\n      label: 'This month',\n      range: {\n        start: startOfMonth(now),\n        // Effectively, this should always be today, since we can't look forward\n        end: now,\n      },\n    },\n    {\n      label: 'Last month',\n      range: {\n        start: startOfMonth(now.subtract({ months: 1 })),\n        end: endOfMonth(now.subtract({ months: 1 })),\n      },\n    },\n    {\n      label: 'This year',\n      range: {\n        start: startOfYear(now),\n        end: now,\n      },\n    },\n    {\n      label: 'Last year',\n      range: {\n        start: startOfYear(now.subtract({ years: 1 })),\n        end: endOfYear(now.subtract({ years: 1 })),\n      },\n    },\n  ];\n};\n\n/**\n * Compare two date values by year/month/day only, ignoring time components.\n */\nconst datesMatchByDay = (a: CalendarDate, b: DateValue): boolean =>\n  a.year === b.year && a.month === b.month && a.day === b.day;\n\nconst Container = styled.div`\n  display: flex;\n  flex-direction: column;\n`;\n\ninterface PresetButtonProps {\n  state: RangeCalendarState;\n  preset: DateRangePreset;\n  isSelected: boolean;\n  setDateMode: (mode: 'start' | 'end' | null) => void;\n}\n\nconst StyledPresetButton = styled(MenuItem)`\n  ${({ selected }) =>\n    !selected &&\n    css`\n      &${isNotDisabled}${isHovered}, &${isNotDisabled}${isFocused} {\n        background-color: transparent;\n      }\n    `}\n\n  &:focus-visible {\n    // MenuItems default to outline: none, so we need to override it here.\n    outline: 2px solid ${Color.BorderFocus} !important;\n    outline-offset: 1px;\n  }\n`;\n\ninterface DateRangePickerPresetsProps {\n  presetsFn?: (tz: string) => DateRangePreset[];\n  state: RangeCalendarState;\n  setDateMode: (mode: 'start' | 'end' | null) => void;\n}\n\nconst PresetButton = ({ state, preset, isSelected, setDateMode, ...props }: PresetButtonProps) => {\n  const ref = useRef<HTMLDivElement>();\n  const { buttonProps } = useButton(\n    {\n      onPress: () => {\n        state.setValue(preset.range);\n        setDateMode(null);\n      },\n    },\n    /* @ts-expect-error [strict-migration] The following line is not strict; please fix! */\n    ref,\n  );\n\n  // Strip aria-current from useButton's props so it doesn't override MenuItem's.\n  const { 'aria-current': _ariaCurrent, ...mergedProps } = mergeProps(props, buttonProps);\n\n  return (\n    <StyledPresetButton\n      selected={isSelected}\n      {...mergedProps}\n      /* @ts-expect-error [strict-migration] The following line is not strict; please fix! */\n      ref={ref}\n    >\n      {preset.label}\n    </StyledPresetButton>\n  );\n};\n\nconst DateRangePickerPresets = ({\n  presetsFn = getDefaultPresets,\n  state,\n  setDateMode,\n  ...props\n}: DateRangePickerPresetsProps) => {\n  // The reason that we need to do this at render time is because the default timezone for moment is set after\n  // the current User's timezone is loaded. Thus we woudln't be getting the right timezone unless if we defer getting\n  // the timezone.\n  const presets = presetsFn(Settings.defaultZone.name);\n\n  // First match wins — prevents multiple presets appearing selected when ranges overlap.\n  const { value } = state;\n  const selectedPresetIndex = value\n    ? presets.findIndex(\n        (preset) =>\n          datesMatchByDay(preset.range.start, value.start) &&\n          datesMatchByDay(preset.range.end, value.end),\n      )\n    : -1;\n\n  return (\n    <Container {...props}>\n      <MenuList aria-label='Date range presets'>\n        {presets.map((preset, i) => (\n          <PresetButton\n            key={i}\n            preset={preset}\n            state={state}\n            setDateMode={setDateMode}\n            isSelected={i === selectedPresetIndex}\n          />\n        ))}\n      </MenuList>\n    </Container>\n  );\n};\n\n// Memoize to prevent re-renders when irrelevant state properties change\n// Only re-render when the actual selected date range (state.value) changes\nconst arePropsEqual = (\n  prevProps: DateRangePickerPresetsProps,\n  nextProps: DateRangePickerPresetsProps,\n) => {\n  // Only care about the selected date range, not internal calendar state like isInvalid, visibleRange, etc.\n  const prevValue = prevProps.state.value;\n  const nextValue = nextProps.state.value;\n\n  // If both are null/undefined, they're equal\n  if (!prevValue && !nextValue) {\n    return true;\n  }\n  // If only one is null/undefined, they're different\n  if (!prevValue || !nextValue) {\n    return false;\n  }\n\n  // Compare the actual date values\n  return (\n    prevValue.start.compare(nextValue.start) === 0 && prevValue.end.compare(nextValue.end) === 0\n  );\n};\n\nexport default memo(DateRangePickerPresets, arePropsEqual);\n","import { type CalendarDate, type DateValue, toCalendarDateTime } from '@internationalized/date';\nimport { range } from 'lodash/fp';\nimport { Settings } from 'luxon';\nimport { type Ref, useRef } from 'react';\nimport {\n  type DateRange,\n  type RangeCalendarProps as RangeCalendarBaseProps,\n  useDateFormatter,\n  useLocale,\n  useRangeCalendar,\n  VisuallyHidden,\n} from 'react-aria';\nimport { type RangeCalendarState, useRangeCalendarState } from 'react-stately';\nimport styled from 'styled-components';\n\nimport { BorderRadius, Color, Spacing } from '@persona/design-tokens';\nimport { ArrowLeftIcon, ArrowRightIcon } from '@persona/icons';\nimport Card from 'design-system/components/Card';\nimport {\n  CalendarButton,\n  CalendarContainer,\n  CalendarHeader,\n  CalendarHeading,\n} from 'design-system/components/DatePicker/Calendar/CalendarBase';\nimport CalendarGrid from 'design-system/components/DatePicker/Calendar/CalendarGrid';\nimport RangeCalendarPresets from 'design-system/components/DatePicker/Calendar/RangeCalendarPresets';\nimport { createCalendar } from 'design-system/components/DatePicker/common';\n\nconst RangeCalendarHeader = styled(CalendarHeader)`\n  gap: ${Spacing[5]};\n`;\n\nconst CalendarHeaderMonth = styled.div`\n  display: grid;\n  grid-template-columns: minmax(auto, 1fr) auto minmax(auto, 1fr);\n  grid-template-areas: 'prev title next';\n  width: 266px;\n  align-items: center;\n`;\n\nconst CalendarGrids = styled.div`\n  display: flex;\n  gap: ${Spacing[5]};\n  align-items: start;\n`;\n\nconst PrevButton = styled(CalendarButton)`\n  grid-area: prev;\n  justify-self: start;\n  border-radius: ${BorderRadius.Sm};\n`;\n\nconst NextButton = styled(CalendarButton)`\n  grid-area: next;\n  justify-self: end;\n  border-radius: ${BorderRadius.Sm};\n`;\n\nconst RangeCalendarHeading = styled(CalendarHeading)`\n  grid-area: title;\n`;\n\nconst RangeCalendarContainer = styled.div`\n  display: flex;\n`;\n\nconst PresetsContainer = styled(Card.Body)`\n  border-right: 1px solid ${Color.BorderHairline};\n`;\n\nexport interface RangeCalendarProps extends RangeCalendarBaseProps<DateValue> {\n  minDate?: RangeCalendarBaseProps<DateValue>['minValue'];\n  maxDate?: RangeCalendarBaseProps<DateValue>['maxValue'];\n  calendarRef?: Ref<HTMLDivElement>;\n  hidePresets?: boolean;\n  onSelectDate?: (d: CalendarDate) => void;\n  setDateMode: (mode: 'start' | 'end' | null) => void;\n  /**\n   * From setValue of DateRangePicker\n   */\n  setValue: (value: DateRange | null) => void;\n  granularity: 'day' | 'hour' | 'minute' | 'second';\n}\n\nconst RangeCalendar = ({\n  calendarRef,\n  onSelectDate,\n  minDate,\n  maxDate,\n  hidePresets,\n  setDateMode,\n  setValue,\n  granularity,\n  ...props\n}: RangeCalendarProps) => {\n  const visibleMonths = 2;\n  const { locale } = useLocale();\n  // Must gather the TZ from the user's settings.\n  const timezoneName = Settings.defaultZone.name;\n  const rangeCalendarState = useRangeCalendarState({\n    ...props,\n    minValue: minDate,\n    maxValue: maxDate,\n    visibleDuration: {\n      months: visibleMonths,\n    },\n    locale,\n    createCalendar,\n  });\n\n  const state: RangeCalendarState = {\n    ...rangeCalendarState,\n    setValue: (value) => {\n      if (!value || granularity === 'day') {\n        rangeCalendarState.setValue(value);\n        return;\n      }\n\n      setValue({\n        start: toCalendarDateTime(value.start),\n        end: toCalendarDateTime(value.end),\n      });\n    },\n    selectDate: (date) => {\n      if (onSelectDate) {\n        onSelectDate(date);\n        rangeCalendarState.setAnchorDate(null);\n      } else {\n        rangeCalendarState.selectDate(date);\n      }\n    },\n  };\n\n  const ref = useRef();\n\n  /* @ts-expect-error [strict-migration] The following line is not strict; please fix! */\n  const { calendarProps, prevButtonProps, nextButtonProps } = useRangeCalendar(props, state, ref);\n\n  const monthDateFormatter = useDateFormatter({\n    month: 'long',\n    year: 'numeric',\n    timeZone: timezoneName,\n  });\n\n  const monthHeaders = range(0, visibleMonths).map((i) => {\n    return (\n      <CalendarHeaderMonth key={`calendar-month-${i}`}>\n        {i === 0 && (\n          <PrevButton {...prevButtonProps}>\n            <ArrowLeftIcon />\n          </PrevButton>\n        )}\n        <RangeCalendarHeading aria-hidden>\n          {monthDateFormatter.format(\n            state.visibleRange.start.add({ months: i }).toDate(timezoneName),\n          )}\n        </RangeCalendarHeading>\n        {i === visibleMonths - 1 && (\n          <NextButton {...nextButtonProps}>\n            <ArrowRightIcon />\n          </NextButton>\n        )}\n      </CalendarHeaderMonth>\n    );\n  });\n\n  const monthGrids = range(0, visibleMonths).map((i) => {\n    return (\n      <CalendarGrid\n        key={`calendar-grid-${i}`}\n        state={state}\n        offset={{ months: i }}\n        skipFromTabOrder={i > 0}\n      />\n    );\n  });\n\n  return (\n    <RangeCalendarContainer ref={calendarRef}>\n      {!hidePresets && (\n        <PresetsContainer padding={Spacing[3]}>\n          <RangeCalendarPresets state={state} setDateMode={setDateMode} />\n        </PresetsContainer>\n      )}\n      <Card.Body padding={Spacing[3]}>\n        {/* @ts-expect-error [strict-migration] The following line is not strict; please fix! */}\n        <CalendarContainer {...calendarProps} ref={ref}>\n          {/* Calendar header is separate from grid like this to facilitate a11y. */}\n          <RangeCalendarHeader>\n            <VisuallyHidden isFocusable={false}>{calendarProps['aria-label']}</VisuallyHidden>\n            {monthHeaders}\n          </RangeCalendarHeader>\n          <CalendarGrids>{monthGrids}</CalendarGrids>\n        </CalendarContainer>\n      </Card.Body>\n    </RangeCalendarContainer>\n  );\n};\n\nexport default RangeCalendar;\n","import {\n  CalendarDate,\n  type DateValue,\n  parseAbsolute,\n  toCalendarDateTime,\n} from '@internationalized/date';\nimport type { DateRangePickerProps as DateRangePickerBase } from '@react-types/datepicker';\nimport type { AriaLabelingProps, RangeValue } from '@react-types/shared';\nimport { type DateTime, Settings } from 'luxon';\nimport { useCallback, useEffect, useRef, useState } from 'react';\nimport {\n  mergeProps,\n  useButton,\n  useDateRangePicker,\n  useFocusWithin,\n  usePress,\n  VisuallyHidden,\n} from 'react-aria';\nimport { useDateRangePickerState } from 'react-stately';\nimport styled from 'styled-components';\n\nimport { Spacing, Typography } from '@persona/design-tokens';\nimport { CircleXInverseIcon } from '@persona/icons';\nimport RangeCalendar from 'design-system/components/DatePicker/Calendar/RangeCalendar';\nimport DateField from 'design-system/components/DatePicker/DateField';\nimport { FormLabel } from 'design-system/components/FormControl';\nimport { ClearButton } from 'design-system/components/Input';\nimport Popover from 'design-system/components/Popover';\nimport { isDisabled } from 'design-system/lib/pseudoClass';\nimport type { InputSizes } from 'design-system/mixins/input';\n\nconst DateRangeContainer = styled.div`\n  display: inline-flex;\n  flex-direction: column;\n  width: 100%;\n`;\n\nconst DateRangeInputs = styled.div`\n  display: flex;\n  align-items: center;\n`;\n\nconst CustomFormLabel = styled(FormLabel)`\n  margin-bottom: ${Spacing[2]};\n  ${Typography.TextMediumBold};\n`;\n\nexport type DateRange = {\n  startDate?: DateTime;\n  endDate?: DateTime;\n};\n\nexport interface DateRangePickerProps extends DateRangePickerBase<DateValue>, AriaLabelingProps {\n  dateRange: DateRange;\n  onChange: (range: RangeValue<DateValue> | null) => void;\n  disabled?: boolean;\n  size?: InputSizes;\n  minDate?: DateValue;\n  maxDate?: DateValue;\n  label?: string | null;\n  dataTest?: string;\n  id?: string;\n  hidePresets?: boolean;\n  className?: string;\n  /**\n   * Whether or not to display clear button\n   */\n  showClear?: boolean;\n  /**\n   * Called when the clear button is clicked/pressed\n   */\n  onClear?: () => void;\n  /**\n   * z-index of the calendar popover\n   */\n  calendarZIndex?: number;\n  /**\n   * Element that should contain the calendar portal.\n   */\n  portalContainer?: HTMLElement | null;\n}\n\nconst OpenButton = ({ onOpen, disabled }: { onOpen: () => void; disabled?: boolean }) => {\n  const openCalBtnRef = useRef<HTMLButtonElement>(null);\n  const { buttonProps } = useButton(\n    {\n      isDisabled: disabled,\n      onPress: onOpen,\n    },\n    openCalBtnRef,\n  );\n\n  return (\n    <button\n      {...buttonProps}\n      type='button'\n      ref={openCalBtnRef}\n      aria-label='Open calendar'\n      tabIndex={-1}\n    />\n  );\n};\n\nconst ClearRangeButton = styled(ClearButton)`\n  height: 16px;\n  width: 16px;\n  margin-left: ${Spacing[2]};\n\n  &${isDisabled}, &:disabled {\n    background-color: transparent;\n  }\n`;\n\nconst DateRangePicker = ({\n  granularity = 'day',\n  hideTimeZone = true,\n  className,\n  calendarZIndex,\n  portalContainer,\n  ...props\n}: DateRangePickerProps) => {\n  const state = useDateRangePickerState({ granularity, hideTimeZone, ...props });\n  const ref = useRef<HTMLDivElement>(null);\n  const startFieldRef = useRef<HTMLDivElement>(null);\n  const endFieldRef = useRef<HTMLDivElement>(null);\n  const calendarRef = useRef<HTMLDivElement>(null);\n  const [dateMode, setDateMode] = useState<'start' | 'end' | null>(null);\n  const [isClosing, setIsClosing] = useState(false);\n  const { groupProps, startFieldProps, endFieldProps, calendarProps, labelProps } =\n    useDateRangePicker({ granularity, hideTimeZone, ...props }, state, ref);\n\n  const focusCalendar = useCallback(() => {\n    requestAnimationFrame(() => {\n      const firstFocusableCalendarElement = calendarRef.current?.querySelector<HTMLElement>(\n        '[role=\"menuitem\"], button:not(:disabled), [tabindex=\"0\"]',\n      );\n      firstFocusableCalendarElement?.focus();\n    });\n  }, []);\n\n  const openCalendar = useCallback(() => {\n    if (!props.disabled && !state.isOpen && !isClosing) {\n      state.setOpen(true);\n    }\n  }, [isClosing, props.disabled, state]);\n\n  const openCalendarWithFocus = useCallback(() => {\n    openCalendar();\n    focusCalendar();\n  }, [focusCalendar, openCalendar]);\n\n  useEffect(() => {\n    // If not set, return early\n    if (!props.dateRange.startDate || !props.dateRange.endDate) {\n      return;\n    }\n\n    if (!props.dateRange.startDate.isValid || !props.dateRange.endDate.isValid) {\n      return;\n    }\n\n    // Find out the real time by adjusting the date to the user's timezone\n    const startDate = props.dateRange.startDate.setZone(Settings.defaultZone);\n    const endDate = props.dateRange.endDate.setZone(Settings.defaultZone);\n\n    if (!startDate.isValid || !endDate.isValid) {\n      return;\n    }\n\n    // Months are 1-indexed, no translations need to happen to CalendarDates\n    const startCalendar = state.hasTime\n      ? parseAbsolute(startDate.toISO(), Settings.defaultZone.name)\n      : new CalendarDate(startDate.year, startDate.month, startDate.day);\n    const endCalendar = state.hasTime\n      ? parseAbsolute(endDate.toISO(), Settings.defaultZone.name)\n      : new CalendarDate(endDate.year, endDate.month, endDate.day);\n\n    const dateRangeV2: RangeValue<DateValue> = {\n      start: startCalendar,\n      end: endCalendar,\n    };\n\n    state.setValue(dateRangeV2);\n  }, [props.dateRange.startDate, props.dateRange.endDate, granularity]);\n\n  // Auto-close overlay when a complete range is selected (e.g., from presets with time enabled)\n  const prevValueRef = useRef<RangeValue<DateValue | null> | null>(state.value);\n  useEffect(() => {\n    const prevValue = prevValueRef.current;\n    const currentValue = state.value;\n\n    // Update ref for next comparison\n    prevValueRef.current = currentValue;\n\n    // Close overlay only if BOTH start and end changed simultaneously to DIFFERENT dates (e.g., preset selection)\n    // Do not close during manual date selection where:\n    // 1. Only one date changes at a time, OR\n    // 2. Both dates are set to the same value (initial selection from empty state)\n    // Use value comparison (.compare) instead of object identity to handle controlled component re-renders\n    const startChanged =\n      prevValue?.start && currentValue?.start\n        ? prevValue.start.compare(currentValue.start) !== 0\n        : prevValue?.start !== currentValue?.start;\n    const endChanged =\n      prevValue?.end && currentValue?.end\n        ? prevValue.end.compare(currentValue.end) !== 0\n        : prevValue?.end !== currentValue?.end;\n    const datesAreDifferent =\n      currentValue?.start &&\n      currentValue?.end &&\n      currentValue.start.compare(currentValue.end) !== 0;\n\n    if (state.isOpen && startChanged && endChanged && datesAreDifferent) {\n      state.setOpen(false);\n    }\n  }, [state.value, state.isOpen]);\n\n  const { focusWithinProps: startFocusWithinProps } = useFocusWithin({\n    onFocusWithin: () => {\n      setDateMode('start');\n      openCalendar();\n    },\n  });\n\n  const { focusWithinProps: endFocusWithinProps } = useFocusWithin({\n    onFocusWithin: () => {\n      setDateMode('end');\n      openCalendar();\n    },\n  });\n\n  const { focusWithinProps: containerFocusProps } = useFocusWithin({\n    onBlurWithin: () => {\n      requestAnimationFrame(() => {\n        // Wait for popover focus transitions to settle before closing.\n        const activeElement = document.activeElement;\n        const isFocusInDateRangeInput =\n          activeElement instanceof Node && ref.current?.contains(activeElement);\n        const isFocusInCalendar =\n          activeElement instanceof Node && calendarRef.current?.contains(activeElement);\n\n        if (isFocusInDateRangeInput || isFocusInCalendar) {\n          return;\n        }\n\n        setDateMode(null);\n        if (state.isOpen) {\n          state.setOpen(false);\n        }\n      });\n    },\n  });\n\n  const handleOutsideClick = (e: Event) => {\n    const target = e.target as Node;\n    // Don't close if clicking on the date inputs themselves\n    if (ref.current?.contains(target)) {\n      return;\n    }\n\n    // When there's a click outside of the containers + calendars, reset the highlighted date\n    // Only close the calendar if it's open\n    // Note: Radix UI's onInteractOutside already ensures the interaction is outside the popover content\n    if (state.isOpen) {\n      setDateMode(null);\n      state.setOpen(false);\n    }\n  };\n\n  const { pressProps: pressClearProps } = usePress({\n    onPress: () => {\n      state.setValue(null);\n\n      if (props.onClear) {\n        props.onClear();\n      }\n    },\n  });\n\n  const handleKeyDown = useCallback(\n    (event: React.KeyboardEvent) => {\n      if (event.key === 'Enter') {\n        event.preventDefault(); // Prevent form submission\n        openCalendarWithFocus();\n      }\n    },\n    [openCalendarWithFocus],\n  );\n\n  const isValueNull = state.value && state.value.start == null && state.value.end == null;\n\n  return (\n    <DateRangeContainer data-test={props.dataTest} className={className}>\n      {props.label && <CustomFormLabel {...labelProps}>{props.label}</CustomFormLabel>}\n      <Popover\n        open={state.isOpen}\n        modal={false}\n        portalProps={portalContainer ? { container: portalContainer } : undefined}\n        contentProps={{\n          align: 'start',\n          'aria-modal': true,\n          'aria-label': props['aria-label'] ?? undefined,\n          onInteractOutside: handleOutsideClick,\n          onOpenAutoFocus: (e: Event) => {\n            // Field focus opens the calendar for editing, while Enter/Open calendar moves focus inside.\n            e.preventDefault();\n          },\n          onEscapeKeyDown: () => {\n            state.setOpen(false);\n            // Restore focus to the date field for keyboard users\n            if (dateMode) {\n              const fieldRef = dateMode === 'start' ? startFieldRef : endFieldRef;\n              const seg = fieldRef.current?.querySelector('[tabindex=\"0\"]');\n              if (seg instanceof HTMLElement) {\n                seg.focus();\n              }\n            }\n          },\n          onCloseAutoFocus: (e: Event) => {\n            // Prevent Radix's default focus restoration — Escape handles its own above.\n            e.preventDefault();\n            setIsClosing(true);\n            requestAnimationFrame(() => setIsClosing(false));\n          },\n          noPadding: true,\n          style: { zIndex: calendarZIndex },\n          zIndex: calendarZIndex,\n        }}\n      >\n        <Popover.Trigger asChild>\n          <DateRangeInputs {...mergeProps(groupProps, containerFocusProps)} ref={ref}>\n            {/* @ts-expect-error [strict-migration] The following line is not strict; please fix! */}\n            <DateField\n              ref={startFieldRef}\n              inputPosition='start'\n              focused={dateMode === 'start'}\n              disabled={props.disabled}\n              size={props.size}\n              {...mergeProps(startFieldProps, startFocusWithinProps, { onKeyDown: handleKeyDown })}\n            />\n            {/* @ts-expect-error [strict-migration] The following line is not strict; please fix! */}\n            <DateField\n              ref={endFieldRef}\n              inputPosition='end'\n              focused={dateMode === 'end'}\n              disabled={props.disabled}\n              size={props.size}\n              {...mergeProps(endFieldProps, endFocusWithinProps, { onKeyDown: handleKeyDown })}\n            />\n            {props.showClear && (\n              <ClearRangeButton\n                {...pressClearProps}\n                type='button'\n                disabled={isValueNull}\n                aria-label='Clear date range'\n              >\n                <CircleXInverseIcon />\n              </ClearRangeButton>\n            )}\n            <VisuallyHidden>\n              <OpenButton onOpen={openCalendarWithFocus} disabled={props.disabled} />\n            </VisuallyHidden>\n          </DateRangeInputs>\n        </Popover.Trigger>\n        <RangeCalendar\n          {...{ ...calendarProps, autoFocus: undefined }}\n          calendarRef={calendarRef}\n          setDateMode={setDateMode}\n          setValue={state.setValue}\n          granularity={granularity}\n          hidePresets={props.hidePresets}\n          onSelectDate={(dateVal) => {\n            /**\n             * Please use caution when editing the logic below.\n             * It is specific to react-aria's date picker and can be brittle.\n             */\n            if (dateVal) {\n              const date = state.hasTime ? toCalendarDateTime(dateVal) : dateVal;\n\n              if (dateMode === 'start') {\n                // Handle a case where we've deleted both dates\n                if (state.value.end == null && state.value.start == null) {\n                  state.setValue({\n                    start: date,\n                    end: date,\n                  });\n                }\n                // If end becomes the start\n                else if (state.value.end && date.compare(state.value.end) > 0) {\n                  state.setValue({\n                    start: state.value.end,\n                    end: state.value.end.set(dateVal), // Preserve time\n                  });\n                } else {\n                  state.setValue({\n                    // if start is not set, set it to the date or date + time value, otherwise set the dateVal to preserve time\n                    start: state.value.start == null ? date : state.value.start.set(dateVal),\n                    /* @ts-expect-error [strict-migration] The following line is not strict; please fix! */\n\n                    end: state.value.end,\n                  });\n                }\n                setDateMode('end');\n              } else {\n                // Handle a case where we've deleted both dates\n                if (state.value.end == null && state.value.start == null) {\n                  state.setValue({\n                    start: date,\n                    end: date,\n                  });\n                }\n                // If start becomes the end\n                else if (state.value.start && date.compare(state.value.start) < 0) {\n                  state.setValue({\n                    start: state.value.start.set(dateVal),\n                    end: state.value.start,\n                  });\n                } else {\n                  state.setValue({\n                    /* @ts-expect-error [strict-migration] The following line is not strict; please fix! */\n                    start: state.value.start,\n                    // if end is not set, set it to the date or date + time value, otherwise set the dateVal to preserve time\n                    end: state.value.end == null ? date : state.value.end.set(dateVal),\n                  });\n                }\n                // Close popover and keep focus on end field\n                state.setOpen(false);\n              }\n            }\n          }}\n          minDate={props.minDate}\n          maxDate={props.maxDate}\n        />\n      </Popover>\n    </DateRangeContainer>\n  );\n};\n\nexport default DateRangePicker;\n"],"mappings":"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"}

package/dist/components/FormField/index.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.cjs","names":["useFormGroup","FormLabel","FormControl","HStack","Spacing","FormInputContainer","HelperText","WarningText","ErrorText","Input","TextArea","Select","RadioGroup","Checkbox","Toggle","SegmentedControl","Combobox","FormControlContext","Children","useFormGroup","IconButton","PlusIcon","DropdownMenu","MoreIcon","ListBox","useFormGroup","IconButton","PlusIcon","DropdownMenu","MoreIcon","Fragment","TableBox"],"sources":["../../../components/FormField/FormField.tsx","../../../components/FormField/inputFields.tsx","../../../components/FormField/CheckboxGroupField.tsx","../../../components/FormField/ListBoxField.tsx","../../../components/FormField/TableBoxField.tsx"],"sourcesContent":["import { type ComponentPropsWithRef, forwardRef, type ReactElement, type ReactNode } from 'react';\n\nimport { Spacing } from '@persona/design-tokens';\nimport useFormGroup from 'design-system/components/ConfigFormGroup/useFormGroup';\nimport FormControl, {\n  ErrorText,\n  type FormControlProps,\n  FormInputContainer,\n  FormLabel,\n  HelperText,\n  WarningText,\n} from 'design-system/components/FormControl';\nimport { HStack } from 'design-system/components/Stack';\n\nexport interface FormFieldBaseProps {\n  /**\n   * Renders `<Label>` above input\n   */\n  label?: ReactNode;\n\n  /**\n   * ID of the input element. Providing this will automatically link the label to the input.\n   */\n  inputId?: string;\n\n  /**\n   * Renders `<HelperText>` below input\n   */\n  helperText?: ReactNode;\n\n  /**\n   * Renders `<ErrorText>` below input and helper text.\n   */\n  errorText?: ReactNode;\n\n  /**\n   * Renders `<WarningText>` below input and helper text.\n   */\n  warningText?: ReactNode;\n\n  /**\n   * Should be an input of some sort\n   */\n  children?: ReactElement;\n\n  labelProps?: ComponentPropsWithRef<typeof FormLabel>;\n  helperProps?: ComponentPropsWithRef<typeof HelperText>;\n  warningProps?: ComponentPropsWithRef<typeof WarningText>;\n  errorProps?: ComponentPropsWithRef<typeof ErrorText>;\n\n  /**\n   * Whether to render the form field as a config field.\n   * This will render the helper text as a tooltip.\n   */\n  configField?: boolean;\n\n  /**\n   * Override the width of the input area when `configField` is true.\n   * Accepts any valid CSS width value (e.g. `'33%'`, `'66.67%'`).\n   * Defaults to `'50%'`.\n   */\n  configFieldInputWidth?: string;\n\n  /**\n   * Renders actions to the right of the label.\n   */\n  rightActions?: ReactNode;\n}\n\nexport interface FormFieldProps extends Omit<FormControlProps, 'children'>, FormFieldBaseProps {}\n\n/**\n * > **Please do not use in production! This component is subject to API and style changes.**\n *\n * Helper components with preset slots for label, input, and helper texts.\n * Fully composed components with different form input types are available.\n * This is the recommended way to implement form elements.\n * You can use `<FormControl>` if you require more flexibility.\n *\n * ## Usage\n *\n * ```tsx\n * import FormField from 'design-system/components/FormField';\n * ```\n */\nexport const FormField = forwardRef<HTMLDivElement, FormFieldProps>(function FormField(\n  {\n    label,\n    children,\n    helperText,\n    warningText,\n    errorText,\n    labelProps,\n    helperProps,\n    warningProps,\n    errorProps,\n    configField: configFieldProp,\n    configFieldInputWidth,\n    rightActions,\n    ...props\n  }: FormFieldProps,\n  ref,\n) {\n  const { configField: configFieldFormGroup } = useFormGroup();\n  const configField = configFieldProp ?? configFieldFormGroup;\n\n  const labelElement = label ? (\n    <FormLabel tooltip={configField && helperText ? helperText : undefined} {...labelProps}>\n      {label}\n    </FormLabel>\n  ) : null;\n\n  return (\n    <FormControl\n      hasError={!!errorText}\n      hasWarning={!!warningText}\n      ref={ref}\n      configField={configField}\n      hasRightActions={!!rightActions}\n      configFieldInputWidth={configFieldInputWidth}\n      {...props}\n    >\n      {rightActions ? (\n        <HStack justify='space-between' align='center'>\n          {labelElement}\n          <HStack spacing={Spacing[1]}>{rightActions}</HStack>\n        </HStack>\n      ) : (\n        labelElement\n      )}\n      <FormInputContainer>{children}</FormInputContainer>\n      {!configField && helperText && <HelperText {...helperProps}>{helperText}</HelperText>}\n      {!configField && warningText && <WarningText {...warningProps}>{warningText}</WarningText>}\n      {!configField && errorText && <ErrorText {...errorProps}>{errorText}</ErrorText>}\n    </FormControl>\n  );\n});\n\nexport default FormField;\n","import { uniqueId } from 'lodash/fp';\nimport { forwardRef, useMemo } from 'react';\n\nimport Checkbox, { type CheckboxProps } from 'design-system/components/Checkbox';\nimport Combobox from 'design-system/components/Combobox';\nimport type { ComboboxMultiSelectProps } from 'design-system/components/Combobox/ComboboxMultiSelect';\nimport type { ComboboxSingleSelectProps } from 'design-system/components/Combobox/ComboboxSingleSelect';\nimport FormField, { type FormFieldBaseProps } from 'design-system/components/FormField/FormField';\nimport Input, { type InputProps } from 'design-system/components/Input';\nimport RadioGroup, { type RadioGroupProps } from 'design-system/components/RadioGroup';\nimport SegmentedControl, {\n  type SegmentedControlProps,\n} from 'design-system/components/SegmentedControl';\nimport Select, { type SelectProps } from 'design-system/components/Select';\nimport TextArea, { type TextAreaProps } from 'design-system/components/TextArea';\nimport Toggle, { type ToggleProps } from 'design-system/components/Toggle';\n\nexport type ImplementsFormField = Omit<FormFieldBaseProps, 'children'>;\n\ntype ExtractFormFieldProps<T extends ImplementsFormField> = Pick<\n  T,\n  | 'label'\n  | 'inputId'\n  | 'helperText'\n  | 'errorText'\n  | 'warningText'\n  | 'labelProps'\n  | 'helperProps'\n  | 'warningProps'\n  | 'errorProps'\n  | 'configField'\n  | 'configFieldInputWidth'\n  | 'rightActions'\n>;\ntype OmitFormFieldProps<T extends ImplementsFormField> = Omit<T, keyof ExtractFormFieldProps<T>>;\n\n/**\n * Helper to split out props that are sent to the FormField component from props sent\n * to the underlying input component.\n */\nexport const splitOutFormFieldProps = <T extends ImplementsFormField>(\n  props: T,\n): {\n  formFieldProps: ExtractFormFieldProps<T>;\n  inputProps: OmitFormFieldProps<T>;\n} => {\n  const {\n    label,\n    inputId,\n    helperText,\n    errorText,\n    warningText,\n    labelProps,\n    helperProps,\n    warningProps,\n    errorProps,\n    configField,\n    configFieldInputWidth,\n    rightActions,\n    ...inputProps\n  } = props;\n\n  return {\n    formFieldProps: {\n      label,\n      inputId,\n      helperText,\n      errorText,\n      warningText,\n      labelProps,\n      helperProps,\n      warningProps,\n      errorProps,\n      configField,\n      configFieldInputWidth,\n      rightActions,\n    },\n    inputProps,\n  };\n};\n\nexport interface TextFieldProps extends ImplementsFormField, InputProps {}\n\nexport const TextField = forwardRef<HTMLInputElement, TextFieldProps>(\n  function TextField(props, ref) {\n    const { formFieldProps, inputProps } = splitOutFormFieldProps(props);\n    const { id, ...rest } = inputProps;\n\n    return (\n      <FormField\n        {...formFieldProps}\n        labelProps={{ size: props.size, ...formFieldProps.labelProps }}\n        inputId={formFieldProps.inputId ?? id}\n      >\n        <Input {...rest} ref={ref} />\n      </FormField>\n    );\n  },\n);\n\nexport interface TextAreaFieldProps extends ImplementsFormField, TextAreaProps {}\n\nexport const TextAreaField = forwardRef<HTMLTextAreaElement, TextAreaFieldProps>(\n  function TextAreaField(\n    { label, helperText, errorText, warningText, inputId, id, configField, ...props },\n    ref,\n  ) {\n    return (\n      <FormField\n        inputId={inputId ?? id}\n        label={label}\n        labelProps={{ size: props.size }}\n        helperText={helperText}\n        warningText={warningText}\n        errorText={errorText}\n        configField={configField}\n      >\n        <TextArea {...props} ref={ref} />\n      </FormField>\n    );\n  },\n);\n\nexport interface SelectFieldProps extends ImplementsFormField, SelectProps {}\n\nexport const SelectField = ({\n  id,\n  label,\n  helperText,\n  errorText,\n  warningText,\n  children,\n  configField,\n  labelProps,\n  ...props\n}: SelectFieldProps) => {\n  const linkedId = useMemo(() => id ?? uniqueId('pds-form-field-input-fields-select__'), [id]);\n\n  return (\n    <FormField\n      label={label}\n      labelProps={{ htmlFor: linkedId, size: props.size, ...labelProps }}\n      helperText={helperText}\n      warningText={warningText}\n      errorText={errorText}\n      configField={configField}\n    >\n      <Select {...props} id={linkedId}>\n        {children}\n      </Select>\n    </FormField>\n  );\n};\n\nexport interface RadioGroupFieldProps\n  extends Omit<ImplementsFormField, 'configField'>, RadioGroupProps {}\n\nexport const RadioGroupField = ({\n  label,\n  helperText,\n  errorText,\n  warningText,\n  children,\n  ...props\n}: RadioGroupFieldProps) => {\n  return (\n    <FormField\n      label={label}\n      helperText={helperText}\n      warningText={warningText}\n      errorText={errorText}\n    >\n      <RadioGroup {...props}>{children}</RadioGroup>\n    </FormField>\n  );\n};\n\nexport interface CheckboxFieldProps extends ImplementsFormField, CheckboxProps {\n  checkboxLabel?: CheckboxProps['label'];\n}\n\nexport const CheckboxField = ({\n  label,\n  helperText,\n  errorText,\n  warningText,\n  checkboxLabel,\n  configField,\n  labelProps,\n  ...props\n}: CheckboxFieldProps) => {\n  return (\n    <FormField\n      label={label}\n      helperText={helperText}\n      warningText={warningText}\n      errorText={errorText}\n      configField={configField}\n      labelProps={labelProps}\n    >\n      <Checkbox label={checkboxLabel} {...props} />\n    </FormField>\n  );\n};\n\nexport interface ToggleFieldProps extends ImplementsFormField, ToggleProps {}\n\nexport const ToggleField = forwardRef<HTMLDivElement, ToggleFieldProps>(function ToggleField(\n  { label, helperText, errorText, warningText, configField, ...props },\n  ref,\n) {\n  return (\n    <FormField\n      label={label}\n      labelProps={{ size: props.size }}\n      helperText={helperText}\n      warningText={warningText}\n      errorText={errorText}\n      configField={configField}\n    >\n      <Toggle {...props} ref={ref} />\n    </FormField>\n  );\n});\n\nexport interface SegmentedControlFieldProps\n  extends ImplementsFormField, Omit<SegmentedControlProps, 'children'> {\n  children?: SegmentedControlProps['children'];\n}\n\nexport const SegmentedControlField = forwardRef<HTMLDivElement, SegmentedControlFieldProps>(\n  function SegmentedControlField(\n    { label, helperText, errorText, warningText, configField, children, labelProps, ...props },\n    ref,\n  ) {\n    return (\n      <FormField\n        label={label}\n        helperText={helperText}\n        warningText={warningText}\n        errorText={errorText}\n        configField={configField}\n        labelProps={labelProps}\n      >\n        <SegmentedControl fullWidth {...props} ref={ref}>\n          {children}\n        </SegmentedControl>\n      </FormField>\n    );\n  },\n);\n\nexport type ComboboxSingleSelectFieldProps<T = string> = ImplementsFormField &\n  ComboboxSingleSelectProps<T>;\nexport type ComboboxMultiSelectFieldProps<T = string> = ImplementsFormField &\n  ComboboxMultiSelectProps<T>;\n\nexport const ComboboxField = ({\n  label,\n  labelProps,\n  helperText,\n  errorText,\n  warningText,\n  configField,\n  ...props\n}: ComboboxSingleSelectFieldProps | ComboboxMultiSelectFieldProps) => {\n  return (\n    <FormField\n      label={label}\n      labelProps={labelProps}\n      helperText={helperText}\n      warningText={warningText}\n      errorText={errorText}\n      configField={configField}\n    >\n      <Combobox {...props} />\n    </FormField>\n  );\n};\n","import {\n  Children,\n  cloneElement,\n  type ComponentPropsWithRef,\n  createContext,\n  type ReactElement,\n  type ReactNode,\n  useContext,\n  useRef,\n} from 'react';\nimport {\n  type AriaCheckboxGroupProps,\n  mergeProps,\n  useCheckboxGroup,\n  useCheckboxGroupItem,\n} from 'react-aria';\nimport innerText from 'react-innertext';\nimport { type CheckboxGroupState, useCheckboxGroupState } from 'react-stately';\n\nimport type { CheckboxProps } from 'design-system/components/Checkbox';\nimport type Checkbox from 'design-system/components/Checkbox';\nimport { FormControlContext } from 'design-system/components/FormControl/useFormField';\nimport FormField from 'design-system/components/FormField/FormField';\nimport type { ImplementsFormField } from 'design-system/components/FormField/inputFields';\n\n/* @ts-expect-error [strict-migration] The following line is not strict; please fix! */\nconst CheckboxGroupContext = createContext<CheckboxGroupState>(null);\n\n/** Preserves the parent FormControl context (disabled, hasError, etc.) but clears\n *  inputId so each Checkbox inside the group generates its own unique id. */\nconst ClearGroupInputId = ({ children }: { children: ReactNode }) => {\n  const parentContext = useContext(FormControlContext);\n  return (\n    <FormControlContext.Provider value={{ ...parentContext, inputId: undefined }}>\n      {children}\n    </FormControlContext.Provider>\n  );\n};\n\ninterface CheckboxGroupItemProps {\n  children: ReactElement<ComponentPropsWithRef<typeof Checkbox>>;\n}\n\nconst CheckboxGroupItem = (props: CheckboxGroupItemProps) => {\n  const { children } = props;\n  const checkboxProps = children.props;\n\n  const state = useContext(CheckboxGroupContext);\n  const ref = useRef();\n  const { inputProps } = useCheckboxGroupItem(\n    /* @ts-expect-error [strict-migration] The following line is not strict; please fix! */\n    {\n      ...checkboxProps,\n      onChange: undefined,\n      isDisabled: checkboxProps.disabled,\n      isReadOnly: checkboxProps.readOnly,\n      isRequired: checkboxProps.required,\n      isIndeterminate: checkboxProps.indeterminate,\n      value: String(children.props.value),\n      'aria-label': innerText(checkboxProps.label),\n    },\n    state,\n    ref,\n  );\n\n  return cloneElement(\n    children,\n    /* @ts-expect-error [strict-migration] The following line is not strict; please fix! */\n    mergeProps(inputProps, {\n      onChange: checkboxProps.onChange,\n      disabled: state.isDisabled || checkboxProps.disabled,\n      checked: state.isSelected(String(inputProps.value)),\n      ref,\n    } as ComponentPropsWithRef<typeof Checkbox>),\n  );\n};\n\ninterface CheckboxGroupFieldProps\n  extends\n    Omit<ImplementsFormField, 'configField'>,\n    Omit<\n      AriaCheckboxGroupProps,\n      'description' | 'disabled' | 'isReadOnly' | 'isRequired' | 'errorMessage'\n    > {\n  children?: ReactElement<CheckboxProps>[];\n  disabled?: boolean;\n  readOnly?: boolean;\n  required?: boolean;\n}\n\nconst CheckboxGroupField = ({\n  children,\n  name,\n  onChange,\n  disabled,\n  readOnly,\n  required,\n  ...props\n}: CheckboxGroupFieldProps) => {\n  const reactAriaProps = {\n    ...props,\n    description: props.helperText,\n    errorMessage: props.errorText,\n    onChange,\n    name,\n    isDisabled: disabled,\n    isReadOnly: readOnly,\n    isRequired: required,\n  };\n  const state = useCheckboxGroupState(reactAriaProps);\n  const { groupProps, labelProps, descriptionProps, errorMessageProps } = useCheckboxGroup(\n    reactAriaProps,\n    state,\n  );\n\n  return (\n    <FormField\n      labelProps={labelProps}\n      helperProps={descriptionProps}\n      errorProps={errorMessageProps}\n      disabled={disabled}\n      {...groupProps}\n      {...props}\n    >\n      <ClearGroupInputId>\n        <CheckboxGroupContext.Provider value={state}>\n          {Children.map(children, (checkbox) => (\n            /* @ts-expect-error [strict-migration] The following line is not strict; please fix! */\n            <CheckboxGroupItem>{checkbox}</CheckboxGroupItem>\n          ))}\n        </CheckboxGroupContext.Provider>\n      </ClearGroupInputId>\n    </FormField>\n  );\n};\n\nexport default CheckboxGroupField;\n","import { type ReactNode, useState } from 'react';\n\nimport { MoreIcon, PlusIcon } from '@persona/icons';\nimport { IconButton } from 'design-system/components/Button';\nimport useFormGroup from 'design-system/components/ConfigFormGroup/useFormGroup';\nimport DropdownMenu from 'design-system/components/DropdownMenu';\nimport FormField from 'design-system/components/FormField/FormField';\nimport type { ImplementsFormField } from 'design-system/components/FormField/inputFields';\nimport ListBox, { type ListBoxProps } from 'design-system/components/ListBox';\nimport type { MenuItemProps } from 'design-system/components/Menu';\n\ninterface ListBoxFieldAction extends Omit<MenuItemProps, 'children'> {\n  label: string;\n  onClick: (selectedKeys: ListBoxProps<any>['selectedKeys']) => void;\n}\n\ninterface AddDropdownConfig {\n  options: ({ label: ReactNode; value: string } & Omit<MenuItemProps, 'children'>)[];\n  onSelection: (value: string) => void;\n}\n\ninterface ListBoxFieldProps<T extends object> extends ImplementsFormField, ListBoxProps<T> {\n  actions?: ListBoxFieldAction[];\n  addDropdownConfig?: AddDropdownConfig;\n}\n\nconst ListBoxField = <T extends object>({\n  label,\n  helperText,\n  errorText,\n  warningText,\n  labelProps,\n  helperProps,\n  errorProps,\n  warningProps,\n  inputId,\n  onAdd,\n  onDelete,\n  deleteDisabled,\n  configField: configFieldProp,\n  size = 'md',\n  actions = [],\n  addDropdownConfig,\n  selectedKeys: selectedKeysProp,\n  onSelectionChange,\n  defaultSelectedKeys,\n  ...props\n}: ListBoxFieldProps<T>) => {\n  const { configField } = useFormGroup({ configField: configFieldProp });\n  const menuActions: ListBoxFieldAction[] = [...actions];\n  const [selectedKeysState, setSelectedKeys] = useState(defaultSelectedKeys);\n  const selectedKeys = selectedKeysProp ?? selectedKeysState;\n  const effectiveSize = configField ? 'sm' : size;\n\n  if (onDelete) {\n    menuActions.unshift({\n      label: 'Delete',\n      onClick: () => onDelete(selectedKeys),\n      disabled:\n        deleteDisabled ||\n        selectedKeys == null ||\n        (typeof selectedKeys === 'object' && [...selectedKeys].length === 0),\n    });\n  }\n\n  const addButton = (\n    <IconButton size='sm' onClick={onAdd} aria-label='Add item to list'>\n      <PlusIcon />\n    </IconButton>\n  );\n\n  return (\n    <FormField\n      label={label}\n      helperText={helperText}\n      errorText={errorText}\n      warningText={warningText}\n      labelProps={labelProps}\n      helperProps={helperProps}\n      errorProps={errorProps}\n      warningProps={warningProps}\n      inputId={inputId}\n      configField={configField}\n      rightActions={\n        configField && (\n          <>\n            {menuActions.length > 0 && (\n              <DropdownMenu\n                trigger={\n                  <IconButton aria-label='Actions' size='sm'>\n                    <MoreIcon />\n                  </IconButton>\n                }\n                portal\n              >\n                {menuActions.map((action) => (\n                  <DropdownMenu.Item\n                    key={action.label}\n                    {...action}\n                    onClick={() => action.onClick(selectedKeys)}\n                    size={effectiveSize}\n                  >\n                    {action.label}\n                  </DropdownMenu.Item>\n                ))}\n              </DropdownMenu>\n            )}\n            {onAdd && !addDropdownConfig && addButton}\n            {addDropdownConfig && (\n              <DropdownMenu trigger={addButton} align='start' portal>\n                {addDropdownConfig.options.map((option) => (\n                  <DropdownMenu.Item\n                    key={option.value}\n                    {...option}\n                    onClick={() => addDropdownConfig.onSelection(option.value)}\n                    size={effectiveSize}\n                  >\n                    {option.label}\n                  </DropdownMenu.Item>\n                ))}\n              </DropdownMenu>\n            )}\n          </>\n        )\n      }\n    >\n      <ListBox\n        id={inputId}\n        fullWidth={configField}\n        size={effectiveSize}\n        deleteDisabled={deleteDisabled}\n        // We have to control the keys so we can power the `rightActions`\n        selectedKeys={selectedKeys}\n        onSelectionChange={(keys) => {\n          onSelectionChange?.(keys);\n          setSelectedKeys(keys);\n        }}\n        {...props}\n      />\n    </FormField>\n  );\n};\n\nexport default ListBoxField;\n","import { Fragment, type MouseEvent, type ReactNode, useState } from 'react';\n\nimport { IconButton } from '@persona/design-system/components/Button';\nimport { useFormGroup } from '@persona/design-system/components/ConfigFormGroup';\nimport DropdownMenu from '@persona/design-system/components/DropdownMenu';\nimport type { FormLabelProps } from '@persona/design-system/components/FormControl';\nimport type { MenuItemProps } from '@persona/design-system/components/Menu';\nimport TableBox, { type TableBoxProps } from '@persona/design-system/components/TableBox';\nimport { MoreIcon, PlusIcon } from '@persona/icons';\n\nimport FormField from './FormField';\nimport type { ImplementsFormField } from './inputFields';\n\nexport interface TableBoxFieldAction extends Omit<MenuItemProps, 'children'> {\n  label: string;\n  onClick: (selectedKey: TableBoxProps['selectedKey']) => void;\n}\n\nexport interface TableBoxFieldActionGroup {\n  type: 'group';\n  heading: string;\n  actions: TableBoxFieldAction[];\n}\n\nexport type TableBoxFieldActionEntry = TableBoxFieldAction | TableBoxFieldActionGroup;\n\nconst isActionGroup = (action: TableBoxFieldActionEntry): action is TableBoxFieldActionGroup =>\n  'type' in action && action.type === 'group';\n\ninterface AddDropdownConfig {\n  options: Array<{ label: string; value: string }>;\n  onSelection: (value: string) => void;\n}\n\ninterface TableBoxFieldProps<T extends object = object>\n  extends ImplementsFormField, Omit<TableBoxProps<T>, 'aria-label' | 'onCreateNewRow'> {\n  onAdd?: (e: MouseEvent<HTMLButtonElement>) => void;\n  onDelete?: (selectedKey: string | null) => void;\n  deleteDisabled?: boolean;\n  /** Actions and labeled action groups rendered in order. Empty groups are omitted. */\n  actions?: TableBoxFieldActionEntry[];\n  addDropdownConfig?: AddDropdownConfig;\n\n  /**\n   * Callback to create a new row and add it to the rows array\n   * Should return the id of the newly created row\n   */\n  createNewRow?: () => string;\n  children?: ReactNode;\n}\n\nconst TableBoxField = <T extends object = object>({\n  label,\n  helperText,\n  errorText,\n  warningText,\n  labelProps: labelPropsProp,\n  helperProps,\n  errorProps,\n  warningProps,\n  inputId,\n  onAdd,\n  onDelete,\n  deleteDisabled,\n  configField: configFieldProp = true,\n  actions = [],\n  addDropdownConfig,\n  selectedKey: selectedKeyProp,\n  onSelectionChange,\n  defaultSelectedKey,\n  selectionMode,\n  disabled,\n  createNewRow,\n  children,\n  emptyText = 'No data',\n  ...props\n}: TableBoxFieldProps<T>) => {\n  const { configField } = useFormGroup({ configField: configFieldProp });\n  const menuActions: TableBoxFieldActionEntry[] = [...actions];\n  const [selectedKeyState, setSelectedKey] = useState(defaultSelectedKey);\n  const selectedKey = selectedKeyProp ?? selectedKeyState;\n  const [newRowId, setNewRowId] = useState<string | null>(null);\n  const labelProps: FormLabelProps = { size: 'sm', ...labelPropsProp };\n\n  const handleCreateNewRow = () => {\n    if (createNewRow) {\n      setNewRowId(createNewRow());\n    }\n  };\n\n  // Handle add button click\n  const handleAddClick = (e: MouseEvent<HTMLButtonElement>) => {\n    if (createNewRow) {\n      handleCreateNewRow();\n    } else if (onAdd) {\n      onAdd(e);\n    }\n  };\n\n  if (onDelete) {\n    menuActions.unshift({\n      label: 'Delete',\n      onClick: () => selectedKey && onDelete(selectedKey),\n      disabled: deleteDisabled || selectedKey == null,\n    });\n  }\n  const visibleMenuActions = menuActions.filter(\n    (action) => !isActionGroup(action) || action.actions.length > 0,\n  );\n\n  const addButton = (\n    <IconButton\n      size='sm'\n      onClick={handleAddClick}\n      aria-label='Add item to table'\n      disabled={disabled}\n    >\n      <PlusIcon />\n    </IconButton>\n  );\n\n  return (\n    <FormField\n      label={label}\n      helperText={helperText}\n      errorText={errorText}\n      warningText={warningText}\n      labelProps={labelProps}\n      helperProps={helperProps}\n      errorProps={errorProps}\n      warningProps={warningProps}\n      inputId={inputId}\n      rightActions={\n        configField && (\n          <>\n            {visibleMenuActions.length > 0 && (\n              <DropdownMenu\n                trigger={\n                  <IconButton aria-label='Actions' size='sm' disabled={disabled}>\n                    <MoreIcon />\n                  </IconButton>\n                }\n                portal\n              >\n                {visibleMenuActions.map((entry, entryIndex) => {\n                  const previousEntry = visibleMenuActions[entryIndex - 1];\n                  if (isActionGroup(entry)) {\n                    return (\n                      <Fragment key={`${entry.heading}-${entryIndex}`}>\n                        {entryIndex > 0 && <DropdownMenu.Divider />}\n                        <DropdownMenu.Heading size='sm'>{entry.heading}</DropdownMenu.Heading>\n                        {entry.actions.map((action) => (\n                          <DropdownMenu.Item\n                            key={action.label}\n                            {...action}\n                            disabled={disabled || action.disabled}\n                            onClick={() => action.onClick(selectedKey)}\n                            size='sm'\n                          >\n                            {action.label}\n                          </DropdownMenu.Item>\n                        ))}\n                      </Fragment>\n                    );\n                  }\n\n                  return (\n                    <Fragment key={`${entry.label}-${entryIndex}`}>\n                      {previousEntry && isActionGroup(previousEntry) && <DropdownMenu.Divider />}\n                      <DropdownMenu.Item\n                        {...entry}\n                        disabled={disabled || entry.disabled}\n                        onClick={() => entry.onClick(selectedKey)}\n                        size='sm'\n                      >\n                        {entry.label}\n                      </DropdownMenu.Item>\n                    </Fragment>\n                  );\n                })}\n              </DropdownMenu>\n            )}\n            {(onAdd || createNewRow) && !addDropdownConfig && addButton}\n            {addDropdownConfig && (\n              <DropdownMenu trigger={addButton} portal>\n                {addDropdownConfig.options.map((option) => (\n                  <DropdownMenu.Item\n                    key={option.value}\n                    {...option}\n                    onClick={() => addDropdownConfig.onSelection(option.value)}\n                    size='sm'\n                  >\n                    {option.label}\n                  </DropdownMenu.Item>\n                ))}\n              </DropdownMenu>\n            )}\n          </>\n        )\n      }\n    >\n      <TableBox\n        aria-label={`${label} table`}\n        // We have to control the keys so we can power the `rightActions`\n        selectedKey={selectedKey}\n        onSelectionChange={(key) => {\n          onSelectionChange?.(key);\n          setSelectedKey(key);\n        }}\n        selectionMode={selectionMode}\n        newRowId={newRowId}\n        onCreateNewRow={createNewRow ? handleCreateNewRow : undefined}\n        emptyText={emptyText}\n        disabled={disabled}\n        {...props}\n      >\n        {children}\n      </TableBox>\n    </FormField>\n  );\n};\n\n// Attach subcomponents to TableBoxField\nTableBoxField.Row = TableBox.Row;\nTableBoxField.Cell = TableBox.Cell;\n\nexport default TableBoxField;\n"],"mappings":"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"}

package/dist/components/FormField/index.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.mjs","names":["Input","TextArea","DropdownMenu","DropdownMenu"],"sources":["../../../components/FormField/FormField.tsx","../../../components/FormField/inputFields.tsx","../../../components/FormField/CheckboxGroupField.tsx","../../../components/FormField/ListBoxField.tsx","../../../components/FormField/TableBoxField.tsx"],"sourcesContent":["import { type ComponentPropsWithRef, forwardRef, type ReactElement, type ReactNode } from 'react';\n\nimport { Spacing } from '@persona/design-tokens';\nimport useFormGroup from 'design-system/components/ConfigFormGroup/useFormGroup';\nimport FormControl, {\n  ErrorText,\n  type FormControlProps,\n  FormInputContainer,\n  FormLabel,\n  HelperText,\n  WarningText,\n} from 'design-system/components/FormControl';\nimport { HStack } from 'design-system/components/Stack';\n\nexport interface FormFieldBaseProps {\n  /**\n   * Renders `<Label>` above input\n   */\n  label?: ReactNode;\n\n  /**\n   * ID of the input element. Providing this will automatically link the label to the input.\n   */\n  inputId?: string;\n\n  /**\n   * Renders `<HelperText>` below input\n   */\n  helperText?: ReactNode;\n\n  /**\n   * Renders `<ErrorText>` below input and helper text.\n   */\n  errorText?: ReactNode;\n\n  /**\n   * Renders `<WarningText>` below input and helper text.\n   */\n  warningText?: ReactNode;\n\n  /**\n   * Should be an input of some sort\n   */\n  children?: ReactElement;\n\n  labelProps?: ComponentPropsWithRef<typeof FormLabel>;\n  helperProps?: ComponentPropsWithRef<typeof HelperText>;\n  warningProps?: ComponentPropsWithRef<typeof WarningText>;\n  errorProps?: ComponentPropsWithRef<typeof ErrorText>;\n\n  /**\n   * Whether to render the form field as a config field.\n   * This will render the helper text as a tooltip.\n   */\n  configField?: boolean;\n\n  /**\n   * Override the width of the input area when `configField` is true.\n   * Accepts any valid CSS width value (e.g. `'33%'`, `'66.67%'`).\n   * Defaults to `'50%'`.\n   */\n  configFieldInputWidth?: string;\n\n  /**\n   * Renders actions to the right of the label.\n   */\n  rightActions?: ReactNode;\n}\n\nexport interface FormFieldProps extends Omit<FormControlProps, 'children'>, FormFieldBaseProps {}\n\n/**\n * > **Please do not use in production! This component is subject to API and style changes.**\n *\n * Helper components with preset slots for label, input, and helper texts.\n * Fully composed components with different form input types are available.\n * This is the recommended way to implement form elements.\n * You can use `<FormControl>` if you require more flexibility.\n *\n * ## Usage\n *\n * ```tsx\n * import FormField from 'design-system/components/FormField';\n * ```\n */\nexport const FormField = forwardRef<HTMLDivElement, FormFieldProps>(function FormField(\n  {\n    label,\n    children,\n    helperText,\n    warningText,\n    errorText,\n    labelProps,\n    helperProps,\n    warningProps,\n    errorProps,\n    configField: configFieldProp,\n    configFieldInputWidth,\n    rightActions,\n    ...props\n  }: FormFieldProps,\n  ref,\n) {\n  const { configField: configFieldFormGroup } = useFormGroup();\n  const configField = configFieldProp ?? configFieldFormGroup;\n\n  const labelElement = label ? (\n    <FormLabel tooltip={configField && helperText ? helperText : undefined} {...labelProps}>\n      {label}\n    </FormLabel>\n  ) : null;\n\n  return (\n    <FormControl\n      hasError={!!errorText}\n      hasWarning={!!warningText}\n      ref={ref}\n      configField={configField}\n      hasRightActions={!!rightActions}\n      configFieldInputWidth={configFieldInputWidth}\n      {...props}\n    >\n      {rightActions ? (\n        <HStack justify='space-between' align='center'>\n          {labelElement}\n          <HStack spacing={Spacing[1]}>{rightActions}</HStack>\n        </HStack>\n      ) : (\n        labelElement\n      )}\n      <FormInputContainer>{children}</FormInputContainer>\n      {!configField && helperText && <HelperText {...helperProps}>{helperText}</HelperText>}\n      {!configField && warningText && <WarningText {...warningProps}>{warningText}</WarningText>}\n      {!configField && errorText && <ErrorText {...errorProps}>{errorText}</ErrorText>}\n    </FormControl>\n  );\n});\n\nexport default FormField;\n","import { uniqueId } from 'lodash/fp';\nimport { forwardRef, useMemo } from 'react';\n\nimport Checkbox, { type CheckboxProps } from 'design-system/components/Checkbox';\nimport Combobox from 'design-system/components/Combobox';\nimport type { ComboboxMultiSelectProps } from 'design-system/components/Combobox/ComboboxMultiSelect';\nimport type { ComboboxSingleSelectProps } from 'design-system/components/Combobox/ComboboxSingleSelect';\nimport FormField, { type FormFieldBaseProps } from 'design-system/components/FormField/FormField';\nimport Input, { type InputProps } from 'design-system/components/Input';\nimport RadioGroup, { type RadioGroupProps } from 'design-system/components/RadioGroup';\nimport SegmentedControl, {\n  type SegmentedControlProps,\n} from 'design-system/components/SegmentedControl';\nimport Select, { type SelectProps } from 'design-system/components/Select';\nimport TextArea, { type TextAreaProps } from 'design-system/components/TextArea';\nimport Toggle, { type ToggleProps } from 'design-system/components/Toggle';\n\nexport type ImplementsFormField = Omit<FormFieldBaseProps, 'children'>;\n\ntype ExtractFormFieldProps<T extends ImplementsFormField> = Pick<\n  T,\n  | 'label'\n  | 'inputId'\n  | 'helperText'\n  | 'errorText'\n  | 'warningText'\n  | 'labelProps'\n  | 'helperProps'\n  | 'warningProps'\n  | 'errorProps'\n  | 'configField'\n  | 'configFieldInputWidth'\n  | 'rightActions'\n>;\ntype OmitFormFieldProps<T extends ImplementsFormField> = Omit<T, keyof ExtractFormFieldProps<T>>;\n\n/**\n * Helper to split out props that are sent to the FormField component from props sent\n * to the underlying input component.\n */\nexport const splitOutFormFieldProps = <T extends ImplementsFormField>(\n  props: T,\n): {\n  formFieldProps: ExtractFormFieldProps<T>;\n  inputProps: OmitFormFieldProps<T>;\n} => {\n  const {\n    label,\n    inputId,\n    helperText,\n    errorText,\n    warningText,\n    labelProps,\n    helperProps,\n    warningProps,\n    errorProps,\n    configField,\n    configFieldInputWidth,\n    rightActions,\n    ...inputProps\n  } = props;\n\n  return {\n    formFieldProps: {\n      label,\n      inputId,\n      helperText,\n      errorText,\n      warningText,\n      labelProps,\n      helperProps,\n      warningProps,\n      errorProps,\n      configField,\n      configFieldInputWidth,\n      rightActions,\n    },\n    inputProps,\n  };\n};\n\nexport interface TextFieldProps extends ImplementsFormField, InputProps {}\n\nexport const TextField = forwardRef<HTMLInputElement, TextFieldProps>(\n  function TextField(props, ref) {\n    const { formFieldProps, inputProps } = splitOutFormFieldProps(props);\n    const { id, ...rest } = inputProps;\n\n    return (\n      <FormField\n        {...formFieldProps}\n        labelProps={{ size: props.size, ...formFieldProps.labelProps }}\n        inputId={formFieldProps.inputId ?? id}\n      >\n        <Input {...rest} ref={ref} />\n      </FormField>\n    );\n  },\n);\n\nexport interface TextAreaFieldProps extends ImplementsFormField, TextAreaProps {}\n\nexport const TextAreaField = forwardRef<HTMLTextAreaElement, TextAreaFieldProps>(\n  function TextAreaField(\n    { label, helperText, errorText, warningText, inputId, id, configField, ...props },\n    ref,\n  ) {\n    return (\n      <FormField\n        inputId={inputId ?? id}\n        label={label}\n        labelProps={{ size: props.size }}\n        helperText={helperText}\n        warningText={warningText}\n        errorText={errorText}\n        configField={configField}\n      >\n        <TextArea {...props} ref={ref} />\n      </FormField>\n    );\n  },\n);\n\nexport interface SelectFieldProps extends ImplementsFormField, SelectProps {}\n\nexport const SelectField = ({\n  id,\n  label,\n  helperText,\n  errorText,\n  warningText,\n  children,\n  configField,\n  labelProps,\n  ...props\n}: SelectFieldProps) => {\n  const linkedId = useMemo(() => id ?? uniqueId('pds-form-field-input-fields-select__'), [id]);\n\n  return (\n    <FormField\n      label={label}\n      labelProps={{ htmlFor: linkedId, size: props.size, ...labelProps }}\n      helperText={helperText}\n      warningText={warningText}\n      errorText={errorText}\n      configField={configField}\n    >\n      <Select {...props} id={linkedId}>\n        {children}\n      </Select>\n    </FormField>\n  );\n};\n\nexport interface RadioGroupFieldProps\n  extends Omit<ImplementsFormField, 'configField'>, RadioGroupProps {}\n\nexport const RadioGroupField = ({\n  label,\n  helperText,\n  errorText,\n  warningText,\n  children,\n  ...props\n}: RadioGroupFieldProps) => {\n  return (\n    <FormField\n      label={label}\n      helperText={helperText}\n      warningText={warningText}\n      errorText={errorText}\n    >\n      <RadioGroup {...props}>{children}</RadioGroup>\n    </FormField>\n  );\n};\n\nexport interface CheckboxFieldProps extends ImplementsFormField, CheckboxProps {\n  checkboxLabel?: CheckboxProps['label'];\n}\n\nexport const CheckboxField = ({\n  label,\n  helperText,\n  errorText,\n  warningText,\n  checkboxLabel,\n  configField,\n  labelProps,\n  ...props\n}: CheckboxFieldProps) => {\n  return (\n    <FormField\n      label={label}\n      helperText={helperText}\n      warningText={warningText}\n      errorText={errorText}\n      configField={configField}\n      labelProps={labelProps}\n    >\n      <Checkbox label={checkboxLabel} {...props} />\n    </FormField>\n  );\n};\n\nexport interface ToggleFieldProps extends ImplementsFormField, ToggleProps {}\n\nexport const ToggleField = forwardRef<HTMLDivElement, ToggleFieldProps>(function ToggleField(\n  { label, helperText, errorText, warningText, configField, ...props },\n  ref,\n) {\n  return (\n    <FormField\n      label={label}\n      labelProps={{ size: props.size }}\n      helperText={helperText}\n      warningText={warningText}\n      errorText={errorText}\n      configField={configField}\n    >\n      <Toggle {...props} ref={ref} />\n    </FormField>\n  );\n});\n\nexport interface SegmentedControlFieldProps\n  extends ImplementsFormField, Omit<SegmentedControlProps, 'children'> {\n  children?: SegmentedControlProps['children'];\n}\n\nexport const SegmentedControlField = forwardRef<HTMLDivElement, SegmentedControlFieldProps>(\n  function SegmentedControlField(\n    { label, helperText, errorText, warningText, configField, children, labelProps, ...props },\n    ref,\n  ) {\n    return (\n      <FormField\n        label={label}\n        helperText={helperText}\n        warningText={warningText}\n        errorText={errorText}\n        configField={configField}\n        labelProps={labelProps}\n      >\n        <SegmentedControl fullWidth {...props} ref={ref}>\n          {children}\n        </SegmentedControl>\n      </FormField>\n    );\n  },\n);\n\nexport type ComboboxSingleSelectFieldProps<T = string> = ImplementsFormField &\n  ComboboxSingleSelectProps<T>;\nexport type ComboboxMultiSelectFieldProps<T = string> = ImplementsFormField &\n  ComboboxMultiSelectProps<T>;\n\nexport const ComboboxField = ({\n  label,\n  labelProps,\n  helperText,\n  errorText,\n  warningText,\n  configField,\n  ...props\n}: ComboboxSingleSelectFieldProps | ComboboxMultiSelectFieldProps) => {\n  return (\n    <FormField\n      label={label}\n      labelProps={labelProps}\n      helperText={helperText}\n      warningText={warningText}\n      errorText={errorText}\n      configField={configField}\n    >\n      <Combobox {...props} />\n    </FormField>\n  );\n};\n","import {\n  Children,\n  cloneElement,\n  type ComponentPropsWithRef,\n  createContext,\n  type ReactElement,\n  type ReactNode,\n  useContext,\n  useRef,\n} from 'react';\nimport {\n  type AriaCheckboxGroupProps,\n  mergeProps,\n  useCheckboxGroup,\n  useCheckboxGroupItem,\n} from 'react-aria';\nimport innerText from 'react-innertext';\nimport { type CheckboxGroupState, useCheckboxGroupState } from 'react-stately';\n\nimport type { CheckboxProps } from 'design-system/components/Checkbox';\nimport type Checkbox from 'design-system/components/Checkbox';\nimport { FormControlContext } from 'design-system/components/FormControl/useFormField';\nimport FormField from 'design-system/components/FormField/FormField';\nimport type { ImplementsFormField } from 'design-system/components/FormField/inputFields';\n\n/* @ts-expect-error [strict-migration] The following line is not strict; please fix! */\nconst CheckboxGroupContext = createContext<CheckboxGroupState>(null);\n\n/** Preserves the parent FormControl context (disabled, hasError, etc.) but clears\n *  inputId so each Checkbox inside the group generates its own unique id. */\nconst ClearGroupInputId = ({ children }: { children: ReactNode }) => {\n  const parentContext = useContext(FormControlContext);\n  return (\n    <FormControlContext.Provider value={{ ...parentContext, inputId: undefined }}>\n      {children}\n    </FormControlContext.Provider>\n  );\n};\n\ninterface CheckboxGroupItemProps {\n  children: ReactElement<ComponentPropsWithRef<typeof Checkbox>>;\n}\n\nconst CheckboxGroupItem = (props: CheckboxGroupItemProps) => {\n  const { children } = props;\n  const checkboxProps = children.props;\n\n  const state = useContext(CheckboxGroupContext);\n  const ref = useRef();\n  const { inputProps } = useCheckboxGroupItem(\n    /* @ts-expect-error [strict-migration] The following line is not strict; please fix! */\n    {\n      ...checkboxProps,\n      onChange: undefined,\n      isDisabled: checkboxProps.disabled,\n      isReadOnly: checkboxProps.readOnly,\n      isRequired: checkboxProps.required,\n      isIndeterminate: checkboxProps.indeterminate,\n      value: String(children.props.value),\n      'aria-label': innerText(checkboxProps.label),\n    },\n    state,\n    ref,\n  );\n\n  return cloneElement(\n    children,\n    /* @ts-expect-error [strict-migration] The following line is not strict; please fix! */\n    mergeProps(inputProps, {\n      onChange: checkboxProps.onChange,\n      disabled: state.isDisabled || checkboxProps.disabled,\n      checked: state.isSelected(String(inputProps.value)),\n      ref,\n    } as ComponentPropsWithRef<typeof Checkbox>),\n  );\n};\n\ninterface CheckboxGroupFieldProps\n  extends\n    Omit<ImplementsFormField, 'configField'>,\n    Omit<\n      AriaCheckboxGroupProps,\n      'description' | 'disabled' | 'isReadOnly' | 'isRequired' | 'errorMessage'\n    > {\n  children?: ReactElement<CheckboxProps>[];\n  disabled?: boolean;\n  readOnly?: boolean;\n  required?: boolean;\n}\n\nconst CheckboxGroupField = ({\n  children,\n  name,\n  onChange,\n  disabled,\n  readOnly,\n  required,\n  ...props\n}: CheckboxGroupFieldProps) => {\n  const reactAriaProps = {\n    ...props,\n    description: props.helperText,\n    errorMessage: props.errorText,\n    onChange,\n    name,\n    isDisabled: disabled,\n    isReadOnly: readOnly,\n    isRequired: required,\n  };\n  const state = useCheckboxGroupState(reactAriaProps);\n  const { groupProps, labelProps, descriptionProps, errorMessageProps } = useCheckboxGroup(\n    reactAriaProps,\n    state,\n  );\n\n  return (\n    <FormField\n      labelProps={labelProps}\n      helperProps={descriptionProps}\n      errorProps={errorMessageProps}\n      disabled={disabled}\n      {...groupProps}\n      {...props}\n    >\n      <ClearGroupInputId>\n        <CheckboxGroupContext.Provider value={state}>\n          {Children.map(children, (checkbox) => (\n            /* @ts-expect-error [strict-migration] The following line is not strict; please fix! */\n            <CheckboxGroupItem>{checkbox}</CheckboxGroupItem>\n          ))}\n        </CheckboxGroupContext.Provider>\n      </ClearGroupInputId>\n    </FormField>\n  );\n};\n\nexport default CheckboxGroupField;\n","import { type ReactNode, useState } from 'react';\n\nimport { MoreIcon, PlusIcon } from '@persona/icons';\nimport { IconButton } from 'design-system/components/Button';\nimport useFormGroup from 'design-system/components/ConfigFormGroup/useFormGroup';\nimport DropdownMenu from 'design-system/components/DropdownMenu';\nimport FormField from 'design-system/components/FormField/FormField';\nimport type { ImplementsFormField } from 'design-system/components/FormField/inputFields';\nimport ListBox, { type ListBoxProps } from 'design-system/components/ListBox';\nimport type { MenuItemProps } from 'design-system/components/Menu';\n\ninterface ListBoxFieldAction extends Omit<MenuItemProps, 'children'> {\n  label: string;\n  onClick: (selectedKeys: ListBoxProps<any>['selectedKeys']) => void;\n}\n\ninterface AddDropdownConfig {\n  options: ({ label: ReactNode; value: string } & Omit<MenuItemProps, 'children'>)[];\n  onSelection: (value: string) => void;\n}\n\ninterface ListBoxFieldProps<T extends object> extends ImplementsFormField, ListBoxProps<T> {\n  actions?: ListBoxFieldAction[];\n  addDropdownConfig?: AddDropdownConfig;\n}\n\nconst ListBoxField = <T extends object>({\n  label,\n  helperText,\n  errorText,\n  warningText,\n  labelProps,\n  helperProps,\n  errorProps,\n  warningProps,\n  inputId,\n  onAdd,\n  onDelete,\n  deleteDisabled,\n  configField: configFieldProp,\n  size = 'md',\n  actions = [],\n  addDropdownConfig,\n  selectedKeys: selectedKeysProp,\n  onSelectionChange,\n  defaultSelectedKeys,\n  ...props\n}: ListBoxFieldProps<T>) => {\n  const { configField } = useFormGroup({ configField: configFieldProp });\n  const menuActions: ListBoxFieldAction[] = [...actions];\n  const [selectedKeysState, setSelectedKeys] = useState(defaultSelectedKeys);\n  const selectedKeys = selectedKeysProp ?? selectedKeysState;\n  const effectiveSize = configField ? 'sm' : size;\n\n  if (onDelete) {\n    menuActions.unshift({\n      label: 'Delete',\n      onClick: () => onDelete(selectedKeys),\n      disabled:\n        deleteDisabled ||\n        selectedKeys == null ||\n        (typeof selectedKeys === 'object' && [...selectedKeys].length === 0),\n    });\n  }\n\n  const addButton = (\n    <IconButton size='sm' onClick={onAdd} aria-label='Add item to list'>\n      <PlusIcon />\n    </IconButton>\n  );\n\n  return (\n    <FormField\n      label={label}\n      helperText={helperText}\n      errorText={errorText}\n      warningText={warningText}\n      labelProps={labelProps}\n      helperProps={helperProps}\n      errorProps={errorProps}\n      warningProps={warningProps}\n      inputId={inputId}\n      configField={configField}\n      rightActions={\n        configField && (\n          <>\n            {menuActions.length > 0 && (\n              <DropdownMenu\n                trigger={\n                  <IconButton aria-label='Actions' size='sm'>\n                    <MoreIcon />\n                  </IconButton>\n                }\n                portal\n              >\n                {menuActions.map((action) => (\n                  <DropdownMenu.Item\n                    key={action.label}\n                    {...action}\n                    onClick={() => action.onClick(selectedKeys)}\n                    size={effectiveSize}\n                  >\n                    {action.label}\n                  </DropdownMenu.Item>\n                ))}\n              </DropdownMenu>\n            )}\n            {onAdd && !addDropdownConfig && addButton}\n            {addDropdownConfig && (\n              <DropdownMenu trigger={addButton} align='start' portal>\n                {addDropdownConfig.options.map((option) => (\n                  <DropdownMenu.Item\n                    key={option.value}\n                    {...option}\n                    onClick={() => addDropdownConfig.onSelection(option.value)}\n                    size={effectiveSize}\n                  >\n                    {option.label}\n                  </DropdownMenu.Item>\n                ))}\n              </DropdownMenu>\n            )}\n          </>\n        )\n      }\n    >\n      <ListBox\n        id={inputId}\n        fullWidth={configField}\n        size={effectiveSize}\n        deleteDisabled={deleteDisabled}\n        // We have to control the keys so we can power the `rightActions`\n        selectedKeys={selectedKeys}\n        onSelectionChange={(keys) => {\n          onSelectionChange?.(keys);\n          setSelectedKeys(keys);\n        }}\n        {...props}\n      />\n    </FormField>\n  );\n};\n\nexport default ListBoxField;\n","import { Fragment, type MouseEvent, type ReactNode, useState } from 'react';\n\nimport { IconButton } from '@persona/design-system/components/Button';\nimport { useFormGroup } from '@persona/design-system/components/ConfigFormGroup';\nimport DropdownMenu from '@persona/design-system/components/DropdownMenu';\nimport type { FormLabelProps } from '@persona/design-system/components/FormControl';\nimport type { MenuItemProps } from '@persona/design-system/components/Menu';\nimport TableBox, { type TableBoxProps } from '@persona/design-system/components/TableBox';\nimport { MoreIcon, PlusIcon } from '@persona/icons';\n\nimport FormField from './FormField';\nimport type { ImplementsFormField } from './inputFields';\n\nexport interface TableBoxFieldAction extends Omit<MenuItemProps, 'children'> {\n  label: string;\n  onClick: (selectedKey: TableBoxProps['selectedKey']) => void;\n}\n\nexport interface TableBoxFieldActionGroup {\n  type: 'group';\n  heading: string;\n  actions: TableBoxFieldAction[];\n}\n\nexport type TableBoxFieldActionEntry = TableBoxFieldAction | TableBoxFieldActionGroup;\n\nconst isActionGroup = (action: TableBoxFieldActionEntry): action is TableBoxFieldActionGroup =>\n  'type' in action && action.type === 'group';\n\ninterface AddDropdownConfig {\n  options: Array<{ label: string; value: string }>;\n  onSelection: (value: string) => void;\n}\n\ninterface TableBoxFieldProps<T extends object = object>\n  extends ImplementsFormField, Omit<TableBoxProps<T>, 'aria-label' | 'onCreateNewRow'> {\n  onAdd?: (e: MouseEvent<HTMLButtonElement>) => void;\n  onDelete?: (selectedKey: string | null) => void;\n  deleteDisabled?: boolean;\n  /** Actions and labeled action groups rendered in order. Empty groups are omitted. */\n  actions?: TableBoxFieldActionEntry[];\n  addDropdownConfig?: AddDropdownConfig;\n\n  /**\n   * Callback to create a new row and add it to the rows array\n   * Should return the id of the newly created row\n   */\n  createNewRow?: () => string;\n  children?: ReactNode;\n}\n\nconst TableBoxField = <T extends object = object>({\n  label,\n  helperText,\n  errorText,\n  warningText,\n  labelProps: labelPropsProp,\n  helperProps,\n  errorProps,\n  warningProps,\n  inputId,\n  onAdd,\n  onDelete,\n  deleteDisabled,\n  configField: configFieldProp = true,\n  actions = [],\n  addDropdownConfig,\n  selectedKey: selectedKeyProp,\n  onSelectionChange,\n  defaultSelectedKey,\n  selectionMode,\n  disabled,\n  createNewRow,\n  children,\n  emptyText = 'No data',\n  ...props\n}: TableBoxFieldProps<T>) => {\n  const { configField } = useFormGroup({ configField: configFieldProp });\n  const menuActions: TableBoxFieldActionEntry[] = [...actions];\n  const [selectedKeyState, setSelectedKey] = useState(defaultSelectedKey);\n  const selectedKey = selectedKeyProp ?? selectedKeyState;\n  const [newRowId, setNewRowId] = useState<string | null>(null);\n  const labelProps: FormLabelProps = { size: 'sm', ...labelPropsProp };\n\n  const handleCreateNewRow = () => {\n    if (createNewRow) {\n      setNewRowId(createNewRow());\n    }\n  };\n\n  // Handle add button click\n  const handleAddClick = (e: MouseEvent<HTMLButtonElement>) => {\n    if (createNewRow) {\n      handleCreateNewRow();\n    } else if (onAdd) {\n      onAdd(e);\n    }\n  };\n\n  if (onDelete) {\n    menuActions.unshift({\n      label: 'Delete',\n      onClick: () => selectedKey && onDelete(selectedKey),\n      disabled: deleteDisabled || selectedKey == null,\n    });\n  }\n  const visibleMenuActions = menuActions.filter(\n    (action) => !isActionGroup(action) || action.actions.length > 0,\n  );\n\n  const addButton = (\n    <IconButton\n      size='sm'\n      onClick={handleAddClick}\n      aria-label='Add item to table'\n      disabled={disabled}\n    >\n      <PlusIcon />\n    </IconButton>\n  );\n\n  return (\n    <FormField\n      label={label}\n      helperText={helperText}\n      errorText={errorText}\n      warningText={warningText}\n      labelProps={labelProps}\n      helperProps={helperProps}\n      errorProps={errorProps}\n      warningProps={warningProps}\n      inputId={inputId}\n      rightActions={\n        configField && (\n          <>\n            {visibleMenuActions.length > 0 && (\n              <DropdownMenu\n                trigger={\n                  <IconButton aria-label='Actions' size='sm' disabled={disabled}>\n                    <MoreIcon />\n                  </IconButton>\n                }\n                portal\n              >\n                {visibleMenuActions.map((entry, entryIndex) => {\n                  const previousEntry = visibleMenuActions[entryIndex - 1];\n                  if (isActionGroup(entry)) {\n                    return (\n                      <Fragment key={`${entry.heading}-${entryIndex}`}>\n                        {entryIndex > 0 && <DropdownMenu.Divider />}\n                        <DropdownMenu.Heading size='sm'>{entry.heading}</DropdownMenu.Heading>\n                        {entry.actions.map((action) => (\n                          <DropdownMenu.Item\n                            key={action.label}\n                            {...action}\n                            disabled={disabled || action.disabled}\n                            onClick={() => action.onClick(selectedKey)}\n                            size='sm'\n                          >\n                            {action.label}\n                          </DropdownMenu.Item>\n                        ))}\n                      </Fragment>\n                    );\n                  }\n\n                  return (\n                    <Fragment key={`${entry.label}-${entryIndex}`}>\n                      {previousEntry && isActionGroup(previousEntry) && <DropdownMenu.Divider />}\n                      <DropdownMenu.Item\n                        {...entry}\n                        disabled={disabled || entry.disabled}\n                        onClick={() => entry.onClick(selectedKey)}\n                        size='sm'\n                      >\n                        {entry.label}\n                      </DropdownMenu.Item>\n                    </Fragment>\n                  );\n                })}\n              </DropdownMenu>\n            )}\n            {(onAdd || createNewRow) && !addDropdownConfig && addButton}\n            {addDropdownConfig && (\n              <DropdownMenu trigger={addButton} portal>\n                {addDropdownConfig.options.map((option) => (\n                  <DropdownMenu.Item\n                    key={option.value}\n                    {...option}\n                    onClick={() => addDropdownConfig.onSelection(option.value)}\n                    size='sm'\n                  >\n                    {option.label}\n                  </DropdownMenu.Item>\n                ))}\n              </DropdownMenu>\n            )}\n          </>\n        )\n      }\n    >\n      <TableBox\n        aria-label={`${label} table`}\n        // We have to control the keys so we can power the `rightActions`\n        selectedKey={selectedKey}\n        onSelectionChange={(key) => {\n          onSelectionChange?.(key);\n          setSelectedKey(key);\n        }}\n        selectionMode={selectionMode}\n        newRowId={newRowId}\n        onCreateNewRow={createNewRow ? handleCreateNewRow : undefined}\n        emptyText={emptyText}\n        disabled={disabled}\n        {...props}\n      >\n        {children}\n      </TableBox>\n    </FormField>\n  );\n};\n\n// Attach subcomponents to TableBoxField\nTableBoxField.Row = TableBox.Row;\nTableBoxField.Cell = TableBox.Cell;\n\nexport default TableBoxField;\n"],"mappings":"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"}

package/dist/components/PageHeader/index.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.cjs","names":["Spacing","Heading","Paragraph"],"sources":["../../../components/PageHeader/PageHeader.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport styled from 'styled-components';\n\nimport { Spacing } from '@persona/design-tokens';\nimport { Heading, Paragraph } from 'design-system/components/Text';\n\nexport const PageHeaderContainer = styled.header`\n  display: flex;\n  width: 100%;\n  justify-content: space-between;\n  align-items: center;\n  padding: ${Spacing[3]} ${Spacing[5]};\n  background-color: ${({ theme }) => theme.color.background.primary};\n  border-bottom: 1px solid ${({ theme }) => theme.color.border.primary};\n  box-sizing: border-box;\n  min-height: 56px; /* Standardize height for most PageHeaders */\n`;\n\nconst TitleContainer = styled.div`\n  display: flex;\n  flex: 1;\n  align-items: center;\n  h1 {\n    margin: 0;\n  }\n  p {\n    margin: 0 0 0 ${Spacing[2]};\n  }\n`;\n\nconst LeftContainer = styled.div`\n  display: flex;\n  align-items: center;\n`;\n\nconst RightContainer = styled.div`\n  display: flex;\n  gap: ${Spacing[2]};\n  margin-left: ${Spacing[3]};\n`;\n\nexport interface PageHeaderProps {\n  title: ReactNode;\n  level?: 'product' | 'detail';\n  subtitle?: ReactNode;\n  prepend?: ReactNode;\n  append?: ReactNode;\n  children?: ReactNode;\n}\n\nconst PageHeader = ({\n  title,\n  subtitle,\n  level = 'product',\n  prepend,\n  append,\n  children,\n  ...props\n}: PageHeaderProps) => (\n  <PageHeaderContainer {...props}>\n    <LeftContainer>\n      {prepend && <div>{prepend}</div>}\n      <TitleContainer>\n        {level === 'product' && (\n          <Heading as='h1' size='sm'>\n            {title}\n          </Heading>\n        )}\n        {level === 'detail' && (\n          <Paragraph as='h1' size='lg' color='primary'>\n            {title}\n          </Paragraph>\n        )}\n        {subtitle && <Paragraph size='md'>{subtitle}</Paragraph>}\n      </TitleContainer>\n      {append && <div>{append}</div>}\n    </LeftContainer>\n    {children && <RightContainer>{children}</RightContainer>}\n  </PageHeaderContainer>\n);\n\nexport default PageHeader;\n"],"mappings":";;;;;;;;;;;AAMA,MAAa,sBAAsB,kBAAA,QAAO,MAAM;;;;;aAKnCA,uBAAAA,QAAQ,GAAG,GAAGA,uBAAAA,QAAQ,GAAG;uBACf,EAAE,YAAY,MAAM,MAAM,WAAW,QAAQ;8BACtC,EAAE,YAAY,MAAM,MAAM,OAAO,QAAQ;;;;AAKvE,MAAM,iBAAiB,kBAAA,QAAO,GAAG;;;;;;;;oBAQbA,uBAAAA,QAAQ,GAAG;;;AAI/B,MAAM,gBAAgB,kBAAA,QAAO,GAAG;;;;AAKhC,MAAM,iBAAiB,kBAAA,QAAO,GAAG;;SAExBA,uBAAAA,QAAQ,GAAG;iBACHA,uBAAAA,QAAQ,GAAG;;AAY5B,MAAM,cAAc,EAClB,OACA,UACA,QAAQ,WACR,SACA,QACA,UACA,GAAG,YAEH,iBAAA,GAAA,kBAAA,MAAC,qBAAD;CAAqB,GAAI;WAAzB,CACE,iBAAA,GAAA,kBAAA,MAAC,eAAD,EAAA,UAAA;EACG,WAAW,iBAAA,GAAA,kBAAA,KAAC,OAAD,EAAA,UAAM,SAAc,CAAA;EAChC,iBAAA,GAAA,kBAAA,MAAC,gBAAD,EAAA,UAAA;GACG,UAAU,aACT,iBAAA,GAAA,kBAAA,KAACC,aAAAA,SAAD;IAAS,IAAG;IAAK,MAAK;cACnB;IACO,CAAA;GAEX,UAAU,YACT,iBAAA,GAAA,kBAAA,KAACC,aAAAA,WAAD;IAAW,IAAG;IAAK,MAAK;IAAK,OAAM;cAChC;IACS,CAAA;GAEb,YAAY,iBAAA,GAAA,kBAAA,KAACA,aAAAA,WAAD;IAAW,MAAK;cAAM;IAAqB,CAAA;GACzC,EAAA,CAAA;EAChB,UAAU,iBAAA,GAAA,kBAAA,KAAC,OAAD,EAAA,UAAM,QAAa,CAAA;EAChB,EAAA,CAAA,EACf,YAAY,iBAAA,GAAA,kBAAA,KAAC,gBAAD,EAAiB,UAA0B,CAAA,CACpC"}

package/dist/components/PageHeader/index.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.mjs","names":[],"sources":["../../../components/PageHeader/PageHeader.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport styled from 'styled-components';\n\nimport { Spacing } from '@persona/design-tokens';\nimport { Heading, Paragraph } from 'design-system/components/Text';\n\nexport const PageHeaderContainer = styled.header`\n  display: flex;\n  width: 100%;\n  justify-content: space-between;\n  align-items: center;\n  padding: ${Spacing[3]} ${Spacing[5]};\n  background-color: ${({ theme }) => theme.color.background.primary};\n  border-bottom: 1px solid ${({ theme }) => theme.color.border.primary};\n  box-sizing: border-box;\n  min-height: 56px; /* Standardize height for most PageHeaders */\n`;\n\nconst TitleContainer = styled.div`\n  display: flex;\n  flex: 1;\n  align-items: center;\n  h1 {\n    margin: 0;\n  }\n  p {\n    margin: 0 0 0 ${Spacing[2]};\n  }\n`;\n\nconst LeftContainer = styled.div`\n  display: flex;\n  align-items: center;\n`;\n\nconst RightContainer = styled.div`\n  display: flex;\n  gap: ${Spacing[2]};\n  margin-left: ${Spacing[3]};\n`;\n\nexport interface PageHeaderProps {\n  title: ReactNode;\n  level?: 'product' | 'detail';\n  subtitle?: ReactNode;\n  prepend?: ReactNode;\n  append?: ReactNode;\n  children?: ReactNode;\n}\n\nconst PageHeader = ({\n  title,\n  subtitle,\n  level = 'product',\n  prepend,\n  append,\n  children,\n  ...props\n}: PageHeaderProps) => (\n  <PageHeaderContainer {...props}>\n    <LeftContainer>\n      {prepend && <div>{prepend}</div>}\n      <TitleContainer>\n        {level === 'product' && (\n          <Heading as='h1' size='sm'>\n            {title}\n          </Heading>\n        )}\n        {level === 'detail' && (\n          <Paragraph as='h1' size='lg' color='primary'>\n            {title}\n          </Paragraph>\n        )}\n        {subtitle && <Paragraph size='md'>{subtitle}</Paragraph>}\n      </TitleContainer>\n      {append && <div>{append}</div>}\n    </LeftContainer>\n    {children && <RightContainer>{children}</RightContainer>}\n  </PageHeaderContainer>\n);\n\nexport default PageHeader;\n"],"mappings":";;;;;AAMA,MAAa,sBAAsB,OAAO,MAAM;;;;;aAKnC,QAAQ,GAAG,GAAG,QAAQ,GAAG;uBACf,EAAE,YAAY,MAAM,MAAM,WAAW,QAAQ;8BACtC,EAAE,YAAY,MAAM,MAAM,OAAO,QAAQ;;;;AAKvE,MAAM,iBAAiB,OAAO,GAAG;;;;;;;;oBAQb,QAAQ,GAAG;;;AAI/B,MAAM,gBAAgB,OAAO,GAAG;;;;AAKhC,MAAM,iBAAiB,OAAO,GAAG;;SAExB,QAAQ,GAAG;iBACH,QAAQ,GAAG;;AAY5B,MAAM,cAAc,EAClB,OACA,UACA,QAAQ,WACR,SACA,QACA,UACA,GAAG,YAEH,qBAAC,qBAAD;CAAqB,GAAI;WAAzB,CACE,qBAAC,eAAD,EAAA,UAAA;EACG,WAAW,oBAAC,OAAD,EAAA,UAAM,SAAc,CAAA;EAChC,qBAAC,gBAAD,EAAA,UAAA;GACG,UAAU,aACT,oBAAC,SAAD;IAAS,IAAG;IAAK,MAAK;cACnB;IACO,CAAA;GAEX,UAAU,YACT,oBAAC,WAAD;IAAW,IAAG;IAAK,MAAK;IAAK,OAAM;cAChC;IACS,CAAA;GAEb,YAAY,oBAAC,WAAD;IAAW,MAAK;cAAM;IAAqB,CAAA;GACzC,EAAA,CAAA;EAChB,UAAU,oBAAC,OAAD,EAAA,UAAM,QAAa,CAAA;EAChB,EAAA,CAAA,EACf,YAAY,oBAAC,gBAAD,EAAiB,UAA0B,CAAA,CACpC"}