refactor: update/fix JSDoc props

src/FileUploader/FileUploader.svelte

@@ -1,70 +1,58 @@
 <script>
+  /**
+   * @typedef {string[]} Files
+   * @event {Files} add
+   * @event {Files} remove
+   */
+
   /**
    * Specify the file uploader status
-   * @type {"uploading" | "edit" | "complete"} [status="uploading"]
+   * @type {"uploading" | "edit" | "complete"}
    */
   export let status = "uploading";
 
   /**
    * Specify the accepted file types
-   * @type {string[]} [accept=[]]
+   * @type {Files}
    */
   export let accept = [];
 
   /**
    * Obtain the uploaded file names
-   * @type {string[]} [files=[]]
+   * @type {Files}
    */
   export let files = [];
 
-  /**
-   * Set to `true` to allow multiple files
-   * @type {boolean} [multiple=false]
-   */
+  /** Set to `true` to allow multiple files */
   export let multiple = false;
 
   /**
    * Override the default behavior of clearing the array of uploaded files
-   * @type {() => any} [clearFiles = () => void]
+   * @type {() => void}
    */
   export const clearFiles = () => {
     files = [];
   };
 
-  /**
-   * Specify the label description
-   * @type {string} [labelDescription=""]
-   */
+  /** Specify the label description */
   export let labelDescription = "";
 
-  /**
-   * Specify the label title
-   * @type {string} [labelTitle=""]
-   */
+  /** Specify the label title */
   export let labelTitle = "";
 
   /**
    * Specify the kind of file uploader button
-   * @type {"primary" | "secondary" | "tertiary" | "ghost" | "danger"} [kind="primary"]
+   * @type {"primary" | "secondary" | "tertiary" | "ghost" | "danger"}
    */
   export let kind = "primary";
 
-  /**
-   * Specify the button label
-   * @type {string} [buttonLabel=""]
-   */
+  /** Specify the button label */
   export let buttonLabel = "";
 
-  /**
-   * Specify the ARIA label used for the status icons
-   * @type {string} [iconDescription=""]
-   */
+  /** Specify the ARIA label used for the status icons */
   export let iconDescription = "Provide icon description";
 
-  /**
-   * Specify a name attribute for the file button uploader input
-   * @type {string} [name]
-   */
+  /** Specify a name attribute for the file button uploader input */
   export let name = "";
 
   import { createEventDispatcher, afterUpdate } from "svelte";

src/FileUploader/FileUploaderButton.svelte

@@ -1,67 +1,50 @@
 <script>
+  /**
+   * @typedef {string[]} Files
+   */
+
   /**
    * Specify the accepted file types
-   * @type {string[]} [accept=[]]
+   * @type {Files}
    */
   export let accept = [];
 
-  /**
-   * Set to `true` to allow multiple files
-   * @type {boolean} [multiple=false]
-   */
+  /** Set to `true` to allow multiple files */
   export let multiple = false;
 
-  /**
-   * Set to `true` to disable the input
-   * @type {boolean} [disabled=false]
-   */
+  /** Set to `true` to disable the input */
   export let disabled = false;
 
-  /**
-   * Set to `true` to disable label changes
-   * @type {boolean} [disableLabelChanges=false]
-   */
+  /** Set to `true` to disable label changes */
   export let disableLabelChanges = false;
 
   /**
    * Specify the kind of file uploader button
-   * @type {"primary" | "secondary" | "tertiary" | "ghost" | "danger"} [kind="primary"]
+   * @type {"primary" | "secondary" | "tertiary" | "ghost" | "danger"}]
    */
   export let kind = "primary";
 
-  /**
-   * Specify the label text
-   * @type {string} [labelText="Add file"]
-   */
+  /** Specify the label text */
   export let labelText = "Add file";
 
-  /**
-   * Specify the label role
-   * @type {string} [role="button"]
-   */
+  /** Specify the label role */
   export let role = "button";
 
-  /**
-   * Specify `tabindex` attribute
-   * @type {string} [tabindex="0"]
-   */
+  /** Specify `tabindex` attribute */
   export let tabindex = "0";
 
   /**
    * Set an id for the input element
-   * @type {string} [id]
+   * @type {string}
    */
   export let id = "ccs-" + Math.random().toString(36);
 
-  /**
-   * Specify a name attribute for the input
-   * @type {string} [name]
-   */
+  /** Specify a name attribute for the input */
   export let name = "";
 
   /**
    * Obtain a reference to the input HTML element
-   * @type {null | HTMLInputElement} [ref=null]
+   * @type {null | HTMLInputElement}
    */
   export let ref = null;
 </script>

src/FileUploader/FileUploaderDropContainer.svelte

@@ -1,74 +1,57 @@
 <script>
+  /**
+   * @typedef {string[]} Files
+   * @event {Files} add
+   */
+
   /**
    * Specify the accepted file types
-   * @type {string[]} [accept=[]]
+   * @type {Files}
    */
   export let accept = [];
 
-  /**
-   * Set to `true` to allow multiple files
-   * @type {boolean} [multiple=false]
-   */
+  /** Set to `true` to allow multiple files */
   export let multiple = false;
 
   /**
    * Override the default behavior of validating uploaded files
    * The default behavior does not validate files
-   * @type {(files: Files) => Files} [validateFiles = (files: Files) => Files]
+   * @type {(files: Files) => Files}
    */
   export let validateFiles = (files) => files;
 
-  /**
-   * Specify the label text
-   * @type {string} [labelText="Add file"]
-   */
+  /** Specify the label text */
   export let labelText = "Add file";
 
-  /**
-   * Specify the `role` attribute of the drop container
-   * @type {string} [role="button"]
-   */
+  /** Specify the `role` attribute of the drop container */
   export let role = "button";
 
-  /**
-   * Set to `true` to disable the input
-   * @type {boolean} [disabled=false]
-   */
+  /** Set to `true` to disable the input */
   export let disabled = false;
 
-  /**
-   * Specify `tabindex` attribute
-   * @type {string} [tabindex="0"]
-   */
+  /** Specify `tabindex` attribute */
   export let tabindex = "0";
 
   /**
    * Set an id for the input element
-   * @type {string} [id]
+   * @type {string}
    */
   export let id = "ccs-" + Math.random().toString(36);
 
-  /**
-   * Specify a name attribute for the input
-   * @type {string} [name=""]
-   */
+  /** Specify a name attribute for the input */
   export let name = "";
 
   /**
    * Obtain a reference to the input HTML element
-   * @type {null | HTMLInputElement} [ref=null]
+   * @type {null | HTMLInputElement}
    */
   export let ref = null;
 
-  /**
-   * @typedef {string[]} Files
-   */
-
   import { createEventDispatcher } from "svelte";
 
   const dispatch = createEventDispatcher();
 
-  $: over = false;
+  let over = false;
 </script>
 
 <div

src/FileUploader/FileUploaderItem.svelte

@@ -1,44 +1,33 @@
 <script>
+  /**
+   * @event {string} delete
+   */
+
   /**
    * Specify the file uploader status
-   * @type {"uploading" | "edit" | "complete"} [status="uploading"]
+   * @type {"uploading" | "edit" | "complete"}
    */
   export let status = "uploading";
 
-  /**
-   * Specify the ARIA label used for the status icons
-   * @type {string} [iconDescription=""]
-   */
+  /** Specify the ARIA label used for the status icons */
   export let iconDescription = "";
 
-  /**
-   * Set to `true` to indicate an invalid state
-   * @type {boolean} [invalid=false]
-   */
+  /** Set to `true` to indicate an invalid state */
   export let invalid = false;
 
-  /**
-   * Specify the error subject text
-   * @type {string} [errorSubject=""]
-   */
+  /** Specify the error subject text */
   export let errorSubject = "";
 
-  /**
-   * Specify the error body text
-   * @type {string} [errorBody=""]
-   */
+  /** Specify the error body text */
   export let errorBody = "";
 
   /**
    * Set an id for the top-level element
-   * @type {string} [id]
+   * @type {string}
    */
   export let id = "ccs-" + Math.random().toString(36);
 
-  /**
-   * Specify the file uploader name
-   * @type {string} [name=""]
-   */
+  /** Specify the file uploader name */
   export let name = "";
 
   import { createEventDispatcher } from "svelte";

src/FileUploader/Filename.svelte

@@ -1,20 +1,14 @@
 <script>
   /**
    * Specify the file name status
-   * @type {"uploading" | "edit" | "complete"} [status="uploading"]
+   * @type {"uploading" | "edit" | "complete"}
    */
   export let status = "uploading";
 
-  /**
-   * Specify the ARIA label used for the status icons
-   * @type {string} [iconDescription=""]
-   */
+  /** Specify the ARIA label used for the status icons */
   export let iconDescription = "";
 
-  /**
-   * Set to `true` to indicate an invalid state
-   * @type {boolean} [invalid=false]
-   */
+  /** Set to `true` to indicate an invalid state */
   export let invalid = false;
 
   import Close16 from "carbon-icons-svelte/lib/Close16";

src/FileUploader/index.js

@@ -3,4 +3,4 @@ export { default as FileUploaderButton } from "./FileUploaderButton.svelte";
 export { default as FileUploaderItem } from "./FileUploaderItem.svelte";
 export { default as FileUploaderDropContainer } from "./FileUploaderDropContainer.svelte";
 export { default as Filename } from "./Filename.svelte";
-export { default as FileUploaderSkeleton } from "./FileUploader.Skeleton.svelte";
+export { default as FileUploaderSkeleton } from "./FileUploaderSkeleton.svelte";