@mui/x-date-pickers-pro 8.0.0-alpha.11 → 8.0.0-alpha.12

package/{node → esm}/SingleInputDateRangeField/SingleInputDateRangeField.js

@@ -1,22 +1,15 @@
-"use strict";
 'use client';
 
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.SingleInputDateRangeField = void 0;
-var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
-var React = _interopRequireWildcard(require("react"));
-var _propTypes = _interopRequireDefault(require("prop-types"));
-var _styles = require("@mui/material/styles");
-var _utils = require("@mui/utils");
-var _icons = require("@mui/x-date-pickers/icons");
-var _internals = require("@mui/x-date-pickers/internals");
-var _useSingleInputDateRangeField = require("./useSingleInputDateRangeField");
-var _jsxRuntime = require("react/jsx-runtime");
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 const _excluded = ["slots", "slotProps"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import { useThemeProps } from '@mui/material/styles';
+import { refType } from '@mui/utils';
+import { DateRangeIcon } from '@mui/x-date-pickers/icons';
+import { PickerFieldUI, useFieldTextFieldProps } from '@mui/x-date-pickers/internals';
+import { useSingleInputDateRangeField } from "./useSingleInputDateRangeField.js";
+import { jsx as _jsx } from "react/jsx-runtime";
 /**
  * Demos:
  *
@@ -27,8 +20,8 @@ const _excluded = ["slots", "slotProps"];
  *
  * - [SingleInputDateRangeField API](https://mui.com/x/api/single-input-date-range-field/)
  */
-const SingleInputDateRangeField = exports.SingleInputDateRangeField = /*#__PURE__*/React.forwardRef(function SingleInputDateRangeField(inProps, inRef) {
-  const themeProps = (0, _styles.useThemeProps)({
+const SingleInputDateRangeField = /*#__PURE__*/React.forwardRef(function SingleInputDateRangeField(inProps, inRef) {
+  const themeProps = useThemeProps({
     props: inProps,
     name: 'MuiSingleInputDateRangeField'
   });
@@ -36,18 +29,18 @@ const SingleInputDateRangeField = exports.SingleInputDateRangeField = /*#__PURE_
       slots,
       slotProps
     } = themeProps,
-    other = (0, _objectWithoutPropertiesLoose2.default)(themeProps, _excluded);
-  const textFieldProps = (0, _internals.useFieldTextFieldProps)({
+    other = _objectWithoutPropertiesLoose(themeProps, _excluded);
+  const textFieldProps = useFieldTextFieldProps({
     slotProps,
     ref: inRef,
     externalForwardedProps: other
   });
-  const fieldResponse = (0, _useSingleInputDateRangeField.useSingleInputDateRangeField)(textFieldProps);
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_internals.PickerFieldUI, {
+  const fieldResponse = useSingleInputDateRangeField(textFieldProps);
+  return /*#__PURE__*/_jsx(PickerFieldUI, {
     slots: slots,
     slotProps: slotProps,
     fieldResponse: fieldResponse,
-    defaultOpenPickerIcon: _icons.DateRangeIcon
+    defaultOpenPickerIcon: DateRangeIcon
   });
 });
 SingleInputDateRangeField.fieldType = 'single-input';
@@ -60,139 +53,139 @@ process.env.NODE_ENV !== "production" ? SingleInputDateRangeField.propTypes = {
    * If `true`, the `input` element is focused during the first mount.
    * @default false
    */
-  autoFocus: _propTypes.default.bool,
-  className: _propTypes.default.string,
+  autoFocus: PropTypes.bool,
+  className: PropTypes.string,
   /**
    * If `true`, a clear button will be shown in the field allowing value clearing.
    * @default false
    */
-  clearable: _propTypes.default.bool,
+  clearable: PropTypes.bool,
   /**
    * The position at which the clear button is placed.
    * If the field is not clearable, the button is not rendered.
    * @default 'end'
    */
-  clearButtonPosition: _propTypes.default.oneOf(['end', 'start']),
+  clearButtonPosition: PropTypes.oneOf(['end', 'start']),
   /**
    * The color of the component.
    * It supports both default and custom theme colors, which can be added as shown in the
    * [palette customization guide](https://mui.com/material-ui/customization/palette/#custom-colors).
    * @default 'primary'
    */
-  color: _propTypes.default.oneOf(['error', 'info', 'primary', 'secondary', 'success', 'warning']),
-  component: _propTypes.default.elementType,
+  color: PropTypes.oneOf(['error', 'info', 'primary', 'secondary', 'success', 'warning']),
+  component: PropTypes.elementType,
   /**
    * String displayed between the start and the end dates.
    * @default "–"
    */
-  dateSeparator: _propTypes.default.string,
+  dateSeparator: PropTypes.string,
   /**
    * The default value. Use when the component is not controlled.
    */
-  defaultValue: _propTypes.default.arrayOf(_propTypes.default.object),
+  defaultValue: PropTypes.arrayOf(PropTypes.object),
   /**
    * If `true`, the component is disabled.
    * When disabled, the value cannot be changed and no interaction is possible.
    * @default false
    */
-  disabled: _propTypes.default.bool,
+  disabled: PropTypes.bool,
   /**
    * If `true`, disable values after the current date for date components, time for time components and both for date time components.
    * @default false
    */
-  disableFuture: _propTypes.default.bool,
+  disableFuture: PropTypes.bool,
   /**
    * If `true`, disable values before the current date for date components, time for time components and both for date time components.
    * @default false
    */
-  disablePast: _propTypes.default.bool,
+  disablePast: PropTypes.bool,
   /**
    * @default true
    */
-  enableAccessibleFieldDOMStructure: _propTypes.default.bool,
+  enableAccessibleFieldDOMStructure: PropTypes.bool,
   /**
    * If `true`, the component is displayed in focused state.
    */
-  focused: _propTypes.default.bool,
+  focused: PropTypes.bool,
   /**
    * Format of the date when rendered in the input(s).
    */
-  format: _propTypes.default.string,
+  format: PropTypes.string,
   /**
    * Density of the format when rendered in the input.
    * Setting `formatDensity` to `"spacious"` will add a space before and after each `/`, `-` and `.` character.
    * @default "dense"
    */
-  formatDensity: _propTypes.default.oneOf(['dense', 'spacious']),
+  formatDensity: PropTypes.oneOf(['dense', 'spacious']),
   /**
    * Props applied to the [`FormHelperText`](/material-ui/api/form-helper-text/) element.
    */
-  FormHelperTextProps: _propTypes.default.object,
+  FormHelperTextProps: PropTypes.object,
   /**
    * If `true`, the input will take up the full width of its container.
    * @default false
    */
-  fullWidth: _propTypes.default.bool,
+  fullWidth: PropTypes.bool,
   /**
    * The helper text content.
    */
-  helperText: _propTypes.default.node,
+  helperText: PropTypes.node,
   /**
    * If `true`, the label is hidden.
    * This is used to increase density for a `FilledInput`.
    * Be sure to add `aria-label` to the `input` element.
    * @default false
    */
-  hiddenLabel: _propTypes.default.bool,
+  hiddenLabel: PropTypes.bool,
   /**
    * The id of the `input` element.
    * Use this prop to make `label` and `helperText` accessible for screen readers.
    */
-  id: _propTypes.default.string,
+  id: PropTypes.string,
   /**
    * Props applied to the [`InputLabel`](/material-ui/api/input-label/) element.
    * Pointer events like `onClick` are enabled if and only if `shrink` is `true`.
    */
-  InputLabelProps: _propTypes.default.object,
+  InputLabelProps: PropTypes.object,
   /**
    * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#Attributes) applied to the `input` element.
    */
-  inputProps: _propTypes.default.object,
+  inputProps: PropTypes.object,
   /**
    * Props applied to the Input element.
    * It will be a [`FilledInput`](/material-ui/api/filled-input/),
    * [`OutlinedInput`](/material-ui/api/outlined-input/) or [`Input`](/material-ui/api/input/)
    * component depending on the `variant` prop value.
    */
-  InputProps: _propTypes.default.object,
+  InputProps: PropTypes.object,
   /**
    * Pass a ref to the `input` element.
    */
-  inputRef: _utils.refType,
+  inputRef: refType,
   /**
    * The label content.
    */
-  label: _propTypes.default.node,
+  label: PropTypes.node,
   /**
    * If `dense` or `normal`, will adjust vertical spacing of this and contained components.
    * @default 'none'
    */
-  margin: _propTypes.default.oneOf(['dense', 'none', 'normal']),
+  margin: PropTypes.oneOf(['dense', 'none', 'normal']),
   /**
    * Maximal selectable date.
    * @default 2099-12-31
    */
-  maxDate: _propTypes.default.object,
+  maxDate: PropTypes.object,
   /**
    * Minimal selectable date.
    * @default 1900-01-01
    */
-  minDate: _propTypes.default.object,
+  minDate: PropTypes.object,
   /**
    * Name attribute of the `input` element.
    */
-  name: _propTypes.default.string,
-  onBlur: _propTypes.default.func,
+  name: PropTypes.string,
+  onBlur: PropTypes.func,
   /**
    * Callback fired when the value changes.
    * @template TValue The value type. It will be the same type as `value` or `null`. It can be in `[start, end]` format in case of range value.
@@ -200,11 +193,11 @@ process.env.NODE_ENV !== "production" ? SingleInputDateRangeField.propTypes = {
    * @param {TValue} value The new value.
    * @param {FieldChangeHandlerContext<TError>} context The context containing the validation result of the current value.
    */
-  onChange: _propTypes.default.func,
+  onChange: PropTypes.func,
   /**
    * Callback fired when the clear button is clicked.
    */
-  onClear: _propTypes.default.func,
+  onClear: PropTypes.func,
   /**
    * Callback fired when the error associated with the current value changes.
    * When a validation error is detected, the `error` parameter contains a non-null value.
@@ -214,30 +207,30 @@ process.env.NODE_ENV !== "production" ? SingleInputDateRangeField.propTypes = {
    * @param {TError} error The reason why the current value is not valid.
    * @param {TValue} value The value associated with the error.
    */
-  onError: _propTypes.default.func,
-  onFocus: _propTypes.default.func,
+  onError: PropTypes.func,
+  onFocus: PropTypes.func,
   /**
    * Callback fired when the selected sections change.
    * @param {FieldSelectedSections} newValue The new selected sections.
    */
-  onSelectedSectionsChange: _propTypes.default.func,
+  onSelectedSectionsChange: PropTypes.func,
   /**
    * If `true`, the component is read-only.
    * When read-only, the value cannot be changed but the user can interact with the interface.
    * @default false
    */
-  readOnly: _propTypes.default.bool,
+  readOnly: PropTypes.bool,
   /**
    * The date used to generate a part of the new value that is not present in the format when both `value` and `defaultValue` are empty.
    * For example, on time fields it will be used to determine the date to set.
    * @default The closest valid date using the validation props, except callbacks such as `shouldDisableDate`. Value is rounded to the most granular section used.
    */
-  referenceDate: _propTypes.default.object,
+  referenceDate: PropTypes.object,
   /**
    * If `true`, the label is displayed as required and the `input` element is required.
    * @default false
    */
-  required: _propTypes.default.bool,
+  required: PropTypes.bool,
   /**
    * The currently selected sections.
    * This prop accepts four formats:
@@ -247,7 +240,7 @@ process.env.NODE_ENV !== "production" ? SingleInputDateRangeField.propTypes = {
    * 4. If `null` is provided, no section will be selected.
    * If not provided, the selected sections will be handled internally.
    */
-  selectedSections: _propTypes.default.oneOfType([_propTypes.default.oneOf(['all', 'day', 'empty', 'hours', 'meridiem', 'minutes', 'month', 'seconds', 'weekDay', 'year']), _propTypes.default.number]),
+  selectedSections: PropTypes.oneOfType([PropTypes.oneOf(['all', 'day', 'empty', 'hours', 'meridiem', 'minutes', 'month', 'seconds', 'weekDay', 'year']), PropTypes.number]),
   /**
    * Disable specific date.
    *
@@ -257,7 +250,7 @@ process.env.NODE_ENV !== "production" ? SingleInputDateRangeField.propTypes = {
    * @param {string} position The date to test, 'start' or 'end'.
    * @returns {boolean} Returns `true` if the date should be disabled.
    */
-  shouldDisableDate: _propTypes.default.func,
+  shouldDisableDate: PropTypes.func,
   /**
    * If `true`, the format will respect the leading zeroes (for example on dayjs, the format `M/D/YYYY` will render `8/16/2018`)
    * If `false`, the format will always add leading zeroes (for example on dayjs, the format `M/D/YYYY` will render `08/16/2018`)
@@ -272,26 +265,26 @@ process.env.NODE_ENV !== "production" ? SingleInputDateRangeField.propTypes = {
    *
    * @default false
    */
-  shouldRespectLeadingZeros: _propTypes.default.bool,
+  shouldRespectLeadingZeros: PropTypes.bool,
   /**
    * The size of the component.
    */
-  size: _propTypes.default.oneOf(['medium', 'small']),
+  size: PropTypes.oneOf(['medium', 'small']),
   /**
    * The props used for each component slot.
    * @default {}
    */
-  slotProps: _propTypes.default.object,
+  slotProps: PropTypes.object,
   /**
    * Overridable component slots.
    * @default {}
    */
-  slots: _propTypes.default.object,
-  style: _propTypes.default.object,
+  slots: PropTypes.object,
+  style: PropTypes.object,
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
-  sx: _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.object, _propTypes.default.bool])), _propTypes.default.func, _propTypes.default.object]),
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
   /**
    * Choose which timezone to use for the value.
    * Example: "default", "system", "UTC", "America/New_York".
@@ -299,19 +292,20 @@ process.env.NODE_ENV !== "production" ? SingleInputDateRangeField.propTypes = {
    * @see See the {@link https://mui.com/x/react-date-pickers/timezone/ timezones documentation} for more details.
    * @default The timezone of the `value` or `defaultValue` prop is defined, 'default' otherwise.
    */
-  timezone: _propTypes.default.string,
+  timezone: PropTypes.string,
   /**
    * The ref object used to imperatively interact with the field.
    */
-  unstableFieldRef: _propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.object]),
+  unstableFieldRef: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
   /**
    * The selected value.
    * Used when the component is controlled.
    */
-  value: _propTypes.default.arrayOf(_propTypes.default.object),
+  value: PropTypes.arrayOf(PropTypes.object),
   /**
    * The variant to use.
    * @default 'outlined'
    */
-  variant: _propTypes.default.oneOf(['filled', 'outlined', 'standard'])
-} : void 0;
+  variant: PropTypes.oneOf(['filled', 'outlined', 'standard'])
+} : void 0;
+export { SingleInputDateRangeField };

package/esm/SingleInputDateRangeField/SingleInputDateRangeField.types.d.ts

@@ -0,0 +1,18 @@
+import { ExportedPickerFieldUIProps, PickerFieldUISlots, PickerFieldUISlotProps } from '@mui/x-date-pickers/internals';
+import { BuiltInFieldTextFieldProps } from '@mui/x-date-pickers/models';
+import { DateRangeManagerFieldInternalProps } from "../managers/useDateRangeManager.js";
+export interface UseSingleInputDateRangeFieldProps<TEnableAccessibleFieldDOMStructure extends boolean> extends DateRangeManagerFieldInternalProps<TEnableAccessibleFieldDOMStructure>, Omit<ExportedPickerFieldUIProps, 'openPickerButtonPosition'> {}
+export type SingleInputDateRangeFieldProps<TEnableAccessibleFieldDOMStructure extends boolean = true> = Omit<BuiltInFieldTextFieldProps<TEnableAccessibleFieldDOMStructure>, keyof UseSingleInputDateRangeFieldProps<TEnableAccessibleFieldDOMStructure>> & UseSingleInputDateRangeFieldProps<TEnableAccessibleFieldDOMStructure> & {
+  /**
+   * Overridable component slots.
+   * @default {}
+   */
+  slots?: SingleInputDateRangeFieldSlots;
+  /**
+   * The props used for each component slot.
+   * @default {}
+   */
+  slotProps?: SingleInputDateRangeFieldSlotProps;
+};
+export interface SingleInputDateRangeFieldSlots extends PickerFieldUISlots {}
+export interface SingleInputDateRangeFieldSlotProps extends PickerFieldUISlotProps {}

package/esm/SingleInputDateRangeField/SingleInputDateRangeField.types.js

@@ -0,0 +1 @@
+export {};

package/esm/SingleInputDateRangeField/index.d.ts

@@ -0,0 +1,3 @@
+export { SingleInputDateRangeField } from "./SingleInputDateRangeField.js";
+export { useSingleInputDateRangeField as unstable_useSingleInputDateRangeField } from "./useSingleInputDateRangeField.js";
+export type { UseSingleInputDateRangeFieldProps, SingleInputDateRangeFieldProps } from './SingleInputDateRangeField.types';

package/esm/SingleInputDateRangeField/index.js

@@ -0,0 +1,2 @@
+export { SingleInputDateRangeField } from "./SingleInputDateRangeField.js";
+export { useSingleInputDateRangeField as unstable_useSingleInputDateRangeField } from "./useSingleInputDateRangeField.js";

package/esm/SingleInputDateRangeField/useSingleInputDateRangeField.d.ts

@@ -0,0 +1,2 @@
+import { UseSingleInputDateRangeFieldProps } from "./SingleInputDateRangeField.types.js";
+export declare const useSingleInputDateRangeField: <TEnableAccessibleFieldDOMStructure extends boolean, TAllProps extends UseSingleInputDateRangeFieldProps<TEnableAccessibleFieldDOMStructure>>(props: TAllProps) => import("@mui/x-date-pickers/internals").UseFieldResponse<TEnableAccessibleFieldDOMStructure, Omit<TAllProps, "disabled" | "readOnly" | "value" | "defaultValue" | "autoFocus" | "onChange" | "onError" | "format" | "unstableFieldRef" | "referenceDate" | "formatDensity" | "shouldRespectLeadingZeros" | "selectedSections" | "onSelectedSectionsChange" | "enableAccessibleFieldDOMStructure" | "timezone" | keyof import("@mui/x-date-pickers/internals").BaseDateValidationProps | "shouldDisableDate" | "shouldDisableMonth" | "shouldDisableYear" | "unstableStartFieldRef" | "unstableEndFieldRef" | "dateSeparator">>;

package/esm/SingleInputDateRangeField/useSingleInputDateRangeField.js

@@ -0,0 +1,25 @@
+'use client';
+
+import { useField, useFieldInternalPropsWithDefaults } from '@mui/x-date-pickers/internals';
+import { useSplitFieldProps } from '@mui/x-date-pickers/hooks';
+import { useDateRangeManager } from "../managers/index.js";
+export const useSingleInputDateRangeField = props => {
+  const manager = useDateRangeManager(props);
+  const {
+    forwardedProps,
+    internalProps
+  } = useSplitFieldProps(props, 'date');
+  const internalPropsWithDefaults = useFieldInternalPropsWithDefaults({
+    manager,
+    internalProps
+  });
+  return useField({
+    forwardedProps,
+    internalProps: internalPropsWithDefaults,
+    valueManager: manager.internal_valueManager,
+    fieldValueManager: manager.internal_fieldValueManager,
+    validator: manager.validator,
+    valueType: manager.valueType,
+    getOpenPickerButtonAriaLabel: manager.internal_getOpenPickerButtonAriaLabel
+  });
+};

package/esm/SingleInputDateTimeRangeField/SingleInputDateTimeRangeField.d.ts

@@ -0,0 +1,19 @@
+import * as React from 'react';
+import { SingleInputDateTimeRangeFieldProps } from "./SingleInputDateTimeRangeField.types.js";
+import { FieldType } from "../models/index.js";
+type DateRangeFieldComponent = (<TEnableAccessibleFieldDOMStructure extends boolean = true>(props: SingleInputDateTimeRangeFieldProps<TEnableAccessibleFieldDOMStructure> & React.RefAttributes<HTMLDivElement>) => React.JSX.Element) & {
+  propTypes?: any;
+  fieldType?: FieldType;
+};
+/**
+ * Demos:
+ *
+ * - [DateTimeRangeField](http://mui.com/x/react-date-pickers/date-time-range-field/)
+ * - [Fields](https://mui.com/x/react-date-pickers/fields/)
+ *
+ * API:
+ *
+ * - [SingleInputDateTimeRangeField API](https://mui.com/x/api/single-input-date-time-range-field/)
+ */
+declare const SingleInputDateTimeRangeField: DateRangeFieldComponent;
+export { SingleInputDateTimeRangeField };