refactor: update/fix JSDoc props

src/Grid/Column.svelte

@@ -1,65 +1,4 @@
 <script>
-  /**
-   * Set to `true` to render a custom HTML element
-   * Props are destructured as `props` in the default slot (e.g. <Column let:props><article {...props}>...</article></Column>)
-   * @type {boolean} [as=false]
-   */
-  export let as = false;
-
-  /**
-   * Set to `true` to remove the gutter
-   * @type {boolean} [noGutter=false]
-   */
-  export let noGutter = false;
-
-  /**
-   * Set to `true` to remove the left gutter
-   * @type {boolean} [noGutterLeft=false]
-   */
-  export let noGutterLeft = false;
-
-  /**
-   * Set to `true` to remove the right gutter
-   * @type {boolean} [noGutterRight=false]
-   */
-  export let noGutterRight = false;
-
-  /**
-   * Specify the aspect ratio of the column
-   * @type {"2x1" | "16x9" | "9x16" | "1x2" | "4x3" | "3x4" | "1x1"} [aspectRatio]
-   */
-  export let aspectRatio = undefined;
-
-  /**
-   * Set the small breakpoint
-   * @type {ColumnBreakpoint} [sm]
-   */
-  export let sm = undefined;
-
-  /**
-   * Set the medium breakpoint
-   * @type {ColumnBreakpoint} [md]
-   */
-  export let md = undefined;
-
-  /**
-   * Set the large breakpoint
-   * @type {ColumnBreakpoint} [lg]
-   */
-  export let lg = undefined;
-
-  /**
-   * Set the extra large breakpoint
-   * @type {ColumnBreakpoint} [xlg]
-   */
-  export let xlg = undefined;
-
-  /**
-   * Set the maximum breakpoint
-   * @type {ColumnBreakpoint} [max]
-   */
-  export let max = undefined;
-
   /**
    * @typedef {boolean | number} ColumnSize
    * @typedef {{span?: ColumnSize; offset: number;}} ColumnSizeDescriptor
@@ -67,10 +6,60 @@
    */
 
   /**
-   * Column breakpoints
-   * @constant
-   * @type {string[]}
+   * @slot {{ props?: { class: string; } }}
    */
+
+  /**
+   * Set to `true` to render a custom HTML element
+   * Props are destructured as `props` in the default slot (e.g. <Column let:props><article {...props}>...</article></Column>)
+   */
+  export let as = false;
+
+  /** Set to `true` to remove the gutter */
+  export let noGutter = false;
+
+  /** Set to `true` to remove the left gutter */
+  export let noGutterLeft = false;
+
+  /** Set to `true` to remove the right gutter */
+  export let noGutterRight = false;
+
+  /**
+   * Specify the aspect ratio of the column
+   * @type {"2x1" | "16x9" | "9x16" | "1x2" | "4x3" | "3x4" | "1x1"}
+   */
+  export let aspectRatio = undefined;
+
+  /**
+   * Set the small breakpoint
+   * @type {ColumnBreakpoint}
+   */
+  export let sm = undefined;
+
+  /**
+   * Set the medium breakpoint
+   * @type {ColumnBreakpoint}
+   */
+  export let md = undefined;
+
+  /**
+   * Set the large breakpoint
+   * @type {ColumnBreakpoint}
+   */
+  export let lg = undefined;
+
+  /**
+   * Set the extra large breakpoint
+   * @type {ColumnBreakpoint}
+   */
+  export let xlg = undefined;
+
+  /**
+   * Set the maximum breakpoint
+   * @type {ColumnBreakpoint}
+   */
+  export let max = undefined;
+
   const breakpoints = ["sm", "md", "lg", "xlg", "max"];
 
   $: columnClass = [sm, md, lg, xlg, max]

src/Grid/Grid.svelte

@@ -1,45 +1,30 @@
 <script>
+  /**
+   * @slot {{ props?: { class: string; } }}
+   */
+
   /**
    * Set to `true` to render a custom HTML element
    * Props are destructured as `props` in the default slot (e.g. <Grid let:props><header {...props}>...</header></Grid>)
-   * @type {boolean} [as=false]
    */
   export let as = false;
 
-  /**
-   * Set to `true` to use the condensed variant
-   * @type {boolean} [condensed=false]
-   */
+  /** Set to `true` to use the condensed variant */
   export let condensed = false;
 
-  /**
-   * Set to `true` to use the narrow variant
-   * @type {boolean} [narrow=false]
-   */
+  /** Set to `true` to use the narrow variant */
   export let narrow = false;
 
-  /**
-   * Set to `true` to use the fullWidth variant
-   * @type {boolean} [fullWidth=false]
-   */
+  /** Set to `true` to use the fullWidth variant */
   export let fullWidth = false;
 
-  /**
-   * Set to `true` to remove the gutter
-   * @type {boolean} [noGutter=false]
-   */
+  /** Set to `true` to remove the gutter */
   export let noGutter = false;
 
-  /**
-   * Set to `true` to remove the left gutter
-   * @type {boolean} [noGutterLeft=false]
-   */
+  /** Set to `true` to remove the left gutter */
   export let noGutterLeft = false;
 
-  /**
-   * Set to `true` to remove the right gutter
-   * @type {boolean} [noGutterRight=false]
-   */
+  /** Set to `true` to remove the right gutter */
   export let noGutterRight = false;
 
   $: props = {

src/Grid/Row.svelte

@@ -1,39 +1,27 @@
 <script>
+  /**
+   * @slot {{ props?: { class: string; } }}
+   */
+
   /**
    * Set to `true` to render a custom HTML element
    * Props are destructured as `props` in the default slot (e.g. <Row let:props><section {...props}>...</section></Row>)
-   * @type {boolean} [as=false]
    */
   export let as = false;
 
-  /**
-   * Set to `true` to use the condensed variant
-   * @type {boolean} [condensed=false]
-   */
+  /** Set to `true` to use the condensed variant */
   export let condensed = false;
 
-  /**
-   * Set to `true` to use the narrow variant
-   * @type {boolean} [narrow=false]
-   */
+  /** Set to `true` to use the narrow variant */
   export let narrow = false;
 
-  /**
-   * Set to `true` to remove the gutter
-   * @type {boolean} [noGutter=false]
-   */
+  /** Set to `true` to remove the gutter */
   export let noGutter = false;
 
-  /**
-   * Set to `true` to remove the left gutter
-   * @type {boolean} [noGutterLeft=false]
-   */
+  /** Set to `true` to remove the left gutter */
   export let noGutterLeft = false;
 
-  /**
-   * Set to `true` to remove the right gutter
-   * @type {boolean} [noGutterRight=false]
-   */
+  /** Set to `true` to remove the right gutter */
   export let noGutterRight = false;
 
   $: props = {