README.md

@@ -0,0 +1,74 @@
+# JSON Forms for Drupal
+
+JSON Forms for Drupal is an implementation of the [JSON Forms](
+https://jsonforms.io/) specification for Drupal.
+
+## Additional features and keywords
+
+In this implementation there are some custom features and keywords not
+specified in standard JSON Forms. (TODO: Not all additional possibilities are
+described here, yet.)
+
+### Array control: options `itemLayout` and `elements`
+
+There are two additional options in controls referencing an array.
+
+The option `itemLayout` allows to specify the layout for the individual controls
+of an array item (e.g. `VerticalLayout`). The default is `TableRow`.
+
+The option `elements` allows to specify the controls for the properties of an
+array item. By default a control is generated for each item property.
+
+Example:
+```json
+{
+  "itemLayout": "VerticalLayout",
+  "elements": [
+    {
+      "type": "Control",
+      "label": "Name",
+      "scope": "#/properties/name"
+    },
+    {
+      "type": "Control",
+      "label": "Birth Date",
+      "scope": "#/properties/birthDate"
+    }
+  ]
+}
+```
+
+### Description display
+
+The Keyword `descriptionDisplay` in Control options allows to specify the
+display of the description. Possible options:
+
+* `after`
+* `before`
+* `invisible`
+* `tooltip`
+
+The first three options are standard options available for the
+`#description_display` in Drupal.
+
+The option `tooltip` leads to an additional CSS class on the description
+element: `json-forms-description-tooltip`. This can be used to process it
+with another module to display the description as tooltip.
+
+With the module [Form Tips](https://www.drupal.org/project/formtips) it can
+be achieved with this CSS selector:
+
+```css
+:not(.json-forms-description-tooltip)
+```
+
+## Limitations
+
+Some things cannot be done with (standard) Drupal forms, e.g.
+[Rules](https://jsonforms.io/docs/uischema/rules/) cannot completely be mapped
+to [conditional form fields](https://www.drupal.org/docs/drupal-apis/form-api/conditional-form-fields).
+
+The [`detail` option](https://jsonforms.io/docs/uischema/controls#the-detail-option)
+for controls referencing an array is unsupported.
+
+TODO: Describe all limitations.

composer.json

@@ -9,6 +9,11 @@
             "email": "info@systopia.de"
         }
     ],
+    "extra": {
+	"branch-alias": {
+            "dev-main": "0.6.x-dev"
+        }
+    },
     "autoload": {
         "psr-4": {
             "Drupal\\json_forms\\": "src/"
@@ -24,27 +29,20 @@
     "config": {
         "sort-packages": true,
         "allow-plugins": {
-            "dealerdirect/phpcodesniffer-composer-installer": true
+            "dealerdirect/phpcodesniffer-composer-installer": true,
+            "php-http/discovery": false,
+            "phpstan/extension-installer": false,
+            "tbachert/spi": false
         }
     },
-    "repositories": [
-        {
-            "type": "vcs",
-            "url": "https://github.com/systopia/opis-json-schema-ext"
-        },
-        {
-            "type": "vcs",
-            "url": "https://github.com/systopia/expression-language-ext"
-        }
-    ],
     "require": {
         "php": "^7.4 || ^8",
         "systopia/expression-language-ext": "~0.1",
         "systopia/opis-json-schema-ext": "~0.2"
     },
     "require-dev": {
-        "drupal/core": "^9.1.6",
-        "drupal/core-dev": "^9.1.6"
+        "drupal/core": "^9.5 || ^10",
+        "drupal/core-dev": "^9.5 || ^10"
     },
     "scripts": {
         "composer-phpstan": [
@@ -60,7 +58,7 @@
             "@php vendor/bin/phpcbf"
         ],
         "phpstan": [
-            "@php tools/phpstan/vendor/bin/phpstan"
+            "@php tools/phpstan/vendor/bin/phpstan -v"
         ],
         "phpunit": [
             "@php vendor/bin/phpunit --coverage-text"

js/disable-buttons-on-ajax.js

@@ -0,0 +1,44 @@
+/*
+ * Copyright (C) 2024 SYSTOPIA GmbH
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 2 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program.  If not, see <http://www.gnu.org/licenses/>.
+ */
+
+/**
+ * Adding/removing entries to an array before a previous AJAX call has been
+ * finished might lead to an inconsistent state. Thus, buttons are disabled
+ * during AJAX calls. Additionally, form submit is not possible during AJAX
+ * calls. Fields that initiate an AJAX calls are disabled until the call is
+ * finished and would be missing in the submitted data.
+ */
+(function ($) {
+
+  $(document).on('ajaxStart', () => {
+    const buttons = document.querySelectorAll('input[type="submit"]:enabled, input[type="button"]:enabled');
+    buttons.forEach((button) => {
+      button.disabled = true;
+      button.setAttribute('data-ajax-disabled', 'true');
+    });
+  });
+
+  $(document).on('ajaxStop', () => {
+    const buttons = document.querySelectorAll('input[data-ajax-disabled="true"]');
+    buttons.forEach((button) => {
+      button.disabled = false;
+      button.removeAttribute('data-ajax-disabled');
+    });
+
+  });
+
+})(jQuery);

js/number-input.js

@@ -0,0 +1,124 @@
+/*
+ * Copyright (C) 2025 SYSTOPIA GmbH
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 2 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program.  If not, see <http://www.gnu.org/licenses/>.
+ */
+
+/**
+ * Restricts input of number fields to digits, decimal separator, and minus.
+ */
+(function (Drupal, once) {
+  Drupal.behaviors.json_forms_numberInput = {
+    attach: function (context, settings) {
+      // Decimal separator of browser.
+      const decimalSeparator = Intl.NumberFormat()
+        .formatToParts(1.1)
+        .find(part => part.type === 'decimal')
+        .value;
+
+      const digits = [
+        '0',
+        '1',
+        '2',
+        '3',
+        '4',
+        '5',
+        '6',
+        '7',
+        '8',
+        '9',
+      ];
+
+      const allowedKeys = [
+        'ArrowDown',
+        'ArrowLeft',
+        'ArrowRight',
+        'ArrowUp',
+        'Backspace',
+        'Delete',
+        'End',
+        'Enter',
+        'Home',
+        'PageDown',
+        'PageUp',
+        'Tab',
+      ];
+
+      function getElementLang(element) {
+        if (element.lang) {
+          return element.lang;
+        }
+
+        return element.parentElement ? getElementLang(element.parentElement) : null;
+      }
+
+      once('json-forms-number-input', 'input[type="number"]', context).forEach((element) => {
+        let decimalSeparators = decimalSeparator;
+        const lang = getElementLang(element);
+        if (lang) {
+          // Decimal separator of element's language might be different from
+          // the browser's separator. We allow both in that case. It depends on
+          // the browser which one is preferred, i.e. the one that is used when
+          // pressing the buttons to change a number.
+          decimalSeparators += Intl.NumberFormat(lang)
+            .formatToParts(1.1)
+            .find(part => part.type === 'decimal')
+            .value;
+        }
+
+        function isCharAllowed(char) {
+          if (digits.includes(char)) {
+            return true;
+          }
+
+          if ('-' === char) {
+            if (!element.value.includes('-') && (element.min < 0 || element.min === '' || element.min == null)) {
+              return true;
+            }
+          }
+          else if (decimalSeparators.includes(char)) {
+            if (!element.value.includes('.') && (element.step === 'any' || element.step < 1)) {
+              return true;
+            }
+          }
+
+          return false;
+        }
+
+        element.addEventListener('keydown', function (event) {
+          if (!event.ctrlKey && !allowedKeys.includes(event.key) && !isCharAllowed(event.key)) {
+            event.preventDefault();
+          }
+        });
+
+        element.addEventListener('paste', function (event) {
+          const data = event.clipboardData.getData('text/plain');
+          if (data === '') {
+            event.preventDefault();
+            return;
+          }
+
+          for (let i = 0; i < data.length; i++) {
+            if (!isCharAllowed(data[i])) {
+              event.preventDefault();
+
+              return;
+            }
+          }
+        });
+      });
+    }
+  };
+
+})(Drupal, once);