@mui/x-date-pickers 8.0.0-beta.3 → 8.1.0

package/modern/PickersLayout/PickersLayout.js

@@ -1,168 +0,0 @@
-'use client';
-
-import * as React from 'react';
-import PropTypes from 'prop-types';
-import clsx from 'clsx';
-import { styled, useThemeProps } from '@mui/material/styles';
-import composeClasses from '@mui/utils/composeClasses';
-import { pickersLayoutClasses, getPickersLayoutUtilityClass } from "./pickersLayoutClasses.js";
-import usePickerLayout from "./usePickerLayout.js";
-import { usePickerContext } from "../hooks/usePickerContext.js";
-import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
-const useUtilityClasses = (classes, ownerState) => {
-  const {
-    pickerOrientation
-  } = ownerState;
-  const slots = {
-    root: ['root', pickerOrientation === 'landscape' && 'landscape'],
-    contentWrapper: ['contentWrapper']
-  };
-  return composeClasses(slots, getPickersLayoutUtilityClass, classes);
-};
-export const PickersLayoutRoot = styled('div', {
-  name: 'MuiPickersLayout',
-  slot: 'Root',
-  overridesResolver: (props, styles) => styles.root
-})({
-  display: 'grid',
-  gridAutoColumns: 'max-content auto max-content',
-  gridAutoRows: 'max-content auto max-content',
-  [`& .${pickersLayoutClasses.actionBar}`]: {
-    gridColumn: '1 / 4',
-    gridRow: 3
-  },
-  variants: [{
-    props: {
-      pickerOrientation: 'landscape'
-    },
-    style: {
-      [`& .${pickersLayoutClasses.toolbar}`]: {
-        gridColumn: 1,
-        gridRow: '2 / 3'
-      },
-      [`.${pickersLayoutClasses.shortcuts}`]: {
-        gridColumn: '2 / 4',
-        gridRow: 1
-      }
-    }
-  }, {
-    props: {
-      pickerOrientation: 'landscape',
-      layoutDirection: 'rtl'
-    },
-    style: {
-      [`& .${pickersLayoutClasses.toolbar}`]: {
-        gridColumn: 3
-      }
-    }
-  }, {
-    props: {
-      pickerOrientation: 'portrait'
-    },
-    style: {
-      [`& .${pickersLayoutClasses.toolbar}`]: {
-        gridColumn: '2 / 4',
-        gridRow: 1
-      },
-      [`& .${pickersLayoutClasses.shortcuts}`]: {
-        gridColumn: 1,
-        gridRow: '2 / 3'
-      }
-    }
-  }, {
-    props: {
-      pickerOrientation: 'portrait',
-      layoutDirection: 'rtl'
-    },
-    style: {
-      [`& .${pickersLayoutClasses.shortcuts}`]: {
-        gridColumn: 3
-      }
-    }
-  }]
-});
-export const PickersLayoutContentWrapper = styled('div', {
-  name: 'MuiPickersLayout',
-  slot: 'ContentWrapper',
-  overridesResolver: (props, styles) => styles.contentWrapper
-})({
-  gridColumn: '2 / 4',
-  gridRow: 2,
-  display: 'flex',
-  flexDirection: 'column'
-});
-/**
- * Demos:
- *
- * - [Custom layout](https://mui.com/x/react-date-pickers/custom-layout/)
- *
- * API:
- *
- * - [PickersLayout API](https://mui.com/x/api/date-pickers/pickers-layout/)
- */
-const PickersLayout = /*#__PURE__*/React.forwardRef(function PickersLayout(inProps, ref) {
-  const props = useThemeProps({
-    props: inProps,
-    name: 'MuiPickersLayout'
-  });
-  const {
-    toolbar,
-    content,
-    tabs,
-    actionBar,
-    shortcuts,
-    ownerState
-  } = usePickerLayout(props);
-  const {
-    orientation,
-    variant
-  } = usePickerContext();
-  const {
-    sx,
-    className,
-    classes: classesProp
-  } = props;
-  const classes = useUtilityClasses(classesProp, ownerState);
-  return /*#__PURE__*/_jsxs(PickersLayoutRoot, {
-    ref: ref,
-    sx: sx,
-    className: clsx(classes.root, className),
-    ownerState: ownerState,
-    children: [orientation === 'landscape' ? shortcuts : toolbar, orientation === 'landscape' ? toolbar : shortcuts, /*#__PURE__*/_jsx(PickersLayoutContentWrapper, {
-      className: classes.contentWrapper,
-      ownerState: ownerState,
-      children: variant === 'desktop' ? /*#__PURE__*/_jsxs(React.Fragment, {
-        children: [content, tabs]
-      }) : /*#__PURE__*/_jsxs(React.Fragment, {
-        children: [tabs, content]
-      })
-    }), actionBar]
-  });
-});
-process.env.NODE_ENV !== "production" ? PickersLayout.propTypes = {
-  // ----------------------------- Warning --------------------------------
-  // | These PropTypes are generated from the TypeScript type definitions |
-  // | To update them edit the TypeScript types and run "pnpm proptypes"  |
-  // ----------------------------------------------------------------------
-  children: PropTypes.node,
-  /**
-   * Override or extend the styles applied to the component.
-   */
-  classes: PropTypes.object,
-  className: PropTypes.string,
-  /**
-   * The props used for each component slot.
-   * @default {}
-   */
-  slotProps: PropTypes.object,
-  /**
-   * Overridable component slots.
-   * @default {}
-   */
-  slots: PropTypes.object,
-  /**
-   * The system prop that allows defining system overrides as well as additional CSS styles.
-   */
-  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])
-} : void 0;
-export { PickersLayout };

package/modern/PickersLayout/PickersLayout.types.d.ts

@@ -1,100 +0,0 @@
-import * as React from 'react';
-import { SxProps, Theme } from '@mui/material/styles';
-import { SlotComponentProps } from '@mui/utils';
-import { PickersActionBar, PickersActionBarProps } from "../PickersActionBar/index.js";
-import { BaseToolbarProps, ExportedBaseToolbarProps } from "../internals/models/props/toolbar.js";
-import { ExportedBaseTabsProps } from "../internals/models/props/tabs.js";
-import { PickersLayoutClasses } from "./pickersLayoutClasses.js";
-import { PickersShortcutsProps } from "../PickersShortcuts/index.js";
-import { ExportedPickersShortcutProps, PickersShortcuts } from "../PickersShortcuts/PickersShortcuts.js";
-import { PickerOwnerState } from "../models/index.js";
-import { PickerValidValue } from "../internals/models/index.js";
-export interface ExportedPickersLayoutSlots<TValue extends PickerValidValue> {
-  /**
-   * Custom component for the action bar, it is placed below the Picker views.
-   * @default PickersActionBar
-   */
-  actionBar?: React.ElementType<PickersActionBarProps>;
-  /**
-   * Custom component for the shortcuts.
-   * @default PickersShortcuts
-   */
-  shortcuts?: React.JSXElementConstructor<PickersShortcutsProps<TValue>>;
-  /**
-   * Custom component for wrapping the layout.
-   * It wraps the toolbar, views, action bar, and shortcuts.
-   */
-  layout?: React.JSXElementConstructor<PickersLayoutProps<TValue> & React.RefAttributes<HTMLDivElement>>;
-}
-export interface PickerLayoutOwnerState extends PickerOwnerState {
-  /**
-   * The direction of the layout.
-   * Is equal to "ltr" when the layout is in left-to-right direction.
-   * Is equal to "rtl" when the layout is in right-to-left direction.
-   */
-  layoutDirection: 'ltr' | 'rtl';
-}
-export interface ExportedPickersLayoutSlotProps<TValue extends PickerValidValue> {
-  /**
-   * Props passed down to the action bar component.
-   */
-  actionBar?: SlotComponentProps<typeof PickersActionBar, {}, PickerLayoutOwnerState>;
-  /**
-   * Props passed down to the shortcuts component.
-   */
-  shortcuts?: SlotComponentProps<typeof PickersShortcuts, {}, PickerLayoutOwnerState>;
-  /**
-   * Props passed down to the layoutRoot component.
-   */
-  layout?: Partial<PickersLayoutProps<TValue>>;
-}
-export interface PickersLayoutSlots<TValue extends PickerValidValue> extends ExportedPickersLayoutSlots<TValue> {
-  /**
-   * Tabs enabling toggling between views.
-   */
-  tabs?: React.ElementType<{}>;
-  /**
-   * Custom component for the toolbar.
-   * It is placed above the Picker views.
-   */
-  toolbar?: React.JSXElementConstructor<BaseToolbarProps>;
-}
-export interface PickersLayoutSlotProps<TValue extends PickerValidValue> extends ExportedPickersLayoutSlotProps<TValue> {
-  /**
-   * Props passed down to the tabs component.
-   */
-  tabs?: ExportedBaseTabsProps;
-  /**
-   * Props passed down to the toolbar component.
-   */
-  toolbar?: ExportedBaseToolbarProps;
-}
-export interface PickersLayoutProps<TValue extends PickerValidValue> {
-  className?: string;
-  children?: React.ReactNode;
-  /**
-   * The system prop that allows defining system overrides as well as additional CSS styles.
-   */
-  sx?: SxProps<Theme>;
-  /**
-   * Override or extend the styles applied to the component.
-   */
-  classes?: Partial<PickersLayoutClasses>;
-  /**
-   * Overridable component slots.
-   * @default {}
-   */
-  slots?: PickersLayoutSlots<TValue>;
-  /**
-   * The props used for each component slot.
-   * @default {}
-   */
-  slotProps?: PickersLayoutSlotProps<TValue>;
-}
-export interface SubComponents<TValue extends PickerValidValue> {
-  toolbar: React.ReactElement<ExportedBaseToolbarProps> | null;
-  content: React.ReactNode;
-  tabs: React.ReactElement<ExportedBaseTabsProps> | null;
-  actionBar: React.ReactElement<PickersActionBarProps>;
-  shortcuts: React.ReactElement<ExportedPickersShortcutProps<TValue>> | null;
-}

package/modern/PickersLayout/PickersLayout.types.js

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

package/modern/PickersLayout/index.d.ts

@@ -1,5 +0,0 @@
-export { PickersLayout, PickersLayoutRoot, PickersLayoutContentWrapper } from "./PickersLayout.js";
-export type { PickersLayoutProps, PickersLayoutSlots, PickersLayoutSlotProps, ExportedPickersLayoutSlots, ExportedPickersLayoutSlotProps, PickerLayoutOwnerState } from './PickersLayout.types';
-export { default as usePickerLayout } from "./usePickerLayout.js";
-export { pickersLayoutClasses } from "./pickersLayoutClasses.js";
-export type { PickersLayoutClassKey } from './pickersLayoutClasses';

package/modern/PickersLayout/index.js

@@ -1,3 +0,0 @@
-export { PickersLayout, PickersLayoutRoot, PickersLayoutContentWrapper } from "./PickersLayout.js";
-export { default as usePickerLayout } from "./usePickerLayout.js";
-export { pickersLayoutClasses } from "./pickersLayoutClasses.js";

package/modern/PickersLayout/pickersLayoutClasses.d.ts

@@ -1,19 +0,0 @@
-export interface PickersLayoutClasses {
-  /** Styles applied to the root element. */
-  root: string;
-  /** Styles applied to the root element in landscape orientation. */
-  landscape: string;
-  /** Styles applied to the contentWrapper element (which contains the tabs and the view itself). */
-  contentWrapper: string;
-  /** Styles applied to the toolbar. */
-  toolbar: string;
-  /** Styles applied to the action bar. */
-  actionBar: string;
-  /** Styles applied to the tabs. */
-  tabs: string;
-  /** Styles applied to the shortcuts container. */
-  shortcuts: string;
-}
-export type PickersLayoutClassKey = keyof PickersLayoutClasses;
-export declare function getPickersLayoutUtilityClass(slot: string): string;
-export declare const pickersLayoutClasses: Record<keyof PickersLayoutClasses, string>;

package/modern/PickersLayout/pickersLayoutClasses.js

@@ -1,6 +0,0 @@
-import generateUtilityClass from '@mui/utils/generateUtilityClass';
-import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
-export function getPickersLayoutUtilityClass(slot) {
-  return generateUtilityClass('MuiPickersLayout', slot);
-}
-export const pickersLayoutClasses = generateUtilityClasses('MuiPickersLayout', ['root', 'landscape', 'contentWrapper', 'toolbar', 'actionBar', 'tabs', 'shortcuts']);

package/modern/PickersLayout/usePickerLayout.d.ts

@@ -1,7 +0,0 @@
-import { PickerLayoutOwnerState, PickersLayoutProps, SubComponents } from "./PickersLayout.types.js";
-import { PickerValidValue } from "../internals/models/index.js";
-interface UsePickerLayoutResponse<TValue extends PickerValidValue> extends SubComponents<TValue> {
-  ownerState: PickerLayoutOwnerState;
-}
-declare const usePickerLayout: <TValue extends PickerValidValue>(props: PickersLayoutProps<TValue>) => UsePickerLayoutResponse<TValue>;
-export default usePickerLayout;

package/modern/PickersLayout/usePickerLayout.js

@@ -1,104 +0,0 @@
-'use client';
-
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-import _extends from "@babel/runtime/helpers/esm/extends";
-const _excluded = ["ownerState"];
-import * as React from 'react';
-import useSlotProps from '@mui/utils/useSlotProps';
-import composeClasses from '@mui/utils/composeClasses';
-import { useRtl } from '@mui/system/RtlProvider';
-import { PickersActionBar } from "../PickersActionBar/index.js";
-import { getPickersLayoutUtilityClass } from "./pickersLayoutClasses.js";
-import { PickersShortcuts } from "../PickersShortcuts/index.js";
-import { usePickerPrivateContext } from "../internals/hooks/usePickerPrivateContext.js";
-import { usePickerContext } from "../hooks/index.js";
-import { jsx as _jsx } from "react/jsx-runtime";
-function toolbarHasView(toolbarProps) {
-  return toolbarProps.view !== null;
-}
-const useUtilityClasses = (classes, ownerState) => {
-  const {
-    pickerOrientation
-  } = ownerState;
-  const slots = {
-    root: ['root', pickerOrientation === 'landscape' && 'landscape'],
-    contentWrapper: ['contentWrapper'],
-    toolbar: ['toolbar'],
-    actionBar: ['actionBar'],
-    tabs: ['tabs'],
-    landscape: ['landscape'],
-    shortcuts: ['shortcuts']
-  };
-  return composeClasses(slots, getPickersLayoutUtilityClass, classes);
-};
-const usePickerLayout = props => {
-  const {
-    ownerState: pickerOwnerState
-  } = usePickerPrivateContext();
-  const {
-    view
-  } = usePickerContext();
-  const isRtl = useRtl();
-  const {
-    children,
-    slots,
-    slotProps,
-    classes: classesProp
-  } = props;
-  const ownerState = React.useMemo(() => _extends({}, pickerOwnerState, {
-    layoutDirection: isRtl ? 'rtl' : 'ltr'
-  }), [pickerOwnerState, isRtl]);
-  const classes = useUtilityClasses(classesProp, ownerState);
-
-  // Action bar
-  const ActionBar = slots?.actionBar ?? PickersActionBar;
-  const _useSlotProps = useSlotProps({
-      elementType: ActionBar,
-      externalSlotProps: slotProps?.actionBar,
-      additionalProps: {
-        actions: ['cancel', 'accept']
-      },
-      className: classes.actionBar,
-      ownerState
-    }),
-    actionBarProps = _objectWithoutPropertiesLoose(_useSlotProps, _excluded);
-  const actionBar = /*#__PURE__*/_jsx(ActionBar, _extends({}, actionBarProps));
-
-  // Toolbar
-  const Toolbar = slots?.toolbar;
-  const toolbarProps = useSlotProps({
-    elementType: Toolbar,
-    externalSlotProps: slotProps?.toolbar,
-    className: classes.toolbar,
-    ownerState
-  });
-  const toolbar = toolbarHasView(toolbarProps) && !!Toolbar ? /*#__PURE__*/_jsx(Toolbar, _extends({}, toolbarProps)) : null;
-
-  // Content
-  const content = children;
-
-  // Tabs
-  const Tabs = slots?.tabs;
-  const tabs = view && Tabs ? /*#__PURE__*/_jsx(Tabs, _extends({
-    className: classes.tabs
-  }, slotProps?.tabs)) : null;
-
-  // Shortcuts
-  const Shortcuts = slots?.shortcuts ?? PickersShortcuts;
-  const shortcutsProps = useSlotProps({
-    elementType: Shortcuts,
-    externalSlotProps: slotProps?.shortcuts,
-    className: classes.shortcuts,
-    ownerState
-  });
-  const shortcuts = view && !!Shortcuts ? /*#__PURE__*/_jsx(Shortcuts, _extends({}, shortcutsProps)) : null;
-  return {
-    toolbar,
-    content,
-    tabs,
-    actionBar,
-    shortcuts,
-    ownerState
-  };
-};
-export default usePickerLayout;

package/modern/PickersSectionList/PickersSectionList.d.ts

@@ -1,20 +0,0 @@
-import * as React from 'react';
-import type { PickersSectionListProps } from './PickersSectionList.types';
-export declare const PickersSectionListRoot: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof React.ClassAttributes<HTMLDivElement> | keyof React.HTMLAttributes<HTMLDivElement>>, {}>;
-export declare const PickersSectionListSection: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, keyof React.ClassAttributes<HTMLSpanElement> | keyof React.HTMLAttributes<HTMLSpanElement>>, {}>;
-export declare const PickersSectionListSectionSeparator: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, keyof React.ClassAttributes<HTMLSpanElement> | keyof React.HTMLAttributes<HTMLSpanElement>>, {}>;
-export declare const PickersSectionListSectionContent: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, keyof React.ClassAttributes<HTMLSpanElement> | keyof React.HTMLAttributes<HTMLSpanElement>>, {}>;
-type PickersSectionListComponent = ((props: PickersSectionListProps & React.RefAttributes<HTMLDivElement>) => React.JSX.Element) & {
-  propTypes?: any;
-};
-/**
- * Demos:
- *
- * - [Custom field](https://mui.com/x/react-date-pickers/custom-field/)
- *
- * API:
- *
- * - [PickersSectionList API](https://mui.com/x/api/date-pickers/pickers-section-list/)
- */
-declare const PickersSectionList: PickersSectionListComponent;
-export { PickersSectionList };