chore: Takes portal from component-toolkit

src/annotation-context/annotation/open-annotation.tsx

@@ -2,8 +2,9 @@
 // SPDX-License-Identifier: Apache-2.0
 import React, { useRef } from 'react';
 
+import { Portal } from '@cloudscape-design/component-toolkit/internal';
+
 import { HotspotProps } from '../../hotspot/interfaces';
-import Portal from '../../internal/components/portal';
 import { AnnotationContextProps } from '../interfaces';
 import { AnnotationPopover } from './annotation-popover';
 import AnnotationTrigger from './annotation-trigger';

src/button-dropdown/tooltip.tsx

@@ -2,9 +2,8 @@
 // SPDX-License-Identifier: Apache-2.0
 import React, { KeyboardEventHandler, useRef, useState } from 'react';
 
-import { useReducedMotion } from '@cloudscape-design/component-toolkit/internal';
+import { Portal, useReducedMotion } from '@cloudscape-design/component-toolkit/internal';
 
-import Portal from '../internal/components/portal';
 import { usePortalModeClasses } from '../internal/hooks/use-portal-mode-classes';
 import Arrow from '../popover/arrow';
 import PopoverBody from '../popover/body';

src/internal/components/drag-handle-wrapper/__tests__/portal-overlay.test.tsx

@@ -11,6 +11,7 @@ import styles from '../../../../../lib/components/internal/components/drag-handl
 let isRtl = false;
 
 jest.mock('@cloudscape-design/component-toolkit/internal', () => ({
+  ...jest.requireActual('@cloudscape-design/component-toolkit/internal'),
   getIsRtl: jest.fn(() => isRtl),
   getLogicalBoundingClientRect: jest.fn().mockReturnValue({
     insetInlineStart: 2,

src/internal/components/drag-handle-wrapper/portal-overlay.tsx

@@ -6,10 +6,9 @@ import {
   getIsRtl,
   getLogicalBoundingClientRect,
   getScrollInlineStart,
+  Portal,
 } from '@cloudscape-design/component-toolkit/internal';
 
-import Portal from '../portal';
-
 import styles from './styles.css.js';
 
 export default function PortalOverlay({

src/internal/components/sortable-area/index.tsx

@@ -7,7 +7,8 @@ import { arrayMove, SortableContext, useSortable, verticalListSortingStrategy }
 import { CSS } from '@dnd-kit/utilities';
 import clsx from 'clsx';
 
-import Portal from '../../components/portal';
+import { Portal } from '@cloudscape-design/component-toolkit/internal';
+
 import { fireNonCancelableEvent } from '../../events';
 import { joinStrings } from '../../utils/strings';
 import { SortableAreaProps } from './interfaces';

src/internal/components/tooltip/index.tsx

@@ -2,11 +2,12 @@
 // SPDX-License-Identifier: Apache-2.0
 import React, { useEffect } from 'react';
 
+import { Portal } from '@cloudscape-design/component-toolkit/internal';
+
 import PopoverArrow from '../../../popover/arrow';
 import PopoverBody from '../../../popover/body';
 import PopoverContainer from '../../../popover/container';
 import { PopoverProps } from '../../../popover/interfaces';
-import Portal from '../portal';
 import { Transition } from '../transition';
 
 import styles from './styles.css.js';

src/internal/hooks/use-base-component/__tests__/use-base-component.test.tsx

@@ -3,10 +3,9 @@
 import React, { useState } from 'react';
 import { render } from '@testing-library/react';
 
-import { COMPONENT_METADATA_KEY } from '@cloudscape-design/component-toolkit/internal';
+import { COMPONENT_METADATA_KEY, Portal } from '@cloudscape-design/component-toolkit/internal';
 
 import { Button } from '../../../../../lib/components';
-import Portal from '../../../../../lib/components/internal/components/portal';
 import { PACKAGE_VERSION } from '../../../../../lib/components/internal/environment';
 import useBaseComponent, {
   InternalBaseComponentProps,

src/modal/internal.tsx

@@ -4,6 +4,7 @@ import React, { useEffect, useRef } from 'react';
 import clsx from 'clsx';
 
 import { useContainerQuery } from '@cloudscape-design/component-toolkit';
+import { Portal } from '@cloudscape-design/component-toolkit/internal';
 import { getAnalyticsMetadataAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';
 
 import { InternalButton } from '../button/internal';
@@ -18,7 +19,6 @@ import {
 import { FunnelProps, useFunnel, useFunnelStep, useFunnelSubStep } from '../internal/analytics/hooks/use-funnel';
 import { getBaseProps } from '../internal/base-component';
 import FocusLock from '../internal/components/focus-lock';
-import Portal from '../internal/components/portal';
 import { ButtonContext, ButtonContextProps } from '../internal/context/button-context';
 import { ModalContext } from '../internal/context/modal-context';
 import ResetContextsForModal from '../internal/context/reset-contexts-for-modal';

src/popover/internal.tsx

@@ -3,10 +3,11 @@
 import React, { useCallback, useEffect, useImperativeHandle, useRef, useState } from 'react';
 import clsx from 'clsx';
 
+import { Portal } from '@cloudscape-design/component-toolkit/internal';
+
 import { useInternalI18n } from '../i18n/context';
 import { getBaseProps } from '../internal/base-component';
 import { getFirstFocusable } from '../internal/components/focus-lock/utils';
-import Portal from '../internal/components/portal';
 import { LinkDefaultVariantContext } from '../internal/context/link-default-variant-context';
 import ResetContextsForModal from '../internal/context/reset-contexts-for-modal';
 import { useSingleTabStopNavigation } from '../internal/context/single-tab-stop-navigation-context';