Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[ClickAwayListener] Move to the core package #29186

Merged
merged 3 commits into from
Oct 25, 2021
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion docs/pages/api-docs/click-away-listener.json
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,7 @@
"name": "ClickAwayListener",
"styles": { "classes": [], "globalClasses": {}, "name": null },
"spread": false,
"filename": "/packages/mui-material/src/ClickAwayListener/ClickAwayListener.tsx",
"filename": "/packages/mui-core/src/ClickAwayListener/ClickAwayListener.tsx",
"inheritance": null,
"demos": "<ul><li><a href=\"/components/click-away-listener/\">Click Away Listener</a></li>\n<li><a href=\"/components/menus/\">Menus</a></li></ul>",
"cssComponent": false
Expand Down
2 changes: 1 addition & 1 deletion docs/src/components/header/HeaderNavDropdown.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@ import * as React from 'react';
import { styled } from '@mui/material/styles';
import Box from '@mui/material/Box';
import Collapse from '@mui/material/Collapse';
import ClickAwayListener from '@mui/material/ClickAwayListener';
import ClickAwayListener from '@mui/core/ClickAwayListener';
import IconButton from '@mui/material/IconButton';
import Typography from '@mui/material/Typography';
import KeyboardArrowDownRounded from '@mui/icons-material/KeyboardArrowDownRounded';
Expand Down
2 changes: 1 addition & 1 deletion docs/src/modules/components/Notifications.js
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@ import Typography from '@mui/material/Typography';
import Popper from '@mui/material/Popper';
import Grow from '@mui/material/Grow';
import MuiPaper from '@mui/material/Paper';
import ClickAwayListener from '@mui/material/ClickAwayListener';
import ClickAwayListener from '@mui/core/ClickAwayListener';
import MuiList from '@mui/material/List';
import MuiListItem from '@mui/material/ListItem';
import MuiDivider from '@mui/material/Divider';
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -36,3 +36,13 @@ However, you can configure it to respond to the leading events (mouse down + tou
{{"demo": "pages/components/click-away-listener/LeadingClickAway.js"}}

> ⚠️ In this mode, only interactions on the scrollbar of the document is ignored.

## Unstyled

- 📦 [784 B gzipped](https://bundlephobia.com/result?p=@mui/core@latest)

As the component does not have any styles, it also comes with the unstyled package.

```js
import ClickAwayListener from '@mui/core/ClickAwayListener';
```
Original file line number Diff line number Diff line change
Expand Up @@ -3,8 +3,8 @@ import * as ReactDOM from 'react-dom';
import { expect } from 'chai';
import { spy, useFakeTimers } from 'sinon';
import { act, createClientRender, fireEvent, fireDiscreteEvent, screen } from 'test/utils';
import Portal from '../Portal';
import ClickAwayListener from './ClickAwayListener';
import Portal from '@mui/core/Portal';
import ClickAwayListener from '@mui/core/ClickAwayListener';

describe('<ClickAwayListener />', () => {
/**
Expand Down
Original file line number Diff line number Diff line change
@@ -1,9 +1,12 @@
import * as React from 'react';
import PropTypes from 'prop-types';
import { elementAcceptingRef, exactProp } from '@mui/utils';
import ownerDocument from '../utils/ownerDocument';
import useForkRef from '../utils/useForkRef';
import useEventCallback from '../utils/useEventCallback';
import {
elementAcceptingRef,
exactProp,
unstable_ownerDocument as ownerDocument,
unstable_useForkRef as useForkRef,
unstable_useEventCallback as useEventCallback,
} from '@mui/utils';

// TODO: return `EventHandlerName extends `on${infer EventName}` ? Lowercase<EventName> : never` once generatePropTypes runs with TS 4.1
function mapEventPropToEvent(
Expand Down
2 changes: 2 additions & 0 deletions packages/mui-core/src/ClickAwayListener/index.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,2 @@
export { default } from './ClickAwayListener';
export * from './ClickAwayListener';
4 changes: 2 additions & 2 deletions packages/mui-material/src/ClickAwayListener/index.ts
Original file line number Diff line number Diff line change
@@ -1,2 +1,2 @@
export { default } from './ClickAwayListener';
export * from './ClickAwayListener';
export { default } from '@mui/core/ClickAwayListener';
export * from '@mui/core/ClickAwayListener';
2 changes: 1 addition & 1 deletion packages/mui-material/src/Snackbar/Snackbar.d.ts
Original file line number Diff line number Diff line change
@@ -1,10 +1,10 @@
import * as React from 'react';
import { SxProps } from '@mui/system';
import { ClickAwayListenerProps } from '@mui/core/ClickAwayListener';
import { Theme } from '../styles';
import { InternalStandardProps as StandardProps } from '..';
import { SnackbarContentProps } from '../SnackbarContent';
import { TransitionProps } from '../transitions/transition';
import { ClickAwayListenerProps } from '../ClickAwayListener';
import { SnackbarClasses } from './snackbarClasses';

export interface SnackbarOrigin {
Expand Down
2 changes: 1 addition & 1 deletion packages/mui-material/src/Snackbar/Snackbar.js
Original file line number Diff line number Diff line change
Expand Up @@ -2,11 +2,11 @@ import * as React from 'react';
import PropTypes from 'prop-types';
import clsx from 'clsx';
import { unstable_composeClasses as composeClasses } from '@mui/core';
import ClickAwayListener from '@mui/core/ClickAwayListener';
import styled from '../styles/styled';
import useTheme from '../styles/useTheme';
import useThemeProps from '../styles/useThemeProps';
import { duration } from '../styles/createTransitions';
import ClickAwayListener from '../ClickAwayListener';
import useEventCallback from '../utils/useEventCallback';
import capitalize from '../utils/capitalize';
import Grow from '../Grow';
Expand Down