Replace root import by direct component imports to avoid circular dependencies

Author: andreas-schultz

src/cmem/ActivityControl/SilkActivityControl.tsx

@@ -1,9 +1,10 @@
 import React, { useEffect, useRef, useState } from "react";
 import { Intent } from "@blueprintjs/core/src/common/intent";
 
-import { Icon, Spacing } from "../../";
 import { IntentTypes } from "../../common/Intent";
+import { Icon } from "../../components/Icon/Icon";
 import { TestableComponent } from "../../components/interfaces";
+import { Spacing } from "../../components/Separation/Spacing";
 import { ElapsedDateTimeDisplay, ElapsedDateTimeDisplayUnits } from "../DateTimeDisplay/ElapsedDateTimeDisplay";
 
 import { SilkActivityStatusConcrete, SilkActivityStatusProps } from "./ActivityControlTypes";

src/cmem/react-flow/StickyNoteModal/StickyNoteModal.tsx

@@ -1,20 +1,15 @@
 import React from "react";
 
 import getColorConfiguration from "../../../common/utils/getColorConfiguration";
-import { CodeEditor } from "../../../extensions";
+import { Button } from "../../../components/Button/Button";
+import { SimpleDialog, type SimpleDialogProps } from "../../../components/Dialog/SimpleDialog";
+import { FieldItem } from "../../../components/Form/FieldItem";
+import { Icon } from "../../../components/Icon/Icon";
+import Tag from "../../../components/Tag/Tag";
+import TagList from "../../../components/Tag/TagList";
+import { CodeEditor, type CodeEditorProps } from "../../../extensions/codemirror/CodeMirror";
 import { ReactFlowHotkeyContext } from "../extensions/ReactFlowHotkeyContext";
 
-import {
-    Button,
-    CodeEditorProps,
-    FieldItem,
-    Icon,
-    SimpleDialog,
-    SimpleDialogProps,
-    Tag,
-    TagList,
-} from "./../../../index";
-
 export type StickyNoteModalTranslationKeys = "modalTitle" | "noteLabel" | "colorLabel" | "saveButton" | "cancelButton";
 
 export type StickyNoteMetadataType = { note: string; color: string };

src/components/AutoSuggestion/AutoSuggestion.tsx

@@ -7,8 +7,13 @@ import { debounce } from "lodash";
 import { IntentTypes } from "../../common/Intent";
 import { CLASSPREFIX as eccgui } from "../../configuration/constants";
 import { SupportedCodeEditorModes } from "../../extensions/codemirror/hooks/useCodemirrorModeExtension.hooks";
+import { ContextOverlay } from "../ContextOverlay/ContextOverlay";
+import { FieldItem } from "../Form/FieldItem";
+import { IconButton } from "../Icon/IconButton";
+import { Spinner } from "../Spinner/Spinner";
+import { Toolbar } from "../Toolbar/Toolbar";
+import { ToolbarSection } from "../Toolbar/ToolbarSection";
 
-import { ContextOverlay, FieldItem, IconButton, Spinner, Toolbar, ToolbarSection } from "./../../";
 import { markText, removeMarkFromText } from "./extensions/markText";
 import { AutoSuggestionList } from "./AutoSuggestionList";
 //custom components

src/components/AutoSuggestion/AutoSuggestionList.tsx

@@ -2,19 +2,16 @@ import React from "react";
 import { compute } from "compute-scroll-into-view";
 
 import { CLASSPREFIX as eccgui } from "../../configuration/constants";
-
-import {
-    Highlighter,
-    Menu,
-    MenuItem,
-    OverflowText,
-    OverviewItem,
-    OverviewItemDescription,
-    OverviewItemLine,
-    Spacing,
-    Spinner,
-    Tooltip,
-} from "./../../";
+import { Menu } from "../Menu/Menu";
+import { MenuItem } from "../Menu/MenuItem";
+import { OverviewItem } from "../OverviewItem/OverviewItem";
+import { OverviewItemDescription } from "../OverviewItem/OverviewItemDescription";
+import { OverviewItemLine } from "../OverviewItem/OverviewItemLine";
+import { Spacing } from "../Separation/Spacing";
+import { Spinner } from "../Spinner/Spinner";
+import { Tooltip } from "../Tooltip/Tooltip";
+import { Highlighter } from "../Typography/Highlighter";
+import { OverflowText } from "../Typography/OverflowText";
 import { CodeAutocompleteFieldSuggestionWithReplacementInfo } from "./AutoSuggestion";
 
 export interface AutoSuggestionListProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "children"> {

src/components/AutocompleteField/AutoCompleteField.tsx

@@ -7,16 +7,14 @@ import { Suggest as BlueprintSuggest } from "@blueprintjs/select";
 
 import { preventReactFlowDragClass } from "../../cmem/react-flow/ReactFlow/constants";
 import { CLASSPREFIX as eccgui } from "../../configuration/constants";
-import {
-    ContextOverlayProps,
-    Highlighter,
-    IconButton,
-    Menu,
-    MenuItem,
-    Notification,
-    OverflowText,
-    Spinner,
-} from "../../index";
+import type { ContextOverlayProps } from "../ContextOverlay/ContextOverlay";
+import { IconButton } from "../Icon/IconButton";
+import { Menu } from "../Menu/Menu";
+import { MenuItem } from "../Menu/MenuItem";
+import { Notification } from "../Notification/Notification";
+import { Spinner } from "../Spinner/Spinner";
+import { Highlighter } from "../Typography/Highlighter";
+import { OverflowText } from "../Typography/OverflowText";
 
 import { SuggestFieldItemRendererModifierProps } from "./interfaces";
 

src/components/MultiSelect/MultiSelect.tsx

@@ -11,18 +11,13 @@ import { uniqBy } from "lodash";
 import { IntentBlueprint } from "../../common/Intent";
 import { removeExtraSpaces } from "../../common/utils/stringUtils";
 import { CLASSPREFIX as eccgui } from "../../configuration/constants";
+import type { ContextOverlayProps } from "../ContextOverlay/ContextOverlay";
+import { IconButton } from "../Icon/IconButton";
 import { TestableComponent } from "../interfaces";
-import { MenuItemProps } from "../Menu/MenuItem";
-
-import {
-    ContextOverlayProps,
-    Highlighter,
-    highlighterUtils,
-    IconButton,
-    MenuItem,
-    OverflowText,
-    Spinner,
-} from "./../../index";
+import { MenuItem, type MenuItemProps } from "../Menu/MenuItem";
+import { Spinner } from "../Spinner/Spinner";
+import { Highlighter, highlighterUtils } from "../Typography/Highlighter";
+import { OverflowText } from "../Typography/OverflowText";
 
 export interface MultiSuggestFieldSelectionProps<T> {
     newlySelected?: T;

src/components/NotAvailable/NotAvailable.tsx

@@ -1,7 +1,9 @@
 import React from "react";
 
-import { CLASSPREFIX as eccgui, Tag, TagProps, Tooltip, TooltipProps } from "../../index";
+import { CLASSPREFIX as eccgui } from "../../configuration/constants";
 import { TestableComponent } from "../interfaces";
+import Tag, { type TagProps } from "../Tag/Tag";
+import { Tooltip, type TooltipProps } from "../Tooltip/Tooltip";
 export interface NotAvailableProps
     extends TestableComponent, Pick<TagProps, "icon" | "className">, Pick<TooltipProps, "intent"> {
     /**

src/components/VisualTour/VisualTour.tsx

@@ -1,25 +1,23 @@
 import React from "react";
 import { createPortal } from "react-dom";
 
+import { Markdown } from "../../cmem/markdown/Markdown";
 import { CLASSPREFIX as eccgui } from "../../configuration/constants";
-import {
-    Badge,
-    Button,
-    Card,
-    CardActions,
-    CardActionsAux,
-    CardContent,
-    CardHeader,
-    CardOptions,
-    CardTitle,
-    DecoupledOverlay,
-    IconButton,
-    Markdown,
-    ModalSize,
-    SimpleDialog,
-    Spacing,
-    TooltipSize,
-} from "../../index";
+import { Badge } from "../Badge/Badge";
+import { Button } from "../Button/Button";
+import { Card } from "../Card/Card";
+import { CardActions } from "../Card/CardActions";
+import { CardActionsAux } from "../Card/CardActionsAux";
+import { CardContent } from "../Card/CardContent";
+import { CardHeader } from "../Card/CardHeader";
+import { CardOptions } from "../Card/CardOptions";
+import { CardTitle } from "../Card/CardTitle";
+import { DecoupledOverlay } from "../DecoupledOverlay/DecoupledOverlay";
+import type { ModalSize } from "../Dialog/Modal";
+import { SimpleDialog } from "../Dialog/SimpleDialog";
+import { IconButton } from "../Icon/IconButton";
+import { Spacing } from "../Separation/Spacing";
+import type { TooltipSize } from "../Tooltip/Tooltip";
 
 export interface VisualTourProps {
     /** The steps of the tour. */