rc-dialog - npm Package Compare versions

Comparing version 9.2.0 to 9.3.0

es/Dialog/Content/Panel.js

@@ -34,3 +34,4 @@ import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
     width = props.width,
-    height = props.height;
+    height = props.height,
+    modalClassNames = props.classNames;
 
@@ -73,3 +74,3 @@ // ================================= Refs =================================
     footerNode = /*#__PURE__*/React.createElement("div", {
-      className: "".concat(prefixCls, "-footer")
+      className: classNames("".concat(prefixCls, "-footer"), modalClassNames === null || modalClassNames === void 0 ? void 0 : modalClassNames.footer)
     }, footer);
@@ -80,3 +81,3 @@ }
     headerNode = /*#__PURE__*/React.createElement("div", {
-      className: "".concat(prefixCls, "-header")
+      className: classNames("".concat(prefixCls, "-header"), modalClassNames === null || modalClassNames === void 0 ? void 0 : modalClassNames.header)
     }, /*#__PURE__*/React.createElement("div", {
@@ -101,3 +102,3 @@ className: "".concat(prefixCls, "-title"),
   }, closer, headerNode, /*#__PURE__*/React.createElement("div", _extends({
-    className: "".concat(prefixCls, "-body"),
+    className: classNames("".concat(prefixCls, "-body"), modalClassNames === null || modalClassNames === void 0 ? void 0 : modalClassNames.body),
     style: bodyStyle
@@ -104,0 +105,0 @@ }, bodyProps), children), footerNode);

es/Dialog/index.js

@@ -42,3 +42,4 @@ import _extends from "@babel/runtime/helpers/esm/extends";
     maskProps = props.maskProps,
-    rootClassName = props.rootClassName;
+    rootClassName = props.rootClassName,
+    modalClassNames = props.classNames;
   var lastOutSideActiveElementRef = useRef();
@@ -165,7 +166,8 @@ var wrapperRef = useRef();
     }, maskStyle),
-    maskProps: maskProps
+    maskProps: maskProps,
+    className: modalClassNames === null || modalClassNames === void 0 ? void 0 : modalClassNames.mask
   }), /*#__PURE__*/React.createElement("div", _extends({
     tabIndex: -1,
     onKeyDown: onWrapperKeyDown,
-    className: classNames("".concat(prefixCls, "-wrap"), wrapClassName),
+    className: classNames("".concat(prefixCls, "-wrap"), wrapClassName, modalClassNames === null || modalClassNames === void 0 ? void 0 : modalClassNames.wrapper),
     ref: wrapperRef,
@@ -172,0 +174,0 @@ onClick: onWrapperClick,

es/Dialog/Mask.d.ts

@@ -8,3 +8,4 @@ import * as React from 'react';
     maskProps?: React.HTMLAttributes<HTMLDivElement>;
+    className?: string;
 };
 export default function Mask(props: MaskProps): React.JSX.Element;

es/Dialog/Mask.js

@@ -11,3 +11,4 @@ import _extends from "@babel/runtime/helpers/esm/extends";
     maskProps = props.maskProps,
-    motionName = props.motionName;
+    motionName = props.motionName,
+    className = props.className;
   return /*#__PURE__*/React.createElement(CSSMotion, {
@@ -24,5 +25,5 @@ key: "mask",
       style: _objectSpread(_objectSpread({}, motionStyle), style),
-      className: classNames("".concat(prefixCls, "-mask"), motionClassName)
+      className: classNames("".concat(prefixCls, "-mask"), motionClassName, className)
     }, maskProps));
   });
 }

es/IDialogPropTypes.d.ts

 import type { GetContainer } from 'rc-util/lib/PortalWrapper';
 import type { CSSProperties, ReactNode, SyntheticEvent } from 'react';
+export interface ModalClassNames {
+    header: string;
+    body: string;
+    footer: string;
+    mask: string;
+    wrapper: string;
+}
 export type IDialogPropTypes = {
@@ -37,2 +44,3 @@ className?: string;
     rootClassName?: string;
+    classNames?: ModalClassNames;
     wrapProps?: any;
@@ -39,0 +47,0 @@ getContainer?: GetContainer | false;

lib/Dialog/Content/Panel.js

@@ -44,3 +44,4 @@ "use strict";
     width = props.width,
-    height = props.height;
+    height = props.height,
+    modalClassNames = props.classNames;
 
@@ -83,3 +84,3 @@ // ================================= Refs =================================
     footerNode = /*#__PURE__*/_react.default.createElement("div", {
-      className: "".concat(prefixCls, "-footer")
+      className: (0, _classnames.default)("".concat(prefixCls, "-footer"), modalClassNames === null || modalClassNames === void 0 ? void 0 : modalClassNames.footer)
     }, footer);
@@ -90,3 +91,3 @@ }
     headerNode = /*#__PURE__*/_react.default.createElement("div", {
-      className: "".concat(prefixCls, "-header")
+      className: (0, _classnames.default)("".concat(prefixCls, "-header"), modalClassNames === null || modalClassNames === void 0 ? void 0 : modalClassNames.header)
     }, /*#__PURE__*/_react.default.createElement("div", {
@@ -111,3 +112,3 @@ className: "".concat(prefixCls, "-title"),
   }, closer, headerNode, /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({
-    className: "".concat(prefixCls, "-body"),
+    className: (0, _classnames.default)("".concat(prefixCls, "-body"), modalClassNames === null || modalClassNames === void 0 ? void 0 : modalClassNames.body),
     style: bodyStyle
@@ -114,0 +115,0 @@ }, bodyProps), children), footerNode);

lib/Dialog/index.js

@@ -51,3 +51,4 @@ "use strict";
     maskProps = props.maskProps,
-    rootClassName = props.rootClassName;
+    rootClassName = props.rootClassName,
+    modalClassNames = props.classNames;
   var lastOutSideActiveElementRef = (0, React.useRef)();
@@ -174,7 +175,8 @@ var wrapperRef = (0, React.useRef)();
     }, maskStyle),
-    maskProps: maskProps
+    maskProps: maskProps,
+    className: modalClassNames === null || modalClassNames === void 0 ? void 0 : modalClassNames.mask
   }), /*#__PURE__*/React.createElement("div", (0, _extends2.default)({
     tabIndex: -1,
     onKeyDown: onWrapperKeyDown,
-    className: (0, _classnames.default)("".concat(prefixCls, "-wrap"), wrapClassName),
+    className: (0, _classnames.default)("".concat(prefixCls, "-wrap"), wrapClassName, modalClassNames === null || modalClassNames === void 0 ? void 0 : modalClassNames.wrapper),
     ref: wrapperRef,
@@ -181,0 +183,0 @@ onClick: onWrapperClick,

lib/Dialog/Mask.d.ts

@@ -8,3 +8,4 @@ import * as React from 'react';
     maskProps?: React.HTMLAttributes<HTMLDivElement>;
+    className?: string;
 };
 export default function Mask(props: MaskProps): React.JSX.Element;

lib/Dialog/Mask.js

@@ -21,3 +21,4 @@ "use strict";
     maskProps = props.maskProps,
-    motionName = props.motionName;
+    motionName = props.motionName,
+    className = props.className;
   return /*#__PURE__*/React.createElement(_rcMotion.default, {
@@ -34,5 +35,5 @@ key: "mask",
       style: (0, _objectSpread2.default)((0, _objectSpread2.default)({}, motionStyle), style),
-      className: (0, _classnames.default)("".concat(prefixCls, "-mask"), motionClassName)
+      className: (0, _classnames.default)("".concat(prefixCls, "-mask"), motionClassName, className)
     }, maskProps));
   });
 }

lib/IDialogPropTypes.d.ts

 import type { GetContainer } from 'rc-util/lib/PortalWrapper';
 import type { CSSProperties, ReactNode, SyntheticEvent } from 'react';
+export interface ModalClassNames {
+    header: string;
+    body: string;
+    footer: string;
+    mask: string;
+    wrapper: string;
+}
 export type IDialogPropTypes = {
@@ -37,2 +44,3 @@ className?: string;
     rootClassName?: string;
+    classNames?: ModalClassNames;
     wrapProps?: any;
@@ -39,0 +47,0 @@ getContainer?: GetContainer | false;

package.json

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

README.md

@@ -56,2 +56,3 @@ # rc-dialog
 | className              | String                         |           | additional className for dialog                                                 |         |
+| classNames             | { mask?: string; wrapper?: string; header?: string; body?: string; footer?: string} |           | pass className to target area |         |
 | style                  | Object                         | {}        | Root style for dialog element.Such as width, height                             |         |
@@ -58,0 +59,0 @@ | zIndex                 | Number                         |           |                                                                                 |         |

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

74667

increased by2.52%

Lines of code

1674

increased by1.58%

Number of lines in readme file

110

increased by0.92%

No dependency changes