Add slide numbers toggle dropdown to InsertTitles component

src/taskpane/components/InsertTitles.tsx

@@ -7,7 +7,6 @@ import { getErrorMessage } from "../types/office-types";
 
 // Configuration constants
 const TITLE_POSITION_THRESHOLD = 95; // Pixels from top of slide to consider a shape as a title
-const INCLUDE_SLIDE_NUMBERS = false; // Whether to include slide numbers in the output
 const STANDARD_SLIDE_WIDTH = 720; // Standard PowerPoint slide width
 
 // Title detection methods
@@ -40,6 +39,7 @@ export const InsertTitles: React.FC = () => {
   const styles = useCommonStyles();
   const { setStatusMessage, setStatusType } = useStatusContext();
   const [titleDetectionMethod, setTitleDetectionMethod] = React.useState<TitleDetectionMethod>("auto");
+  const [includeSlideNumbers, setIncludeSlideNumbers] = React.useState<boolean>(false);
 
   /**
    * Validates that a text box is selected
@@ -238,7 +238,7 @@ export const InsertTitles: React.FC = () => {
     slides: PowerPoint.SlideCollection,
     context: PowerPoint.RequestContext,
     options: TitleCollectionOptions = { 
-      includeSlideNumbers: INCLUDE_SLIDE_NUMBERS,
+      includeSlideNumbers: false,
       detectionMethod: "auto"
     }
   ): Promise<TitleCollectionResult> => {
@@ -359,7 +359,7 @@ export const InsertTitles: React.FC = () => {
           slides, 
           context,
           { 
-            includeSlideNumbers: INCLUDE_SLIDE_NUMBERS,
+            includeSlideNumbers: includeSlideNumbers,
             detectionMethod: titleDetectionMethod
           }
         );
@@ -408,6 +408,18 @@ export const InsertTitles: React.FC = () => {
           <option value="first">First text on slide</option>
         </select>
       </div>
+      <div style={{ marginTop: '10px', display: 'flex', justifyContent: 'flex-end' }}>
+        <select 
+          value={includeSlideNumbers ? "yes" : "no"}
+          onChange={(e) => setIncludeSlideNumbers(e.target.value === "yes")}
+          style={{ width: '75%' }}
+          aria-label="Include slide numbers"
+          title="Include slide numbers in output"
+        >
+          <option value="no">Exclude slide numbers</option>
+          <option value="yes">Include slide numbers</option>
+        </select>
+      </div>
     </div>
   );
 };