Convert highlight comments to Expressive Code mark syntax

website/src/content/docs/docs/getting-started/getting-started-rest/01-setup-basic-syntax.mdx

@@ -92,16 +92,14 @@ A REST service in TypeSpec is defined using the [`@service`](../../../standard-l
 
 Let's start by defining a simple REST service for a Pet Store:
 
-```tsp title=main.tsp tryit="{"emit": ["@typespec/openapi3"]}"
+```tsp title=main.tsp tryit="{"emit": ["@typespec/openapi3"]}" mark={4-7}
 import "@typespec/http";
 
 using Http;
-// highlight-start
 @service(#{
   title: "Pet Store",
 })
 @server("https://example.com", "Single server endpoint")
-// highlight-end
 ```
 
 In this example:
@@ -121,15 +119,14 @@ In this example:
 
 Let's create a namespace for our Pet Store service:
 
-```tsp title=main.tsp tryit="{"emit": ["@typespec/openapi3"]}"
+```tsp title=main.tsp tryit="{"emit": ["@typespec/openapi3"]}" mark={8}
 import "@typespec/http";
 
 using Http;
 
 @service(#{ title: "Pet Store" })
 @server("https://example.com", "Single server endpoint")
 
-// highlight-next-line
 namespace PetStore;
 ```
 
@@ -150,7 +147,7 @@ In TypeSpec, a [model](../../language-basics/models.md) is a fundamental buildin
 
 Let's define a simple model for a `Pet`:
 
-```tsp title=main.tsp tryit="{"emit": ["@typespec/openapi3"]}"
+```tsp title=main.tsp tryit="{"emit": ["@typespec/openapi3"]}" mark={9-22}
 import "@typespec/http";
 
 using Http;
@@ -159,7 +156,6 @@ using Http;
 @server("https://example.com", "Single server endpoint")
 namespace PetStore;
 
-// highlight-start
 model Pet {
   id: int32;
   name: string;
@@ -174,7 +170,6 @@ enum petType {
   bird: "bird",
   reptile: "reptile",
 }
-// highlight-end
 ```
 
 In this example:
@@ -189,7 +184,7 @@ In this example:
 
 We can add [validation](../../../language-basics/values/#validation) annotations to our model properties to enforce certain constraints:
 
-```tsp title=main.tsp tryit="{"emit": ["@typespec/openapi3"]}"
+```tsp title=main.tsp tryit="{"emit": ["@typespec/openapi3"]}" mark={12,15-16}
 import "@typespec/http";
 
 using Http;
@@ -201,13 +196,10 @@ namespace PetStore;
 model Pet {
   id: int32;
 
-  // highlight-next-line
   @minLength(1)
   name: string;
 
-  // highlight-next-line
   @minValue(0)
-  // highlight-next-line
   @maxValue(100)
   age: int32;
 

website/src/content/docs/docs/getting-started/getting-started-rest/02-operations-responses.md

@@ -17,7 +17,7 @@ Next, we'll discuss how to define CRUD operations for our API. We'll cover opera
 
 Let's define the CRUD operations for our `Pet` model:
 
-```tsp title=main.tsp tryit="{"emit": ["@typespec/openapi3"]}"
+```tsp title=main.tsp tryit="{"emit": ["@typespec/openapi3"]}" mark={30-60}
 import "@typespec/http";
 
 using Http;
@@ -47,7 +47,6 @@ enum petType {
   reptile: "reptile",
 }
 
-// highlight-start
 @route("/pets")
 namespace Pets {
   @get
@@ -79,7 +78,6 @@ namespace Pets {
     @statusCode statusCode: 204;
   };
 }
-// highlight-end
 ```
 
 In this example:
@@ -138,7 +136,7 @@ In a real-world API, different operations might return different types of succes
 
 Let's update our pet operations to return different status codes based on the outcome.
 
-```tsp title=main.tsp tryit="{"emit": ["@typespec/openapi3"]}"
+```tsp title=main.tsp tryit="{"emit": ["@typespec/openapi3"]}" mark={42-43,50-52,59-60}
 import "@typespec/http";
 
 using Http;
@@ -180,31 +178,25 @@ namespace Pets {
   op getPet(@path petId: int32): {
     @statusCode statusCode: 200;
     @body pet: Pet;
-    // highlight-start
   } | {
     @statusCode statusCode: 404;
-    // highlight-end
   };
 
   @post
   op createPet(@body pet: Pet): {
     @statusCode statusCode: 201;
     @body newPet: Pet;
-    // highlight-start
   } | {
     @statusCode statusCode: 202;
     @body acceptedPet: Pet;
-    // highlight-end
   };
 
   @put
   op updatePet(@path petId: int32, @body pet: Pet): {
     @statusCode statusCode: 200;
     @body updatedPet: Pet;
-    // highlight-start
   } | {
     @statusCode statusCode: 404;
-    // highlight-end
   };
 
   @delete

website/src/content/docs/docs/getting-started/getting-started-rest/03-handling-errors.md

@@ -26,7 +26,7 @@ Error models can be used to represent different types of errors that your API mi
 
 We'll define models to represent validation errors, not-found errors, and internal server errors:
 
-```tsp title=main.tsp tryit="{"emit": ["@typespec/openapi3"]}"
+```tsp title=main.tsp tryit="{"emit": ["@typespec/openapi3"]}" mark={45,55-58,65-76,85-102}
 import "@typespec/http";
 
 using Http;
@@ -71,7 +71,6 @@ namespace Pets {
   } | {
     @statusCode statusCode: 404;
 
-    // highlight-next-line
     @body error: NotFoundError;
   };
 
@@ -82,19 +81,16 @@ namespace Pets {
   } | {
     @statusCode statusCode: 202;
     @body acceptedPet: Pet;
-    // highlight-start
   } | {
     @statusCode statusCode: 400;
     @body error: ValidationError;
   };
-  // highlight-end
 
   @put
   op updatePet(@path petId: int32, @body pet: Pet):
     | {
         @statusCode statusCode: 200;
         @body updatedPet: Pet;
-        // highlight-start
       }
     | {
         @statusCode statusCode: 400;
@@ -107,7 +103,6 @@ namespace Pets {
     | {
         @statusCode statusCode: 500;
         @body error: InternalServerError;
-        // highlight-end
       };
 
   @delete
@@ -116,7 +111,6 @@ namespace Pets {
   };
 }
 
-// highlight-start
 @error
 model NotFoundError {
   code: "NOT_FOUND";
@@ -135,7 +129,6 @@ model InternalServerError {
   code: "INTERNAL_SERVER_ERROR";
   message: string;
 }
-// highlight-end
 ```
 
 In this example:

website/src/content/docs/docs/getting-started/getting-started-rest/04-common-parameters.md

@@ -16,7 +16,7 @@ Let's start by defining a model for common parameters. This model will include p
 
 For the sake of demonstration, we're going to require each API call in our Pet Store service to include a request ID, a locale, and a client version. Let's define a model for these common parameters, which we'll label `requestID`, `locale`, and `clientVersion`:
 
-```tsp title=main.tsp tryit="{"emit": ["@typespec/openapi3"]}"
+```tsp title=main.tsp tryit="{"emit": ["@typespec/openapi3"]}" mark={30-39}
 import "@typespec/http";
 
 using Http;
@@ -46,7 +46,6 @@ enum petType {
   reptile: "reptile",
 }
 
-// highlight-start
 model CommonParameters {
   @header
   requestID: string;
@@ -57,7 +56,6 @@ model CommonParameters {
   @header
   clientVersion?: string;
 }
-// highlight-end
 ```
 
 In this example:
@@ -71,7 +69,7 @@ Now that we have defined our common parameters model, let's reuse it across mult
 
 ### Example: Reusing Common Parameters in Operations
 
-```tsp title=main.tsp tryit="{"emit": ["@typespec/openapi3"]}"
+```tsp title=main.tsp tryit="{"emit": ["@typespec/openapi3"]}" mark={44,50,59,71,90}
 import "@typespec/http";
 
 using Http;
@@ -115,14 +113,12 @@ model CommonParameters {
 @route("/pets")
 namespace Pets {
   @get
-  // highlight-next-line
   op listPets(...CommonParameters): {
     @statusCode statusCode: 200;
     @body pets: Pet[];
   };
 
   @get
-  // highlight-next-line
   op getPet(@path petId: int32, ...CommonParameters): {
     @statusCode statusCode: 200;
     @body pet: Pet;
@@ -132,7 +128,6 @@ namespace Pets {
   };
 
   @post
-  // highlight-next-line
   op createPet(@body pet: Pet, ...CommonParameters): {
     @statusCode statusCode: 201;
     @body newPet: Pet;
@@ -145,7 +140,6 @@ namespace Pets {
   };
 
   @put
-  // highlight-next-line
   op updatePet(@path petId: int32, @body pet: Pet, ...CommonParameters):
     | {
         @statusCode statusCode: 200;
@@ -165,7 +159,6 @@ namespace Pets {
       };
 
   @delete
-  // highlight-next-line
   op deletePet(@path petId: int32, ...CommonParameters): {
     @statusCode statusCode: 204;
   };
@@ -200,7 +193,7 @@ In this example:
 
 Let's take a closer look at how the common parameters model with the `spread` operator is represented in the generated OpenAPI specification by looking at the `deletePet` operation:
 
-```yaml
+```yaml mark={14-16,28-45}
 #### Generated OpenAPI Specification:
 
 paths:
@@ -214,11 +207,9 @@ paths:
           schema:
             type: integer
             format: int32
-        // highlight-start
         - $ref: "#/components/parameters/CommonParameters.requestID"
         - $ref: "#/components/parameters/CommonParameters.locale"
         - $ref: "#/components/parameters/CommonParameters.clientVersion"
-        // highlight-end
       responses:
         "204":
           description: "There is no content to send for this request, but the headers may be useful."
@@ -230,7 +221,6 @@ paths:
                 $ref: "#/components/schemas/NotFoundError"
 components:
   parameters:
-    // highlight-start
     CommonParameters.clientVersion:
       name: client-version
       in: header
@@ -249,7 +239,6 @@ components:
       required: true
       schema:
         type: string
-    // highlight-end
   schemas:
     NotFoundError:
       type: object