Merge pull request #1215 from DouyinFE/js2css_fix

Js2css motion type fix

packages/semi-foundation/utils/uuid.ts

@@ -5,6 +5,7 @@ export default function getUuid(prefix: string) {
 // https://stackoverflow.com/questions/105034/create-guid-uuid-in-javascript
 function getUuidv4() {
     try {
+        // @ts-ignore
         return crypto?.randomUUID?.() ?? (String(1e7 + -1e3 + -4e3 + -8e3 + -1e11).replace(/[018]/g, c =>
             (Number(c) ^ (crypto.getRandomValues(new Uint8Array(1))[0] & (15 >> (Number(c) / 4)))).toString(16)
         ));

packages/semi-ui/autoComplete/index.tsx

@@ -17,7 +17,6 @@ import Trigger from '../trigger';
 import Option from './option';
 import warning from '@douyinfe/semi-foundation/utils/warning';
 import '@douyinfe/semi-foundation/autoComplete/autoComplete.scss';
-import { Motion } from '../_base/base';
 
 const prefixCls = cssClasses.PREFIX;
 const sizeSet = strings.SIZE;
@@ -63,7 +62,7 @@ export interface AutoCompleteProps<T extends AutoCompleteItems> {
     insetLabelId?: string;
     id?: string;
     loading?: boolean;
-    motion?: Motion;
+    motion?: boolean;
     maxHeight?: string | number;
     mouseEnterDelay?: number;
     mouseLeaveDelay?: number;

packages/semi-ui/collapse/collapse-context.tsx

@@ -1,5 +1,4 @@
 import React from 'react';
-import { Motion } from '../_base/base';
 
 
 export interface CollapseContextType{
@@ -9,7 +8,7 @@ export interface CollapseContextType{
     keepDOM: boolean;
     expandIconPosition: 'left' | 'right';
     onClick: (activeKey: string, e: React.MouseEvent) => void;
-    motion: Motion
+    motion: boolean
 }
 
 

packages/semi-ui/dropdown/index.tsx

@@ -16,7 +16,6 @@ import DropdownTitle, { DropdownTitleProps } from './dropdownTitle';
 import DropdownContext, { DropdownContextType } from './context';
 import '@douyinfe/semi-foundation/dropdown/dropdown.scss';
 import { noop, get } from 'lodash';
-import { Motion } from '../_base/base';
 
 const positionSet = strings.POSITION_SET;
 const triggerSet = strings.TRIGGER_SET;
@@ -51,7 +50,7 @@ export interface DropdownProps extends TooltipProps {
     menu?: DropDownMenuItem[];
     trigger?: Trigger;
     zIndex?: number;
-    motion?: Motion;
+    motion?: boolean;
     className?: string;
     contentClassName?: string | any[];
     style?: React.CSSProperties;

packages/semi-ui/modal/confirm.tsx

@@ -4,9 +4,7 @@ import { destroyFns, ModalReactProps } from './Modal';
 import ConfirmModal from './ConfirmModal';
 
 import '@douyinfe/semi-foundation/modal/modal.scss';
-import { get } from 'lodash';
 import { IconAlertCircle, IconAlertTriangle, IconHelpCircle, IconInfoCircle, IconTickCircle } from '@douyinfe/semi-icons';
-import { Motion } from '../_base/base';
 
 export interface ConfirmProps extends ModalReactProps {
     type: 'success' | 'info' | 'warning' | 'error' | 'confirm'

packages/semi-ui/modal/useModal/HookModal.tsx

@@ -2,12 +2,11 @@ import React, { PropsWithChildren } from 'react';
 import ConfirmModal from '../ConfirmModal';
 import { get } from 'lodash';
 import { ConfirmProps } from '../confirm';
-import { Motion } from '../../_base/base';
 
 interface HookModalProps {
     afterClose: (...args: any[]) => void;
     config: ConfirmProps;
-    motion?: Motion
+    motion?: boolean
 }
 
 export interface HookModalRef {

packages/semi-ui/navigation/index.tsx

@@ -15,7 +15,6 @@ import Header, { NavHeaderProps } from './Header';
 import NavContext from './nav-context';
 import LocaleConsumer from '../locale/localeConsumer';
 import '@douyinfe/semi-foundation/navigation/navigation.scss';
-import { Motion } from '../_base/base';
 
 export type { CollapseButtonProps } from './CollapseButton';
 export type { NavFooterProps } from './Footer';

packages/semi-ui/popconfirm/index.tsx

@@ -15,7 +15,6 @@ import ConfigContext, { ContextValue } from '../configProvider/context';
 import LocaleConsumer from '../locale/localeConsumer';
 import { Locale as LocaleObject } from '../locale/interface';
 import '@douyinfe/semi-foundation/popconfirm/popconfirm.scss';
-import { Motion } from '../_base/base';
 
 export interface PopconfirmProps extends PopoverProps {
     cancelText?: string;
@@ -28,7 +27,7 @@ export interface PopconfirmProps extends PopoverProps {
     okText?: string;
     okType?: ButtonType;
     okButtonProps?: ButtonProps;
-    motion?: Motion;
+    motion?: boolean;
     title?: React.ReactNode;
     visible?: boolean;
     prefixCls?: string;

packages/semi-ui/popover/index.tsx

@@ -7,7 +7,6 @@ import Tooltip, { ArrowBounding, Position, TooltipProps, Trigger, RenderContentP
 import Arrow from './Arrow';
 import '@douyinfe/semi-foundation/popover/popover.scss';
 import { BaseProps } from '../_base/baseComponent';
-import { Motion } from '../_base/base';
 import { isFunction, noop } from 'lodash';
 
 import type { ArrowProps } from './Arrow';

packages/semi-ui/tabs/interface.ts

@@ -84,6 +84,6 @@ export interface TabContextValue {
     panes?: Array<PlainTab>;
     tabPaneMotion?: boolean;
     tabPosition?: TabPosition;
-    prevActiveKey: string|null;
-    forceDisableMotion: boolean
+    prevActiveKey?: string|null;
+    forceDisableMotion?: boolean
 }

packages/semi-ui/timePicker/TimePicker.tsx

@@ -24,7 +24,6 @@ import { InputSize } from '../input';
 import { Position } from '../tooltip';
 import { ScrollItemProps } from '../scrollList/scrollItem';
 import { Locale } from '../locale/interface';
-import { Motion } from '../_base/base';
 
 export interface Panel {
     panelHeader?: React.ReactNode;
@@ -65,7 +64,7 @@ export type TimePickerProps = {
     locale?: Locale['TimePicker'];
     localeCode?: string;
     minuteStep?: number;
-    motion?: Motion;
+    motion?: boolean;
     open?: boolean;
     panelFooter?: React.ReactNode;
     panelHeader?: React.ReactNode;

packages/semi-ui/toast/index.tsx

@@ -14,7 +14,6 @@ import '@douyinfe/semi-foundation/toast/toast.scss';
 import getUuid from '@douyinfe/semi-foundation/utils/uuid';
 import useToast from './useToast';
 import { ConfigProps, ToastInstance, ToastProps, ToastState } from '@douyinfe/semi-foundation/toast/toastFoundation';
-import { Motion } from '../_base/base';
 import CSSAnimation from '../_cssAnimation';
 import cls from 'classnames';
 

packages/semi-ui/tooltip/_story/tooltip.stories.jsx

@@ -24,7 +24,6 @@ import ArrowPointAtCenter from './ArrowPointAtCenter';
 import CustomContainer from './CustomContainer';
 import ContainerPosition from './ContainerPosition';
 import { IconList, IconSidebar, IconEdit } from '@douyinfe/semi-icons';
-import TooltipTransition from '../TooltipStyledTransition';
 
 export default {
   title: 'Tooltip',

packages/semi-ui/tooltip/index.tsx

@@ -23,7 +23,6 @@ import ConfigContext, { ContextValue } from '../configProvider/context';
 import TriangleArrow from './TriangleArrow';
 import TriangleArrowVertical from './TriangleArrowVertical';
 import ArrowBoundingShape from './ArrowBoundingShape';
-import { Motion } from '../_base/base';
 import CSSAnimation from "../_cssAnimation";
 
 export type Trigger = ArrayElement<typeof strings.TRIGGER_SET>;

packages/semi-ui/treeSelect/index.tsx

@@ -47,7 +47,6 @@ import Trigger from '../trigger';
 import TagInput from '../tagInput';
 import { isSemiIcon } from '../_utils';
 import { OptionProps, TreeProps, TreeState, FlattenNode, TreeNodeData, TreeNodeProps } from '../tree/interface';
-import { Motion } from '../_base/base';
 import { IconChevronDown, IconClear, IconSearch } from '@douyinfe/semi-icons';
 import CheckboxGroup from '../checkbox/checkboxGroup';
 import Popover, { PopoverProps } from '../popover/index';
@@ -106,7 +105,7 @@ export interface TreeSelectProps extends Omit<BasicTreeSelectProps, OverrideComm
     'aria-invalid'?: React.AriaAttributes['aria-invalid'];
     'aria-labelledby'?: React.AriaAttributes['aria-labelledby'];
     'aria-required'?: React.AriaAttributes['aria-required'];
-    motion?: Motion;
+    motion?: boolean;
     mouseEnterDelay?: number;
     mouseLeaveDelay?: number;
     arrowIcon?: React.ReactNode;
@@ -222,7 +221,7 @@ class TreeSelect extends BaseComponent<TreeSelectProps, TreeSelectState> {
         ),
         dropdownClassName: PropTypes.string,
         dropdownStyle: PropTypes.object,
-        motion: PropTypes.oneOfType([PropTypes.bool, PropTypes.object, PropTypes.func]),
+        motion: PropTypes.bool,
         placeholder: PropTypes.string,
         maxTagCount: PropTypes.number,
         size: PropTypes.oneOf<TreeSelectProps['size']>(strings.SIZE_SET),