@canlooks/can-ui 0.0.85 → 0.0.87

package/dist/cjs/components/boundary/errorBoundary.js

@@ -18,9 +18,7 @@ exports.ErrorBoundary = (0, react_1.memo)(({ error, reload, reloadable, ...props
             return error.stack;
         }
         const errorType = typeof error;
-        if (errorType === 'string'
-            || errorType === 'number'
-            || errorType === 'boolean') {
+        if (['string', 'number', 'boolean'].includes(errorType)) {
             return error.toString();
         }
     };

package/dist/cjs/components/calendar/calendar.style.js

@@ -16,128 +16,128 @@ exports.classes = (0, utils_1.defineInnerClasses)('calendar', [
     'yearItem',
     'foot'
 ]);
-exports.style = (0, utils_1.defineCss)(({ divider, text, spacing }) => (0, react_1.css) `
-    .${exports.classes.head} {
-        height: 40px;
-        display: flex;
-        align-items: center;
-        justify-content: space-between;
-        border-bottom: 1px solid ${divider};
-        padding: 0 ${menuItem_style_1.menuListPadding}px;
-        position: relative;
-
-        .${exports.classes.headSide} {
-            z-index: 1;
-        }
-
-        .${exports.classes.headControl} {
-            color: ${text.placeholder};
-        }
-
-        .${exports.classes.headCenter} {
-            display: flex;
-            align-items: center;
-            justify-content: center;
-            position: absolute;
-            inset: 0;
-
-            .${exports.classes.headButton} {
-                font-weight: bold;
-                color: ${text.primary};
-            }
-        }
-    }
-
-    .${exports.classes.body} {
-        padding: ${spacing[3]}px ${spacing[4]}px;
-        display: grid;
-        place-items: center;
-
-        &[data-view-type=date] {
-            font-size: ${13 / 14}em;
-            grid-template-columns: repeat(7, 36px);
-            grid-template-rows: repeat(7, 36px);
-
-            .${exports.classes.dateItem} {
-                width: 24px;
-                height: 24px;
-    
-                &:not([data-variant=filled]) {
-                    color: ${text.primary};
-                    border-color: ${text.disabled};
-    
-                    &[data-other-month=true] {
-                        color: ${text.placeholder};
-                    }
-                }
-
-                &:disabled {
-                    width: 100%;
-                    border-radius: 0;
-                }
-            }
-        }
-
-        &[data-view-type=month], &[data-view-type=year] {
-            grid-template-columns: repeat(3, 84px);
-            grid-template-rows: repeat(4, 63px);
-
-            .${exports.classes.monthItem},
-            .${exports.classes.yearItem} {
-                width: 72px;
-                padding-inline: 0;
-
-                &:not([data-variant=filled]) {
-                    color: ${text.primary};
-                }
-            }
-        }
-    }
-    
-    &[data-size=small] {
-        .${exports.classes.body} {
-            &[data-view-type=date] {
-                grid-template-columns: repeat(7, 30px);
-                grid-template-rows: repeat(7, 30px);
-            }
-
-            &[data-view-type=month], &[data-view-type=year] {
-                grid-template-columns: repeat(3, 70px);
-                grid-template-rows: repeat(4, 52.5px);
-
-                .${exports.classes.monthItem},
-                .${exports.classes.yearItem} {
-                    width: 60px;
-                }
-            }
-        }
-    }
-
-    &[data-size=large] {
-        .${exports.classes.body} {
-            &[data-view-type=date] {
-                font-size: 1em;
-                grid-template-columns: repeat(7, 42px);
-                grid-template-rows: repeat(7, 42px);
-
-                .${exports.classes.dateItem} {
-                    width: 32px;
-                    height: 32px;
-                }
-            }
-
-            &[data-view-type=month], &[data-view-type=year] {
-                grid-template-columns: repeat(3, 98px);
-                grid-template-rows: repeat(4, 73.5px);
-            }
-        }
-    }
-
-    .${exports.classes.foot} {
-        height: 41px;
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        border-top: 1px solid ${divider};
-    }
+exports.style = (0, utils_1.defineCss)(({ divider, text, spacing }) => (0, react_1.css) `
+    .${exports.classes.head} {
+        height: 40px;
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        border-bottom: 1px solid ${divider};
+        padding: 0 ${menuItem_style_1.menuListPadding}px;
+        position: relative;
+
+        .${exports.classes.headSide} {
+            z-index: 1;
+        }
+
+        .${exports.classes.headControl} {
+            color: ${text.placeholder};
+        }
+
+        .${exports.classes.headCenter} {
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            position: absolute;
+            inset: 0;
+
+            .${exports.classes.headButton} {
+                font-weight: bold;
+                color: ${text.primary};
+            }
+        }
+    }
+
+    .${exports.classes.body} {
+        padding: ${spacing[3]}px ${spacing[4]}px;
+        display: grid;
+        place-items: center;
+
+        &[data-view-type=date] {
+            font-size: ${13 / 14}em;
+            grid-template-columns: repeat(7, 36px);
+            grid-template-rows: repeat(7, 36px);
+
+            .${exports.classes.dateItem} {
+                width: 24px;
+                height: 24px;
+    
+                &:not([data-variant=filled]) {
+                    color: ${text.primary};
+                    border-color: ${text.disabled};
+    
+                    &[data-other-month=true] {
+                        color: ${text.placeholder};
+                    }
+                }
+
+                &:disabled {
+                    width: 100%;
+                    border-radius: 0;
+                }
+            }
+        }
+
+        &[data-view-type=month], &[data-view-type=year] {
+            grid-template-columns: repeat(3, 84px);
+            grid-template-rows: repeat(4, 63px);
+
+            .${exports.classes.monthItem},
+            .${exports.classes.yearItem} {
+                width: 72px;
+                padding-inline: 0;
+
+                &:not([data-variant=filled]) {
+                    color: ${text.primary};
+                }
+            }
+        }
+    }
+    
+    &[data-size=small] {
+        .${exports.classes.body} {
+            &[data-view-type=date] {
+                grid-template-columns: repeat(7, 30px);
+                grid-template-rows: repeat(7, 30px);
+            }
+
+            &[data-view-type=month], &[data-view-type=year] {
+                grid-template-columns: repeat(3, 70px);
+                grid-template-rows: repeat(4, 52.5px);
+
+                .${exports.classes.monthItem},
+                .${exports.classes.yearItem} {
+                    width: 60px;
+                }
+            }
+        }
+    }
+
+    &[data-size=large] {
+        .${exports.classes.body} {
+            &[data-view-type=date] {
+                font-size: 1em;
+                grid-template-columns: repeat(7, 42px);
+                grid-template-rows: repeat(7, 42px);
+
+                .${exports.classes.dateItem} {
+                    width: 32px;
+                    height: 32px;
+                }
+            }
+
+            &[data-view-type=month], &[data-view-type=year] {
+                grid-template-columns: repeat(3, 98px);
+                grid-template-rows: repeat(4, 73.5px);
+            }
+        }
+    }
+
+    .${exports.classes.foot} {
+        height: 41px;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        border-top: 1px solid ${divider};
+    }
 `);

package/dist/cjs/components/clickAway/clickAway.d.ts

@@ -60,7 +60,7 @@ export declare function ClickAway({ ref, container, eventType, onClickAway, disa
     results: number;
     security: string;
     unselectable: "off" | "on";
-    popover: "" | "auto" | "manual" | "hint";
+    popover: "" | "auto" | "manual";
     popoverTargetAction: "toggle" | "hide" | "show";
     popoverTarget: string;
     inert: boolean;

package/dist/cjs/components/dialog/dialog.js

@@ -20,8 +20,12 @@ function Dialog({ icon, title, footer, prefix, suffix, width = 420, minWidth, ma
     };
     // 绑定ESC键
     const overlayRef = (0, utils_1.useEscapeClosable)({ escapeClosable, close }, onCancel);
+    const containerRef = (0, react_1.useRef)(null);
     // 点击遮罩层
     const onMaskClick = (e) => {
+        if (e.target !== containerRef.current) {
+            return;
+        }
         props.onMaskClick?.(e);
         if (maskClosable) {
             onCancel?.(e);
@@ -48,7 +52,7 @@ function Dialog({ icon, title, footer, prefix, suffix, width = 420, minWidth, ma
     }, confirmLoading);
     /**
      * ---------------------------------------------------------------------
-     * 长内容滚动
+     * 长内容滚动 - card模式
      */
     const bodyRef = (0, react_1.useRef)(null);
     const bodyWrapRef = (0, react_1.useRef)(null);
@@ -60,6 +64,17 @@ function Dialog({ icon, title, footer, prefix, suffix, width = 420, minWidth, ma
         }
     };
     (0, react_1.useEffect)(() => {
+        if (scrollBehavior === 'card') {
+            bodyRef.current.addEventListener('scroll', onScroll);
+            return () => {
+                bodyRef.current.removeEventListener('scroll', onScroll);
+            };
+        }
+    }, [scrollBehavior]);
+    (0, react_1.useEffect)(() => {
+        if (scrollBehavior !== 'card') {
+            return;
+        }
         if (innerOpen.current) {
             const resizeObserver = new ResizeObserver(onScroll);
             resizeObserver.observe(bodyRef.current);
@@ -68,7 +83,25 @@ function Dialog({ icon, title, footer, prefix, suffix, width = 420, minWidth, ma
                 resizeObserver.disconnect();
             };
         }
-    }, [innerOpen.current]);
+    }, [innerOpen.current, scrollBehavior]);
+    /**
+     * ---------------------------------------------------------------------
+     * 长内容滚动 - card模式
+     */
+    const cardRef = (0, react_1.useRef)(null);
+    (0, react_1.useEffect)(() => {
+        if (scrollBehavior === 'body' && innerOpen.current) {
+            const containerEl = containerRef.current;
+            const resizeObserver = new ResizeObserver(() => {
+                containerEl.dataset.scrollable = (containerEl.scrollHeight > containerEl.clientHeight).toString();
+            });
+            resizeObserver.observe(containerEl);
+            resizeObserver.observe(cardRef.current);
+            return () => {
+                resizeObserver.disconnect();
+            };
+        }
+    }, [innerOpen.current, scrollBehavior]);
     /**
      * ---------------------------------------------------------------------
      * 渲染
@@ -81,11 +114,11 @@ function Dialog({ icon, title, footer, prefix, suffix, width = 420, minWidth, ma
         }
         return footer;
     };
-    return ((0, jsx_runtime_1.jsx)(modal_1.Modal, { ...props, ref: (0, utils_1.cloneRef)(overlayRef, props.ref), css: dialog_style_1.style, className: (0, utils_1.clsx)(dialog_style_1.classes.root, props.className), open: innerOpen.current, onMaskClick: onMaskClick, "data-scroll-behavior": scrollBehavior, "data-draggable": draggable, children: (0, jsx_runtime_1.jsx)(draggable_1.Draggable, { container: () => overlayRef.current, children: (targetProps, handleProps) => (0, jsx_runtime_1.jsxs)("div", { className: dialog_style_1.classes.card, ...targetProps, style: { width, minWidth, maxWidth, ...targetProps.style }, children: [!!icon &&
-                        (0, jsx_runtime_1.jsx)("div", { className: dialog_style_1.classes.icon, children: icon }), (0, jsx_runtime_1.jsxs)("div", { className: dialog_style_1.classes.content, children: [!!(title || showClose) &&
-                                (0, jsx_runtime_1.jsxs)("div", { className: dialog_style_1.classes.titleRow, ...handleProps, children: [(0, jsx_runtime_1.jsx)("div", { className: dialog_style_1.classes.title, children: title }), showClose &&
-                                            (0, jsx_runtime_1.jsx)(button_1.Button, { shape: "circular", variant: "text", color: "text.secondary", ...closeProps, className: (0, utils_1.clsx)(dialog_style_1.classes.close, closeProps?.className), onClick: closeHandler, children: (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faXmark_1.faXmark }) })] }), (0, jsx_runtime_1.jsxs)("div", { ref: bodyRef, className: dialog_style_1.classes.body, onScroll: onScroll, children: [!!prefix &&
-                                        (0, jsx_runtime_1.jsx)("div", { className: dialog_style_1.classes.prefix, children: prefix }), (0, jsx_runtime_1.jsx)("div", { ref: bodyWrapRef, className: dialog_style_1.classes.bodyWrap, children: props.children }), !!suffix &&
-                                        (0, jsx_runtime_1.jsx)("div", { className: dialog_style_1.classes.suffix, children: suffix })] }), (typeof footer === 'undefined' || !!footer) &&
-                                (0, jsx_runtime_1.jsx)("div", { className: dialog_style_1.classes.footer, children: renderFooter() })] })] }) }) }));
+    return ((0, jsx_runtime_1.jsx)(modal_1.Modal, { ...props, ref: (0, utils_1.cloneRef)(overlayRef, props.ref), css: dialog_style_1.style, className: (0, utils_1.clsx)(dialog_style_1.classes.root, props.className), open: innerOpen.current, "data-scroll-behavior": scrollBehavior, "data-draggable": draggable, children: (0, jsx_runtime_1.jsx)("div", { ref: containerRef, className: dialog_style_1.classes.container, onClick: onMaskClick, children: (0, jsx_runtime_1.jsx)(draggable_1.Draggable, { container: () => overlayRef.current, children: (targetProps, handleProps) => (0, jsx_runtime_1.jsxs)("div", { ref: cardRef, className: dialog_style_1.classes.card, ...targetProps, style: { width, minWidth, maxWidth, ...targetProps.style }, children: [!!icon &&
+                            (0, jsx_runtime_1.jsx)("div", { className: dialog_style_1.classes.icon, children: icon }), (0, jsx_runtime_1.jsxs)("div", { className: dialog_style_1.classes.content, children: [!!(title || showClose) &&
+                                    (0, jsx_runtime_1.jsxs)("div", { className: dialog_style_1.classes.titleRow, ...handleProps, children: [(0, jsx_runtime_1.jsx)("div", { className: dialog_style_1.classes.title, children: title }), showClose &&
+                                                (0, jsx_runtime_1.jsx)(button_1.Button, { shape: "circular", variant: "text", color: "text.secondary", ...closeProps, className: (0, utils_1.clsx)(dialog_style_1.classes.close, closeProps?.className), onClick: closeHandler, children: (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faXmark_1.faXmark }) })] }), (0, jsx_runtime_1.jsxs)("div", { ref: bodyRef, className: dialog_style_1.classes.body, onScroll: scrollBehavior === 'card' ? onScroll : void 0, children: [!!prefix &&
+                                            (0, jsx_runtime_1.jsx)("div", { className: dialog_style_1.classes.prefix, children: prefix }), (0, jsx_runtime_1.jsx)("div", { ref: bodyWrapRef, className: dialog_style_1.classes.bodyWrap, children: props.children }), !!suffix &&
+                                            (0, jsx_runtime_1.jsx)("div", { className: dialog_style_1.classes.suffix, children: suffix })] }), (typeof footer === 'undefined' || !!footer) &&
+                                    (0, jsx_runtime_1.jsx)("div", { className: dialog_style_1.classes.footer, children: renderFooter() })] })] }) }) }) }));
 }

package/dist/cjs/components/dialog/dialog.style.d.ts

@@ -6,6 +6,7 @@ export declare const classes: {
     close: string;
     prefix: string;
     icon: string;
+    container: string;
     suffix: string;
     card: string;
     titleRow: string;

package/dist/cjs/components/dialog/dialog.style.js

@@ -3,9 +3,8 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.style = exports.classes = void 0;
 const react_1 = require("@emotion/react");
 const utils_1 = require("../../utils");
-const modal_style_1 = require("../modal/modal.style");
-const overlayBase_style_1 = require("../overlayBase/overlayBase.style");
 exports.classes = (0, utils_1.defineInnerClasses)('dialog', [
+    'container',
     'card',
     'icon',
     'content',
@@ -19,6 +18,16 @@ exports.classes = (0, utils_1.defineInnerClasses)('dialog', [
     'footer'
 ]);
 exports.style = (0, utils_1.defineCss)(({ background, borderRadius, boxShadow, spacing, colors, divider }) => (0, react_1.css) `
+    .${exports.classes.container} {
+        width: 100%;
+        height: 100%;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        padding: 40px;
+        overflow: hidden;
+    }
+    
     .${exports.classes.card} {
         display: flex;
         background-color: ${background.content};
@@ -26,29 +35,24 @@ exports.style = (0, utils_1.defineCss)(({ background, borderRadius, boxShadow, s
         box-shadow: ${boxShadow[0]};
     }
 
-    .${modal_style_1.classes.childrenWrap} {
-        max-width: 100%;
-        padding: 40px;
-    }
-
     &[data-scroll-behavior=card] {
-        .${modal_style_1.classes.childrenWrap} {
-            height: 100%;
-        }
-
         .${exports.classes.card} {
             max-height: 100%;
         }
     }
 
     &[data-scroll-behavior=body] {
-        .${modal_style_1.classes.modal} {
-            height: auto;
-            min-height: 100%;
-        }
-
-        .enter-done .${overlayBase_style_1.classes.childrenWrap} {
+        .${exports.classes.container} {
             overflow: hidden auto;
+            scrollbar-width: none;
+            
+            &[data-scrollable=true] {
+                align-items: flex-start;
+            }
+        }
+        
+        .enter-done .${exports.classes.container} {
+            scrollbar-width: auto;
         }
     }
 

package/dist/cjs/components/form/form.d.ts

@@ -31,11 +31,12 @@ type FormContext<V extends FormValue> = {
 };
 declare const FormContext: React.Context<FormContext<any>>;
 export declare function useFormContext<V extends FormValue>(): FormContext<V>;
-type FormValueContextType<V extends FormValue> = {
+type FormValueContext<V extends FormValue> = {
     formValue?: V;
     setFieldValue?(field: FieldPath, value: any, silent?: boolean): void;
 };
-export declare function useFormValueContext<V extends FormValue>(): FormValueContextType<V>;
+declare const FormValueContext: React.Context<FormValueContext<any>>;
+export declare function useFormValueContext<V extends FormValue>(): FormValueContext<V>;
 export declare function useFormStyleContext(): FormSharedProps;
 export type FormRef<V extends FormValue = FormValue> = {
     /** 存在校验不通过的字段时会得到`null` */

package/dist/cjs/components/modal/modal.js

@@ -22,5 +22,5 @@ function Modal({ modalProps, ...props }) {
     return ((0, jsx_runtime_1.jsx)(overlayBase_1.OverlayBase, { ...props, css: modal_style_1.style, className: (0, utils_1.clsx)(modal_style_1.classes.root, props.className), children: (0, jsx_runtime_1.jsx)(transitionBase_1.Grow, { timeout: overlayBase_1.overlayBaseTransitionDuration, ...modalProps, in: props.open, className: (0, utils_1.clsx)(modal_style_1.classes.modal, modalProps?.className), style: {
                 transformOrigin: transformOrigin.current,
                 ...modalProps?.style
-            }, children: (0, jsx_runtime_1.jsx)("div", { className: modal_style_1.classes.childrenWrap, onClick: e => e.stopPropagation(), children: props.children }) }) }));
+            }, children: props.children }) }));
 }

package/dist/cjs/components/modal/modal.style.d.ts

@@ -1,5 +1,4 @@
 export declare const classes: {
-    childrenWrap: string;
     modal: string;
 } & {
     root: string;

package/dist/cjs/components/modal/modal.style.js

@@ -5,7 +5,6 @@ const react_1 = require("@emotion/react");
 const utils_1 = require("../../utils");
 exports.classes = (0, utils_1.defineInnerClasses)('modal', [
     'modal',
-    'childrenWrap'
 ]);
 exports.style = (0, react_1.css) `
     .${exports.classes.modal} {
@@ -14,5 +13,10 @@ exports.style = (0, react_1.css) `
         display: flex;
         align-items: center;
         justify-content: center;
+        pointer-events: none;
+
+        > * {
+            pointer-events: all;
+        }
     }
 `;

package/dist/cjs/components/overlayBase/overlayBase.js

@@ -37,11 +37,11 @@ function OverlayBase({ container, effectContainer, forceRender, open, onMaskClic
         onClosed?.();
         forceRender === false && setShouldRender(false);
     };
-    return shouldRender.current && (0, react_dom_1.createPortal)((0, jsx_runtime_1.jsx)("div", { ...props, css: overlayBase_style_1.style, className: (0, utils_1.clsx)(overlayBase_style_1.classes.root, props.className), "data-open": open, "data-custom-container": containerEl.current !== document.body, children: (0, jsx_runtime_1.jsx)(transitionBase_1.Fade, { timeout: exports.overlayBaseTransitionDuration, ...(0, utils_1.mergeComponentProps)(maskProps, {
-                in: open,
-                className: overlayBase_style_1.classes.mask,
-                onClick,
-                onEntered,
-                onExited
-            }), children: (0, jsx_runtime_1.jsx)("div", { className: overlayBase_style_1.classes.childrenWrap, children: props.children }) }) }), containerEl.current);
+    return shouldRender.current && (0, react_dom_1.createPortal)((0, jsx_runtime_1.jsxs)("div", { ...props, css: overlayBase_style_1.style, className: (0, utils_1.clsx)(overlayBase_style_1.classes.root, props.className), "data-open": open, "data-custom-container": containerEl.current !== document.body, children: [(0, jsx_runtime_1.jsx)(transitionBase_1.Fade, { timeout: exports.overlayBaseTransitionDuration, ...(0, utils_1.mergeComponentProps)(maskProps, {
+                    in: open,
+                    className: overlayBase_style_1.classes.mask,
+                    onClick,
+                    onEntered,
+                    onExited
+                }) }), props.children] }), containerEl.current);
 }

package/dist/cjs/components/overlayBase/overlayBase.style.d.ts

@@ -1,6 +1,5 @@
 export declare const classes: {
     mask: string;
-    childrenWrap: string;
 } & {
     root: string;
 };

package/dist/cjs/components/overlayBase/overlayBase.style.js

@@ -7,7 +7,6 @@ const app_style_1 = require("../app/app.style");
 const theme_1 = require("../theme");
 exports.classes = (0, utils_1.defineInnerClasses)('overlay-base', [
     'mask',
-    'childrenWrap'
 ]);
 exports.style = (0, utils_1.defineCss)(theme => {
     return [
@@ -30,11 +29,6 @@ exports.style = (0, utils_1.defineCss)(theme => {
             &:not([data-open=true]) {
                 pointer-events: none;
             }
-            
-            .${exports.classes.childrenWrap} {
-                height: 100%;
-                position: relative;
-            }
         `
     ];
 });

package/dist/cjs/components/scrollbar/scrollbar.style.js

@@ -29,7 +29,6 @@ function useStyle({ size }) {
                 z-index: 0;
                 overflow: auto;
                 scrollbar-width: none;
-                -ms-overflow-style: none;
 
                 &::-webkit-scrollbar {
                     display: none;

package/dist/cjs/components/status/status.d.ts

@@ -3,12 +3,12 @@ import { DivProps, Status as IStatus } from '../../types';
 import { FontAwesomeIconProps } from '@fortawesome/react-fontawesome';
 export type StatusType = IStatus | 'confirm' | 'unknown';
 export declare const statusMapToIconDefinition: {
-    info: import("@fortawesome/free-solid-svg-icons").IconDefinition;
-    success: import("@fortawesome/free-solid-svg-icons").IconDefinition;
-    warning: import("@fortawesome/free-solid-svg-icons").IconDefinition;
-    error: import("@fortawesome/free-solid-svg-icons").IconDefinition;
-    confirm: import("@fortawesome/free-solid-svg-icons").IconDefinition;
-    unknown: import("@fortawesome/free-solid-svg-icons").IconDefinition;
+    info: import("@fortawesome/fontawesome-common-types").IconDefinition;
+    success: import("@fortawesome/fontawesome-common-types").IconDefinition;
+    warning: import("@fortawesome/fontawesome-common-types").IconDefinition;
+    error: import("@fortawesome/fontawesome-common-types").IconDefinition;
+    confirm: import("@fortawesome/fontawesome-common-types").IconDefinition;
+    unknown: import("@fortawesome/fontawesome-common-types").IconDefinition;
 };
 export interface StatusIconProps extends Partial<FontAwesomeIconProps> {
     status?: StatusType;

package/dist/esm/components/boundary/errorBoundary.js

@@ -15,9 +15,7 @@ export const ErrorBoundary = memo(({ error, reload, reloadable, ...props }) => {
             return error.stack;
         }
         const errorType = typeof error;
-        if (errorType === 'string'
-            || errorType === 'number'
-            || errorType === 'boolean') {
+        if (['string', 'number', 'boolean'].includes(errorType)) {
             return error.toString();
         }
     };