chore: make sure that the package can be imported normally in ssr (#544)

src/_util/renderToContainer.ts

@@ -1,12 +1,12 @@
 import { createPortal } from 'react-dom';
 import { ReactElement, ReactPortal } from 'react';
 import { resolveContainer } from './getContainer';
-import { canUseDom } from './canUseDom';
+import { canUseDocument } from './dom';
 
 export type GetContainer = HTMLElement | (() => HTMLElement) | null;
 
 export function renderToContainer(getContainer: GetContainer, node: ReactElement) {
-  if (canUseDom && getContainer) {
+  if (canUseDocument && getContainer) {
     const container = resolveContainer(getContainer);
     return createPortal(node, container as Element) as ReactPortal;
   }

src/_util/supportsPassive.ts

@@ -1,9 +1,9 @@
-import { canUseDom } from './canUseDom';
+import { canUseDocument } from './dom';
 
 // eslint-disable-next-line
 export let supportsPassive = false;
 
-if (canUseDom) {
+if (canUseDocument) {
   try {
     const opts = {};
     Object.defineProperty(opts, 'passive', {

src/avatar/Avatar.tsx

@@ -1,8 +1,8 @@
 import type { FC } from 'react';
 import React, { useContext } from 'react';
 import cls from 'classnames';
-import Image from 'tdesign-mobile-react/image';
-import Badge from 'tdesign-mobile-react/badge';
+import Image from '../image';
+import Badge from '../badge';
 import { AvatarGroupContext } from './AvatarGroupContext';
 import { isValidSize } from '../_common/js/avatar/utils';
 import parseTNode from '../_util/parseTNode';

src/hooks/useLayoutEffect.ts

@@ -0,0 +1,6 @@
+import { useLayoutEffect, useEffect } from 'react';
+import { canUseDocument } from '../_util/dom';
+
+const useIsomorphicLayoutEffect = canUseDocument ? useLayoutEffect : useEffect;
+
+export default useIsomorphicLayoutEffect;

src/loading/Loading.tsx

@@ -6,6 +6,7 @@ import { StyledProps } from '../common';
 import Spinner from './icon/Spinner';
 import Gradient from './icon/Gradient';
 import Portal from '../common/Portal';
+import { canUseDocument } from '../_util/dom';
 import { useLockScroll } from '../hooks/useLockScroll';
 import useDefaultProps from '../hooks/useDefaultProps';
 import { usePrefixClass } from '../hooks/useClass';
@@ -43,7 +44,7 @@ const Loading: React.FC<LoadingProps> = (props) => {
   const fullClass = `${loadingClass}--full`;
   const relativeClass = `${loadingClass}__parent`;
 
-  useLockScroll(loadingRef, loading && fullscreen && preventScrollThrough, loadingClass);
+  useLockScroll(loadingRef, canUseDocument && loading && fullscreen && preventScrollThrough, loadingClass);
 
   // 当延时加载delay有值时，值会发生变化
   const [reloading, setReloading] = useState(!delay && loading);

src/sticky/Sticky.tsx

@@ -1,9 +1,10 @@
-import React, { FC, useCallback, useEffect, useLayoutEffect, useRef, useState } from 'react';
+import React, { FC, useCallback, useEffect, useRef, useState } from 'react';
 import useConfig from '../_util/useConfig';
 import { TdStickyProps } from './type';
 import { stickyDefaultProps } from './defaultProps';
 import { resolveContainer } from '../_util/getContainer';
 import useDefaultProps from '../hooks/useDefaultProps';
+import useLayoutEffect from '../hooks/useLayoutEffect';
 
 const Sticky: FC<TdStickyProps> = (originProps) => {
   const props = useDefaultProps(originProps, stickyDefaultProps);

src/swipe-cell/SwipeCell.tsx

@@ -1,4 +1,4 @@
-import React, { forwardRef, useImperativeHandle, useRef, useLayoutEffect, useMemo, useState } from 'react';
+import React, { forwardRef, useImperativeHandle, useRef, useMemo, useState } from 'react';
 import type { ReactNode } from 'react';
 import isArray from 'lodash/isArray';
 import isBoolean from 'lodash/isBoolean';
@@ -12,6 +12,7 @@ import { TdSwipeCellProps, SwipeActionItem, Sure } from './type';
 import { swipeCellDefaultProps } from './defaultProps';
 import { usePrefixClass } from '../hooks/useClass';
 import useDefaultProps from '../hooks/useDefaultProps';
+import useLayoutEffect from '../hooks/useLayoutEffect';
 import { Styles, StyledProps } from '../common';
 
 import './style';