diff --git a/apps/yaak-client/commands/commands.tsx b/apps/yaak-client/commands/commands.tsx
index 1d00b0b4..516604ed 100644
--- a/apps/yaak-client/commands/commands.tsx
+++ b/apps/yaak-client/commands/commands.tsx
@@ -1,9 +1,9 @@
 import { createWorkspaceModel, type Folder, modelTypeLabel } from '@yaakapp-internal/models';
 import { applySync, calculateSync } from '@yaakapp-internal/sync';
-import { Banner } from '../components/core/Banner';
 import { Button } from '../components/core/Button';
 import { InlineCode } from '../components/core/InlineCode';
 import {
+  Banner,
   Table,
   TableBody,
   TableCell,
diff --git a/apps/yaak-client/components/BinaryFileEditor.tsx b/apps/yaak-client/components/BinaryFileEditor.tsx
index 87676dda..e1a19a20 100644
--- a/apps/yaak-client/components/BinaryFileEditor.tsx
+++ b/apps/yaak-client/components/BinaryFileEditor.tsx
@@ -1,7 +1,7 @@
 import type { HttpRequest } from '@yaakapp-internal/models';
 import mime from 'mime';
 import { useKeyValue } from '../hooks/useKeyValue';
-import { Banner } from './core/Banner';
+import { Banner } from '@yaakapp-internal/ui';
 import { Button } from './core/Button';
 import { InlineCode } from './core/InlineCode';
 import { HStack, VStack } from './core/Stacks';
diff --git a/apps/yaak-client/components/CloneGitRepositoryDialog.tsx b/apps/yaak-client/components/CloneGitRepositoryDialog.tsx
index 9804dd9d..7b8d2fda 100644
--- a/apps/yaak-client/components/CloneGitRepositoryDialog.tsx
+++ b/apps/yaak-client/components/CloneGitRepositoryDialog.tsx
@@ -4,7 +4,7 @@ import { useState } from 'react';
 import { openWorkspaceFromSyncDir } from '../commands/openWorkspaceFromSyncDir';
 import { appInfo } from '../lib/appInfo';
 import { showErrorToast } from '../lib/toast';
-import { Banner } from './core/Banner';
+import { Banner } from '@yaakapp-internal/ui';
 import { Button } from './core/Button';
 import { Checkbox } from './core/Checkbox';
 import { IconButton } from './core/IconButton';
diff --git a/apps/yaak-client/components/ConfirmLargeRequestBody.tsx b/apps/yaak-client/components/ConfirmLargeRequestBody.tsx
index eab5a07e..5cae8308 100644
--- a/apps/yaak-client/components/ConfirmLargeRequestBody.tsx
+++ b/apps/yaak-client/components/ConfirmLargeRequestBody.tsx
@@ -3,7 +3,7 @@ import { patchModel } from '@yaakapp-internal/models';
 import type { ReactNode } from 'react';
 import { useToggle } from '../hooks/useToggle';
 import { showConfirm } from '../lib/confirm';
-import { Banner } from './core/Banner';
+import { Banner } from '@yaakapp-internal/ui';
 import { Button } from './core/Button';
 import { InlineCode } from './core/InlineCode';
 import { Link } from './core/Link';
diff --git a/apps/yaak-client/components/ConfirmLargeResponse.tsx b/apps/yaak-client/components/ConfirmLargeResponse.tsx
index 11a074c4..4de62f19 100644
--- a/apps/yaak-client/components/ConfirmLargeResponse.tsx
+++ b/apps/yaak-client/components/ConfirmLargeResponse.tsx
@@ -6,7 +6,7 @@ import { isProbablyTextContentType } from '../lib/contentType';
 import { getContentTypeFromHeaders } from '../lib/model_util';
 import { getResponseBodyText } from '../lib/responseBody';
 import { CopyButton } from './CopyButton';
-import { Banner } from './core/Banner';
+import { Banner } from '@yaakapp-internal/ui';
 import { Button } from './core/Button';
 import { InlineCode } from './core/InlineCode';
 import { SizeTag } from './core/SizeTag';
diff --git a/apps/yaak-client/components/ConfirmLargeResponseRequest.tsx b/apps/yaak-client/components/ConfirmLargeResponseRequest.tsx
index 80e9fb30..efb1121a 100644
--- a/apps/yaak-client/components/ConfirmLargeResponseRequest.tsx
+++ b/apps/yaak-client/components/ConfirmLargeResponseRequest.tsx
@@ -5,7 +5,7 @@ import { useToggle } from '../hooks/useToggle';
 import { isProbablyTextContentType } from '../lib/contentType';
 import { getContentTypeFromHeaders } from '../lib/model_util';
 import { CopyButton } from './CopyButton';
-import { Banner } from './core/Banner';
+import { Banner } from '@yaakapp-internal/ui';
 import { Button } from './core/Button';
 import { InlineCode } from './core/InlineCode';
 import { SizeTag } from './core/SizeTag';
diff --git a/apps/yaak-client/components/CookieDialog.tsx b/apps/yaak-client/components/CookieDialog.tsx
index 624ee49e..448b30d4 100644
--- a/apps/yaak-client/components/CookieDialog.tsx
+++ b/apps/yaak-client/components/CookieDialog.tsx
@@ -2,7 +2,7 @@ import type { Cookie } from '@yaakapp-internal/models';
 import { cookieJarsAtom, patchModel } from '@yaakapp-internal/models';
 import { useAtomValue } from 'jotai';
 import { cookieDomain } from '../lib/model_util';
-import { Banner } from './core/Banner';
+import { Banner } from '@yaakapp-internal/ui';
 import { IconButton } from './core/IconButton';
 import { InlineCode } from './core/InlineCode';
 
diff --git a/apps/yaak-client/components/DynamicForm.tsx b/apps/yaak-client/components/DynamicForm.tsx
index 00e79300..773fa155 100644
--- a/apps/yaak-client/components/DynamicForm.tsx
+++ b/apps/yaak-client/components/DynamicForm.tsx
@@ -19,7 +19,7 @@ import { useRandomKey } from '../hooks/useRandomKey';
 import { capitalize } from '../lib/capitalize';
 import { showDialog } from '../lib/dialog';
 import { resolvedModelName } from '../lib/resolvedModelName';
-import { Banner } from './core/Banner';
+import { Banner } from '@yaakapp-internal/ui';
 import { Checkbox } from './core/Checkbox';
 import { DetailsBanner } from './core/DetailsBanner';
 import { Editor } from './core/Editor/LazyEditor';
diff --git a/apps/yaak-client/components/EnvironmentColorPicker.tsx b/apps/yaak-client/components/EnvironmentColorPicker.tsx
index 56a66d5f..09e5db6f 100644
--- a/apps/yaak-client/components/EnvironmentColorPicker.tsx
+++ b/apps/yaak-client/components/EnvironmentColorPicker.tsx
@@ -1,6 +1,6 @@
 import { useState } from 'react';
 import { ColorIndicator } from './ColorIndicator';
-import { Banner } from './core/Banner';
+import { Banner } from '@yaakapp-internal/ui';
 import { Button } from './core/Button';
 import { ColorPickerWithThemeColors } from './core/ColorPicker';
 
diff --git a/apps/yaak-client/components/EnvironmentEditDialog.tsx b/apps/yaak-client/components/EnvironmentEditDialog.tsx
index 2322c0fd..2e1e1b2e 100644
--- a/apps/yaak-client/components/EnvironmentEditDialog.tsx
+++ b/apps/yaak-client/components/EnvironmentEditDialog.tsx
@@ -1,7 +1,7 @@
 import type { Environment, Workspace } from '@yaakapp-internal/models';
 import { duplicateModel, patchModel } from '@yaakapp-internal/models';
 import type { TreeHandle, TreeNode, TreeProps } from '@yaakapp-internal/ui';
-import { Icon, SplitLayout, Tree } from '@yaakapp-internal/ui';
+import { Banner, Icon, SplitLayout, Tree } from '@yaakapp-internal/ui';
 import { atom, useAtomValue } from 'jotai';
 import { atomFamily } from 'jotai/utils';
 import { useCallback, useLayoutEffect, useRef, useState } from 'react';
@@ -18,7 +18,6 @@ import { jotaiStore } from '../lib/jotai';
 import { isBaseEnvironment, isSubEnvironment } from '../lib/model_util';
 import { resolvedModelName } from '../lib/resolvedModelName';
 import { showColorPicker } from '../lib/showColorPicker';
-import { Banner } from './core/Banner';
 import type { ContextMenuProps, DropdownItem } from './core/Dropdown';
 import { ContextMenu } from './core/Dropdown';
 import { IconButton } from './core/IconButton';
diff --git a/apps/yaak-client/components/ErrorBoundary.tsx b/apps/yaak-client/components/ErrorBoundary.tsx
index 89aab27c..2dad0e2b 100644
--- a/apps/yaak-client/components/ErrorBoundary.tsx
+++ b/apps/yaak-client/components/ErrorBoundary.tsx
@@ -1,7 +1,7 @@
 import type { ErrorInfo, ReactNode } from 'react';
 import { Component, useEffect } from 'react';
 import { showDialog } from '../lib/dialog';
-import { Banner } from './core/Banner';
+import { Banner } from '@yaakapp-internal/ui';
 import { Button } from './core/Button';
 import { InlineCode } from './core/InlineCode';
 import RouteError from './RouteError';
diff --git a/apps/yaak-client/components/GrpcConnectionLayout.tsx b/apps/yaak-client/components/GrpcConnectionLayout.tsx
index dd519346..1c850049 100644
--- a/apps/yaak-client/components/GrpcConnectionLayout.tsx
+++ b/apps/yaak-client/components/GrpcConnectionLayout.tsx
@@ -7,10 +7,9 @@ import { useActiveRequest } from '../hooks/useActiveRequest';
 import { useGrpc } from '../hooks/useGrpc';
 import { useGrpcProtoFiles } from '../hooks/useGrpcProtoFiles';
 import { activeGrpcConnectionAtom, useGrpcEvents } from '../hooks/usePinnedGrpcConnection';
-import { SplitLayout } from '@yaakapp-internal/ui';
+import { Banner, SplitLayout } from '@yaakapp-internal/ui';
 import { activeWorkspaceAtom } from '../hooks/useActiveWorkspace';
 import { workspaceLayoutAtom } from '../lib/atoms';
-import { Banner } from './core/Banner';
 import { HotkeyList } from './core/HotkeyList';
 import { GrpcRequestPane } from './GrpcRequestPane';
 import { GrpcResponsePane } from './GrpcResponsePane';
diff --git a/apps/yaak-client/components/GrpcProtoSelectionDialog.tsx b/apps/yaak-client/components/GrpcProtoSelectionDialog.tsx
index fb107000..bc46627e 100644
--- a/apps/yaak-client/components/GrpcProtoSelectionDialog.tsx
+++ b/apps/yaak-client/components/GrpcProtoSelectionDialog.tsx
@@ -4,9 +4,8 @@ import { useActiveRequest } from '../hooks/useActiveRequest';
 import { useGrpc } from '../hooks/useGrpc';
 import { useGrpcProtoFiles } from '../hooks/useGrpcProtoFiles';
 import { pluralizeCount } from '../lib/pluralize';
-import { Banner } from './core/Banner';
 import { Button } from './core/Button';
-import { Icon } from '@yaakapp-internal/ui';
+import { Banner, Icon } from '@yaakapp-internal/ui';
 import { IconButton } from './core/IconButton';
 import { InlineCode } from './core/InlineCode';
 import { Link } from './core/Link';
diff --git a/apps/yaak-client/components/HttpResponsePane.tsx b/apps/yaak-client/components/HttpResponsePane.tsx
index b90bee28..d08013af 100644
--- a/apps/yaak-client/components/HttpResponsePane.tsx
+++ b/apps/yaak-client/components/HttpResponsePane.tsx
@@ -12,13 +12,12 @@ import { getMimeTypeFromContentType } from '../lib/contentType';
 import { getContentTypeFromHeaders, getCookieCounts } from '../lib/model_util';
 import { ConfirmLargeResponse } from './ConfirmLargeResponse';
 import { ConfirmLargeResponseRequest } from './ConfirmLargeResponseRequest';
-import { Banner } from './core/Banner';
 import { Button } from './core/Button';
 import { CountBadge } from './core/CountBadge';
 import { HotkeyList } from './core/HotkeyList';
 import { HttpResponseDurationTag } from './core/HttpResponseDurationTag';
 import { HttpStatusTag } from './core/HttpStatusTag';
-import { Icon, LoadingIcon } from '@yaakapp-internal/ui';
+import { Banner, Icon, LoadingIcon } from '@yaakapp-internal/ui';
 import { PillButton } from './core/PillButton';
 import { SizeTag } from './core/SizeTag';
 import { HStack, VStack } from './core/Stacks';
diff --git a/apps/yaak-client/components/JsonBodyEditor.tsx b/apps/yaak-client/components/JsonBodyEditor.tsx
index 033cac3f..5f1d8765 100644
--- a/apps/yaak-client/components/JsonBodyEditor.tsx
+++ b/apps/yaak-client/components/JsonBodyEditor.tsx
@@ -1,11 +1,10 @@
 import { linter } from '@codemirror/lint';
 import type { HttpRequest } from '@yaakapp-internal/models';
 import { patchModel } from '@yaakapp-internal/models';
-import { Icon } from '@yaakapp-internal/ui';
+import { Banner, Icon } from '@yaakapp-internal/ui';
 import { useCallback, useMemo } from 'react';
 import { useKeyValue } from '../hooks/useKeyValue';
 import { textLikelyContainsJsonComments } from '../lib/jsonComments';
-import { Banner } from './core/Banner';
 import type { DropdownItem } from './core/Dropdown';
 import { Dropdown } from './core/Dropdown';
 import type { EditorProps } from './core/Editor/Editor';
diff --git a/apps/yaak-client/components/Settings/SettingsLicense.tsx b/apps/yaak-client/components/Settings/SettingsLicense.tsx
index e88bc33e..e2cb4ccb 100644
--- a/apps/yaak-client/components/Settings/SettingsLicense.tsx
+++ b/apps/yaak-client/components/Settings/SettingsLicense.tsx
@@ -6,9 +6,8 @@ import { useState } from 'react';
 import { useToggle } from '../../hooks/useToggle';
 import { pluralizeCount } from '../../lib/pluralize';
 import { CargoFeature } from '../CargoFeature';
-import { Banner } from '../core/Banner';
 import { Button } from '../core/Button';
-import { Icon } from '@yaakapp-internal/ui';
+import { Banner, Icon } from '@yaakapp-internal/ui';
 import { Link } from '../core/Link';
 import { PlainInput } from '../core/PlainInput';
 import { Separator } from '../core/Separator';
diff --git a/apps/yaak-client/components/SyncToFilesystemSetting.tsx b/apps/yaak-client/components/SyncToFilesystemSetting.tsx
index b9afcc84..94a812a3 100644
--- a/apps/yaak-client/components/SyncToFilesystemSetting.tsx
+++ b/apps/yaak-client/components/SyncToFilesystemSetting.tsx
@@ -1,7 +1,7 @@
 import { readDir } from '@tauri-apps/plugin-fs';
 import { useState } from 'react';
 import { openWorkspaceFromSyncDir } from '../commands/openWorkspaceFromSyncDir';
-import { Banner } from './core/Banner';
+import { Banner } from '@yaakapp-internal/ui';
 import { Button } from './core/Button';
 import { Checkbox } from './core/Checkbox';
 import { VStack } from './core/Stacks';
diff --git a/apps/yaak-client/components/Workspace.tsx b/apps/yaak-client/components/Workspace.tsx
index a2e7dfa9..25f89e34 100644
--- a/apps/yaak-client/components/Workspace.tsx
+++ b/apps/yaak-client/components/Workspace.tsx
@@ -1,6 +1,6 @@
 import { type } from '@tauri-apps/plugin-os';
 import { settingsAtom, workspacesAtom } from '@yaakapp-internal/models';
-import { HeaderSize, SidebarLayout } from '@yaakapp-internal/ui';
+import { Banner, HeaderSize, SidebarLayout } from '@yaakapp-internal/ui';
 import classNames from 'classnames';
 import { useAtomValue } from 'jotai';
 import * as m from 'motion/react-m';
@@ -31,7 +31,6 @@ import { duplicateRequestOrFolderAndNavigate } from '../lib/duplicateRequestOrFo
 import { importData } from '../lib/importData';
 import { jotaiStore } from '../lib/jotai';
 import { CreateDropdown } from './CreateDropdown';
-import { Banner } from './core/Banner';
 import { Button } from './core/Button';
 import { HotkeyList } from './core/HotkeyList';
 import { FeedbackLink } from './core/Link';
diff --git a/apps/yaak-client/components/WorkspaceEncryptionSetting.tsx b/apps/yaak-client/components/WorkspaceEncryptionSetting.tsx
index 25bd1136..ac927a0e 100644
--- a/apps/yaak-client/components/WorkspaceEncryptionSetting.tsx
+++ b/apps/yaak-client/components/WorkspaceEncryptionSetting.tsx
@@ -13,7 +13,7 @@ import { createFastMutation } from '../hooks/useFastMutation';
 import { useStateWithDeps } from '../hooks/useStateWithDeps';
 import { showConfirm } from '../lib/confirm';
 import { CopyIconButton } from './CopyIconButton';
-import { Banner } from './core/Banner';
+import { Banner } from '@yaakapp-internal/ui';
 import type { ButtonProps } from './core/Button';
 import { Button } from './core/Button';
 import { IconButton } from './core/IconButton';
diff --git a/apps/yaak-client/components/WorkspaceSettingsDialog.tsx b/apps/yaak-client/components/WorkspaceSettingsDialog.tsx
index f53f0253..32ef1a92 100644
--- a/apps/yaak-client/components/WorkspaceSettingsDialog.tsx
+++ b/apps/yaak-client/components/WorkspaceSettingsDialog.tsx
@@ -6,7 +6,7 @@ import { useInheritedHeaders } from '../hooks/useInheritedHeaders';
 import { deleteModelWithConfirm } from '../lib/deleteModelWithConfirm';
 import { router } from '../lib/router';
 import { CopyIconButton } from './CopyIconButton';
-import { Banner } from './core/Banner';
+import { Banner } from '@yaakapp-internal/ui';
 import { Button } from './core/Button';
 import { CountBadge } from './core/CountBadge';
 import { InlineCode } from './core/InlineCode';
diff --git a/apps/yaak-client/components/core/DetailsBanner.tsx b/apps/yaak-client/components/core/DetailsBanner.tsx
index df0f3c4c..ce7901a3 100644
--- a/apps/yaak-client/components/core/DetailsBanner.tsx
+++ b/apps/yaak-client/components/core/DetailsBanner.tsx
@@ -3,8 +3,8 @@ import { atom, useAtom } from 'jotai';
 import type { HTMLAttributes, ReactNode } from 'react';
 import { useMemo } from 'react';
 import { atomWithKVStorage } from '../../lib/atoms/atomWithKVStorage';
-import type { BannerProps } from './Banner';
-import { Banner } from './Banner';
+import type { BannerProps } from '@yaakapp-internal/ui';
+import { Banner } from '@yaakapp-internal/ui';
 
 interface Props extends HTMLAttributes<HTMLDetailsElement> {
   summary: ReactNode;
diff --git a/apps/yaak-client/components/core/DismissibleBanner.tsx b/apps/yaak-client/components/core/DismissibleBanner.tsx
index e54b0ed1..92579934 100644
--- a/apps/yaak-client/components/core/DismissibleBanner.tsx
+++ b/apps/yaak-client/components/core/DismissibleBanner.tsx
@@ -1,8 +1,8 @@
 import type { Color } from '@yaakapp-internal/plugins';
 import classNames from 'classnames';
 import { useKeyValue } from '../../hooks/useKeyValue';
-import type { BannerProps } from './Banner';
-import { Banner } from './Banner';
+import type { BannerProps } from '@yaakapp-internal/ui';
+import { Banner } from '@yaakapp-internal/ui';
 import { Button } from './Button';
 import { HStack } from './Stacks';
 
diff --git a/apps/yaak-client/components/core/EventViewer.tsx b/apps/yaak-client/components/core/EventViewer.tsx
index 329c0abf..72cfba0c 100644
--- a/apps/yaak-client/components/core/EventViewer.tsx
+++ b/apps/yaak-client/components/core/EventViewer.tsx
@@ -5,10 +5,9 @@ import { useCallback, useMemo, useRef, useState } from 'react';
 import { useEventViewerKeyboard } from '../../hooks/useEventViewerKeyboard';
 import { CopyIconButton } from '../CopyIconButton';
 import { AutoScroller } from './AutoScroller';
-import { Banner } from './Banner';
 import { Button } from './Button';
 import { Separator } from './Separator';
-import { SplitLayout } from '@yaakapp-internal/ui';
+import { Banner, SplitLayout } from '@yaakapp-internal/ui';
 import { HStack } from './Stacks';
 import { IconButton } from './IconButton';
 import classNames from 'classnames';
diff --git a/apps/yaak-client/components/git/GitCommitDialog.tsx b/apps/yaak-client/components/git/GitCommitDialog.tsx
index 60343fed..d7269b79 100644
--- a/apps/yaak-client/components/git/GitCommitDialog.tsx
+++ b/apps/yaak-client/components/git/GitCommitDialog.tsx
@@ -14,16 +14,14 @@ import { useCallback, useMemo, useState } from 'react';
 import { modelToYaml } from '../../lib/diffYaml';
 import { resolvedModelName } from '../../lib/resolvedModelName';
 import { showErrorToast } from '../../lib/toast';
-import { Banner } from '../core/Banner';
 import { Button } from '../core/Button';
 import type { CheckboxProps } from '../core/Checkbox';
 import { Checkbox } from '../core/Checkbox';
 import { DiffViewer } from '../core/Editor/DiffViewer';
-import { Icon } from '@yaakapp-internal/ui';
+import { Banner, Icon, SplitLayout } from '@yaakapp-internal/ui';
 import { InlineCode } from '../core/InlineCode';
 import { Input } from '../core/Input';
 import { Separator } from '../core/Separator';
-import { SplitLayout } from '@yaakapp-internal/ui';
 import { HStack } from '../core/Stacks';
 import { EmptyStateText } from '../EmptyStateText';
 import { gitCallbacks } from './callbacks';
diff --git a/apps/yaak-client/components/git/GitDropdown.tsx b/apps/yaak-client/components/git/GitDropdown.tsx
index 803e835c..4ca06172 100644
--- a/apps/yaak-client/components/git/GitDropdown.tsx
+++ b/apps/yaak-client/components/git/GitDropdown.tsx
@@ -13,10 +13,9 @@ import { showConfirm, showConfirmDelete } from '../../lib/confirm';
 import { showDialog } from '../../lib/dialog';
 import { showPrompt } from '../../lib/prompt';
 import { showErrorToast, showToast } from '../../lib/toast';
-import { Banner } from '../core/Banner';
 import type { DropdownItem } from '../core/Dropdown';
 import { Dropdown } from '../core/Dropdown';
-import { Icon } from '@yaakapp-internal/ui';
+import { Banner, Icon } from '@yaakapp-internal/ui';
 import { InlineCode } from '../core/InlineCode';
 import { gitCallbacks } from './callbacks';
 import { GitCommitDialog } from './GitCommitDialog';
diff --git a/apps/yaak-client/components/git/credentials.tsx b/apps/yaak-client/components/git/credentials.tsx
index 0cfe0865..6a90aa28 100644
--- a/apps/yaak-client/components/git/credentials.tsx
+++ b/apps/yaak-client/components/git/credentials.tsx
@@ -1,5 +1,5 @@
 import { showPromptForm } from '../../lib/prompt-form';
-import { Banner } from '../core/Banner';
+import { Banner } from '@yaakapp-internal/ui';
 import { InlineCode } from '../core/InlineCode';
 
 export interface GitCredentials {
diff --git a/apps/yaak-client/components/graphql/GraphQLDocsExplorer.tsx b/apps/yaak-client/components/graphql/GraphQLDocsExplorer.tsx
index 6ba07854..bf0c75cc 100644
--- a/apps/yaak-client/components/graphql/GraphQLDocsExplorer.tsx
+++ b/apps/yaak-client/components/graphql/GraphQLDocsExplorer.tsx
@@ -24,11 +24,10 @@ import { useAtomValue } from 'jotai';
 import type { CSSProperties, HTMLAttributes, KeyboardEvent, ReactNode } from 'react';
 import { Fragment, memo, useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import { useClickOutside } from '../../hooks/useClickOutside';
-import { useContainerSize } from '@yaakapp-internal/ui';
+import { Banner, useContainerSize } from '@yaakapp-internal/ui';
 import { Icon, useDebouncedValue } from '@yaakapp-internal/ui';
 import { useStateWithDeps } from '../../hooks/useStateWithDeps';
 import { jotaiStore } from '../../lib/jotai';
-import { Banner } from '../core/Banner';
 import { CountBadge } from '../core/CountBadge';
 import { IconButton } from '../core/IconButton';
 import { PlainInput } from '../core/PlainInput';
diff --git a/apps/yaak-client/components/graphql/GraphQLEditor.tsx b/apps/yaak-client/components/graphql/GraphQLEditor.tsx
index 4f0edef7..d72b7d95 100644
--- a/apps/yaak-client/components/graphql/GraphQLEditor.tsx
+++ b/apps/yaak-client/components/graphql/GraphQLEditor.tsx
@@ -6,14 +6,13 @@ import { useLocalStorage } from 'react-use';
 import { useIntrospectGraphQL } from '../../hooks/useIntrospectGraphQL';
 import { useStateWithDeps } from '../../hooks/useStateWithDeps';
 import { showDialog } from '../../lib/dialog';
-import { Banner } from '../core/Banner';
 import { Button } from '../core/Button';
 import type { DropdownItem } from '../core/Dropdown';
 import { Dropdown } from '../core/Dropdown';
 import type { EditorProps } from '../core/Editor/Editor';
 import { Editor } from '../core/Editor/LazyEditor';
 import { FormattedError } from '../core/FormattedError';
-import { Icon } from '@yaakapp-internal/ui';
+import { Banner, Icon } from '@yaakapp-internal/ui';
 import { Separator } from '../core/Separator';
 import { tryFormatGraphql } from '../../lib/formatters';
 import { showGraphQLDocExplorerAtom } from './graphqlAtoms';
diff --git a/apps/yaak-client/components/responseViewers/BinaryViewer.tsx b/apps/yaak-client/components/responseViewers/BinaryViewer.tsx
index e647ec1a..28fc3ef4 100644
--- a/apps/yaak-client/components/responseViewers/BinaryViewer.tsx
+++ b/apps/yaak-client/components/responseViewers/BinaryViewer.tsx
@@ -1,10 +1,9 @@
 import type { HttpResponse } from '@yaakapp-internal/models';
 import { useSaveResponse } from '../../hooks/useSaveResponse';
 import { getContentTypeFromHeaders } from '../../lib/model_util';
-import { Banner } from '../core/Banner';
 import { Button } from '../core/Button';
 import { InlineCode } from '../core/InlineCode';
-import { LoadingIcon } from '@yaakapp-internal/ui';
+import { Banner, LoadingIcon } from '@yaakapp-internal/ui';
 import { EmptyStateText } from '../EmptyStateText';
 
 interface Props {
diff --git a/apps/yaak-client/components/responseViewers/MultipartViewer.tsx b/apps/yaak-client/components/responseViewers/MultipartViewer.tsx
index e5dba255..4adfd570 100644
--- a/apps/yaak-client/components/responseViewers/MultipartViewer.tsx
+++ b/apps/yaak-client/components/responseViewers/MultipartViewer.tsx
@@ -1,8 +1,7 @@
 import { type MultipartPart, parseMultipart } from '@mjackson/multipart-parser';
 import { lazy, Suspense, useMemo } from 'react';
 import { languageFromContentType } from '../../lib/contentType';
-import { Banner } from '../core/Banner';
-import { Icon, LoadingIcon } from '@yaakapp-internal/ui';
+import { Banner, Icon, LoadingIcon } from '@yaakapp-internal/ui';
 import { TabContent, Tabs } from '../core/Tabs/Tabs';
 import { AudioViewer } from './AudioViewer';
 import { CsvViewer } from './CsvViewer';
diff --git a/apps/yaak-client/components/core/Banner.tsx b/packages/ui/src/components/Banner.tsx
similarity index 100%
rename from apps/yaak-client/components/core/Banner.tsx
rename to packages/ui/src/components/Banner.tsx
diff --git a/packages/ui/src/components/tree/TreeItem.tsx b/packages/ui/src/components/tree/TreeItem.tsx
index 3fd5584d..b7cd3349 100644
--- a/packages/ui/src/components/tree/TreeItem.tsx
+++ b/packages/ui/src/components/tree/TreeItem.tsx
@@ -10,7 +10,6 @@ import type {
 } from 'react';
 import { memo, useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import { computeSideForDragMove } from '../../lib/dnd';
-import type { ContextMenuRenderer } from './common';
 import { Icon } from '../Icon';
 import { isLastFocusedFamily, isSelectedFamily } from './atoms';
 import { useCollapsedAtom, useIsAncestorCollapsed, useIsCollapsed, useSetCollapsed } from './context';
diff --git a/packages/ui/src/index.ts b/packages/ui/src/index.ts
index b661e565..a250cc2e 100644
--- a/packages/ui/src/index.ts
+++ b/packages/ui/src/index.ts
@@ -31,3 +31,5 @@ export { useContainerSize } from "./hooks/useContainerSize";
 export { Overlay } from "./components/Overlay";
 export { Portal } from "./components/Portal";
 export { usePortal } from "./hooks/usePortal";
+export { Banner } from "./components/Banner";
+export type { BannerProps } from "./components/Banner";