diff --git a/application/source/data/transformer.mjs b/application/source/data/transformer.mjs
index c0cafd46899f8d3ef76c8c7391f5cf14f1e972bd..a7cfa53eeeedd10571b0078e47e6f99a0e0d5771 100644
--- a/application/source/data/transformer.mjs
+++ b/application/source/data/transformer.mjs
@@ -5,12 +5,12 @@
* License text available at https://www.gnu.org/licenses/agpl-3.0.en.html
*/
-import { getLocaleOfDocument } from "../dom/locale.mjs";
-import { Base } from "../types/base.mjs";
-import { getGlobal, getGlobalObject } from "../types/global.mjs";
-import { ID } from "../types/id.mjs";
-import { isArray, isObject, isString, isPrimitive } from "../types/is.mjs";
-import { getDocumentTranslations, Translations } from "../i18n/translations.mjs";
+import {getLocaleOfDocument} from "../dom/locale.mjs";
+import {Base} from "../types/base.mjs";
+import {getGlobal, getGlobalObject} from "../types/global.mjs";
+import {ID} from "../types/id.mjs";
+import {isArray, isObject, isString, isPrimitive} from "../types/is.mjs";
+import {getDocumentTranslations, Translations} from "../i18n/translations.mjs";
import {
validateFunction,
validateInteger,
@@ -19,10 +19,10 @@ import {
validateString,
validateBoolean,
} from "../types/validate.mjs";
-import { clone } from "../util/clone.mjs";
-import { Pathfinder } from "./pathfinder.mjs";
+import {clone} from "../util/clone.mjs";
+import {Pathfinder} from "./pathfinder.mjs";
-export { Transformer };
+export {Transformer};
/**
* The transformer class is a swiss army knife for manipulating values. especially in combination with the pipe, processing chains can be built up.
@@ -673,6 +673,25 @@ function transform(value) {
throw new Error(`unsupported locale or missing format (${e.message})`);
}
+ case "datetimeformat":
+
+ date = new Date(value);
+ if (isNaN(date.getTime())) {
+ throw new Error("invalid date");
+ }
+
+ const options = {
+ dateStyle: args.shift() || "medium",
+ timeStyle: args.shift() || "medium",
+ };
+
+ try {
+ locale = getLocaleOfDocument();
+ return new Intl.DateTimeFormat(locale, options).format(date)
+ } catch (e) {
+ throw new Error(`unsupported locale or missing format (${e.message})`);
+ }
+
case "datetime":
date = new Date(value);
if (isNaN(date.getTime())) {
diff --git a/development/playground/custom-element/index.html b/development/playground/custom-element/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..1826cb71d869152e7145f413643fbfaadba21a3d
--- /dev/null
+++ b/development/playground/custom-element/index.html
@@ -0,0 +1,12 @@
+<!doctype html>
+<html lang="en">
+<head>
+ <meta charset="utf-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <title>Popper Button</title>
+ <script src="main.mjs" type="module"></script>
+</head>
+<body id="mybody">
+ <h1>Monday</h1>
+ <monster-monday data-monster-script-host="mybody" id="monday" data-monster-option-a-b-c="ddddddd"></monster-monday>
+</body>
diff --git a/development/playground/custom-element/main.mjs b/development/playground/custom-element/main.mjs
new file mode 100644
index 0000000000000000000000000000000000000000..2b486253294a9c5b05838d2cdd79c2f1a2ef43d3
--- /dev/null
+++ b/development/playground/custom-element/main.mjs
@@ -0,0 +1,46 @@
+import {CustomElement,registerCustomElement} from "../../../application/source/dom/customelement.mjs"
+
+
+class Monday extends CustomElement {
+
+static getTag() {
+ return "monster-monday"
+}
+
+ get defaults() {
+ return Object.assign({}, super.defaults, {
+ templates: {
+ main: myHtml()
+ },
+ a : {
+ b : {
+
+ c:"hallo"
+ }
+
+ }})}
+
+
+}
+
+function myHtml() {
+
+ return '<div data-monster-replace="path:a.b.c "></div>'
+
+}
+
+const o=document.querySelector("monster-monday")
+o.initCustomControlCallback = (elem) => {
+
+elem.setOption("a.b.c","xxxx")
+
+
+}
+
+
+
+registerCustomElement(Monday)
+
+
+
+
diff --git a/development/playground/custom-element/main.pcss b/development/playground/custom-element/main.pcss
new file mode 100644
index 0000000000000000000000000000000000000000..e69de29bb2d1d6434b8b29ae775ad8c2e48c5391
diff --git a/development/test/cases/data/transformer.mjs b/development/test/cases/data/transformer.mjs
index 559bea5de628abf0a2078842f4b803383d277aa2..6ad0d73c5cf1ac7b9aadd1525d8c974b75c20eda 100644
--- a/development/test/cases/data/transformer.mjs
+++ b/development/test/cases/data/transformer.mjs
@@ -28,6 +28,9 @@ describe('Transformer', function () {
describe('Transformer.run()', function () {
[
+ ['datetimeformat', "2023-02-04 08:02:01", "04.02.2023, 08:02:01"],
+ ['datetimeformat:long:short', "2023-02-04 08:02:01","4. Februar 2023 um 08:02"],
+ ['datetimeformat:short:short', "2023-02-04 08:02:01", "04.02.23, 08:02"],
['equals:a', "a", true],
['equals:a', "b", false],
['equals:3', 3, true],