@salt-ds/lab 1.0.0-alpha.6 → 1.0.0-alpha.61

package/dist-cjs/date-input/DateInputRange.js

@@ -0,0 +1,347 @@
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var core = require('@salt-ds/core');
+var styles = require('@salt-ds/styles');
+var window = require('@salt-ds/window');
+var clsx = require('clsx');
+var react = require('react');
+var LocalizationProvider = require('../localization-provider/LocalizationProvider.js');
+var DateInput = require('./DateInput.css.js');
+
+const withBaseName = core.makePrefixer("saltDateInput");
+var DateParserField = /* @__PURE__ */ ((DateParserField2) => {
+  DateParserField2["START"] = "start";
+  DateParserField2["END"] = "end";
+  return DateParserField2;
+})(DateParserField || {});
+const DateInputRange = react.forwardRef(
+  (props, ref) => {
+    const { dateAdapter } = LocalizationProvider.useLocalization();
+    const {
+      bordered = false,
+      className,
+      disabled,
+      "aria-label": ariaLabel,
+      date: dateProp,
+      defaultDate,
+      onDateChange,
+      value: valueProp,
+      locale,
+      format = "DD MMM YYYY",
+      defaultValue = {
+        startDate: dateAdapter.format(void 0, format, locale),
+        endDate: dateAdapter.format(void 0, format, locale)
+      },
+      onChange,
+      onClick,
+      onDateValueChange,
+      emptyReadOnlyMarker = "\u2014",
+      endAdornment,
+      startInputProps = {},
+      endInputProps = {},
+      startInputRef: startInputRefProp,
+      endInputRef: endInputRefProp,
+      parse: parseProp,
+      placeholder = format.toLowerCase(),
+      readOnly: readOnlyProp,
+      validationStatus: validationStatusProp,
+      variant = "primary",
+      ...rest
+    } = props;
+    const wrapperRef = react.useRef(null);
+    const handleWrapperRef = core.useForkRef(ref, wrapperRef);
+    const startInputRef = react.useRef(null);
+    const handleStartInputRef = core.useForkRef(startInputRef, startInputRefProp);
+    const endInputRef = react.useRef(null);
+    const handleEndInputRef = core.useForkRef(endInputRef, endInputRefProp);
+    const startInputID = core.useId();
+    const endInputID = core.useId();
+    const targetWindow = window.useWindow();
+    styles.useComponentCssInjection({
+      testId: "salt-date-input-range",
+      css: DateInput,
+      window: targetWindow
+    });
+    const parseDateValue = (dateValue2, field) => {
+      const parseResult = parseProp ? parseProp(dateValue2 ?? "", field, format, locale) : dateAdapter.parse.bind(dateAdapter)(dateValue2 ?? "", format, locale);
+      const { date: date2, ...parseDetails } = parseResult;
+      return { date: date2, ...parseDetails };
+    };
+    const [dateValue, setDateValue] = core.useControlled({
+      controlled: valueProp,
+      default: defaultValue,
+      name: "DateInputRange",
+      state: "dateValue"
+    });
+    const fallbackDate = react.useMemo(() => {
+      if (!defaultValue) {
+        return void 0;
+      }
+      const { date: startDate = void 0 } = parseDateValue(defaultValue == null ? void 0 : defaultValue.startDate, "start" /* START */) ?? {};
+      const { date: endDate = void 0 } = parseDateValue(defaultValue == null ? void 0 : defaultValue.endDate, "end" /* END */) ?? {};
+      return {
+        startDate,
+        endDate
+      };
+    }, [defaultValue, dateAdapter, parseProp, format]);
+    const [date, setDate] = core.useControlled({
+      controlled: dateProp,
+      default: defaultDate ?? fallbackDate,
+      name: "DateInputRange",
+      state: "date"
+    });
+    const lastAppliedValue = react.useRef(dateValue);
+    const preservedTime = react.useRef({ startTime: null, endTime: null });
+    preservedTime.current = {
+      startTime: (date == null ? void 0 : date.startDate) && dateAdapter.isValid(date == null ? void 0 : date.startDate) ? dateAdapter.getTime(date.startDate) : null,
+      endTime: (date == null ? void 0 : date.endDate) && dateAdapter.isValid(date == null ? void 0 : date.endDate) ? dateAdapter.getTime(date.endDate) : null
+    };
+    const setDateValueFromDate = (newDate) => {
+      let newDateValue = { ...dateValue };
+      if ((newDate == null ? void 0 : newDate.startDate) && dateAdapter.isValid(newDate == null ? void 0 : newDate.startDate)) {
+        const formattedStartDateValue = dateAdapter.format(
+          newDate == null ? void 0 : newDate.startDate,
+          format,
+          locale
+        );
+        newDateValue = { ...dateValue, startDate: formattedStartDateValue };
+      } else if (!(newDate == null ? void 0 : newDate.startDate)) {
+        newDateValue = {
+          ...dateValue,
+          startDate: dateAdapter.format(void 0, format, locale)
+        };
+      }
+      if ((newDate == null ? void 0 : newDate.endDate) && dateAdapter.isValid(newDate.endDate)) {
+        const formattedEndDateValue = dateAdapter.format(
+          newDate == null ? void 0 : newDate.endDate,
+          format,
+          locale
+        );
+        newDateValue = { ...newDateValue, endDate: formattedEndDateValue };
+      } else if (!(newDate == null ? void 0 : newDate.endDate)) {
+        newDateValue = {
+          ...newDateValue,
+          endDate: dateAdapter.format(void 0, format, locale)
+        };
+      }
+      if ((newDateValue == null ? void 0 : newDateValue.startDate) !== (dateValue == null ? void 0 : dateValue.startDate) || (newDateValue == null ? void 0 : newDateValue.endDate) !== (dateValue == null ? void 0 : dateValue.endDate)) {
+        onDateValueChange == null ? void 0 : onDateValueChange(null, newDateValue);
+        setDateValue(newDateValue);
+      }
+      return newDateValue;
+    };
+    react.useEffect(() => {
+      setDateValueFromDate(date);
+    }, [date, date == null ? void 0 : date.startDate, date == null ? void 0 : date.endDate]);
+    const [focused, setFocused] = react.useState(false);
+    const {
+      a11yProps: {
+        "aria-describedby": formFieldDescribedBy,
+        "aria-labelledby": formFieldLabelledBy
+      } = {},
+      disabled: formFieldDisabled,
+      readOnly: formFieldReadOnly,
+      necessity: formFieldRequired,
+      validationStatus: formFieldValidationStatus
+    } = core.useFormFieldProps();
+    const isReadOnly = readOnlyProp || formFieldReadOnly;
+    const isDisabled = disabled || formFieldDisabled;
+    const validationStatus = formFieldValidationStatus ?? validationStatusProp;
+    const {
+      "aria-describedby": startInputPropsDescribedBy,
+      "aria-labelledby": startInputPropsLabelledBy,
+      onBlur: startInputPropsOnBlur,
+      onChange: startInputPropsOnChange,
+      onKeyDown: startInputPropsOnKeyDown,
+      onFocus: startInputPropsOnFocus,
+      required: startInputPropsRequired,
+      ...restStartInputProps
+    } = startInputProps;
+    const startInputIsRequired = formFieldRequired ? ["required", "asterisk"].includes(formFieldRequired) : startInputPropsRequired;
+    const {
+      "aria-describedby": endInputPropsDescribedBy,
+      "aria-labelledby": endInputPropsLabelledBy,
+      onBlur: endInputPropsOnBlur,
+      onChange: endInputPropsOnChange,
+      onKeyDown: endInputPropsOnKeyDown,
+      onFocus: endInputPropsOnFocus,
+      required: endInputPropsRequired,
+      ...restEndInputProps
+    } = endInputProps;
+    const endInputIsRequired = formFieldRequired ? ["required", "asterisk"].includes(formFieldRequired) : endInputPropsRequired;
+    const apply = (event) => {
+      const { date: startDate = void 0, ...startDateParseDetails } = parseDateValue(dateValue == null ? void 0 : dateValue.startDate, "start" /* START */) ?? {};
+      const { date: endDate = void 0, ...endDateParseDetails } = parseDateValue(dateValue == null ? void 0 : dateValue.endDate, "end" /* END */) ?? {};
+      const updatedDateRange = {
+        startDate,
+        endDate
+      };
+      const newDateValue = setDateValueFromDate(updatedDateRange);
+      setDate(updatedDateRange);
+      if (lastAppliedValue.current.startDate !== dateValue.startDate || lastAppliedValue.current.endDate !== dateValue.endDate) {
+        if (dateAdapter.isValid(updatedDateRange == null ? void 0 : updatedDateRange.startDate) && preservedTime.current.startTime) {
+          updatedDateRange.startDate = dateAdapter.set(
+            updatedDateRange.startDate,
+            preservedTime.current.startTime
+          );
+        }
+        if (dateAdapter.isValid(updatedDateRange == null ? void 0 : updatedDateRange.endDate) && preservedTime.current.endTime) {
+          updatedDateRange.endDate = dateAdapter.set(
+            updatedDateRange.endDate,
+            preservedTime.current.endTime
+          );
+        }
+        onDateChange == null ? void 0 : onDateChange(event, updatedDateRange, {
+          startDate: startDateParseDetails,
+          endDate: endDateParseDetails
+        });
+      }
+      lastAppliedValue.current = { ...newDateValue };
+    };
+    const handleStartInputChange = (event) => {
+      const newDateValue = { ...dateValue, startDate: event.target.value };
+      setDateValue(newDateValue);
+      startInputPropsOnChange == null ? void 0 : startInputPropsOnChange(event);
+      onChange == null ? void 0 : onChange(event);
+      onDateValueChange == null ? void 0 : onDateValueChange(event, newDateValue);
+    };
+    const handleEndInputChange = (event) => {
+      const newDateValue = { ...dateValue, endDate: event.target.value };
+      setDateValue(newDateValue);
+      endInputPropsOnChange == null ? void 0 : endInputPropsOnChange(event);
+      onChange == null ? void 0 : onChange(event);
+      onDateValueChange == null ? void 0 : onDateValueChange(event, newDateValue);
+    };
+    const handleStartInputFocus = (event) => {
+      setFocused(true);
+      startInputPropsOnFocus == null ? void 0 : startInputPropsOnFocus(event);
+    };
+    const handleEndInputFocus = (event) => {
+      setFocused(true);
+      endInputPropsOnFocus == null ? void 0 : endInputPropsOnFocus(event);
+    };
+    const handleStartInputBlur = (event) => {
+      setFocused(false);
+      apply(event);
+      startInputPropsOnBlur == null ? void 0 : startInputPropsOnBlur(event);
+    };
+    const handleEndInputBlur = (event) => {
+      setFocused(false);
+      apply(event);
+      endInputPropsOnBlur == null ? void 0 : endInputPropsOnBlur(event);
+    };
+    const handleStartInputKeyDown = (event) => {
+      if (event.key === "Enter") {
+        apply(event);
+      }
+      startInputPropsOnKeyDown == null ? void 0 : startInputPropsOnKeyDown(event);
+    };
+    const handleEndInputKeyDown = (event) => {
+      if (event.key === "Enter") {
+        apply(event);
+      }
+      endInputPropsOnKeyDown == null ? void 0 : endInputPropsOnKeyDown(event);
+    };
+    const handleWrapperClick = (event) => {
+      if (event.target === wrapperRef.current) {
+        const input = startInputRef.current;
+        input == null ? void 0 : input.focus();
+        input == null ? void 0 : input.setSelectionRange(input.value.length, input.value.length);
+      }
+      onClick == null ? void 0 : onClick(event);
+    };
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        className: clsx.clsx(
+          withBaseName(),
+          withBaseName(variant),
+          {
+            [withBaseName("focused")]: !isDisabled && focused,
+            [withBaseName("disabled")]: isDisabled,
+            [withBaseName("readOnly")]: isReadOnly,
+            [withBaseName(validationStatus ?? "")]: validationStatus,
+            [withBaseName("bordered")]: bordered
+          },
+          className
+        ),
+        ref: handleWrapperRef,
+        onClick: handleWrapperClick,
+        ...rest,
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "input",
+            {
+              autoComplete: "off",
+              "aria-describedby": clsx.clsx(
+                formFieldDescribedBy,
+                startInputPropsDescribedBy
+              ),
+              "aria-labelledby": clsx.clsx(
+                formFieldLabelledBy,
+                startInputPropsLabelledBy,
+                startInputID
+              ),
+              "aria-label": clsx.clsx("Start date", ariaLabel),
+              id: startInputID,
+              className: withBaseName("input"),
+              disabled: isDisabled,
+              readOnly: isReadOnly,
+              ref: handleStartInputRef,
+              tabIndex: isDisabled ? -1 : 0,
+              placeholder,
+              value: isReadOnly && !(dateValue == null ? void 0 : dateValue.startDate) ? emptyReadOnlyMarker : dateValue.startDate ?? dateAdapter.format(void 0, format, locale),
+              ...restStartInputProps,
+              onBlur: handleStartInputBlur,
+              onChange: handleStartInputChange,
+              onKeyDown: handleStartInputKeyDown,
+              onFocus: !isDisabled ? handleStartInputFocus : void 0,
+              required: startInputIsRequired
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsx("span", { children: "-" }),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "input",
+            {
+              autoComplete: "off",
+              "aria-describedby": clsx.clsx(
+                formFieldDescribedBy,
+                endInputPropsDescribedBy
+              ),
+              "aria-labelledby": clsx.clsx(
+                formFieldLabelledBy,
+                endInputPropsLabelledBy,
+                endInputID
+              ),
+              "aria-label": clsx.clsx("End date", ariaLabel),
+              id: endInputID,
+              className: withBaseName("input"),
+              disabled: isDisabled,
+              readOnly: isReadOnly,
+              ref: handleEndInputRef,
+              tabIndex: isDisabled ? -1 : 0,
+              placeholder,
+              value: isReadOnly && !(dateValue == null ? void 0 : dateValue.endDate) ? emptyReadOnlyMarker : dateValue.endDate ?? dateAdapter.format(void 0, format, locale),
+              ...restEndInputProps,
+              onBlur: handleEndInputBlur,
+              onChange: handleEndInputChange,
+              onKeyDown: handleEndInputKeyDown,
+              onFocus: !isDisabled ? handleEndInputFocus : void 0,
+              required: endInputIsRequired
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: withBaseName("endAdornmentContainer"), children: [
+            !isDisabled && !isReadOnly && validationStatus && /* @__PURE__ */ jsxRuntime.jsx(core.StatusAdornment, { status: validationStatus }),
+            endAdornment
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsx("div", { className: withBaseName("activationIndicator") })
+        ]
+      }
+    );
+  }
+);
+
+exports.DateInputRange = DateInputRange;
+exports.DateParserField = DateParserField;
+//# sourceMappingURL=DateInputRange.js.map

package/dist-cjs/date-input/DateInputRange.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DateInputRange.js","sources":["../src/date-input/DateInputRange.tsx"],"sourcesContent":["import {\n  type InputProps,\n  StatusAdornment,\n  makePrefixer,\n  useControlled,\n  useForkRef,\n  useFormFieldProps,\n  useId,\n} from \"@salt-ds/core\";\nimport type {\n  DateDetail,\n  DateFrameworkType,\n  ParserResult,\n  TimeFields,\n} from \"@salt-ds/date-adapters\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n  type ChangeEvent,\n  type ChangeEventHandler,\n  type ComponentPropsWithoutRef,\n  type FocusEventHandler,\n  type InputHTMLAttributes,\n  type KeyboardEventHandler,\n  type MouseEventHandler,\n  type ReactNode,\n  type Ref,\n  type SyntheticEvent,\n  forwardRef,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from \"react\";\nimport type { DateRangeSelection } from \"../calendar\";\nimport { useLocalization } from \"../localization-provider\";\nimport dateInputCss from \"./DateInput.css\";\n\nconst withBaseName = makePrefixer(\"saltDateInput\");\n\n/**\n * DateInputRange raw value or null if no date is defined.\n */\nexport type DateInputRangeValue = {\n  startDate?: string | null;\n  endDate?: string | null;\n};\n\n/**\n * Details of parsing the date range\n */\nexport type DateInputRangeDetails = {\n  /** Details of parsing the start date and applying any validation */\n  startDate?: DateDetail;\n  /** Details of parsing the end date and applying any validation */\n  endDate?: DateDetail;\n};\n\n/**\n * Enum to identify the field being parsed\n */\nexport enum DateParserField {\n  START = \"start\",\n  END = \"end\",\n}\n\n/**\n * Props for the DateInputRange component.\n * @template T\n */\nexport interface DateInputRangeProps<TDate extends DateFrameworkType>\n  extends Omit<ComponentPropsWithoutRef<\"div\">, \"defaultValue\" | \"onChange\">,\n    Omit<InputProps, \"defaultValue\" | \"inputRef\" | \"value\" | \"onChange\"> {\n  /**\n   * The aria-label for accessibility.\n   */\n  ariaLabel?: string;\n  /**\n   * Styling variant with full border. Defaults to false.\n   */\n  bordered?: boolean;\n  /**\n   * The marker to use in an empty read-only DateInput.\n   * Use `''` to disable this feature. Defaults to '—'.\n   */\n  emptyReadOnlyMarker?: string;\n  /**\n   * End adornment component.\n   */\n  endAdornment?: ReactNode;\n  /**\n   * Attributes applied to the start `input` element.\n   * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/dateInput#Attributes\n   */\n  startInputProps?: InputHTMLAttributes<HTMLInputElement>;\n  /**\n   * Attributes applied to the end `input` element.\n   * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/dateInput#Attributes\n   */\n  endInputProps?: InputHTMLAttributes<HTMLInputElement>;\n  /**\n   * If `true`, the component is read-only.\n   */\n  readOnly?: boolean;\n  /**\n   * Validation status.\n   */\n  validationStatus?: \"error\" | \"warning\" | \"success\";\n  /**\n   * Styling variant. Defaults to \"primary\".\n   */\n  variant?: \"primary\" | \"secondary\";\n  /**\n   * Format string for date.\n   */\n  format?: string;\n  /**\n   * Optional ref for the start input component.\n   */\n  startInputRef?: Ref<HTMLInputElement>;\n  /**\n   * Optional ref for the end input component.\n   */\n  endInputRef?: Ref<HTMLInputElement>;\n  /**\n   * Locale for date formatting and parsing\n   */\n  locale?: any;\n  /**\n   * Parser callback, if not using the adapter's parser\n   * @param value - date string to parse\n   * @param field: DateParserField to identify value,\n   * @param format - format required\n   * @param locale - locale required\n   */\n  parse?: (\n    value: string,\n    field: DateParserField,\n    format: string,\n    locale?: any,\n  ) => ParserResult<TDate>;\n  /**\n   * Input value. Use when the input value is controlled.\n   */\n  value?: DateInputRangeValue;\n  /**\n   * The initial input value. Use when the component is uncontrolled.\n   */\n  defaultValue?: DateInputRangeValue;\n  /**\n   * The date value. Use when the component is controlled.\n   */\n  date?: DateRangeSelection<TDate> | null;\n  /**\n   * The initial selected date value. Use when the component is uncontrolled.\n   */\n  defaultDate?: DateRangeSelection<TDate> | null;\n  /**\n   * Callback fired when the input value changes.\n   * @param event - The change event.\n   * @param date - The new date input range value.\n   */\n  onChange?: (event: ChangeEvent<HTMLInputElement>) => void;\n  /**\n   * Callback fired when the selected date changes.\n   * @param event - The synthetic event.\n   * @param date - the selected date, invalid date if not a valid date or undefined (uncontrolled) or null (controlled) if not defined\n   * @param details - The details of date selection, either a valid date or error\n   */\n  onDateChange?: (\n    event: SyntheticEvent,\n    date: DateRangeSelection<TDate> | null,\n    details: DateInputRangeDetails,\n  ) => void;\n  /**\n   * Called when input values change, either due to user interaction or programmatic formatting of valid dates.\n   * @param event - The synthetic event or null if a programmatic change.\n   * @param newValue - The new date input range value.\n   */\n  onDateValueChange?: (\n    event: SyntheticEvent | null,\n    newValue: DateInputRangeValue,\n  ) => void;\n}\n\nexport const DateInputRange = forwardRef<\n  HTMLDivElement,\n  DateInputRangeProps<any>\n>(\n  <TDate extends DateFrameworkType>(\n    props: DateInputRangeProps<TDate>,\n    ref: React.Ref<HTMLDivElement>,\n  ) => {\n    const { dateAdapter } = useLocalization<TDate>();\n    const {\n      bordered = false,\n      className,\n      disabled,\n      \"aria-label\": ariaLabel,\n      date: dateProp,\n      defaultDate,\n      onDateChange,\n      value: valueProp,\n      locale,\n      format = \"DD MMM YYYY\",\n      defaultValue = {\n        startDate: dateAdapter.format(undefined, format, locale),\n        endDate: dateAdapter.format(undefined, format, locale),\n      },\n      onChange,\n      onClick,\n      onDateValueChange,\n      emptyReadOnlyMarker = \"—\",\n      endAdornment,\n      startInputProps = {},\n      endInputProps = {},\n      startInputRef: startInputRefProp,\n      endInputRef: endInputRefProp,\n      parse: parseProp,\n      placeholder = format.toLowerCase(),\n      readOnly: readOnlyProp,\n      validationStatus: validationStatusProp,\n      variant = \"primary\",\n      ...rest\n    } = props;\n    const wrapperRef = useRef(null);\n    const handleWrapperRef = useForkRef<HTMLDivElement>(ref, wrapperRef);\n\n    const startInputRef = useRef<HTMLInputElement>(null);\n    const handleStartInputRef = useForkRef(startInputRef, startInputRefProp);\n    const endInputRef = useRef<HTMLInputElement>(null);\n    const handleEndInputRef = useForkRef(endInputRef, endInputRefProp);\n\n    const startInputID = useId();\n    const endInputID = useId();\n\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-date-input-range\",\n      css: dateInputCss,\n      window: targetWindow,\n    });\n\n    const parseDateValue = (\n      dateValue: string | null | undefined,\n      field: DateParserField,\n    ): ParserResult<TDate> | undefined => {\n      const parseResult = parseProp\n        ? parseProp(dateValue ?? \"\", field, format, locale)\n        : dateAdapter.parse.bind(dateAdapter)(dateValue ?? \"\", format, locale);\n\n      const { date, ...parseDetails } = parseResult;\n      return { date, ...parseDetails };\n    };\n\n    const [dateValue, setDateValue] = useControlled({\n      controlled: valueProp,\n      default: defaultValue,\n      name: \"DateInputRange\",\n      state: \"dateValue\",\n    });\n    const fallbackDate = useMemo(() => {\n      if (!defaultValue) {\n        return undefined;\n      }\n      const { date: startDate = undefined } =\n        parseDateValue(defaultValue?.startDate, DateParserField.START) ?? {};\n      const { date: endDate = undefined } =\n        parseDateValue(defaultValue?.endDate, DateParserField.END) ?? {};\n      return {\n        startDate,\n        endDate,\n      };\n    }, [defaultValue, dateAdapter, parseProp, format]);\n\n    const [date, setDate] = useControlled({\n      controlled: dateProp,\n      default: defaultDate ?? fallbackDate,\n      name: \"DateInputRange\",\n      state: \"date\",\n    });\n\n    const lastAppliedValue = useRef<DateInputRangeValue>(dateValue);\n    const preservedTime = useRef<{\n      startTime: TimeFields | null;\n      endTime: TimeFields | null;\n    }>({ startTime: null, endTime: null });\n    preservedTime.current = {\n      startTime:\n        date?.startDate && dateAdapter.isValid(date?.startDate)\n          ? dateAdapter.getTime(date.startDate)\n          : null,\n      endTime:\n        date?.endDate && dateAdapter.isValid(date?.endDate)\n          ? dateAdapter.getTime(date.endDate)\n          : null,\n    };\n    const setDateValueFromDate = (newDate: typeof date) => {\n      let newDateValue = { ...dateValue };\n      if (newDate?.startDate && dateAdapter.isValid(newDate?.startDate)) {\n        const formattedStartDateValue = dateAdapter.format(\n          newDate?.startDate,\n          format,\n          locale,\n        );\n        newDateValue = { ...dateValue, startDate: formattedStartDateValue };\n      } else if (!newDate?.startDate) {\n        newDateValue = {\n          ...dateValue,\n          startDate: dateAdapter.format(undefined, format, locale),\n        };\n      }\n      if (newDate?.endDate && dateAdapter.isValid(newDate.endDate)) {\n        const formattedEndDateValue = dateAdapter.format(\n          newDate?.endDate,\n          format,\n          locale,\n        );\n        newDateValue = { ...newDateValue, endDate: formattedEndDateValue };\n      } else if (!newDate?.endDate) {\n        newDateValue = {\n          ...newDateValue,\n          endDate: dateAdapter.format(undefined, format, locale),\n        };\n      }\n\n      if (\n        newDateValue?.startDate !== dateValue?.startDate ||\n        newDateValue?.endDate !== dateValue?.endDate\n      ) {\n        onDateValueChange?.(null, newDateValue);\n        setDateValue(newDateValue);\n      }\n      return newDateValue;\n    };\n\n    // Update date string value when selected date changes\n    useEffect(() => {\n      setDateValueFromDate(date);\n    }, [date, date?.startDate, date?.endDate]);\n\n    const [focused, setFocused] = useState(false);\n\n    const {\n      a11yProps: {\n        \"aria-describedby\": formFieldDescribedBy,\n        \"aria-labelledby\": formFieldLabelledBy,\n      } = {},\n      disabled: formFieldDisabled,\n      readOnly: formFieldReadOnly,\n      necessity: formFieldRequired,\n      validationStatus: formFieldValidationStatus,\n    } = useFormFieldProps();\n\n    const isReadOnly = readOnlyProp || formFieldReadOnly;\n    const isDisabled = disabled || formFieldDisabled;\n\n    const validationStatus = formFieldValidationStatus ?? validationStatusProp;\n\n    const {\n      \"aria-describedby\": startInputPropsDescribedBy,\n      \"aria-labelledby\": startInputPropsLabelledBy,\n      onBlur: startInputPropsOnBlur,\n      onChange: startInputPropsOnChange,\n      onKeyDown: startInputPropsOnKeyDown,\n      onFocus: startInputPropsOnFocus,\n      required: startInputPropsRequired,\n      ...restStartInputProps\n    } = startInputProps;\n\n    const startInputIsRequired = formFieldRequired\n      ? [\"required\", \"asterisk\"].includes(formFieldRequired)\n      : startInputPropsRequired;\n\n    const {\n      \"aria-describedby\": endInputPropsDescribedBy,\n      \"aria-labelledby\": endInputPropsLabelledBy,\n      onBlur: endInputPropsOnBlur,\n      onChange: endInputPropsOnChange,\n      onKeyDown: endInputPropsOnKeyDown,\n      onFocus: endInputPropsOnFocus,\n      required: endInputPropsRequired,\n      ...restEndInputProps\n    } = endInputProps;\n\n    const endInputIsRequired = formFieldRequired\n      ? [\"required\", \"asterisk\"].includes(formFieldRequired)\n      : endInputPropsRequired;\n\n    const apply = (event: SyntheticEvent) => {\n      const { date: startDate = undefined, ...startDateParseDetails } =\n        parseDateValue(dateValue?.startDate, DateParserField.START) ?? {};\n      const { date: endDate = undefined, ...endDateParseDetails } =\n        parseDateValue(dateValue?.endDate, DateParserField.END) ?? {};\n      const updatedDateRange = {\n        startDate,\n        endDate,\n      };\n      const newDateValue = setDateValueFromDate(updatedDateRange);\n      setDate(updatedDateRange);\n      if (\n        lastAppliedValue.current.startDate !== dateValue.startDate ||\n        lastAppliedValue.current.endDate !== dateValue.endDate\n      ) {\n        if (\n          dateAdapter.isValid(updatedDateRange?.startDate) &&\n          preservedTime.current.startTime\n        ) {\n          updatedDateRange.startDate = dateAdapter.set(\n            updatedDateRange.startDate,\n            preservedTime.current.startTime,\n          );\n        }\n        if (\n          dateAdapter.isValid(updatedDateRange?.endDate) &&\n          preservedTime.current.endTime\n        ) {\n          updatedDateRange.endDate = dateAdapter.set(\n            updatedDateRange.endDate,\n            preservedTime.current.endTime,\n          );\n        }\n        onDateChange?.(event, updatedDateRange, {\n          startDate: startDateParseDetails,\n          endDate: endDateParseDetails,\n        });\n      }\n      lastAppliedValue.current = { ...newDateValue };\n    };\n\n    const handleStartInputChange: ChangeEventHandler<HTMLInputElement> = (\n      event,\n    ) => {\n      const newDateValue = { ...dateValue, startDate: event.target.value };\n      setDateValue(newDateValue);\n      startInputPropsOnChange?.(event);\n      onChange?.(event);\n      onDateValueChange?.(event, newDateValue);\n    };\n\n    const handleEndInputChange: ChangeEventHandler<HTMLInputElement> = (\n      event,\n    ) => {\n      const newDateValue = { ...dateValue, endDate: event.target.value };\n      setDateValue(newDateValue);\n      endInputPropsOnChange?.(event);\n      onChange?.(event);\n      onDateValueChange?.(event, newDateValue);\n    };\n\n    const handleStartInputFocus: FocusEventHandler<HTMLInputElement> = (\n      event,\n    ) => {\n      setFocused(true);\n      startInputPropsOnFocus?.(event);\n    };\n\n    const handleEndInputFocus: FocusEventHandler<HTMLInputElement> = (\n      event,\n    ) => {\n      setFocused(true);\n      endInputPropsOnFocus?.(event);\n    };\n\n    const handleStartInputBlur: FocusEventHandler<HTMLInputElement> = (\n      event,\n    ) => {\n      setFocused(false);\n      apply(event);\n      startInputPropsOnBlur?.(event);\n    };\n\n    const handleEndInputBlur: FocusEventHandler<HTMLInputElement> = (event) => {\n      setFocused(false);\n      apply(event);\n      endInputPropsOnBlur?.(event);\n    };\n\n    const handleStartInputKeyDown: KeyboardEventHandler<HTMLInputElement> = (\n      event,\n    ) => {\n      if (event.key === \"Enter\") {\n        apply(event);\n      }\n      startInputPropsOnKeyDown?.(event);\n    };\n\n    const handleEndInputKeyDown: KeyboardEventHandler<HTMLInputElement> = (\n      event,\n    ) => {\n      if (event.key === \"Enter\") {\n        apply(event);\n      }\n      endInputPropsOnKeyDown?.(event);\n    };\n\n    const handleWrapperClick: MouseEventHandler<HTMLDivElement> = (event) => {\n      if (event.target === wrapperRef.current) {\n        const input = startInputRef.current;\n        input?.focus();\n        input?.setSelectionRange(input.value.length, input.value.length);\n      }\n      onClick?.(event);\n    };\n\n    return (\n      <div\n        className={clsx(\n          withBaseName(),\n          withBaseName(variant),\n          {\n            [withBaseName(\"focused\")]: !isDisabled && focused,\n            [withBaseName(\"disabled\")]: isDisabled,\n            [withBaseName(\"readOnly\")]: isReadOnly,\n            [withBaseName(validationStatus ?? \"\")]: validationStatus,\n            [withBaseName(\"bordered\")]: bordered,\n          },\n          className,\n        )}\n        ref={handleWrapperRef}\n        onClick={handleWrapperClick}\n        {...rest}\n      >\n        <input\n          autoComplete=\"off\"\n          aria-describedby={clsx(\n            formFieldDescribedBy,\n            startInputPropsDescribedBy,\n          )}\n          aria-labelledby={clsx(\n            formFieldLabelledBy,\n            startInputPropsLabelledBy,\n            startInputID,\n          )}\n          aria-label={clsx(\"Start date\", ariaLabel)}\n          id={startInputID}\n          className={withBaseName(\"input\")}\n          disabled={isDisabled}\n          readOnly={isReadOnly}\n          ref={handleStartInputRef}\n          tabIndex={isDisabled ? -1 : 0}\n          placeholder={placeholder}\n          value={\n            isReadOnly && !dateValue?.startDate\n              ? emptyReadOnlyMarker\n              : (dateValue.startDate ??\n                dateAdapter.format(undefined, format, locale))\n          }\n          {...restStartInputProps}\n          onBlur={handleStartInputBlur}\n          onChange={handleStartInputChange}\n          onKeyDown={handleStartInputKeyDown}\n          onFocus={!isDisabled ? handleStartInputFocus : undefined}\n          required={startInputIsRequired}\n        />\n        <span>-</span>\n        <input\n          autoComplete=\"off\"\n          aria-describedby={clsx(\n            formFieldDescribedBy,\n            endInputPropsDescribedBy,\n          )}\n          aria-labelledby={clsx(\n            formFieldLabelledBy,\n            endInputPropsLabelledBy,\n            endInputID,\n          )}\n          aria-label={clsx(\"End date\", ariaLabel)}\n          id={endInputID}\n          className={withBaseName(\"input\")}\n          disabled={isDisabled}\n          readOnly={isReadOnly}\n          ref={handleEndInputRef}\n          tabIndex={isDisabled ? -1 : 0}\n          placeholder={placeholder}\n          value={\n            isReadOnly && !dateValue?.endDate\n              ? emptyReadOnlyMarker\n              : (dateValue.endDate ??\n                dateAdapter.format(undefined, format, locale))\n          }\n          {...restEndInputProps}\n          onBlur={handleEndInputBlur}\n          onChange={handleEndInputChange}\n          onKeyDown={handleEndInputKeyDown}\n          onFocus={!isDisabled ? handleEndInputFocus : undefined}\n          required={endInputIsRequired}\n        />\n        <div className={withBaseName(\"endAdornmentContainer\")}>\n          {!isDisabled && !isReadOnly && validationStatus && (\n            <StatusAdornment status={validationStatus} />\n          )}\n          {endAdornment}\n        </div>\n        <div className={withBaseName(\"activationIndicator\")} />\n      </div>\n    );\n  },\n);\n"],"names":["makePrefixer","DateParserField","forwardRef","useLocalization","useRef","useForkRef","useId","useWindow","useComponentCssInjection","dateInputCss","dateValue","date","useControlled","useMemo","useEffect","useState","useFormFieldProps","jsxs","clsx","jsx","StatusAdornment"],"mappings":"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"}

package/dist-cjs/date-input/DateInputSingle.js

@@ -0,0 +1,216 @@
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var core = require('@salt-ds/core');
+var styles = require('@salt-ds/styles');
+var window = require('@salt-ds/window');
+var clsx = require('clsx');
+var react = require('react');
+var LocalizationProvider = require('../localization-provider/LocalizationProvider.js');
+var DateInput = require('./DateInput.css.js');
+
+const withBaseName = core.makePrefixer("saltDateInput");
+const DateInputSingle = react.forwardRef(
+  (props, ref) => {
+    const { dateAdapter } = LocalizationProvider.useLocalization();
+    const {
+      bordered = false,
+      className,
+      disabled,
+      "aria-label": ariaLabel,
+      date: dateProp,
+      defaultDate,
+      onDateChange,
+      value: valueProp,
+      locale,
+      format = "DD MMM YYYY",
+      defaultValue = dateAdapter.format(void 0, format, locale),
+      onChange,
+      onClick,
+      emptyReadOnlyMarker = "\u2014",
+      endAdornment,
+      inputProps = {},
+      inputRef: inputRefProp = null,
+      parse: parseProp,
+      placeholder = format.toLowerCase(),
+      readOnly: readOnlyProp,
+      startAdornment,
+      validationStatus: validationStatusProp,
+      variant = "primary",
+      onDateValueChange,
+      ...rest
+    } = props;
+    const wrapperRef = react.useRef(null);
+    const handleWrapperRef = core.useForkRef(ref, wrapperRef);
+    const innerInputRef = react.useRef(null);
+    const handleInputRef = core.useForkRef(
+      innerInputRef,
+      inputRefProp
+    );
+    const inputId = core.useId();
+    const targetWindow = window.useWindow();
+    styles.useComponentCssInjection({
+      testId: "salt-date-input-single",
+      css: DateInput,
+      window: targetWindow
+    });
+    const [date, setDate] = core.useControlled({
+      controlled: dateProp,
+      default: defaultDate,
+      name: "DateInputSingle",
+      state: "date"
+    });
+    const [dateValue, setDateValue] = core.useControlled({
+      controlled: valueProp,
+      default: defaultValue,
+      name: "DateInputSingle",
+      state: "dateValue"
+    });
+    const lastAppliedValue = react.useRef(dateValue);
+    const preservedTime = react.useRef(null);
+    preservedTime.current = dateAdapter.isValid(date) ? dateAdapter.getTime(date) : null;
+    react.useEffect(() => {
+      const formattedValue = dateAdapter.format(date, format, locale);
+      const hasValueChanged = formattedValue !== dateValue;
+      if (
+        // don't want to reset "error" input values
+        (dateAdapter.isValid(date) || date === null) && hasValueChanged
+      ) {
+        lastAppliedValue.current = formattedValue;
+        setDateValue(formattedValue);
+        onDateValueChange == null ? void 0 : onDateValueChange(null, formattedValue);
+      }
+    }, [date, dateAdapter.format, format, locale]);
+    const [focused, setFocused] = react.useState(false);
+    const {
+      a11yProps: {
+        "aria-describedby": formFieldDescribedBy,
+        "aria-labelledby": formFieldLabelledBy
+      } = {},
+      disabled: formFieldDisabled,
+      readOnly: formFieldReadOnly,
+      necessity: formFieldRequired,
+      validationStatus: formFieldValidationStatus
+    } = core.useFormFieldProps();
+    const isReadOnly = readOnlyProp || formFieldReadOnly;
+    const isDisabled = disabled || formFieldDisabled;
+    const validationStatus = formFieldValidationStatus ?? validationStatusProp;
+    const {
+      "aria-describedby": dateInputDescribedBy,
+      "aria-labelledby": dateInputLabelledBy,
+      onBlur: inputPropsOnBlur,
+      onChange: inputPropsOnChange,
+      onKeyDown: inputPropsOnKeyDown,
+      onFocus: inputPropsOnFocus,
+      required: dateInputPropsRequired,
+      ...restDateInputProps
+    } = inputProps;
+    const isRequired = formFieldRequired ? ["required", "asterisk"].includes(formFieldRequired) : dateInputPropsRequired;
+    const apply = (event) => {
+      const parse = parseProp ?? dateAdapter.parse.bind(dateAdapter);
+      const parseResult = parse(dateValue ?? "", format, locale);
+      let { date: parsedDate, ...parseDetails } = parseResult;
+      const formattedValue = dateAdapter.format(parsedDate, format, locale);
+      const hasValueChanged = formattedValue !== dateValue;
+      if (dateAdapter.isValid(parsedDate) && hasValueChanged) {
+        setDateValue(formattedValue);
+        onDateValueChange == null ? void 0 : onDateValueChange(event, formattedValue);
+      }
+      setDate(parsedDate);
+      if (lastAppliedValue.current !== dateValue) {
+        if (dateAdapter.isValid(parsedDate) && preservedTime.current) {
+          parsedDate = dateAdapter.set(parsedDate, preservedTime.current);
+        }
+        onDateChange == null ? void 0 : onDateChange(event, parsedDate, parseDetails);
+      }
+      lastAppliedValue.current = dateAdapter.isValid(parsedDate) ? formattedValue : dateValue;
+    };
+    const handleChange = (event) => {
+      const newDateValue = event.target.value;
+      setDateValue(newDateValue);
+      inputPropsOnChange == null ? void 0 : inputPropsOnChange(event);
+      onChange == null ? void 0 : onChange(event);
+      onDateValueChange == null ? void 0 : onDateValueChange(event, newDateValue);
+    };
+    const handleFocus = (event) => {
+      setFocused(true);
+      inputPropsOnFocus == null ? void 0 : inputPropsOnFocus(event);
+    };
+    const handleBlur = (event) => {
+      setFocused(false);
+      apply(event);
+      inputPropsOnBlur == null ? void 0 : inputPropsOnBlur(event);
+    };
+    const handleKeyDown = (event) => {
+      if (event.key === "Enter") {
+        apply(event);
+      }
+      inputPropsOnKeyDown == null ? void 0 : inputPropsOnKeyDown(event);
+    };
+    const handleClick = (event) => {
+      var _a;
+      if (event.target === wrapperRef.current) {
+        (_a = innerInputRef == null ? void 0 : innerInputRef.current) == null ? void 0 : _a.focus();
+      }
+      onClick == null ? void 0 : onClick(event);
+    };
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        className: clsx.clsx(
+          withBaseName(),
+          withBaseName(variant),
+          {
+            [withBaseName("focused")]: !isDisabled && focused,
+            [withBaseName("disabled")]: isDisabled,
+            [withBaseName("readOnly")]: isReadOnly,
+            [withBaseName(validationStatus ?? "")]: validationStatus,
+            [withBaseName("bordered")]: bordered
+          },
+          className
+        ),
+        ref: handleWrapperRef,
+        onClick: handleClick,
+        ...rest,
+        children: [
+          startAdornment && /* @__PURE__ */ jsxRuntime.jsx("div", { className: withBaseName("startAdornmentContainer"), children: startAdornment }),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "input",
+            {
+              autoComplete: "off",
+              "aria-describedby": clsx.clsx(formFieldDescribedBy, dateInputDescribedBy),
+              "aria-labelledby": clsx.clsx(
+                formFieldLabelledBy,
+                dateInputLabelledBy,
+                inputId
+              ),
+              "aria-label": clsx.clsx("Selected date", ariaLabel),
+              id: inputId,
+              className: withBaseName("input"),
+              disabled: isDisabled,
+              readOnly: isReadOnly,
+              ref: handleInputRef,
+              tabIndex: isDisabled ? -1 : 0,
+              placeholder,
+              value: isReadOnly && !dateValue ? emptyReadOnlyMarker : dateValue,
+              ...restDateInputProps,
+              onBlur: handleBlur,
+              onChange: handleChange,
+              onKeyDown: handleKeyDown,
+              onFocus: !isDisabled ? handleFocus : void 0,
+              required: isRequired
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: withBaseName("endAdornmentContainer"), children: [
+            !isDisabled && !isReadOnly && validationStatus && /* @__PURE__ */ jsxRuntime.jsx(core.StatusAdornment, { status: validationStatus }),
+            endAdornment
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsx("div", { className: withBaseName("activationIndicator") })
+        ]
+      }
+    );
+  }
+);
+
+exports.DateInputSingle = DateInputSingle;
+//# sourceMappingURL=DateInputSingle.js.map