Improve jsdoc on options

Author: Legend-Master

src/index.ts

@@ -16,13 +16,40 @@ export type {
 	LqipFormat,
 } from './loader.js'
 
+/**
+ * The plugin options, they will be merged with {@linkcode DEFAULT_OPTIONS}
+ *
+ * @example
+ *
+ * ```typescript
+ * const config: Config = {
+ * 	plugins: [
+ * 		[
+ * 			'native-ideal-image',
+ * 			{
+ * 				presets: {
+ * 					card: {
+ * 						sizes: [600, 800, 1000],
+ * 						formats: ['avif', 'webp', 'jpeg'],
+ * 					},
+ * 				},
+ * 				disableInDev: true,
+ * 			} satisfies NativeIdealImageOptions,
+ * 		],
+ * 	],
+ * }
+ * ```
+ */
 export type NativeIdealImageOptions = Partial<{
 	/**
 	 * File name template for output files
 	 */
 	fileNameTemplate: string
 	/**
-	 * Image loader presets
+	 * Image loader presets, you can use them through URL queries like this:
+	 * `import image from 'ideal-img!./some-image.png?preset=card'`
+	 *
+	 * `default` preset is used when there's no preset query
 	 */
 	presets: Record<string, Preset>
 	/**

src/mdx-plugin.ts

@@ -4,13 +4,42 @@ import type { Parent } from 'unist'
 import { visit, EXIT } from 'unist-util-visit'
 import { assetRequireAttributeValue, transformNode } from './utils.js'
 
+/**
+ * The remark plugin options
+ *
+ * @example
+ *
+ * ```typescript
+ * const config = {
+ * 	presets: [
+ * 		[
+ * 			'classic',
+ * 			{
+ * 				// The same for docs and blog
+ * 				pages: {
+ * 					remarkPlugins: [
+ * 						[
+ * 							nativeIdealImageRemarkPlugin,
+ * 							{
+ * 								swapOnLoad: true,
+ * 							} satisfies NativeIdealImageRemarkPluginOptions,
+ * 						],
+ * 					],
+ * 				},
+ * 			},
+ * 		],
+ * 	],
+ * }
+ * ```
+ */
 export type RemarkPluginOptions = Partial<{
 	/**
 	 * The image loader preset to use
 	 */
 	preset: string
 	/**
-	 * Swap (fade in) the actual image after it's fully loaded
+	 * Swap (fade in) the actual image after it's fully loaded,
+	 * this corresponds to `NativeIdealImageProps.swapOnLoad`
 	 */
 	swapOnLoad: boolean
 }>