rc-dialog - npm Package Compare versions

Comparing version 8.8.2 to 8.9.0

es/Dialog/Content/index.d.ts

 import * as React from 'react';
-import type { IDialogChildProps } from '..';
+import type { PanelProps, ContentRef } from './Panel';
 export declare type ContentProps = {
@@ -7,9 +7,3 @@ motionName: string;
     onVisibleChanged: (visible: boolean) => void;
-    onMouseDown: React.MouseEventHandler;
-    onMouseUp: React.MouseEventHandler;
-} & IDialogChildProps;
-export declare type ContentRef = {
-    focus: () => void;
-    changeActive: (next: boolean) => void;
-};
+} & PanelProps;
 declare const Content: React.ForwardRefExoticComponent<{
@@ -19,8 +13,3 @@ motionName: string;
     onVisibleChanged: (visible: boolean) => void;
-    onMouseDown: React.MouseEventHandler;
-    onMouseUp: React.MouseEventHandler;
-} & {
-    getOpenCount: () => number;
-    scrollLocker?: import("rc-util/lib/Dom/scrollLocker").default;
-} & import("../..").DialogProps & React.RefAttributes<ContentRef>>;
+} & PanelProps & React.RefAttributes<ContentRef>>;
 export default Content;

es/Dialog/Content/index.js

@@ -0,3 +1,3 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
-import _extends from "@babel/runtime/helpers/esm/extends";
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
@@ -9,17 +9,6 @@ import * as React from 'react';
 import { offset } from '../../util';
-import MemoChildren from './MemoChildren';
-var sentinelStyle = {
-  width: 0,
-  height: 0,
-  overflow: 'hidden',
-  outline: 'none'
-};
+import Panel from './Panel';
 var Content = /*#__PURE__*/React.forwardRef(function (props, ref) {
-  var closable = props.closable,
-      prefixCls = props.prefixCls,
-      width = props.width,
-      height = props.height,
-      footer = props.footer,
+  var prefixCls = props.prefixCls,
       title = props.title,
-      closeIcon = props.closeIcon,
       style = props.style,
@@ -29,38 +18,9 @@ className = props.className,
       forceRender = props.forceRender,
-      bodyStyle = props.bodyStyle,
-      bodyProps = props.bodyProps,
-      children = props.children,
       destroyOnClose = props.destroyOnClose,
-      modalRender = props.modalRender,
       motionName = props.motionName,
       ariaId = props.ariaId,
-      onClose = props.onClose,
       onVisibleChanged = props.onVisibleChanged,
-      onMouseDown = props.onMouseDown,
-      onMouseUp = props.onMouseUp,
       mousePosition = props.mousePosition;
-  var sentinelStartRef = useRef();
-  var sentinelEndRef = useRef();
-  var dialogRef = useRef(); // ============================== Ref ===============================
+  var dialogRef = useRef(); // ============================= Style ==============================
 
-  React.useImperativeHandle(ref, function () {
-    return {
-      focus: function focus() {
-        var _sentinelStartRef$cur;
-
-        (_sentinelStartRef$cur = sentinelStartRef.current) === null || _sentinelStartRef$cur === void 0 ? void 0 : _sentinelStartRef$cur.focus();
-      },
-      changeActive: function changeActive(next) {
-        var _document = document,
-            activeElement = _document.activeElement;
-
-        if (next && activeElement === sentinelEndRef.current) {
-          sentinelStartRef.current.focus();
-        } else if (!next && activeElement === sentinelStartRef.current) {
-          sentinelEndRef.current.focus();
-        }
-      }
-    };
-  }); // ============================= Style ==============================
-
   var _React$useState = React.useState(),
@@ -73,10 +33,2 @@ _React$useState2 = _slicedToArray(_React$useState, 2),
 
-  if (width !== undefined) {
-    contentStyle.width = width;
-  }
-
-  if (height !== undefined) {
-    contentStyle.height = height;
-  }
-
   if (transformOrigin) {
@@ -92,40 +44,2 @@ contentStyle.transformOrigin = transformOrigin;
 
-  var footerNode;
-
-  if (footer) {
-    footerNode = /*#__PURE__*/React.createElement("div", {
-      className: "".concat(prefixCls, "-footer")
-    }, footer);
-  }
-
-  var headerNode;
-
-  if (title) {
-    headerNode = /*#__PURE__*/React.createElement("div", {
-      className: "".concat(prefixCls, "-header")
-    }, /*#__PURE__*/React.createElement("div", {
-      className: "".concat(prefixCls, "-title"),
-      id: ariaId
-    }, title));
-  }
-
-  var closer;
-
-  if (closable) {
-    closer = /*#__PURE__*/React.createElement("button", {
-      type: "button",
-      onClick: onClose,
-      "aria-label": "Close",
-      className: "".concat(prefixCls, "-close")
-    }, closeIcon || /*#__PURE__*/React.createElement("span", {
-      className: "".concat(prefixCls, "-close-x")
-    }));
-  }
-
-  var content = /*#__PURE__*/React.createElement("div", {
-    className: "".concat(prefixCls, "-content")
-  }, closer, headerNode, /*#__PURE__*/React.createElement("div", _extends({
-    className: "".concat(prefixCls, "-body"),
-    style: bodyStyle
-  }, bodyProps), children), footerNode);
   return /*#__PURE__*/React.createElement(CSSMotion, {
@@ -143,24 +57,10 @@ visible: visible,
         motionStyle = _ref.style;
-    return /*#__PURE__*/React.createElement("div", {
-      key: "dialog-element",
-      role: "dialog",
-      "aria-labelledby": title ? ariaId : null,
-      "aria-modal": "true",
-      ref: motionRef,
+    return /*#__PURE__*/React.createElement(Panel, _extends({}, props, {
+      ref: ref,
+      title: title,
+      ariaId: ariaId,
+      prefixCls: prefixCls,
+      holderRef: motionRef,
       style: _objectSpread(_objectSpread(_objectSpread({}, motionStyle), style), contentStyle),
-      className: classNames(prefixCls, className, motionClassName),
-      onMouseDown: onMouseDown,
-      onMouseUp: onMouseUp
-    }, /*#__PURE__*/React.createElement("div", {
-      tabIndex: 0,
-      ref: sentinelStartRef,
-      style: sentinelStyle,
-      "aria-hidden": "true"
-    }), /*#__PURE__*/React.createElement(MemoChildren, {
-      shouldUpdate: visible || forceRender
-    }, modalRender ? modalRender(content) : content), /*#__PURE__*/React.createElement("div", {
-      tabIndex: 0,
-      ref: sentinelEndRef,
-      style: sentinelStyle,
-      "aria-hidden": "true"
+      className: classNames(className, motionClassName)
     }));
@@ -167,0 +67,0 @@ });

es/index.d.ts

 import DialogWrap from './DialogWrap';
-import { IDialogPropTypes as DialogProps } from './IDialogPropTypes';
-export { DialogProps };
+import Panel from './Dialog/Content/Panel';
+import type { IDialogPropTypes as DialogProps } from './IDialogPropTypes';
+export type { DialogProps };
+export { Panel };
 export default DialogWrap;

es/index.js

 import DialogWrap from './DialogWrap';
+import Panel from './Dialog/Content/Panel';
+export { Panel };
 export default DialogWrap;

lib/Dialog/Content/index.d.ts

 import * as React from 'react';
-import type { IDialogChildProps } from '..';
+import type { PanelProps, ContentRef } from './Panel';
 export declare type ContentProps = {
@@ -7,9 +7,3 @@ motionName: string;
     onVisibleChanged: (visible: boolean) => void;
-    onMouseDown: React.MouseEventHandler;
-    onMouseUp: React.MouseEventHandler;
-} & IDialogChildProps;
-export declare type ContentRef = {
-    focus: () => void;
-    changeActive: (next: boolean) => void;
-};
+} & PanelProps;
 declare const Content: React.ForwardRefExoticComponent<{
@@ -19,8 +13,3 @@ motionName: string;
     onVisibleChanged: (visible: boolean) => void;
-    onMouseDown: React.MouseEventHandler;
-    onMouseUp: React.MouseEventHandler;
-} & {
-    getOpenCount: () => number;
-    scrollLocker?: import("rc-util/lib/Dom/scrollLocker").default;
-} & import("../..").DialogProps & React.RefAttributes<ContentRef>>;
+} & PanelProps & React.RefAttributes<ContentRef>>;
 export default Content;

lib/Dialog/Content/index.js

@@ -12,6 +12,6 @@ "use strict";
 
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
 var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
 
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
@@ -27,3 +27,3 @@
 
-var _MemoChildren = _interopRequireDefault(require("./MemoChildren"));
+var _Panel = _interopRequireDefault(require("./Panel"));
 
@@ -34,16 +34,5 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
-var sentinelStyle = {
-  width: 0,
-  height: 0,
-  overflow: 'hidden',
-  outline: 'none'
-};
 var Content = /*#__PURE__*/React.forwardRef(function (props, ref) {
-  var closable = props.closable,
-      prefixCls = props.prefixCls,
-      width = props.width,
-      height = props.height,
-      footer = props.footer,
+  var prefixCls = props.prefixCls,
       title = props.title,
-      closeIcon = props.closeIcon,
       style = props.style,
@@ -53,38 +42,9 @@ className = props.className,
       forceRender = props.forceRender,
-      bodyStyle = props.bodyStyle,
-      bodyProps = props.bodyProps,
-      children = props.children,
       destroyOnClose = props.destroyOnClose,
-      modalRender = props.modalRender,
       motionName = props.motionName,
       ariaId = props.ariaId,
-      onClose = props.onClose,
       onVisibleChanged = props.onVisibleChanged,
-      onMouseDown = props.onMouseDown,
-      onMouseUp = props.onMouseUp,
       mousePosition = props.mousePosition;
-  var sentinelStartRef = (0, React.useRef)();
-  var sentinelEndRef = (0, React.useRef)();
-  var dialogRef = (0, React.useRef)(); // ============================== Ref ===============================
+  var dialogRef = (0, React.useRef)(); // ============================= Style ==============================
 
-  React.useImperativeHandle(ref, function () {
-    return {
-      focus: function focus() {
-        var _sentinelStartRef$cur;
-
-        (_sentinelStartRef$cur = sentinelStartRef.current) === null || _sentinelStartRef$cur === void 0 ? void 0 : _sentinelStartRef$cur.focus();
-      },
-      changeActive: function changeActive(next) {
-        var _document = document,
-            activeElement = _document.activeElement;
-
-        if (next && activeElement === sentinelEndRef.current) {
-          sentinelStartRef.current.focus();
-        } else if (!next && activeElement === sentinelStartRef.current) {
-          sentinelEndRef.current.focus();
-        }
-      }
-    };
-  }); // ============================= Style ==============================
-
   var _React$useState = React.useState(),
@@ -97,10 +57,2 @@ _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
 
-  if (width !== undefined) {
-    contentStyle.width = width;
-  }
-
-  if (height !== undefined) {
-    contentStyle.height = height;
-  }
-
   if (transformOrigin) {
@@ -116,40 +68,2 @@ contentStyle.transformOrigin = transformOrigin;
 
-  var footerNode;
-
-  if (footer) {
-    footerNode = /*#__PURE__*/React.createElement("div", {
-      className: "".concat(prefixCls, "-footer")
-    }, footer);
-  }
-
-  var headerNode;
-
-  if (title) {
-    headerNode = /*#__PURE__*/React.createElement("div", {
-      className: "".concat(prefixCls, "-header")
-    }, /*#__PURE__*/React.createElement("div", {
-      className: "".concat(prefixCls, "-title"),
-      id: ariaId
-    }, title));
-  }
-
-  var closer;
-
-  if (closable) {
-    closer = /*#__PURE__*/React.createElement("button", {
-      type: "button",
-      onClick: onClose,
-      "aria-label": "Close",
-      className: "".concat(prefixCls, "-close")
-    }, closeIcon || /*#__PURE__*/React.createElement("span", {
-      className: "".concat(prefixCls, "-close-x")
-    }));
-  }
-
-  var content = /*#__PURE__*/React.createElement("div", {
-    className: "".concat(prefixCls, "-content")
-  }, closer, headerNode, /*#__PURE__*/React.createElement("div", (0, _extends2.default)({
-    className: "".concat(prefixCls, "-body"),
-    style: bodyStyle
-  }, bodyProps), children), footerNode);
   return /*#__PURE__*/React.createElement(_rcMotion.default, {
@@ -167,24 +81,10 @@ visible: visible,
         motionStyle = _ref.style;
-    return /*#__PURE__*/React.createElement("div", {
-      key: "dialog-element",
-      role: "dialog",
-      "aria-labelledby": title ? ariaId : null,
-      "aria-modal": "true",
-      ref: motionRef,
+    return /*#__PURE__*/React.createElement(_Panel.default, (0, _extends2.default)({}, props, {
+      ref: ref,
+      title: title,
+      ariaId: ariaId,
+      prefixCls: prefixCls,
+      holderRef: motionRef,
       style: (0, _objectSpread2.default)((0, _objectSpread2.default)((0, _objectSpread2.default)({}, motionStyle), style), contentStyle),
-      className: (0, _classnames.default)(prefixCls, className, motionClassName),
-      onMouseDown: onMouseDown,
-      onMouseUp: onMouseUp
-    }, /*#__PURE__*/React.createElement("div", {
-      tabIndex: 0,
-      ref: sentinelStartRef,
-      style: sentinelStyle,
-      "aria-hidden": "true"
-    }), /*#__PURE__*/React.createElement(_MemoChildren.default, {
-      shouldUpdate: visible || forceRender
-    }, modalRender ? modalRender(content) : content), /*#__PURE__*/React.createElement("div", {
-      tabIndex: 0,
-      ref: sentinelEndRef,
-      style: sentinelStyle,
-      "aria-hidden": "true"
+      className: (0, _classnames.default)(className, motionClassName)
     }));
@@ -191,0 +91,0 @@ });

lib/index.d.ts

 import DialogWrap from './DialogWrap';
-import { IDialogPropTypes as DialogProps } from './IDialogPropTypes';
-export { DialogProps };
+import Panel from './Dialog/Content/Panel';
+import type { IDialogPropTypes as DialogProps } from './IDialogPropTypes';
+export type { DialogProps };
+export { Panel };
 export default DialogWrap;

lib/index.js

@@ -8,2 +8,8 @@ "use strict";
 });
+Object.defineProperty(exports, "Panel", {
+  enumerable: true,
+  get: function get() {
+    return _Panel.default;
+  }
+});
 exports.default = void 0;
@@ -13,3 +19,5 @@
 
+var _Panel = _interopRequireDefault(require("./Dialog/Content/Panel"));
+
 var _default = _DialogWrap.default;
 exports.default = _default;

package.json

 {
   "name": "rc-dialog",
-  "version": "8.8.2",
+  "version": "8.9.0",
   "description": "dialog ui component for react",
@@ -5,0 +5,0 @@ "keywords": [

New alerts

Environment variable access

Supply chain risk

Package accesses environment variables, which may be a sign of credential stuffing or data theft.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

75312

increased by6.62%

Number of package files

42

increased by10.53%

Lines of code

1577

increased by6.05%

Worsened metrics

Number of low supply chain risk alerts

2

increased byInfinity%

No dependency changes