clxx 2.0.3 → 2.0.6

package/build/Ago/index.d.ts

@@ -1,11 +1,9 @@
 /// <reference types="react" />
-/** @jsx jsx */
-import { jsx } from "@emotion/react";
-import dayjs from "dayjs";
-import { AgoValue } from "../utils/ago";
+import dayjs from 'dayjs';
+import { AgoValue } from '../utils/ago';
 export interface AgoProps extends React.HTMLProps<HTMLSpanElement | HTMLDivElement> {
     date?: dayjs.ConfigType;
     block?: boolean;
     renderContent?: (result: AgoValue) => React.ReactNode;
 }
-export declare function Ago(props: AgoProps): jsx.JSX.Element;
+export declare function Ago(props: AgoProps): import("@emotion/react/jsx-runtime").JSX.Element;

package/build/Ago/index.js

@@ -9,22 +9,21 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-/** @jsx jsx */
-import { jsx } from "@emotion/react";
-import dayjs from "dayjs";
-import { ago } from "../utils/ago";
+import { jsx as _jsx } from "@emotion/react/jsx-runtime";
+import dayjs from 'dayjs';
+import { ago } from '../utils/ago';
 export function Ago(props) {
     const { date = dayjs(), block = false, renderContent } = props, attrs = __rest(props, ["date", "block", "renderContent"]);
     const agoValue = ago(date);
     // 格式化内容
     let content = agoValue.format;
-    if (typeof renderContent === "function") {
+    if (typeof renderContent === 'function') {
         content = renderContent(agoValue);
     }
     // 是否显示为块元素
     if (block) {
-        return jsx("div", Object.assign({}, attrs), content);
+        return _jsx("div", Object.assign({}, attrs, { children: content }));
     }
     // 默认显示行内元素
-    return jsx("span", Object.assign({}, attrs), content);
+    return _jsx("span", Object.assign({}, attrs, { children: content }));
 }

package/build/Alert/Wrapper.d.ts

@@ -1,7 +1,6 @@
 /// <reference types="react" />
-/** @jsx jsx */
-import { Interpolation, jsx, Theme } from "@emotion/react";
-import * as CSS from "csstype";
+import { Interpolation, Theme } from '@emotion/react';
+import * as CSS from 'csstype';
 export interface AlertWrapperProps {
     title?: React.ReactNode;
     description?: React.ReactNode;
@@ -18,4 +17,4 @@ export interface AlertWrapperProps {
     confirmStyle?: Interpolation<Theme>;
     cancelStyle?: Interpolation<Theme>;
 }
-export declare function AlertWrapper(props: AlertWrapperProps): jsx.JSX.Element;
+export declare function AlertWrapper(props: AlertWrapperProps): import("@emotion/react/jsx-runtime").JSX.Element;

package/build/Alert/Wrapper.js

@@ -1,10 +1,9 @@
-/** @jsx jsx */
-import { jsx } from "@emotion/react";
-import { Clickable } from "../Clickable";
-import { Row } from "../Flex/Row";
-import { style } from "./style";
+import { jsx as _jsx, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
+import { Clickable } from '../Clickable';
+import { Row } from '../Flex/Row';
+import { style } from './style';
 export function AlertWrapper(props) {
-    const { title = "提示", description, confirm = "确定", confirmColor = "#007afe", cancel = "取消", cancelColor = "#666", showCancel = false, onConfirm, onCancel, 
+    const { title = '提示', description, confirm = '确定', confirmColor = '#007afe', cancel = '取消', cancelColor = '#666', showCancel = false, onConfirm, onCancel, 
     // 可定制的样式
     titleStyle, descStyle, btnStyle, cancelStyle, confirmStyle, } = props;
     // 标题样式
@@ -18,15 +17,9 @@ export function AlertWrapper(props) {
     if (showCancel) {
         btnBoxCss.push(style.btnBoxWithCancel);
     }
-    return (jsx("div", { css: style.container },
-        jsx("div", { css: style.content },
-            jsx("div", { css: titleCss }, title),
-            description && jsx("div", { css: [style.desc, descStyle] }, description)),
-        jsx(Row, { alignItems: "stretch", css: btnBoxCss },
-            showCancel && (jsx(Clickable, { css: [style.btn, btnStyle, cancelStyle, { color: cancelColor }], onClick: onCancel, activeStyle: {
-                    backgroundColor: `#c0c0c022`,
-                } }, cancel)),
-            jsx(Clickable, { css: [style.btn, btnStyle, confirmStyle, { color: confirmColor }], onClick: onConfirm, activeStyle: {
-                    backgroundColor: `#c0c0c022`,
-                } }, confirm))));
+    return (_jsxs("div", Object.assign({ css: style.container }, { children: [_jsxs("div", Object.assign({ css: style.content }, { children: [_jsx("div", Object.assign({ css: titleCss }, { children: title })), description && _jsx("div", Object.assign({ css: [style.desc, descStyle] }, { children: description }))] })), _jsxs(Row, Object.assign({ alignItems: "stretch", css: btnBoxCss }, { children: [showCancel && (_jsx(Clickable, Object.assign({ css: [style.btn, btnStyle, cancelStyle, { color: cancelColor }], onClick: onCancel, activeStyle: {
+                            backgroundColor: `#c0c0c022`,
+                        } }, { children: cancel }))), _jsx(Clickable, Object.assign({ css: [style.btn, btnStyle, confirmStyle, { color: confirmColor }], onClick: onConfirm, activeStyle: {
+                            backgroundColor: `#c0c0c022`,
+                        } }, { children: confirm }))] }))] })));
 }

package/build/Alert/index.d.ts

@@ -1,5 +1,5 @@
-import React from "react";
-import { AlertWrapperProps } from "./Wrapper";
+import React from 'react';
+import { AlertWrapperProps } from './Wrapper';
 export interface ShowAlertOption extends AlertWrapperProps {
     showMask?: boolean;
 }

package/build/Alert/index.js

@@ -7,13 +7,12 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
         step((generator = generator.apply(thisArg, _arguments || [])).next());
     });
 };
-/** @jsx jsx */
-import { jsx } from "@emotion/react";
-import React from "react";
-import { showDialog } from "../Dialog";
-import { AlertWrapper } from "./Wrapper";
-import isPlainObject from "lodash/isPlainObject";
-import omit from "lodash/omit";
+import { jsx as _jsx } from "@emotion/react/jsx-runtime";
+import React from 'react';
+import { showDialog } from '../Dialog';
+import { AlertWrapper } from './Wrapper';
+import isPlainObject from 'lodash/isPlainObject';
+import omit from 'lodash/omit';
 /**
  * 显示弹框
  * @param option
@@ -29,7 +28,7 @@ export function showAlert(option) {
         config = option;
     }
     // 组件选项
-    const props = omit(config, ["showMask"]);
+    const props = omit(config, ['showMask']);
     props.onCancel = () => __awaiter(this, void 0, void 0, function* () {
         var _a;
         yield closeDialog();
@@ -42,8 +41,8 @@ export function showAlert(option) {
     });
     // 创建对话框
     const closeDialog = showDialog({
-        showMask: typeof config.showMask === "undefined" ? true : !!config.showMask,
-        content: jsx(AlertWrapper, Object.assign({}, props)),
+        showMask: typeof config.showMask === 'undefined' ? true : !!config.showMask,
+        content: _jsx(AlertWrapper, Object.assign({}, props)),
     });
     // 返回关闭逻辑
     return closeDialog;

package/build/Alert/style.js

@@ -5,6 +5,7 @@ export const style = {
             position: "relative",
             overflow: "hidden",
             backgroundColor: "#fff",
+            boxShadow: "0 0 2px 0 #00000055",
         },
         adaptive({
             borderRadius: 16,

package/build/AutoGrid/index.d.ts

@@ -1,7 +1,6 @@
-/** @jsx jsx */
-import { Interpolation, jsx, Theme } from "@emotion/react";
-import React from "react";
-import CSS from "csstype";
+import { Interpolation, Theme } from '@emotion/react';
+import React from 'react';
+import CSS from 'csstype';
 export interface AutoGridOption extends React.HTMLProps<HTMLDivElement> {
     children?: React.ReactNode;
     containerStyle?: Interpolation<Theme>;
@@ -14,4 +13,4 @@ export interface AutoGridOption extends React.HTMLProps<HTMLDivElement> {
  * 自动化生成表格
  * @param props
  */
-export declare function AutoGrid(props: AutoGridOption): jsx.JSX.Element;
+export declare function AutoGrid(props: AutoGridOption): import("@emotion/react/jsx-runtime").JSX.Element;

package/build/AutoGrid/index.js

@@ -9,11 +9,10 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-/** @jsx jsx */
-import { jsx } from "@emotion/react";
-import React, { useCallback } from "react";
-import { style } from "./style";
-import { normalizeUnit } from "../utils/cssUtil";
+import { jsx as _jsx } from "@emotion/react/jsx-runtime";
+import React, { useCallback } from 'react';
+import { style } from './style';
+import { normalizeUnit } from '../utils/cssUtil';
 /**
  * 自动化生成表格
  * @param props
@@ -59,22 +58,21 @@ export function AutoGrid(props) {
                     marginBottom: gap,
                 });
             }
-            return (jsx("div", { key: rowIndex, css: finalRowStyle }, row.map((item, colIndex) => {
-                let finalCss = [...finalItemBoxStyle];
-                // 如果是方形的，加入方形相关的样式
-                if (isSquare) {
-                    finalCss.push(style.itemBoxSquare);
-                }
-                finalCss.push(itemStyle);
-                if (isSquare) {
-                    return (jsx("div", { css: finalCss, key: colIndex },
-                        jsx("div", { css: style.itemInnerStyle }, item)));
-                }
-                else {
-                    return (jsx("div", { css: finalItemBoxStyle, key: colIndex }, item));
-                }
-            })));
+            return (_jsx("div", Object.assign({ css: finalRowStyle }, { children: row.map((item, colIndex) => {
+                    let finalCss = [...finalItemBoxStyle];
+                    // 如果是方形的，加入方形相关的样式
+                    if (isSquare) {
+                        finalCss.push(style.itemBoxSquare);
+                    }
+                    finalCss.push(itemStyle);
+                    if (isSquare) {
+                        return (_jsx("div", Object.assign({ css: finalCss }, { children: _jsx("div", Object.assign({ css: style.itemInnerStyle }, { children: item })) }), colIndex));
+                    }
+                    else {
+                        return (_jsx("div", Object.assign({ css: finalItemBoxStyle }, { children: item }), colIndex));
+                    }
+                }) }), rowIndex));
         });
     };
-    return (jsx("div", Object.assign({}, extra, { css: [containerStyle] }), showContent()));
+    return (_jsx("div", Object.assign({}, extra, { css: [containerStyle] }, { children: showContent() })));
 }

package/build/CarouselNotice/index.d.ts

@@ -1,12 +1,11 @@
 /// <reference types="react" />
-/** @jsx jsx */
-import { jsx, Interpolation, Theme } from "@emotion/react";
-import * as CSS from "csstype";
+import { Interpolation, Theme } from '@emotion/react';
+import * as CSS from 'csstype';
 export interface CarouselNoticeOption extends React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement> {
     list: Array<React.ReactNode>;
     width: CSS.Property.Width;
     height: CSS.Property.Height;
-    justify: "start" | "center" | "end";
+    justify: 'start' | 'center' | 'end';
     duration: number;
     interval: number;
     containerStyle?: Interpolation<Theme>;
@@ -17,4 +16,4 @@ export interface CarouselNoticeOption extends React.DetailedHTMLProps<React.HTML
  * 滚动循环轮播公告
  * @param props
  */
-export declare function CarouselNotice(props: Partial<CarouselNoticeOption>): false | jsx.JSX.Element;
+export declare function CarouselNotice(props: Partial<CarouselNoticeOption>): false | import("@emotion/react/jsx-runtime").JSX.Element;

package/build/CarouselNotice/index.js

@@ -9,17 +9,17 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-/** @jsx jsx */
-import { jsx, css } from "@emotion/react";
-import { useState, useEffect } from "react";
-import { useInterval } from "../effect/useInterval";
-import { style, Bubble } from "./style";
+import { jsx as _jsx } from "@emotion/react/jsx-runtime";
+import { css } from '@emotion/react';
+import { useState, useEffect } from 'react';
+import { useInterval } from '../Effect/useInterval';
+import { style, Bubble } from './style';
 /**
  * 滚动循环轮播公告
  * @param props
  */
 export function CarouselNotice(props) {
-    const { width, height, justify = "center", interval = 3000, duration = 200, list = [], containerStyle, wrapperStyle, itemStyle } = props, attrs = __rest(props, ["width", "height", "justify", "interval", "duration", "list", "containerStyle", "wrapperStyle", "itemStyle"]);
+    const { width, height, justify = 'center', interval = 3000, duration = 200, list = [], containerStyle, wrapperStyle, itemStyle } = props, attrs = __rest(props, ["width", "height", "justify", "interval", "duration", "list", "containerStyle", "wrapperStyle", "itemStyle"]);
     const [current, setCurrent] = useState(0);
     const [animation, setAnimation] = useState(false);
     /**
@@ -40,30 +40,30 @@ export function CarouselNotice(props) {
      */
     const showContent = () => {
         const justifyStyle = {};
-        if (justify === "center") {
-            justifyStyle.justifyContent = "center";
+        if (justify === 'center') {
+            justifyStyle.justifyContent = 'center';
         }
-        else if (justify === "start") {
-            justifyStyle.justifyContent = "flex-start";
+        else if (justify === 'start') {
+            justifyStyle.justifyContent = 'flex-start';
         }
-        else if (justify === "end") {
-            justifyStyle.justifyContent = "flex-end";
+        else if (justify === 'end') {
+            justifyStyle.justifyContent = 'flex-end';
         }
         else {
-            justifyStyle.justifyContent = "center";
+            justifyStyle.justifyContent = 'center';
         }
         const itemCss = [style.item, justifyStyle];
         if (list.length === 1) {
-            return (jsx("div", { css: [itemCss, itemStyle], key: 0 }, list[0]));
+            return (_jsx("div", Object.assign({ css: [itemCss, itemStyle] }, { children: list[0] }), 0));
         }
         const showList = [];
         if (current === list.length - 1) {
-            showList.push(jsx("div", { css: [itemCss, itemStyle], key: current }, list[list.length - 1]));
-            showList.push(jsx("div", { css: [itemCss, itemStyle], key: 0 }, list[0]));
+            showList.push(_jsx("div", Object.assign({ css: [itemCss, itemStyle] }, { children: list[list.length - 1] }), current));
+            showList.push(_jsx("div", Object.assign({ css: [itemCss, itemStyle] }, { children: list[0] }), 0));
         }
         else {
-            showList.push(jsx("div", { css: [itemCss, itemStyle], key: current }, list[current]));
-            showList.push(jsx("div", { css: [itemCss, itemStyle], key: current + 1 }, list[current + 1]));
+            showList.push(_jsx("div", Object.assign({ css: [itemCss, itemStyle] }, { children: list[current] }), current));
+            showList.push(_jsx("div", Object.assign({ css: [itemCss, itemStyle] }, { children: list[current + 1] }), current + 1));
         }
         return showList;
     };
@@ -76,7 +76,7 @@ export function CarouselNotice(props) {
         }
         return css({
             animationName: Bubble,
-            animationTimingFunction: "linear",
+            animationTimingFunction: 'linear',
             animationDuration: `${duration}ms`,
         });
     };
@@ -92,6 +92,5 @@ export function CarouselNotice(props) {
         setAnimation(false);
     };
     return (Array.isArray(list) &&
-        list.length > 0 && (jsx("div", Object.assign({}, attrs, { css: [style.box, { width, height }, containerStyle] }),
-        jsx("div", { onAnimationEnd: animationEnd, css: [style.wrapper, getAnimation(), wrapperStyle] }, showContent()))));
+        list.length > 0 && (_jsx("div", Object.assign({}, attrs, { css: [style.box, { width, height }, containerStyle] }, { children: _jsx("div", Object.assign({ onAnimationEnd: animationEnd, css: [style.wrapper, getAnimation(), wrapperStyle] }, { children: showContent() })) }))));
 }

package/build/Clickable/index.d.ts

@@ -9,4 +9,4 @@ export interface ClickableProps extends React.HTMLProps<HTMLDivElement> {
     activeStyle: React.CSSProperties;
     disable: boolean;
 }
-export declare function Clickable(props: Partial<ClickableProps>): JSX.Element;
+export declare function Clickable(props: Partial<ClickableProps>): import("@emotion/react/jsx-runtime").JSX.Element;

package/build/Clickable/index.js

@@ -9,7 +9,8 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-import React, { useCallback, useRef, useState, useEffect, } from "react";
+import { jsx as _jsx } from "@emotion/react/jsx-runtime";
+import { useCallback, useRef, useState, useEffect, } from "react";
 import { is } from "../utils/is";
 export function Clickable(props) {
     let { children, bubble = true, className, activeClassName, style, activeStyle, disable = false } = props, attrs = __rest(props, ["children", "bubble", "className", "activeClassName", "style", "activeStyle", "disable"]);
@@ -74,5 +75,5 @@ export function Clickable(props) {
             fullAttrs.onMouseDown = onStart;
         }
     }
-    return React.createElement("div", Object.assign({}, fullAttrs), children);
+    return _jsx("div", Object.assign({}, fullAttrs, { children: children }));
 }

package/build/Container/index.d.ts

@@ -1,6 +1,5 @@
-/** @jsx jsx */
-import { jsx, Interpolation, Theme } from "@emotion/react";
-import React from "react";
+import { Interpolation, Theme } from '@emotion/react';
+import React from 'react';
 export interface ContainerProps {
     globalStyle?: Interpolation<Theme>;
     children?: React.ReactNode;
@@ -10,4 +9,4 @@ export interface ContainerProps {
  * 自适应容器
  * @param props
  */
-export declare function Container(props: ContainerProps): jsx.JSX.Element;
+export declare function Container(props: ContainerProps): import("@emotion/react/jsx-runtime").JSX.Element;

package/build/Container/index.js

@@ -1,10 +1,10 @@
-/** @jsx jsx */
-import { jsx, Global } from "@emotion/react";
-import React, { useCallback, useEffect, useState } from "react";
-import { getContextValue } from "../context";
-import { useWindowResize } from "../effect/useWindowResize";
-import round from "lodash/round";
-import { useViewport } from "../effect/useViewport";
+import { jsx as _jsx, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
+import { Global } from '@emotion/react';
+import React, { useCallback, useEffect, useState } from 'react';
+import { getContextValue } from '../context';
+import { useWindowResize } from '../Effect/useWindowResize';
+import round from 'lodash/round';
+import { useViewport } from '../Effect/useViewport';
 /**
  * 自适应容器
  * @param props
@@ -36,7 +36,7 @@ export function Container(props) {
     // 字体缩放逻辑
     const scaleFont = useCallback(() => {
         let computeSize = parseFloat(window.getComputedStyle(document.documentElement).fontSize);
-        if (typeof computeSize === "number" && computeSize !== baseFontSize) {
+        if (typeof computeSize === 'number' && computeSize !== baseFontSize) {
             setBaseFontSize(round(Math.pow(baseFontSize, 2) / computeSize, 1));
         }
     }, [baseFontSize]);
@@ -48,42 +48,40 @@ export function Container(props) {
     useEffect(() => {
         // 激活iOS上的:active
         const activable = () => { };
-        document.body.addEventListener("touchstart", activable);
+        document.body.addEventListener('touchstart', activable);
         return () => {
-            document.body.removeEventListener("touchstart", activable);
+            document.body.removeEventListener('touchstart', activable);
         };
     }, []);
-    return (jsx(React.Fragment, null,
-        jsx(Global, { styles: [
-                {
-                    "*": {
-                        boxSizing: "border-box",
-                    },
-                    html: {
-                        WebkitTapHighlightColor: "transparent",
-                        WebkitOverflowScrolling: "touch",
-                        WebkitTextSizeAdjust: "100%",
-                        fontSize: `${baseFontSize}px`,
-                        touchAction: "manipulation",
-                    },
-                    body: {
-                        fontSize: "16px",
-                        margin: "0 auto",
-                        maxWidth: `${maxDocWidth}px`,
-                        minWidth: `${minDocWidth}px`,
-                    },
-                    [`@media (min-width: ${maxDocWidth}px)`]: {
-                        html: {
-                            fontSize: `${(100 * maxDocWidth) / designWidth}px`,
+    return (_jsxs(React.Fragment, { children: [_jsx(Global, { styles: [
+                    {
+                        '*': {
+                            boxSizing: 'border-box',
                         },
-                    },
-                    [`@media (max-width: ${minDocWidth}px)`]: {
                         html: {
-                            fontSize: `${(100 * minDocWidth) / designWidth}px`,
+                            WebkitTapHighlightColor: 'transparent',
+                            WebkitOverflowScrolling: 'touch',
+                            WebkitTextSizeAdjust: '100%',
+                            fontSize: `${baseFontSize}px`,
+                            touchAction: 'manipulation',
+                        },
+                        body: {
+                            fontSize: '16px',
+                            margin: '0 auto',
+                            maxWidth: `${maxDocWidth}px`,
+                            minWidth: `${minDocWidth}px`,
+                        },
+                        [`@media (min-width: ${maxDocWidth}px)`]: {
+                            html: {
+                                fontSize: `${(100 * maxDocWidth) / designWidth}px`,
+                            },
+                        },
+                        [`@media (max-width: ${minDocWidth}px)`]: {
+                            html: {
+                                fontSize: `${(100 * minDocWidth) / designWidth}px`,
+                            },
                         },
                     },
-                },
-                globalStyle,
-            ] }),
-        children));
+                    globalStyle,
+                ] }), children] }));
 }

package/build/Countdowner/index.d.ts

@@ -1,7 +1,6 @@
-/** @jsx jsx */
-import React from "react";
-import { Interpolation, jsx, Theme } from "@emotion/react";
-import { CountdownOption } from "../utils/Countdown";
+import React from 'react';
+import { Interpolation, Theme } from '@emotion/react';
+import { CountdownOption } from '../utils/Countdown';
 export interface CountdownerOption extends CountdownOption, React.HTMLProps<HTMLDivElement> {
     seperator?: React.ReactNode;
     seperatorStyle?: Interpolation<Theme>;
@@ -10,4 +9,4 @@ export interface CountdownerOption extends CountdownOption, React.HTMLProps<HTML
     renderNumber?: (value: number, key?: string) => React.ReactNode;
     renderSeperator?: (value: number, key?: string) => React.ReactNode;
 }
-export declare function Countdowner(props: CountdownerOption): jsx.JSX.Element;
+export declare function Countdowner(props: CountdownerOption): import("@emotion/react/jsx-runtime").JSX.Element;

package/build/Countdowner/index.js

@@ -9,39 +9,38 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-/** @jsx jsx */
-import React, { useEffect, useState } from "react";
-import { jsx } from "@emotion/react";
-import { Countdown, } from "../utils/Countdown";
-import { RowStart } from "../Flex/Row";
+import { jsx as _jsx } from "@emotion/react/jsx-runtime";
+import React, { useEffect, useState } from 'react';
+import { Countdown, } from '../utils/Countdown';
+import { RowStart } from '../Flex/Row';
 export function Countdowner(props) {
-    let { remain = 0, seperator = ":", format = "his", onUpdate, onEnd, seperatorStyle, containerStyle, numberStyle, renderNumber, renderSeperator } = props, extra = __rest(props, ["remain", "seperator", "format", "onUpdate", "onEnd", "seperatorStyle", "containerStyle", "numberStyle", "renderNumber", "renderSeperator"]);
+    let { remain = 0, seperator = ':', format = 'his', onUpdate, onEnd, seperatorStyle, containerStyle, numberStyle, renderNumber, renderSeperator } = props, extra = __rest(props, ["remain", "seperator", "format", "onUpdate", "onEnd", "seperatorStyle", "containerStyle", "numberStyle", "renderNumber", "renderSeperator"]);
     const [value, setValue] = useState(null);
     let content = [];
-    if (value && typeof value === "object") {
+    if (value && typeof value === 'object') {
         for (let i = 0; i < format.length; i++) {
             // 渲染数字进组件
             const key = format[i];
             const num = value[key];
             let numberComponent;
-            if (typeof renderNumber === "function") {
+            if (typeof renderNumber === 'function') {
                 numberComponent = renderNumber(num, key);
             }
             else {
                 // 默认以span包围，且数字不足10的时候有前置0
-                numberComponent = (jsx("span", { css: numberStyle }, num < 10 ? `0${num}` : num));
+                numberComponent = (_jsx("span", Object.assign({ css: numberStyle }, { children: num < 10 ? `0${num}` : num })));
             }
-            content.push(jsx(React.Fragment, { key: i }, numberComponent));
+            content.push(_jsx(React.Fragment, { children: numberComponent }, i));
             // 添加分隔符，最后一个数字不需要分隔符
             if (i !== format.length - 1) {
                 let seperatorComponent;
-                if (typeof renderSeperator === "function") {
+                if (typeof renderSeperator === 'function') {
                     seperatorComponent = renderSeperator(num, key);
                 }
                 else {
-                    seperatorComponent = seperator ? (jsx("span", { css: seperatorStyle }, seperator)) : null;
+                    seperatorComponent = seperator ? (_jsx("span", Object.assign({ css: seperatorStyle }, { children: seperator }))) : null;
                 }
-                content.push(jsx(React.Fragment, { key: `s${i}` }, seperatorComponent));
+                content.push(_jsx(React.Fragment, { children: seperatorComponent }, `s${i}`));
             }
         }
     }
@@ -64,5 +63,5 @@ export function Countdowner(props) {
             instance = null;
         };
     }, [format, remain]);
-    return (jsx(RowStart, Object.assign({}, extra, { css: containerStyle }), content));
+    return (_jsx(RowStart, Object.assign({}, extra, { css: containerStyle }, { children: content })));
 }

package/build/Dialog/Wrapper.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 /** @jsx jsx */
-import { jsx, Theme, Interpolation } from "@emotion/react";
+import { Theme, Interpolation } from "@emotion/react";
 import { DialogType, AnimationStatus } from "./style";
 export interface WrapperProps {
     type?: DialogType;
@@ -13,4 +13,4 @@ export interface WrapperProps {
     boxStyle?: Interpolation<Theme>;
     maskStyle?: Interpolation<Theme>;
 }
-export declare function Wrapper(props: WrapperProps): jsx.JSX.Element;
+export declare function Wrapper(props: WrapperProps): import("@emotion/react/jsx-runtime").JSX.Element;

package/build/Dialog/Wrapper.js

@@ -1,5 +1,4 @@
-/** @jsx jsx */
-import { jsx } from "@emotion/react";
+import { jsx as _jsx, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
 import { Overlay } from "../Overlay";
 import { style, getAnimation } from "./style";
 export function Wrapper(props) {
@@ -27,11 +26,9 @@ export function Wrapper(props) {
             onBlankClick === null || onBlankClick === void 0 ? void 0 : onBlankClick(event);
         }
     };
-    return (jsx(Overlay, { css: { overflow: "hidden" }, centerContent: type === "center", maskColor: "transparent", fullScreen: true, onClick: showMask ? undefined : blankClick },
-        showMask && jsx("div", { css: maskCss, onClick: blankClick }),
-        jsx("div", { css: [boxCss, boxStyle, animation], onAnimationEnd: (event) => {
-                if (status === "hide" && event.animationName === keyframes.name) {
-                    onHide === null || onHide === void 0 ? void 0 : onHide();
-                }
-            } }, children)));
+    return (_jsxs(Overlay, Object.assign({ css: { overflow: "hidden" }, centerContent: type === "center", maskColor: "transparent", fullScreen: true, onClick: showMask ? undefined : blankClick }, { children: [showMask && _jsx("div", { css: maskCss, onClick: blankClick }), _jsx("div", Object.assign({ css: [boxCss, boxStyle, animation], onAnimationEnd: (event) => {
+                    if (status === "hide" && event.animationName === keyframes.name) {
+                        onHide === null || onHide === void 0 ? void 0 : onHide();
+                    }
+                } }, { children: children }))] })));
 }

package/build/Dialog/index.d.ts

@@ -1,6 +1,6 @@
-import React from "react";
-import { DialogType } from "./style";
-import { WrapperProps } from "./Wrapper";
+import React from 'react';
+import { DialogType } from './style';
+import { WrapperProps } from './Wrapper';
 export interface ShowDialogOption extends WrapperProps {
     blankClosable?: boolean;
     content?: React.ReactNode;