@epilot/volt-ui-experimental-griffel 0.2.3 → 0.3.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/volt-ui-runtime\"\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 { makeVoltStyles } 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 = makeVoltStyles({\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\n   * `icon-sm` size classes do not reach this button, so v1 renders it content-sized at 18x18 around\n   * an unconstrained 18px icon rather than the 28x28-with-14px-icon that `icon-sm` specifies.\n   * Standalone, both arms render 28x28 — see the `button/size-icon-sm` specimen.\n   *\n   * Rule 0 targets v1's OUTPUT, and here the output is what consumers lay out against: matching\n   * `icon-sm` instead makes every date field 4px taller. So the size is released back to the content\n   * and the icon left unconstrained, which is v1's mechanism and not just its numbers.\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\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\n      setTimeout(() => {\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","makeVoltStyles","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","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/volt-ui-runtime\"\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 { makeVoltStyles } 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 = makeVoltStyles({\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\n   * `icon-sm` size classes do not reach this button, so v1 renders it content-sized at 18x18 around\n   * an unconstrained 18px icon rather than the 28x28-with-14px-icon that `icon-sm` specifies.\n   * Standalone, both arms render 28x28 — see the `button/size-icon-sm` specimen.\n   *\n   * Rule 0 targets v1's OUTPUT, and here the output is what consumers lay out against: matching\n   * `icon-sm` instead makes every date field 4px taller. So the size is released back to the content\n   * and the icon left unconstrained, which is v1's mechanism and not just its numbers.\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\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\n      setTimeout(() => {\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","jsxDEV","this","DEFAULT_FORMAT","useStyles","makeVoltStyles","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","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","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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"}

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

@@ -1,20 +1,20 @@
-import { jsxs as L, jsx as l } from "react/jsx-runtime";
+import { j as s } from "../../vendor/react/jsx-dev-runtime.js";
 import * as e from "react";
-import { shorthands as b } from "../../packages/volt-runtime/dist/vendor/@griffel/core/src/index.js";
-import { SLOT_ATTR as h } from "../../packages/volt-runtime/dist/renderer/contract.js";
-import { mergeClasses as z } from "../../packages/volt-runtime/dist/vendor/@griffel/core/src/mergeClasses.js";
-import { Calendar as M } from "../date-time-picker/calendar.js";
-import { makeVoltStyles as A } from "../../styles/make-styles.js";
-import { spacingLayout1 as Q } from "../../tokens/index.js";
-import { normalizeRange as T } from "../date-time-picker/date-time-picker-utils.js";
-import { startOfDay as N } from "../../vendor/date-fns/startOfDay.js";
-import { addMonths as _ } from "../../vendor/date-fns/addMonths.js";
-import { subMonths as q } from "../../vendor/date-fns/subMonths.js";
-const F = A({
+import { shorthands as P } from "../../packages/volt-runtime/dist/vendor/@griffel/core/src/index.js";
+import { SLOT_ATTR as u } from "../../packages/volt-runtime/dist/renderer/contract.js";
+import { mergeClasses as B } from "../../packages/volt-runtime/dist/vendor/@griffel/core/src/mergeClasses.js";
+import { Calendar as C } from "../date-time-picker/calendar.js";
+import { makeVoltStyles as L } from "../../styles/make-styles.js";
+import { spacingLayout1 as z } from "../../tokens/index.js";
+import { normalizeRange as A } from "../date-time-picker/date-time-picker-utils.js";
+import { startOfDay as j } from "../../vendor/date-fns/startOfDay.js";
+import { addMonths as Q } from "../../vendor/date-fns/addMonths.js";
+import { subMonths as T } from "../../vendor/date-fns/subMonths.js";
+const _ = L({
   root: {
     display: "flex",
     flexDirection: "row",
-    ...b.gap(Q)
+    ...P.gap(z)
     // v1 gap-6 (1.5rem)
   },
   panel: {
@@ -22,119 +22,159 @@ const F = A({
     flexShrink: 0
   }
 }), ae = e.forwardRef(function({
-  value: t,
+  value: a,
   onChange: i,
-  onRangeComplete: s,
-  disablePast: D = !1,
-  locale: u = "de",
-  previousMonthLabel: g = "Previous month",
-  nextMonthLabel: p = "Next month",
-  currentTimeInTimezone: w,
-  showWeekNumbers: y = !1,
-  className: R
-}, P) {
-  const d = F(), [c, S] = e.useState(() => t.start ? N(t.start) : N(/* @__PURE__ */ new Date())), [n, C] = e.useState("idle"), [r, f] = e.useState(t.start), [V, m] = e.useState(t.end), [k, x] = e.useState(null);
+  onRangeComplete: n,
+  disablePast: p = !1,
+  locale: g = "de",
+  previousMonthLabel: h = "Previous month",
+  nextMonthLabel: D = "Next month",
+  currentTimeInTimezone: x,
+  showWeekNumbers: w = !1,
+  className: O
+}, R) {
+  const c = _(), [m, N] = e.useState(() => a.start ? j(a.start) : j(/* @__PURE__ */ new Date())), [r, k] = e.useState("idle"), [l, d] = e.useState(a.start), [V, f] = e.useState(a.end), [y, v] = e.useState(null);
   e.useEffect(() => {
-    n === "idle" && (f(t.start), m(t.end));
-  }, [t.start, t.end, n]);
-  const j = e.useMemo(
-    () => _(c, 1),
-    [c]
-  ), O = e.useCallback(
-    (a) => {
-      if (n === "idle")
-        f(a), m(null), C("selectingEnd"), i({ start: a, end: null });
+    r === "idle" && (d(a.start), f(a.end));
+  }, [a.start, a.end, r]);
+  const U = e.useMemo(
+    () => Q(m, 1),
+    [m]
+  ), S = e.useCallback(
+    (t) => {
+      if (r === "idle")
+        d(t), f(null), k("selectingEnd"), i({ start: t, end: null });
       else {
-        const o = T(r, a);
-        f(o.start), m(o.end), C("idle"), x(null), i(o), s == null || s(o);
+        const o = A(l, t);
+        d(o.start), f(o.end), k("idle"), v(null), i(o), n == null || n(o);
       }
     },
-    [n, r, i, s]
-  ), E = e.useCallback(
-    (a) => {
-      n === "selectingEnd" && x(a);
+    [r, l, i, n]
+  ), b = e.useCallback(
+    (t) => {
+      r === "selectingEnd" && v(t);
     },
-    [n]
-  ), v = e.useCallback((a) => {
-    S(a);
-  }, []), B = e.useCallback((a) => {
-    S(q(a));
-  }, []), H = e.useMemo(
-    () => t.start || /* @__PURE__ */ new Date(),
-    [t.start]
+    [r]
+  ), H = e.useCallback((t) => {
+    N(t);
+  }, []), M = e.useCallback((t) => {
+    N(T(t));
+  }, []), E = e.useMemo(
+    () => a.start || /* @__PURE__ */ new Date(),
+    [a.start]
   );
-  return /* @__PURE__ */ L(
+  return /* @__PURE__ */ s.jsxDEV(
     "div",
     {
-      className: z(d.root, R),
+      className: B(c.root, O),
       "data-slot": "range-calendar",
-      [h]: "range-calendar",
-      ref: P,
+      [u]: "range-calendar",
+      ref: R,
       children: [
-        /* @__PURE__ */ l(
+        /* @__PURE__ */ s.jsxDEV(
           "div",
           {
-            className: d.panel,
+            className: c.panel,
             "data-slot": "range-calendar-panel",
-            [h]: "range-calendar-panel",
-            children: /* @__PURE__ */ l(
-              M,
+            [u]: "range-calendar-panel",
+            children: /* @__PURE__ */ s.jsxDEV(
+              C,
               {
-                controlledViewDate: c,
-                currentTimeInTimezone: w,
-                disablePast: D,
+                controlledViewDate: m,
+                currentTimeInTimezone: x,
+                disablePast: p,
                 hideOutOfMonthDays: !0,
-                hoveredDate: k,
-                locale: u,
-                nextMonthLabel: p,
+                hoveredDate: y,
+                locale: g,
+                nextMonthLabel: D,
                 onChange: () => {
                 },
-                onDayClick: O,
-                onDayHover: E,
-                onViewDateChange: v,
-                previousMonthLabel: g,
+                onDayClick: S,
+                onDayHover: b,
+                onViewDateChange: H,
+                previousMonthLabel: h,
                 rangeEnd: V,
-                rangeStart: r,
+                rangeStart: l,
                 showNextButton: !1,
-                showWeekNumbers: y,
-                value: H
-              }
+                showWeekNumbers: w,
+                value: E
+              },
+              void 0,
+              !1,
+              {
+                fileName: "/Users/wilianmolinari/repos/volt-ui-rollout/release/packages/experimental-griffel/src/components/date-range-picker/range-calendar.tsx",
+                lineNumber: 145,
+                columnNumber: 9
+              },
+              this
             )
-          }
+          },
+          void 0,
+          !1,
+          {
+            fileName: "/Users/wilianmolinari/repos/volt-ui-rollout/release/packages/experimental-griffel/src/components/date-range-picker/range-calendar.tsx",
+            lineNumber: 140,
+            columnNumber: 7
+          },
+          this
         ),
-        /* @__PURE__ */ l(
+        /* @__PURE__ */ s.jsxDEV(
           "div",
           {
-            className: d.panel,
+            className: c.panel,
             "data-slot": "range-calendar-panel",
-            [h]: "range-calendar-panel",
-            children: /* @__PURE__ */ l(
-              M,
+            [u]: "range-calendar-panel",
+            children: /* @__PURE__ */ s.jsxDEV(
+              C,
               {
-                controlledViewDate: j,
-                currentTimeInTimezone: w,
-                disablePast: D,
+                controlledViewDate: U,
+                currentTimeInTimezone: x,
+                disablePast: p,
                 hideOutOfMonthDays: !0,
-                hoveredDate: k,
-                locale: u,
-                nextMonthLabel: p,
+                hoveredDate: y,
+                locale: g,
+                nextMonthLabel: D,
                 onChange: () => {
                 },
-                onDayClick: O,
-                onDayHover: E,
-                onViewDateChange: B,
-                previousMonthLabel: g,
+                onDayClick: S,
+                onDayHover: b,
+                onViewDateChange: M,
+                previousMonthLabel: h,
                 rangeEnd: V,
-                rangeStart: r,
+                rangeStart: l,
                 showPreviousButton: !1,
-                showWeekNumbers: y,
-                value: H
-              }
+                showWeekNumbers: w,
+                value: E
+              },
+              void 0,
+              !1,
+              {
+                fileName: "/Users/wilianmolinari/repos/volt-ui-rollout/release/packages/experimental-griffel/src/components/date-range-picker/range-calendar.tsx",
+                lineNumber: 172,
+                columnNumber: 9
+              },
+              this
             )
-          }
+          },
+          void 0,
+          !1,
+          {
+            fileName: "/Users/wilianmolinari/repos/volt-ui-rollout/release/packages/experimental-griffel/src/components/date-range-picker/range-calendar.tsx",
+            lineNumber: 167,
+            columnNumber: 7
+          },
+          this
         )
       ]
-    }
+    },
+    void 0,
+    !0,
+    {
+      fileName: "/Users/wilianmolinari/repos/volt-ui-rollout/release/packages/experimental-griffel/src/components/date-range-picker/range-calendar.tsx",
+      lineNumber: 133,
+      columnNumber: 5
+    },
+    this
   );
 });
 export {

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

@@ -1 +1 @@
-{"version":3,"file":"range-calendar.js","sources":["../../../src/components/date-range-picker/range-calendar.tsx"],"sourcesContent":["import * as React from \"react\"\nimport { addMonths, subMonths, startOfDay } from \"date-fns\"\nimport { mergeClasses, shorthands } from \"@epilot/volt-ui-runtime\"\n\nimport { Calendar } from \"../date-time-picker/calendar\"\nimport { SLOT_ATTR } from \"../../renderer/contract\"\nimport { makeVoltStyles } from \"../../styles/make-styles\"\nimport * as tokens from \"../../tokens\"\n\nimport type { DateRange, DateTimePickerLocale } from \"./date-range-picker-utils\"\nimport { normalizeRange } from \"./date-range-picker-utils\"\n\ntype SelectionPhase = \"idle\" | \"selectingEnd\"\n\nexport type RangeCalendarProps = {\n  value: DateRange\n  onChange: (range: DateRange) => void\n  onRangeComplete?: (range: DateRange) => void\n  disablePast?: boolean\n  locale?: DateTimePickerLocale\n  previousMonthLabel?: string\n  nextMonthLabel?: string\n  currentTimeInTimezone?: Date\n  showWeekNumbers?: boolean\n  className?: string\n}\n\nconst useStyles = makeVoltStyles({\n  root: {\n    display: \"flex\",\n    flexDirection: \"row\",\n    ...shorthands.gap(tokens.spacingLayout1), // v1 gap-6 (1.5rem)\n  },\n  panel: {\n    width: \"280px\",\n    flexShrink: 0,\n  },\n})\n\nexport const RangeCalendar = React.forwardRef<\n  HTMLDivElement,\n  RangeCalendarProps\n>(function RangeCalendar(\n  {\n    value,\n    onChange,\n    onRangeComplete,\n    disablePast = false,\n    locale = \"de\",\n    previousMonthLabel = \"Previous month\",\n    nextMonthLabel = \"Next month\",\n    currentTimeInTimezone,\n    showWeekNumbers = false,\n    className,\n  },\n  ref\n) {\n  const styles = useStyles()\n  const [leftViewDate, setLeftViewDate] = React.useState(() => {\n    if (value.start) return startOfDay(value.start)\n\n    return startOfDay(new Date())\n  })\n\n  const [selectionPhase, setSelectionPhase] =\n    React.useState<SelectionPhase>(\"idle\")\n  const [rangeStart, setRangeStart] = React.useState<Date | null>(value.start)\n  const [rangeEnd, setRangeEnd] = React.useState<Date | null>(value.end)\n  const [hoveredDate, setHoveredDate] = React.useState<Date | null>(null)\n\n  React.useEffect(() => {\n    if (selectionPhase === \"idle\") {\n      setRangeStart(value.start)\n      setRangeEnd(value.end)\n    }\n  }, [value.start, value.end, selectionPhase])\n\n  const rightViewDate = React.useMemo(\n    () => addMonths(leftViewDate, 1),\n    [leftViewDate]\n  )\n\n  // Shared day click handler (range state machine)\n  const handleDayClick = React.useCallback(\n    (day: Date) => {\n      if (selectionPhase === \"idle\") {\n        setRangeStart(day)\n        setRangeEnd(null)\n        setSelectionPhase(\"selectingEnd\")\n        onChange({ start: day, end: null })\n      } else {\n        const normalized = normalizeRange(rangeStart!, day)\n\n        setRangeStart(normalized.start)\n        setRangeEnd(normalized.end)\n        setSelectionPhase(\"idle\")\n        setHoveredDate(null)\n        onChange(normalized)\n        onRangeComplete?.(normalized)\n      }\n    },\n    [selectionPhase, rangeStart, onChange, onRangeComplete]\n  )\n\n  // Shared hover handler\n  const handleDayHover = React.useCallback(\n    (day: Date | null) => {\n      if (selectionPhase === \"selectingEnd\") {\n        setHoveredDate(day)\n      }\n    },\n    [selectionPhase]\n  )\n\n  // Left panel navigation\n  const handleLeftViewDateChange = React.useCallback((date: Date) => {\n    setLeftViewDate(date)\n  }, [])\n\n  // Right panel navigation: when the right panel moves, shift leftViewDate accordingly\n  const handleRightViewDateChange = React.useCallback((date: Date) => {\n    // Right panel changed its viewDate, so left should be one month before\n    setLeftViewDate(subMonths(date, 1))\n  }, [])\n\n  // Dummy value for Calendar (required prop but unused in range mode)\n  const dummyDate = React.useMemo(\n    () => value.start || new Date(),\n    [value.start]\n  )\n\n  return (\n    <div\n      className={mergeClasses(styles.root, className)}\n      data-slot=\"range-calendar\"\n      {...{ [SLOT_ATTR]: \"range-calendar\" }}\n      ref={ref}\n    >\n      {/* Left panel */}\n      <div\n        className={styles.panel}\n        data-slot=\"range-calendar-panel\"\n        {...{ [SLOT_ATTR]: \"range-calendar-panel\" }}\n      >\n        <Calendar\n          controlledViewDate={leftViewDate}\n          currentTimeInTimezone={currentTimeInTimezone}\n          disablePast={disablePast}\n          hideOutOfMonthDays\n          hoveredDate={hoveredDate}\n          locale={locale}\n          nextMonthLabel={nextMonthLabel}\n          onChange={() => {}}\n          onDayClick={handleDayClick}\n          onDayHover={handleDayHover}\n          onViewDateChange={handleLeftViewDateChange}\n          previousMonthLabel={previousMonthLabel}\n          rangeEnd={rangeEnd}\n          rangeStart={rangeStart}\n          showNextButton={false}\n          showWeekNumbers={showWeekNumbers}\n          value={dummyDate}\n        />\n      </div>\n\n      {/* Right panel */}\n      <div\n        className={styles.panel}\n        data-slot=\"range-calendar-panel\"\n        {...{ [SLOT_ATTR]: \"range-calendar-panel\" }}\n      >\n        <Calendar\n          controlledViewDate={rightViewDate}\n          currentTimeInTimezone={currentTimeInTimezone}\n          disablePast={disablePast}\n          hideOutOfMonthDays\n          hoveredDate={hoveredDate}\n          locale={locale}\n          nextMonthLabel={nextMonthLabel}\n          onChange={() => {}}\n          onDayClick={handleDayClick}\n          onDayHover={handleDayHover}\n          onViewDateChange={handleRightViewDateChange}\n          previousMonthLabel={previousMonthLabel}\n          rangeEnd={rangeEnd}\n          rangeStart={rangeStart}\n          showPreviousButton={false}\n          showWeekNumbers={showWeekNumbers}\n          value={dummyDate}\n        />\n      </div>\n    </div>\n  )\n})\n"],"names":["useStyles","makeVoltStyles","shorthands","tokens.spacingLayout1","RangeCalendar","React","value","onChange","onRangeComplete","disablePast","locale","previousMonthLabel","nextMonthLabel","currentTimeInTimezone","showWeekNumbers","className","ref","styles","leftViewDate","setLeftViewDate","startOfDay","selectionPhase","setSelectionPhase","rangeStart","setRangeStart","rangeEnd","setRangeEnd","hoveredDate","setHoveredDate","rightViewDate","addMonths","handleDayClick","day","normalized","normalizeRange","handleDayHover","handleLeftViewDateChange","date","handleRightViewDateChange","subMonths","dummyDate","jsxs","mergeClasses","SLOT_ATTR","jsx","Calendar"],"mappings":"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"}
+{"version":3,"file":"range-calendar.js","sources":["../../../src/components/date-range-picker/range-calendar.tsx"],"sourcesContent":["import * as React from \"react\"\nimport { addMonths, subMonths, startOfDay } from \"date-fns\"\nimport { mergeClasses, shorthands } from \"@epilot/volt-ui-runtime\"\n\nimport { Calendar } from \"../date-time-picker/calendar\"\nimport { SLOT_ATTR } from \"../../renderer/contract\"\nimport { makeVoltStyles } from \"../../styles/make-styles\"\nimport * as tokens from \"../../tokens\"\n\nimport type { DateRange, DateTimePickerLocale } from \"./date-range-picker-utils\"\nimport { normalizeRange } from \"./date-range-picker-utils\"\n\ntype SelectionPhase = \"idle\" | \"selectingEnd\"\n\nexport type RangeCalendarProps = {\n  value: DateRange\n  onChange: (range: DateRange) => void\n  onRangeComplete?: (range: DateRange) => void\n  disablePast?: boolean\n  locale?: DateTimePickerLocale\n  previousMonthLabel?: string\n  nextMonthLabel?: string\n  currentTimeInTimezone?: Date\n  showWeekNumbers?: boolean\n  className?: string\n}\n\nconst useStyles = makeVoltStyles({\n  root: {\n    display: \"flex\",\n    flexDirection: \"row\",\n    ...shorthands.gap(tokens.spacingLayout1), // v1 gap-6 (1.5rem)\n  },\n  panel: {\n    width: \"280px\",\n    flexShrink: 0,\n  },\n})\n\nexport const RangeCalendar = React.forwardRef<\n  HTMLDivElement,\n  RangeCalendarProps\n>(function RangeCalendar(\n  {\n    value,\n    onChange,\n    onRangeComplete,\n    disablePast = false,\n    locale = \"de\",\n    previousMonthLabel = \"Previous month\",\n    nextMonthLabel = \"Next month\",\n    currentTimeInTimezone,\n    showWeekNumbers = false,\n    className,\n  },\n  ref\n) {\n  const styles = useStyles()\n  const [leftViewDate, setLeftViewDate] = React.useState(() => {\n    if (value.start) return startOfDay(value.start)\n\n    return startOfDay(new Date())\n  })\n\n  const [selectionPhase, setSelectionPhase] =\n    React.useState<SelectionPhase>(\"idle\")\n  const [rangeStart, setRangeStart] = React.useState<Date | null>(value.start)\n  const [rangeEnd, setRangeEnd] = React.useState<Date | null>(value.end)\n  const [hoveredDate, setHoveredDate] = React.useState<Date | null>(null)\n\n  React.useEffect(() => {\n    if (selectionPhase === \"idle\") {\n      setRangeStart(value.start)\n      setRangeEnd(value.end)\n    }\n  }, [value.start, value.end, selectionPhase])\n\n  const rightViewDate = React.useMemo(\n    () => addMonths(leftViewDate, 1),\n    [leftViewDate]\n  )\n\n  // Shared day click handler (range state machine)\n  const handleDayClick = React.useCallback(\n    (day: Date) => {\n      if (selectionPhase === \"idle\") {\n        setRangeStart(day)\n        setRangeEnd(null)\n        setSelectionPhase(\"selectingEnd\")\n        onChange({ start: day, end: null })\n      } else {\n        const normalized = normalizeRange(rangeStart!, day)\n\n        setRangeStart(normalized.start)\n        setRangeEnd(normalized.end)\n        setSelectionPhase(\"idle\")\n        setHoveredDate(null)\n        onChange(normalized)\n        onRangeComplete?.(normalized)\n      }\n    },\n    [selectionPhase, rangeStart, onChange, onRangeComplete]\n  )\n\n  // Shared hover handler\n  const handleDayHover = React.useCallback(\n    (day: Date | null) => {\n      if (selectionPhase === \"selectingEnd\") {\n        setHoveredDate(day)\n      }\n    },\n    [selectionPhase]\n  )\n\n  // Left panel navigation\n  const handleLeftViewDateChange = React.useCallback((date: Date) => {\n    setLeftViewDate(date)\n  }, [])\n\n  // Right panel navigation: when the right panel moves, shift leftViewDate accordingly\n  const handleRightViewDateChange = React.useCallback((date: Date) => {\n    // Right panel changed its viewDate, so left should be one month before\n    setLeftViewDate(subMonths(date, 1))\n  }, [])\n\n  // Dummy value for Calendar (required prop but unused in range mode)\n  const dummyDate = React.useMemo(\n    () => value.start || new Date(),\n    [value.start]\n  )\n\n  return (\n    <div\n      className={mergeClasses(styles.root, className)}\n      data-slot=\"range-calendar\"\n      {...{ [SLOT_ATTR]: \"range-calendar\" }}\n      ref={ref}\n    >\n      {/* Left panel */}\n      <div\n        className={styles.panel}\n        data-slot=\"range-calendar-panel\"\n        {...{ [SLOT_ATTR]: \"range-calendar-panel\" }}\n      >\n        <Calendar\n          controlledViewDate={leftViewDate}\n          currentTimeInTimezone={currentTimeInTimezone}\n          disablePast={disablePast}\n          hideOutOfMonthDays\n          hoveredDate={hoveredDate}\n          locale={locale}\n          nextMonthLabel={nextMonthLabel}\n          onChange={() => {}}\n          onDayClick={handleDayClick}\n          onDayHover={handleDayHover}\n          onViewDateChange={handleLeftViewDateChange}\n          previousMonthLabel={previousMonthLabel}\n          rangeEnd={rangeEnd}\n          rangeStart={rangeStart}\n          showNextButton={false}\n          showWeekNumbers={showWeekNumbers}\n          value={dummyDate}\n        />\n      </div>\n\n      {/* Right panel */}\n      <div\n        className={styles.panel}\n        data-slot=\"range-calendar-panel\"\n        {...{ [SLOT_ATTR]: \"range-calendar-panel\" }}\n      >\n        <Calendar\n          controlledViewDate={rightViewDate}\n          currentTimeInTimezone={currentTimeInTimezone}\n          disablePast={disablePast}\n          hideOutOfMonthDays\n          hoveredDate={hoveredDate}\n          locale={locale}\n          nextMonthLabel={nextMonthLabel}\n          onChange={() => {}}\n          onDayClick={handleDayClick}\n          onDayHover={handleDayHover}\n          onViewDateChange={handleRightViewDateChange}\n          previousMonthLabel={previousMonthLabel}\n          rangeEnd={rangeEnd}\n          rangeStart={rangeStart}\n          showPreviousButton={false}\n          showWeekNumbers={showWeekNumbers}\n          value={dummyDate}\n        />\n      </div>\n    </div>\n  )\n})\n"],"names":["useStyles","makeVoltStyles","shorthands","tokens.spacingLayout1","RangeCalendar","React","value","onChange","onRangeComplete","disablePast","locale","previousMonthLabel","nextMonthLabel","currentTimeInTimezone","showWeekNumbers","className","ref","styles","leftViewDate","setLeftViewDate","startOfDay","selectionPhase","setSelectionPhase","rangeStart","setRangeStart","rangeEnd","setRangeEnd","hoveredDate","setHoveredDate","rightViewDate","addMonths","handleDayClick","day","normalized","normalizeRange","handleDayHover","handleLeftViewDateChange","date","handleRightViewDateChange","subMonths","dummyDate","jsxDEV","mergeClasses","SLOT_ATTR","Calendar"],"mappings":"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"}