feat(core): remove all imports from design/component (#5078)

feat(core): remove all imports from design/component

feat(plugin): remove imports from design-components

feat(storybook): remove design-components imoprts

feat(core): remove

fix(component): remove design/component import in local-demo-tip

packages/frontend/component/src/components/affine-banner/local-demo-tips.tsx

@@ -1,5 +1,5 @@
+import { Button, IconButton } from '@affine/component/ui/button';
 import { CloseIcon } from '@blocksuite/icons';
-import { Button, IconButton } from '@toeverything/components/button';
 import { useCallback } from 'react';
 
 import * as styles from './index.css';

packages/frontend/component/src/components/app-sidebar/app-updater-button/index.tsx

@@ -1,7 +1,6 @@
 import { Unreachable } from '@affine/env/constant';
 import { useAFFiNEI18N } from '@affine/i18n/hooks';
 import { CloseIcon, NewIcon, ResetIcon } from '@blocksuite/icons';
-import { Tooltip } from '@toeverything/components/tooltip';
 import {
   changelogCheckedAtom,
   currentChangelogUnreadAtom,
@@ -15,6 +14,7 @@ import clsx from 'clsx';
 import { useAtomValue, useSetAtom } from 'jotai';
 import { startTransition, useCallback } from 'react';
 
+import { Tooltip } from '../../../ui/tooltip';
 import * as styles from './index.css';
 
 export interface AddPageButtonPureProps {

packages/frontend/component/src/components/app-sidebar/sidebar-header/index.tsx

@@ -1,10 +1,10 @@
 import { useAFFiNEI18N } from '@affine/i18n/hooks';
 import { ArrowLeftSmallIcon, ArrowRightSmallIcon } from '@blocksuite/icons';
-import { IconButton } from '@toeverything/components/button';
-import { Tooltip } from '@toeverything/components/tooltip';
 import { useAtomValue } from 'jotai';
 import { useMemo } from 'react';
 
+import { IconButton } from '../../../ui/button';
+import { Tooltip } from '../../../ui/tooltip';
 import type { History } from '..';
 import {
   navHeaderButton,

packages/frontend/component/src/components/app-sidebar/sidebar-header/sidebar-switch.tsx

@@ -1,9 +1,9 @@
 import { useAFFiNEI18N } from '@affine/i18n/hooks';
 import { SidebarIcon } from '@blocksuite/icons';
-import { IconButton } from '@toeverything/components/button';
-import { Tooltip } from '@toeverything/components/tooltip';
 import { useAtom } from 'jotai';
 
+import { IconButton } from '../../../ui/button';
+import { Tooltip } from '../../../ui/tooltip';
 import { appSidebarOpenAtom } from '../index.jotai';
 import * as styles from './sidebar-switch.css';
 

packages/frontend/component/src/components/auth-components/back-button.tsx

@@ -1,8 +1,9 @@
 import { useAFFiNEI18N } from '@affine/i18n/hooks';
 import { ArrowLeftSmallIcon } from '@blocksuite/icons';
-import { Button, type ButtonProps } from '@toeverything/components/button';
 import { type FC } from 'react';
 
+import { Button, type ButtonProps } from '../../ui/button';
+
 export const BackButton: FC<ButtonProps> = props => {
   const t = useAFFiNEI18N();
   return (

packages/frontend/component/src/components/auth-components/change-email-page.tsx

@@ -1,7 +1,7 @@
 import { useAFFiNEI18N } from '@affine/i18n/hooks';
-import { Button } from '@toeverything/components/button';
 import { useCallback, useState } from 'react';
 
+import { Button } from '../../ui/button';
 import { AuthInput } from './auth-input';
 import { AuthPageContainer } from './auth-page-container';
 import { emailRegex } from './utils';

packages/frontend/component/src/components/auth-components/change-password-page.tsx

@@ -1,9 +1,9 @@
 import { useAFFiNEI18N } from '@affine/i18n/hooks';
-import { Button } from '@toeverything/components/button';
 import { useSetAtom } from 'jotai';
 import type { FC } from 'react';
 import { useCallback, useState } from 'react';
 
+import { Button } from '../../ui/button';
 import { pushNotificationAtom } from '../notification-center';
 import { AuthPageContainer } from './auth-page-container';
 import { SetPassword } from './set-password';

packages/frontend/component/src/components/auth-components/confirm-change-email.tsx

@@ -1,7 +1,7 @@
 import { useAFFiNEI18N } from '@affine/i18n/hooks';
-import { Button } from '@toeverything/components/button';
 import type { FC } from 'react';
 
+import { Button } from '../../ui/button';
 import { AuthPageContainer } from './auth-page-container';
 
 export const ConfirmChangeEmail: FC<{

packages/frontend/component/src/components/auth-components/modal.tsx

@@ -1,6 +1,7 @@
-import { Modal } from '@toeverything/components/modal';
 import type { FC, PropsWithChildren } from 'react';
 
+import { Modal } from '../../ui/modal';
+
 export type AuthModalProps = {
   open: boolean;
   setOpen: (value: boolean) => void;

packages/frontend/component/src/components/auth-components/set-password-page.tsx

@@ -1,9 +1,9 @@
 import { useAFFiNEI18N } from '@affine/i18n/hooks';
-import { Button } from '@toeverything/components/button';
 import { useSetAtom } from 'jotai';
 import type { FC } from 'react';
 import { useCallback, useState } from 'react';
 
+import { Button } from '../../ui/button';
 import { pushNotificationAtom } from '../notification-center';
 import { AuthPageContainer } from './auth-page-container';
 import { SetPassword } from './set-password';

packages/frontend/component/src/components/auth-components/set-password.tsx

@@ -1,7 +1,7 @@
 import { useAFFiNEI18N } from '@affine/i18n/hooks';
-import { Button } from '@toeverything/components/button';
 import { type FC, useCallback, useRef, useState } from 'react';
 
+import { Button } from '../../ui/button';
 import { Wrapper } from '../../ui/layout';
 import { PasswordInput } from './password-input';
 

packages/frontend/component/src/components/auth-components/sign-in-success-page.tsx

@@ -1,7 +1,7 @@
 import { useAFFiNEI18N } from '@affine/i18n/hooks';
-import { Button } from '@toeverything/components/button';
 import type { FC } from 'react';
 
+import { Button } from '../../ui/button';
 import { AuthPageContainer } from './auth-page-container';
 
 export const SignInSuccessPage: FC<{

packages/frontend/component/src/components/auth-components/sign-up-page.tsx

@@ -1,9 +1,9 @@
 import { useAFFiNEI18N } from '@affine/i18n/hooks';
-import { Button } from '@toeverything/components/button';
 import { useSetAtom } from 'jotai';
 import type { FC } from 'react';
 import { useCallback, useState } from 'react';
 
+import { Button } from '../../ui/button';
 import { pushNotificationAtom } from '../notification-center';
 import { AuthPageContainer } from './auth-page-container';
 import { SetPassword } from './set-password';

packages/frontend/component/src/components/card/workspace-card/index.tsx

@@ -2,16 +2,16 @@ import { WorkspaceFlavour } from '@affine/env/workspace';
 import { useAFFiNEI18N } from '@affine/i18n/hooks';
 import type { RootWorkspaceMetadata } from '@affine/workspace/atom';
 import { CollaborationIcon, SettingsIcon } from '@blocksuite/icons';
-import { Avatar } from '@toeverything/components/avatar';
-import { Divider } from '@toeverything/components/divider';
-import { Tooltip } from '@toeverything/components/tooltip';
 import { useBlockSuiteWorkspaceAvatarUrl } from '@toeverything/hooks/use-block-suite-workspace-avatar-url';
 import { useBlockSuiteWorkspaceName } from '@toeverything/hooks/use-block-suite-workspace-name';
 import { getBlockSuiteWorkspaceAtom } from '@toeverything/infra/__internal__/workspace';
 import { useAtomValue } from 'jotai/react';
 import { useCallback } from 'react';
 
+import { Avatar } from '../../../ui/avatar';
+import { Divider } from '../../../ui/divider';
 import { Skeleton } from '../../../ui/skeleton';
+import { Tooltip } from '../../../ui/tooltip';
 import {
   StyledCard,
   StyledIconContainer,

packages/frontend/component/src/components/card/workspace-card/styles.ts

@@ -1,6 +1,5 @@
-import { IconButton } from '@toeverything/components/button';
-
 import { displayFlex, styled, textEllipsis } from '../../../styles';
+import { IconButton } from '../../../ui/button';
 
 export const StyledWorkspaceInfo = styled('div')(() => {
   return {

packages/frontend/component/src/components/disable-public-link/index.tsx

@@ -1,8 +1,6 @@
 import { useAFFiNEI18N } from '@affine/i18n/hooks';
-import {
-  ConfirmModal,
-  type ConfirmModalProps,
-} from '@toeverything/components/modal';
+
+import { ConfirmModal, type ConfirmModalProps } from '../../ui/modal';
 
 export const PublicLinkDisableModal = (props: ConfirmModalProps) => {
   const t = useAFFiNEI18N();

packages/frontend/component/src/components/import-page/index.tsx

@@ -6,9 +6,9 @@ import {
   NewIcon,
   NotionIcon,
 } from '@blocksuite/icons';
-import { IconButton } from '@toeverything/components/button';
-import { Tooltip } from '@toeverything/components/tooltip';
 
+import { IconButton } from '../../ui/button';
+import { Tooltip } from '../../ui/tooltip';
 import { BlockCard } from '../card/block-card';
 import {
   importPageBodyStyle,

packages/frontend/component/src/components/member-components/accept-invite-page.tsx

@@ -1,9 +1,9 @@
 import { AuthPageContainer } from '@affine/component/auth-components';
 import { type GetInviteInfoQuery } from '@affine/graphql';
 import { useAFFiNEI18N } from '@affine/i18n/hooks';
-import { Avatar } from '@toeverything/components/avatar';
-import { Button } from '@toeverything/components/button';
 
+import { Avatar } from '../../ui/avatar';
+import { Button } from '../../ui/button';
 import { FlexWrapper } from '../../ui/layout';
 import * as styles from './styles.css';
 export const AcceptInvitePage = ({

packages/frontend/component/src/components/member-components/invite-modal.tsx

@@ -1,8 +1,8 @@
 import { Permission } from '@affine/graphql';
 import { useAFFiNEI18N } from '@affine/i18n/hooks';
-import { ConfirmModal } from '@toeverything/components/modal';
 import { useCallback, useEffect, useState } from 'react';
 
+import { ConfirmModal } from '../../ui/modal';
 import { AuthInput } from '..//auth-components';
 import { emailRegex } from '..//auth-components/utils';
 

packages/frontend/component/src/components/not-found-page/not-found-page.tsx

@@ -1,9 +1,9 @@
 import { useAFFiNEI18N } from '@affine/i18n/hooks';
 import { SignOutIcon } from '@blocksuite/icons';
-import { Avatar } from '@toeverything/components/avatar';
-import { Button, IconButton } from '@toeverything/components/button';
-import { Tooltip } from '@toeverything/components/tooltip';
 
+import { Avatar } from '../../ui/avatar';
+import { Button, IconButton } from '../../ui/button';
+import { Tooltip } from '../../ui/tooltip';
 import { NotFoundPattern } from './not-found-pattern';
 import {
   largeButtonEffect,

packages/frontend/component/src/components/notification-center/index.tsx

@@ -4,7 +4,6 @@
 
 import { CloseIcon, InformationFillDuotoneIcon } from '@blocksuite/icons';
 import * as Toast from '@radix-ui/react-toast';
-import { IconButton } from '@toeverything/components/button';
 import clsx from 'clsx';
 import { useAtom, useAtomValue, useSetAtom } from 'jotai';
 import type { ReactNode } from 'react';
@@ -17,6 +16,7 @@ import {
   useState,
 } from 'react';
 
+import { IconButton } from '../../ui/button';
 import { SuccessIcon } from './icons';
 import * as styles from './index.css';
 import type { Notification } from './index.jotai';

packages/frontend/component/src/components/page-list/components/favorite-tag.tsx

@@ -1,13 +1,10 @@
 import { useAFFiNEI18N } from '@affine/i18n/hooks';
 import { FavoritedIcon, FavoriteIcon } from '@blocksuite/icons';
-import {
-  IconButton,
-  type IconButtonProps,
-} from '@toeverything/components/button';
-import { Tooltip } from '@toeverything/components/tooltip';
 import Lottie from 'lottie-react';
 import { forwardRef, useCallback, useState } from 'react';
 
+import { IconButton, type IconButtonProps } from '../../../ui/button';
+import { Tooltip } from '../../../ui/tooltip';
 import favoritedAnimation from './favorited-animation/data.json';
 
 export const FavoriteTag = forwardRef<

packages/frontend/component/src/components/page-list/components/new-page-buttton.tsx

@@ -1,9 +1,9 @@
 import { useAFFiNEI18N } from '@affine/i18n/hooks';
 import { EdgelessIcon, ImportIcon, PageIcon } from '@blocksuite/icons';
-import { Menu } from '@toeverything/components/menu';
 import { type PropsWithChildren, useCallback, useState } from 'react';
 
 import { DropdownButton } from '../../../ui/button';
+import { Menu } from '../../../ui/menu';
 import { BlockCard } from '../../card/block-card';
 import { menuContent } from './new-page-button.css';
 

packages/frontend/component/src/components/page-list/filter/condition.tsx

@@ -1,9 +1,9 @@
 import type { Filter, Literal } from '@affine/env/filter';
 import type { PropertiesMeta } from '@affine/env/filter';
-import { Menu, MenuItem } from '@toeverything/components/menu';
 import type { ReactNode } from 'react';
 import { useMemo } from 'react';
 
+import { Menu, MenuItem } from '../../../ui/menu';
 import { FilterTag } from './filter-tag-translation';
 import * as styles from './index.css';
 import { literalMatcher } from './literal-matcher';

packages/frontend/component/src/components/page-list/filter/filter-list.tsx

@@ -2,10 +2,10 @@ import type { Filter } from '@affine/env/filter';
 import type { PropertiesMeta } from '@affine/env/filter';
 import { useAFFiNEI18N } from '@affine/i18n/hooks';
 import { CloseIcon, PlusIcon } from '@blocksuite/icons';
-import { Button } from '@toeverything/components/button';
-import { IconButton } from '@toeverything/components/button';
-import { Menu } from '@toeverything/components/menu';
 
+import { Button } from '../../../ui/button';
+import { IconButton } from '../../../ui/button';
+import { Menu } from '../../../ui/menu';
 import { Condition } from './condition';
 import * as styles from './index.css';
 import { CreateFilterMenu } from './vars';

packages/frontend/component/src/components/page-list/filter/multi-select.tsx

@@ -1,7 +1,7 @@
-import { Menu, MenuItem } from '@toeverything/components/menu';
 import type { MouseEvent } from 'react';
 import { useMemo } from 'react';
 
+import { Menu, MenuItem } from '../../../ui/menu';
 import * as styles from './multi-select.css';
 
 export const MultiSelect = ({

packages/frontend/component/src/components/page-list/filter/vars.tsx

@@ -5,14 +5,10 @@ import type {
   VariableMap,
 } from '@affine/env/filter';
 import { useAFFiNEI18N } from '@affine/i18n/hooks';
-import {
-  MenuIcon,
-  MenuItem,
-  MenuSeparator,
-} from '@toeverything/components/menu';
 import dayjs from 'dayjs';
 import type { ReactNode } from 'react';
 
+import { MenuIcon, MenuItem, MenuSeparator } from '../../../ui/menu';
 import { FilterTag } from './filter-tag-translation';
 import * as styles from './index.css';
 import { tBoolean, tDate, tTag } from './logical/custom-type';

packages/frontend/component/src/components/page-list/operation-cell.tsx

@@ -7,13 +7,13 @@ import {
   OpenInNewIcon,
   ResetIcon,
 } from '@blocksuite/icons';
-import { IconButton } from '@toeverything/components/button';
-import { Menu, MenuIcon, MenuItem } from '@toeverything/components/menu';
-import { ConfirmModal } from '@toeverything/components/modal';
-import { Tooltip } from '@toeverything/components/tooltip';
 import { useState } from 'react';
 import { Link } from 'react-router-dom';
 
+import { IconButton } from '../../ui/button';
+import { Menu, MenuIcon, MenuItem } from '../../ui/menu';
+import { ConfirmModal } from '../../ui/modal';
+import { Tooltip } from '../../ui/tooltip';
 import { FavoriteTag } from './components/favorite-tag';
 import { DisablePublicSharing, MoveToTrash } from './operation-menu-items';
 import * as styles from './page-list.css';

packages/frontend/component/src/components/page-list/operation-menu-items/disable-public-sharing.tsx

@@ -1,11 +1,7 @@
 import { useAFFiNEI18N } from '@affine/i18n/hooks';
 import { ShareIcon } from '@blocksuite/icons';
-import {
-  MenuIcon,
-  MenuItem,
-  type MenuItemProps,
-} from '@toeverything/components/menu';
 
+import { MenuIcon, MenuItem, type MenuItemProps } from '../../../ui/menu';
 import { PublicLinkDisableModal } from '../../disable-public-link';
 
 export const DisablePublicSharing = (props: MenuItemProps) => {

packages/frontend/component/src/components/page-list/operation-menu-items/export.tsx

@@ -6,9 +6,9 @@ import {
   ExportToPdfIcon,
   ExportToPngIcon,
 } from '@blocksuite/icons';
-import { MenuIcon, MenuItem, MenuSub } from '@toeverything/components/menu';
 import { type ReactNode, useMemo } from 'react';
 
+import { MenuIcon, MenuItem, MenuSub } from '../../../ui/menu';
 import { transitionStyle } from './index.css';
 
 interface ExportMenuItemProps<T> {

packages/frontend/component/src/components/page-list/operation-menu-items/move-to-trash.tsx

@@ -1,14 +1,8 @@
 import { useAFFiNEI18N } from '@affine/i18n/hooks';
 import { DeleteIcon } from '@blocksuite/icons';
-import {
-  MenuIcon,
-  MenuItem,
-  type MenuItemProps,
-} from '@toeverything/components/menu';
-import {
-  ConfirmModal,
-  type ConfirmModalProps,
-} from '@toeverything/components/modal';
+
+import { MenuIcon, MenuItem, type MenuItemProps } from '../../../ui/menu';
+import { ConfirmModal, type ConfirmModalProps } from '../../../ui/modal';
 
 export const MoveToTrash = (props: MenuItemProps) => {
   const t = useAFFiNEI18N();

packages/frontend/component/src/components/page-list/page-tags.tsx

@@ -1,10 +1,10 @@
 import type { Tag } from '@affine/env/filter';
 import { MoreHorizontalIcon } from '@blocksuite/icons';
-import { Menu } from '@toeverything/components/menu';
 import { assignInlineVars } from '@vanilla-extract/dynamic';
 import clsx from 'clsx';
 import { useMemo } from 'react';
 
+import { Menu } from '../../ui/menu';
 import * as styles from './page-tags.css';
 import { stopPropagation } from './utils';
 

packages/frontend/component/src/components/page-list/view/collection-bar.tsx

@@ -2,11 +2,11 @@ import type { DeleteCollectionInfo, PropertiesMeta } from '@affine/env/filter';
 import type { GetPageInfoById } from '@affine/env/page-info';
 import { useAFFiNEI18N } from '@affine/i18n/hooks';
 import { ViewLayersIcon } from '@blocksuite/icons';
-import { Button } from '@toeverything/components/button';
-import { Tooltip } from '@toeverything/components/tooltip';
 import clsx from 'clsx';
 import { useState } from 'react';
 
+import { Button } from '../../../ui/button';
+import { Tooltip } from '../../../ui/tooltip';
 import {
   type CollectionsCRUDAtom,
   useCollectionManager,

packages/frontend/component/src/components/page-list/view/collection-list.tsx

@@ -6,11 +6,11 @@ import type {
 import type { PropertiesMeta } from '@affine/env/filter';
 import { useAFFiNEI18N } from '@affine/i18n/hooks';
 import { FilterIcon } from '@blocksuite/icons';
-import { Button } from '@toeverything/components/button';
-import { Menu } from '@toeverything/components/menu';
 import { useCallback, useState } from 'react';
 
+import { Button } from '../../../ui/button';
 import { FlexWrapper } from '../../../ui/layout';
+import { Menu } from '../../../ui/menu';
 import { CreateFilterMenu } from '../filter/vars';
 import type { useCollectionManager } from '../use-collection-manager';
 import * as styles from './collection-list.css';

packages/frontend/component/src/components/page-list/view/collection-operations.tsx

@@ -1,12 +1,6 @@
 import type { Collection, DeleteCollectionInfo } from '@affine/env/filter';
 import { useAFFiNEI18N } from '@affine/i18n/hooks';
 import { DeleteIcon, EditIcon, FilterIcon } from '@blocksuite/icons';
-import {
-  Menu,
-  MenuIcon,
-  MenuItem,
-  type MenuItemProps,
-} from '@toeverything/components/menu';
 import {
   type PropsWithChildren,
   type ReactElement,
@@ -14,6 +8,7 @@ import {
   useMemo,
 } from 'react';
 
+import { Menu, MenuIcon, MenuItem, type MenuItemProps } from '../../../ui/menu';
 import type { useCollectionManager } from '../use-collection-manager';
 import type { AllPageListConfig } from '.';
 import * as styles from './collection-operations.css';

packages/frontend/component/src/components/page-list/view/create-collection.tsx

@@ -1,9 +1,9 @@
 import { useAFFiNEI18N } from '@affine/i18n/hooks';
-import { Button } from '@toeverything/components/button';
-import { Modal } from '@toeverything/components/modal';
 import { useCallback, useMemo, useState } from 'react';
 
+import { Button } from '../../../ui/button';
 import Input from '../../../ui/input';
+import { Modal } from '../../../ui/modal';
 import * as styles from './create-collection.css';
 
 export interface CreateCollectionModalProps {

packages/frontend/component/src/components/page-list/view/edit-collection/edit-collection.tsx

@@ -2,11 +2,11 @@ import type { Collection } from '@affine/env/filter';
 import { useAFFiNEI18N } from '@affine/i18n/hooks';
 import type { PageMeta, Workspace } from '@blocksuite/store';
 import type { DialogContentProps } from '@radix-ui/react-dialog';
-import { Button } from '@toeverything/components/button';
-import { Modal } from '@toeverything/components/modal';
 import { type ReactNode, useCallback, useMemo, useState } from 'react';
 
-import { RadioButton, RadioButtonGroup } from '../../../../ui/button';
+import { RadioButton, RadioButtonGroup } from '../../../../index';
+import { Button } from '../../../../ui/button';
+import { Modal } from '../../../../ui/modal';
 import * as styles from './edit-collection.css';
 import { PagesMode } from './pages-mode';
 import { RulesMode } from './rules-mode';

packages/frontend/component/src/components/page-list/view/edit-collection/hooks.tsx

@@ -1,6 +1,6 @@
-import { Modal } from '@toeverything/components/modal';
 import { useCallback, useState } from 'react';
 
+import { Modal } from '../../../../ui/modal';
 import type { AllPageListConfig } from './edit-collection';
 import { SelectPage } from './select-page';
 export const useSelectPage = ({

packages/frontend/component/src/components/page-list/view/edit-collection/pages-mode.tsx

@@ -2,10 +2,10 @@ import type { Collection } from '@affine/env/filter';
 import { useAFFiNEI18N } from '@affine/i18n/hooks';
 import { FilterIcon } from '@blocksuite/icons';
 import type { PageMeta } from '@blocksuite/store';
-import { Menu } from '@toeverything/components/menu';
 import clsx from 'clsx';
 import { type ReactNode, useCallback } from 'react';
 
+import { Menu } from '../../../../ui/menu';
 import { FilterList } from '../../filter/filter-list';
 import { VariableSelect } from '../../filter/vars';
 import { VirtualizedPageList } from '../../virtualized-page-list';

packages/frontend/component/src/components/page-list/view/edit-collection/select-page.tsx

@@ -1,11 +1,11 @@
 import { Trans } from '@affine/i18n';
 import { useAFFiNEI18N } from '@affine/i18n/hooks';
 import { FilterIcon } from '@blocksuite/icons';
-import { Button } from '@toeverything/components/button';
-import { Menu } from '@toeverything/components/menu';
 import clsx from 'clsx';
 import { useCallback, useState } from 'react';
 
+import { Button } from '../../../../ui/button';
+import { Menu } from '../../../../ui/menu';
 import { FilterList } from '../../filter';
 import { VariableSelect } from '../../filter/vars';
 import { VirtualizedPageList } from '../../virtualized-page-list';

packages/frontend/component/src/components/page-list/view/save-as-collection-button.tsx

@@ -1,10 +1,10 @@
 import type { Collection } from '@affine/env/filter';
 import { useAFFiNEI18N } from '@affine/i18n/hooks';
 import { SaveIcon } from '@blocksuite/icons';
-import { Button } from '@toeverything/components/button';
 import { nanoid } from 'nanoid';
 import { useCallback } from 'react';
 
+import { Button } from '../../../ui/button';
 import { createEmptyCollection } from '../use-collection-manager';
 import { useEditCollectionName } from './use-edit-collection';
 

packages/frontend/component/src/components/setting-components/storage-progess.tsx

@@ -1,11 +1,11 @@
 import { SubscriptionPlan } from '@affine/graphql';
 import { useAFFiNEI18N } from '@affine/i18n/hooks';
-import { Button } from '@toeverything/components/button';
-import { Tooltip } from '@toeverything/components/tooltip';
 import bytes from 'bytes';
 import clsx from 'clsx';
 import { useMemo } from 'react';
 
+import { Button } from '../../ui/button';
+import { Tooltip } from '../../ui/tooltip';
 import * as styles from './share.css';
 
 export interface StorageProgressProgress {

packages/frontend/component/src/components/tour-modal/tour-modal.tsx

@@ -1,10 +1,10 @@
 /// <reference types="../../type.d.ts" />
 import { useAFFiNEI18N } from '@affine/i18n/hooks';
 import { ArrowLeftSmallIcon, ArrowRightSmallIcon } from '@blocksuite/icons';
-import { Modal, type ModalProps } from '@toeverything/components/modal';
 import clsx from 'clsx';
 import { useState } from 'react';
 
+import { Modal, type ModalProps } from '../../ui/modal';
 import editingVideo from './editingVideo.mp4';
 import {
   arrowStyle,