@kaizen/components 0.0.0-canary-bump-react-intl-20230830002428 → 0.0.0-canary-cg-test-20231009053130

package/dist/esm/packages/components/src/FilterDateRangePicker/subcomponents/FilterDateRangePickerField/FilterDateRangePickerField.js

@@ -0,0 +1,167 @@
+import { __rest, __assign } from '../../../../../../node_modules/tslib/tslib.es6.js';
+import React, { useReducer, useEffect } from 'react';
+import { useIntl } from '@cultureamp/i18n-react-intl';
+import classnames from 'classnames';
+import { CalendarRange } from '@kaizen/date-picker/src/_subcomponents/Calendar';
+import { formatDateAsText } from '@kaizen/date-picker/src/utils/formatDateAsText';
+import { getLocale } from '@kaizen/date-picker/src/utils/getLocale';
+import { isInvalidDate } from '@kaizen/date-picker/src/utils/isInvalidDate';
+import { parseDateFromTextFormatValue } from '@kaizen/date-picker/src/utils/parseDateFromTextFormatValue';
+import { useDateInputHandlers } from '../../../FilterDatePicker/hooks/useDateInputHandlers.js';
+import { DateRangeInputField } from '../DateRangeInputField/DateRangeInputField.js';
+import { filterDatePickerFieldReducer } from './filterDateRangePickerFieldReducer.js';
+import { useEndDateValidation } from './hooks/useEndDateValidation.js';
+import { useStartDateValidation } from './hooks/useStartDateValidation.js';
+import { isValidRange } from './utils/isValidRange.js';
+import styles from './FilterDateRangePickerField.module.scss.js';
+
+var FilterDateRangePickerField = function(_a) {
+  var id = _a.id, label = _a.label, propsLocale = _a.locale, defaultMonth = _a.defaultMonth, selectedRange = _a.selectedRange, onRangeChange = _a.onRangeChange, disabledDays = _a.disabledDays, inputStartDateProps = _a.inputStartDateProps, inputEndDateProps = _a.inputEndDateProps, description = _a.description, validationMessage = _a.validationMessage, onValidate = _a.onValidate, classNameOverride = _a.classNameOverride, restProps = __rest(_a, ["id", "label", "locale", "defaultMonth", "selectedRange", "onRangeChange", "disabledDays", "inputStartDateProps", "inputEndDateProps", "description", "validationMessage", "onValidate", "classNameOverride"]);
+  var formatMessage = useIntl().formatMessage;
+  var locale = getLocale(propsLocale);
+  var translatedDateFrom = formatMessage({
+    id: "filterDateRangePicker.dateFrom",
+    defaultMessage: "Date from",
+    description: "Label for the 'Date from' field"
+  });
+  var translatedDateTo = formatMessage({
+    id: "filterDateRangePicker.dateTo",
+    defaultMessage: "Date to",
+    description: "Label for the 'date to' field"
+  });
+  var inputStartDateLabel = (inputStartDateProps === null || inputStartDateProps === void 0 ? void 0 : inputStartDateProps.labelText) || translatedDateFrom;
+  var inputEndDateLabel = (inputEndDateProps === null || inputEndDateProps === void 0 ? void 0 : inputEndDateProps.labelText) || translatedDateTo;
+  var transformDateToInputValue = function(date) {
+    return date ? formatDateAsText(date, disabledDays, locale) : "";
+  };
+  var handleDateRangeChange = function(dateRange) {
+    onRangeChange(dateRange);
+  };
+  var dateStartValidation = useStartDateValidation({
+    inputLabel: inputStartDateLabel,
+    disabledDays,
+    validationMessage: validationMessage === null || validationMessage === void 0 ? void 0 : validationMessage.dateStart,
+    onValidate: onValidate === null || onValidate === void 0 ? void 0 : onValidate.dateStart
+  });
+  var dateEndValidation = useEndDateValidation({
+    inputLabel: inputEndDateLabel,
+    disabledDays,
+    validationMessage: validationMessage === null || validationMessage === void 0 ? void 0 : validationMessage.dateEnd,
+    onValidate: onValidate === null || onValidate === void 0 ? void 0 : onValidate.dateEnd
+  });
+  var validateStartDate = function(date, inputValue) {
+    return dateStartValidation.validateDate({
+      date,
+      inputValue
+    });
+  };
+  var validateEndDate = function(date, inputValue) {
+    return dateEndValidation.validateDate({
+      endDate: date,
+      endDateInputValue: inputValue,
+      startDate: selectedRange === null || selectedRange === void 0 ? void 0 : selectedRange.from,
+      startDateFieldLabel: inputStartDateLabel
+    });
+  };
+  var _b = useReducer(filterDatePickerFieldReducer, {
+    selectedStartDate: selectedRange === null || selectedRange === void 0 ? void 0 : selectedRange.from,
+    selectedEndDate: selectedRange === null || selectedRange === void 0 ? void 0 : selectedRange.to,
+    inputStartValue: transformDateToInputValue(selectedRange === null || selectedRange === void 0 ? void 0 : selectedRange.from),
+    inputEndValue: transformDateToInputValue(selectedRange === null || selectedRange === void 0 ? void 0 : selectedRange.to),
+    startMonth: (selectedRange === null || selectedRange === void 0 ? void 0 : selectedRange.from) && !isInvalidDate(selectedRange.from) ? selectedRange.from : defaultMonth || /* @__PURE__ */ new Date()
+  }), state = _b[0], dispatch = _b[1];
+  var inputStartDateHandlers = useDateInputHandlers(__assign({ locale, disabledDays, setInputValue: function(value) {
+    dispatch({
+      type: "update_input_start_field",
+      inputValue: value
+    });
+  }, onDateChange: function(date) {
+    var newDate = validateStartDate(date, state.inputStartValue);
+    var endDate = parseDateFromTextFormatValue(state.inputEndValue, locale);
+    var isRangeValid = isValidRange(newDate, endDate);
+    dispatch({
+      type: "update_selected_start_date",
+      date: newDate
+    });
+    dispatch({
+      type: "update_selected_end_date",
+      date: isRangeValid ? endDate : void 0
+    });
+    handleDateRangeChange({
+      from: newDate,
+      to: isRangeValid ? endDate : void 0
+    });
+    if (newDate && endDate && !isInvalidDate(endDate)) {
+      dateEndValidation.validateEndDateBeforeStartDate({
+        startDate: newDate,
+        startDateFieldLabel: inputStartDateLabel,
+        endDate,
+        endDateInputValue: state.inputEndValue
+      });
+    }
+  } }, inputStartDateProps));
+  var inputEndDateHandlers = useDateInputHandlers(__assign({ locale, disabledDays, setInputValue: function(value) {
+    dispatch({
+      type: "update_input_end_field",
+      inputValue: value
+    });
+  }, onDateChange: function(date) {
+    var startDate = state.selectedStartDate;
+    var newEndDate = validateEndDate(date, state.inputEndValue);
+    var isRangeValid = isValidRange(startDate, newEndDate);
+    dispatch({
+      type: "update_selected_end_date",
+      date: isRangeValid ? newEndDate : void 0
+    });
+    handleDateRangeChange({
+      from: startDate,
+      to: isRangeValid ? newEndDate : void 0
+    });
+  } }, inputEndDateProps));
+  var handleCalendarSelectRange = function(range) {
+    var inputStartValue = transformDateToInputValue(range === null || range === void 0 ? void 0 : range.from);
+    var inputEndValue = transformDateToInputValue(range === null || range === void 0 ? void 0 : range.to);
+    var newStartDate = validateStartDate(range === null || range === void 0 ? void 0 : range.from, inputStartValue);
+    var newEndDate = validateEndDate(range === null || range === void 0 ? void 0 : range.to, inputEndValue);
+    dispatch({
+      type: "update_selected_start_date",
+      date: newStartDate,
+      inputValue: inputStartValue
+    });
+    dispatch({
+      type: "update_selected_end_date",
+      date: newEndDate,
+      inputValue: inputEndValue
+    });
+    handleDateRangeChange({ from: newStartDate, to: newEndDate });
+  };
+  useEffect(function() {
+    var newStartDate = validateStartDate(selectedRange === null || selectedRange === void 0 ? void 0 : selectedRange.from, state.inputStartValue);
+    var newEndDate = validateEndDate(selectedRange === null || selectedRange === void 0 ? void 0 : selectedRange.to, state.inputEndValue);
+    if (newStartDate && !isValidRange(newStartDate, newEndDate)) {
+      dispatch({
+        type: "update_selected_end_date",
+        date: void 0
+      });
+    }
+    handleDateRangeChange({ from: newStartDate, to: newEndDate });
+  }, []);
+  return React.createElement(
+    "div",
+    __assign({ className: classnames(styles.filterDateRangePickerField, classNameOverride) }, restProps),
+    React.createElement(DateRangeInputField, { id: "".concat(id, "--input"), legend: label, inputStartDateProps: __assign(__assign({ labelText: inputStartDateLabel, value: state.inputStartValue }, inputStartDateProps), inputStartDateHandlers), inputEndDateProps: __assign(__assign({ labelText: inputEndDateLabel, value: state.inputEndValue }, inputEndDateProps), inputEndDateHandlers), locale, description, validationMessage: {
+      dateStart: dateStartValidation.validationMessage,
+      dateEnd: dateEndValidation.validationMessage
+    }, classNameOverride: styles.dateRangeInputField }),
+    React.createElement(CalendarRange, { disabled: disabledDays, locale, selected: {
+      from: state.selectedStartDate,
+      to: state.selectedEndDate
+    }, onSelect: handleCalendarSelectRange, month: state.startMonth, onMonthChange: function(value) {
+      return dispatch({ type: "navigate_months", date: value });
+    } })
+  );
+};
+FilterDateRangePickerField.displayName = "FilterDateRangePickerField";
+
+export { FilterDateRangePickerField };
+//# sourceMappingURL=FilterDateRangePickerField.js.map

package/dist/esm/packages/components/src/FilterDateRangePicker/subcomponents/FilterDateRangePickerField/FilterDateRangePickerField.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FilterDateRangePickerField.js","sources":["../../../../../../../../src/FilterDateRangePicker/subcomponents/FilterDateRangePickerField/FilterDateRangePickerField.tsx"],"sourcesContent":["import React, { useEffect, HTMLAttributes, useReducer } from \"react\"\nimport { useIntl } from \"@cultureamp/i18n-react-intl\"\nimport classnames from \"classnames\"\nimport {\n  CalendarRange,\n  CalendarRangeProps,\n} from \"@kaizen/date-picker/src/_subcomponents/Calendar\"\nimport { formatDateAsText } from \"@kaizen/date-picker/src/utils/formatDateAsText\"\nimport { getLocale } from \"@kaizen/date-picker/src/utils/getLocale\"\nimport { isInvalidDate } from \"@kaizen/date-picker/src/utils/isInvalidDate\"\nimport { parseDateFromTextFormatValue } from \"@kaizen/date-picker/src/utils/parseDateFromTextFormatValue\"\nimport { DateValidationResponse } from \"~components/FilterDatePicker\"\nimport { useDateInputHandlers } from \"~components/FilterDatePicker/hooks/useDateInputHandlers\"\nimport { DataAttributes } from \"~types/DataAttributes\"\nimport {\n  DateRange,\n  DisabledDays,\n  FilterDateSupportedLocales,\n} from \"~types/DatePicker\"\nimport { OverrideClassName } from \"~types/OverrideClassName\"\nimport {\n  DateRangeInputField,\n  DateRangeInputFieldProps,\n} from \"../DateRangeInputField\"\nimport { filterDatePickerFieldReducer } from \"./filterDateRangePickerFieldReducer\"\nimport { useEndDateValidation } from \"./hooks/useEndDateValidation\"\nimport { useStartDateValidation } from \"./hooks/useStartDateValidation\"\nimport { DateRangeFieldValidationMessage } from \"./types\"\nimport { isValidRange } from \"./utils/isValidRange\"\nimport styles from \"./FilterDateRangePickerField.module.scss\"\n\ntype InputStartDateProps = DateRangeInputFieldProps[\"inputStartDateProps\"]\ntype InputEndDateProps = DateRangeInputFieldProps[\"inputEndDateProps\"]\n\ntype FilterInputProps<InputProps> = Omit<Partial<InputProps>, \"value\"> &\n  DataAttributes\n\nexport type FilterDateRangePickerFieldProps = {\n  id: string\n  label: string\n  locale: FilterDateSupportedLocales\n  /**\n   * Sets first displayed month to month of provided date if there isn't a date set.\n   */\n  defaultMonth?: CalendarRangeProps[\"defaultMonth\"]\n  /**\n   * The date range passed in from the consumer that renders in the inputs and calendar.\n   */\n  selectedRange: DateRange | undefined\n  /**\n   * Callback when date is updated either by the calendar picker or by typing and blurring.\n   * Date will return as `undefined` if empty, invalid or disabled.\n   */\n  onRangeChange: (range: DateRange | undefined) => void\n  /**\n   * See https://react-day-picker.js.org/api/types/Matcher\n   */\n  disabledDays?: DisabledDays\n  inputStartDateProps?: FilterInputProps<InputStartDateProps>\n  inputEndDateProps?: FilterInputProps<InputEndDateProps>\n  /**\n   * Custom description to provide extra context (input format help text remains).\n   */\n  description?: DateRangeInputFieldProps[\"description\"]\n  validationMessage?: DateRangeFieldValidationMessage\n  /**\n   * Callback when a date is selected. Utilises internal validation if not set.\n   */\n  onValidate?: {\n    dateStart?: (validationResponse: DateValidationResponse) => void\n    dateEnd?: (validationResponse: DateValidationResponse) => void\n  }\n} & OverrideClassName<HTMLAttributes<HTMLDivElement>>\n\nexport const FilterDateRangePickerField = ({\n  id,\n  label,\n  locale: propsLocale,\n  defaultMonth,\n  selectedRange,\n  onRangeChange,\n  disabledDays,\n  inputStartDateProps,\n  inputEndDateProps,\n  description,\n  validationMessage,\n  onValidate,\n  classNameOverride,\n  ...restProps\n}: FilterDateRangePickerFieldProps): JSX.Element => {\n  const { formatMessage } = useIntl()\n  const locale = getLocale(propsLocale)\n\n  const translatedDateFrom = formatMessage({\n    id: \"filterDateRangePicker.dateFrom\",\n    defaultMessage: \"Date from\",\n    description: \"Label for the 'Date from' field\",\n  })\n  const translatedDateTo = formatMessage({\n    id: \"filterDateRangePicker.dateTo\",\n    defaultMessage: \"Date to\",\n    description: \"Label for the 'date to' field\",\n  })\n  const inputStartDateLabel =\n    inputStartDateProps?.labelText || translatedDateFrom\n  const inputEndDateLabel = inputEndDateProps?.labelText || translatedDateTo\n\n  const transformDateToInputValue = (date: Date | undefined): string =>\n    date ? formatDateAsText(date, disabledDays, locale) : \"\"\n\n  const handleDateRangeChange = (dateRange: DateRange | undefined): void => {\n    onRangeChange(dateRange)\n  }\n\n  const dateStartValidation = useStartDateValidation({\n    inputLabel: inputStartDateLabel,\n    disabledDays,\n    validationMessage: validationMessage?.dateStart,\n    onValidate: onValidate?.dateStart,\n  })\n\n  const dateEndValidation = useEndDateValidation({\n    inputLabel: inputEndDateLabel,\n    disabledDays,\n    validationMessage: validationMessage?.dateEnd,\n    onValidate: onValidate?.dateEnd,\n  })\n\n  const validateStartDate = (\n    date: Date | undefined,\n    inputValue: string\n  ): Date | undefined =>\n    dateStartValidation.validateDate({\n      date,\n      inputValue,\n    })\n\n  const validateEndDate = (\n    date: Date | undefined,\n    inputValue: string\n  ): Date | undefined =>\n    dateEndValidation.validateDate({\n      endDate: date,\n      endDateInputValue: inputValue,\n      startDate: selectedRange?.from,\n      startDateFieldLabel: inputStartDateLabel,\n    })\n\n  const [state, dispatch] = useReducer(filterDatePickerFieldReducer, {\n    selectedStartDate: selectedRange?.from,\n    selectedEndDate: selectedRange?.to,\n    inputStartValue: transformDateToInputValue(selectedRange?.from),\n    inputEndValue: transformDateToInputValue(selectedRange?.to),\n    startMonth:\n      selectedRange?.from && !isInvalidDate(selectedRange.from)\n        ? selectedRange.from\n        : defaultMonth || new Date(),\n  })\n\n  const inputStartDateHandlers = useDateInputHandlers({\n    locale,\n    disabledDays,\n    setInputValue: value => {\n      dispatch({\n        type: \"update_input_start_field\",\n        inputValue: value,\n      })\n    },\n    onDateChange: date => {\n      const newDate = validateStartDate(date, state.inputStartValue)\n\n      // We need to parse the date from the input field due to the\n      // state.selectedEndDate being set to undefined whenever range is invalid\n      const endDate = parseDateFromTextFormatValue(state.inputEndValue, locale)\n      const isRangeValid = isValidRange(newDate, endDate)\n\n      dispatch({\n        type: \"update_selected_start_date\",\n        date: newDate,\n      })\n\n      // If the range ends up being invalid due to the change in start date\n      // we need to remove the end date as its now deemed invalid.\n      dispatch({\n        type: \"update_selected_end_date\",\n        date: isRangeValid ? endDate : undefined,\n      })\n\n      handleDateRangeChange({\n        from: newDate,\n        to: isRangeValid ? endDate : undefined,\n      })\n\n      if (newDate && endDate && !isInvalidDate(endDate)) {\n        // Update validation messages\n        dateEndValidation.validateEndDateBeforeStartDate({\n          startDate: newDate,\n          startDateFieldLabel: inputStartDateLabel,\n          endDate,\n          endDateInputValue: state.inputEndValue,\n        })\n      }\n    },\n    ...inputStartDateProps,\n  })\n\n  const inputEndDateHandlers = useDateInputHandlers({\n    locale,\n    disabledDays,\n    setInputValue: value => {\n      dispatch({\n        type: \"update_input_end_field\",\n        inputValue: value,\n      })\n    },\n    onDateChange: date => {\n      const startDate = state.selectedStartDate\n      const newEndDate = validateEndDate(date, state.inputEndValue)\n      const isRangeValid = isValidRange(startDate, newEndDate)\n\n      dispatch({\n        type: \"update_selected_end_date\",\n        date: isRangeValid ? newEndDate : undefined,\n      })\n\n      handleDateRangeChange({\n        from: startDate,\n        to: isRangeValid ? newEndDate : undefined,\n      })\n    },\n    ...inputEndDateProps,\n  })\n\n  const handleCalendarSelectRange: CalendarRangeProps[\"onSelect\"] = range => {\n    const inputStartValue = transformDateToInputValue(range?.from)\n    const inputEndValue = transformDateToInputValue(range?.to)\n\n    const newStartDate = validateStartDate(range?.from, inputStartValue)\n    const newEndDate = validateEndDate(range?.to, inputEndValue)\n\n    dispatch({\n      type: \"update_selected_start_date\",\n      date: newStartDate,\n      inputValue: inputStartValue,\n    })\n\n    dispatch({\n      type: \"update_selected_end_date\",\n      date: newEndDate,\n      inputValue: inputEndValue,\n    })\n\n    handleDateRangeChange({ from: newStartDate, to: newEndDate })\n  }\n\n  useEffect(() => {\n    const newStartDate = validateStartDate(\n      selectedRange?.from,\n      state.inputStartValue\n    )\n    const newEndDate = validateEndDate(selectedRange?.to, state.inputEndValue)\n\n    if (newStartDate && !isValidRange(newStartDate, newEndDate)) {\n      dispatch({\n        type: \"update_selected_end_date\",\n        date: undefined,\n      })\n    }\n\n    handleDateRangeChange({ from: newStartDate, to: newEndDate })\n  }, [])\n\n  return (\n    <div\n      className={classnames(\n        styles.filterDateRangePickerField,\n        classNameOverride\n      )}\n      {...restProps}\n    >\n      <DateRangeInputField\n        id={`${id}--input`}\n        legend={label}\n        inputStartDateProps={{\n          labelText: inputStartDateLabel,\n          value: state.inputStartValue,\n          ...inputStartDateProps,\n          // The below props extend the values from inputStartDateProps, therefore must be below the spread\n          ...inputStartDateHandlers,\n        }}\n        inputEndDateProps={{\n          labelText: inputEndDateLabel,\n          value: state.inputEndValue,\n          ...inputEndDateProps,\n          // The below props extend the values from inputEndDateProps, therefore must be below the spread\n          ...inputEndDateHandlers,\n        }}\n        locale={locale}\n        description={description}\n        validationMessage={{\n          dateStart: dateStartValidation.validationMessage,\n          dateEnd: dateEndValidation.validationMessage,\n        }}\n        classNameOverride={styles.dateRangeInputField}\n      />\n      <CalendarRange\n        disabled={disabledDays}\n        locale={locale}\n        selected={{\n          from: state.selectedStartDate,\n          to: state.selectedEndDate,\n        }}\n        onSelect={handleCalendarSelectRange}\n        month={state.startMonth}\n        onMonthChange={(value: Date) =>\n          dispatch({ type: \"navigate_months\", date: value })\n        }\n      />\n    </div>\n  )\n}\n\nFilterDateRangePickerField.displayName = \"FilterDateRangePickerField\"\n"],"names":[],"mappings":"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"}

package/dist/esm/packages/components/src/FilterDateRangePicker/subcomponents/FilterDateRangePickerField/FilterDateRangePickerField.module.scss.js

@@ -0,0 +1,4 @@
+var styles = {"filterDateRangePickerField":"FilterDateRangePickerField-module_filterDateRangePickerField__1gCr0","dateRangeInputField":"FilterDateRangePickerField-module_dateRangeInputField__XFvb-"};
+
+export { styles as default };
+//# sourceMappingURL=FilterDateRangePickerField.module.scss.js.map

package/dist/esm/packages/components/src/FilterDateRangePicker/subcomponents/FilterDateRangePickerField/FilterDateRangePickerField.module.scss.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FilterDateRangePickerField.module.scss.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}

package/dist/esm/packages/components/src/FilterDateRangePicker/subcomponents/FilterDateRangePickerField/filterDateRangePickerFieldReducer.js

@@ -0,0 +1,20 @@
+import { __assign } from '../../../../../../node_modules/tslib/tslib.es6.js';
+import { isInvalidDate } from '@kaizen/date-picker';
+
+var filterDatePickerFieldReducer = function(state, action) {
+  switch (action.type) {
+    case "update_selected_start_date":
+      return __assign(__assign({}, state), { selectedStartDate: action.date, inputStartValue: action.inputValue === void 0 ? state.inputStartValue : action.inputValue, startMonth: action.date && !isInvalidDate(action.date) ? action.date : /* @__PURE__ */ new Date() });
+    case "update_selected_end_date":
+      return __assign(__assign({}, state), { selectedEndDate: action.date, inputEndValue: action.inputValue === void 0 ? state.inputEndValue : action.inputValue });
+    case "navigate_months":
+      return __assign(__assign({}, state), { startMonth: action.date && !isInvalidDate(action.date) ? action.date : /* @__PURE__ */ new Date() });
+    case "update_input_start_field":
+      return __assign(__assign({}, state), { inputStartValue: action.inputValue });
+    case "update_input_end_field":
+      return __assign(__assign({}, state), { inputEndValue: action.inputValue });
+  }
+};
+
+export { filterDatePickerFieldReducer };
+//# sourceMappingURL=filterDateRangePickerFieldReducer.js.map

package/dist/esm/packages/components/src/FilterDateRangePicker/subcomponents/FilterDateRangePickerField/filterDateRangePickerFieldReducer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"filterDateRangePickerFieldReducer.js","sources":["../../../../../../../../src/FilterDateRangePicker/subcomponents/FilterDateRangePickerField/filterDateRangePickerFieldReducer.tsx"],"sourcesContent":["import { isInvalidDate } from \"@kaizen/date-picker\"\n\ntype DateRangeFieldActions =\n  | {\n      type: \"update_selected_start_date\"\n      date: Date | undefined\n      inputValue?: string\n    }\n  | {\n      type: \"update_selected_end_date\"\n      date: Date | undefined\n      inputValue?: string\n    }\n  | {\n      type: \"navigate_months\"\n      date: Date | undefined\n    }\n  | {\n      type: \"update_input_start_field\"\n      inputValue: string\n    }\n  | {\n      type: \"update_input_end_field\"\n      inputValue: string\n    }\n\ntype FilterDateRangePickerState = {\n  selectedStartDate: Date | undefined\n  selectedEndDate: Date | undefined\n  inputStartValue: string\n  inputEndValue: string\n  startMonth: Date\n}\n\nexport const filterDatePickerFieldReducer = (\n  state: FilterDateRangePickerState,\n  action: DateRangeFieldActions\n): FilterDateRangePickerState => {\n  switch (action.type) {\n    case \"update_selected_start_date\":\n      return {\n        ...state,\n        selectedStartDate: action.date,\n        inputStartValue:\n          action.inputValue === undefined\n            ? state.inputStartValue\n            : action.inputValue,\n        startMonth:\n          action.date && !isInvalidDate(action.date) ? action.date : new Date(),\n      }\n    case \"update_selected_end_date\":\n      return {\n        ...state,\n        selectedEndDate: action.date,\n        inputEndValue:\n          action.inputValue === undefined\n            ? state.inputEndValue\n            : action.inputValue,\n      }\n    case \"navigate_months\":\n      return {\n        ...state,\n        startMonth:\n          action.date && !isInvalidDate(action.date) ? action.date : new Date(),\n      }\n    case \"update_input_start_field\":\n      return {\n        ...state,\n        inputStartValue: action.inputValue,\n      }\n    case \"update_input_end_field\":\n      return {\n        ...state,\n        inputEndValue: action.inputValue,\n      }\n  }\n}\n"],"names":[],"mappings":";;;AAkCa,IAAA,4BAAA,GAA+B,SAC1C,KAAA,EACA,MAA6B,EAAA;AAE7B,EAAA,QAAQ,OAAO,IAAM;AAAA,IACnB,KAAK,4BAAA;AACH,MAAA,OAAA,QAAA,CAAA,QAAA,CAAA,EAAA,EACK,KAAK,CAAA,EAAA,EACR,iBAAA,EAAmB,MAAO,CAAA,IAAA,EAC1B,eACE,EAAA,MAAA,CAAO,eAAe,KAClB,CAAA,GAAA,KAAA,CAAM,eACN,GAAA,MAAA,CAAO,UACb,EAAA,UAAA,EACE,MAAO,CAAA,IAAA,IAAQ,CAAC,aAAc,CAAA,MAAA,CAAO,IAAI,CAAA,GAAI,MAAO,CAAA,IAAA,mBAAW,IAAA,IAAA,IAClE,CAAA,CAAA;AAAA,IACH,KAAK,0BAAA;AACH,MAAA,OAAA,SAAA,QAAA,CAAA,IACK,KAAK,CAAA,EAAA,EACR,eAAiB,EAAA,MAAA,CAAO,IACxB,EAAA,aAAA,EACE,OAAO,UAAe,KAAA,KAAA,CAAA,GAClB,MAAM,aACN,GAAA,MAAA,CAAO,YACd,CAAA,CAAA;AAAA,IACH,KAAK,iBAAA;AACH,MACK,OAAA,QAAA,CAAA,SAAA,EAAA,EAAA,KAAK,CACR,EAAA,EAAA,YACE,MAAO,CAAA,IAAA,IAAQ,CAAC,aAAc,CAAA,MAAA,CAAO,IAAI,CAAI,GAAA,MAAA,CAAO,uBAAW,IAAA,IAAA,IAClE,CAAA,CAAA;AAAA,IACH,KAAK,0BAAA;AACH,MAAA,OAAA,QAAA,CAAA,QAAA,CAAA,EACK,EAAA,KAAK,GACR,EAAA,eAAA,EAAiB,MAAO,CAAA,UAAA,EACzB,CAAA,CAAA;AAAA,IACH,KAAK,wBAAA;AACH,MAAA,OAAA,QAAA,CAAA,QAAA,CAAA,EACK,EAAA,KAAK,GACR,EAAA,aAAA,EAAe,MAAO,CAAA,UAAA,EACvB,CAAA,CAAA;AAAA,GACJ;AACH;;;;"}

package/dist/esm/packages/components/src/FilterDateRangePicker/subcomponents/FilterDateRangePickerField/hooks/useEndDateValidation.js

@@ -0,0 +1,52 @@
+import '../../../../FilterDatePicker/FilterDatePicker.js';
+import '../../../../../../../node_modules/tslib/tslib.es6.js';
+import 'react';
+import 'classnames';
+import 'uuid';
+import '@kaizen/date-picker';
+import { useDateValidation } from '../../../../FilterDatePicker/hooks/useDateValidation.js';
+import '@kaizen/date-picker/src/utils/formatDateAsNumeral';
+import '@kaizen/date-picker/src/utils/isDisabledDate';
+import '@kaizen/date-picker/src/utils/isSelectingDayInCalendar';
+import '@kaizen/date-picker/src/utils/parseDateFromNumeralFormatValue';
+import '@kaizen/date-picker/src/utils/parseDateFromTextFormatValue';
+import '../../../../FilterDatePicker/subcomponents/DateInputField/DateInputField.js';
+import '../../../../LabelledMessage/LabelledMessage.js';
+import '@kaizen/date-picker/src/utils/validateDate';
+import { validateEndDateBeforeStartDate } from '../utils/validateEndDateBeforeStartDate.js';
+
+var useEndDateValidation = function(args) {
+  var _a = useDateValidation(args), validationMessage = _a.validationMessage, validateDate = _a.validateDate, updateValidation = _a.updateValidation;
+  var handleValidateEndDateBeforeStartDate = function(handlerArgs) {
+    var _a2 = validateEndDateBeforeStartDate(handlerArgs), validationResponse = _a2.validationResponse, newDate = _a2.newDate;
+    updateValidation(validationResponse);
+    return newDate;
+  };
+  var validateEndDate = function(_a2) {
+    var endDate = _a2.endDate, endDateInputValue = _a2.endDateInputValue, startDate = _a2.startDate, startDateFieldLabel = _a2.startDateFieldLabel;
+    var _b = validateDate({
+      date: endDate,
+      inputValue: endDateInputValue
+    }), validationResponse = _b.validationResponse, newDate = _b.newDate;
+    if (validationResponse.isValidDate) {
+      if (newDate && startDate) {
+        return handleValidateEndDateBeforeStartDate({
+          startDate,
+          startDateFieldLabel,
+          endDate: newDate,
+          endDateInputValue
+        });
+      }
+    }
+    updateValidation(validationResponse);
+    return newDate;
+  };
+  return {
+    validationMessage,
+    validateDate: validateEndDate,
+    validateEndDateBeforeStartDate: handleValidateEndDateBeforeStartDate
+  };
+};
+
+export { useEndDateValidation };
+//# sourceMappingURL=useEndDateValidation.js.map

package/dist/esm/packages/components/src/FilterDateRangePicker/subcomponents/FilterDateRangePickerField/hooks/useEndDateValidation.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useEndDateValidation.js","sources":["../../../../../../../../../src/FilterDateRangePicker/subcomponents/FilterDateRangePickerField/hooks/useEndDateValidation.ts"],"sourcesContent":["import {\n  useDateValidation,\n  UseDateValidationArgs,\n  ValidationMessage,\n} from \"~components/FilterDatePicker\"\nimport {\n  validateEndDateBeforeStartDate,\n  ValidateEndDateBeforeStartDateArgs,\n} from \"../utils/validateEndDateBeforeStartDate\"\n\nexport type UseEndDateValidationArgs = UseDateValidationArgs\n\nexport type UseEndDateValidationValue = {\n  validationMessage: ValidationMessage | undefined\n  validateDate: (args: {\n    endDate: Date | undefined\n    endDateInputValue: string\n    startDate: Date | undefined\n    startDateFieldLabel: React.ReactNode\n  }) => Date | undefined\n  validateEndDateBeforeStartDate: (\n    args: ValidateEndDateBeforeStartDateArgs\n  ) => Date | undefined\n}\n\nexport const useEndDateValidation = (\n  args: UseEndDateValidationArgs\n): UseEndDateValidationValue => {\n  const { validationMessage, validateDate, updateValidation } =\n    useDateValidation(args)\n\n  const handleValidateEndDateBeforeStartDate: UseEndDateValidationValue[\"validateEndDateBeforeStartDate\"] =\n    handlerArgs => {\n      const { validationResponse, newDate } =\n        validateEndDateBeforeStartDate(handlerArgs)\n      updateValidation(validationResponse)\n      return newDate\n    }\n\n  const validateEndDate: UseEndDateValidationValue[\"validateDate\"] = ({\n    endDate,\n    endDateInputValue,\n    startDate,\n    startDateFieldLabel,\n  }) => {\n    const { validationResponse, newDate } = validateDate({\n      date: endDate,\n      inputValue: endDateInputValue,\n    })\n\n    if (validationResponse.isValidDate) {\n      if (newDate && startDate) {\n        return handleValidateEndDateBeforeStartDate({\n          startDate,\n          startDateFieldLabel,\n          endDate: newDate,\n          endDateInputValue,\n        })\n      }\n    }\n\n    updateValidation(validationResponse)\n    return newDate\n  }\n\n  return {\n    validationMessage,\n    validateDate: validateEndDate,\n    validateEndDateBeforeStartDate: handleValidateEndDateBeforeStartDate,\n  }\n}\n"],"names":["_a"],"mappings":";;;;;;;;;;;;;;;;;AAyBa,IAAA,oBAAA,GAAuB,SAClC,IAA8B,EAAA;AAExB,EAAA,IAAA,EAAA,GACJ,iBAAkB,CAAA,IAAI,CADhB,EAAA,iBAAA,GAAiB,EAAA,CAAA,iBAAA,EAAE,YAAY,GAAA,EAAA,CAAA,YAAE,EAAA,gBAAA;AAGzC,EAAM,IAAA,oCAAA,GACJ,SAAA,WAAW,EAAA;AACH,IAAAA,IAAAA,GAAAA,GACJ,+BAA+B,WAAW,CAAA,EADpC,qBAAkBA,GAAA,CAAA,kBAAA,EAAE,UAAOA,GAAA,CAAA,OAAA,CAAA;AAEnC,IAAA,gBAAA,CAAiB,kBAAkB,CAAA,CAAA;AACnC,IAAO,OAAA,OAAA,CAAA;AAAA,GACT,CAAA;AAEF,EAAM,IAAA,eAAA,GAA6D,SAACA,GAKnE,EAAA;IAJC,IAAA,OAAA,GAAOA,GAAA,CAAA,OAAA,EACP,iBAAiBA,GAAAA,GAAAA,CAAA,mBACjB,SAASA,GAAAA,GAAAA,CAAA,SACT,EAAA,mBAAA,GAAmBA,GAAA,CAAA,mBAAA,CAAA;AAEb,IAAA,IAAA,KAAkC,YAAa,CAAA;AAAA,MACnD,IAAM,EAAA,OAAA;AAAA,MACN,UAAY,EAAA,iBAAA;AAAA,KACb,CAHO,EAAA,kBAAA,GAAkB,EAAA,CAAA,kBAAA,EAAE;AAK5B,IAAA,IAAI,mBAAmB,WAAa,EAAA;AAClC,MAAA,IAAI,WAAW,SAAW,EAAA;AACxB,QAAA,OAAO,oCAAqC,CAAA;AAAA,UAC1C,SAAA;AAAA,UACA,mBAAA;AAAA,UACA,OAAS,EAAA,OAAA;AAAA,UACT,iBAAA;AAAA,SACD,CAAA,CAAA;AAAA,OACF;AAAA,KACF;AAED,IAAA,gBAAA,CAAiB,kBAAkB,CAAA,CAAA;AACnC,IAAO,OAAA,OAAA,CAAA;AAAA,GACT,CAAA;AAEA,EAAO,OAAA;AAAA,IACL,iBAAA;AAAA,IACA,YAAc,EAAA,eAAA;AAAA,IACd,8BAAgC,EAAA,oCAAA;AAAA;AAEpC;;;;"}

package/dist/esm/packages/components/src/FilterDateRangePicker/subcomponents/FilterDateRangePickerField/hooks/useStartDateValidation.js

@@ -0,0 +1,32 @@
+import '../../../../FilterDatePicker/FilterDatePicker.js';
+import '../../../../../../../node_modules/tslib/tslib.es6.js';
+import 'react';
+import 'classnames';
+import 'uuid';
+import '@kaizen/date-picker';
+import { useDateValidation } from '../../../../FilterDatePicker/hooks/useDateValidation.js';
+import '@kaizen/date-picker/src/utils/formatDateAsNumeral';
+import '@kaizen/date-picker/src/utils/isDisabledDate';
+import '@kaizen/date-picker/src/utils/isSelectingDayInCalendar';
+import '@kaizen/date-picker/src/utils/parseDateFromNumeralFormatValue';
+import '@kaizen/date-picker/src/utils/parseDateFromTextFormatValue';
+import '../../../../FilterDatePicker/subcomponents/DateInputField/DateInputField.js';
+import '../../../../LabelledMessage/LabelledMessage.js';
+import '@kaizen/date-picker/src/utils/validateDate';
+
+var useStartDateValidation = function(args) {
+  var _a = useDateValidation(args), validationMessage = _a.validationMessage, validateDate = _a.validateDate, updateValidation = _a.updateValidation;
+  var validateStartDate = function(_a2) {
+    var date = _a2.date, inputValue = _a2.inputValue;
+    var _b = validateDate({ date, inputValue }), validationResponse = _b.validationResponse, newDate = _b.newDate;
+    updateValidation(validationResponse);
+    return newDate;
+  };
+  return {
+    validationMessage,
+    validateDate: validateStartDate
+  };
+};
+
+export { useStartDateValidation };
+//# sourceMappingURL=useStartDateValidation.js.map

package/dist/esm/packages/components/src/FilterDateRangePicker/subcomponents/FilterDateRangePickerField/hooks/useStartDateValidation.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useStartDateValidation.js","sources":["../../../../../../../../../src/FilterDateRangePicker/subcomponents/FilterDateRangePickerField/hooks/useStartDateValidation.ts"],"sourcesContent":["import {\n  useDateValidation,\n  UseDateValidationArgs,\n  ValidationMessage,\n} from \"~components/FilterDatePicker\"\n\nexport type UseStartDateValidationArgs = UseDateValidationArgs\n\nexport type UseStartDateValidationValue = {\n  validationMessage: ValidationMessage | undefined\n  validateDate: (args: {\n    date: Date | undefined\n    inputValue: string\n  }) => Date | undefined\n}\n\nexport const useStartDateValidation = (\n  args: UseStartDateValidationArgs\n): UseStartDateValidationValue => {\n  const { validationMessage, validateDate, updateValidation } =\n    useDateValidation(args)\n\n  const validateStartDate: UseStartDateValidationValue[\"validateDate\"] = ({\n    date,\n    inputValue,\n  }) => {\n    const { validationResponse, newDate } = validateDate({ date, inputValue })\n    updateValidation(validationResponse)\n    return newDate\n  }\n\n  return {\n    validationMessage,\n    validateDate: validateStartDate,\n  }\n}\n"],"names":["_a"],"mappings":";;;;;;;;;;;;;;;;AAgBa,IAAA,sBAAA,GAAyB,SACpC,IAAgC,EAAA;AAE1B,EAAA,IAAA,EAAA,GACJ,iBAAkB,CAAA,IAAI,CADhB,EAAA,iBAAA,GAAiB,EAAA,CAAA,iBAAA,EAAE,YAAY,GAAA,EAAA,CAAA,YAAE,EAAA,gBAAA;AAGzC,EAAM,IAAA,iBAAA,GAAiE,SAACA,GAGvE,EAAA;QAFC,IAAIA,GAAAA,GAAAA,CAAA,IACJ,EAAA,UAAA,GAAUA,GAAA,CAAA,UAAA,CAAA;AAEJ,IAAA,IAAA,EAAA,GAAkC,YAAa,CAAA,EAAE,IAAM,EAAA,UAAA,EAAY,CAAA,EAAjE,0CAAoB,EAAA,OAAA;AAC5B,IAAA,gBAAA,CAAiB,kBAAkB,CAAA,CAAA;AACnC,IAAO,OAAA,OAAA,CAAA;AAAA,GACT,CAAA;AAEA,EAAO,OAAA;AAAA,IACL,iBAAA;AAAA,IACA,YAAc,EAAA,iBAAA;AAAA;AAElB;;;;"}

package/dist/esm/packages/components/src/FilterDateRangePicker/subcomponents/FilterDateRangePickerField/utils/isValidRange.js

@@ -0,0 +1,8 @@
+var isValidRange = function(startDate, endDate) {
+  if (startDate && endDate)
+    return startDate <= endDate;
+  return false;
+};
+
+export { isValidRange };
+//# sourceMappingURL=isValidRange.js.map

package/dist/esm/packages/components/src/FilterDateRangePicker/subcomponents/FilterDateRangePickerField/utils/isValidRange.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"isValidRange.js","sources":["../../../../../../../../../src/FilterDateRangePicker/subcomponents/FilterDateRangePickerField/utils/isValidRange.ts"],"sourcesContent":["export const isValidRange = (\n  startDate: Date | undefined,\n  endDate: Date | undefined\n): boolean => {\n  if (startDate && endDate) return startDate <= endDate\n  return false\n}\n"],"names":[],"mappings":"AAAa,IAAA,YAAA,GAAe,SAC1B,SAAA,EACA,OAAyB,EAAA;AAEzB,EAAA,IAAI,SAAa,IAAA,OAAA;AAAS,IAAA,OAAO,SAAa,IAAA,OAAA,CAAA;AAC9C,EAAO,OAAA,KAAA,CAAA;AACT;;;;"}

package/dist/esm/packages/components/src/FilterDateRangePicker/subcomponents/FilterDateRangePickerField/utils/validateEndDateBeforeStartDate.js

@@ -0,0 +1,32 @@
+import { __assign } from '../../../../../../../node_modules/tslib/tslib.es6.js';
+import { getNodeText } from '../../../../utils/getNodeText.js';
+import { isValidRange } from './isValidRange.js';
+
+var validateEndDateBeforeStartDate = function(_a) {
+  var startDate = _a.startDate, startDateFieldLabel = _a.startDateFieldLabel, endDate = _a.endDate, endDateInputValue = _a.endDateInputValue;
+  var baseResponse = {
+    date: endDate,
+    inputValue: endDateInputValue,
+    validationMessage: void 0,
+    isInvalid: false,
+    isDisabled: false,
+    isEmpty: false,
+    isValidDate: true
+  };
+  if (!isValidRange(startDate, endDate)) {
+    return {
+      validationResponse: __assign(__assign({}, baseResponse), { validationMessage: {
+        status: "error",
+        message: 'Cannot be earlier than the selection in "'.concat(getNodeText(startDateFieldLabel), '"')
+      } }),
+      newDate: endDate
+    };
+  }
+  return {
+    validationResponse: baseResponse,
+    newDate: endDate
+  };
+};
+
+export { validateEndDateBeforeStartDate };
+//# sourceMappingURL=validateEndDateBeforeStartDate.js.map

package/dist/esm/packages/components/src/FilterDateRangePicker/subcomponents/FilterDateRangePickerField/utils/validateEndDateBeforeStartDate.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"validateEndDateBeforeStartDate.js","sources":["../../../../../../../../../src/FilterDateRangePicker/subcomponents/FilterDateRangePickerField/utils/validateEndDateBeforeStartDate.ts"],"sourcesContent":["import React from \"react\"\nimport { DateValidationResponse } from \"~components/FilterDatePicker\"\nimport { getNodeText } from \"../../../../utils/getNodeText\"\nimport { isValidRange } from \"./isValidRange\"\n\nexport type ValidateEndDateBeforeStartDateArgs = {\n  startDate: Date\n  startDateFieldLabel: React.ReactNode\n  endDate: Date\n  endDateInputValue: string\n}\n\nexport type ValidateEndDateBeforeStartDateResponse = {\n  validationResponse: DateValidationResponse\n  newDate: Date | undefined\n}\n\nexport const validateEndDateBeforeStartDate = ({\n  startDate,\n  startDateFieldLabel,\n  endDate,\n  endDateInputValue,\n}: ValidateEndDateBeforeStartDateArgs): ValidateEndDateBeforeStartDateResponse => {\n  const baseResponse = {\n    date: endDate,\n    inputValue: endDateInputValue,\n    validationMessage: undefined,\n    isInvalid: false,\n    isDisabled: false,\n    isEmpty: false,\n    isValidDate: true,\n  }\n\n  if (!isValidRange(startDate, endDate)) {\n    return {\n      validationResponse: {\n        ...baseResponse,\n        validationMessage: {\n          status: \"error\",\n          message: `Cannot be earlier than the selection in \"${getNodeText(\n            startDateFieldLabel\n          )}\"`,\n        },\n      },\n      newDate: endDate,\n    }\n  }\n\n  return {\n    validationResponse: baseResponse,\n    newDate: endDate,\n  }\n}\n"],"names":[],"mappings":";;;;AAiBa,IAAA,8BAAA,GAAiC,SAAC,EAKV,EAAA;EAJnC,IAAA,SAAA,GAAS,EAAA,CAAA,SAAA,EACT,mBAAmB,GAAA,EAAA,CAAA,qBACnB,OAAO,GAAA,EAAA,CAAA,OACP,EAAA,iBAAA,GAAiB,EAAA,CAAA,iBAAA,CAAA;AAEjB,EAAA,IAAM,YAAe,GAAA;AAAA,IACnB,IAAM,EAAA,OAAA;AAAA,IACN,UAAY,EAAA,iBAAA;AAAA,IACZ,iBAAmB,EAAA,KAAA,CAAA;AAAA,IACnB,SAAW,EAAA,KAAA;AAAA,IACX,UAAY,EAAA,KAAA;AAAA,IACZ,OAAS,EAAA,KAAA;AAAA,IACT,WAAa,EAAA,IAAA;AAAA;AAGf,EAAA,IAAI,CAAC,YAAA,CAAa,SAAW,EAAA,OAAO,CAAG,EAAA;AACrC,IAAO,OAAA;AAAA,MACL,kBAAA,EACK,SAAA,QAAA,CAAA,IAAA,YAAY,CAAA,EACf,EAAA,iBAAmB,EAAA;AAAA,QACjB,MAAQ,EAAA,OAAA;AAAA,QACR,SAAS,2CAA4C,CAAA,MAAA,CAAA,WACnD,CAAA,mBAAmB,GACjB,GAAA,CAAA;AAAA,SAEP,CAAA;AAAA,MACD,OAAS,EAAA,OAAA;AAAA;GAEZ;AAED,EAAO,OAAA;AAAA,IACL,kBAAoB,EAAA,YAAA;AAAA,IACpB,OAAS,EAAA,OAAA;AAAA;AAEb;;;;"}

package/dist/esm/packages/components/src/FilterDateRangePicker/utils/isCompleteDateRange.js

@@ -0,0 +1,6 @@
+var isCompleteDateRange = function(dateRange) {
+  return (dateRange === null || dateRange === void 0 ? void 0 : dateRange.from) !== void 0 && (dateRange === null || dateRange === void 0 ? void 0 : dateRange.to) !== void 0;
+};
+
+export { isCompleteDateRange };
+//# sourceMappingURL=isCompleteDateRange.js.map

package/dist/esm/packages/components/src/FilterDateRangePicker/utils/isCompleteDateRange.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"isCompleteDateRange.js","sources":["../../../../../../../src/FilterDateRangePicker/utils/isCompleteDateRange.ts"],"sourcesContent":["import { DateRange } from \"~types/DatePicker\"\n\nexport const isCompleteDateRange = (\n  dateRange: DateRange | undefined\n): dateRange is { from: Date; to: Date } =>\n  dateRange?.from !== undefined && dateRange?.to !== undefined\n"],"names":[],"mappings":"AAEa,IAAA,mBAAA,GAAsB,SACjC,SAAgC,EAAA;AAEhC,EAAA,OAAA,CAAA,SAAA,KAAA,IAAA,IAAA,gCAAA,SAAW,CAAA,IAAA,MAAS,KAAa,CAAA,IAAA,CAAA,SAAA,SAAA,IAAA,SAAA,KAAS,KAAA,CAAA,GAAA,KAAA,CAAA,GAAT,UAAW,EAAO,MAAA,KAAA,CAAA,CAAA;AAAnD;;;;"}

package/dist/esm/packages/components/src/FilterMultiSelect/FilterMultiSelect.js

@@ -0,0 +1,33 @@
+import { ListBox } from './subcomponents/ListBox/ListBox.js';
+import { ListBoxSection } from './subcomponents/ListBoxSection/ListBoxSection.js';
+import { LoadMoreButton } from './subcomponents/LoadMoreButton/LoadMoreButton.js';
+import { MenuFooter } from './subcomponents/MenuLayout/MenuFooter/MenuFooter.js';
+import { MenuLoadingSkeleton } from './subcomponents/MenuLayout/MenuLoadingSkeleton/MenuLoadingSkeleton.js';
+import { MultiSelectOption } from './subcomponents/MultiSelectOption/MultiSelectOption.js';
+import { NoResults } from './subcomponents/NoResults/NoResults.js';
+import { Root } from './subcomponents/Root/Root.js';
+import { SearchInput } from './subcomponents/SearchInput/SearchInput.js';
+import { SectionDivider } from './subcomponents/SectionDivider/SectionDivider.js';
+import { ClearButton } from './subcomponents/SelectionControlButton/ClearButton/ClearButton.js';
+import { SelectAllButton } from './subcomponents/SelectionControlButton/SelectAllButton/SelectAllButton.js';
+import { FilterTriggerButton } from './subcomponents/Trigger/FilterTriggerButton/FilterTriggerButton.js';
+import { RemovableFilterTrigger } from './subcomponents/Trigger/RemovableFilterTrigger/RemovableFilterTrigger.js';
+
+var FilterMultiSelect = Object.assign(Root, {
+  TriggerButton: FilterTriggerButton,
+  RemovableTrigger: RemovableFilterTrigger,
+  SearchInput,
+  ListBox,
+  ListBoxSection,
+  SectionDivider,
+  Option: MultiSelectOption,
+  SelectAllButton,
+  ClearButton,
+  MenuFooter,
+  MenuLoadingSkeleton,
+  LoadMoreButton,
+  NoResults
+});
+
+export { FilterMultiSelect };
+//# sourceMappingURL=FilterMultiSelect.js.map

package/dist/esm/packages/components/src/FilterMultiSelect/FilterMultiSelect.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FilterMultiSelect.js","sources":["../../../../../../src/FilterMultiSelect/FilterMultiSelect.tsx"],"sourcesContent":["import { ListBox } from \"./subcomponents/ListBox\"\nimport { ListBoxSection } from \"./subcomponents/ListBoxSection\"\nimport { LoadMoreButton } from \"./subcomponents/LoadMoreButton\"\nimport { MenuFooter, MenuLoadingSkeleton } from \"./subcomponents/MenuLayout\"\nimport { MultiSelectOption } from \"./subcomponents/MultiSelectOption\"\nimport { NoResults } from \"./subcomponents/NoResults\"\nimport { Root, RootProps } from \"./subcomponents/Root\"\nimport { SearchInput } from \"./subcomponents/SearchInput/SearchInput\"\nimport { SectionDivider } from \"./subcomponents/SectionDivider\"\nimport {\n  ClearButton,\n  SelectAllButton,\n} from \"./subcomponents/SelectionControlButton\"\nimport {\n  FilterTriggerButton,\n  RemovableFilterTrigger,\n} from \"./subcomponents/Trigger\"\n\nexport type FilterMultiSelectProps = RootProps\n\nexport const FilterMultiSelect = Object.assign(Root, {\n  TriggerButton: FilterTriggerButton,\n  RemovableTrigger: RemovableFilterTrigger,\n  SearchInput,\n  ListBox,\n  ListBoxSection,\n  SectionDivider,\n  Option: MultiSelectOption,\n  SelectAllButton,\n  ClearButton,\n  MenuFooter, // For layout\n  MenuLoadingSkeleton, // Menu Loading Skeleton example\n  LoadMoreButton,\n  NoResults,\n})\n"],"names":[],"mappings":";;;;;;;;;;;;;;;AAoBa,IAAA,iBAAA,GAAoB,MAAO,CAAA,MAAA,CAAO,IAAM,EAAA;AAAA,EACnD,aAAe,EAAA,mBAAA;AAAA,EACf,gBAAkB,EAAA,sBAAA;AAAA,EAClB,WAAA;AAAA,EACA,OAAA;AAAA,EACA,cAAA;AAAA,EACA,cAAA;AAAA,EACA,MAAQ,EAAA,iBAAA;AAAA,EACR,eAAA;AAAA,EACA,WAAA;AAAA,EACA,UAAA;AAAA,EACA,mBAAA;AAAA,EACA,cAAA;AAAA,EACA,SAAA;AACD,CAAA;;;;"}

package/dist/esm/packages/components/src/FilterMultiSelect/context/MenuTriggerProvider/MenuTriggerProvider.js

@@ -0,0 +1,28 @@
+import React, { useContext } from 'react';
+import { useButton } from '@react-aria/button';
+import { useMenuTrigger } from '@react-aria/menu';
+import { useMenuTriggerState } from '@react-stately/menu';
+
+var MenuTriggerContext = React.createContext({});
+function MenuTriggerProvider(_a) {
+  var isOpen = _a.isOpen, defaultOpen = _a.defaultOpen, onOpenChange = _a.onOpenChange, children = _a.children;
+  var state = useMenuTriggerState({ isOpen, defaultOpen, onOpenChange });
+  var ref = React.createRef();
+  var _b = useMenuTrigger({}, state, ref), menuTriggerProps = _b.menuTriggerProps, menuProps = _b.menuProps;
+  var buttonProps = useButton(menuTriggerProps, ref).buttonProps;
+  return React.createElement(MenuTriggerContext.Provider, { value: {
+    menuTriggerProps,
+    buttonProps,
+    menuProps,
+    menuTriggerState: state,
+    buttonRef: ref
+  } }, children);
+}
+var useMenuTriggerContext = function() {
+  return useContext(MenuTriggerContext);
+};
+var MenuTriggerConsumer = MenuTriggerContext.Consumer;
+MenuTriggerContext.displayName = "MenuTriggerContext";
+
+export { MenuTriggerConsumer, MenuTriggerProvider, useMenuTriggerContext };
+//# sourceMappingURL=MenuTriggerProvider.js.map

package/dist/esm/packages/components/src/FilterMultiSelect/context/MenuTriggerProvider/MenuTriggerProvider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuTriggerProvider.js","sources":["../../../../../../../../src/FilterMultiSelect/context/MenuTriggerProvider/MenuTriggerProvider.tsx"],"sourcesContent":["import React, { ButtonHTMLAttributes, HTMLAttributes, useContext } from \"react\"\nimport { useButton } from \"@react-aria/button\"\nimport { AriaMenuOptions, useMenuTrigger } from \"@react-aria/menu\"\nimport { MenuTriggerState, useMenuTriggerState } from \"@react-stately/menu\"\nimport { ItemType } from \"../../types\"\n\nexport type MenuTriggerProviderProps = {\n  isOpen?: boolean\n  defaultOpen?: boolean\n  onOpenChange?: (isOpen: boolean) => void\n  children: React.ReactNode\n}\n\nexport type MenuTriggerProviderContextType = {\n  menuTriggerProps: HTMLAttributes<HTMLElement>\n  buttonProps: ButtonHTMLAttributes<HTMLButtonElement>\n  menuProps: AriaMenuOptions<ItemType>\n  menuTriggerState: MenuTriggerState\n  buttonRef: React.RefObject<HTMLButtonElement>\n}\n\nconst MenuTriggerContext = React.createContext<MenuTriggerProviderContextType>(\n  {} as MenuTriggerProviderContextType\n)\nexport function MenuTriggerProvider({\n  isOpen,\n  defaultOpen,\n  onOpenChange,\n  children,\n}: MenuTriggerProviderProps): JSX.Element {\n  // Create state based on the incoming props to manage the open/close\n  const state = useMenuTriggerState({ isOpen, defaultOpen, onOpenChange })\n\n  // Get A11y attributes and events for the menu trigger and menu elements\n  const ref = React.createRef<HTMLButtonElement>()\n  const { menuTriggerProps, menuProps } = useMenuTrigger<ItemType>(\n    {},\n    state,\n    ref\n  )\n\n  // Get A11y attributes and events for the button based on the trigger props from useMenuTrigger\n  const { buttonProps } = useButton(menuTriggerProps, ref)\n\n  return (\n    <MenuTriggerContext.Provider\n      value={{\n        menuTriggerProps,\n        buttonProps,\n        menuProps,\n        menuTriggerState: state,\n        buttonRef: ref,\n      }}\n    >\n      {children}\n    </MenuTriggerContext.Provider>\n  )\n}\n\nexport const useMenuTriggerContext = (): MenuTriggerProviderContextType =>\n  useContext(MenuTriggerContext)\n\nexport const MenuTriggerConsumer = MenuTriggerContext.Consumer\n\nMenuTriggerContext.displayName = \"MenuTriggerContext\"\n"],"names":[],"mappings":";;;;;AAqBA,IAAM,kBAAqB,GAAA,KAAA,CAAM,aAC/B,CAAA,EAAoC,CAAA,CAAA;AAEhC,SAAU,oBAAoB,EAKT,EAAA;EAJzB,IAAA,MAAA,GAAM,EAAA,CAAA,MAAA,EACN,WAAW,GAAA,EAAA,CAAA,aACX,YAAY,GAAA,EAAA,CAAA,YACZ,EAAA,QAAA,GAAQ,EAAA,CAAA,QAAA,CAAA;AAGR,EAAA,IAAM,QAAQ,mBAAoB,CAAA,EAAE,MAAQ,EAAA,WAAA,EAAa,cAAc,CAAA,CAAA;AAGvE,EAAM,IAAA,GAAA,GAAM,MAAM;AACZ,EAAA,IAAA,EAAA,GAAkC,cACtC,CAAA,EACA,EAAA,KAAA,EACA,GAAG,CAAA,EAHG,gBAAgB,GAAA,EAAA,CAAA,gBAAE,EAAA,SAAA;AAOlB,EAAA,IAAA,WAAgB,GAAA,SAAA,CAAU,gBAAkB,EAAA,GAAG,CAAC,CAAA,WAAA,CAAA;AAExD,EAAA,OACE,KAAC,CAAA,aAAA,CAAA,kBAAmB,CAAA,QAAA,EAAQ,EAC1B,KAAO,EAAA;AAAA,IACL,gBAAA;AAAA,IACA,WAAA;AAAA,IACA,SAAA;AAAA,IACA,gBAAkB,EAAA,KAAA;AAAA,IAClB,SAAW,EAAA,GAAA;AAAA,OAGZ,QAAQ,CAAA,CAAA;AAGf,CAAA;AAEO,IAAM,wBAAwB,WAAA;AACnC,EAAA,OAAA,WAAW,kBAAkB,CAAA,CAAA;AAA7B,EAAA;AAEK,IAAM,sBAAsB,kBAAmB,CAAA,SAAA;AAEtD,kBAAA,CAAmB,WAAc,GAAA,oBAAA;;;;"}

package/dist/esm/packages/components/src/FilterMultiSelect/context/SelectionProvider/SelectionProvider.js

@@ -0,0 +1,50 @@
+import { __rest, __assign } from '../../../../../../node_modules/tslib/tslib.es6.js';
+import React, { useState, useCallback, useContext } from 'react';
+import { useListBox } from '@react-aria/listbox';
+import { Item } from '@react-stately/collections';
+import { useListState } from '@react-stately/list';
+import { VisuallyHidden } from '@kaizen/a11y';
+import { useMenuTriggerContext } from '../MenuTriggerProvider/MenuTriggerProvider.js';
+
+var SelectionContext = React.createContext({});
+var SelectionProvider = function(props) {
+  var onSearchInputChange = props.onSearchInputChange, otherProps = __rest(props, ["onSearchInputChange"]);
+  var _a = useState(""), searchQuery = _a[0], setSearchQuery = _a[1];
+  var menuProps = useMenuTriggerContext().menuProps;
+  React.useEffect(function() {
+    if (onSearchInputChange) {
+      onSearchInputChange(searchQuery);
+    }
+  }, [searchQuery, onSearchInputChange]);
+  var searchFilter = useCallback(function(nodes) {
+    return searchQuery ? Array.from(nodes).filter(function(f) {
+      return f.textValue.toLowerCase().includes(searchQuery.toLowerCase());
+    }) : nodes;
+  }, [searchQuery]);
+  var state = useListState(__assign(__assign({}, otherProps), { children: function(item) {
+    return React.createElement(Item, { key: item.value }, item.label);
+  }, filter: onSearchInputChange ? void 0 : searchFilter }));
+  var ref = React.createRef();
+  var _b = useListBox(__assign(__assign(__assign({}, menuProps), otherProps), { disallowEmptySelection: true }), state, ref), listBoxProps = _b.listBoxProps, labelProps = _b.labelProps;
+  return React.createElement(
+    SelectionContext.Provider,
+    { value: {
+      listBoxProps,
+      labelProps,
+      selectionState: state,
+      listRef: ref,
+      setSearchQuery,
+      searchQuery
+    } },
+    React.createElement(VisuallyHidden, __assign({}, labelProps), otherProps.label),
+    otherProps.children
+  );
+};
+var useSelectionContext = function() {
+  return useContext(SelectionContext);
+};
+var SelectionConsumer = SelectionContext.Consumer;
+SelectionProvider.displayName = "SelectionProvider";
+
+export { SelectionConsumer, SelectionProvider, useSelectionContext };
+//# sourceMappingURL=SelectionProvider.js.map

package/dist/esm/packages/components/src/FilterMultiSelect/context/SelectionProvider/SelectionProvider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SelectionProvider.js","sources":["../../../../../../../../src/FilterMultiSelect/context/SelectionProvider/SelectionProvider.tsx"],"sourcesContent":["import React, { HTMLAttributes, useCallback, useContext, useState } from \"react\"\nimport { useListBox } from \"@react-aria/listbox\"\nimport { Item } from \"@react-stately/collections\"\nimport { ListState, useListState } from \"@react-stately/list\"\nimport { SelectionMode, Selection } from \"@react-types/shared\"\nimport { VisuallyHidden } from \"@kaizen/a11y\"\nimport { ItemType, MultiSelectItem } from \"../../types\"\nimport { useMenuTriggerContext } from \"../MenuTriggerProvider\"\n\nexport type SelectionProviderProps = {\n  selectionMode: SelectionMode\n  children: React.ReactNode // control how menu should look like\n  items?: ItemType[]\n  onSelectionChange?: (keys: Selection) => void\n  /** The currently selected keys in the collection (controlled). */\n  selectedKeys?: Selection\n  /** The initial selected keys in the collection (uncontrolled). */\n  defaultSelectedKeys?: Selection\n  label: string\n  disabledKeys?: Selection\n  onSearchInputChange?: (searchInput: string) => void\n}\n\nexport type SelectionProviderContextType = {\n  listBoxProps: HTMLAttributes<HTMLElement>\n  labelProps: HTMLAttributes<HTMLElement>\n  selectionState: ListState<ItemType>\n  listRef: React.RefObject<HTMLUListElement>\n  searchQuery?: string\n  setSearchQuery: React.Dispatch<React.SetStateAction<string>>\n}\n\nconst SelectionContext = React.createContext<SelectionProviderContextType>(\n  {} as SelectionProviderContextType\n)\n\nexport const SelectionProvider = (\n  props: SelectionProviderProps\n): JSX.Element => {\n  const { onSearchInputChange, ...otherProps } = props\n  const [searchQuery, setSearchQuery] = useState<string>(\"\")\n  const { menuProps } = useMenuTriggerContext()\n  /**\n   * While the onSearchInputChange  is a side-effect, this useEffect should be fine.\n   * If the search input state becomes controlled, this useEffect could cause synchronisation\n   * issues and should be replaced.\n   */\n\n  React.useEffect(() => {\n    if (onSearchInputChange) {\n      onSearchInputChange(searchQuery)\n    }\n  }, [searchQuery, onSearchInputChange])\n\n  const searchFilter = useCallback(\n    (nodes: Iterable<MultiSelectItem>): Iterable<MultiSelectItem> =>\n      searchQuery\n        ? Array.from(nodes).filter(f =>\n            f.textValue.toLowerCase().includes(searchQuery.toLowerCase())\n          )\n        : nodes,\n    [searchQuery]\n  )\n\n  // Create state based on the incoming props to manage the selection\n  const state = useListState({\n    ...otherProps,\n    children: item => <Item key={item.value}>{item.label}</Item>, // For initialising selection and determined item.renderer, can be only Item or Section\n    filter: onSearchInputChange ? undefined : searchFilter, // If the user has passed an `onSearchInputChange` we opt them out of the default filtering\n  })\n\n  // Get A11y attributes and events for the listbox\n  const ref = React.createRef<HTMLUListElement>()\n  const { listBoxProps, labelProps } = useListBox(\n    {\n      ...menuProps,\n      ...otherProps,\n      disallowEmptySelection: true, // stop escape key from clearing selection\n    },\n    state,\n    ref\n  )\n\n  return (\n    <SelectionContext.Provider\n      value={{\n        listBoxProps,\n        labelProps,\n        selectionState: state,\n        listRef: ref,\n        setSearchQuery,\n        searchQuery,\n      }}\n    >\n      <VisuallyHidden {...labelProps}>{otherProps.label}</VisuallyHidden>\n      {otherProps.children}\n    </SelectionContext.Provider>\n  )\n}\n\nexport const useSelectionContext = (): SelectionProviderContextType =>\n  useContext(SelectionContext)\n\nexport const SelectionConsumer = SelectionContext.Consumer\n\nSelectionProvider.displayName = \"SelectionProvider\"\n"],"names":[],"mappings":";;;;;;;;AAgCA,IAAM,gBAAmB,GAAA,KAAA,CAAM,aAC7B,CAAA,EAAkC,CAAA,CAAA;AAGvB,IAAA,iBAAA,GAAoB,SAC/B,KAA6B,EAAA;AAErB,EAAA,IAAA,mBAAA,GAAuC,MAApB,mBAAK,EAAA,UAAA,GAAU,OAAK,KAAzC,EAAA,CAAsC,qBAAA,CAAA,CAAA,CAAA;AACtC,EAAA,IAAA,EAAA,GAAgC,QAAiB,CAAA,EAAE,CAAlD,EAAA,WAAA,GAAW,GAAA,CAAA,CAAA,EAAE,cAAc,GAAA,EAAA,CAAA,CAAA,CAAA,CAAA;AAC1B,EAAA,IAAA,SAAA,GAAc;AAOtB,EAAA,KAAA,CAAM,UAAU,WAAA;AACd,IAAA,IAAI,mBAAqB,EAAA;AACvB,MAAA,mBAAA,CAAoB,WAAW,CAAA,CAAA;AAAA,KAChC;AAAA,GACA,EAAA,CAAC,WAAa,EAAA,mBAAmB,CAAC,CAAA,CAAA;AAErC,EAAM,IAAA,YAAA,GAAe,WACnB,CAAA,SAAC,KAAgC,EAAA;AAC/B,IAAA,OAAA,cACI,KAAM,CAAA,IAAA,CAAK,KAAK,CAAE,CAAA,MAAA,CAAO,SAAA,CAAC,EAAA;AACxB,MAAA,OAAA,EAAE,SAAU,CAAA,WAAA,GAAc,QAAS,CAAA,WAAA,CAAY,aAAa,CAAA,CAAA;AAAA,KAAC,CAE/D,GAAA,KAAA,CAAA;AAAA,GAJJ,EAKF,CAAC,WAAW,CAAC,CAAA,CAAA;AAIf,EAAM,IAAA,KAAA,GAAQ,iCACT,EAAA,UAAU,CAAA,EAAA,EACb,QAAU,EAAA,SAAA,IAAI,EAAA;AAAI,IAAA,OAAA,KAAA,CAAC,cAAA,QAAK,KAAK,IAAK,CAAA,KAAA,EAAQ,EAAA,IAAA,CAAK,KAAK,CAAA,CAAA;AAAA,KACpD,MAAQ,EAAA,mBAAA,GAAsB,KAAY,CAAA,GAAA,YAAA;AAI5C,EAAM,IAAA,GAAA,GAAM,MAAM;AACZ,EAAA,IAAA,EAAA,GAA+B,WAE9B,QAAA,CAAA,QAAA,CAAA,SAAA,EAAA,EAAA,SAAS,CAAA,EACT,UAAU,CAAA,EAAA,EACb,sBAAwB,EAAA,IAAA,KAE1B,KACA,EAAA,GAAG,GAPG,YAAY,GAAA,EAAA,CAAA,YAAE,EAAA,UAAA,GAAU,EAAA,CAAA,UAAA,CAAA;AAUhC,EAAA,OACE,KAAC,CAAA,aAAA;AAAA,IAAA,gBAAiB,CAAA,QAAA;AAAA,IAAQ,EACxB,KAAO,EAAA;AAAA,MACL,YAAA;AAAA,MACA,UAAA;AAAA,MACA,cAAgB,EAAA,KAAA;AAAA,MAChB,OAAS,EAAA,GAAA;AAAA,MACT,cAAA;AAAA,MACA,WAAA;AAAA,KACD,EAAA;AAAA,IAED,KAAA,CAAA,cAAC,cAAmB,EAAA,QAAA,CAAA,EAAA,EAAA,UAAU,CAAG,EAAA,UAAA,CAAW,KAAK,CAAA;AAAA,IAChD,UAAW,CAAA,QAAA;AAAA,GAAQ,CAAA;AAG1B,EAAA;AAEO,IAAM,sBAAsB,WAAA;AACjC,EAAA,OAAA,WAAW,gBAAgB,CAAA,CAAA;AAA3B,EAAA;AAEK,IAAM,oBAAoB,gBAAiB,CAAA,SAAA;AAElD,iBAAA,CAAkB,WAAc,GAAA,mBAAA;;;;"}