@epilot/zenith-react 0.1.0 → 0.2.0-next.0

package/dist/components/date-range-picker/date-range-picker.js.map

@@ -1 +1 @@
-{"version":3,"file":"date-range-picker.js","sources":["../../../src/components/date-range-picker/date-range-picker.tsx"],"sourcesContent":["import * as React from \"react\"\nimport { mergeClasses, shorthands } from \"@epilot/zenith-runtime/v1\"\n\nimport {\n  Field,\n  FieldLabel,\n  FieldError,\n  FieldInputGroup,\n  FieldGroupAddon,\n} from \"../field/field\"\nimport { Button } from \"../button/button\"\nimport { Pill } from \"../pill/pill\"\nimport { Popover, PopoverTrigger, PopoverContent } from \"../popover/popover\"\nimport { SLOT_ATTR } from \"../../renderer/contract\"\nimport { makeZenithStyles } from \"../../styles/make-styles\"\nimport * as tokens from \"../../tokens\"\n\nimport { RangeCalendar } from \"./range-calendar\"\nimport type { RangeCalendarProps } from \"./range-calendar\"\nimport type { DateRange, DateTimePickerLocale } from \"./date-range-picker-utils\"\nimport {\n  formatDateTimeDisplay,\n  parseDateTimeInput,\n} from \"./date-range-picker-utils\"\n\nconst CalendarIcon = (props: React.SVGProps<SVGSVGElement>) => (\n  <svg\n    xmlns=\"http://www.w3.org/2000/svg\"\n    height=\"18px\"\n    viewBox=\"0 -960 960 960\"\n    width=\"18px\"\n    fill=\"currentColor\"\n    {...props}\n  >\n    <path d=\"M200-80q-33 0-56.5-23.5T120-160v-560q0-33 23.5-56.5T200-800h40v-80h80v80h320v-80h80v80h40q33 0 56.5 23.5T840-720v560q0 33-23.5 56.5T760-80H200Zm0-80h560v-400H200v400Zm0-480h560v-80H200v80Zm0 0v-80 80Zm280 240q-17 0-28.5-11.5T440-440q0-17 11.5-28.5T480-480q17 0 28.5 11.5T520-440q0 17-11.5 28.5T480-400Zm-160 0q-17 0-28.5-11.5T280-440q0-17 11.5-28.5T320-480q17 0 28.5 11.5T360-440q0 17-11.5 28.5T320-400Zm320 0q-17 0-28.5-11.5T600-440q0-17 11.5-28.5T640-480q17 0 28.5 11.5T680-440q0 17-11.5 28.5T640-400ZM480-240q-17 0-28.5-11.5T440-280q0-17 11.5-28.5T480-320q17 0 28.5 11.5T520-280q0 17-11.5 28.5T480-240Zm-160 0q-17 0-28.5-11.5T280-280q0-17 11.5-28.5T320-320q17 0 28.5 11.5T360-280q0 17-11.5 28.5T320-240Zm320 0q-17 0-28.5-11.5T600-280q0-17 11.5-28.5T640-320q17 0 28.5 11.5T680-280q0 17-11.5 28.5T640-240Z\" />\n  </svg>\n)\n\nconst DEFAULT_FORMAT = \"dd/MM/yyyy\"\n\nexport type DateRangePreset = {\n  label: string\n  getValue: () => DateRange\n}\n\nexport type DateRangePickerProps = {\n  value: DateRange\n  onChange: (range: DateRange) => void\n  onBlur?: () => void\n  disabled?: boolean\n  disablePast?: boolean\n  label?: string\n  error?: string\n  startPlaceholder?: string\n  endPlaceholder?: string\n  format?: string\n  locale?: DateTimePickerLocale\n  className?: string\n  keyboardIcon?: React.ReactNode\n  inputAriaLabel?: string\n  openPickerAriaLabel?: string\n  previousMonthLabel?: string\n  nextMonthLabel?: string\n  testId?: string\n  currentTimeInTimezone?: Date\n  showWeekNumbers?: boolean\n  presets?: DateRangePreset[]\n}\n\nconst useStyles = makeZenithStyles({\n  root: {\n    width: \"100%\",\n  },\n  inputGroup: {\n    width: \"100%\",\n  },\n  /**\n   * Reproduces a v1 defect on purpose, the same way Label's line-height is reproduced: v1's `icon-\n   * sm` size classes do not reach this button, so v1 renders it content-sized at 18x18 around an\n   * unconstrained 18px icon rather than the 28x28-with-14px-icon that `icon-sm` specifies.\n   */\n  addonButton: {\n    width: \"auto\",\n    height: \"auto\",\n    \"& svg\": { width: \"auto\", height: \"auto\" },\n  },\n  popoverTrigger: {\n    flexGrow: 1,\n    flexShrink: 1,\n    flexBasis: \"0%\",\n  },\n  triggerRoot: {\n    display: \"flex\",\n    alignItems: \"center\",\n    ...shorthands.gap(tokens.spacingElement2),\n    flexGrow: 1,\n    flexShrink: 1,\n    flexBasis: \"0%\",\n    height: \"1.5rem\",\n    cursor: \"pointer\",\n  },\n  input: {\n    width: \"5.5rem\",\n    outlineStyle: \"none\",\n    fontSize: tokens.textSm,\n    lineHeight: tokens.leadingSm,\n    color: tokens.grayA12,\n    backgroundColor: \"transparent\",\n    textAlign: \"center\",\n    ...shorthands.border(\"0\"),\n    ...shorthands.padding(\"0\"),\n    \"::placeholder\": {\n      color: tokens.grayA8,\n    },\n    \":disabled\": {\n      cursor: \"not-allowed\",\n    },\n  },\n  separator: {\n    fontSize: tokens.textSm,\n    lineHeight: tokens.leadingSm,\n    color: tokens.gray9,\n    flexShrink: 0,\n    userSelect: \"none\",\n    ...shorthands.padding(\"0\", \"0.125rem\"), // v1 px-0.5\n  },\n  popoverContent: {\n    ...shorthands.overflow(\"hidden\"),\n  },\n  content: {\n    display: \"flex\",\n    flexDirection: \"row\",\n    ...shorthands.gap(tokens.spacingGroup1),\n    ...shorthands.padding(\"0.75rem\"), // v1 p-3 (0.75rem)\n  },\n  presets: {\n    display: \"flex\",\n    flexDirection: \"column\",\n    ...shorthands.gap(tokens.spacingElement1),\n    width: \"8rem\", // v1 w-32\n    borderLeftWidth: \"1px\",\n    borderLeftStyle: \"solid\",\n    borderLeftColor: tokens.gray6,\n    paddingLeft: \"0.75rem\", // v1 pl-3 (0.75rem)\n  },\n  presetPill: {\n    alignSelf: \"flex-start\",\n  },\n})\n\nconst RangeInputTrigger = React.forwardRef<\n  HTMLDivElement,\n  {\n    startValue: string\n    endValue: string\n    startPlaceholder: string\n    endPlaceholder: string\n    disabled: boolean\n    onStartChange: (e: React.ChangeEvent<HTMLInputElement>) => void\n    onEndChange: (e: React.ChangeEvent<HTMLInputElement>) => void\n    onStartBlur: () => void\n    onEndBlur: () => void\n    testId?: string\n    inputAriaLabel?: string\n    \"data-slot\"?: string\n  } & React.HTMLAttributes<HTMLDivElement>\n>((props, ref) => {\n  const {\n    startValue,\n    endValue,\n    startPlaceholder,\n    endPlaceholder,\n    disabled,\n    onStartChange,\n    onEndChange,\n    onStartBlur,\n    onEndBlur,\n    testId,\n    inputAriaLabel,\n    className,\n    \"data-slot\": _dataSlot,\n    ...divProps\n  } = props\n  const styles = useStyles()\n\n  return (\n    <div\n      ref={ref}\n      {...divProps}\n      className={mergeClasses(styles.triggerRoot, className)}\n      data-slot=\"date-range-input\"\n      {...{ [SLOT_ATTR]: \"date-range-input\" }}\n    >\n      <input\n        aria-label={inputAriaLabel || \"Start date\"}\n        className={styles.input}\n        data-slot=\"date-range-start-input\"\n        {...{ [SLOT_ATTR]: \"date-range-start-input\" }}\n        data-testid={testId ? `${testId}-start` : undefined}\n        disabled={disabled}\n        onBlur={onStartBlur}\n        onChange={onStartChange}\n        placeholder={startPlaceholder}\n        value={startValue}\n      />\n      <span\n        className={styles.separator}\n        data-slot=\"date-range-separator\"\n        {...{ [SLOT_ATTR]: \"date-range-separator\" }}\n      >\n        {\"\\u2013\"}\n      </span>\n      <input\n        aria-label=\"End date\"\n        className={styles.input}\n        data-slot=\"date-range-end-input\"\n        {...{ [SLOT_ATTR]: \"date-range-end-input\" }}\n        data-testid={testId ? `${testId}-end` : undefined}\n        disabled={disabled}\n        onBlur={onEndBlur}\n        onChange={onEndChange}\n        placeholder={endPlaceholder}\n        value={endValue}\n      />\n    </div>\n  )\n})\n\nexport const DateRangePicker = React.forwardRef<\n  HTMLDivElement,\n  DateRangePickerProps\n>(function DateRangePicker(\n  {\n    value,\n    onChange,\n    onBlur,\n    disabled = false,\n    disablePast = false,\n    label,\n    error,\n    startPlaceholder = \"dd/MM/yyyy\",\n    endPlaceholder = \"dd/MM/yyyy\",\n    format = DEFAULT_FORMAT,\n    locale = \"de\",\n    className,\n    keyboardIcon,\n    inputAriaLabel,\n    openPickerAriaLabel = \"Open date picker\",\n    previousMonthLabel = \"Previous month\",\n    nextMonthLabel = \"Next month\",\n    testId,\n    currentTimeInTimezone,\n    showWeekNumbers = false,\n    presets,\n  },\n  ref\n) {\n  const styles = useStyles()\n  const [isOpen, setIsOpen] = React.useState(false)\n  const [startInputValue, setStartInputValue] = React.useState(() =>\n    value.start ? formatDateTimeDisplay(value.start, format, locale) : \"\"\n  )\n  const [endInputValue, setEndInputValue] = React.useState(() =>\n    value.end ? formatDateTimeDisplay(value.end, format, locale) : \"\"\n  )\n  const [tempRange, setTempRange] = React.useState<DateRange>(value)\n  const originalValueRef = React.useRef<DateRange>(value)\n  const closeTimerRef = React.useRef<ReturnType<typeof setTimeout> | undefined>(\n    undefined\n  )\n  React.useEffect(\n    () => () => {\n      if (closeTimerRef.current !== undefined)\n        clearTimeout(closeTimerRef.current)\n    },\n    []\n  )\n\n  React.useEffect(() => {\n    setStartInputValue(\n      value.start ? formatDateTimeDisplay(value.start, format, locale) : \"\"\n    )\n    setEndInputValue(\n      value.end ? formatDateTimeDisplay(value.end, format, locale) : \"\"\n    )\n    setTempRange(value)\n  }, [value, format, locale])\n\n  React.useEffect(() => {\n    if (isOpen) {\n      originalValueRef.current = value\n      setTempRange(value)\n    }\n  }, [isOpen, value])\n\n  const handleStartInputChange = React.useCallback(\n    (e: React.ChangeEvent<HTMLInputElement>) => {\n      const newValue = e.target.value\n\n      setStartInputValue(newValue)\n\n      const parsed = parseDateTimeInput(newValue, format, locale)\n\n      if (parsed) {\n        const newRange = { ...value, start: parsed }\n\n        onChange(newRange)\n      }\n    },\n    [onChange, value, format, locale]\n  )\n\n  const handleEndInputChange = React.useCallback(\n    (e: React.ChangeEvent<HTMLInputElement>) => {\n      const newValue = e.target.value\n\n      setEndInputValue(newValue)\n\n      const parsed = parseDateTimeInput(newValue, format, locale)\n\n      if (parsed) {\n        const newRange = { ...value, end: parsed }\n\n        onChange(newRange)\n      }\n    },\n    [onChange, value, format, locale]\n  )\n\n  const handleStartInputBlur = React.useCallback(() => {\n    const parsed = parseDateTimeInput(startInputValue, format, locale)\n\n    if (!parsed) {\n      setStartInputValue(\n        value.start ? formatDateTimeDisplay(value.start, format, locale) : \"\"\n      )\n    }\n    onBlur?.()\n  }, [startInputValue, value.start, format, locale, onBlur])\n\n  const handleEndInputBlur = React.useCallback(() => {\n    const parsed = parseDateTimeInput(endInputValue, format, locale)\n\n    if (!parsed) {\n      setEndInputValue(\n        value.end ? formatDateTimeDisplay(value.end, format, locale) : \"\"\n      )\n    }\n    onBlur?.()\n  }, [endInputValue, value.end, format, locale, onBlur])\n\n  const handleRangeChange = React.useCallback(\n    (range: DateRange) => {\n      setTempRange(range)\n      setStartInputValue(\n        range.start ? formatDateTimeDisplay(range.start, format, locale) : \"\"\n      )\n      setEndInputValue(\n        range.end ? formatDateTimeDisplay(range.end, format, locale) : \"\"\n      )\n    },\n    [format, locale]\n  )\n\n  const handleRangeComplete = React.useCallback(\n    (range: DateRange) => {\n      onChange(range)\n      setTempRange(range)\n      setStartInputValue(\n        range.start ? formatDateTimeDisplay(range.start, format, locale) : \"\"\n      )\n      setEndInputValue(\n        range.end ? formatDateTimeDisplay(range.end, format, locale) : \"\"\n      )\n      // Small delay to allow the user to see the selection before closing. Tracked and cleared on\n      // unmount: an uncleared timer fires into an unmounted tree, which React 18 reports as a\n      // state update on an unmounted component and which under jsdom teardown throws\n      // `ReferenceError: window is not defined` from the scheduler.\n      if (closeTimerRef.current !== undefined)\n        clearTimeout(closeTimerRef.current)\n      closeTimerRef.current = setTimeout(() => {\n        closeTimerRef.current = undefined\n        setIsOpen(false)\n      }, 150)\n    },\n    [onChange, format, locale]\n  )\n\n  const handlePopoverOpenChange = React.useCallback(\n    (open: boolean) => {\n      if (!open) {\n        // If closing without a complete selection, revert\n        if (!tempRange.start || !tempRange.end) {\n          setTempRange(originalValueRef.current)\n          setStartInputValue(\n            originalValueRef.current.start\n              ? formatDateTimeDisplay(\n                  originalValueRef.current.start,\n                  format,\n                  locale\n                )\n              : \"\"\n          )\n          setEndInputValue(\n            originalValueRef.current.end\n              ? formatDateTimeDisplay(\n                  originalValueRef.current.end,\n                  format,\n                  locale\n                )\n              : \"\"\n          )\n        }\n      }\n      setIsOpen(open)\n    },\n    [tempRange, format, locale]\n  )\n\n  const IconComponent = keyboardIcon || <CalendarIcon />\n  const fieldVariant = error ? \"destructive\" : \"highlight\"\n\n  return (\n    <Field\n      className={mergeClasses(styles.root, className)}\n      data-slot=\"daterangepicker\"\n      {...{ [SLOT_ATTR]: \"daterangepicker\" }}\n      ref={ref}\n      variant={fieldVariant}\n    >\n      {label && <FieldLabel>{label}</FieldLabel>}\n      <Popover modal onOpenChange={handlePopoverOpenChange} open={isOpen}>\n        <FieldInputGroup className={styles.inputGroup}>\n          <PopoverTrigger asChild className={styles.popoverTrigger}>\n            <RangeInputTrigger\n              disabled={disabled}\n              endPlaceholder={endPlaceholder}\n              endValue={endInputValue}\n              inputAriaLabel={inputAriaLabel}\n              onEndBlur={handleEndInputBlur}\n              onEndChange={handleEndInputChange}\n              onStartBlur={handleStartInputBlur}\n              onStartChange={handleStartInputChange}\n              startPlaceholder={startPlaceholder}\n              startValue={startInputValue}\n              testId={testId}\n            />\n          </PopoverTrigger>\n          <FieldGroupAddon align=\"end\">\n            <Button\n              aria-label={openPickerAriaLabel}\n              disabled={disabled}\n              onClick={() => setIsOpen(true)}\n              className={styles.addonButton}\n              size=\"icon-sm\"\n              variant=\"tertiary\"\n            >\n              {IconComponent}\n            </Button>\n          </FieldGroupAddon>\n        </FieldInputGroup>\n        <PopoverContent\n          align=\"start\"\n          className={styles.popoverContent}\n          flush\n          side=\"bottom\"\n          sideOffset={4}\n        >\n          <div\n            className={styles.content}\n            data-slot=\"daterangepicker-content\"\n            {...{ [SLOT_ATTR]: \"daterangepicker-content\" }}\n          >\n            <RangeCalendar\n              currentTimeInTimezone={currentTimeInTimezone}\n              disablePast={disablePast}\n              locale={locale}\n              nextMonthLabel={nextMonthLabel}\n              onChange={handleRangeChange}\n              onRangeComplete={handleRangeComplete}\n              previousMonthLabel={previousMonthLabel}\n              showWeekNumbers={showWeekNumbers}\n              value={tempRange}\n            />\n            {presets && presets.length > 0 && (\n              <aside\n                className={styles.presets}\n                data-slot=\"daterangepicker-presets\"\n                {...{ [SLOT_ATTR]: \"daterangepicker-presets\" }}\n              >\n                {presets.map((preset) => (\n                  <Pill\n                    className={styles.presetPill}\n                    data-slot=\"daterangepicker-preset\"\n                    {...{ [SLOT_ATTR]: \"daterangepicker-preset\" }}\n                    key={preset.label}\n                    onClick={() => {\n                      const range = preset.getValue()\n\n                      handleRangeComplete(range)\n                    }}\n                    variant=\"surface\"\n                  >\n                    {preset.label}\n                  </Pill>\n                ))}\n              </aside>\n            )}\n          </div>\n        </PopoverContent>\n      </Popover>\n      {error && <FieldError>{error}</FieldError>}\n    </Field>\n  )\n})\n\nexport { RangeCalendar }\nexport type { RangeCalendarProps, DateRange, DateTimePickerLocale }\n"],"names":["CalendarIcon","props","jsx","DEFAULT_FORMAT","useStyles","makeZenithStyles","shorthands","tokens.spacingElement2","tokens.textSm","tokens.leadingSm","tokens.grayA12","tokens.grayA8","tokens.gray9","tokens.spacingGroup1","tokens.spacingElement1","tokens.gray6","RangeInputTrigger","React","ref","startValue","endValue","startPlaceholder","endPlaceholder","disabled","onStartChange","onEndChange","onStartBlur","onEndBlur","testId","inputAriaLabel","className","_dataSlot","divProps","styles","jsxs","mergeClasses","SLOT_ATTR","DateRangePicker","value","onChange","onBlur","disablePast","label","error","format","locale","keyboardIcon","openPickerAriaLabel","previousMonthLabel","nextMonthLabel","currentTimeInTimezone","showWeekNumbers","presets","isOpen","setIsOpen","startInputValue","setStartInputValue","formatDateTimeDisplay","endInputValue","setEndInputValue","tempRange","setTempRange","originalValueRef","closeTimerRef","handleStartInputChange","e","newValue","parsed","parseDateTimeInput","newRange","handleEndInputChange","handleStartInputBlur","handleEndInputBlur","handleRangeChange","range","handleRangeComplete","handlePopoverOpenChange","open","IconComponent","fieldVariant","Field","FieldLabel","Popover","FieldInputGroup","PopoverTrigger","FieldGroupAddon","Button","PopoverContent","RangeCalendar","preset","createElement","Pill","FieldError"],"mappings":"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"}
+{"version":3,"file":"date-range-picker.js","sources":["../../../src/components/date-range-picker/date-range-picker.tsx"],"sourcesContent":["import * as React from \"react\"\nimport { mergeClasses, shorthands } from \"@epilot/zenith-runtime/v1\"\n\nimport {\n  Field,\n  FieldLabel,\n  FieldError,\n  FieldInputGroup,\n  FieldGroupAddon,\n} from \"../field/field\"\nimport { Button } from \"../button/button\"\nimport { Pill } from \"../pill/pill\"\nimport { Popover, PopoverTrigger, PopoverContent } from \"../popover/popover\"\nimport { SLOT_ATTR } from \"../../renderer/contract\"\nimport { makeZenithStyles } from \"../../styles/make-styles\"\nimport * as tokens from \"../../tokens\"\n\nimport { RangeCalendar } from \"./range-calendar\"\nimport type { RangeCalendarProps } from \"./range-calendar\"\nimport type { DateRange, DateTimePickerLocale } from \"./date-range-picker-utils\"\nimport {\n  formatDateTimeDisplay,\n  parseDateTimeInput,\n} from \"./date-range-picker-utils\"\n\nconst CalendarIcon = (props: React.SVGProps<SVGSVGElement>) => (\n  <svg\n    xmlns=\"http://www.w3.org/2000/svg\"\n    height=\"18px\"\n    viewBox=\"0 -960 960 960\"\n    width=\"18px\"\n    fill=\"currentColor\"\n    {...props}\n  >\n    <path d=\"M200-80q-33 0-56.5-23.5T120-160v-560q0-33 23.5-56.5T200-800h40v-80h80v80h320v-80h80v80h40q33 0 56.5 23.5T840-720v560q0 33-23.5 56.5T760-80H200Zm0-80h560v-400H200v400Zm0-480h560v-80H200v80Zm0 0v-80 80Zm280 240q-17 0-28.5-11.5T440-440q0-17 11.5-28.5T480-480q17 0 28.5 11.5T520-440q0 17-11.5 28.5T480-400Zm-160 0q-17 0-28.5-11.5T280-440q0-17 11.5-28.5T320-480q17 0 28.5 11.5T360-440q0 17-11.5 28.5T320-400Zm320 0q-17 0-28.5-11.5T600-440q0-17 11.5-28.5T640-480q17 0 28.5 11.5T680-440q0 17-11.5 28.5T640-400ZM480-240q-17 0-28.5-11.5T440-280q0-17 11.5-28.5T480-320q17 0 28.5 11.5T520-280q0 17-11.5 28.5T480-240Zm-160 0q-17 0-28.5-11.5T280-280q0-17 11.5-28.5T320-320q17 0 28.5 11.5T360-280q0 17-11.5 28.5T320-240Zm320 0q-17 0-28.5-11.5T600-280q0-17 11.5-28.5T640-320q17 0 28.5 11.5T680-280q0 17-11.5 28.5T640-240Z\" />\n  </svg>\n)\n\nconst DEFAULT_FORMAT = \"dd/MM/yyyy\"\n\nexport type DateRangePreset = {\n  label: string\n  getValue: () => DateRange\n}\n\nexport type DateRangePickerProps = {\n  value: DateRange\n  onChange: (range: DateRange) => void\n  onBlur?: () => void\n  disabled?: boolean\n  disablePast?: boolean\n  label?: string\n  error?: string\n  startPlaceholder?: string\n  endPlaceholder?: string\n  format?: string\n  locale?: DateTimePickerLocale\n  className?: string\n  keyboardIcon?: React.ReactNode\n  inputAriaLabel?: string\n  openPickerAriaLabel?: string\n  previousMonthLabel?: string\n  nextMonthLabel?: string\n  testId?: string\n  currentTimeInTimezone?: Date\n  showWeekNumbers?: boolean\n  presets?: DateRangePreset[]\n}\n\nconst useStyles = makeZenithStyles({\n  root: {\n    width: \"100%\",\n  },\n  inputGroup: {\n    width: \"100%\",\n  },\n  /**\n   * Reproduces a v1 defect on purpose, the same way Label's line-height is reproduced: v1's `icon-\n   * sm` size classes do not reach this button, so v1 renders it content-sized at 18x18 around an\n   * unconstrained 18px icon rather than the 28x28-with-14px-icon that `icon-sm` specifies.\n   */\n  addonButton: {\n    width: \"auto\",\n    height: \"auto\",\n    \"& svg\": { width: \"auto\", height: \"auto\" },\n  },\n  popoverTrigger: {\n    flexGrow: 1,\n    flexShrink: 1,\n    flexBasis: \"0%\",\n  },\n  triggerRoot: {\n    display: \"flex\",\n    alignItems: \"center\",\n    ...shorthands.gap(tokens.spacingElement2),\n    flexGrow: 1,\n    flexShrink: 1,\n    flexBasis: \"0%\",\n    height: \"1.5rem\",\n    cursor: \"pointer\",\n  },\n  input: {\n    width: \"5.5rem\",\n    outlineStyle: \"none\",\n    fontSize: tokens.textSm,\n    lineHeight: tokens.leadingSm,\n    color: tokens.grayA12,\n    backgroundColor: \"transparent\",\n    textAlign: \"center\",\n    ...shorthands.border(\"0\"),\n    ...shorthands.padding(\"0\"),\n    \"::placeholder\": {\n      color: tokens.grayA8,\n    },\n    \":disabled\": {\n      cursor: \"not-allowed\",\n    },\n  },\n  separator: {\n    fontSize: tokens.textSm,\n    lineHeight: tokens.leadingSm,\n    color: tokens.gray9,\n    flexShrink: 0,\n    userSelect: \"none\",\n    ...shorthands.padding(\"0\", \"0.125rem\"), // v1 px-0.5\n  },\n  popoverContent: {\n    ...shorthands.overflow(\"hidden\"),\n  },\n  content: {\n    display: \"flex\",\n    flexDirection: \"row\",\n    ...shorthands.gap(tokens.spacingGroup1),\n    ...shorthands.padding(\"0.75rem\"), // v1 p-3 (0.75rem)\n  },\n  presets: {\n    display: \"flex\",\n    flexDirection: \"column\",\n    ...shorthands.gap(tokens.spacingElement1),\n    width: \"8rem\", // v1 w-32\n    borderLeftWidth: \"1px\",\n    borderLeftStyle: \"solid\",\n    borderLeftColor: tokens.gray6,\n    paddingLeft: \"0.75rem\", // v1 pl-3 (0.75rem)\n  },\n  presetPill: {\n    alignSelf: \"flex-start\",\n  },\n})\n\nconst RangeInputTrigger = React.forwardRef<\n  HTMLDivElement,\n  {\n    startValue: string\n    endValue: string\n    startPlaceholder: string\n    endPlaceholder: string\n    disabled: boolean\n    onStartChange: (e: React.ChangeEvent<HTMLInputElement>) => void\n    onEndChange: (e: React.ChangeEvent<HTMLInputElement>) => void\n    onStartBlur: () => void\n    onEndBlur: () => void\n    testId?: string\n    inputAriaLabel?: string\n    /** Ids from DateRangePicker so its visible label can point at and name the inputs (#16). */\n    startId?: string\n    endId?: string\n    labelId?: string\n    \"data-slot\"?: string\n  } & React.HTMLAttributes<HTMLDivElement>\n>((props, ref) => {\n  const {\n    startValue,\n    endValue,\n    startPlaceholder,\n    endPlaceholder,\n    disabled,\n    onStartChange,\n    onEndChange,\n    onStartBlur,\n    onEndBlur,\n    testId,\n    inputAriaLabel,\n    startId,\n    endId,\n    labelId,\n    className,\n    \"data-slot\": _dataSlot,\n    ...divProps\n  } = props\n  const styles = useStyles()\n\n  return (\n    <div\n      ref={ref}\n      {...divProps}\n      className={mergeClasses(styles.triggerRoot, className)}\n      data-slot=\"date-range-input\"\n      {...{ [SLOT_ATTR]: \"date-range-input\" }}\n    >\n      <input\n        aria-label={inputAriaLabel || \"Start date\"}\n        id={startId}\n        aria-labelledby={labelId ? `${labelId} ${startId}` : undefined}\n        className={styles.input}\n        data-slot=\"date-range-start-input\"\n        {...{ [SLOT_ATTR]: \"date-range-start-input\" }}\n        data-testid={testId ? `${testId}-start` : undefined}\n        disabled={disabled}\n        onBlur={onStartBlur}\n        onChange={onStartChange}\n        placeholder={startPlaceholder}\n        value={startValue}\n      />\n      <span\n        className={styles.separator}\n        data-slot=\"date-range-separator\"\n        {...{ [SLOT_ATTR]: \"date-range-separator\" }}\n      >\n        {\"\\u2013\"}\n      </span>\n      <input\n        aria-label=\"End date\"\n        id={endId}\n        aria-labelledby={labelId ? `${labelId} ${endId}` : undefined}\n        className={styles.input}\n        data-slot=\"date-range-end-input\"\n        {...{ [SLOT_ATTR]: \"date-range-end-input\" }}\n        data-testid={testId ? `${testId}-end` : undefined}\n        disabled={disabled}\n        onBlur={onEndBlur}\n        onChange={onEndChange}\n        placeholder={endPlaceholder}\n        value={endValue}\n      />\n    </div>\n  )\n})\n\nexport const DateRangePicker = React.forwardRef<\n  HTMLDivElement,\n  DateRangePickerProps\n>(function DateRangePicker(\n  {\n    value,\n    onChange,\n    onBlur,\n    disabled = false,\n    disablePast = false,\n    label,\n    error,\n    startPlaceholder = \"dd/MM/yyyy\",\n    endPlaceholder = \"dd/MM/yyyy\",\n    format = DEFAULT_FORMAT,\n    locale = \"de\",\n    className,\n    keyboardIcon,\n    inputAriaLabel,\n    openPickerAriaLabel = \"Open date picker\",\n    previousMonthLabel = \"Previous month\",\n    nextMonthLabel = \"Next month\",\n    testId,\n    currentTimeInTimezone,\n    showWeekNumbers = false,\n    presets,\n  },\n  ref\n) {\n  const styles = useStyles()\n  const [isOpen, setIsOpen] = React.useState(false)\n  const [startInputValue, setStartInputValue] = React.useState(() =>\n    value.start ? formatDateTimeDisplay(value.start, format, locale) : \"\"\n  )\n  const [endInputValue, setEndInputValue] = React.useState(() =>\n    value.end ? formatDateTimeDisplay(value.end, format, locale) : \"\"\n  )\n  const [tempRange, setTempRange] = React.useState<DateRange>(value)\n  const originalValueRef = React.useRef<DateRange>(value)\n  const closeTimerRef = React.useRef<ReturnType<typeof setTimeout> | undefined>(\n    undefined\n  )\n  React.useEffect(\n    () => () => {\n      if (closeTimerRef.current !== undefined)\n        clearTimeout(closeTimerRef.current)\n    },\n    []\n  )\n\n  React.useEffect(() => {\n    setStartInputValue(\n      value.start ? formatDateTimeDisplay(value.start, format, locale) : \"\"\n    )\n    setEndInputValue(\n      value.end ? formatDateTimeDisplay(value.end, format, locale) : \"\"\n    )\n    setTempRange(value)\n  }, [value, format, locale])\n\n  React.useEffect(() => {\n    if (isOpen) {\n      originalValueRef.current = value\n      setTempRange(value)\n    }\n  }, [isOpen, value])\n\n  const handleStartInputChange = React.useCallback(\n    (e: React.ChangeEvent<HTMLInputElement>) => {\n      const newValue = e.target.value\n\n      setStartInputValue(newValue)\n\n      const parsed = parseDateTimeInput(newValue, format, locale)\n\n      if (parsed) {\n        const newRange = { ...value, start: parsed }\n\n        onChange(newRange)\n      }\n    },\n    [onChange, value, format, locale]\n  )\n\n  const handleEndInputChange = React.useCallback(\n    (e: React.ChangeEvent<HTMLInputElement>) => {\n      const newValue = e.target.value\n\n      setEndInputValue(newValue)\n\n      const parsed = parseDateTimeInput(newValue, format, locale)\n\n      if (parsed) {\n        const newRange = { ...value, end: parsed }\n\n        onChange(newRange)\n      }\n    },\n    [onChange, value, format, locale]\n  )\n\n  const handleStartInputBlur = React.useCallback(() => {\n    const parsed = parseDateTimeInput(startInputValue, format, locale)\n\n    if (!parsed) {\n      setStartInputValue(\n        value.start ? formatDateTimeDisplay(value.start, format, locale) : \"\"\n      )\n    }\n    onBlur?.()\n  }, [startInputValue, value.start, format, locale, onBlur])\n\n  const handleEndInputBlur = React.useCallback(() => {\n    const parsed = parseDateTimeInput(endInputValue, format, locale)\n\n    if (!parsed) {\n      setEndInputValue(\n        value.end ? formatDateTimeDisplay(value.end, format, locale) : \"\"\n      )\n    }\n    onBlur?.()\n  }, [endInputValue, value.end, format, locale, onBlur])\n\n  const handleRangeChange = React.useCallback(\n    (range: DateRange) => {\n      setTempRange(range)\n      setStartInputValue(\n        range.start ? formatDateTimeDisplay(range.start, format, locale) : \"\"\n      )\n      setEndInputValue(\n        range.end ? formatDateTimeDisplay(range.end, format, locale) : \"\"\n      )\n    },\n    [format, locale]\n  )\n\n  const handleRangeComplete = React.useCallback(\n    (range: DateRange) => {\n      onChange(range)\n      setTempRange(range)\n      setStartInputValue(\n        range.start ? formatDateTimeDisplay(range.start, format, locale) : \"\"\n      )\n      setEndInputValue(\n        range.end ? formatDateTimeDisplay(range.end, format, locale) : \"\"\n      )\n      // Small delay to allow the user to see the selection before closing. Tracked and cleared on\n      // unmount: an uncleared timer fires into an unmounted tree, which React 18 reports as a\n      // state update on an unmounted component and which under jsdom teardown throws\n      // `ReferenceError: window is not defined` from the scheduler.\n      if (closeTimerRef.current !== undefined)\n        clearTimeout(closeTimerRef.current)\n      closeTimerRef.current = setTimeout(() => {\n        closeTimerRef.current = undefined\n        setIsOpen(false)\n      }, 150)\n    },\n    [onChange, format, locale]\n  )\n\n  const handlePopoverOpenChange = React.useCallback(\n    (open: boolean) => {\n      if (!open) {\n        // If closing without a complete selection, revert\n        if (!tempRange.start || !tempRange.end) {\n          setTempRange(originalValueRef.current)\n          setStartInputValue(\n            originalValueRef.current.start\n              ? formatDateTimeDisplay(\n                  originalValueRef.current.start,\n                  format,\n                  locale\n                )\n              : \"\"\n          )\n          setEndInputValue(\n            originalValueRef.current.end\n              ? formatDateTimeDisplay(\n                  originalValueRef.current.end,\n                  format,\n                  locale\n                )\n              : \"\"\n          )\n        }\n      }\n      setIsOpen(open)\n    },\n    [tempRange, format, locale]\n  )\n\n  const IconComponent = keyboardIcon || <CalendarIcon />\n  const fieldVariant = error ? \"destructive\" : \"highlight\"\n  // This component renders both the label and the inputs, so it connects them (#16).\n  const labelId = React.useId()\n  const startId = React.useId()\n  const endId = React.useId()\n\n  return (\n    <Field\n      className={mergeClasses(styles.root, className)}\n      data-slot=\"daterangepicker\"\n      {...{ [SLOT_ATTR]: \"daterangepicker\" }}\n      ref={ref}\n      variant={fieldVariant}\n    >\n      {label && (\n        <FieldLabel id={labelId} htmlFor={startId}>\n          {label}\n        </FieldLabel>\n      )}\n      <Popover modal onOpenChange={handlePopoverOpenChange} open={isOpen}>\n        <FieldInputGroup className={styles.inputGroup}>\n          <PopoverTrigger asChild className={styles.popoverTrigger}>\n            <RangeInputTrigger\n              disabled={disabled}\n              endPlaceholder={endPlaceholder}\n              endValue={endInputValue}\n              inputAriaLabel={inputAriaLabel}\n              startId={startId}\n              endId={endId}\n              labelId={label ? labelId : undefined}\n              onEndBlur={handleEndInputBlur}\n              onEndChange={handleEndInputChange}\n              onStartBlur={handleStartInputBlur}\n              onStartChange={handleStartInputChange}\n              startPlaceholder={startPlaceholder}\n              startValue={startInputValue}\n              testId={testId}\n            />\n          </PopoverTrigger>\n          <FieldGroupAddon align=\"end\">\n            <Button\n              aria-label={openPickerAriaLabel}\n              disabled={disabled}\n              onClick={() => setIsOpen(true)}\n              className={styles.addonButton}\n              size=\"icon-sm\"\n              variant=\"tertiary\"\n            >\n              {IconComponent}\n            </Button>\n          </FieldGroupAddon>\n        </FieldInputGroup>\n        <PopoverContent\n          align=\"start\"\n          className={styles.popoverContent}\n          flush\n          side=\"bottom\"\n          sideOffset={4}\n        >\n          <div\n            className={styles.content}\n            data-slot=\"daterangepicker-content\"\n            {...{ [SLOT_ATTR]: \"daterangepicker-content\" }}\n          >\n            <RangeCalendar\n              currentTimeInTimezone={currentTimeInTimezone}\n              disablePast={disablePast}\n              locale={locale}\n              nextMonthLabel={nextMonthLabel}\n              onChange={handleRangeChange}\n              onRangeComplete={handleRangeComplete}\n              previousMonthLabel={previousMonthLabel}\n              showWeekNumbers={showWeekNumbers}\n              value={tempRange}\n            />\n            {presets && presets.length > 0 && (\n              <aside\n                className={styles.presets}\n                data-slot=\"daterangepicker-presets\"\n                {...{ [SLOT_ATTR]: \"daterangepicker-presets\" }}\n              >\n                {presets.map((preset) => (\n                  <Pill\n                    className={styles.presetPill}\n                    data-slot=\"daterangepicker-preset\"\n                    {...{ [SLOT_ATTR]: \"daterangepicker-preset\" }}\n                    key={preset.label}\n                    onClick={() => {\n                      const range = preset.getValue()\n\n                      handleRangeComplete(range)\n                    }}\n                    variant=\"surface\"\n                  >\n                    {preset.label}\n                  </Pill>\n                ))}\n              </aside>\n            )}\n          </div>\n        </PopoverContent>\n      </Popover>\n      {error && <FieldError>{error}</FieldError>}\n    </Field>\n  )\n})\n\nexport { RangeCalendar }\nexport type { RangeCalendarProps, DateRange, DateTimePickerLocale }\n"],"names":["CalendarIcon","props","jsx","DEFAULT_FORMAT","useStyles","makeZenithStyles","shorthands","tokens.spacingElement2","tokens.textSm","tokens.leadingSm","tokens.grayA12","tokens.grayA8","tokens.gray9","tokens.spacingGroup1","tokens.spacingElement1","tokens.gray6","RangeInputTrigger","React","ref","startValue","endValue","startPlaceholder","endPlaceholder","disabled","onStartChange","onEndChange","onStartBlur","onEndBlur","testId","inputAriaLabel","startId","endId","labelId","className","_dataSlot","divProps","styles","jsxs","mergeClasses","SLOT_ATTR","DateRangePicker","value","onChange","onBlur","disablePast","label","error","format","locale","keyboardIcon","openPickerAriaLabel","previousMonthLabel","nextMonthLabel","currentTimeInTimezone","showWeekNumbers","presets","isOpen","setIsOpen","startInputValue","setStartInputValue","formatDateTimeDisplay","endInputValue","setEndInputValue","tempRange","setTempRange","originalValueRef","closeTimerRef","handleStartInputChange","e","newValue","parsed","parseDateTimeInput","newRange","handleEndInputChange","handleStartInputBlur","handleEndInputBlur","handleRangeChange","range","handleRangeComplete","handlePopoverOpenChange","open","IconComponent","fieldVariant","Field","FieldLabel","Popover","FieldInputGroup","PopoverTrigger","FieldGroupAddon","Button","PopoverContent","RangeCalendar","preset","createElement","Pill","FieldError"],"mappings":";;;;;;;;;;;;AAyBA,MAAMA,KAAe,CAACC,MACpB,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,OAAM;AAAA,IACN,QAAO;AAAA,IACP,SAAQ;AAAA,IACR,OAAM;AAAA,IACN,MAAK;AAAA,IACJ,GAAGD;AAAA,IAEJ,UAAA,gBAAAC,EAAC,QAAA,EAAK,GAAE,yyBAAA,CAAyyB;AAAA,EAAA;AACnzB,GAGIC,KAAiB,cA+BjBC,IAAYC,GAAiB;AAAA,EACjC,MAAM;AAAA,IACJ,OAAO;AAAA,EAAA;AAAA,EAET,YAAY;AAAA,IACV,OAAO;AAAA,EAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOT,aAAa;AAAA,IACX,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,SAAS,EAAE,OAAO,QAAQ,QAAQ,OAAA;AAAA,EAAO;AAAA,EAE3C,gBAAgB;AAAA,IACd,UAAU;AAAA,IACV,YAAY;AAAA,IACZ,WAAW;AAAA,EAAA;AAAA,EAEb,aAAa;AAAA,IACX,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,GAAGC,EAAW,IAAIC,EAAsB;AAAA,IACxC,UAAU;AAAA,IACV,YAAY;AAAA,IACZ,WAAW;AAAA,IACX,QAAQ;AAAA,IACR,QAAQ;AAAA,EAAA;AAAA,EAEV,OAAO;AAAA,IACL,OAAO;AAAA,IACP,cAAc;AAAA,IACd,UAAUC;AAAAA,IACV,YAAYC;AAAAA,IACZ,OAAOC;AAAAA,IACP,iBAAiB;AAAA,IACjB,WAAW;AAAA,IACX,GAAGJ,EAAW,OAAO,GAAG;AAAA,IACxB,GAAGA,EAAW,QAAQ,GAAG;AAAA,IACzB,iBAAiB;AAAA,MACf,OAAOK;AAAAA,IAAO;AAAA,IAEhB,aAAa;AAAA,MACX,QAAQ;AAAA,IAAA;AAAA,EACV;AAAA,EAEF,WAAW;AAAA,IACT,UAAUH;AAAAA,IACV,YAAYC;AAAAA,IACZ,OAAOG;AAAAA,IACP,YAAY;AAAA,IACZ,YAAY;AAAA,IACZ,GAAGN,EAAW,QAAQ,KAAK,UAAU;AAAA;AAAA,EAAA;AAAA,EAEvC,gBAAgB;AAAA,IACd,GAAGA,EAAW,SAAS,QAAQ;AAAA,EAAA;AAAA,EAEjC,SAAS;AAAA,IACP,SAAS;AAAA,IACT,eAAe;AAAA,IACf,GAAGA,EAAW,IAAIO,EAAoB;AAAA,IACtC,GAAGP,EAAW,QAAQ,SAAS;AAAA;AAAA,EAAA;AAAA,EAEjC,SAAS;AAAA,IACP,SAAS;AAAA,IACT,eAAe;AAAA,IACf,GAAGA,EAAW,IAAIQ,EAAsB;AAAA,IACxC,OAAO;AAAA;AAAA,IACP,iBAAiB;AAAA,IACjB,iBAAiB;AAAA,IACjB,iBAAiBC;AAAAA,IACjB,aAAa;AAAA;AAAA,EAAA;AAAA,EAEf,YAAY;AAAA,IACV,WAAW;AAAA,EAAA;AAEf,CAAC,GAEKC,KAAoBC,EAAM,WAoB9B,CAAChB,GAAOiB,MAAQ;AAChB,QAAM;AAAA,IACJ,YAAAC;AAAA,IACA,UAAAC;AAAA,IACA,kBAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,UAAAC;AAAA,IACA,eAAAC;AAAA,IACA,aAAAC;AAAA,IACA,aAAAC;AAAA,IACA,WAAAC;AAAA,IACA,QAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,SAAAC;AAAA,IACA,OAAAC;AAAA,IACA,SAAAC;AAAA,IACA,WAAAC;AAAA,IACA,aAAaC;AAAA,IACb,GAAGC;AAAA,EAAA,IACDlC,GACEmC,IAAShC,EAAA;AAEf,SACE,gBAAAiC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAAnB;AAAA,MACC,GAAGiB;AAAA,MACJ,WAAWG,EAAaF,EAAO,aAAaH,CAAS;AAAA,MACrD,aAAU;AAAA,MACJ,CAACM,CAAS,GAAG;AAAA,MAEnB,UAAA;AAAA,QAAA,gBAAArC;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,cAAY2B,KAAkB;AAAA,YAC9B,IAAIC;AAAA,YACJ,mBAAiBE,IAAU,GAAGA,CAAO,IAAIF,CAAO,KAAK;AAAA,YACrD,WAAWM,EAAO;AAAA,YAClB,aAAU;AAAA,YACJ,CAACG,CAAS,GAAG;AAAA,YACnB,eAAaX,IAAS,GAAGA,CAAM,WAAW;AAAA,YAC1C,UAAAL;AAAA,YACA,QAAQG;AAAA,YACR,UAAUF;AAAA,YACV,aAAaH;AAAA,YACb,OAAOF;AAAA,UAAA;AAAA,QAAA;AAAA,QAET,gBAAAjB;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAWkC,EAAO;AAAA,YAClB,aAAU;AAAA,YACJ,CAACG,CAAS,GAAG;AAAA,YAElB,UAAA;AAAA,UAAA;AAAA,QAAA;AAAA,QAEH,gBAAArC;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,cAAW;AAAA,YACX,IAAI6B;AAAA,YACJ,mBAAiBC,IAAU,GAAGA,CAAO,IAAID,CAAK,KAAK;AAAA,YACnD,WAAWK,EAAO;AAAA,YAClB,aAAU;AAAA,YACJ,CAACG,CAAS,GAAG;AAAA,YACnB,eAAaX,IAAS,GAAGA,CAAM,SAAS;AAAA,YACxC,UAAAL;AAAA,YACA,QAAQI;AAAA,YACR,UAAUF;AAAA,YACV,aAAaH;AAAA,YACb,OAAOF;AAAA,UAAA;AAAA,QAAA;AAAA,MACT;AAAA,IAAA;AAAA,EAAA;AAGN,CAAC,GAEYoB,KAAkBvB,EAAM,WAGnC,SACA;AAAA,EACE,OAAAwB;AAAA,EACA,UAAAC;AAAA,EACA,QAAAC;AAAA,EACA,UAAApB,IAAW;AAAA,EACX,aAAAqB,IAAc;AAAA,EACd,OAAAC;AAAA,EACA,OAAAC;AAAA,EACA,kBAAAzB,IAAmB;AAAA,EACnB,gBAAAC,IAAiB;AAAA,EACjB,QAAAyB,IAAS5C;AAAA,EACT,QAAA6C,IAAS;AAAA,EACT,WAAAf;AAAA,EACA,cAAAgB;AAAA,EACA,gBAAApB;AAAA,EACA,qBAAAqB,IAAsB;AAAA,EACtB,oBAAAC,IAAqB;AAAA,EACrB,gBAAAC,IAAiB;AAAA,EACjB,QAAAxB;AAAA,EACA,uBAAAyB;AAAA,EACA,iBAAAC,IAAkB;AAAA,EAClB,SAAAC;AACF,GACArC,GACA;AACA,QAAMkB,IAAShC,EAAA,GACT,CAACoD,GAAQC,CAAS,IAAIxC,EAAM,SAAS,EAAK,GAC1C,CAACyC,GAAiBC,CAAkB,IAAI1C,EAAM;AAAA,IAAS,MAC3DwB,EAAM,QAAQmB,EAAsBnB,EAAM,OAAOM,GAAQC,CAAM,IAAI;AAAA,EAAA,GAE/D,CAACa,GAAeC,CAAgB,IAAI7C,EAAM;AAAA,IAAS,MACvDwB,EAAM,MAAMmB,EAAsBnB,EAAM,KAAKM,GAAQC,CAAM,IAAI;AAAA,EAAA,GAE3D,CAACe,GAAWC,CAAY,IAAI/C,EAAM,SAAoBwB,CAAK,GAC3DwB,IAAmBhD,EAAM,OAAkBwB,CAAK,GAChDyB,IAAgBjD,EAAM;AAAA,IAC1B;AAAA,EAAA;AAEF,EAAAA,EAAM;AAAA,IACJ,MAAM,MAAM;AACV,MAAIiD,EAAc,YAAY,UAC5B,aAAaA,EAAc,OAAO;AAAA,IACtC;AAAA,IACA,CAAA;AAAA,EAAC,GAGHjD,EAAM,UAAU,MAAM;AACpB,IAAA0C;AAAA,MACElB,EAAM,QAAQmB,EAAsBnB,EAAM,OAAOM,GAAQC,CAAM,IAAI;AAAA,IAAA,GAErEc;AAAA,MACErB,EAAM,MAAMmB,EAAsBnB,EAAM,KAAKM,GAAQC,CAAM,IAAI;AAAA,IAAA,GAEjEgB,EAAavB,CAAK;AAAA,EACpB,GAAG,CAACA,GAAOM,GAAQC,CAAM,CAAC,GAE1B/B,EAAM,UAAU,MAAM;AACpB,IAAIuC,MACFS,EAAiB,UAAUxB,GAC3BuB,EAAavB,CAAK;AAAA,EAEtB,GAAG,CAACe,GAAQf,CAAK,CAAC;AAElB,QAAM0B,IAAyBlD,EAAM;AAAA,IACnC,CAACmD,MAA2C;AAC1C,YAAMC,IAAWD,EAAE,OAAO;AAE1B,MAAAT,EAAmBU,CAAQ;AAE3B,YAAMC,IAASC,EAAmBF,GAAUtB,GAAQC,CAAM;AAE1D,UAAIsB,GAAQ;AACV,cAAME,IAAW,EAAE,GAAG/B,GAAO,OAAO6B,EAAA;AAEpC,QAAA5B,EAAS8B,CAAQ;AAAA,MACnB;AAAA,IACF;AAAA,IACA,CAAC9B,GAAUD,GAAOM,GAAQC,CAAM;AAAA,EAAA,GAG5ByB,IAAuBxD,EAAM;AAAA,IACjC,CAACmD,MAA2C;AAC1C,YAAMC,IAAWD,EAAE,OAAO;AAE1B,MAAAN,EAAiBO,CAAQ;AAEzB,YAAMC,IAASC,EAAmBF,GAAUtB,GAAQC,CAAM;AAE1D,UAAIsB,GAAQ;AACV,cAAME,IAAW,EAAE,GAAG/B,GAAO,KAAK6B,EAAA;AAElC,QAAA5B,EAAS8B,CAAQ;AAAA,MACnB;AAAA,IACF;AAAA,IACA,CAAC9B,GAAUD,GAAOM,GAAQC,CAAM;AAAA,EAAA,GAG5B0B,KAAuBzD,EAAM,YAAY,MAAM;AAGnD,IAFesD,EAAmBb,GAAiBX,GAAQC,CAAM,KAG/DW;AAAA,MACElB,EAAM,QAAQmB,EAAsBnB,EAAM,OAAOM,GAAQC,CAAM,IAAI;AAAA,IAAA,GAGvEL,KAAA,QAAAA;AAAA,EACF,GAAG,CAACe,GAAiBjB,EAAM,OAAOM,GAAQC,GAAQL,CAAM,CAAC,GAEnDgC,KAAqB1D,EAAM,YAAY,MAAM;AAGjD,IAFesD,EAAmBV,GAAed,GAAQC,CAAM,KAG7Dc;AAAA,MACErB,EAAM,MAAMmB,EAAsBnB,EAAM,KAAKM,GAAQC,CAAM,IAAI;AAAA,IAAA,GAGnEL,KAAA,QAAAA;AAAA,EACF,GAAG,CAACkB,GAAepB,EAAM,KAAKM,GAAQC,GAAQL,CAAM,CAAC,GAE/CiC,KAAoB3D,EAAM;AAAA,IAC9B,CAAC4D,MAAqB;AACpB,MAAAb,EAAaa,CAAK,GAClBlB;AAAA,QACEkB,EAAM,QAAQjB,EAAsBiB,EAAM,OAAO9B,GAAQC,CAAM,IAAI;AAAA,MAAA,GAErEc;AAAA,QACEe,EAAM,MAAMjB,EAAsBiB,EAAM,KAAK9B,GAAQC,CAAM,IAAI;AAAA,MAAA;AAAA,IAEnE;AAAA,IACA,CAACD,GAAQC,CAAM;AAAA,EAAA,GAGX8B,IAAsB7D,EAAM;AAAA,IAChC,CAAC4D,MAAqB;AACpB,MAAAnC,EAASmC,CAAK,GACdb,EAAaa,CAAK,GAClBlB;AAAA,QACEkB,EAAM,QAAQjB,EAAsBiB,EAAM,OAAO9B,GAAQC,CAAM,IAAI;AAAA,MAAA,GAErEc;AAAA,QACEe,EAAM,MAAMjB,EAAsBiB,EAAM,KAAK9B,GAAQC,CAAM,IAAI;AAAA,MAAA,GAM7DkB,EAAc,YAAY,UAC5B,aAAaA,EAAc,OAAO,GACpCA,EAAc,UAAU,WAAW,MAAM;AACvC,QAAAA,EAAc,UAAU,QACxBT,EAAU,EAAK;AAAA,MACjB,GAAG,GAAG;AAAA,IACR;AAAA,IACA,CAACf,GAAUK,GAAQC,CAAM;AAAA,EAAA,GAGrB+B,KAA0B9D,EAAM;AAAA,IACpC,CAAC+D,MAAkB;AACjB,MAAKA,MAEC,CAACjB,EAAU,SAAS,CAACA,EAAU,SACjCC,EAAaC,EAAiB,OAAO,GACrCN;AAAA,QACEM,EAAiB,QAAQ,QACrBL;AAAA,UACEK,EAAiB,QAAQ;AAAA,UACzBlB;AAAA,UACAC;AAAA,QAAA,IAEF;AAAA,MAAA,GAENc;AAAA,QACEG,EAAiB,QAAQ,MACrBL;AAAA,UACEK,EAAiB,QAAQ;AAAA,UACzBlB;AAAA,UACAC;AAAA,QAAA,IAEF;AAAA,MAAA,IAIVS,EAAUuB,CAAI;AAAA,IAChB;AAAA,IACA,CAACjB,GAAWhB,GAAQC,CAAM;AAAA,EAAA,GAGtBiC,KAAgBhC,KAAgB,gBAAA/C,EAACF,IAAA,CAAA,CAAa,GAC9CkF,KAAepC,IAAQ,gBAAgB,aAEvCd,IAAUf,EAAM,MAAA,GAChBa,IAAUb,EAAM,MAAA,GAChBc,KAAQd,EAAM,MAAA;AAEpB,SACE,gBAAAoB;AAAA,IAAC8C;AAAA,IAAA;AAAA,MACC,WAAW7C,EAAaF,EAAO,MAAMH,CAAS;AAAA,MAC9C,aAAU;AAAA,MACJ,CAACM,CAAS,GAAG;AAAA,MACnB,KAAArB;AAAA,MACA,SAASgE;AAAA,MAER,UAAA;AAAA,QAAArC,uBACEuC,IAAA,EAAW,IAAIpD,GAAS,SAASF,GAC/B,UAAAe,GACH;AAAA,0BAEDwC,IAAA,EAAQ,OAAK,IAAC,cAAcN,IAAyB,MAAMvB,GAC1D,UAAA;AAAA,UAAA,gBAAAnB,EAACiD,IAAA,EAAgB,WAAWlD,EAAO,YACjC,UAAA;AAAA,YAAA,gBAAAlC,EAACqF,IAAA,EAAe,SAAO,IAAC,WAAWnD,EAAO,gBACxC,UAAA,gBAAAlC;AAAA,cAACc;AAAA,cAAA;AAAA,gBACC,UAAAO;AAAA,gBACA,gBAAAD;AAAA,gBACA,UAAUuC;AAAA,gBACV,gBAAAhC;AAAA,gBACA,SAAAC;AAAA,gBACA,OAAAC;AAAA,gBACA,SAASc,IAAQb,IAAU;AAAA,gBAC3B,WAAW2C;AAAA,gBACX,aAAaF;AAAA,gBACb,aAAaC;AAAA,gBACb,eAAeP;AAAA,gBACf,kBAAA9C;AAAA,gBACA,YAAYqC;AAAA,gBACZ,QAAA9B;AAAA,cAAA;AAAA,YAAA,GAEJ;AAAA,YACA,gBAAA1B,EAACsF,IAAA,EAAgB,OAAM,OACrB,UAAA,gBAAAtF;AAAA,cAACuF;AAAA,cAAA;AAAA,gBACC,cAAYvC;AAAA,gBACZ,UAAA3B;AAAA,gBACA,SAAS,MAAMkC,EAAU,EAAI;AAAA,gBAC7B,WAAWrB,EAAO;AAAA,gBAClB,MAAK;AAAA,gBACL,SAAQ;AAAA,gBAEP,UAAA6C;AAAA,cAAA;AAAA,YAAA,EACH,CACF;AAAA,UAAA,GACF;AAAA,UACA,gBAAA/E;AAAA,YAACwF;AAAA,YAAA;AAAA,cACC,OAAM;AAAA,cACN,WAAWtD,EAAO;AAAA,cAClB,OAAK;AAAA,cACL,MAAK;AAAA,cACL,YAAY;AAAA,cAEZ,UAAA,gBAAAC;AAAA,gBAAC;AAAA,gBAAA;AAAA,kBACC,WAAWD,EAAO;AAAA,kBAClB,aAAU;AAAA,kBACJ,CAACG,CAAS,GAAG;AAAA,kBAEnB,UAAA;AAAA,oBAAA,gBAAArC;AAAA,sBAACyF;AAAA,sBAAA;AAAA,wBACC,uBAAAtC;AAAA,wBACA,aAAAT;AAAA,wBACA,QAAAI;AAAA,wBACA,gBAAAI;AAAA,wBACA,UAAUwB;AAAA,wBACV,iBAAiBE;AAAA,wBACjB,oBAAA3B;AAAA,wBACA,iBAAAG;AAAA,wBACA,OAAOS;AAAA,sBAAA;AAAA,oBAAA;AAAA,oBAERR,KAAWA,EAAQ,SAAS,KAC3B,gBAAArD;AAAA,sBAAC;AAAA,sBAAA;AAAA,wBACC,WAAWkC,EAAO;AAAA,wBAClB,aAAU;AAAA,wBACJ,CAACG,CAAS,GAAG;AAAA,wBAElB,UAAAgB,EAAQ,IAAI,CAACqC,MACZ,gBAAAC;AAAA,0BAACC;AAAA,0BAAA;AAAA,4BACC,WAAW1D,EAAO;AAAA,4BAClB,aAAU;AAAA,4BACJ,CAACG,CAAS,GAAG;AAAA,4BACnB,KAAKqD,EAAO;AAAA,4BACZ,SAAS,MAAM;AACb,oCAAMf,IAAQe,EAAO,SAAA;AAErB,8BAAAd,EAAoBD,CAAK;AAAA,4BAC3B;AAAA,4BACA,SAAQ;AAAA,0BAAA;AAAA,0BAEPe,EAAO;AAAA,wBAAA,CAEX;AAAA,sBAAA;AAAA,oBAAA;AAAA,kBACH;AAAA,gBAAA;AAAA,cAAA;AAAA,YAEJ;AAAA,UAAA;AAAA,QACF,GACF;AAAA,QACC9C,KAAS,gBAAA5C,EAAC6F,IAAA,EAAY,UAAAjD,EAAA,CAAM;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGnC,CAAC;"}

package/dist/components/date-time-picker/date-time-picker-input.js

@@ -1,14 +1,14 @@
 import { jsx as s, jsxs as G } from "react/jsx-runtime";
-import * as r from "react";
-import { useRifm as ee } from "../../vendor/.bun/rifm@0.12.1_62547eec5a2188e3/vendor/rifm/dist/rifm.esm.js";
-import { mergeClasses as C, SLOT_ATTR as K } from "@epilot/zenith-runtime/v1";
+import * as l from "react";
+import { useRifm as ae } from "../../vendor/.bun/rifm@0.12.1_62547eec5a2188e3/vendor/rifm/dist/rifm.esm.js";
+import { mergeClasses as b, SLOT_ATTR as K } from "@epilot/zenith-runtime/v1";
 import { Button as N } from "../button/button.js";
-import { FieldInputGroup as P, FieldInput as b, FieldGroupAddon as j } from "../field/field.js";
-import { PopoverTrigger as z, PopoverAnchor as te } from "../popover/popover.js";
-import { makeZenithStyles as ne } from "../../styles/make-styles.js";
-import { useDateTimePickerContext as ae } from "./date-time-picker-context.js";
-import { formatDateTimeDisplay as V, parseDateTimeInput as se } from "./date-time-picker-utils.js";
-const re = (f) => /* @__PURE__ */ s(
+import { FieldInputGroup as j, FieldInput as R, FieldGroupAddon as z } from "../field/field.js";
+import { PopoverTrigger as L, PopoverAnchor as se } from "../popover/popover.js";
+import { makeZenithStyles as le } from "../../styles/make-styles.js";
+import { useDateTimePickerContext as re } from "./date-time-picker-context.js";
+import { formatDateTimeDisplay as V, parseDateTimeInput as oe } from "./date-time-picker-utils.js";
+const ie = (r) => /* @__PURE__ */ s(
   "svg",
   {
     xmlns: "http://www.w3.org/2000/svg",
@@ -16,17 +16,26 @@ const re = (f) => /* @__PURE__ */ s(
     viewBox: "0 -960 960 960",
     width: "18px",
     fill: "currentColor",
-    ...f,
+    ...r,
     children: /* @__PURE__ */ s("path", { d: "M200-80q-33 0-56.5-23.5T120-160v-560q0-33 23.5-56.5T200-800h40v-80h80v80h320v-80h80v80h40q33 0 56.5 23.5T840-720v560q0 33-23.5 56.5T760-80H200Zm0-80h560v-400H200v400Zm0-480h560v-80H200v80Zm0 0v-80 80Zm280 240q-17 0-28.5-11.5T440-440q0-17 11.5-28.5T480-480q17 0 28.5 11.5T520-440q0 17-11.5 28.5T480-400Zm-160 0q-17 0-28.5-11.5T280-440q0-17 11.5-28.5T320-480q17 0 28.5 11.5T360-440q0 17-11.5 28.5T320-400Zm320 0q-17 0-28.5-11.5T600-440q0-17 11.5-28.5T640-480q17 0 28.5 11.5T680-440q0 17-11.5 28.5T640-400ZM480-240q-17 0-28.5-11.5T440-280q0-17 11.5-28.5T480-320q17 0 28.5 11.5T520-280q0 17-11.5 28.5T480-240Zm-160 0q-17 0-28.5-11.5T280-280q0-17 11.5-28.5T320-320q17 0 28.5 11.5T360-280q0 17-11.5 28.5T320-240Zm320 0q-17 0-28.5-11.5T600-280q0-17 11.5-28.5T640-320q17 0 28.5 11.5T680-280q0 17-11.5 28.5T640-240Z" })
   }
-), le = /\d/g, oe = "dd.MM.yyyy", ie = "dd.MM.yyyy HH:mm", ce = (f) => {
-  const q = f ? 12 : 8;
-  return (o) => {
-    const n = o.replace(/\D/g, "").slice(0, q);
+), ce = /\d/g, ue = "dd.MM.yyyy", de = "dd.MM.yyyy HH:mm", me = (r) => {
+  const f = r ? 12 : 8;
+  return (i) => {
+    const n = i.replace(/\D/g, "").slice(0, f);
     let t = "", e = 0;
-    return t += (n[e++] || "_") + (n[e++] || "_"), t += ".", t += (n[e++] || "_") + (n[e++] || "_"), t += ".", t += (n[e++] || "_") + (n[e++] || "_") + (n[e++] || "_") + (n[e++] || "_"), f && (t += " ", t += (n[e++] || "_") + (n[e++] || "_"), t += ":", t += (n[e++] || "_") + (n[e++] || "_")), t;
+    return t += (n[e++] || "_") + (n[e++] || "_"), t += ".", t += (n[e++] || "_") + (n[e++] || "_"), t += ".", t += (n[e++] || "_") + (n[e++] || "_") + (n[e++] || "_") + (n[e++] || "_"), r && (t += " ", t += (n[e++] || "_") + (n[e++] || "_"), t += ":", t += (n[e++] || "_") + (n[e++] || "_")), t;
   };
-}, J = ne({
+}, J = l.createContext(null), ye = ({
+  value: r,
+  children: f
+}) => /* @__PURE__ */ s(J.Provider, { value: r, children: f }), Q = () => {
+  const r = l.useContext(J);
+  return r === null ? {} : {
+    id: r.inputId,
+    ...r.namedByLabel ? { "aria-labelledby": r.labelId } : {}
+  };
+}, U = le({
   group: {
     width: "100%"
   },
@@ -38,191 +47,195 @@ const re = (f) => /* @__PURE__ */ s(
     flexShrink: 1,
     flexBasis: "0%"
   }
-}), ue = r.forwardRef(
+}), pe = l.forwardRef(
   function({
-    ctx: q,
-    disabled: o,
+    ctx: f,
+    disabled: i,
     icon: n,
     iconPosition: t,
     inputAriaLabel: e,
     openPickerAriaLabel: x,
     testId: v,
-    className: y
+    className: k
   }, _) {
-    const u = J(), {
-      value: h,
-      format: l,
-      locale: d,
-      onChange: T,
-      onBlur: p,
+    const d = U(), T = Q(), {
+      value: y,
+      format: o,
+      locale: m,
+      onChange: g,
+      onBlur: h,
       setTempValue: D,
       setInputValue: F
-    } = q, M = l.includes("HH:mm"), k = r.useMemo(
-      () => ce(M),
-      [M]
-    ), w = M ? ie : oe, I = h ? V(h, l, d) : "", [Q, S] = r.useState(""), [U, A] = r.useState(!1), Z = r.useRef(null), W = r.useCallback((a) => {
-      if (Z.current = a, !a) return;
+    } = f, I = o.includes("HH:mm"), C = l.useMemo(
+      () => me(I),
+      [I]
+    ), w = I ? de : ue, M = y ? V(y, o, m) : "", [W, S] = l.useState(""), [X, Z] = l.useState(!1), H = l.useRef(null), Y = l.useCallback((a) => {
+      if (H.current = a, !a) return;
       a.focus();
-      const m = a.value.indexOf("_");
-      m !== -1 && a.setSelectionRange(m, m);
-    }, []), R = r.useCallback(
+      const p = a.value.indexOf("_");
+      p !== -1 && a.setSelectionRange(p, p);
+    }, []), A = l.useCallback(
       (a) => {
         if (S(a), requestAnimationFrame(() => {
-          const g = Z.current;
-          if (!g) return;
-          const c = g.value.indexOf("_"), E = c === -1 ? g.value.length : c;
-          g.setSelectionRange(E, E);
+          const q = H.current;
+          if (!q) return;
+          const u = q.value.indexOf("_"), P = u === -1 ? q.value.length : u;
+          q.setSelectionRange(P, P);
         }), a.replace(/\D/g, "").length === 0) {
-          T(null), D(null), F("");
+          g(null), D(null), F("");
           return;
         }
-        const i = se(a, w, d);
-        i && (T(i), D(i), F(V(i, l, d)));
+        const c = oe(a, w, m);
+        c && (g(c), D(c), F(V(c, o, m)));
       },
-      [T, D, F, w, l, d]
-    ), H = ee({
-      accept: le,
-      format: k,
+      [g, D, F, w, o, m]
+    ), B = ae({
+      accept: ce,
+      format: C,
       mask: !0,
-      onChange: R,
-      value: Q
-    }), O = r.useCallback(() => {
-      S(k(I)), A(!0);
-    }, [I, k]), X = r.useCallback(() => {
-      A(!1), p == null || p();
-    }, [p]), Y = r.useCallback(
+      onChange: A,
+      value: W
+    }), O = l.useCallback(() => {
+      S(C(M)), Z(!0);
+    }, [M, C]), $ = l.useCallback(() => {
+      Z(!1), h == null || h();
+    }, [h]), ee = l.useCallback(
       (a) => {
-        a.preventDefault(), R(k(a.clipboardData.getData("text")));
+        a.preventDefault(), A(C(a.clipboardData.getData("text")));
       },
-      [R, k]
-    ), $ = r.useCallback(
+      [A, C]
+    ), te = l.useCallback(
       (a) => {
         if (a.key !== "Backspace") return;
-        const m = a.currentTarget, { selectionStart: i, selectionEnd: g } = m;
-        if (i === null || i !== g) return;
-        let c = i;
-        for (; c > 0 && !/[\d_]/.test(m.value[c - 1]); )
-          c--;
-        c !== i && m.setSelectionRange(c, c);
+        const p = a.currentTarget, { selectionStart: c, selectionEnd: q } = p;
+        if (c === null || c !== q) return;
+        let u = c;
+        for (; u > 0 && !/[\d_]/.test(p.value[u - 1]); )
+          u--;
+        u !== c && p.setSelectionRange(u, u);
       },
       []
-    ), B = /* @__PURE__ */ s(j, { align: t, children: /* @__PURE__ */ s(z, { asChild: !0, children: /* @__PURE__ */ s(
+    ), E = /* @__PURE__ */ s(z, { align: t, children: /* @__PURE__ */ s(L, { asChild: !0, children: /* @__PURE__ */ s(
       N,
       {
         "aria-label": x,
-        disabled: o,
+        disabled: i,
         size: "icon-sm",
         variant: "tertiary",
         children: n
       }
-    ) }) }), L = U ? /* @__PURE__ */ s(
-      b,
+    ) }) }), ne = X ? /* @__PURE__ */ s(
+      R,
       {
         "aria-label": e,
-        className: C(u.inputFlex, u.input),
+        ...T,
+        className: b(d.inputFlex, d.input),
         "data-testid": v,
-        disabled: o,
-        onBlur: X,
-        onChange: H.onChange,
+        disabled: i,
+        onBlur: $,
+        onChange: B.onChange,
         onFocus: O,
-        onKeyDown: $,
-        onPaste: Y,
-        ref: W,
-        value: H.value
+        onKeyDown: te,
+        onPaste: ee,
+        ref: Y,
+        value: B.value
       }
     ) : /* @__PURE__ */ s(
-      b,
+      R,
       {
         "aria-label": e,
-        className: C(u.inputFlex, u.input),
+        ...T,
+        className: b(d.inputFlex, d.input),
         "data-testid": v,
-        disabled: o,
+        disabled: i,
         onFocus: O,
         readOnly: !0,
-        value: I
+        value: M
       }
     );
-    return /* @__PURE__ */ s(te, { asChild: !0, children: /* @__PURE__ */ G(
-      P,
+    return /* @__PURE__ */ s(se, { asChild: !0, children: /* @__PURE__ */ G(
+      j,
       {
-        className: C(u.group, y),
+        className: b(d.group, k),
         "data-slot": "datetimepicker-input",
         [K]: "datetimepicker-input",
         ref: _,
         children: [
-          t === "start" && B,
-          L,
-          t === "end" && B
+          t === "start" && E,
+          ne,
+          t === "end" && E
         ]
       }
     ) });
   }
-), ke = r.forwardRef(function({
-  editable: q = !1,
-  iconPosition: o = "end",
+), xe = l.forwardRef(function({
+  editable: f = !1,
+  iconPosition: i = "end",
   placeholder: n = "dd/MM/yyyy HH:mm",
   inputAriaLabel: t = "change date and time",
   openPickerAriaLabel: e = "Open date picker",
   keyboardIcon: x,
   testId: v,
-  className: y,
+  className: k,
   disabled: _
-}, u) {
-  const h = J(), l = ae(), d = _ ?? l.disabled, T = x || /* @__PURE__ */ s(re, {});
-  if (q)
+}, d) {
+  const T = U(), y = Q(), o = re(), m = _ ?? o.disabled, g = x || /* @__PURE__ */ s(ie, {});
+  if (f)
     return /* @__PURE__ */ s(
-      ue,
+      pe,
       {
-        className: y,
-        ctx: l,
-        disabled: d,
-        icon: T,
-        iconPosition: o,
+        className: k,
+        ctx: o,
+        disabled: m,
+        icon: g,
+        iconPosition: i,
         inputAriaLabel: t,
         openPickerAriaLabel: e,
-        ref: u,
+        ref: d,
         testId: v
       }
     );
-  const p = /* @__PURE__ */ s(j, { align: o, children: /* @__PURE__ */ s(
+  const h = /* @__PURE__ */ s(z, { align: i, children: /* @__PURE__ */ s(
     N,
     {
       "aria-label": e,
-      disabled: d,
-      onClick: () => l.setIsOpen(!0),
+      disabled: m,
+      onClick: () => o.setIsOpen(!0),
       size: "icon-sm",
       variant: "tertiary",
-      children: T
+      children: g
     }
   ) });
   return /* @__PURE__ */ G(
-    P,
+    j,
     {
-      className: C(h.group, y),
+      className: b(T.group, k),
       "data-slot": "datetimepicker-input",
       [K]: "datetimepicker-input",
-      ref: u,
+      ref: d,
       children: [
-        o === "start" && p,
-        /* @__PURE__ */ s(z, { asChild: !0, children: /* @__PURE__ */ s(
-          b,
+        i === "start" && h,
+        /* @__PURE__ */ s(L, { asChild: !0, children: /* @__PURE__ */ s(
+          R,
           {
             "aria-label": t,
-            className: C(h.inputFlex, h.input),
+            ...y,
+            className: b(T.inputFlex, T.input),
             "data-testid": v,
-            disabled: d,
-            onBlur: l.handleInputBlur,
-            onChange: l.handleInputChange,
+            disabled: m,
+            onBlur: o.handleInputBlur,
+            onChange: o.handleInputChange,
             placeholder: n,
-            value: l.inputValue
+            value: o.inputValue
           }
         ) }),
-        o === "end" && p
+        i === "end" && h
       ]
     }
   );
 });
 export {
-  ke as DateTimePickerInput
+  xe as DateTimePickerInput,
+  ye as DateTimePickerLabelProvider
 };
 //# sourceMappingURL=date-time-picker-input.js.map

package/dist/components/date-time-picker/date-time-picker-input.js.map

@@ -1 +1 @@
-{"version":3,"file":"date-time-picker-input.js","sources":["../../../src/components/date-time-picker/date-time-picker-input.tsx"],"sourcesContent":["import * as React from \"react\"\nimport { useRifm } from \"rifm\"\nimport { mergeClasses } from \"@epilot/zenith-runtime/v1\"\n\nimport { Button } from \"../button/button\"\nimport { FieldGroupAddon, FieldInput, FieldInputGroup } from \"../field/field\"\nimport { PopoverAnchor, PopoverTrigger } from \"../popover/popover\"\nimport { SLOT_ATTR } from \"../../renderer/contract\"\nimport { makeZenithStyles } from \"../../styles/make-styles\"\n\nimport { useDateTimePickerContext } from \"./date-time-picker-context\"\nimport {\n  formatDateTimeDisplay,\n  parseDateTimeInput,\n} from \"./date-time-picker-utils\"\n\nconst CalendarIcon = (props: React.SVGProps<SVGSVGElement>) => (\n  <svg\n    xmlns=\"http://www.w3.org/2000/svg\"\n    height=\"18px\"\n    viewBox=\"0 -960 960 960\"\n    width=\"18px\"\n    fill=\"currentColor\"\n    {...props}\n  >\n    <path d=\"M200-80q-33 0-56.5-23.5T120-160v-560q0-33 23.5-56.5T200-800h40v-80h80v80h320v-80h80v80h40q33 0 56.5 23.5T840-720v560q0 33-23.5 56.5T760-80H200Zm0-80h560v-400H200v400Zm0-480h560v-80H200v80Zm0 0v-80 80Zm280 240q-17 0-28.5-11.5T440-440q0-17 11.5-28.5T480-480q17 0 28.5 11.5T520-440q0 17-11.5 28.5T480-400Zm-160 0q-17 0-28.5-11.5T280-440q0-17 11.5-28.5T320-480q17 0 28.5 11.5T360-440q0 17-11.5 28.5T320-400Zm320 0q-17 0-28.5-11.5T600-440q0-17 11.5-28.5T640-480q17 0 28.5 11.5T680-440q0 17-11.5 28.5T640-400ZM480-240q-17 0-28.5-11.5T440-280q0-17 11.5-28.5T480-320q17 0 28.5 11.5T520-280q0 17-11.5 28.5T480-240Zm-160 0q-17 0-28.5-11.5T280-280q0-17 11.5-28.5T320-320q17 0 28.5 11.5T360-280q0 17-11.5 28.5T320-240Zm320 0q-17 0-28.5-11.5T600-280q0-17 11.5-28.5T640-320q17 0 28.5 11.5T680-280q0 17-11.5 28.5T640-240Z\" />\n  </svg>\n)\n\nconst ACCEPT_DIGITS = /\\d/g\n\n// The mask always uses dots and colons regardless of the context format\nconst MASK_FORMAT_DATE = \"dd.MM.yyyy\"\nconst MASK_FORMAT_DATETIME = \"dd.MM.yyyy HH:mm\"\n\nconst createMaskFormatter = (isDateTime: boolean) => {\n  const maxDigits = isDateTime ? 12 : 8\n\n  return (str: string): string => {\n    const digits = str.replace(/\\D/g, \"\").slice(0, maxDigits)\n    let result = \"\"\n    let di = 0\n\n    result += (digits[di++] || \"_\") + (digits[di++] || \"_\")\n    result += \".\"\n    result += (digits[di++] || \"_\") + (digits[di++] || \"_\")\n    result += \".\"\n    result +=\n      (digits[di++] || \"_\") +\n      (digits[di++] || \"_\") +\n      (digits[di++] || \"_\") +\n      (digits[di++] || \"_\")\n\n    if (isDateTime) {\n      result += \" \"\n      result += (digits[di++] || \"_\") + (digits[di++] || \"_\")\n      result += \":\"\n      result += (digits[di++] || \"_\") + (digits[di++] || \"_\")\n    }\n\n    return result\n  }\n}\n\nexport type DateTimePickerInputProps = {\n  editable?: boolean\n  iconPosition?: \"start\" | \"end\"\n  placeholder?: string\n  inputAriaLabel?: string\n  openPickerAriaLabel?: string\n  keyboardIcon?: React.ReactNode\n  testId?: string\n  className?: string\n  disabled?: boolean\n}\n\nconst useStyles = makeZenithStyles({\n  group: {\n    width: \"100%\",\n  },\n  input: {\n    textAlign: \"left\",\n  },\n  inputFlex: {\n    flexGrow: 1,\n    flexShrink: 1,\n    flexBasis: \"0%\",\n  },\n})\n\n// Editable input with rifm masking — manages its own display value\ntype EditableInputProps = {\n  ctx: ReturnType<typeof useDateTimePickerContext>\n  disabled: boolean\n  icon: React.ReactNode\n  iconPosition: \"start\" | \"end\"\n  inputAriaLabel: string\n  openPickerAriaLabel: string\n  testId?: string\n  className?: string\n}\n\nconst EditableInput = React.forwardRef<HTMLDivElement, EditableInputProps>(\n  function EditableInput(\n    {\n      ctx,\n      disabled,\n      icon,\n      iconPosition,\n      inputAriaLabel,\n      openPickerAriaLabel,\n      testId,\n      className,\n    },\n    ref\n  ) {\n    const styles = useStyles()\n    const {\n      value,\n      format,\n      locale,\n      onChange,\n      onBlur,\n      setTempValue,\n      setInputValue,\n    } = ctx\n\n    const isDateTime = format.includes(\"HH:mm\")\n    const maskFormat = React.useMemo(\n      () => createMaskFormatter(isDateTime),\n      [isDateTime]\n    )\n    const maskParseFormat = isDateTime ? MASK_FORMAT_DATETIME : MASK_FORMAT_DATE\n\n    const displayValue = value\n      ? formatDateTimeDisplay(value, format, locale)\n      : \"\"\n\n    const [maskedValue, setMaskedValue] = React.useState(\"\")\n    const [focused, setFocused] = React.useState(false)\n    const inputRef = React.useRef<HTMLInputElement>(null)\n\n    // Callback ref: focus + position cursor when the Rifm input mounts\n    const rifmRefCallback = React.useCallback((el: HTMLInputElement | null) => {\n      inputRef.current = el\n      if (!el) return\n\n      el.focus()\n      const pos = el.value.indexOf(\"_\")\n\n      if (pos !== -1) {\n        el.setSelectionRange(pos, pos)\n      }\n    }, [])\n\n    const handleRifmChange = React.useCallback(\n      (val: string) => {\n        setMaskedValue(val)\n\n        // Position cursor at next empty placeholder after Rifm processes\n        requestAnimationFrame(() => {\n          const el = inputRef.current\n          if (!el) return\n\n          const pos = el.value.indexOf(\"_\")\n          const cursor = pos === -1 ? el.value.length : pos\n\n          el.setSelectionRange(cursor, cursor)\n        })\n\n        const digits = val.replace(/\\D/g, \"\")\n\n        if (digits.length === 0) {\n          onChange(null)\n          setTempValue(null)\n          setInputValue(\"\")\n\n          return\n        }\n\n        const parsed = parseDateTimeInput(val, maskParseFormat, locale)\n\n        if (parsed) {\n          onChange(parsed)\n          setTempValue(parsed)\n          setInputValue(formatDateTimeDisplay(parsed, format, locale))\n        }\n      },\n      [onChange, setTempValue, setInputValue, maskParseFormat, format, locale]\n    )\n\n    const rifm = useRifm({\n      accept: ACCEPT_DIGITS,\n      format: maskFormat,\n      mask: true,\n      onChange: handleRifmChange,\n      value: maskedValue,\n    })\n\n    const handleFocus = React.useCallback(() => {\n      setMaskedValue(maskFormat(displayValue))\n      setFocused(true)\n    }, [displayValue, maskFormat])\n\n    const handleBlur = React.useCallback(() => {\n      setFocused(false)\n      onBlur?.()\n    }, [onBlur])\n\n    const handlePaste = React.useCallback(\n      (e: React.ClipboardEvent<HTMLInputElement>) => {\n        // Always paste a date from the beginning, ignoring caret position.\n        e.preventDefault()\n        handleRifmChange(maskFormat(e.clipboardData.getData(\"text\")))\n      },\n      [handleRifmChange, maskFormat]\n    )\n\n    const handleKeyDown = React.useCallback(\n      (e: React.KeyboardEvent<HTMLInputElement>) => {\n        // On Backspace, skip the caret back over mask separators (\".\", \":\", \" \")\n        if (e.key !== \"Backspace\") return\n\n        const el = e.currentTarget\n        const { selectionStart, selectionEnd } = el\n\n        if (selectionStart === null || selectionStart !== selectionEnd) return\n\n        let pos = selectionStart\n\n        while (pos > 0 && !/[\\d_]/.test(el.value[pos - 1])) {\n          pos--\n        }\n\n        if (pos !== selectionStart) {\n          el.setSelectionRange(pos, pos)\n        }\n      },\n      []\n    )\n\n    const iconAddon = (\n      <FieldGroupAddon align={iconPosition}>\n        <PopoverTrigger asChild>\n          <Button\n            aria-label={openPickerAriaLabel}\n            disabled={disabled}\n            size=\"icon-sm\"\n            variant=\"tertiary\"\n          >\n            {icon}\n          </Button>\n        </PopoverTrigger>\n      </FieldGroupAddon>\n    )\n\n    const input = focused ? (\n      <FieldInput\n        aria-label={inputAriaLabel}\n        className={mergeClasses(styles.inputFlex, styles.input)}\n        data-testid={testId}\n        disabled={disabled}\n        onBlur={handleBlur}\n        onChange={rifm.onChange}\n        onFocus={handleFocus}\n        onKeyDown={handleKeyDown}\n        onPaste={handlePaste}\n        ref={rifmRefCallback}\n        value={rifm.value}\n      />\n    ) : (\n      <FieldInput\n        aria-label={inputAriaLabel}\n        className={mergeClasses(styles.inputFlex, styles.input)}\n        data-testid={testId}\n        disabled={disabled}\n        onFocus={handleFocus}\n        readOnly\n        value={displayValue}\n      />\n    )\n\n    return (\n      <PopoverAnchor asChild>\n        <FieldInputGroup\n          className={mergeClasses(styles.group, className)}\n          data-slot=\"datetimepicker-input\"\n          {...{ [SLOT_ATTR]: \"datetimepicker-input\" }}\n          ref={ref}\n        >\n          {iconPosition === \"start\" && iconAddon}\n          {input}\n          {iconPosition === \"end\" && iconAddon}\n        </FieldInputGroup>\n      </PopoverAnchor>\n    )\n  }\n)\n\nexport const DateTimePickerInput = React.forwardRef<\n  HTMLDivElement,\n  DateTimePickerInputProps\n>(function DateTimePickerInput(\n  {\n    editable = false,\n    iconPosition = \"end\",\n    placeholder = \"dd/MM/yyyy HH:mm\",\n    inputAriaLabel = \"change date and time\",\n    openPickerAriaLabel = \"Open date picker\",\n    keyboardIcon,\n    testId,\n    className,\n    disabled: disabledProp,\n  },\n  ref\n) {\n  const styles = useStyles()\n  const ctx = useDateTimePickerContext()\n  const disabled = disabledProp ?? ctx.disabled\n\n  const IconComponent = keyboardIcon || <CalendarIcon />\n\n  if (editable) {\n    return (\n      <EditableInput\n        className={className}\n        ctx={ctx}\n        disabled={disabled}\n        icon={IconComponent}\n        iconPosition={iconPosition}\n        inputAriaLabel={inputAriaLabel}\n        openPickerAriaLabel={openPickerAriaLabel}\n        ref={ref}\n        testId={testId}\n      />\n    )\n  }\n\n  const iconAddon = (\n    <FieldGroupAddon align={iconPosition}>\n      <Button\n        aria-label={openPickerAriaLabel}\n        disabled={disabled}\n        onClick={() => ctx.setIsOpen(true)}\n        size=\"icon-sm\"\n        variant=\"tertiary\"\n      >\n        {IconComponent}\n      </Button>\n    </FieldGroupAddon>\n  )\n\n  return (\n    <FieldInputGroup\n      className={mergeClasses(styles.group, className)}\n      data-slot=\"datetimepicker-input\"\n      {...{ [SLOT_ATTR]: \"datetimepicker-input\" }}\n      ref={ref}\n    >\n      {iconPosition === \"start\" && iconAddon}\n      <PopoverTrigger asChild>\n        <FieldInput\n          aria-label={inputAriaLabel}\n          className={mergeClasses(styles.inputFlex, styles.input)}\n          data-testid={testId}\n          disabled={disabled}\n          onBlur={ctx.handleInputBlur}\n          onChange={ctx.handleInputChange}\n          placeholder={placeholder}\n          value={ctx.inputValue}\n        />\n      </PopoverTrigger>\n      {iconPosition === \"end\" && iconAddon}\n    </FieldInputGroup>\n  )\n})\n"],"names":["CalendarIcon","props","jsx","ACCEPT_DIGITS","MASK_FORMAT_DATE","MASK_FORMAT_DATETIME","createMaskFormatter","isDateTime","maxDigits","str","digits","result","di","useStyles","makeZenithStyles","EditableInput","React","ctx","disabled","icon","iconPosition","inputAriaLabel","openPickerAriaLabel","testId","className","ref","styles","value","format","locale","onChange","onBlur","setTempValue","setInputValue","maskFormat","maskParseFormat","displayValue","formatDateTimeDisplay","maskedValue","setMaskedValue","focused","setFocused","inputRef","rifmRefCallback","el","pos","handleRifmChange","val","cursor","parsed","parseDateTimeInput","rifm","useRifm","handleFocus","handleBlur","handlePaste","e","handleKeyDown","selectionStart","selectionEnd","iconAddon","FieldGroupAddon","PopoverTrigger","Button","input","FieldInput","mergeClasses","PopoverAnchor","jsxs","FieldInputGroup","SLOT_ATTR","DateTimePickerInput","editable","placeholder","keyboardIcon","disabledProp","useDateTimePickerContext","IconComponent"],"mappings":"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"}
+{"version":3,"file":"date-time-picker-input.js","sources":["../../../src/components/date-time-picker/date-time-picker-input.tsx"],"sourcesContent":["import * as React from \"react\"\nimport { useRifm } from \"rifm\"\nimport { mergeClasses } from \"@epilot/zenith-runtime/v1\"\n\nimport { Button } from \"../button/button\"\nimport { FieldGroupAddon, FieldInput, FieldInputGroup } from \"../field/field\"\nimport { PopoverAnchor, PopoverTrigger } from \"../popover/popover\"\nimport { SLOT_ATTR } from \"../../renderer/contract\"\nimport { makeZenithStyles } from \"../../styles/make-styles\"\n\nimport { useDateTimePickerContext } from \"./date-time-picker-context\"\nimport {\n  formatDateTimeDisplay,\n  parseDateTimeInput,\n} from \"./date-time-picker-utils\"\n\nconst CalendarIcon = (props: React.SVGProps<SVGSVGElement>) => (\n  <svg\n    xmlns=\"http://www.w3.org/2000/svg\"\n    height=\"18px\"\n    viewBox=\"0 -960 960 960\"\n    width=\"18px\"\n    fill=\"currentColor\"\n    {...props}\n  >\n    <path d=\"M200-80q-33 0-56.5-23.5T120-160v-560q0-33 23.5-56.5T200-800h40v-80h80v80h320v-80h80v80h40q33 0 56.5 23.5T840-720v560q0 33-23.5 56.5T760-80H200Zm0-80h560v-400H200v400Zm0-480h560v-80H200v80Zm0 0v-80 80Zm280 240q-17 0-28.5-11.5T440-440q0-17 11.5-28.5T480-480q17 0 28.5 11.5T520-440q0 17-11.5 28.5T480-400Zm-160 0q-17 0-28.5-11.5T280-440q0-17 11.5-28.5T320-480q17 0 28.5 11.5T360-440q0 17-11.5 28.5T320-400Zm320 0q-17 0-28.5-11.5T600-440q0-17 11.5-28.5T640-480q17 0 28.5 11.5T680-440q0 17-11.5 28.5T640-400ZM480-240q-17 0-28.5-11.5T440-280q0-17 11.5-28.5T480-320q17 0 28.5 11.5T520-280q0 17-11.5 28.5T480-240Zm-160 0q-17 0-28.5-11.5T280-280q0-17 11.5-28.5T320-320q17 0 28.5 11.5T360-280q0 17-11.5 28.5T320-240Zm320 0q-17 0-28.5-11.5T600-280q0-17 11.5-28.5T640-320q17 0 28.5 11.5T680-280q0 17-11.5 28.5T640-240Z\" />\n  </svg>\n)\n\nconst ACCEPT_DIGITS = /\\d/g\n\n// The mask always uses dots and colons regardless of the context format\nconst MASK_FORMAT_DATE = \"dd.MM.yyyy\"\nconst MASK_FORMAT_DATETIME = \"dd.MM.yyyy HH:mm\"\n\nconst createMaskFormatter = (isDateTime: boolean) => {\n  const maxDigits = isDateTime ? 12 : 8\n\n  return (str: string): string => {\n    const digits = str.replace(/\\D/g, \"\").slice(0, maxDigits)\n    let result = \"\"\n    let di = 0\n\n    result += (digits[di++] || \"_\") + (digits[di++] || \"_\")\n    result += \".\"\n    result += (digits[di++] || \"_\") + (digits[di++] || \"_\")\n    result += \".\"\n    result +=\n      (digits[di++] || \"_\") +\n      (digits[di++] || \"_\") +\n      (digits[di++] || \"_\") +\n      (digits[di++] || \"_\")\n\n    if (isDateTime) {\n      result += \" \"\n      result += (digits[di++] || \"_\") + (digits[di++] || \"_\")\n      result += \":\"\n      result += (digits[di++] || \"_\") + (digits[di++] || \"_\")\n    }\n\n    return result\n  }\n}\n\ntype DateTimePickerLabelling = {\n  inputId: string\n  labelId: string\n  /** The visible label names the input; false when the caller passed `inputAriaLabel`. */\n  namedByLabel: boolean\n}\n\nconst LabelContext = React.createContext<DateTimePickerLabelling | null>(null)\n\n/**\n * Set by `DateTimePicker`, which renders both the visible label and this input, so it can connect\n * them. Not exported from the package: composed usages wire their own label.\n *\n * @no-host-element context provider; renders only its children.\n */\nexport const DateTimePickerLabelProvider = ({\n  value,\n  children,\n}: {\n  value: DateTimePickerLabelling | null\n  children: React.ReactNode\n}) => <LabelContext.Provider value={value}>{children}</LabelContext.Provider>\n\n/** `id` and `aria-labelledby` for the input, when a `DateTimePicker` label is connected to it. */\nconst useLabelAttributes = () => {\n  const labelling = React.useContext(LabelContext)\n  return labelling === null\n    ? {}\n    : {\n        id: labelling.inputId,\n        ...(labelling.namedByLabel\n          ? { \"aria-labelledby\": labelling.labelId }\n          : {}),\n      }\n}\n\nexport type DateTimePickerInputProps = {\n  editable?: boolean\n  iconPosition?: \"start\" | \"end\"\n  placeholder?: string\n  inputAriaLabel?: string\n  openPickerAriaLabel?: string\n  keyboardIcon?: React.ReactNode\n  testId?: string\n  className?: string\n  disabled?: boolean\n}\n\nconst useStyles = makeZenithStyles({\n  group: {\n    width: \"100%\",\n  },\n  input: {\n    textAlign: \"left\",\n  },\n  inputFlex: {\n    flexGrow: 1,\n    flexShrink: 1,\n    flexBasis: \"0%\",\n  },\n})\n\n// Editable input with rifm masking — manages its own display value\ntype EditableInputProps = {\n  ctx: ReturnType<typeof useDateTimePickerContext>\n  disabled: boolean\n  icon: React.ReactNode\n  iconPosition: \"start\" | \"end\"\n  inputAriaLabel: string\n  openPickerAriaLabel: string\n  testId?: string\n  className?: string\n}\n\nconst EditableInput = React.forwardRef<HTMLDivElement, EditableInputProps>(\n  function EditableInput(\n    {\n      ctx,\n      disabled,\n      icon,\n      iconPosition,\n      inputAriaLabel,\n      openPickerAriaLabel,\n      testId,\n      className,\n    },\n    ref\n  ) {\n    const styles = useStyles()\n    const labelAttributes = useLabelAttributes()\n    const {\n      value,\n      format,\n      locale,\n      onChange,\n      onBlur,\n      setTempValue,\n      setInputValue,\n    } = ctx\n\n    const isDateTime = format.includes(\"HH:mm\")\n    const maskFormat = React.useMemo(\n      () => createMaskFormatter(isDateTime),\n      [isDateTime]\n    )\n    const maskParseFormat = isDateTime ? MASK_FORMAT_DATETIME : MASK_FORMAT_DATE\n\n    const displayValue = value\n      ? formatDateTimeDisplay(value, format, locale)\n      : \"\"\n\n    const [maskedValue, setMaskedValue] = React.useState(\"\")\n    const [focused, setFocused] = React.useState(false)\n    const inputRef = React.useRef<HTMLInputElement>(null)\n\n    // Callback ref: focus + position cursor when the Rifm input mounts\n    const rifmRefCallback = React.useCallback((el: HTMLInputElement | null) => {\n      inputRef.current = el\n      if (!el) return\n\n      el.focus()\n      const pos = el.value.indexOf(\"_\")\n\n      if (pos !== -1) {\n        el.setSelectionRange(pos, pos)\n      }\n    }, [])\n\n    const handleRifmChange = React.useCallback(\n      (val: string) => {\n        setMaskedValue(val)\n\n        // Position cursor at next empty placeholder after Rifm processes\n        requestAnimationFrame(() => {\n          const el = inputRef.current\n          if (!el) return\n\n          const pos = el.value.indexOf(\"_\")\n          const cursor = pos === -1 ? el.value.length : pos\n\n          el.setSelectionRange(cursor, cursor)\n        })\n\n        const digits = val.replace(/\\D/g, \"\")\n\n        if (digits.length === 0) {\n          onChange(null)\n          setTempValue(null)\n          setInputValue(\"\")\n\n          return\n        }\n\n        const parsed = parseDateTimeInput(val, maskParseFormat, locale)\n\n        if (parsed) {\n          onChange(parsed)\n          setTempValue(parsed)\n          setInputValue(formatDateTimeDisplay(parsed, format, locale))\n        }\n      },\n      [onChange, setTempValue, setInputValue, maskParseFormat, format, locale]\n    )\n\n    const rifm = useRifm({\n      accept: ACCEPT_DIGITS,\n      format: maskFormat,\n      mask: true,\n      onChange: handleRifmChange,\n      value: maskedValue,\n    })\n\n    const handleFocus = React.useCallback(() => {\n      setMaskedValue(maskFormat(displayValue))\n      setFocused(true)\n    }, [displayValue, maskFormat])\n\n    const handleBlur = React.useCallback(() => {\n      setFocused(false)\n      onBlur?.()\n    }, [onBlur])\n\n    const handlePaste = React.useCallback(\n      (e: React.ClipboardEvent<HTMLInputElement>) => {\n        // Always paste a date from the beginning, ignoring caret position.\n        e.preventDefault()\n        handleRifmChange(maskFormat(e.clipboardData.getData(\"text\")))\n      },\n      [handleRifmChange, maskFormat]\n    )\n\n    const handleKeyDown = React.useCallback(\n      (e: React.KeyboardEvent<HTMLInputElement>) => {\n        // On Backspace, skip the caret back over mask separators (\".\", \":\", \" \")\n        if (e.key !== \"Backspace\") return\n\n        const el = e.currentTarget\n        const { selectionStart, selectionEnd } = el\n\n        if (selectionStart === null || selectionStart !== selectionEnd) return\n\n        let pos = selectionStart\n\n        while (pos > 0 && !/[\\d_]/.test(el.value[pos - 1])) {\n          pos--\n        }\n\n        if (pos !== selectionStart) {\n          el.setSelectionRange(pos, pos)\n        }\n      },\n      []\n    )\n\n    const iconAddon = (\n      <FieldGroupAddon align={iconPosition}>\n        <PopoverTrigger asChild>\n          <Button\n            aria-label={openPickerAriaLabel}\n            disabled={disabled}\n            size=\"icon-sm\"\n            variant=\"tertiary\"\n          >\n            {icon}\n          </Button>\n        </PopoverTrigger>\n      </FieldGroupAddon>\n    )\n\n    const input = focused ? (\n      <FieldInput\n        aria-label={inputAriaLabel}\n        {...labelAttributes}\n        className={mergeClasses(styles.inputFlex, styles.input)}\n        data-testid={testId}\n        disabled={disabled}\n        onBlur={handleBlur}\n        onChange={rifm.onChange}\n        onFocus={handleFocus}\n        onKeyDown={handleKeyDown}\n        onPaste={handlePaste}\n        ref={rifmRefCallback}\n        value={rifm.value}\n      />\n    ) : (\n      <FieldInput\n        aria-label={inputAriaLabel}\n        {...labelAttributes}\n        className={mergeClasses(styles.inputFlex, styles.input)}\n        data-testid={testId}\n        disabled={disabled}\n        onFocus={handleFocus}\n        readOnly\n        value={displayValue}\n      />\n    )\n\n    return (\n      <PopoverAnchor asChild>\n        <FieldInputGroup\n          className={mergeClasses(styles.group, className)}\n          data-slot=\"datetimepicker-input\"\n          {...{ [SLOT_ATTR]: \"datetimepicker-input\" }}\n          ref={ref}\n        >\n          {iconPosition === \"start\" && iconAddon}\n          {input}\n          {iconPosition === \"end\" && iconAddon}\n        </FieldInputGroup>\n      </PopoverAnchor>\n    )\n  }\n)\n\nexport const DateTimePickerInput = React.forwardRef<\n  HTMLDivElement,\n  DateTimePickerInputProps\n>(function DateTimePickerInput(\n  {\n    editable = false,\n    iconPosition = \"end\",\n    placeholder = \"dd/MM/yyyy HH:mm\",\n    inputAriaLabel = \"change date and time\",\n    openPickerAriaLabel = \"Open date picker\",\n    keyboardIcon,\n    testId,\n    className,\n    disabled: disabledProp,\n  },\n  ref\n) {\n  const styles = useStyles()\n  const labelAttributes = useLabelAttributes()\n  const ctx = useDateTimePickerContext()\n  const disabled = disabledProp ?? ctx.disabled\n\n  const IconComponent = keyboardIcon || <CalendarIcon />\n\n  if (editable) {\n    return (\n      <EditableInput\n        className={className}\n        ctx={ctx}\n        disabled={disabled}\n        icon={IconComponent}\n        iconPosition={iconPosition}\n        inputAriaLabel={inputAriaLabel}\n        openPickerAriaLabel={openPickerAriaLabel}\n        ref={ref}\n        testId={testId}\n      />\n    )\n  }\n\n  const iconAddon = (\n    <FieldGroupAddon align={iconPosition}>\n      <Button\n        aria-label={openPickerAriaLabel}\n        disabled={disabled}\n        onClick={() => ctx.setIsOpen(true)}\n        size=\"icon-sm\"\n        variant=\"tertiary\"\n      >\n        {IconComponent}\n      </Button>\n    </FieldGroupAddon>\n  )\n\n  return (\n    <FieldInputGroup\n      className={mergeClasses(styles.group, className)}\n      data-slot=\"datetimepicker-input\"\n      {...{ [SLOT_ATTR]: \"datetimepicker-input\" }}\n      ref={ref}\n    >\n      {iconPosition === \"start\" && iconAddon}\n      <PopoverTrigger asChild>\n        <FieldInput\n          aria-label={inputAriaLabel}\n          {...labelAttributes}\n          className={mergeClasses(styles.inputFlex, styles.input)}\n          data-testid={testId}\n          disabled={disabled}\n          onBlur={ctx.handleInputBlur}\n          onChange={ctx.handleInputChange}\n          placeholder={placeholder}\n          value={ctx.inputValue}\n        />\n      </PopoverTrigger>\n      {iconPosition === \"end\" && iconAddon}\n    </FieldInputGroup>\n  )\n})\n"],"names":["CalendarIcon","props","jsx","ACCEPT_DIGITS","MASK_FORMAT_DATE","MASK_FORMAT_DATETIME","createMaskFormatter","isDateTime","maxDigits","str","digits","result","di","LabelContext","React","DateTimePickerLabelProvider","value","children","useLabelAttributes","labelling","useStyles","makeZenithStyles","EditableInput","ctx","disabled","icon","iconPosition","inputAriaLabel","openPickerAriaLabel","testId","className","ref","styles","labelAttributes","format","locale","onChange","onBlur","setTempValue","setInputValue","maskFormat","maskParseFormat","displayValue","formatDateTimeDisplay","maskedValue","setMaskedValue","focused","setFocused","inputRef","rifmRefCallback","el","pos","handleRifmChange","val","cursor","parsed","parseDateTimeInput","rifm","useRifm","handleFocus","handleBlur","handlePaste","e","handleKeyDown","selectionStart","selectionEnd","iconAddon","FieldGroupAddon","PopoverTrigger","Button","input","FieldInput","mergeClasses","PopoverAnchor","jsxs","FieldInputGroup","SLOT_ATTR","DateTimePickerInput","editable","placeholder","keyboardIcon","disabledProp","useDateTimePickerContext","IconComponent"],"mappings":"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"}