cleanup

mongodb-js · mcasimir · May 13, 2025 · May 13, 2025 · May 13, 2025 · May 13, 2025
commit 9848fc4d7c6e3e25d88c636128c08dfdd514995a
@@ -35,15 +35,6 @@ import { spacing } from '@leafygreen-ui/tokens';
 The Accordion component is a collapsible section that can be used to show and hide content.
 It's commonly used to organize content into expandable sections.
 
-## Key features
-
-- Expandable/collapsible sections
-- Optional hint text
-- Controlled and uncontrolled modes
-- Dark mode support
-- Keyboard navigation
-- ARIA attributes for accessibility
-
 ## Usage
 
 The Accordion component is perfect for:

@@ -50,15 +50,6 @@ import { ItemActionButtonSize } from './constants';
 
 The ItemActionButton component is a button that displays an icon and can be used in item lists or tables. It wraps the SmallIconButton component and adds additional functionality for item actions.
 
-## Key features
-
-- Icon display with optional tooltip
-- Multiple size options
-- Disabled state support
-- Click handler
-- Data attributes for testing and action identification
-- Dark mode support
-
 ## Usage
 
 ```tsx

@@ -26,15 +26,6 @@ import { spacing } from '@leafygreen-ui/tokens';
 The Breadcrumbs component provides navigation context by showing the current location
 in a hierarchical structure. It's commonly used in navigation bars and headers.
 
-## Key features
-
-- Hierarchical navigation display
-- Clickable breadcrumb items
-- Last item is non-clickable
-- Dark mode support
-- Truncation for long text
-- Chevron separators
-
 ## Usage
 
 The Breadcrumbs component is perfect for:

@@ -46,14 +46,6 @@ import {
 The BSONValue component is used to display MongoDB BSON values with proper formatting and type information.
 It supports all BSON types and provides appropriate styling and formatting for each type.
 
-## Key features
-
-- Type-specific formatting and styling
-- Truncation for long values
-- Special handling for encrypted values
-- Support for all BSON types including complex types like ObjectId, Binary, and DBRef
-- Dark mode support
-
 ## Usage
 
 The BSONValue component is perfect for:

@@ -83,14 +83,6 @@ import { spacing } from '@leafygreen-ui/tokens';
 
 The ComboboxWithCustomOption component is a combobox input that allows users to select from a list of options or create a custom option by typing.
 
-## Key features
-
-- Select from a list or create a custom option
-- Multiselect support
-- Custom rendering for options
-- Loading, error, and empty states
-- Consistent styling with LeafyGreen design system
-
 ## Usage
 
 ```tsx

@@ -27,13 +27,6 @@ import { Button } from './leafygreen';
 
 The ContentWithFallback component provides a way to show a fallback UI while content is loading, with smooth transitions between states.
 
-## Key features
-
-- Configurable timeouts for content and fallback display
-- Smooth transitions between states
-- Support for animated content appearance
-- Flexible content and fallback rendering
-
 ## Usage
 
 ```tsx

@@ -33,13 +33,6 @@ import { ServerIcon } from './icons/server-icon';
 
 The EmptyContent component is used to display an empty state with an optional icon, title, subtitle, and call to action.
 
-## Key features
-
-- Customizable icon
-- Title and subtitle
-- Optional call to action
-- Consistent empty state styling
-
 ## Usage
 
 ```tsx

@@ -23,13 +23,6 @@ import { Button } from './leafygreen';
 
 The FadeInPlaceholder component is an enhanced version of ContentWithFallback that provides fade-in animations and absolute positioning for the fallback content.
 
-## Key features
-
-- Fade-in animations for content transitions
-- Absolute positioning for fallback content
-- Configurable timeouts
-- Smooth transitions between states
-
 ## Usage
 
 ```tsx

@@ -49,17 +49,6 @@ import FileInput, { FileInputBackendContext } from './file-input';
 The FileInput component is a file selection input that supports both web and Electron environments.
 It provides a consistent interface for file selection across different platforms.
 
-## Key features
-
-- Multiple variants (default, small, vertical)
-- Support for single and multiple file selection
-- Open and save modes
-- Optional state
-- Error state
-- File filtering
-- Custom button labels
-- Dark mode support
-
 ## Usage
 
 ```tsx

@@ -23,13 +23,6 @@ import { TextInput } from './leafygreen';
 The FormFieldContainer component is a wrapper component that provides consistent spacing
 for form fields. It's designed to be used with LeafyGreen form components.
 
-## Key features
-
-- Consistent vertical spacing between form fields
-- Support for custom class names
-- Test ID support
-- Integration with LeafyGreen form components
-
 ## Usage
 
 ```tsx

@@ -17,12 +17,6 @@ import { HorizontalRule } from './horizontal-rule';
 
 The HorizontalRule component provides a visual separator between content sections.
 
-## Key features
-
-- Consistent styling with LeafyGreen design system
-- Automatic dark mode support
-- Customizable through className prop
-
 ## Usage
 
 ```tsx

@@ -29,12 +29,6 @@ import LeafyGreenProvider from '@leafygreen-ui/leafygreen-provider';
 
 The ChevronCollapse component is a simple icon that displays a chevron pointing in both up and down directions. It's commonly used to indicate collapsible sections or navigation.
 
-## Key features
-
-- Configurable dimensions
-- Automatic dark mode support
-- Consistent styling with LeafyGreen design system
-
 ## Usage
 
 ```tsx

@@ -24,14 +24,6 @@ import IndexIcon from './index-icon';
 The IndexIcon component displays an icon or text representation of an index direction.
 It's commonly used to show the sort direction of database indexes.
 
-## Key features
-
-- Visual representation of index direction
-- Support for ascending (1) and descending (-1) directions
-- Fallback text display for other values
-- Accessible with ARIA labels
-- Custom styling support
-
 ## Usage
 
 ```tsx

@@ -17,14 +17,6 @@ import { IndexKeysBadge, IndexBadge } from './index-keys-badge';
 The IndexKeysBadge component displays a collection of index keys with their sort directions.
 It's used to show the structure of database indexes in a compact and readable format.
 
-## Key features
-
-- Display multiple index keys
-- Support for ascending (1) and descending (-1) sort directions
-- Handle nested field names
-- Compact and readable format
-- Individual IndexBadge component for single key display
-
 ## Usage
 
 ```tsx

@@ -17,12 +17,6 @@ import { InsightsChip } from './insights-chip';
 
 The InsightsChip component is used to display insights or tags in a compact format.
 
-## Key features
-
-- Compact design
-- Consistent styling with LeafyGreen design system
-- Automatic dark mode support
-
 ## Usage
 
 ```tsx

@@ -16,15 +16,6 @@ The Insights components provide a set of UI elements for displaying contextual i
 
 The SignalPopover component displays contextual insights and suggestions in a popover format. It's designed to provide users with helpful information, warnings, or recommendations about their current context or actions.
 
-#### Key features
-
-- Displays single or multiple signals/insights
-- Interactive badge that expands on hover/focus
-- Support for primary actions and learn more links
-- Dark mode support
-- Tracking capabilities via SignalHooksProvider
-- Customizable badge expansion behavior
-
 #### Usage
 
 ```tsx
@@ -136,12 +127,6 @@ import { SignalPopover, SignalHooksProvider } from '@mongodb-js/compass-componen
 
 The InsightsChip component is used to display insights or tags in a compact format. It provides a consistent way to show insights across the application.
 
-#### Key features
-
-- Compact design
-- Consistent styling with LeafyGreen design system
-- Automatic dark mode support
-
 #### Usage
 
 ```tsx

@@ -3,7 +3,7 @@ import { InteractivePopover } from './interactive-popover';
 import { Button } from './leafygreen';
 
 <Meta
-  title="Components/Feedback/InteractivePopover"
+  title="Components/Overlays/InteractivePopover"
   component={InteractivePopover}
 />
 

@@ -19,13 +19,6 @@ import { KeylineCard } from './keyline-card';
 The KeylineCard component is a simple card component with a keyline border.
 It supports different content styles and can be used to display various types of content.
 
-## Key features
-
-- Simple card layout with keyline border
-- Support for clickable content style
-- Flexible content area
-- Consistent styling with LeafyGreen design system
-
 ## Usage
 
 ```tsx

@@ -56,14 +56,6 @@ import { spacing } from '@leafygreen-ui/tokens';
 The ListEditor component provides a way to manage a list of items with add and remove functionality.
 It's designed to be flexible and customizable, allowing for different item renderers and button states.
 
-## Key features
-
-- Add and remove items
-- Custom item rendering
-- Disable add/remove buttons
-- Custom test IDs for testing
-- Consistent styling with LeafyGreen design system
-
 ## Usage
 
 ```tsx

@@ -21,13 +21,6 @@ import { SpinLoader, SpinLoaderWithLabel, CancelLoader } from './loader';
 
 The Loader components provide visual feedback for loading states.
 
-## Key features
-
-- Multiple loader types (Spin, Spin with Label, Cancel)
-- Configurable sizes
-- Optional labels
-- Consistent styling with LeafyGreen design system
-
 ## Usage
 
 ```tsx

@@ -8,7 +8,7 @@ import { ModalFooterButton } from './modal-footer-button';
 import { Button } from '../leafygreen';
 
 <Meta
-  title="Components/Feedback/Modal"
+  title="Components/Overlays/Modal"
   component={Modal}
   parameters={{
     layout: 'centered',
@@ -42,16 +42,6 @@ import { Button } from '../leafygreen';
 The Modal component is a dialog that appears on top of the main content.
 It's designed to focus the user's attention on a specific task or information.
 
-## Key features
-
-- Standard and full-screen modes
-- Custom styling support
-- Scrollable content
-- Dark mode support
-- Stacked component support
-- Form handling
-- Variant support (default, danger, info)
-
 ## Usage
 
 The Modal component is perfect for:

@@ -35,14 +35,6 @@ import { OptionsToggle } from './options-toggle';
 
 The OptionsToggle component is a button that toggles the visibility of additional options or content. It's commonly used to show/hide advanced settings or supplementary information.
 
-## Key features
-
-- Toggle button with expandable/collapsible state
-- Customizable labels for expanded and collapsed states
-- Accessible with ARIA attributes
-- Consistent styling with LeafyGreen design system
-- Support for custom aria labels
-
 ## Usage
 
 ```tsx

@@ -43,13 +43,6 @@ The Placeholder component is a loading state visualization that displays an anim
 It's commonly used to indicate loading states for text content, maintaining the layout structure
 while data is being fetched or processed.
 
-## Key features
-
-- Animated gradient effect for visual feedback
-- Configurable width and height
-- Random width generation based on character ranges
-- Customizable gradient colors
-
 ## Usage
 
 The Placeholder component is perfect for:

@@ -31,14 +31,6 @@ import { RadioBox } from './leafygreen';
 
 The RadioBoxGroup component is a form control that allows users to select a single option from a list of choices.
 
-## Key features
-
-- Single selection from multiple options
-- Support for default and compact sizes
-- Disabled state for individual options
-- Accessible keyboard navigation
-- Consistent styling with LeafyGreen design system
-
 ## Usage
 
 ```tsx

@@ -22,13 +22,6 @@ import { Resizable } from 're-resizable';
 
 The ResizeHandle component is used to create resizable panels and sidebars, typically in conjunction with the `re-resizable` library.
 
-## Key features
-
-- Works with `re-resizable` for drag-to-resize panels
-- Supports multiple directions (left, right, top, bottom)
-- Consistent styling with LeafyGreen design system
-- Keyboard accessible
-
 ## Usage
 
 ```tsx