@pisell/materials 2.2.48 → 2.2.49

package/lib/components/profileMenu/index.less

@@ -0,0 +1,135 @@
+.profile-menu-wrap {
+  display: flex;
+  max-width: 250px;
+  box-sizing: border-box;
+  gap: 10px;
+  width: fit-content;
+  align-items: center;
+  padding-top: 6px;
+  padding-bottom: 6px;
+  padding-left: 16px;
+
+  border-radius: 50px;
+  border: 1px solid var(--Gray-100, #f2f4f7);
+  background: var(--Base-White, #fff);
+  cursor: pointer;
+  transition: all 0.3s ease;
+
+  /* Shadow/sm */
+  // box-shadow: 0px 1px 3px 0px rgba(16, 24, 40, 0.1),
+  //   0px 1px 2px 0px rgba(16, 24, 40, 0.06);
+
+  &:hover {
+    border-color: var(--Gray-200, #e5e7eb);
+    box-shadow: 0px 2px 4px 0px rgba(16, 24, 40, 0.15);
+  }
+
+  .profile-menu-icon {
+    display: flex;
+    align-items: center;
+  }
+
+  &.profile-menu-user-info{
+    flex: 1;
+  }
+}
+
+
+.profile-menu-user-info {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  min-width: 0;
+  padding: 0;
+
+  &-item {
+    display: flex;
+    align-items: center;
+    gap: 12px;
+    width: 100%;
+    flex-wrap: nowrap;
+  }
+
+  &-name {
+    color: var(--Gray-700, #344054);
+    font-family: Inter;
+    font-size: 14px;
+    font-weight: 600;
+    line-height: 20px;
+    margin: 0;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+  }
+
+  &-email {
+    color: var(--Gray-600, #475467);
+    font-family: Inter;
+    font-size: 14px;
+    font-weight: 400;
+    line-height: 20px;
+    margin: 0;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+  }
+}
+
+.profile-menu-dropdown {
+  .ant-dropdown-menu {
+    min-width: fit-content;
+    max-width: 250px;
+    padding: 8px;
+    border-radius: 8px;
+    border: 1px solid var(--Gray-100, #f2f4f7);
+    background: var(--Base-White, #fff);
+    box-shadow: 0px 4px 6px -2px rgba(16, 24, 40, 0.03),
+      0px 12px 16px -4px rgba(16, 24, 40, 0.08);
+
+    .ant-dropdown-menu-item {
+      padding: 8px 12px;
+      border-radius: 6px;
+      min-height: 40px;
+      display: flex;
+      align-items: center;
+
+      &:hover {
+        background: var(--Gray-50, #f9fafb);
+      }
+
+      &:active {
+        background: var(--Gray-100, #f2f4f7);
+      }
+
+      .profile-menu-user-info-item {
+        display: flex;
+        align-items: center;
+        gap: 12px;
+        width: 100%;
+        flex-wrap: nowrap;
+        overflow: hidden;
+
+        .profile-menu-user-info {
+          flex: 1;
+          min-width: 0;
+          overflow: hidden;
+
+          &-name,
+          &-email {
+            width: 100%;
+            padding-right: 8px;
+            margin: 0;
+            white-space: nowrap;
+            overflow: hidden;
+            text-overflow: ellipsis;
+          }
+        }
+      }
+    }
+
+    .ant-dropdown-menu-item-divider {
+      margin: 8px 0;
+      background-color: var(--Gray-100, #f2f4f7);
+    }
+  }
+}

package/lib/components/qrcode/index.d.ts

@@ -1,3 +1,3 @@
-import React from "react";
-declare const QRCode: (props: any) => React.JSX.Element;
+/// <reference types="react" />
+declare const QRCode: (props: any) => JSX.Element;
 export default QRCode;

package/lib/components/radio/index.d.ts

@@ -1,3 +1,3 @@
 /// <reference types="react" />
-declare const Radio: (props: any) => import("react").JSX.Element;
+declare const Radio: (props: any) => JSX.Element;
 export default Radio;

package/lib/components/radio/index.js

@@ -38,11 +38,11 @@ var Group = (props) => {
       return /* @__PURE__ */ React.createElement(
         RadioCpt,
         {
-          key: option.value,
-          value: option.value,
-          disabled: option.disabled
+          key: option == null ? void 0 : option.value,
+          value: option == null ? void 0 : option.value,
+          disabled: option == null ? void 0 : option.disabled
         },
-        option.label
+        option == null ? void 0 : option.label
       );
     });
   }, [options]);

package/lib/components/record-view/index.d.ts

@@ -1,7 +1,8 @@
-import React from "react";
-import "./index.less";
+import React from 'react';
+import './index.less';
 export interface RecordViewProps {
     dataSource: any[];
+    doubleList: boolean;
     header?: React.ReactNode;
     footer?: React.ReactNode;
     renderItem?: (item: any) => React.ReactNode;
@@ -15,15 +16,22 @@ export interface RecordViewProps {
     pagination?: object;
     style?: React.CSSProperties;
     onRowClick: (item: any) => void;
-    paginationType?: "default" | "scroll";
+    paginationType?: 'default' | 'scroll';
     listGap?: number;
     loadMoreData?: () => void;
     listHeight?: number;
     children: any;
+    split?: boolean;
+    doubleListSource?: any[];
     locale?: {
         emptyText: string;
     };
     emptyButtons: any[];
+    isShowClode?: boolean;
+    modalWrapStyle?: React.CSSProperties;
 }
-declare const RecordView: React.FC<RecordViewProps>;
-export default RecordView;
+export interface AppearanceEditRef {
+    closeDetailModal: () => void;
+}
+declare const _default: React.ForwardRefExoticComponent<RecordViewProps & React.RefAttributes<AppearanceEditRef>>;
+export default _default;

package/lib/components/record-view/index.js

@@ -38,10 +38,11 @@ var import_utils = require("@pisell/utils");
 var import_Pagination = __toESM(require("../Pagination"));
 var import_icons = require("@ant-design/icons");
 var import_react_infinite_scroll_component = __toESM(require("react-infinite-scroll-component"));
+var import_pisellEmpty = __toESM(require("./../pisellEmpty"));
 var import_hooks = require("../../hooks");
 var import_index = require("./index.less");
 var prefix = "pisell-lowcode-";
-var RecordView = (props) => {
+var RecordView = (props, ref) => {
   const {
     detail,
     leftSpan,
@@ -63,10 +64,26 @@ var RecordView = (props) => {
     children,
     locale,
     emptyButtons = [],
+    doubleList = false,
+    dataSource = [],
+    split,
+    isShowClode = true,
+    doubleListSource = [],
+    //双重列表数据源
+    modalWrapStyle = {},
+    //弹窗详情样式
     ...others
   } = props;
+  (0, import_react.useEffect)(() => {
+    document.body.id = "body";
+  }, []);
   const responsive = (0, import_hooks.useResponsive)();
   const [detailModalShow, setDetailModalShow] = (0, import_react.useState)(false);
+  (0, import_react.useImperativeHandle)(ref, () => ({
+    closeDetailModal: () => {
+      setDetailModalShow(false);
+    }
+  }));
   const detailModalDisplay = (0, import_react.useMemo)(() => {
     if (responsive === "pc") {
       return pcDetailModalDisplay;
@@ -110,30 +127,30 @@ var RecordView = (props) => {
     return leftSpan;
   }, [leftSpan, detailModalDisplay]);
   const emptyDom = (0, import_react.useMemo)(() => {
-    if (props.dataSource.length > 0) {
+    if (dataSource.length > 0) {
       return null;
     }
     return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement(
-      import_antd.Empty,
+      import_pisellEmpty.default,
       {
-        description: locale == null ? void 0 : locale.emptyText,
-        image: import_antd.Empty.PRESENTED_IMAGE_SIMPLE
+        description: locale == null ? void 0 : locale.emptyText
       }
-    ), !!emptyButtons.length && /* @__PURE__ */ import_react.default.createElement("div", { className: `${prefix}empty-button` }, /* @__PURE__ */ import_react.default.createElement(import_antd.Space, null, emptyButtons.map((item) => /* @__PURE__ */ import_react.default.createElement(import_antd.Button, { ...item })))));
+    ));
   }, [props.dataSource, locale, emptyButtons]);
   const scrollListId = (0, import_react.useMemo)(() => {
     return `scrollableDiv-${(0, import_utils.getUniqueId)()}`;
   }, []);
   const list = (0, import_react.useMemo)(() => {
     if (paginationType === "scroll") {
-      return /* @__PURE__ */ import_react.default.createElement("div", null, header && /* @__PURE__ */ import_react.default.createElement("div", { className: `${prefix}scroll-header-wrap` }, header), /* @__PURE__ */ import_react.default.createElement(
+      return /* @__PURE__ */ import_react.default.createElement("div", { className: `${prefix}scroll-left-wrap` }, header && /* @__PURE__ */ import_react.default.createElement("div", { className: `${prefix}scroll-header-wrap` }, header), /* @__PURE__ */ import_react.default.createElement(
         "div",
         {
           id: scrollListId,
           style: {
             height: listHeight || 400,
             overflow: "auto"
-          }
+          },
+          className: `${prefix}scroll-content-wrap`
         },
         /* @__PURE__ */ import_react.default.createElement(
           import_react_infinite_scroll_component.default,
@@ -152,14 +169,49 @@ var RecordView = (props) => {
             ),
             scrollableTarget: scrollListId
           },
-          /* @__PURE__ */ import_react.default.createElement(import_antd.List, { ...others, renderItem: _renderItem }, emptyDom)
+          /* @__PURE__ */ import_react.default.createElement(
+            import_antd.List,
+            {
+              ...others,
+              dataSource,
+              renderItem: _renderItem
+            },
+            emptyDom
+          )
         )
       ), _footer && /* @__PURE__ */ import_react.default.createElement("div", { className: `${prefix}scroll-footer-wrap` }, _footer));
     }
+    if (doubleList && doubleListSource.length > 0) {
+      return /* @__PURE__ */ import_react.default.createElement("div", { className: `${prefix}record-view-double-list` }, doubleListSource.map((item) => {
+        const { dataSource: dataSource2 = [], title } = item;
+        return /* @__PURE__ */ import_react.default.createElement("div", { className: `${prefix}record-view-double-list-item` }, /* @__PURE__ */ import_react.default.createElement("div", { className: `${prefix}record-view-double-list-item-title` }, title, !!dataSource2.length && /* @__PURE__ */ import_react.default.createElement(
+          import_antd.Badge,
+          {
+            color: "var(--gray-50, #F9FAFB)",
+            style: {
+              marginLeft: 12,
+              border: "1px solid var(--gray-200, #EAECF0)",
+              color: "var(--gray-700, #344054)"
+            },
+            count: dataSource2.length
+          }
+        )), /* @__PURE__ */ import_react.default.createElement(
+          import_antd.List,
+          {
+            ...others,
+            dataSource: dataSource2,
+            renderItem: _renderItem,
+            footer: _footer
+          },
+          emptyDom
+        ));
+      }));
+    }
     return /* @__PURE__ */ import_react.default.createElement(
       import_antd.List,
       {
         ...others,
+        dataSource,
         renderItem: _renderItem,
         header,
         footer: _footer
@@ -167,7 +219,7 @@ var RecordView = (props) => {
       emptyDom
     );
   }, [props, _renderItem, _footer]);
-  return /* @__PURE__ */ import_react.default.createElement(import_antd.Row, { gutter, style, className: `${prefix}record-view` }, /* @__PURE__ */ import_react.default.createElement(import_antd.Col, { span: _leftSpan }, list), !detailModalDisplay && /* @__PURE__ */ import_react.default.createElement(import_antd.Col, { span: rightSpan }, detail), detailModalShow && detailModalDisplay && /* @__PURE__ */ import_react.default.createElement("div", { className: `${prefix}detail-modal-wrap` }, /* @__PURE__ */ import_react.default.createElement("div", { className: `${prefix}modal-header` }, /* @__PURE__ */ import_react.default.createElement(
+  return /* @__PURE__ */ import_react.default.createElement(import_antd.Row, { gutter, style, className: `${prefix}record-view` }, /* @__PURE__ */ import_react.default.createElement(import_antd.Col, { span: _leftSpan, className: `${prefix}record-view-left` }, list), !detailModalDisplay && /* @__PURE__ */ import_react.default.createElement(import_antd.Col, { span: rightSpan }, detail), detailModalShow && detailModalDisplay && /* @__PURE__ */ import_react.default.createElement("div", { className: `${prefix}detail-modal-wrap`, style: modalWrapStyle }, isShowClode && /* @__PURE__ */ import_react.default.createElement("div", { className: `${prefix}modal-header` }, /* @__PURE__ */ import_react.default.createElement(
     import_icons.CloseOutlined,
     {
       className: `${prefix}close-icon`,
@@ -175,4 +227,4 @@ var RecordView = (props) => {
     }
   )), detail));
 };
-var record_view_default = RecordView;
+var record_view_default = (0, import_react.forwardRef)(RecordView);

package/lib/components/record-view/index.less

@@ -1,7 +1,5 @@
 @pisell-prefix: pisell-lowcode;
 
-
-
 .@{pisell-prefix} {
   &-record-view {
     .pisell-lowcode-pagination {
@@ -12,6 +10,25 @@
       border: none;
     }
   }
+
+  &-list-title {
+    color: #000;
+
+    /* Text md/Semibold */
+    font-family: Inter;
+    font-size: 16px;
+    font-style: normal;
+    font-weight: 600;
+    line-height: 24px; /* 150% */
+    margin: 0;
+  }
+  &-list-tag {
+    border-radius: 16px;
+    border: 1px solid var(--Gray-200, #eaecf0);
+    background: var(--Gray-50, #f9fafb);
+    mix-blend-mode: multiply;
+  }
+
   &-empty-button {
     display: flex;
     justify-content: center;
@@ -45,4 +62,22 @@
   &-scroll-skeleton {
     padding: 12px 24px;
   }
+
+  &-record-view-double-list {
+  }
+  &-record-view-double-list-item {
+  }
+  &-record-view-double-list-item-title {
+    display: flex;
+    align-items: center;
+    margin-bottom: 16px;
+    color: #000;
+
+    /* Text md/Semibold */
+    font-family: Inter;
+    font-size: 16px;
+    font-style: normal;
+    font-weight: 600;
+    line-height: 24px; /* 150% */
+  }
 }

package/lib/components/section-footers/index.d.ts

@@ -5,5 +5,5 @@ interface SectionFooterProps {
     right?: React.ReactNode;
     className?: string;
 }
-declare const SectionFooters: (props: SectionFooterProps) => import("react").JSX.Element;
+declare const SectionFooters: (props: SectionFooterProps) => JSX.Element;
 export default SectionFooters;

package/lib/components/segmented/index.d.ts

@@ -1,5 +1,5 @@
-import React from "react";
+/// <reference types="react" />
 import { SegmentedProps } from "antd";
 import "./index.less";
-declare const Segmented: (props: SegmentedProps) => React.JSX.Element;
+declare const Segmented: (props: SegmentedProps) => JSX.Element;
 export default Segmented;

package/lib/components/select/index.d.ts

@@ -1,4 +1,9 @@
-/// <reference types="react" />
-import "./index.less";
-declare const Select: import("react").ForwardRefExoticComponent<Omit<any, "ref"> & import("react").RefAttributes<unknown>>;
+import React from 'react';
+import { Select as OriginalSelect } from 'antd';
+import type { SelectProps } from 'antd';
+import './index.less';
+interface CompoundedComponent extends React.ForwardRefExoticComponent<SelectProps> {
+    Option: typeof OriginalSelect.Option;
+}
+declare const Select: CompoundedComponent;
 export default Select;

package/lib/components/select/index.js

@@ -1,6 +1,8 @@
+var __create = Object.create;
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
 var __export = (target, all) => {
   for (var name in all)
@@ -14,6 +16,14 @@ var __copyProps = (to, from, except, desc) => {
   }
   return to;
 };
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 
 // src/components/select/index.tsx
@@ -22,10 +32,15 @@ __export(select_exports, {
   default: () => select_default
 });
 module.exports = __toCommonJS(select_exports);
+var import_react = __toESM(require("react"));
 var import_antd = require("antd");
-var import_react = require("react");
-var import_locales = require("../../locales");
 var import_ahooks = require("ahooks");
+var import_classnames = __toESM(require("classnames"));
+var import_iconfont = __toESM(require("../iconfont"));
+var import_locales = require("../../locales");
+var import_hoc = require("../../utils/hoc");
+var import_browserSelect = __toESM(require("../browserSelect"));
+var import_usePisellConfig = __toESM(require("../pisell-config-provider/hooks/usePisellConfig"));
 var import_index = require("./index.less");
 var prefix = "pisell-lowcode-";
 var SelectBase = (0, import_react.forwardRef)((props, ref) => {
@@ -34,40 +49,86 @@ var SelectBase = (0, import_react.forwardRef)((props, ref) => {
     selectAll,
     mode,
     options,
-    dropdownRender: propsDropdownRender
+    dropdownRender: propsDropdownRender,
+    showSearch,
+    styleType,
+    optionFilterProp = "value",
+    popupClassName,
+    onDropdownVisibleChange
   } = props;
+  const { platform } = (0, import_usePisellConfig.default)();
+  const searchInputRef = (0, import_react.useRef)(null);
   const [state, setState] = (0, import_ahooks.useControllableValue)(props);
+  const [searchValue, setSearchValue] = (0, import_react.useState)("");
+  const filteredOptions = (0, import_react.useMemo)(() => {
+    if (!searchValue)
+      return options;
+    return (options || []).filter(
+      (option) => {
+        var _a;
+        const optionValue = ((_a = option[optionFilterProp]) == null ? void 0 : _a.toString().toLowerCase()) || "";
+        return optionValue.includes(searchValue.toLowerCase());
+      }
+    );
+  }, [options, searchValue, optionFilterProp]);
   const onSelectAllChange = (0, import_ahooks.useMemoizedFn)((e) => {
     if (e.target.checked) {
       setState(
-        options.map((item) => item.value),
-        options
+        filteredOptions.map((item) => item.value),
+        filteredOptions
       );
     } else {
       setState([], []);
     }
   });
+  const handleDropdownVisibleChange = (0, import_ahooks.useMemoizedFn)((visible) => {
+    if (!visible) {
+      setSearchValue("");
+    } else {
+      if (platform === "pc") {
+        setTimeout(() => {
+          var _a;
+          (_a = searchInputRef.current) == null ? void 0 : _a.focus();
+        }, 200);
+      }
+    }
+    onDropdownVisibleChange == null ? void 0 : onDropdownVisibleChange(visible);
+  });
   const isShowSelectAll = (0, import_react.useMemo)(() => {
     return mode === "multiple" && isShowDropdown && selectAll;
   }, [mode, selectAll, isShowDropdown]);
   const checkboxChecked = (0, import_react.useMemo)(() => {
+    var _a, _b, _c;
     if (mode !== "multiple")
       return false;
-    return (state == null ? void 0 : state.length) === (options == null ? void 0 : options.length) && state.sort().join("") === options.map((item) => item.value).sort().join("");
-  }, [state, options]);
+    return (state == null ? void 0 : state.length) === (filteredOptions == null ? void 0 : filteredOptions.length) && ((_a = state == null ? void 0 : state.sort()) == null ? void 0 : _a.join("")) === ((_c = (_b = filteredOptions == null ? void 0 : filteredOptions.map((item) => item.value)) == null ? void 0 : _b.sort()) == null ? void 0 : _c.join(""));
+  }, [state, filteredOptions]);
   const dropdownRender = (0, import_react.useCallback)(
     propsDropdownRender ? propsDropdownRender : (originNode) => {
-      return /* @__PURE__ */ React.createElement(React.Fragment, null, originNode, isShowDropdown && /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
+      return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, showSearch && /* @__PURE__ */ import_react.default.createElement(
+        import_antd.Input,
+        {
+          ref: searchInputRef,
+          className: "pisell-select-search-input",
+          size: "middle",
+          placeholder: (0, import_locales.getText)("select-dropdown-render-search"),
+          value: searchValue,
+          onChange: (e) => setSearchValue(e.target.value),
+          bordered: false,
+          allowClear: true,
+          prefix: /* @__PURE__ */ import_react.default.createElement(import_iconfont.default, { style: { color: "#98A2B3" }, type: "pisell2-search-lg" })
+        }
+      ), originNode, isShowDropdown && /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement(
         import_antd.Divider,
         {
           className: `${prefix}select-dropdown-render-divider`
         }
-      ), /* @__PURE__ */ React.createElement(
+      ), /* @__PURE__ */ import_react.default.createElement(
         "div",
         {
           className: `${prefix}select-dropdown-render-options-wrap`
         },
-        isShowSelectAll && /* @__PURE__ */ React.createElement(
+        isShowSelectAll && /* @__PURE__ */ import_react.default.createElement(
           import_antd.Checkbox,
           {
             onChange: onSelectAllChange,
@@ -77,18 +138,34 @@ var SelectBase = (0, import_react.forwardRef)((props, ref) => {
         )
       )));
     },
-    [isShowDropdown, isShowSelectAll, checkboxChecked, propsDropdownRender]
+    [
+      isShowDropdown,
+      isShowSelectAll,
+      checkboxChecked,
+      propsDropdownRender,
+      searchValue,
+      showSearch
+    ]
   );
-  return /* @__PURE__ */ React.createElement(
+  if (styleType === "system") {
+    return /* @__PURE__ */ import_react.default.createElement(import_browserSelect.default, { ...props });
+  }
+  return /* @__PURE__ */ import_react.default.createElement(
     import_antd.Select,
     {
       ...props,
+      defaultActiveFirstOption: false,
+      onDropdownVisibleChange: handleDropdownVisibleChange,
+      showSearch: false,
       ref,
       value: state,
       onChange: (value, option) => setState(value, option),
-      dropdownRender
+      dropdownRender,
+      options: filteredOptions,
+      popupClassName: (0, import_classnames.default)("pisell-base-select-dropdown", popupClassName)
     }
   );
 });
-var Select = SelectBase;
+var Select = (0, import_hoc.withWrap)(SelectBase);
+Select.Option = import_antd.Select.Option;
 var select_default = Select;

package/lib/components/select/index.less

@@ -9,3 +9,22 @@
     padding: 0 5px 5px;
   }
 }
+
+// 添加选项间距
+.pisell-base-select-dropdown {
+  .pisell-lowcode-select-item {
+    margin-bottom: 4px;
+    
+    &:last-child {
+      margin-bottom: 0;
+    }
+  }
+}
+
+.pisell-select-search-input {
+  width: 100%;
+  margin-bottom: 4px;
+
+  box-shadow: none !important;
+  border-color: transparent !important;
+}

package/lib/components/select-time/RightPanel/index.d.ts

@@ -1,9 +1,9 @@
-import React from 'react';
+/// <reference types="react" />
 import './index.less';
 interface RightPanelProps {
     value: string;
     onChange: (value: string) => void;
     slice: number;
 }
-declare const RightPanel: (props: RightPanelProps) => React.JSX.Element;
+declare const RightPanel: (props: RightPanelProps) => JSX.Element;
 export default RightPanel;

package/lib/components/select-time/index.d.ts

@@ -1,4 +1,4 @@
-import React from "react";
+/// <reference types="react" />
 import { VirtualKeyboardTimeProps } from "../virtual-keyboard/Time";
 import { PopoverProps, TimePickerProps } from "antd";
 import "./index.less";
@@ -10,5 +10,5 @@ interface SelectTimeProps {
     timeProps: VirtualKeyboardTimeProps;
     slice: number;
 }
-declare const SelectTime: (props: SelectTimeProps) => React.JSX.Element;
+declare const SelectTime: (props: SelectTimeProps) => JSX.Element;
 export default SelectTime;

package/lib/components/skeleton/index.d.ts

@@ -1,3 +1,3 @@
 /// <reference types="react" />
-declare const Skeleton: (props: any) => import("react").JSX.Element;
+declare const Skeleton: (props: any) => JSX.Element;
 export default Skeleton;

package/lib/components/slider/index.d.ts

@@ -1,3 +1,3 @@
-import React from 'react';
-declare const SliderOuter: (props: any) => React.JSX.Element;
+/// <reference types="react" />
+declare const SliderOuter: (props: any) => JSX.Element;
 export default SliderOuter;