@titaui/pc 1.9.48 → 1.9.49

package/src/components/drawer-manager/index.tsx

@@ -3,31 +3,38 @@ import ReactDom from "react-dom";
 import DrawerManagerContext from "./context";
 import DrawerWrapper from "./drawerWrapper";
 import { hasAncestorElement } from "./utils/dom";
+
 const typeMap: any = {};
 interface IDrawerProps {}
 
 class DrawerManager {
   constructor({}: IDrawerProps = {}) {}
+
   private _drawer;
+
   el;
+
   timer;
+
   history: any[] = [];
+
   uid = 0;
+
   open = (type, props = {}, drawerProps = {}) => {
     if (!type) throw "need provide drawer type";
     const Component = typeMap[type];
     if (!Component) throw "the type is not regisited";
-    window.titaTracker &&
-      window.titaTracker("action").record({
+    window.titaTracker
+      && window.titaTracker("action").record({
         actionName: type,
         actionGroup: "打开推屏",
-        productName: 'OKR',
+        productName: "OKR",
       });
     return new Promise((resolve) => {
       clearTimeout(this.timer);
 
       this.timer = setTimeout(() => {
-        let uid = this.uid;
+        const { uid } = this;
         this.uid++;
         let extendedDrawerProps = drawerProps;
         if (this.history.length > 0) {
@@ -45,7 +52,7 @@ class DrawerManager {
         });
         this.drawer.open(
           <Component key={uid} {...props} />,
-          extendedDrawerProps
+          extendedDrawerProps,
         );
         if (this.history.length == 1) {
           document.addEventListener("mousedown", this.autoClose);
@@ -58,8 +65,9 @@ class DrawerManager {
     if (this.history.length > 1) {
       const current = this.history.pop();
       current.resolve();
-      const { Component, props, extendedDrawerProps, key } =
-        this.history[this.history.length - 1];
+      const {
+        Component, props, extendedDrawerProps, key,
+      } = this.history[this.history.length - 1];
       this.drawer.open(<Component key={key} {...props} />, extendedDrawerProps);
     } else {
       this.close();
@@ -80,10 +88,9 @@ class DrawerManager {
     if (
       hasAncestorElement(
         e.target,
-        "document-mouse-event-ignore,rc-tooltip,titaui-popup,rc-dialog-root,common-modal,in-modal,task-hot-add"
+        "document-mouse-event-ignore,rc-tooltip,titaui-popup,rc-dialog-root,common-modal,in-modal,task-hot-add",
       )
-    )
-      return;
+    ) return;
     this.close();
     document.removeEventListener("mousedown", this.autoClose);
   };
@@ -91,6 +98,7 @@ class DrawerManager {
   regist(type, component) {
     typeMap[type] = component;
   }
+
   private get drawer() {
     if (this._drawer) return this._drawer;
     ReactDom.render(
@@ -110,7 +118,7 @@ class DrawerManager {
           getContainer={() => this.el}
         />
       </DrawerManagerContext.Provider>,
-      this.getEl()
+      this.getEl(),
     );
     return this._drawer;
   }

package/src/components/drawer-manager/utils/dom.ts

@@ -1,18 +1,18 @@
-export function hasAncestorElement(node,className){
-  if(!node) return false
-  if(is(node,className)) return true;
-  return hasAncestorElement(node.parentNode,className);
+export function hasAncestorElement(node, className) {
+  if (!node) return false;
+  if (is(node, className)) return true;
+  return hasAncestorElement(node.parentNode, className);
 }
 
-export function is(node,className){
-  if(!className || !node) return false;
+export function is(node, className) {
+  if (!className || !node) return false;
   const classNameMap = {};
-  className.split(',').forEach(clss => classNameMap[clss] = true);
-  if(!node.className || typeof node.className != 'string') return false;
-  for(let clss of node.className.split(/\s+/)){
-    if(classNameMap[clss]){
-      return true
+  className.split(",").forEach((clss) => classNameMap[clss] = true);
+  if (!node.className || typeof node.className !== "string") return false;
+  for (const clss of node.className.split(/\s+/)) {
+    if (classNameMap[clss]) {
+      return true;
     }
   }
-  return false
-}
+  return false;
+}

package/src/components/drawer-manager/utils/index.ts

@@ -1,7 +1,7 @@
-export function sleep(time){
-  return new Promise<void>(resolve => {
+export function sleep(time) {
+  return new Promise<void>((resolve) => {
     setTimeout(() => {
-      resolve()
+      resolve();
     }, time);
-  })
-}
+  });
+}

package/src/components/drawer-manager/utils/useForceUpdate.ts

@@ -1,6 +1,6 @@
-import * as React from 'react';
+import * as React from "react";
 
 export default function useForceUpdate() {
-  const [, forceUpdate] = React.useReducer(x => x + 1, 0);
+  const [, forceUpdate] = React.useReducer((x) => x + 1, 0);
   return forceUpdate;
-}
+}

package/src/components/drop-selector/icon-item.js

@@ -1,32 +1,34 @@
-import React from 'react';
-import classNames from 'classnames';
-import './index.scss';
+import React from "react";
+import classNames from "classnames";
+import "./index.scss";
 
-const preCls = 'titaui-drop-selector'
+const preCls = "titaui-drop-selector";
 
-export default props => {
+export default function (props) {
   const {
     name,
     icon,
     children,
-    onClick, 
-    exIconClass
+    onClick,
+    exIconClass,
   } = props;
 
   const onClickHandler = () => {
-    onClick && onClick(name)
-  }
+    onClick && onClick(name);
+  };
 
-  return <div
-    key={name}
-    className={classNames(`${preCls}__icon-item`, {
-      [`${preCls}__icon-item--noicon`]: !icon
-    })}
-    onClick={onClickHandler}
-  >
-    {icon && <span className={classNames(icon, `${preCls}__icon-item-icon`, exIconClass)} />}
-    <span className={classNames(`${preCls}__icon-item-text`)}>
-      {children}
-    </span>
-  </div>
+  return (
+    <div
+      key={name}
+      className={classNames(`${preCls}__icon-item`, {
+        [`${preCls}__icon-item--noicon`]: !icon,
+      })}
+      onClick={onClickHandler}
+    >
+      {icon && <span className={classNames(icon, `${preCls}__icon-item-icon`, exIconClass)} />}
+      <span className={classNames(`${preCls}__icon-item-text`)}>
+        {children}
+      </span>
+    </div>
+  );
 }

package/src/components/drop-selector/index.js

@@ -1,18 +1,18 @@
-import React, { useState, useEffect, useRef } from 'react';
-import Popup from '../popup';
-import classNames from 'classnames';
-import Checkbox from '../checkbox';
-import Radio from '../radio';
+import React, { useState, useEffect, useRef } from "react";
+import classNames from "classnames";
+import Popup from "../popup";
+import Checkbox from "../checkbox";
+import Radio from "../radio";
 
-import './index.scss';
+import "./index.scss";
 
-import _IconItem from './icon-item';
+import _IconItem from "./icon-item";
 
-const preCls = 'titaui-drop-selector'
+const preCls = "titaui-drop-selector";
 
 export const IconItem = _IconItem;
 
-export const Item = props => {
+export function Item(props) {
   const {
     name,
     multi,
@@ -25,66 +25,68 @@ export const Item = props => {
   const [checked, setChecked] = useState(props.checked);
   useEffect(() => {
     setChecked(props.checked);
-  }, [props.checked])
+  }, [props.checked]);
 
   const onClickHandler = () => {
     if (multi) setChecked(!checked);
-    onClick && onClick(name, !checked)
-  }
-
-  return <div
-    key={name}
-    className={classNames(`${preCls}__operation-item`,className)}
-    onClick={onClickHandler}
-    {...restProps}
-  >
-    {multi && <Checkbox checked={checked} />}
-    <span className={classNames(`${preCls}__operation-item-text`)}>
-      {children}
-    </span>
-  </div>
+    onClick && onClick(name, !checked);
+  };
+
+  return (
+    <div
+      key={name}
+      className={classNames(`${preCls}__operation-item`, className)}
+      onClick={onClickHandler}
+      {...restProps}
+    >
+      {multi && <Checkbox checked={checked} />}
+      <span className={classNames(`${preCls}__operation-item-text`)}>
+        {children}
+      </span>
+    </div>
+  );
 }
 
-export const DropSelectorLayer = props => {
+export function DropSelectorLayer(props) {
   const {
-    className = '',
+    className = "",
     multi = false,
     onItemClick,
     checked = [],
     trigger,
     children,
     limitHeight = false,
-    footerBtn=null //多选想要个按钮
+    footerBtn = null, // 多选想要个按钮
   } = props;
 
   const onMenuClickHandler = (name, checked) => {
     onItemClick && onItemClick(name, checked);
-  }
-
-  return <div
-    className={classNames(`${preCls}__operation`, {
-      [`${preCls}--multi`]: multi,
-      [`${preCls}__operation--limit-height`]: limitHeight,
-    },`${className}`)}
-    onClick={e => e.stopPropagation()}
-  >
-    {React.Children.map(children, child => {
-      return React.cloneElement(child, {
-        'checked': checked.indexOf(child.props.name) != -1,
-        'onClick': onMenuClickHandler,
-        'multi': multi,
-        ...child.props
-      })
-    })}
-    {footerBtn}
-  </div>
-}    
-const DropSelector = props => {
+  };
+
+  return (
+    <div
+      className={classNames(`${preCls}__operation`, {
+        [`${preCls}--multi`]: multi,
+        [`${preCls}__operation--limit-height`]: limitHeight,
+      }, `${className}`)}
+      onClick={(e) => e.stopPropagation()}
+    >
+      {React.Children.map(children, (child) => React.cloneElement(child, {
+        checked: checked.indexOf(child.props.name) != -1,
+        onClick: onMenuClickHandler,
+        multi,
+        ...child.props,
+      }))}
+      {footerBtn}
+    </div>
+  );
+}
+function DropSelector(props) {
   const {
-    trigger,     // 自定义Icon组件
+    trigger, // 自定义Icon组件
     triggerIcon, // 标准Icon类型
     destroyPopupOnHide = true,
-    popupPlacement = 'bottom',
+    popupPlacement = "bottom",
     hideOnChange = true,
     onChange,
     canEdit = true,
@@ -102,21 +104,24 @@ const DropSelector = props => {
     if (hideOnChange) {
       setVisible(false);
     }
-  }
-
-  return <Popup
-    popupVisible={canEdit && visible}
-    popupPlacement={popupPlacement}
-    onPopupVisibleChange={visible => setVisible(visible)}
-    destroyPopupOnHide={destroyPopupOnHide}
-    popup={
-      <DropSelectorLayer {...restProps} onItemClick={onMenuClickHandler} />
-    }>
+  };
+
+  return (
+    <Popup
+      popupVisible={canEdit && visible}
+      popupPlacement={popupPlacement}
+      onPopupVisibleChange={(visible) => setVisible(visible)}
+      destroyPopupOnHide={destroyPopupOnHide}
+      popup={
+        <DropSelectorLayer {...restProps} onItemClick={onMenuClickHandler} />
+    }
+    >
       {trigger}
     </Popup>
+  );
 }
 
-DropSelector.IconItem = IconItem
-DropSelector.Item = Item
+DropSelector.IconItem = IconItem;
+DropSelector.Item = Item;
 
-export default DropSelector
+export default DropSelector;

package/src/components/drop-selector/index.scss

@@ -18,12 +18,12 @@
 }
 
 .titaui-drop-selector {
-  &__radio{
+  &__radio {
     margin-right: 0px;
-    .titaui-radio-inner{
-      color: #2879FF;
-      &::after{
-        color: #2879FF;
+    .titaui-radio-inner {
+      color: #2879ff;
+      &::after {
+        color: #2879ff;
       }
     }
   }

package/src/components/dynamic/advertise/components/next-btn/index.tsx

@@ -7,17 +7,15 @@ const prefix = "titaui-dynamic-advertise-next-btn";
 const NextBtn: FC<{ onClick?: any; isShow: boolean }> = ({
   onClick,
   isShow,
-}) => {
-  return (
-    <div
-      className={classNames(prefix, {
-        [`${prefix}--hidden`]: !isShow,
-      })}
-      onClick={onClick}
-    >
-      <i className={classNames("tu-icon-left", `${prefix}__icon`)} />
-    </div>
-  );
-};
+}) => (
+  <div
+    className={classNames(prefix, {
+      [`${prefix}--hidden`]: !isShow,
+    })}
+    onClick={onClick}
+  >
+    <i className={classNames("tu-icon-left", `${prefix}__icon`)} />
+  </div>
+);
 
 export default NextBtn;

package/src/components/dynamic/advertise/components/pre-btn/index.tsx

@@ -7,17 +7,15 @@ const prefix = "titaui-dynamic-advertise-pre-btn";
 const PreBtn: FC<{ onClick?: any; isShow: boolean }> = ({
   onClick,
   isShow,
-}) => {
-  return (
-    <div
-      className={classNames(prefix, {
-        [`${prefix}--hidden`]: !isShow,
-      })}
-      onClick={onClick}
-    >
-      <i className={classNames("tu-icon-left", `${prefix}__icon`)} />
-    </div>
-  );
-};
+}) => (
+  <div
+    className={classNames(prefix, {
+      [`${prefix}--hidden`]: !isShow,
+    })}
+    onClick={onClick}
+  >
+    <i className={classNames("tu-icon-left", `${prefix}__icon`)} />
+  </div>
+);
 
 export default PreBtn;

package/src/components/dynamic/advertise/index.tsx

@@ -1,5 +1,6 @@
 import React, { FC, useEffect, useState } from "react";
 import Slider from "react-slick";
+import classNames from "classnames";
 import { getAdvertise } from "../request-api";
 import Toast from "../../toast";
 import { formatResp } from "./util";
@@ -11,7 +12,6 @@ import "slick-carousel/slick/slick-theme.css";
 
 import "./index.scss";
 import { IAdvertiseType } from "./interface";
-import classNames from "classnames";
 
 const prefix = "tutaui-dynamic-advertise";
 
@@ -66,21 +66,19 @@ const DynamicAdvertise: FC = () => {
           nextArrow={<NextBtn isShow={isMouseEnter} />}
           prevArrow={<PreBtn isShow={isMouseEnter} />}
         >
-          {sliderData.map((item) => {
-            return (
-              <div
-                onClick={() => {
-                  handleImgClick(item.link);
-                }}
-              >
-                <img
-                  className={`${prefix}__img`}
-                  src={item.img}
-                  alt={item.name}
-                />
-              </div>
-            );
-          })}
+          {sliderData.map((item) => (
+            <div
+              onClick={() => {
+                handleImgClick(item.link);
+              }}
+            >
+              <img
+                className={`${prefix}__img`}
+                src={item.img}
+                alt={item.name}
+              />
+            </div>
+          ))}
         </Slider>
       )}
     </div>

package/src/components/dynamic/components/dangerous-html/index.tsx

@@ -1,10 +1,7 @@
-import React, { FC } from 'react';
+import React, { FC } from "react";
 
-const DangerousHtml: FC<{htmlText: string}> = ({htmlText}) => {
-  return (
-    <span dangerouslySetInnerHTML={{__html: htmlText}}>
-    </span>
-  )
-}
+const DangerousHtml: FC<{htmlText: string}> = ({ htmlText }) => (
+  <span dangerouslySetInnerHTML={{ __html: htmlText }} />
+);
 
-export default DangerousHtml;
+export default DangerousHtml;

package/src/components/dynamic/components/dynamic-search-input/index.tsx

@@ -9,8 +9,8 @@ import "./index.scss";
 const prefix = "titaui-dynamic-search-input";
 
 const SearchType = {
-  dynamic: getLocale('Menu_Title_Feed'),
-  person: getLocale('Mod_UserName'),
+  dynamic: getLocale("Menu_Title_Feed"),
+  person: getLocale("Mod_UserName"),
 };
 
 const DynamicSearchInput: FC<IDynamicSearchInputProps> = ({
@@ -35,7 +35,7 @@ const DynamicSearchInput: FC<IDynamicSearchInputProps> = ({
 
   const handleKeyUp = (e) => {
     // 按回车
-    if (e.keyCode === 13 && searchDynamicType !== 'person') {
+    if (e.keyCode === 13 && searchDynamicType !== "person") {
       setSearchKey(searchInputValue);
       setSearchKeyType(searchDynamicType);
     }
@@ -43,7 +43,7 @@ const DynamicSearchInput: FC<IDynamicSearchInputProps> = ({
 
   const handleChangeSearchDynamicType = (type) => {
     setSearchDynamicType(type);
-    setSearchKeyType
+    setSearchKeyType;
     // @ts-ignore
     popupRef.current && popupRef.current.close();
   };
@@ -63,38 +63,38 @@ const DynamicSearchInput: FC<IDynamicSearchInputProps> = ({
   };
 
   const handleClearSearchValue = () => {
-    setSearchInputValue('');
-    setSearchKey('');
+    setSearchInputValue("");
+    setSearchKey("");
     setSearchUser(null);
     setSearchKeyType(searchDynamicType);
-  }
+  };
 
-  const PopupContent = () => {
+  function PopupContent() {
     return (
-      <div className={prefix + "__popup"}>
+      <div className={`${prefix}__popup`}>
         <div
-          className={classNames(prefix + "__popup-item", {
-            [prefix + "__popup-item--active"]: searchDynamicType === "dynamic",
+          className={classNames(`${prefix}__popup-item`, {
+            [`${prefix}__popup-item--active`]: searchDynamicType === "dynamic",
           })}
           onClick={() => {
             handleChangeSearchDynamicType("dynamic");
           }}
         >
-          {getLocale('Menu_Title_Feed')}
+          {getLocale("Menu_Title_Feed")}
         </div>
         <div
-          className={classNames(prefix + "__popup-item", {
-            [prefix + "__popup-item--active"]: searchDynamicType === "person",
+          className={classNames(`${prefix}__popup-item`, {
+            [`${prefix}__popup-item--active`]: searchDynamicType === "person",
           })}
           onClick={() => {
             handleChangeSearchDynamicType("person");
           }}
         >
-          {getLocale('Mod_UserName')}
+          {getLocale("Mod_UserName")}
         </div>
       </div>
     );
-  };
+  }
 
   return (
     <div
@@ -105,7 +105,7 @@ const DynamicSearchInput: FC<IDynamicSearchInputProps> = ({
     >
       <Popup
         popup={PopupContent}
-        popupPlacement={"bottom"}
+        popupPlacement="bottom"
         ref={popupRef}
         popupAlign={{
           offset: [-10, 2],
@@ -113,30 +113,31 @@ const DynamicSearchInput: FC<IDynamicSearchInputProps> = ({
           targetOffset: [0, 0],
         }}
       >
-        <span className={prefix + "__select-type"}>
+        <span className={`${prefix}__select-type`}>
           <span>{SearchType[searchDynamicType]}</span>
-          <i className={classNames(`tu-icon-sort-down`, prefix + "__icon")} />
+          <i className={classNames("tu-icon-sort-down", `${prefix}__icon`)} />
         </span>
       </Popup>
       <input
-        className={prefix + "__input"}
+        className={`${prefix}__input`}
         value={searchInputValue}
         onChange={handleInputChange}
         onKeyUp={handleKeyUp}
-        placeholder={searchDynamicType === 'dynamic' ? getLocale('Feed_Search_Searchbykeyword') : getLocale('Mod_SearchbyName')}
+        placeholder={searchDynamicType === "dynamic" ? getLocale("Feed_Search_Searchbykeyword") : getLocale("Mod_SearchbyName")}
       />
       {isMouseEnter && searchInputValue && (
-        <i onClick={handleClearSearchValue} className={classNames("tu-icon-circle", prefix + "__input-clear")} />
+        <i onClick={handleClearSearchValue} className={classNames("tu-icon-circle", `${prefix}__input-clear`)} />
       )}
-      <UserSelector         ref={selectorRef}
+      <UserSelector
+        ref={selectorRef}
         multiple={false}
         position="bottomRight"
         onSelect={handleSelected}
-        disabledDepartSelect={true}
+        disabledDepartSelect
         showSearchInput={false}
         searchedPanes={{ user: true, depart: false, group: false }}
         searchWord={searchInputValue}
-        trigger={<span></span>}
+        trigger={<span />}
         getPopupContainer={() => inputRef.current}
         panes={{ depart: true }}
         popupAlign={{