From 15464a46edbece969bd00421616bb90d0f8757b3 Mon Sep 17 00:00:00 2001
From: Volker Schukai <volker.schukai@schukai.com>
Date: Sun, 19 Jan 2025 22:17:40 +0100
Subject: [PATCH] fix: docu and css
---
source/components/form/reload.mjs | 83 ++++--------------------
source/components/form/shadow-reload.mjs | 2 +-
2 files changed, 14 insertions(+), 71 deletions(-)
diff --git a/source/components/form/reload.mjs b/source/components/form/reload.mjs
index 639384c7b..214a3f740 100644
--- a/source/components/form/reload.mjs
+++ b/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);
}
}
}
diff --git a/source/components/form/shadow-reload.mjs b/source/components/form/shadow-reload.mjs
index f5ca623ae..1dbf447ce 100644
--- a/source/components/form/shadow-reload.mjs
+++ b/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
--
GitLab