fix: docu and css

source/components/form/reload.mjs

@@ -39,58 +39,7 @@ export { Reload };
 const intersectionObserverWasInitialized = Symbol("wasInitialized");
 
 /**
- * This CustomControl reloads the content of a url and embeds it into the dom.
- *
- * <img src="./images/reload.png">
- *
- * You can create this control either by specifying the HTML tag `<monster-reload />` directly in the HTML or using
- * Javascript via the `document.createElement('monster-reload');` method.
- *
- * ```html
- * <monster-reload></monster-reload>
- *
- * <script type="module">
- * import {Reload} from '@schukai/component-form/source/reload.js';
- * document.createElement('monster-reload');
- * </script>
- * ```
- *
- * A simple configuration can look like this
- *
- * ```html
- * <script id="config"
- *         type="application/json">
- *     {
- *         "url": "./content.html",
- *     }
- * </script>
- *
- * <monster-reload data-monster-options-selector="#config">
- * </monster-reload>
- * ```
- *
- * If you want to display a loader, you can insert a div with the attribute `data-monster-role="container"`.
- * The content of this div will be replaced by the loaded code.
- *
- * ```html
- * <monster-reload data-monster-options-selector="#config">
- * <div data-monster-role="container">
- * LOADER ...
- * </div>
- * </monster-reload>
- * ```
- *
- * If you need additional structure, you can simply specify it.
- *
- * ```html
- * <monster-reload data-monster-options-selector="#config">
- * <div class="row">
- *   <div class="col" data-monster-role="container">
- *       LOADER ...
- *   </div>
- * </div>
- * </monster-reload>
- * ```
+ * This CustomControl reloads the content of an url and embeds it into the dom.
  *
  * @fragments /fragments/components/form/reload/
  *
@@ -119,16 +68,16 @@ class Reload extends CustomElement {
 	 *
 	 * @property {Object} templates Template definitions
 	 * @property {string} templates.main Main template
-	 * @property {string} url=undefined
-	 * @property {string} reload=undefined currently the values defined are `onshow` and `always`. The default `onshow` removes the IntersectionObserver. This means that the content is only loaded once. reloading of the content does not occur.
-	 * @property {string} filter=undefined dom selectors to search for elements, if undefined then everything is taken
-	 * @property {Object[]} processors
-	 * @property {Object} fetch Fetch [see Using Fetch mozilla.org](https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch)
-	 * @property {String} fetch.redirect=error
-	 * @property {String} fetch.method=GET
-	 * @property {String} fetch.mode=same-origin
-	 * @property {String} fetch.credentials=same-origin
-	 * @property {Object} fetch.headers={"accept":"text/html"}}
+	 * @property {string} url url to fetch
+	 * @property {string} reload onshow, always
+	 * @property {string} filter css selector
+	 * @property {Object} fetch fetch options for the request
+	 * @property {string} fetch.redirect error, follow, manual
+	 * @property {string} fetch.method GET, POST, PUT, DELETE
+	 * @property {string} fetch.mode same-origin, cors, no-cors, navigate
+	 * @property {string} fetch.credentials omit, same-origin, include
+	 * @property {Object} fetch.headers
+	 * @property {string} fetch.headers.accept text/html, application/json
 	 */
 	get defaults() {
 		return Object.assign(
@@ -227,12 +176,6 @@ class Reload extends CustomElement {
 }
 
 /**
- * This attribute can be used to pass a URL to this select.
- *
- * ```
- * <monster-select data-monster-url="https://example.com/"></monster-select>
- * ```
- *
  * @private
  * @return {object}
  */
@@ -284,10 +227,10 @@ function initIntersectionObserver() {
 
 				try {
 					loadContent.call(this).catch((e) => {
-						addAttributeToken(this, ATTRIBUTE_ERRORMESSAGE, e.toString());
+						addErrorAttribute(this, e);
 					});
 				} catch (e) {
-					addAttributeToken(this, ATTRIBUTE_ERRORMESSAGE, e.toString());
+					addErrorAttribute(this, e);
 				}
 			}
 		}

source/components/form/shadow-reload.mjs

@@ -23,7 +23,7 @@ export { ShadowReload };
  *
  * @fragments /fragments/components/form/shadow-reload/
  *
- * @example /examples/components/form/shadow-reload-simple
+ * @example /examples/components/form/shadow-reload-simple simple shadow reload
  *
  * @since 3.6.0
  * @copyright schukai GmbH