# PowerPoint Toolbox UML Diagram

This UML diagram represents the structure and relationships of the PowerPoint toolbox add-in.

```mermaid
classDiagram
    %% Main Application Component
    class App {
        +title: string
        +statusMessage: string
        +statusType: StatusType
        +isProcessing: boolean
        +setStatusMessage(message: string)
        +setStatusType(type: StatusType)
        +setIsProcessing(processing: boolean)
        +getStatusIcon()
    }

    %% Context Provider
    class StatusContext {
        <<Context>>
        +statusMessage: string
        +setStatusMessage: function
        +statusType: StatusType
        +setStatusType: function
        +isProcessing: boolean
        +setIsProcessing: function
    }

    %% Common UI Components
    class Section {
        +title: string
        +children: ReactNode
    }

    class ActionButton {
        +icon: ReactNode
        +onClick: function
        +disabled: boolean
        +title: string
        +appearance: string
        +className: string
        +handleClick()
    }

    %% Feature Components
    class MatchSizes {
        -validateShapeSelection(shapes): boolean
        -loadSourceShape(sourceShape, context, matchType): Promise
        -applySizeChanges(sourceShape, shapes, matchType): number
        -generateStatusMessage(resizedCount, matchType): string
        -matchSizeToFirstSelected(matchType): Promise
    }

    class MatchProperties {
        <<Component>>
    }

    class RoundImage {
        <<Component>>
    }

    class SwapPositions {
        <<Component>>
    }

    class InsertTitles {
        <<Component>>
    }

    class ConfidentialButtons {
        <<Component>>
    }

    class DraftButtons {
        <<Component>>
    }

    class ProgressBarButtons {
        <<Component>>
    }

    class AlignmentButtons {
        <<Component>>
    }

    class GridGuidelineManager {
        <<Component>>
    }

    %% Utility Types
    class OfficeTypes {
        <<Utility>>
        +getErrorMessage(error): string
        +isPictureShape(shape): boolean
        +getFirstSelectedSlide(context): PowerPoint.Slide
        +selectShapesById(slide, shapeIds): void
    }

    class CommonStyles {
        <<Styles>>
        +container: style
        +buttonGroup: style
        +actionButton: style
        +statusContainer: style
        +successStatus: style
        +warningStatus: style
        +errorStatus: style
        +statusIcon: style
        +statusText: style
    }

    %% Relationships
    App *-- StatusContext : provides
    App *-- Section : contains
    Section *-- MatchSizes : contains
    Section *-- MatchProperties : contains
    Section *-- RoundImage : contains
    Section *-- SwapPositions : contains
    Section *-- InsertTitles : contains
    Section *-- ConfidentialButtons : contains
    Section *-- DraftButtons : contains
    Section *-- ProgressBarButtons : contains
    Section *-- AlignmentButtons : contains
    Section *-- GridGuidelineManager : contains
    
    MatchSizes --> ActionButton : uses
    MatchSizes --> OfficeTypes : uses
    MatchSizes --> StatusContext : consumes
    MatchSizes --> CommonStyles : uses
    
    ActionButton --> StatusContext : consumes
    ActionButton --> CommonStyles : uses
    ActionButton --> OfficeTypes : uses
    
    %% Other components follow similar patterns
    MatchProperties --> ActionButton : uses
    MatchProperties --> StatusContext : consumes
    RoundImage --> ActionButton : uses
    RoundImage --> StatusContext : consumes
    SwapPositions --> ActionButton : uses
    SwapPositions --> StatusContext : consumes
    InsertTitles --> ActionButton : uses
    InsertTitles --> StatusContext : consumes
    ConfidentialButtons --> ActionButton : uses
    ConfidentialButtons --> StatusContext : consumes
    DraftButtons --> ActionButton : uses
    DraftButtons --> StatusContext : consumes
    ProgressBarButtons --> ActionButton : uses
    ProgressBarButtons --> StatusContext : consumes
    AlignmentButtons --> ActionButton : uses
    AlignmentButtons --> StatusContext : consumes
    GridGuidelineManager --> ActionButton : uses
    GridGuidelineManager --> StatusContext : consumes
```

## Diagram Explanation

This UML diagram shows:

1. **App Component**: The main container component that provides the StatusContext to all child components.

2. **StatusContext**: A React context that manages status messages and processing state across the application.

3. **UI Components**:
   - **Section**: A reusable component for grouping related functionality
   - **ActionButton**: A reusable button component with built-in error handling and status updates

4. **Feature Components**: Various tools for PowerPoint manipulation:
   - MatchSizes: For matching dimensions between shapes
   - MatchProperties: For matching properties between shapes
   - RoundImage: For rounding image corners
   - SwapPositions: For swapping positions of shapes
   - InsertTitles: For inserting title slides
   - ConfidentialButtons: For adding confidential markings
   - DraftButtons: For adding draft watermarks
   - ProgressBarButtons: For managing progress bars
   - AlignmentButtons: For aligning shapes
   - GridGuidelineManager: For managing grid guidelines

5. **Utility Types**: Helper functions and types for Office JS API integration

6. **Relationships**: Shows how components are composed and how they consume the StatusContext

## Project Architecture

The PowerPoint toolbox add-in follows a React-based architecture with the following characteristics:

- **Component-Based Structure**: The application is organized into reusable UI components
- **Context API for State Management**: Uses React's Context API for sharing state across components
- **Office JS API Integration**: Interacts with PowerPoint through the Office JS API
- **Fluent UI Components**: Uses Microsoft's Fluent UI for consistent styling
- **Error Handling**: Centralized error handling through the StatusContext

The add-in is designed to provide various tools for PowerPoint presentations, including shape manipulation, slide formatting, and layout management.