docs(highlight-auto): support subset of languages

Author: metonym

README.md

@@ -164,6 +164,27 @@ The `HighlightAuto` component uses the [highlightAuto API](https://highlightjs.r
 <HighlightAuto {code} />
 ```
 
+### Limiting Language Detection
+
+You can restrict language detection to a specific subset using the `languages` prop. This can improve performance and accuracy by limiting the languages considered during auto-detection.
+
+See the [highlight.js documentation on language subset restriction](https://highlightjs.readthedocs.io/en/latest/api.html#highlightauto-value-languagesubset) for more details.
+
+```svelte
+<script>
+  import { HighlightAuto } from "svelte-highlight";
+  import github from "svelte-highlight/styles/github";
+
+  const code = "const x = 42;";
+</script>
+
+<svelte:head>
+  {@html github}
+</svelte:head>
+
+<HighlightAuto {code} languages={["javascript", "typescript"]} />
+```
+
 ## Line Numbers
 
 Use the `LineNumbers` component to render the highlighted code with line numbers.
@@ -489,13 +510,20 @@ In the example below, the `HighlightAuto` component and injected styles are dyna
 
 #### Props
 
-| Name    | Type      | Default value  |
-| :------ | :-------- | :------------- |
-| code    | `any`     | N/A (required) |
-| langtag | `boolean` | `false`        |
+| Name      | Type             | Default value  |
+| :-------- | :--------------- | :------------- |
+| code      | `any`            | N/A (required) |
+| languages | `LanguageName[]` | `undefined`    |
+| langtag   | `boolean`        | `false`        |
 
 `$$restProps` are forwarded to the top-level `pre` element.
 
+**Note:** `LanguageName` is a union type of all supported language names, providing autocomplete and type safety. You can import it from `svelte-highlight`:
+
+```ts
+import type { LanguageName } from "svelte-highlight";
+```
+
 #### Dispatched Events
 
 - **on:highlight**: fired after `code` is highlighted

www/components/globals/Index.svelte

@@ -157,6 +157,30 @@
       subtitle="Auto-highlighting will result in a larger bundle size. Specify a language if possible."
     />
   </Column>
+  <Column xlg={6} lg={6} md={12}>
+    <p class="mb-5">
+      Optionally, you can restrict language detection to a specific subset using
+      the <code class="code">languages</code> prop. This can improve performance
+      and accuracy.
+    </p>
+  </Column>
+  <Column xlg={10} lg={10} md={12}>
+    <HighlightSvelte
+      code={`<script>
+  import { HighlightAuto } from "svelte-highlight";
+  import atomOneDark from "svelte-highlight/styles/atom-one-dark";
+
+  const code = "const x = 42;";
+<\/script>
+
+<svelte:head>
+  {@html atomOneDark}
+</svelte:head>
+
+<HighlightAuto {code} languages={["javascript", "typescript"]} />`}
+      class={THEME_MODULE_NAME}
+    />
+  </Column>
 </Row>
 
 <Row class="mb-9">