@algolia/satellite 2.0.0 → 2.1.0-rc.1

package/dist/cjs/Fields/Checkbox/Checkbox.js

@@ -11,11 +11,11 @@ var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/h
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
 var _clsx = _interopRequireDefault(require("clsx"));
 var _react = require("react");
-var _Icons = require("../../Icons");
-var _satellitePrefixer = _interopRequireDefault(require("../../styles/helpers/satellitePrefixer"));
-var _isRenderedChild = require("../../utils/isRenderedChild");
-var _uniqueId = require("../../utils/uniqueId");
-var _Field = require("../Field");
+var _Field = require("./../Field");
+var _Icons = require("./../../Icons");
+var _satellitePrefixer = _interopRequireDefault(require("./../../styles/helpers/satellitePrefixer"));
+var _isRenderedChild = require("./../../utils/isRenderedChild");
+var _uniqueId = require("./../../utils/uniqueId");
 var _jsxRuntime = require("react/jsx-runtime");
 var _excluded = ["children", "className", "textPosition", "indeterminate", "defaultChecked", "checkedColor", "checked", "disabled", "required"];
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6;
@@ -30,7 +30,7 @@ var STATUS_CLASSNAMES = {
 /**
  * The `Checkbox` component is a control that allows single or multiple selections from a set of options.
  *
- * See the [Checkbox documentation page](https://satellite.algolia.com/components/controls/checkbox) for more information.
+ * See the [Checkbox documentation page](https://satellite.algolia.com/8261d6576/p/023233-checkbox) for more information.
  */
 var Checkbox = exports.Checkbox = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
   var children = _ref.children,

package/dist/cjs/Fields/DateInput/DateInput.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
-import type { DatePickerProps } from "../DatePicker";
-import type { InputProps } from "../Input";
-declare type DateValue = Date | null;
+import type { DatePickerProps } from "../../Fields/DatePicker";
+import type { InputProps } from "../../Fields/Input";
+export declare type DateInputValue = Date | null;
 export declare type DateInputLocale = {
     tooltip?: (open: boolean) => string;
 };
@@ -9,15 +9,15 @@ export interface DateInputProps extends Omit<InputProps, "type" | "defaultValue"
     /**
      * Defines the default value of the `DateInput`.
      */
-    defaultValue?: DateValue;
+    defaultValue?: DateInputValue;
     /**
      * Defines the value of the `DateInput`.
      */
-    value?: DateValue;
+    value?: DateInputValue;
     /**
      * Defines the function to call when the `DateInput` value changes.
      */
-    onChange?: (value: DateValue) => void;
+    onChange?: (value: DateInputValue) => void;
     /**
      * Defines the format of the `DateInput` value.
      * @default "MM/dd/yyyy"
@@ -41,7 +41,6 @@ export interface DateInputProps extends Omit<InputProps, "type" | "defaultValue"
  * The `DateInput` component provides a date input field with an integrated date picker.
  * It allows users to either type a date manually or select one from a calendar interface.
  *
- * See the [DateInput documentation page](https://satellite.algolia.com/components/forms/date-input) for more information.
+ * See the [DateInput documentation page](https://satellite.algolia.com/8261d6576/p/65f65f-date-input) for more information.
  */
 export declare const DateInput: import("react").ForwardRefExoticComponent<DateInputProps & import("react").RefAttributes<HTMLInputElement>>;
-export {};

package/dist/cjs/Fields/DateInput/DateInput.js

@@ -11,12 +11,12 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _dateFns = require("date-fns");
 var _react = require("react");
-var _Actions = require("../../Actions");
-var _Icons = require("../../Icons");
-var _Satellite = require("../../Satellite");
-var _satellitePrefixer = _interopRequireDefault(require("../../styles/helpers/satellitePrefixer"));
-var _DatePicker = require("../DatePicker");
-var _Input = require("../Input");
+var _Actions = require("./../../Actions");
+var _DatePicker = require("./../DatePicker");
+var _Input = require("./../Input");
+var _Icons = require("./../../Icons");
+var _Satellite = require("./../../Satellite");
+var _satellitePrefixer = _interopRequireDefault(require("./../../styles/helpers/satellitePrefixer"));
 var _jsxRuntime = require("react/jsx-runtime");
 var _templateObject, _templateObject2;
 var _excluded = ["id", "defaultValue", "value", "onChange", "valueFormat", "placeholder", "separator", "locale", "datePickerProps"];
@@ -48,7 +48,7 @@ var parseAndValidateDate = function parseAndValidateDate(value, format, referenc
  * The `DateInput` component provides a date input field with an integrated date picker.
  * It allows users to either type a date manually or select one from a calendar interface.
  *
- * See the [DateInput documentation page](https://satellite.algolia.com/components/forms/date-input) for more information.
+ * See the [DateInput documentation page](https://satellite.algolia.com/8261d6576/p/65f65f-date-input) for more information.
  */
 var DateInput = exports.DateInput = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
   var _ref2;

package/dist/cjs/Fields/DatePicker/DatePicker/DatePicker.d.ts

@@ -1,9 +1,7 @@
 import type { Dispatch, MouseEvent, ReactNode } from "react";
-import type { DatePickerCalendarProps } from "../components/Calendar";
-import type { DatePickerDisplayProps } from "../components/Display";
-import type { DatePickerFooterActionsProps } from "../components/FooterActions";
-import type { SharedDatePickerProps } from "../types";
 import type { DatePickerReducerAction, DatePickerReducerState } from "./datePickerReducer";
+import type { DatePickerCalendarProps, DatePickerDisplayProps, DatePickerFooterActionsProps } from "../../../Fields/DatePicker/components";
+import type { SharedDatePickerProps } from "../../../Fields/DatePicker/types";
 interface LeftFooterComponentArgs {
     state: DatePickerReducerState;
     dispatch: Dispatch<DatePickerReducerAction>;
@@ -77,7 +75,7 @@ export declare type DatePickerProps = {
 /**
  * The `DatePicker` component allows users to easily select a date, featuring a calendar view, month/year navigation, and custom options.
  *
- * See the [Date Picker documentation page](https://satellite.algolia.com/layouts/date-picker) for more information.
+ * See the [Date Picker documentation page](https://satellite.algolia.com/8261d6576/p/112fdf-date-picker) for more information.
  */
 export declare const DatePicker: import("react").ForwardRefExoticComponent<DatePickerProps & import("react").RefAttributes<HTMLButtonElement>>;
 export {};

package/dist/cjs/Fields/DatePicker/DatePicker/DatePicker.js

@@ -9,17 +9,13 @@ var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/hel
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _react = require("react");
-var _Satellite = require("../../../Satellite");
-var _satellitePrefixer = _interopRequireDefault(require("../../../styles/helpers/satellitePrefixer"));
-var _Field = require("../../Field");
-var _Calendar = require("../components/Calendar");
-var _Display = require("../components/Display");
-var _Footer = require("../components/Footer");
-var _FooterActions = require("../components/FooterActions");
-var _Popover = require("../components/Popover");
-var _SidePanel = require("../components/SidePanel");
-var _utils = require("../utils");
 var _datePickerReducer = require("./datePickerReducer");
+var _components = require("./../components");
+var _Calendar = require("./../components/Calendar");
+var _utils = require("./../utils");
+var _Field = require("./../../Field");
+var _Satellite = require("./../../../Satellite");
+var _satellitePrefixer = _interopRequireDefault(require("./../../../styles/helpers/satellitePrefixer"));
 var _jsxRuntime = require("react/jsx-runtime");
 var _templateObject, _templateObject2, _templateObject3;
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
@@ -27,7 +23,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
 /**
  * The `DatePicker` component allows users to easily select a date, featuring a calendar view, month/year navigation, and custom options.
  *
- * See the [Date Picker documentation page](https://satellite.algolia.com/layouts/date-picker) for more information.
+ * See the [Date Picker documentation page](https://satellite.algolia.com/8261d6576/p/112fdf-date-picker) for more information.
  */
 var DatePicker = exports.DatePicker = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
   var _props$initialValue, _props$validate, _props$id, _props$calendarProps;
@@ -98,7 +94,7 @@ var DatePicker = exports.DatePicker = /*#__PURE__*/(0, _react.forwardRef)(functi
     inputId = _useField.inputId;
   var isInvalid = status === "invalid";
   var cancelElementRef = (0, _react.useRef)(null);
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Popover.DatePickerPopover, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.DatePickerPopover, {
     isOpen: state.show,
     onOpenChange: function onOpenChange(open) {
       return dispatch({
@@ -119,7 +115,7 @@ var DatePicker = exports.DatePicker = /*#__PURE__*/(0, _react.forwardRef)(functi
     trigger: props.renderTarget ? props.renderTarget({
       toggle: state.show ? handleClose : handleOpen,
       isOpen: state.show
-    }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_Display.DatePickerDisplay, {
+    }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.DatePickerDisplay, {
       id: (_props$id = props.id) !== null && _props$id !== void 0 ? _props$id : inputId,
       ref: ref,
       onClick: state.show ? handleClose : handleOpen,
@@ -142,13 +138,13 @@ var DatePicker = exports.DatePicker = /*#__PURE__*/(0, _react.forwardRef)(functi
           onDayClick: handleDayClick
         }, yearProps), {}, {
           locale: locale
-        })), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Footer.DatePickerFooter, {
+        })), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_components.DatePickerFooter, {
           children: [props.renderLeftFooter && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
             children: props.renderLeftFooter({
               state: state,
               dispatch: dispatch
             })
-          }), !props.renderRightPanel && /*#__PURE__*/(0, _jsxRuntime.jsx)(_FooterActions.DatePickerFooterActions, {
+          }), !props.renderRightPanel && /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.DatePickerFooterActions, {
             onCancel: handleClose,
             onApply: handleApply,
             disableApply: !isValid,
@@ -156,11 +152,11 @@ var DatePicker = exports.DatePicker = /*#__PURE__*/(0, _react.forwardRef)(functi
             ref: cancelElementRef
           })]
         })]
-      }), props.renderRightPanel && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_SidePanel.DatePickerSidePanel, {
+      }), props.renderRightPanel && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_components.DatePickerSidePanel, {
         children: [props.renderRightPanel({
           state: state,
           dispatch: dispatch
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_FooterActions.DatePickerFooterActions, {
+        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.DatePickerFooterActions, {
           onCancel: handleClose,
           onApply: handleApply,
           disableApply: !isValid,

package/dist/cjs/Fields/DatePicker/DateRangePicker/DateRangePicker.d.ts

@@ -1,10 +1,10 @@
 import type { Dispatch, FC, ReactNode } from "react";
-import type { DatePickerCalendarProps } from "../components/Calendar";
-import type { SharedDatePickerProps } from "../types";
 import type { DateRangePickerDisplayProps } from "./DateRangePickerDisplay";
 import type { DateRangePickerReducerAction, DateRangePickerReducerState } from "./dateRangePickerReducer";
 import { dateRangePickerReducer } from "./dateRangePickerReducer";
 import type { DateRangePickerTimeRange } from "./dateRangePickerTimeRange";
+import type { DatePickerCalendarProps } from "../../../Fields/DatePicker/components";
+import type { SharedDatePickerProps } from "../../../Fields/DatePicker/types";
 interface LeftFooterComponentArgs {
     state: DateRangePickerReducerState;
     dispatch: Dispatch<DateRangePickerReducerAction>;
@@ -24,8 +24,18 @@ export declare type DateRangePickerProps = {
     id?: string;
     /**
      * The range of the `DateRangePicker`.
+     * @deprecated Use `value` instead to make the component controlled.
+     * Otherwise, use `defaultValue` to make the component uncontrolled.
      */
-    range: DateRangePickerTimeRange | null;
+    range?: DateRangePickerTimeRange | null;
+    /**
+     * The value of the `DateRangePicker`.
+     */
+    value?: DateRangePickerTimeRange | null;
+    /**
+     * The default value of the `DateRangePicker` (uncontrolled mode).
+     */
+    defaultValue?: DateRangePickerTimeRange | null;
     /**
      * The ranges to only display in the `DateRangePicker`.
      */
@@ -70,7 +80,7 @@ export declare type DateRangePickerProps = {
 /**
  * The `DateRangePicker` component allows selection of start and end dates using two calendars, ideal for planning and scheduling.
  *
- * See the [Date Range Picker documentation page](https://satellite.algolia.com/layouts/date-range-picker) for more information.
+ * See the [Date Range Picker documentation page](https://satellite.algolia.com/8261d6576/p/324e0b-date-range-picker) for more information.
  */
 export declare const DateRangePicker: FC<DateRangePickerProps>;
 export {};

package/dist/cjs/Fields/DatePicker/DateRangePicker/DateRangePicker.js

@@ -10,20 +10,17 @@ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/sli
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _react = require("react");
-var _Satellite = require("../../../Satellite");
-var _satellitePrefixer = _interopRequireDefault(require("../../../styles/helpers/satellitePrefixer"));
-var _Calendar = require("../components/Calendar");
-var _Footer = require("../components/Footer");
-var _FooterActions = require("../components/FooterActions");
-var _Popover = require("../components/Popover");
-var _SidePanel = require("../components/SidePanel");
-var _utils = require("../utils");
 var _DateRangePickerDisplay = require("./DateRangePickerDisplay");
 var _dateRangePickerReducer = require("./dateRangePickerReducer");
 var _dateRangePickerTimeRange = require("./dateRangePickerTimeRange");
+var _components = require("./../components");
+var _Calendar = require("./../components/Calendar");
+var _utils = require("./../utils");
+var _Satellite = require("./../../../Satellite");
+var _satellitePrefixer = _interopRequireDefault(require("./../../../styles/helpers/satellitePrefixer"));
 var _jsxRuntime = require("react/jsx-runtime");
 var _templateObject, _templateObject2;
-var _excluded = ["id", "range", "displayOnlyRanges", "calendarProps", "initialState", "stateReducer", "onAction", "validate", "renderTarget", "renderLeftFooter", "renderRightPanel", "buttonSize", "popoverSide", "popoverAlign", "locale"];
+var _excluded = ["id", "range", "value", "defaultValue", "displayOnlyRanges", "calendarProps", "initialState", "stateReducer", "onAction", "validate", "renderTarget", "renderLeftFooter", "renderRightPanel", "buttonSize", "popoverSide", "popoverAlign", "locale"];
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var defaultValidator = function defaultValidator(_ref) {
@@ -38,12 +35,14 @@ var DEFAULT_DATE_RANGE_PICKER_LOCALE = _objectSpread(_objectSpread({}, _utils.DE
 /**
  * The `DateRangePicker` component allows selection of start and end dates using two calendars, ideal for planning and scheduling.
  *
- * See the [Date Range Picker documentation page](https://satellite.algolia.com/layouts/date-range-picker) for more information.
+ * See the [Date Range Picker documentation page](https://satellite.algolia.com/8261d6576/p/324e0b-date-range-picker) for more information.
  */
 var DateRangePicker = exports.DateRangePicker = function DateRangePicker(_ref2) {
-  var _validate, _displayedRange$start, _initialRange$start;
+  var _ref3, _validate, _displayedRange$start, _displayedRange$start3;
   var id = _ref2.id,
     initialRange = _ref2.range,
+    controlledValue = _ref2.value,
+    defaultValue = _ref2.defaultValue,
     displayOnlyRanges = _ref2.displayOnlyRanges,
     _ref2$calendarProps = _ref2.calendarProps,
     calendarProps = _ref2$calendarProps === void 0 ? {} : _ref2$calendarProps,
@@ -64,9 +63,15 @@ var DateRangePicker = exports.DateRangePicker = function DateRangePicker(_ref2)
     props = (0, _objectWithoutProperties2["default"])(_ref2, _excluded);
   var contextLocale = (0, _Satellite.useLocale)("datePicker");
   var locale = _objectSpread(_objectSpread(_objectSpread({}, DEFAULT_DATE_RANGE_PICKER_LOCALE), contextLocale), propsLocale);
+  var isControlled = !!controlledValue;
   var _useReducer = (0, _react.useReducer)(function (state, action) {
       return stateReducer(state, action, _dateRangePickerReducer.dateRangePickerReducer);
-    }, initialState, _dateRangePickerReducer.initDateRangePickerReducer),
+    }, _objectSpread(_objectSpread({}, initialState), {}, {
+      candidateRange: (_ref3 = initialRange !== null && initialRange !== void 0 ? initialRange : initialState.candidateRange) !== null && _ref3 !== void 0 ? _ref3 : isControlled ? controlledValue : defaultValue !== null && defaultValue !== void 0 ? defaultValue : {
+        start: null,
+        end: null
+      }
+    }), _dateRangePickerReducer.initDateRangePickerReducer),
     _useReducer2 = (0, _slicedToArray2["default"])(_useReducer, 2),
     state = _useReducer2[0],
     baseDispatch = _useReducer2[1];
@@ -74,12 +79,7 @@ var DateRangePicker = exports.DateRangePicker = function DateRangePicker(_ref2)
 
   // Computed properties
   var isValid = !((_validate = validate(state)) !== null && _validate !== void 0 && _validate.length);
-  var displayedRange = (0, _react.useMemo)(function () {
-    return (0, _dateRangePickerTimeRange.isEmptyTimeRange)(state.candidateRange) ? initialRange !== null && initialRange !== void 0 ? initialRange : {
-      start: null,
-      end: null
-    } : state.candidateRange;
-  }, [initialRange, state.candidateRange]);
+  var displayedRange = (0, _dateRangePickerTimeRange.isEmptyTimeRange)(state.candidateRange) && initialRange ? initialRange : isControlled ? controlledValue : state.candidateRange;
 
   // Event handlers
   var dispatch = function dispatch(action) {
@@ -171,16 +171,16 @@ var DateRangePicker = exports.DateRangePicker = function DateRangePicker(_ref2)
     });
   }
   var yearProps = (0, _react.useMemo)(function () {
-    var _ref3, _displayedRange$start2;
+    var _ref4, _displayedRange$start2;
     return props.editableYear ? {
       editableYear: true,
-      initialDate: (_ref3 = (_displayedRange$start2 = displayedRange.start) !== null && _displayedRange$start2 !== void 0 ? _displayedRange$start2 : displayedRange.end) !== null && _ref3 !== void 0 ? _ref3 : undefined,
+      initialDate: (_ref4 = (_displayedRange$start2 = displayedRange.start) !== null && _displayedRange$start2 !== void 0 ? _displayedRange$start2 : displayedRange.end) !== null && _ref4 !== void 0 ? _ref4 : undefined,
       years: props.years
     } : {
       editableYear: false
     };
   }, [props, displayedRange]);
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Popover.DatePickerPopover, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.DatePickerPopover, {
     isOpen: state.show,
     onOpenChange: function onOpenChange(open) {
       return dispatch({
@@ -203,7 +203,7 @@ var DateRangePicker = exports.DateRangePicker = function DateRangePicker(_ref2)
       isOpen: state.show
     }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_DateRangePickerDisplay.DateRangePickerDisplay, {
       id: id,
-      range: initialRange !== null && initialRange !== void 0 ? initialRange : {
+      range: displayedRange !== null && displayedRange !== void 0 ? displayedRange : {
         start: null,
         end: null
       },
@@ -215,7 +215,7 @@ var DateRangePicker = exports.DateRangePicker = function DateRangePicker(_ref2)
       children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
         children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Calendar.DatePickerCalendar, _objectSpread(_objectSpread(_objectSpread({
           mode: "default",
-          defaultMonth: (_initialRange$start = initialRange === null || initialRange === void 0 ? void 0 : initialRange.start) !== null && _initialRange$start !== void 0 ? _initialRange$start : undefined,
+          defaultMonth: (_displayedRange$start3 = displayedRange === null || displayedRange === void 0 ? void 0 : displayedRange.start) !== null && _displayedRange$start3 !== void 0 ? _displayedRange$start3 : undefined,
           numberOfMonths: 2
         }, calendarProps), {}, {
           selected: selectedDays,
@@ -225,13 +225,13 @@ var DateRangePicker = exports.DateRangePicker = function DateRangePicker(_ref2)
           onDayMouseLeave: handleMouseLeave
         }, yearProps), {}, {
           locale: locale
-        })), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Footer.DatePickerFooter, {
+        })), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_components.DatePickerFooter, {
           children: [renderLeftFooter && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
             children: renderLeftFooter({
               state: state,
               dispatch: dispatch
             })
-          }), !renderRightPanel && /*#__PURE__*/(0, _jsxRuntime.jsx)(_FooterActions.DatePickerFooterActions, {
+          }), !renderRightPanel && /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.DatePickerFooterActions, {
             onCancel: handleCancel,
             onApply: handleApply,
             disableApply: !isValid,
@@ -239,11 +239,11 @@ var DateRangePicker = exports.DateRangePicker = function DateRangePicker(_ref2)
             ref: cancelElementRef
           })]
         })]
-      }), renderRightPanel && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_SidePanel.DatePickerSidePanel, {
+      }), renderRightPanel && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_components.DatePickerSidePanel, {
         children: [renderRightPanel({
           state: state,
           dispatch: dispatch
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_FooterActions.DatePickerFooterActions, {
+        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.DatePickerFooterActions, {
           onCancel: handleCancel,
           onApply: handleApply,
           disableApply: !isValid,

package/dist/cjs/Fields/DatePicker/DateRangePicker/DateRangePickerDisplay.d.ts

@@ -1,8 +1,8 @@
 /// <reference types="react" />
-import type { WithRequiredProperty } from "../../../types";
-import { type DatePickerDisplayProps } from "../components/Display";
-import type { DatePickerLocale } from "../types";
 import type { DateRangePickerTimeRange } from "./dateRangePickerTimeRange";
+import type { DatePickerDisplayProps } from "../../../Fields/DatePicker/components";
+import type { DatePickerLocale } from "../../../Fields/DatePicker/types";
+import type { WithRequiredProperty } from "../../../types";
 export interface DateRangePickerDisplayProps {
     id?: string;
     range: DateRangePickerTimeRange;

package/dist/cjs/Fields/DatePicker/DateRangePicker/DateRangePickerDisplay.js

@@ -9,10 +9,10 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _react = require("react");
-var _satellitePrefixer = _interopRequireDefault(require("../../../styles/helpers/satellitePrefixer"));
-var _Display = require("../components/Display");
-var _utils = require("../utils");
 var _dateRangePickerTimeRange = require("./dateRangePickerTimeRange");
+var _components = require("./../components");
+var _utils = require("./../utils");
+var _satellitePrefixer = _interopRequireDefault(require("./../../../styles/helpers/satellitePrefixer"));
 var _jsxRuntime = require("react/jsx-runtime");
 var _templateObject;
 var _excluded = ["id", "range", "buttonSize", "locale"];
@@ -24,7 +24,7 @@ var DateRangePickerDisplay = exports.DateRangePickerDisplay = /*#__PURE__*/(0, _
     buttonSize = _ref.buttonSize,
     locale = _ref.locale,
     props = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Display.DatePickerDisplay, _objectSpread(_objectSpread({}, props), {}, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.DatePickerDisplay, _objectSpread(_objectSpread({}, props), {}, {
     id: id,
     size: buttonSize,
     ref: ref,

package/dist/cjs/Fields/DatePicker/DateRangePicker/dateRangePickerReducer.js

@@ -7,11 +7,9 @@ Object.defineProperty(exports, "__esModule", {
 exports.initDateRangePickerReducer = exports.dateRangePickerReducer = exports.DateRangePickerActionTypes = void 0;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _endOfDay = _interopRequireDefault(require("date-fns/endOfDay"));
-var _isAfter = _interopRequireDefault(require("date-fns/isAfter"));
 var _isBefore = _interopRequireDefault(require("date-fns/isBefore"));
-var _isSameDay = _interopRequireDefault(require("date-fns/isSameDay"));
 var _startOfDay = _interopRequireDefault(require("date-fns/startOfDay"));
-var _dateRangePickerTimeRange = require("./dateRangePickerTimeRange");
+var _utils = require("../utils");
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var DateRangePickerActionTypes = exports.DateRangePickerActionTypes = /*#__PURE__*/function (DateRangePickerActionTypes) {
@@ -54,13 +52,7 @@ var dateRangePickerReducer = exports.dateRangePickerReducer = function dateRange
     case DateRangePickerActionTypes.dateSelect:
       {
         return _objectSpread(_objectSpread({}, state), {}, {
-          candidateRange: (0, _dateRangePickerTimeRange.isPartialTimeRange)(state.candidateRange) && ((0, _isSameDay["default"])(action.payload, state.candidateRange.start) || (0, _isAfter["default"])(action.payload, state.candidateRange.start)) ? {
-            start: state.candidateRange.start,
-            end: (0, _endOfDay["default"])(action.payload)
-          } : {
-            start: (0, _startOfDay["default"])(action.payload),
-            end: null
-          }
+          candidateRange: (0, _utils.getDateRange)(state.candidateRange, action.payload)
         });
       }
     case DateRangePickerActionTypes.rangeSelect:

package/dist/cjs/Fields/DatePicker/components/Calendar.d.ts

@@ -1,7 +1,7 @@
 import type { FC } from "react";
 import type { DayPickerDefaultProps, DayPickerRangeProps, DayPickerSingleProps } from "react-day-picker";
+import type { DatePickerLocale } from "../../../Fields/DatePicker/types";
 import type { WithRequiredProperty } from "../../../types";
-import type { DatePickerLocale } from "../types";
 declare type ExcludedDayPickerProps = "captionElement" | "showOutsideDays" | "enableOutsideDaysClick" | "fixedWeeks" | "labels" | "navbarElement" | "onTodayButtonClick" | "pagedNavigation" | "renderDay" | "renderWeek" | "reverseMonths" | "showWeekNumber" | "showWeekDays" | "weekdayElement" | "weekdaysLong" | "weekdaysShort";
 export declare type EditableYearProps = {
     editableYear?: false;

package/dist/cjs/Fields/DatePicker/components/Display.js

@@ -8,8 +8,8 @@ exports.DatePickerDisplay = void 0;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _react = require("react");
-var _Actions = require("../../../Actions");
-var _Icons = require("../../../Icons");
+var _Actions = require("./../../../Actions");
+var _Icons = require("./../../../Icons");
 var _jsxRuntime = require("react/jsx-runtime");
 var _excluded = ["id", "size", "children"];
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }

package/dist/cjs/Fields/DatePicker/components/Footer.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.DatePickerFooter = void 0;
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
-var _satellitePrefixer = _interopRequireDefault(require("../../../styles/helpers/satellitePrefixer"));
+var _satellitePrefixer = _interopRequireDefault(require("./../../../styles/helpers/satellitePrefixer"));
 var _jsxRuntime = require("react/jsx-runtime");
 var _templateObject;
 var DatePickerFooter = exports.DatePickerFooter = function DatePickerFooter(_ref) {

package/dist/cjs/Fields/DatePicker/components/FooterActions.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 import type { ButtonProps } from "../../../Actions";
+import type { DatePickerLocale } from "../../../Fields/DatePicker/types";
 import type { WithRequiredProperty } from "../../../types";
-import type { DatePickerLocale } from "../types";
 export interface DatePickerFooterActionsProps {
     onCancel: ButtonProps["onClick"];
     onApply: ButtonProps["onClick"];

package/dist/cjs/Fields/DatePicker/components/FooterActions.js

@@ -7,8 +7,8 @@ Object.defineProperty(exports, "__esModule", {
 exports.DatePickerFooterActions = void 0;
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
 var _react = require("react");
-var _Actions = require("../../../Actions");
-var _satellitePrefixer = _interopRequireDefault(require("../../../styles/helpers/satellitePrefixer"));
+var _Actions = require("./../../../Actions");
+var _satellitePrefixer = _interopRequireDefault(require("./../../../styles/helpers/satellitePrefixer"));
 var _jsxRuntime = require("react/jsx-runtime");
 var _templateObject, _templateObject2;
 var DatePickerFooterActions = exports.DatePickerFooterActions = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {

package/dist/cjs/Fields/DatePicker/components/NavBar.d.ts

@@ -1,8 +1,8 @@
 import type { FC } from "react";
 import type { CaptionProps } from "react-day-picker";
-import type { WithRequiredProperty } from "../../../types";
-import type { DatePickerLocale } from "../types";
 import type { EditableYearProps } from "./Calendar";
+import type { DatePickerLocale } from "../../../Fields/DatePicker/types";
+import type { WithRequiredProperty } from "../../../types";
 export declare type NavBarProps = CaptionProps & EditableYearProps & {
     locale: WithRequiredProperty<DatePickerLocale, "nextMonth" | "previousMonth">;
 };

package/dist/cjs/Fields/DatePicker/components/NavBar.js

@@ -12,10 +12,10 @@ var _dateFns = require("date-fns");
 var _isSameMonth = _interopRequireDefault(require("date-fns/isSameMonth"));
 var _react = require("react");
 var _reactDayPicker = require("react-day-picker");
-var _Actions = require("../../../Actions");
-var _Icons = require("../../../Icons");
-var _satellitePrefixer = _interopRequireDefault(require("../../../styles/helpers/satellitePrefixer"));
-var _utils = require("../../../utils");
+var _Actions = require("./../../../Actions");
+var _Icons = require("./../../../Icons");
+var _satellitePrefixer = _interopRequireDefault(require("./../../../styles/helpers/satellitePrefixer"));
+var _utils = require("./../../../utils");
 var _jsxRuntime = require("react/jsx-runtime");
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7;
 var NavBar = exports.NavBar = function NavBar(props) {

package/dist/cjs/Fields/DatePicker/components/Popover.js

@@ -9,8 +9,8 @@ exports.DatePickerPopover = void 0;
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
 var Popover = _interopRequireWildcard(require("@radix-ui/react-popover"));
 var _clsx = _interopRequireDefault(require("clsx"));
-var _Satellite = require("../../../Satellite");
-var _satellitePrefixer = _interopRequireDefault(require("../../../styles/helpers/satellitePrefixer"));
+var _Satellite = require("./../../../Satellite");
+var _satellitePrefixer = _interopRequireDefault(require("./../../../styles/helpers/satellitePrefixer"));
 var _jsxRuntime = require("react/jsx-runtime");
 var _templateObject;
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }

package/dist/cjs/Fields/DatePicker/components/SidePanel.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.DatePickerSidePanel = void 0;
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
-var _satellitePrefixer = _interopRequireDefault(require("../../../styles/helpers/satellitePrefixer"));
+var _satellitePrefixer = _interopRequireDefault(require("./../../../styles/helpers/satellitePrefixer"));
 var _jsxRuntime = require("react/jsx-runtime");
 var _templateObject, _templateObject2;
 var DatePickerSidePanel = exports.DatePickerSidePanel = function DatePickerSidePanel(_ref) {

package/dist/cjs/Fields/DatePicker/utils.d.ts

@@ -1,3 +1,11 @@
+import type { DateRangePickerTimeRange } from "./DateRangePicker/dateRangePickerTimeRange";
 import type { DatePickerLocale } from "./types";
 export declare const formatDate: (date: Date | number) => string;
 export declare const DEFAULT_DATE_PICKER_LOCALE: Required<Omit<DatePickerLocale, "formatter">>;
+export declare function getDateRange(currentRange: DateRangePickerTimeRange, newDate: Date): {
+    start: Date;
+    end: Date;
+} | {
+    start: Date;
+    end: null;
+};

package/dist/cjs/Fields/DatePicker/utils.js

@@ -5,7 +5,10 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.formatDate = exports.DEFAULT_DATE_PICKER_LOCALE = void 0;
+exports.getDateRange = getDateRange;
+var _dateFns = require("date-fns");
 var _format = _interopRequireDefault(require("date-fns/format"));
+var _dateRangePickerTimeRange = require("./DateRangePicker/dateRangePickerTimeRange");
 var formatDate = exports.formatDate = function formatDate(date) {
   return (0, _format["default"])(date, "MMM do, yyyy");
 };
@@ -17,4 +20,13 @@ var DEFAULT_DATE_PICKER_LOCALE = exports.DEFAULT_DATE_PICKER_LOCALE = {
   previousMonth: "Previous month",
   nextMonth: "Next month",
   title: "Date Picker"
-};
+};
+function getDateRange(currentRange, newDate) {
+  return (0, _dateRangePickerTimeRange.isPartialTimeRange)(currentRange) && ((0, _dateFns.isSameDay)(newDate, currentRange.start) || (0, _dateFns.isAfter)(newDate, currentRange.start)) ? {
+    start: currentRange.start,
+    end: (0, _dateFns.endOfDay)(newDate)
+  } : {
+    start: (0, _dateFns.startOfDay)(newDate),
+    end: null
+  };
+}