@jetbrains/ring-ui-built 7.0.60-beta.0 → 7.0.60
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/__mocks__/loader__core.js +7 -0
- package/components/__mocks__/old-browsers-message.js +3 -0
- package/components/alert/alert.js +0 -1
- package/components/alert-service/alert-service.js +0 -1
- package/components/auth/auth.js +0 -1
- package/components/auth/auth__core.js +0 -1
- package/components/auth/down-notification.js +0 -1
- package/components/auth/iframe-flow.js +0 -1
- package/components/auth/storage.js +0 -1
- package/components/auth-dialog/auth-dialog.js +0 -1
- package/components/auth-dialog-service/auth-dialog-service.js +0 -1
- package/components/avatar-stack/avatar-stack.js +0 -1
- package/components/banner/banner.d.ts +19 -0
- package/components/banner/banner.js +106 -0
- package/components/clipboard/clipboard.js +0 -1
- package/components/confirm/confirm.js +0 -1
- package/components/confirm-service/confirm-service.js +0 -1
- package/components/date-picker/date-picker.js +0 -3
- package/components/dialog/dialog.js +0 -1
- package/components/dropdown-menu/dropdown-menu.js +0 -1
- package/components/error-bubble/error-bubble.js +0 -2
- package/components/global/theme.js +0 -1
- package/components/header/header.js +0 -1
- package/components/header/profile.js +0 -1
- package/components/header/services.js +0 -2
- package/components/header/smart-profile.js +0 -1
- package/components/header/smart-services.js +0 -1
- package/components/login-dialog/login-dialog.js +0 -1
- package/components/login-dialog/service.js +0 -1
- package/components/message/message.js +0 -2
- package/components/old-browsers-message/white-list.js +2 -2
- package/components/pager/pager.js +0 -1
- package/components/popup/popup.d.ts +0 -2
- package/components/popup/popup.js +26 -50
- package/components/popup/position.d.ts +0 -1
- package/components/popup/position.js +6 -13
- package/components/popup-menu/popup-menu.d.ts +0 -1
- package/components/popup-menu/popup-menu.js +0 -1
- package/components/query-assist/query-assist.js +0 -2
- package/components/select/select.js +0 -1
- package/components/select/select__popup.js +0 -2
- package/components/storage/storage.js +0 -1
- package/components/storage/storage__local.js +0 -1
- package/components/style.css +1 -1
- package/components/table/row-with-focus-sensor.js +0 -1
- package/components/table/row.js +0 -1
- package/components/table/simple-table.js +0 -1
- package/components/table/smart-table.js +0 -1
- package/components/table/table.js +0 -1
- package/components/tabs/collapsible-more.js +0 -2
- package/components/tabs/collapsible-tabs.js +0 -1
- package/components/tabs/dumb-tabs.js +0 -1
- package/components/tabs/smart-tabs.js +0 -1
- package/components/tabs/tabs.js +0 -1
- package/components/tags-input/tags-input.js +0 -1
- package/components/tooltip/tooltip.js +8 -1
- package/components/user-agreement/service.js +0 -1
- package/components/user-agreement/user-agreement.js +0 -1
- package/components/user-card/card.js +0 -1
- package/components/user-card/smart-user-card-tooltip.js +0 -1
- package/components/user-card/tooltip.js +0 -2
- package/components/user-card/user-card.js +0 -1
- package/package.json +33 -35
- package/components/popup/position-css.d.ts +0 -14
- package/components/popup/position-css.js +0 -91
@@ -39,7 +39,6 @@ import '../tab-trap/tab-trap.js';
|
|
39
39
|
import '../popup/position.js';
|
40
40
|
import 'core-js/modules/es.array.sort.js';
|
41
41
|
import '../popup/popup.consts.js';
|
42
|
-
import '../popup/position-css.js';
|
43
42
|
|
44
43
|
var styles = {"alert":"ring-alert-alert","alertInline":"ring-alert-alertInline","error":"ring-alert-error","icon":"ring-alert-icon","caption":"ring-alert-caption","withCloseButton":"ring-alert-withCloseButton","badge":"ring-alert-badge","loader":"ring-alert-loader","close":"ring-alert-close","animationOpen":"ring-alert-animationOpen","show":"ring-alert-show","animationClosing":"ring-alert-animationClosing","animationShaking":"ring-alert-animationShaking","shaking":"ring-alert-shaking"};
|
45
44
|
|
@@ -41,7 +41,6 @@ import '../tab-trap/tab-trap.js';
|
|
41
41
|
import '../popup/position.js';
|
42
42
|
import 'core-js/modules/es.array.sort.js';
|
43
43
|
import '../popup/popup.consts.js';
|
44
|
-
import '../popup/position-css.js';
|
45
44
|
|
46
45
|
const _excluded = ["message", "key"],
|
47
46
|
_excluded2 = ["onCloseRequest", "onClose"];
|
package/components/auth/auth.js
CHANGED
@@ -47,7 +47,6 @@ import '../tab-trap/tab-trap.js';
|
|
47
47
|
import '../popup/position.js';
|
48
48
|
import 'core-js/modules/es.array.sort.js';
|
49
49
|
import '../popup/popup.consts.js';
|
50
|
-
import '../popup/position-css.js';
|
51
50
|
import '../alert/container.js';
|
52
51
|
import '../link/link.js';
|
53
52
|
import '../_helpers/link.js';
|
@@ -44,7 +44,6 @@ import '../tab-trap/tab-trap.js';
|
|
44
44
|
import '../popup/position.js';
|
45
45
|
import 'core-js/modules/es.array.sort.js';
|
46
46
|
import '../popup/popup.consts.js';
|
47
|
-
import '../popup/position-css.js';
|
48
47
|
import '../_helpers/link.js';
|
49
48
|
|
50
49
|
var styles = {"title":"ring-down-notification-title","error":"ring-down-notification-error"};
|
@@ -46,7 +46,6 @@ import '../popup/popup.js';
|
|
46
46
|
import '../popup/position.js';
|
47
47
|
import 'core-js/modules/es.array.sort.js';
|
48
48
|
import '../popup/popup.consts.js';
|
49
|
-
import '../popup/position-css.js';
|
50
49
|
import '../_helpers/dialog__body-scroll-preventer.js';
|
51
50
|
import 'scrollbar-width';
|
52
51
|
import '../loader-screen/loader-screen.js';
|
@@ -32,7 +32,6 @@ import '../popup/popup.js';
|
|
32
32
|
import '../popup/position.js';
|
33
33
|
import 'core-js/modules/es.array.sort.js';
|
34
34
|
import '../popup/popup.consts.js';
|
35
|
-
import '../popup/position-css.js';
|
36
35
|
import '../_helpers/dialog__body-scroll-preventer.js';
|
37
36
|
import 'scrollbar-width';
|
38
37
|
import '@jetbrains/icons/chevron-down';
|
@@ -43,7 +43,6 @@ import '../popup/popup.js';
|
|
43
43
|
import '../popup/position.js';
|
44
44
|
import 'core-js/modules/es.array.sort.js';
|
45
45
|
import '../popup/popup.consts.js';
|
46
|
-
import '../popup/position-css.js';
|
47
46
|
import '../_helpers/dialog__body-scroll-preventer.js';
|
48
47
|
import 'scrollbar-width';
|
49
48
|
import '../heading/heading.js';
|
@@ -67,7 +67,6 @@ import '../popup/position.js';
|
|
67
67
|
import 'core-js/modules/es.array.sort.js';
|
68
68
|
import '../popup/popup.consts.js';
|
69
69
|
import '../popup/popup.target.js';
|
70
|
-
import '../popup/position-css.js';
|
71
70
|
|
72
71
|
var styles = {"avatarStack":"ring-avatar-stack-avatarStack","extraText":"ring-avatar-stack-extraText","item":"ring-avatar-stack-item","size20":"ring-avatar-stack-size20","size24":"ring-avatar-stack-size24","size28":"ring-avatar-stack-size28","size32":"ring-avatar-stack-size32","size40":"ring-avatar-stack-size40","size56":"ring-avatar-stack-size56","hovered":"ring-avatar-stack-hovered","extra":"ring-avatar-stack-extra ring-avatar-stack-item","extraButton":"ring-avatar-stack-extraButton ring-global-resetButton"};
|
73
72
|
|
@@ -0,0 +1,19 @@
|
|
1
|
+
import React from 'react';
|
2
|
+
export interface BannerTranslations {
|
3
|
+
close: string;
|
4
|
+
}
|
5
|
+
export interface BannerProps {
|
6
|
+
title?: React.ReactNode;
|
7
|
+
children: React.ReactNode;
|
8
|
+
mode?: 'info' | 'error' | 'success' | 'warning' | 'purple' | 'grey';
|
9
|
+
withIcon?: boolean;
|
10
|
+
inline?: boolean;
|
11
|
+
onClose?: () => void;
|
12
|
+
closeButtonTitle?: string;
|
13
|
+
className?: string;
|
14
|
+
['data-test']?: string;
|
15
|
+
translations?: BannerTranslations;
|
16
|
+
}
|
17
|
+
export declare function Banner(props: BannerProps): import("react/jsx-runtime").JSX.Element;
|
18
|
+
declare const _default: React.MemoExoticComponent<typeof Banner>;
|
19
|
+
export default _default;
|
@@ -0,0 +1,106 @@
|
|
1
|
+
import 'core-js/modules/es.symbol.description.js';
|
2
|
+
import { jsxs, jsx } from 'react/jsx-runtime';
|
3
|
+
import React__default from 'react';
|
4
|
+
import classNames from 'classnames';
|
5
|
+
import infoIcon from '@jetbrains/icons/info-filled';
|
6
|
+
import exceptionIcon from '@jetbrains/icons/exception';
|
7
|
+
import successIcon from '@jetbrains/icons/success';
|
8
|
+
import warningIcon from '@jetbrains/icons/warning';
|
9
|
+
import closeIcon from '@jetbrains/icons/close';
|
10
|
+
import Icon from '../icon/icon.js';
|
11
|
+
import Link from '../link/link.js';
|
12
|
+
import Tooltip from '../tooltip/tooltip.js';
|
13
|
+
import '../_helpers/_rollupPluginBabelHelpers.js';
|
14
|
+
import 'util-deprecate';
|
15
|
+
import '../icon/icon__constants.js';
|
16
|
+
import '../_helpers/icon__svg.js';
|
17
|
+
import 'core-js/modules/es.regexp.exec.js';
|
18
|
+
import 'core-js/modules/es.string.replace.js';
|
19
|
+
import '../global/memoize.js';
|
20
|
+
import 'core-js/modules/web.dom-collections.iterator.js';
|
21
|
+
import '../global/data-tests.js';
|
22
|
+
import '../link/clickableLink.js';
|
23
|
+
import '../_helpers/link.js';
|
24
|
+
import '../popup/popup.js';
|
25
|
+
import 'react-dom';
|
26
|
+
import '../global/get-uid.js';
|
27
|
+
import '../global/schedule-raf.js';
|
28
|
+
import '../global/dom.js';
|
29
|
+
import '../shortcuts/shortcuts.js';
|
30
|
+
import '../shortcuts/core.js';
|
31
|
+
import 'combokeys';
|
32
|
+
import '../global/sniffer.js';
|
33
|
+
import 'sniffr';
|
34
|
+
import '../tab-trap/tab-trap.js';
|
35
|
+
import '../popup/position.js';
|
36
|
+
import 'core-js/modules/es.array.sort.js';
|
37
|
+
import '../popup/popup.consts.js';
|
38
|
+
import '../popup/popup.target.js';
|
39
|
+
import '../_helpers/theme.js';
|
40
|
+
|
41
|
+
var styles = {"banner":"ring-banner-banner","inline":"ring-banner-inline","info":"ring-banner-info","icon":"ring-banner-icon","error":"ring-banner-error","success":"ring-banner-success","warning":"ring-banner-warning","purple":"ring-banner-purple","grey":"ring-banner-grey","title":"ring-banner-title","description":"ring-banner-description","closeButtonWrapper":"ring-banner-closeButtonWrapper","closeButton":"ring-banner-closeButton"};
|
42
|
+
|
43
|
+
function Banner(props) {
|
44
|
+
const {
|
45
|
+
title,
|
46
|
+
children,
|
47
|
+
mode = 'info',
|
48
|
+
withIcon = false,
|
49
|
+
inline = false,
|
50
|
+
onClose,
|
51
|
+
closeButtonTitle,
|
52
|
+
className,
|
53
|
+
['data-test']: dataTest,
|
54
|
+
translations = {
|
55
|
+
close: 'Close'
|
56
|
+
}
|
57
|
+
} = props;
|
58
|
+
let icon = infoIcon;
|
59
|
+
if (mode === 'error') {
|
60
|
+
icon = exceptionIcon;
|
61
|
+
} else if (mode === 'success') {
|
62
|
+
icon = successIcon;
|
63
|
+
} else if (mode === 'warning') {
|
64
|
+
icon = warningIcon;
|
65
|
+
}
|
66
|
+
return jsxs("div", {
|
67
|
+
className: classNames({
|
68
|
+
[styles.banner]: true,
|
69
|
+
[styles.inline]: inline,
|
70
|
+
[styles.info]: mode === 'info',
|
71
|
+
[styles.error]: mode === 'error',
|
72
|
+
[styles.success]: mode === 'success',
|
73
|
+
[styles.warning]: mode === 'warning',
|
74
|
+
[styles.purple]: mode === 'purple',
|
75
|
+
[styles.grey]: mode === 'grey'
|
76
|
+
}, className),
|
77
|
+
"data-test": dataTest,
|
78
|
+
children: [withIcon && jsx(Icon, {
|
79
|
+
glyph: icon,
|
80
|
+
className: styles.icon
|
81
|
+
}), jsxs("div", {
|
82
|
+
children: [title && jsx("div", {
|
83
|
+
className: styles.title,
|
84
|
+
children: title
|
85
|
+
}), jsx("div", {
|
86
|
+
className: styles.description,
|
87
|
+
children: children
|
88
|
+
})]
|
89
|
+
}), onClose && jsx(Tooltip, {
|
90
|
+
title: closeButtonTitle !== null && closeButtonTitle !== void 0 ? closeButtonTitle : translations.close,
|
91
|
+
className: styles.closeButtonWrapper,
|
92
|
+
children: jsx(Link, {
|
93
|
+
className: styles.closeButton,
|
94
|
+
pseudo: true,
|
95
|
+
onClick: onClose,
|
96
|
+
"aria-label": "Close",
|
97
|
+
children: jsx(Icon, {
|
98
|
+
glyph: closeIcon
|
99
|
+
})
|
100
|
+
})
|
101
|
+
})]
|
102
|
+
});
|
103
|
+
}
|
104
|
+
var banner = /*#__PURE__*/React__default.memo(Banner);
|
105
|
+
|
106
|
+
export { Banner, banner as default };
|
@@ -33,7 +33,6 @@ import 'core-js/modules/es.string.replace.js';
|
|
33
33
|
import '../popup/position.js';
|
34
34
|
import 'core-js/modules/es.array.sort.js';
|
35
35
|
import '../popup/popup.consts.js';
|
36
|
-
import '../popup/position-css.js';
|
37
36
|
import '../_helpers/dialog__body-scroll-preventer.js';
|
38
37
|
import 'scrollbar-width';
|
39
38
|
import '@jetbrains/icons/chevron-down';
|
@@ -44,7 +44,6 @@ import '../popup/popup.js';
|
|
44
44
|
import '../popup/position.js';
|
45
45
|
import 'core-js/modules/es.array.sort.js';
|
46
46
|
import '../popup/popup.consts.js';
|
47
|
-
import '../popup/position-css.js';
|
48
47
|
import '../_helpers/dialog__body-scroll-preventer.js';
|
49
48
|
import 'scrollbar-width';
|
50
49
|
import '../panel/panel.js';
|
@@ -40,7 +40,6 @@ import '../popup/position.js';
|
|
40
40
|
import 'core-js/modules/es.array.sort.js';
|
41
41
|
import '../popup/popup.consts.js';
|
42
42
|
import '../popup/popup.target.js';
|
43
|
-
import '../popup/position-css.js';
|
44
43
|
import '../global/typescript-utils.js';
|
45
44
|
import '../_helpers/anchor.js';
|
46
45
|
import '@jetbrains/icons/chevron-12px-down';
|
@@ -104,7 +103,6 @@ const PopupComponent = _ref => {
|
|
104
103
|
} = _ref,
|
105
104
|
restProps = _objectWithoutProperties(_ref, _excluded);
|
106
105
|
return jsx(Popup, _objectSpread2(_objectSpread2({
|
107
|
-
cssPositioning: true,
|
108
106
|
hidden: hidden,
|
109
107
|
className: className,
|
110
108
|
ref: popupRef,
|
@@ -270,7 +268,6 @@ class DatePicker extends PureComponent {
|
|
270
268
|
}, dropdownProps), {}, {
|
271
269
|
children: jsx(PopupComponent, {
|
272
270
|
className: popupClassName,
|
273
|
-
cssPositioning: true,
|
274
271
|
popupRef: this.popupRef,
|
275
272
|
onClear: clear ? this.clear : null,
|
276
273
|
datePopupProps: _objectSpread2(_objectSpread2({}, datePopupProps), {}, {
|
@@ -41,7 +41,6 @@ import '../_helpers/button__classes.js';
|
|
41
41
|
import '../popup/position.js';
|
42
42
|
import 'core-js/modules/es.array.sort.js';
|
43
43
|
import '../popup/popup.consts.js';
|
44
|
-
import '../popup/position-css.js';
|
45
44
|
import 'scrollbar-width';
|
46
45
|
|
47
46
|
const _excluded = ["show", "showCloseButton", "onOverlayClick", "onCloseAttempt", "onEscPress", "onCloseClick", "children", "className", "contentClassName", "trapFocus", "data-test", "closeButtonInside", "portalTarget", "label", "closeButtonTitle", "dense", "shortcutOptions", "native", "modal", "preventBodyScroll"];
|
@@ -66,7 +66,6 @@ import '../popup/position.js';
|
|
66
66
|
import 'core-js/modules/es.array.sort.js';
|
67
67
|
import '../popup/popup.consts.js';
|
68
68
|
import '../popup/popup.target.js';
|
69
|
-
import '../popup/position-css.js';
|
70
69
|
|
71
70
|
const _excluded = ["anchor", "pinned", "active", "activeListItemId", "listId"],
|
72
71
|
_excluded2 = ["id", "anchor", "ariaLabel", "data", "onSelect", "menuProps", "children"],
|
@@ -21,7 +21,6 @@ import '../tab-trap/tab-trap.js';
|
|
21
21
|
import '../popup/position.js';
|
22
22
|
import 'core-js/modules/es.array.sort.js';
|
23
23
|
import '../popup/popup.target.js';
|
24
|
-
import '../popup/position-css.js';
|
25
24
|
|
26
25
|
var styles = {"errorBubblePopup":"ring-error-bubble-errorBubblePopup","errorBubbleWrapper":"ring-error-bubble-errorBubbleWrapper","errorBubble":"ring-error-bubble-errorBubble"};
|
27
26
|
|
@@ -42,7 +41,6 @@ class ErrorBubble extends PureComponent {
|
|
42
41
|
className: styles.errorBubbleWrapper,
|
43
42
|
"data-test": "ring-error-bubble-wrapper",
|
44
43
|
children: [children && Children.map(children, child => /*#__PURE__*/cloneElement(child, _objectSpread2(_objectSpread2({}, child.props), restProps))), restProps.error && jsx(Popup, {
|
45
|
-
cssPositioning: true,
|
46
44
|
trapFocus: false,
|
47
45
|
className: styles.errorBubblePopup,
|
48
46
|
hidden: false,
|
@@ -30,7 +30,6 @@ import '../tab-trap/tab-trap.js';
|
|
30
30
|
import '../popup/position.js';
|
31
31
|
import 'core-js/modules/es.array.sort.js';
|
32
32
|
import '../popup/popup.consts.js';
|
33
|
-
import '../popup/position-css.js';
|
34
33
|
import '../icon/icon.js';
|
35
34
|
import 'util-deprecate';
|
36
35
|
import '../icon/icon__constants.js';
|
@@ -69,7 +69,6 @@ import '../popup/position.js';
|
|
69
69
|
import 'core-js/modules/es.array.sort.js';
|
70
70
|
import '../popup/popup.consts.js';
|
71
71
|
import '../popup/popup.target.js';
|
72
|
-
import '../popup/position-css.js';
|
73
72
|
import '../i18n/i18n.js';
|
74
73
|
|
75
74
|
const _excluded = ["className", "activeClassName", "closeOnSelect", "hasUpdates", "onLogout", "user", "profileUrl", "LinkComponent", "onSwitchUser", "renderPopupItems", "onRevertPostponement", "showApplyChangedUser", "showName", "showLogIn", "showLogOut", "showSwitchUser", "renderGuest", "translations", "size", "round", "loading", "onLogin", "menuProps", "onShow", "onHide"];
|
@@ -39,7 +39,6 @@ import '../tab-trap/tab-trap.js';
|
|
39
39
|
import '../popup/position.js';
|
40
40
|
import '../popup/popup.consts.js';
|
41
41
|
import '../popup/popup.target.js';
|
42
|
-
import '../popup/position-css.js';
|
43
42
|
import '../_helpers/header.js';
|
44
43
|
import '../link/link.js';
|
45
44
|
import '../_helpers/link.js';
|
@@ -90,7 +89,6 @@ class Services extends PureComponent {
|
|
90
89
|
anchor: makeAnchor(loading),
|
91
90
|
initShown: initShown,
|
92
91
|
children: jsxs(Popup, {
|
93
|
-
cssPositioning: true,
|
94
92
|
className: classNames(styles.services, {
|
95
93
|
[darkStyles.dark]: theme === Theme.DARK
|
96
94
|
}),
|
@@ -47,7 +47,6 @@ import '../tab-trap/tab-trap.js';
|
|
47
47
|
import '../popup/position.js';
|
48
48
|
import 'core-js/modules/es.array.sort.js';
|
49
49
|
import '../popup/popup.consts.js';
|
50
|
-
import '../popup/position-css.js';
|
51
50
|
import '../alert/container.js';
|
52
51
|
import '../link/link.js';
|
53
52
|
import '../_helpers/link.js';
|
@@ -39,7 +39,6 @@ import '../tab-trap/tab-trap.js';
|
|
39
39
|
import '../popup/position.js';
|
40
40
|
import '../popup/popup.consts.js';
|
41
41
|
import '../popup/popup.target.js';
|
42
|
-
import '../popup/position-css.js';
|
43
42
|
import '../_helpers/theme.js';
|
44
43
|
import './header-icon.js';
|
45
44
|
import '../_helpers/header.js';
|
@@ -43,7 +43,6 @@ import '../popup/popup.js';
|
|
43
43
|
import '../popup/position.js';
|
44
44
|
import 'core-js/modules/es.array.sort.js';
|
45
45
|
import '../popup/popup.consts.js';
|
46
|
-
import '../popup/position-css.js';
|
47
46
|
import '../_helpers/dialog__body-scroll-preventer.js';
|
48
47
|
import 'scrollbar-width';
|
49
48
|
import '../loader/loader.js';
|
@@ -43,7 +43,6 @@ import '../popup/popup.js';
|
|
43
43
|
import '../popup/position.js';
|
44
44
|
import 'core-js/modules/es.array.sort.js';
|
45
45
|
import '../popup/popup.consts.js';
|
46
|
-
import '../popup/position-css.js';
|
47
46
|
import '../_helpers/dialog__body-scroll-preventer.js';
|
48
47
|
import 'scrollbar-width';
|
49
48
|
import '../loader-screen/loader-screen.js';
|
@@ -27,7 +27,6 @@ import '../tab-trap/tab-trap.js';
|
|
27
27
|
import '../popup/position.js';
|
28
28
|
import 'core-js/modules/es.array.sort.js';
|
29
29
|
import '../popup/popup.target.js';
|
30
|
-
import '../popup/position-css.js';
|
31
30
|
import 'util-deprecate';
|
32
31
|
import '../icon/icon__constants.js';
|
33
32
|
import '../_helpers/icon__svg.js';
|
@@ -179,7 +178,6 @@ class Message extends Component {
|
|
179
178
|
var _translations$gotIt, _translations$dismiss;
|
180
179
|
return jsx(Popup, _objectSpread2(_objectSpread2({
|
181
180
|
ref: this.popupRef,
|
182
|
-
cssPositioning: true,
|
183
181
|
hidden: false,
|
184
182
|
directions: popupDirections,
|
185
183
|
className: classNames(classes, themeClasses),
|
@@ -8,11 +8,11 @@ const MAJOR_VERSION_INDEX = 0;
|
|
8
8
|
/**
|
9
9
|
* SUPPORTED_BROWSERS are defined by Babel plugin, see babel config
|
10
10
|
*/
|
11
|
-
if (!["and_chr
|
11
|
+
if (!["and_chr 139", "and_ff 142", "and_qq 14.9", "and_uc 15.5", "android 139", "chrome 139", "chrome 138", "chrome 137", "chrome 136", "chrome 135", "chrome 134", "chrome 133", "chrome 132", "chrome 131", "chrome 130", "chrome 125", "chrome 112", "chrome 109", "edge 139", "edge 138", "edge 137", "firefox 142", "firefox 141", "firefox 140", "firefox 128", "firefox 118", "firefox 115", "ios_saf 18.5-18.6", "ios_saf 18.4", "ios_saf 18.3", "ios_saf 18.2", "ios_saf 18.1", "ios_saf 18.0", "ios_saf 17.6-17.7", "ios_saf 17.5", "ios_saf 16.6-16.7", "ios_saf 15.6-15.8", "ios_saf 11.0-11.2", "kaios 3.0-3.1", "kaios 2.5", "op_mini all", "op_mob 80", "opera 117", "opera 116", "safari 18.5-18.6", "safari 18.4", "safari 17.6", "safari 17.1", "safari 16.6", "safari 15.6", "samsung 28", "samsung 27"]) {
|
12
12
|
// eslint-disable-next-line no-console
|
13
13
|
console.warn('Ring UI: no SUPPORTED_BROWSERS passed. Please check babel config.');
|
14
14
|
}
|
15
|
-
const SUPPORTED = ["and_chr
|
15
|
+
const SUPPORTED = ["and_chr 139", "and_ff 142", "and_qq 14.9", "and_uc 15.5", "android 139", "chrome 139", "chrome 138", "chrome 137", "chrome 136", "chrome 135", "chrome 134", "chrome 133", "chrome 132", "chrome 131", "chrome 130", "chrome 125", "chrome 112", "chrome 109", "edge 139", "edge 138", "edge 137", "firefox 142", "firefox 141", "firefox 140", "firefox 128", "firefox 118", "firefox 115", "ios_saf 18.5-18.6", "ios_saf 18.4", "ios_saf 18.3", "ios_saf 18.2", "ios_saf 18.1", "ios_saf 18.0", "ios_saf 17.6-17.7", "ios_saf 17.5", "ios_saf 16.6-16.7", "ios_saf 15.6-15.8", "ios_saf 11.0-11.2", "kaios 3.0-3.1", "kaios 2.5", "op_mini all", "op_mob 80", "opera 117", "opera 116", "safari 18.5-18.6", "safari 18.4", "safari 17.6", "safari 17.1", "safari 16.6", "safari 15.6", "samsung 28", "samsung 27"] || [];
|
16
16
|
const WHITE_LISTED_BROWSERS = ['chrome', 'firefox', 'safari', 'edge'];
|
17
17
|
const WHITE_LIST = SUPPORTED.reduce((acc, item) => {
|
18
18
|
var _item$match;
|
@@ -53,7 +53,6 @@ import '../popup/position.js';
|
|
53
53
|
import 'core-js/modules/es.array.sort.js';
|
54
54
|
import '../popup/popup.consts.js';
|
55
55
|
import '../popup/popup.target.js';
|
56
|
-
import '../popup/position-css.js';
|
57
56
|
import '../list/list.js';
|
58
57
|
import 'core-js/modules/es.symbol.description.js';
|
59
58
|
import 'react-virtualized/dist/es/List';
|
@@ -32,7 +32,6 @@ export interface BasePopupProps {
|
|
32
32
|
withTail?: boolean;
|
33
33
|
tailOffset?: number;
|
34
34
|
largeBorderRadius?: boolean;
|
35
|
-
cssPositioning?: boolean;
|
36
35
|
anchorElement?: HTMLElement | null | undefined;
|
37
36
|
target?: string | Element | null | undefined;
|
38
37
|
className?: string | null | undefined;
|
@@ -84,7 +83,6 @@ export default class Popup<P extends BasePopupProps = PopupProps> extends PureCo
|
|
84
83
|
trapFocus: boolean;
|
85
84
|
autoFocusFirst: boolean;
|
86
85
|
legacy: boolean;
|
87
|
-
cssPositioning: boolean;
|
88
86
|
};
|
89
87
|
state: PopupState;
|
90
88
|
componentDidMount(): void;
|
@@ -15,14 +15,13 @@ import TabTrap from '../tab-trap/tab-trap.js';
|
|
15
15
|
import position from './position.js';
|
16
16
|
import { DEFAULT_DIRECTIONS, MaxHeight, MinWidth, Dimension, Directions, Display } from './popup.consts.js';
|
17
17
|
import { PopupTargetContext, PopupTarget } from './popup.target.js';
|
18
|
-
import { supportsCSSAnchorPositioning, setCSSAnchorPositioning } from './position-css.js';
|
19
18
|
import '../shortcuts/core.js';
|
20
19
|
import 'combokeys';
|
21
20
|
import '../global/sniffer.js';
|
22
21
|
import 'sniffr';
|
23
22
|
import 'core-js/modules/es.array.sort.js';
|
24
23
|
|
25
|
-
var styles = {"popup":"ring-popup-popup ring-global-font","
|
24
|
+
var styles = {"popup":"ring-popup-popup ring-global-font","largeBorderRadius":"ring-popup-largeBorderRadius","hidden":"ring-popup-hidden","showing":"ring-popup-showing","attached":"ring-popup-attached"};
|
26
25
|
|
27
26
|
const isPossibleClientSideNavigation = event => {
|
28
27
|
const target = event.target;
|
@@ -104,39 +103,24 @@ class Popup extends PureComponent {
|
|
104
103
|
});
|
105
104
|
_defineProperty(this, "_updatePosition", () => {
|
106
105
|
const popup = this.popup;
|
107
|
-
const anchor = this._getAnchor();
|
108
106
|
if (popup) {
|
109
|
-
|
110
|
-
|
111
|
-
|
112
|
-
|
113
|
-
|
114
|
-
|
115
|
-
|
116
|
-
|
117
|
-
|
118
|
-
|
119
|
-
|
120
|
-
|
121
|
-
|
122
|
-
popup.style.position = 'absolute';
|
123
|
-
if (this.isVisible()) {
|
124
|
-
const {
|
125
|
-
styles: style,
|
126
|
-
direction
|
127
|
-
} = this.position();
|
128
|
-
Object.entries(style).forEach(_ref => {
|
129
|
-
let [key, value] = _ref;
|
130
|
-
const propKey = key;
|
131
|
-
if (typeof value === 'number') {
|
132
|
-
popup.style[propKey] = "".concat(value, "px");
|
133
|
-
} else {
|
134
|
-
popup.style[propKey] = value.toString();
|
135
|
-
}
|
136
|
-
});
|
137
|
-
if (direction != null) {
|
138
|
-
this._updateDirection(direction);
|
107
|
+
popup.style.position = 'absolute';
|
108
|
+
if (this.isVisible()) {
|
109
|
+
const {
|
110
|
+
styles: style,
|
111
|
+
direction
|
112
|
+
} = this.position();
|
113
|
+
Object.entries(style).forEach(_ref => {
|
114
|
+
let [key, value] = _ref;
|
115
|
+
const propKey = key;
|
116
|
+
if (typeof value === 'number') {
|
117
|
+
popup.style[propKey] = "".concat(value, "px");
|
118
|
+
} else {
|
119
|
+
popup.style[propKey] = value.toString();
|
139
120
|
}
|
121
|
+
});
|
122
|
+
if (direction != null) {
|
123
|
+
this._updateDirection(direction);
|
140
124
|
}
|
141
125
|
}
|
142
126
|
this.setState(this.calculateDisplay);
|
@@ -245,20 +229,16 @@ class Popup extends PureComponent {
|
|
245
229
|
clearTimeout(this._prevTimeout);
|
246
230
|
this._prevTimeout = window.setTimeout(() => {
|
247
231
|
this._listenersEnabled = true;
|
248
|
-
|
249
|
-
|
250
|
-
|
251
|
-
this.listeners.add(window, 'resize', this._redraw);
|
252
|
-
if (this.props.autoPositioningOnScroll) {
|
253
|
-
this.listeners.add(window, 'scroll', this._redraw);
|
254
|
-
}
|
255
|
-
let el = this._getAnchor();
|
256
|
-
while (el) {
|
257
|
-
this.listeners.add(el, 'scroll', this._redraw);
|
258
|
-
el = el.parentElement;
|
259
|
-
}
|
232
|
+
this.listeners.add(window, 'resize', this._redraw);
|
233
|
+
if (this.props.autoPositioningOnScroll) {
|
234
|
+
this.listeners.add(window, 'scroll', this._redraw);
|
260
235
|
}
|
261
236
|
this.listeners.add(document, 'pointerdown', this._onDocumentClick, true);
|
237
|
+
let el = this._getAnchor();
|
238
|
+
while (el) {
|
239
|
+
this.listeners.add(el, 'scroll', this._redraw);
|
240
|
+
el = el.parentElement;
|
241
|
+
}
|
262
242
|
}, 0);
|
263
243
|
return;
|
264
244
|
}
|
@@ -306,11 +286,8 @@ class Popup extends PureComponent {
|
|
306
286
|
'data-test': dataTest,
|
307
287
|
largeBorderRadius
|
308
288
|
} = this.props;
|
309
|
-
const useCssPositioning = this.props.cssPositioning && supportsCSSAnchorPositioning();
|
310
289
|
const showing = this.state.display === Display.SHOWING;
|
311
290
|
const classes = classNames(className, styles.popup, {
|
312
|
-
[styles.jsAnchoredPopup]: !useCssPositioning,
|
313
|
-
[styles.cssAnchoredPopup]: useCssPositioning,
|
314
291
|
[styles.attached]: attached,
|
315
292
|
[styles.hidden]: hidden,
|
316
293
|
[styles.showing]: showing,
|
@@ -375,8 +352,7 @@ _defineProperty(Popup, "defaultProps", {
|
|
375
352
|
attached: false,
|
376
353
|
trapFocus: false,
|
377
354
|
autoFocusFirst: false,
|
378
|
-
legacy: false
|
379
|
-
cssPositioning: false
|
355
|
+
legacy: false
|
380
356
|
});
|
381
357
|
_defineProperty(Popup, "PopupProps", {
|
382
358
|
Directions,
|
@@ -24,7 +24,6 @@ export interface PositionAttrs {
|
|
24
24
|
}
|
25
25
|
export declare const positionPropKeys: readonly ["directions", "autoPositioning", "autoCorrectTopOverflow", "sidePadding", "top", "left", "offset", "maxHeight", "minWidth"];
|
26
26
|
export declare function maxHeightForDirection(direction: Directions, anchorNode: Element, containerNode?: Element | null): number | null;
|
27
|
-
export declare function calculateMinWidth(anchorWidth: number, minWidth: PositionAttrs['minWidth']): number | null;
|
28
27
|
export default function position(attrs: PositionAttrs): {
|
29
28
|
styles: PositionStyles;
|
30
29
|
direction: Directions | null;
|