@jetbrains/ring-ui-built 6.0.36 → 6.0.38

package/components/_helpers/dialog__body-scroll-preventer.js

@@ -4,7 +4,7 @@ import 'core-js/modules/es.set.js';
 import 'core-js/modules/web.dom-collections.iterator.js';
 import scrollbarWidth from 'scrollbar-width';
 
-var modules_5e9b8c03 = {"header":"header_rui_c019","light":"light_rui_2ac4","container":"container_rui_027b","innerContainer":"innerContainer_rui_027b","content":"content_rui_027b","panel":"panel_rui_027b","clickableOverlay":"clickableOverlay_rui_027b","closeIcon":"closeIcon_rui_027b","closeButton":"closeButton_rui_027b","closeButtonOutside":"closeButtonOutside_rui_027b","closeButtonInside":"closeButtonInside_rui_027b","documentWithoutScroll":"documentWithoutScroll_rui_027b","popupTarget":"popupTarget_rui_027b","dense":"dense_rui_027b"};
+var modules_5e9b8c03 = {"header":"header_rui_c019","scrollableWrapper":"scrollableWrapper_rui_c019","light":"light_rui_2ac4","container":"container_rui_027b","nativeDialog":"nativeDialog_rui_027b","innerContainer":"innerContainer_rui_027b","content":"content_rui_027b","panel":"panel_rui_027b","clickableOverlay":"clickableOverlay_rui_027b","closeIcon":"closeIcon_rui_027b","closeButton":"closeButton_rui_027b","closeButtonOutside":"closeButtonOutside_rui_027b","closeButtonInside":"closeButtonInside_rui_027b","documentWithoutScroll":"documentWithoutScroll_rui_027b","popupTarget":"popupTarget_rui_027b","dense":"dense_rui_027b"};
 
 var isPrevented = new Set();
 var previousDocumentWidth = null;

package/components/_helpers/input.js

@@ -10,7 +10,7 @@ import { Button } from '../button/button.js';
 import getUID from '../global/get-uid.js';
 import Icon from '../icon/icon.js';
 import { I18nContext } from '../i18n/i18n-context.js';
-import composeRefs from '../global/composeRefs.js';
+import { createComposedRef } from '../global/composeRefs.js';
 import { ControlsHeightContext } from '../global/controls-height.js';
 import { ControlLabel } from '../control-label/control-label.js';
 import ControlHelp from '../control-help/control-help.js';
@@ -48,6 +48,7 @@ var Input = /*#__PURE__*/function (_PureComponent) {
     _defineProperty(_this, "inputRef", function (el) {
       _this.input = el;
     });
+    _defineProperty(_this, "composedInputRef", createComposedRef());
     _defineProperty(_this, "clear", function (e) {
       _this.props.onClear && _this.props.onClear(e);
     });
@@ -160,7 +161,7 @@ var Input = /*#__PURE__*/function (_PureComponent) {
       var inputClasses = classNames(modules_88cfaf40.input, inputClassName);
       var text = value != null ? value : children;
       var commonProps = {
-        ref: composeRefs(this.inputRef, inputRef),
+        ref: this.composedInputRef(this.inputRef, inputRef),
         className: inputClasses,
         value: text,
         disabled,

package/components/auth/request-builder.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="typings" />
 import uuid from 'simply-uuid';
 import AuthStorage, { AuthState } from './storage';
 export interface AuthRequestBuilderConfig {

package/components/auth/token-validator.d.ts

@@ -68,7 +68,7 @@ export default class TokenValidator {
      * @param {string} error
      * @return {boolean}
      */
-    static shouldRefreshToken(error: string | undefined): boolean;
+    static shouldRefreshToken(error: string | undefined): error is "invalid_grant" | "invalid_request" | "invalid_token";
     /**
      * Check scopes
      * @param {StoredToken} storedToken

package/components/auth-dialog-service/auth-dialog-service.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import AuthDialog, { AuthDialogProps } from '../auth-dialog/auth-dialog';
 export declare const reactRoot: import("react-dom/client").Root;
 type AuthDialogAttributes = JSX.LibraryManagedAttributes<typeof AuthDialog, AuthDialogProps>;

package/components/avatar/fallback-avatar.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import PropTypes from 'prop-types';
 import { Size } from './avatar';
 export interface FallbackAvatarProps {

package/components/checkbox/checkbox.js

@@ -23,6 +23,7 @@ import 'core-js/modules/es.object.to-string.js';
 import 'core-js/modules/es.weak-map.js';
 import 'core-js/modules/web.dom-collections.iterator.js';
 import 'core-js/modules/web.dom-collections.for-each.js';
+import 'memoize-one';
 
 var modules_3199090e = {"checkboxSize":"14px","light":"light_rui_2ac4","checkbox":"checkbox_rui_219d","cell":"cell_rui_219d","icon":"icon_rui_219d","check":"check_rui_219d icon_rui_219d","minus":"minus_rui_219d icon_rui_219d","input":"input_rui_219d","cellWrapper":"cellWrapper_rui_219d","focus":"focus_rui_219d","label":"label_rui_219d"};
 

package/components/code/code.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="highlight.js" />
 import { PureComponent, Ref } from 'react';
 import PropTypes from 'prop-types';
 import highlight from 'highlight.js/lib/core';

package/components/collapse/collapse-context.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 interface CollapseContextInterface {
     collapsed: boolean;
     duration: number;

package/components/confirm/confirm.d.ts

@@ -13,6 +13,7 @@ export interface ConfirmProps {
     onConfirm: ((event: React.MouseEvent<HTMLButtonElement>) => void);
     onReject: ((event?: React.MouseEvent<HTMLButtonElement>) => void);
     className?: string | undefined;
+    native?: boolean;
 }
 /**
  * @name Confirm

package/components/confirm/confirm.js

@@ -95,7 +95,8 @@ var Confirm = /*#__PURE__*/function (_PureComponent) {
         confirmLabel = _this$props.confirmLabel,
         rejectLabel = _this$props.rejectLabel,
         onConfirm = _this$props.onConfirm,
-        onReject = _this$props.onReject;
+        onReject = _this$props.onReject,
+        native = _this$props.native;
       return /*#__PURE__*/jsxs(Dialog, {
         label: text || (typeof description === 'string' ? description : undefined),
         className: className,
@@ -103,6 +104,7 @@ var Confirm = /*#__PURE__*/function (_PureComponent) {
         show: show,
         trapFocus: true,
         "data-test": "ring-confirm",
+        native: native,
         children: [text && /*#__PURE__*/jsx(HeaderWrapper, {
           children: text
         }), description && /*#__PURE__*/jsx(ContentWrapper, {

package/components/data-list/data-list.d.ts

@@ -32,7 +32,7 @@ export default class DataListContainer<T extends SelectionItem> extends Componen
             onKeyDown: (e: KeyboardEvent) => void;
             render(): import("react").JSX.Element;
             context: unknown;
-            setState<K extends never>(state: {} | ((prevState: Readonly<{}>, props: Readonly<import("../table/disable-hover-hoc").DisableHoverProps<import("../table/selection-shortcuts-hoc").SelectionShortcutsProps<T, FocusableProps<T>>>>) => {} | Pick<{}, K> | null) | Pick<{}, K> | null, callback?: (() => void) | undefined): void;
+            setState<K extends never>(state: {} | ((prevState: Readonly<{}>, props: Readonly<import("../table/disable-hover-hoc").DisableHoverProps<import("../table/selection-shortcuts-hoc").SelectionShortcutsProps<T, FocusableProps<T>>>>) => Pick<{}, K> | {} | null) | Pick<{}, K> | null, callback?: (() => void) | undefined): void;
             forceUpdate(callback?: (() => void) | undefined): void;
             readonly props: Readonly<import("../table/disable-hover-hoc").DisableHoverProps<import("../table/selection-shortcuts-hoc").SelectionShortcutsProps<T, FocusableProps<T>>>>;
             refs: {
@@ -40,7 +40,7 @@ export default class DataListContainer<T extends SelectionItem> extends Componen
             };
             shouldComponentUpdate?(nextProps: Readonly<import("../table/disable-hover-hoc").DisableHoverProps<import("../table/selection-shortcuts-hoc").SelectionShortcutsProps<T, FocusableProps<T>>>>, nextState: Readonly<{}>, nextContext: any): boolean;
             componentDidCatch?(error: Error, errorInfo: import("react").ErrorInfo): void;
-            getSnapshotBeforeUpdate?(prevProps: Readonly<import("../table/disable-hover-hoc").DisableHoverProps<import("../table/selection-shortcuts-hoc").SelectionShortcutsProps<T, FocusableProps<T>>>>, prevState: Readonly<{}>): any;
+            getSnapshotBeforeUpdate?(prevProps: Readonly<import("../table/disable-hover-hoc").DisableHoverProps<import("../table/selection-shortcuts-hoc").SelectionShortcutsProps<T, FocusableProps<T>>>>, prevState: Readonly<{}>): any | null;
             componentDidUpdate?(prevProps: Readonly<import("../table/disable-hover-hoc").DisableHoverProps<import("../table/selection-shortcuts-hoc").SelectionShortcutsProps<T, FocusableProps<T>>>>, prevState: Readonly<{}>, snapshot?: any): void;
             componentWillMount?(): void;
             UNSAFE_componentWillMount?(): void;
@@ -59,7 +59,7 @@ export default class DataListContainer<T extends SelectionItem> extends Componen
             onKeyDown: (e: KeyboardEvent) => void;
             render(): import("react").JSX.Element;
             context: unknown;
-            setState<K extends never>(state: {} | ((prevState: Readonly<{}>, props: Readonly<import("../table/disable-hover-hoc").DisableHoverProps<import("../table/selection-shortcuts-hoc").SelectionShortcutsProps<T, FocusableProps<T>>>>) => {} | Pick<{}, K> | null) | Pick<{}, K> | null, callback?: (() => void) | undefined): void;
+            setState<K extends never>(state: {} | ((prevState: Readonly<{}>, props: Readonly<import("../table/disable-hover-hoc").DisableHoverProps<import("../table/selection-shortcuts-hoc").SelectionShortcutsProps<T, FocusableProps<T>>>>) => Pick<{}, K> | {} | null) | Pick<{}, K> | null, callback?: (() => void) | undefined): void;
             forceUpdate(callback?: (() => void) | undefined): void;
             readonly props: Readonly<import("../table/disable-hover-hoc").DisableHoverProps<import("../table/selection-shortcuts-hoc").SelectionShortcutsProps<T, FocusableProps<T>>>>;
             refs: {
@@ -67,7 +67,7 @@ export default class DataListContainer<T extends SelectionItem> extends Componen
             };
             shouldComponentUpdate?(nextProps: Readonly<import("../table/disable-hover-hoc").DisableHoverProps<import("../table/selection-shortcuts-hoc").SelectionShortcutsProps<T, FocusableProps<T>>>>, nextState: Readonly<{}>, nextContext: any): boolean;
             componentDidCatch?(error: Error, errorInfo: import("react").ErrorInfo): void;
-            getSnapshotBeforeUpdate?(prevProps: Readonly<import("../table/disable-hover-hoc").DisableHoverProps<import("../table/selection-shortcuts-hoc").SelectionShortcutsProps<T, FocusableProps<T>>>>, prevState: Readonly<{}>): any;
+            getSnapshotBeforeUpdate?(prevProps: Readonly<import("../table/disable-hover-hoc").DisableHoverProps<import("../table/selection-shortcuts-hoc").SelectionShortcutsProps<T, FocusableProps<T>>>>, prevState: Readonly<{}>): any | null;
             componentDidUpdate?(prevProps: Readonly<import("../table/disable-hover-hoc").DisableHoverProps<import("../table/selection-shortcuts-hoc").SelectionShortcutsProps<T, FocusableProps<T>>>>, prevState: Readonly<{}>, snapshot?: any): void;
             componentWillMount?(): void;
             UNSAFE_componentWillMount?(): void;

package/components/data-list/data-list.js

@@ -18,6 +18,7 @@ import { jsxs, jsx } from 'react/jsx-runtime';
 import '../global/composeRefs.js';
 import 'core-js/modules/es.object.to-string.js';
 import 'core-js/modules/web.dom-collections.for-each.js';
+import 'memoize-one';
 import '../table/selection.js';
 import 'core-js/modules/es.array.filter.js';
 import 'core-js/modules/es.array.index-of.js';

package/components/data-list/item.js

@@ -41,6 +41,7 @@ import '../global/focus-sensor-hoc.js';
 import '../global/prop-types.js';
 import '../global/composeRefs.js';
 import 'core-js/modules/web.dom-collections.for-each.js';
+import 'memoize-one';
 import '../checkbox/checkbox.js';
 import '@jetbrains/icons/checkmark-12px';
 import '@jetbrains/icons/remove-12px';

package/components/data-list/title.js

@@ -12,6 +12,7 @@ import 'react/jsx-runtime';
 import '../global/composeRefs.js';
 import 'core-js/modules/es.object.to-string.js';
 import 'core-js/modules/web.dom-collections.for-each.js';
+import 'memoize-one';
 import '@jetbrains/icons/checkmark-12px';
 import '@jetbrains/icons/remove-12px';
 import '../icon/icon.js';

package/components/date-picker/date-input.js

@@ -34,6 +34,7 @@ import '../global/get-uid.js';
 import 'core-js/modules/es.regexp.to-string.js';
 import '../global/composeRefs.js';
 import 'core-js/modules/web.dom-collections.for-each.js';
+import 'memoize-one';
 import '../control-label/control-label.js';
 import '../control-help/control-help.js';
 import '../i18n/i18n.js';

package/components/date-picker/date-picker.js

@@ -77,6 +77,7 @@ import '../_helpers/link.js';
 import '@jetbrains/icons/close-12px';
 import '../global/prop-types.js';
 import '../global/composeRefs.js';
+import 'memoize-one';
 import '../control-label/control-label.js';
 import '../control-help/control-help.js';
 import '../i18n/i18n.js';

package/components/date-picker/date-popup.js

@@ -48,6 +48,7 @@ import '../i18n/i18n.js';
 import 'core-js/modules/es.set.js';
 import '../global/composeRefs.js';
 import 'core-js/modules/web.dom-collections.for-each.js';
+import 'memoize-one';
 import '../control-label/control-label.js';
 import '../control-help/control-help.js';
 import 'date-fns/addMonths';

package/components/date-picker/day.d.ts

@@ -23,7 +23,7 @@ export default class Day extends Component<DayProps> {
     handleMouseOver: () => void;
     handleMouseOut: () => void;
     isDay: (date: Date) => boolean;
-    is: (name: 'date' | 'from' | 'to' | 'activeDate') => boolean;
+    is: (name: "date" | "from" | "to" | "activeDate") => boolean;
     inRange: (range: [Date, Date] | null) => boolean | null;
     isDisabled: (date: Date) => boolean;
     parse(text: string | null | undefined): Date | null;

package/components/date-picker/month-names.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import PropTypes from 'prop-types';
 import { MonthsProps } from './consts';
 declare function MonthNames(props: MonthsProps): import("react").JSX.Element;

package/components/date-picker/month.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import PropTypes from 'prop-types';
 import { MonthsProps } from './consts';
 export interface MonthProps extends MonthsProps {

package/components/date-picker/months.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import PropTypes from 'prop-types';
 import { MonthsProps } from './consts';
 declare function Months(props: MonthsProps): import("react").JSX.Element;

package/components/date-picker/weekdays.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { Locale } from 'date-fns';
 import PropTypes from 'prop-types';
 interface WeekdaysProps {

package/components/dialog/dialog.d.ts

@@ -19,6 +19,8 @@ export interface DialogProps extends Partial<TabTrapProps> {
     portalTarget?: Element | null | undefined;
     'data-test'?: string | null | undefined;
     dense?: boolean | null | undefined;
+    native?: boolean;
+    modal?: boolean;
 }
 export default class Dialog extends PureComponent<DialogProps> {
     static propTypes: {
@@ -52,6 +54,7 @@ export default class Dialog extends PureComponent<DialogProps> {
         reset: () => void;
     };
     uid: string;
+    toggleNativeDialog(): void;
     toggleScrollPreventer(): void;
     handleClick: (event: React.MouseEvent<HTMLElement>) => void;
     onCloseClick: (event: React.MouseEvent<HTMLElement>) => void;
@@ -60,6 +63,7 @@ export default class Dialog extends PureComponent<DialogProps> {
     };
     dialog?: HTMLElement | null;
     dialogRef: (tabTrap: TabTrap | null) => void;
-    render(): false | React.ReactPortal;
+    nativeDialog: React.RefObject<HTMLDialogElement>;
+    render(): false | React.JSX.Element;
 }
 export type DialogAttrs = JSX.LibraryManagedAttributes<typeof Dialog, DialogProps>;

package/components/dialog/dialog.js

@@ -1,6 +1,6 @@
 import { _ as _defineProperty, a as _inherits, b as _createClass, c as _objectWithoutProperties, d as _objectSpread2, e as _classCallCheck, f as _callSuper } from '../_helpers/_rollupPluginBabelHelpers.js';
 import 'core-js/modules/es.array.concat.js';
-import { PureComponent } from 'react';
+import { PureComponent, createRef } from 'react';
 import { createPortal } from 'react-dom';
 import PropTypes from 'prop-types';
 import classNames from 'classnames';
@@ -13,7 +13,7 @@ import TabTrap from '../tab-trap/tab-trap.js';
 import { Button } from '../button/button.js';
 import { PopupTarget } from '../popup/popup.target.js';
 import { m as modules_5e9b8c03, p as preventerFactory } from '../_helpers/dialog__body-scroll-preventer.js';
-import { jsx, jsxs } from 'react/jsx-runtime';
+import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
 import '../island/adaptive-island-hoc.js';
 import '../global/linear-function.js';
 import '../_helpers/island.js';
@@ -60,7 +60,7 @@ import '../global/controls-height.js';
 import '../_helpers/button__classes.js';
 import 'scrollbar-width';
 
-var _excluded = ["show", "showCloseButton", "onOverlayClick", "onCloseAttempt", "onEscPress", "onCloseClick", "children", "className", "contentClassName", "trapFocus", "data-test", "closeButtonInside", "portalTarget", "label", "closeButtonTitle", "dense", "shortcutOptions"];
+var _excluded = ["show", "showCloseButton", "onOverlayClick", "onCloseAttempt", "onEscPress", "onCloseClick", "children", "className", "contentClassName", "trapFocus", "data-test", "closeButtonInside", "portalTarget", "label", "closeButtonTitle", "dense", "shortcutOptions", "native", "modal"];
 function noop() {}
 var Dialog = /*#__PURE__*/function (_PureComponent) {
   function Dialog() {
@@ -98,17 +98,30 @@ var Dialog = /*#__PURE__*/function (_PureComponent) {
     _defineProperty(_this, "dialogRef", function (tabTrap) {
       _this.dialog = tabTrap && tabTrap.node;
     });
+    _defineProperty(_this, "nativeDialog", /*#__PURE__*/createRef());
     return _this;
   }
   _inherits(Dialog, _PureComponent);
   return _createClass(Dialog, [{
     key: "componentDidMount",
     value: function componentDidMount() {
+      var _this$props = this.props,
+        show = _this$props.show,
+        native = _this$props.native;
+      if (native && show) {
+        this.toggleNativeDialog();
+      }
       this.toggleScrollPreventer();
     }
   }, {
     key: "componentDidUpdate",
     value: function componentDidUpdate(prevProps) {
+      var _this$props2 = this.props,
+        show = _this$props2.show,
+        native = _this$props2.native;
+      if (native && show !== prevProps.show) {
+        this.toggleNativeDialog();
+      }
       if (prevProps.show !== this.props.show) {
         this.toggleScrollPreventer();
       }
@@ -118,6 +131,20 @@ var Dialog = /*#__PURE__*/function (_PureComponent) {
     value: function componentWillUnmount() {
       this.scrollPreventer.reset();
     }
+  }, {
+    key: "toggleNativeDialog",
+    value: function toggleNativeDialog() {
+      var _this$props3 = this.props,
+        show = _this$props3.show,
+        modal = _this$props3.modal;
+      if (this.nativeDialog.current != null) {
+        if (show) {
+          modal ? this.nativeDialog.current.showModal() : this.nativeDialog.current.show();
+        } else {
+          this.nativeDialog.current.close();
+        }
+      }
+    }
   }, {
     key: "toggleScrollPreventer",
     value: function toggleScrollPreventer() {
@@ -131,27 +158,78 @@ var Dialog = /*#__PURE__*/function (_PureComponent) {
     key: "render",
     value: function render() {
       var _this2 = this;
-      var _this$props = this.props,
-        show = _this$props.show,
-        showCloseButton = _this$props.showCloseButton,
-        onOverlayClick = _this$props.onOverlayClick,
-        onCloseAttempt = _this$props.onCloseAttempt;
-        _this$props.onEscPress;
-        _this$props.onCloseClick;
-        var _children = _this$props.children,
-        className = _this$props.className,
-        contentClassName = _this$props.contentClassName,
-        trapFocus = _this$props.trapFocus,
-        dataTest = _this$props['data-test'],
-        closeButtonInside = _this$props.closeButtonInside,
-        portalTarget = _this$props.portalTarget,
-        label = _this$props.label,
-        closeButtonTitle = _this$props.closeButtonTitle,
-        dense = _this$props.dense;
-        _this$props.shortcutOptions;
-        var restProps = _objectWithoutProperties(_this$props, _excluded);
+      var _this$props4 = this.props,
+        show = _this$props4.show,
+        showCloseButton = _this$props4.showCloseButton,
+        onOverlayClick = _this$props4.onOverlayClick,
+        onCloseAttempt = _this$props4.onCloseAttempt;
+        _this$props4.onEscPress;
+        _this$props4.onCloseClick;
+        var children = _this$props4.children,
+        className = _this$props4.className,
+        contentClassName = _this$props4.contentClassName,
+        trapFocus = _this$props4.trapFocus,
+        dataTest = _this$props4['data-test'],
+        closeButtonInside = _this$props4.closeButtonInside,
+        portalTarget = _this$props4.portalTarget,
+        label = _this$props4.label,
+        closeButtonTitle = _this$props4.closeButtonTitle,
+        dense = _this$props4.dense;
+        _this$props4.shortcutOptions;
+        var native = _this$props4.native;
+        _this$props4.modal;
+        var restProps = _objectWithoutProperties(_this$props4, _excluded);
       var classes = classNames(modules_5e9b8c03.container, className);
       var shortcutsMap = this.getShortcutsMap();
+      var content = /*#__PURE__*/jsxs(Fragment, {
+        children: [/*#__PURE__*/jsx(Shortcuts, {
+          map: shortcutsMap,
+          scope: this.state.shortcutsScope,
+          options: this.props.shortcutOptions
+        }), (onOverlayClick !== noop || onCloseAttempt !== noop) && /*#__PURE__*/jsx("div", {
+          // click handler is duplicated in close button
+          role: "presentation",
+          className: modules_5e9b8c03.clickableOverlay,
+          onClick: this.handleClick
+        }), /*#__PURE__*/jsx("div", {
+          className: modules_5e9b8c03.innerContainer,
+          children: /*#__PURE__*/jsxs(AdaptiveIsland, {
+            className: classNames(modules_5e9b8c03.content, contentClassName, {
+              [modules_5e9b8c03.dense]: dense
+            }),
+            "data-test": "ring-dialog",
+            role: "dialog",
+            "aria-label": label,
+            children: [children, showCloseButton && /*#__PURE__*/jsx(Button, {
+              icon: closeIcon,
+              "data-test": "ring-dialog-close-button",
+              className: classNames(modules_5e9b8c03.closeButton, {
+                [modules_5e9b8c03.closeButtonOutside]: !closeButtonInside,
+                [modules_5e9b8c03.closeButtonInside]: closeButtonInside
+              }),
+              iconClassName: modules_5e9b8c03.closeIcon,
+              onClick: this.onCloseClick,
+              title: closeButtonTitle,
+              "aria-label": closeButtonTitle || 'close dialog'
+            })]
+          })
+        })]
+      });
+      if (native) {
+        return /*#__PURE__*/jsx("dialog", {
+          className: classNames(modules_5e9b8c03.nativeDialog, className),
+          ref: this.nativeDialog,
+          children: /*#__PURE__*/jsx(PopupTarget, {
+            id: this.uid,
+            className: modules_5e9b8c03.popupTarget,
+            children: function children(target) {
+              return /*#__PURE__*/jsxs(Fragment, {
+                children: [content, target]
+              });
+            }
+          })
+        });
+      }
       return show && /*#__PURE__*/createPortal( /*#__PURE__*/jsx(PopupTarget, {
         id: this.uid,
         className: modules_5e9b8c03.popupTarget,
@@ -163,38 +241,7 @@ var Dialog = /*#__PURE__*/function (_PureComponent) {
             className: classes,
             role: "presentation"
           }, restProps), {}, {
-            children: [/*#__PURE__*/jsx(Shortcuts, {
-              map: shortcutsMap,
-              scope: _this2.state.shortcutsScope,
-              options: _this2.props.shortcutOptions
-            }), (onOverlayClick !== noop || onCloseAttempt !== noop) && /*#__PURE__*/jsx("div", {
-              // click handler is duplicated in close button
-              role: "presentation",
-              className: modules_5e9b8c03.clickableOverlay,
-              onClick: _this2.handleClick
-            }), /*#__PURE__*/jsx("div", {
-              className: modules_5e9b8c03.innerContainer,
-              children: /*#__PURE__*/jsxs(AdaptiveIsland, {
-                className: classNames(modules_5e9b8c03.content, contentClassName, {
-                  [modules_5e9b8c03.dense]: dense
-                }),
-                "data-test": "ring-dialog",
-                role: "dialog",
-                "aria-label": label,
-                children: [_children, showCloseButton && /*#__PURE__*/jsx(Button, {
-                  icon: closeIcon,
-                  "data-test": "ring-dialog-close-button",
-                  className: classNames(modules_5e9b8c03.closeButton, {
-                    [modules_5e9b8c03.closeButtonOutside]: !closeButtonInside,
-                    [modules_5e9b8c03.closeButtonInside]: closeButtonInside
-                  }),
-                  iconClassName: modules_5e9b8c03.closeIcon,
-                  onClick: _this2.onCloseClick,
-                  title: closeButtonTitle,
-                  "aria-label": closeButtonTitle || 'close dialog'
-                })]
-              })
-            }), target]
+            children: [content, target]
           }));
         }
       }), portalTarget instanceof HTMLElement ? portalTarget : document.body);
@@ -235,7 +282,8 @@ _defineProperty(Dialog, "defaultProps", {
     modal: false
   },
   trapFocus: false,
-  autoFocusFirst: true
+  autoFocusFirst: true,
+  modal: true
 });
 
 export { Dialog as default };

package/components/dropdown/anchor.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import PropTypes from 'prop-types';
 import { ButtonAttrs } from '../button/button';
 declare const _default: import("react").MemoExoticComponent<{

package/components/dropdown-menu/dropdown-menu.d.ts

@@ -16,8 +16,8 @@ export interface DropdownMenuProps<T = unknown> extends Omit<DropdownAttrs, 'anc
     menuProps?: PopupMenuAttrs<T> | null | undefined;
 }
 declare const _default: (<T = unknown>(props: DropdownMenuProps<T> & {
-    ref?: Ref<PopupMenu<unknown>> | undefined;
-}) => ReactElement<any, string | import("react").JSXElementConstructor<any>> | null) & {
+    ref?: Ref<PopupMenu>;
+}) => ReactElement | null) & {
     ListProps: {
         Type: typeof import("../list/consts").Type;
         Dimension: {

package/components/editable-heading/editable-heading.js

@@ -37,6 +37,7 @@ import '../i18n/i18n.js';
 import 'core-js/modules/es.set.js';
 import '../global/composeRefs.js';
 import 'core-js/modules/web.dom-collections.for-each.js';
+import 'memoize-one';
 import '../control-label/control-label.js';
 import '../control-help/control-help.js';
 import 'core-js/modules/es.regexp.to-string.js';

package/components/global/composeRefs.d.ts

@@ -1,3 +1,3 @@
 import { Ref } from 'react';
-declare const _default: <T>(...refs: (Ref<T> | undefined)[]) => (value: T | null) => void;
-export default _default;
+export default function composeRefs<T>(...refs: (Ref<T> | undefined)[]): (value: T | null) => void;
+export declare function createComposedRef<T>(): import("memoize-one").MemoizedFn<(...refs: (Ref<T> | undefined)[]) => (value: T | null) => void>;

package/components/global/composeRefs.js

@@ -1,7 +1,8 @@
 import 'core-js/modules/es.object.to-string.js';
 import 'core-js/modules/web.dom-collections.for-each.js';
+import memoizeOne from 'memoize-one';
 
-var composeRefs = (function () {
+function composeRefs() {
   for (var _len = arguments.length, refs = new Array(_len), _key = 0; _key < _len; _key++) {
     refs[_key] = arguments[_key];
   }
@@ -14,6 +15,9 @@ var composeRefs = (function () {
       }
     });
   };
-});
+}
+function createComposedRef() {
+  return memoizeOne(composeRefs);
+}
 
-export { composeRefs as default };
+export { createComposedRef, composeRefs as default };

package/components/global/controls-height.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 export declare enum ControlsHeight {
     S = "S",
     M = "M",

package/components/global/dom.d.ts

@@ -3,7 +3,7 @@
  */
 import { SyntheticEvent } from 'react';
 import type { PropertiesHyphen } from 'csstype';
-export declare const getStyles: ((elt: Element, pseudoElt?: string | null | undefined) => CSSStyleDeclaration) & typeof getComputedStyle;
+export declare const getStyles: ((elt: Element, pseudoElt?: string | null) => CSSStyleDeclaration) & typeof getComputedStyle;
 export declare function isMounted(node: Node | Range | null | undefined): boolean;
 export interface Rect {
     top: number;
@@ -20,7 +20,7 @@ export declare function getWindowWidth(): number;
 export declare function isNodeInVisiblePartOfPage(node: Element | Range): boolean;
 export declare function getDocumentScrollTop(): number;
 export declare function getDocumentScrollLeft(): number;
-export declare const applyMethodToClasses: (method: 'add' | 'remove') => (classList: DOMTokenList, classes?: string) => void;
+export declare const applyMethodToClasses: (method: "add" | "remove") => (classList: DOMTokenList, classes?: string) => void;
 export declare const addClasses: (classList: DOMTokenList, classes?: string) => void;
 export declare const removeClasses: (classList: DOMTokenList, classes?: string) => void;
 export declare const toggleClasses: (classList: DOMTokenList, classes: Record<string, boolean>) => void;

package/components/global/focus-sensor-hoc.js

@@ -7,6 +7,7 @@ import composeRefs from './composeRefs.js';
 import { jsx } from 'react/jsx-runtime';
 import 'core-js/modules/es.object.to-string.js';
 import 'core-js/modules/web.dom-collections.for-each.js';
+import 'memoize-one';
 
 var _excluded = ["innerRef", "focused", "onFocusReset", "onFocusRestore"],
   _excluded2 = ["autofocus", "focused", "onFocus", "onBlur", "innerRef", "scrollOnTableFocus"];

package/components/global/rerender-hoc.js

@@ -5,6 +5,7 @@ import composeRefs from './composeRefs.js';
 import { jsx } from 'react/jsx-runtime';
 import 'core-js/modules/es.object.to-string.js';
 import 'core-js/modules/web.dom-collections.for-each.js';
+import 'memoize-one';
 
 function rerenderHOC(ComposedComponent) {
   var Rerenderer = /*#__PURE__*/function (_Component) {

package/components/global/typescript-utils.d.ts

@@ -1,2 +1,2 @@
 export declare const isArray: (arg: unknown) => arg is readonly unknown[];
-export declare const isTruthy: <T>(arg: T | false | '' | 0 | null | undefined) => arg is T;
+export declare const isTruthy: <T>(arg: T | false | "" | 0 | null | undefined) => arg is T;

package/components/input/input.d.ts

@@ -64,6 +64,7 @@ export declare class Input extends PureComponent<InputProps> {
     stretch(el: HTMLElement | null | undefined): void;
     adapt(): void;
     inputRef: (el: HTMLInputElement | HTMLTextAreaElement | null) => void;
+    composedInputRef: import("memoize-one").MemoizedFn<(...refs: (Ref<HTMLInputElement | HTMLTextAreaElement> | undefined)[]) => (value: HTMLInputElement | HTMLTextAreaElement | null) => void>;
     clear: (e: React.MouseEvent<HTMLButtonElement>) => void;
     handleInputChange: (e: React.ChangeEvent<HTMLInputElement>) => void;
     handleTextareaChange: (e: React.ChangeEvent<HTMLTextAreaElement>) => void;

package/components/input/input.js

@@ -35,3 +35,4 @@ import 'core-js/modules/es.regexp.to-string.js';
 import '../i18n/i18n.js';
 import 'core-js/modules/es.set.js';
 import 'core-js/modules/web.dom-collections.for-each.js';
+import 'memoize-one';