Issue #3503757: Flexibility in adding attributes

README.md

@@ -6,7 +6,7 @@ This module widget allows you to add attributes to the input such as:
  - max
  - placeholder
  - step....
-
+ - custom attributes
 
 For number and phone number fields it'll help you to type numbers with
 separators to avoid entering wrong data
@@ -16,7 +16,13 @@ For example if you choose a phone number
  - The step is 2 then it will be in the form **01 23 45 67 89**
 For example if a number field you choose to
  - Separator as space
- - the step is 3 then when entering data it will display **10 00 000**
+ - the step is 3 then when entering data it will display **1 000 000**
+Custom attributes variables
+ - entity (Example: {{entity.title.value}})
+ - values (Form values)
+ - field_name
+ - delta
+ - form
 
 ## Installation
 

config/schema/input_pattern.schema.yml

@@ -35,3 +35,6 @@ field.widget.settings.input_pattern:
     class:
       type: string
       label: custom class
+    custom:
+      type: string
+      label: custom attributes

src/Plugin/Field/FieldWidget/InputPatternWidget.php

@@ -3,10 +3,13 @@
 namespace Drupal\input_pattern\Plugin\Field\FieldWidget;
 
 use Drupal\Core\Field\Attribute\FieldWidget;
+use Drupal\Core\Field\FieldDefinitionInterface;
 use Drupal\Core\Field\FieldItemListInterface;
 use Drupal\Core\Field\WidgetBase;
 use Drupal\Core\Form\FormStateInterface;
 use Drupal\Core\StringTranslation\TranslatableMarkup;
+use Twig\Environment as Twig_Environment;
+use Symfony\Component\DependencyInjection\ContainerInterface;
 
 /**
  * Defines the 'input_pattern' field widget.
@@ -26,6 +29,27 @@ use Drupal\Core\StringTranslation\TranslatableMarkup;
 )]
 class InputPatternWidget extends WidgetBase {
 
+  /**
+   * {@inheritdoc}
+   */
+  public function __construct($plugin_id, $plugin_definition, FieldDefinitionInterface $field_definition, array $settings, array $third_party_settings, protected Twig_Environment $twig) {
+    parent::__construct($plugin_id, $plugin_definition, $field_definition, $settings, $third_party_settings);
+  }
+
+  /**
+   * {@inheritdoc}
+   */
+  public static function create(ContainerInterface $container, array $configuration, $plugin_id, $plugin_definition) {
+    return new static(
+      $plugin_id,
+      $plugin_definition,
+      $configuration['field_definition'],
+      $configuration['settings'],
+      $configuration['third_party_settings'],
+      $container->get('twig')
+    );
+  }
+
   /**
    * {@inheritdoc}
    */
@@ -41,6 +65,7 @@ class InputPatternWidget extends WidgetBase {
       'list' => '',
       'min' => '',
       'max' => '',
+      'custom' => '',
     ];
     return $setting + parent::defaultSettings();
   }
@@ -49,7 +74,7 @@ class InputPatternWidget extends WidgetBase {
    * {@inheritdoc}
    */
   public function settingsForm(array $form, FormStateInterface $form_state): array {
-    $settings = $mode_settings = $this->getSettings();
+    $settings = $this->getSettings();
     $field_settings = $this->getFieldSettings();
     $field_name = $this->fieldDefinition->getName();
     $field_state = 'name="fields[' . $field_name . '][settings_edit_form][settings][type]"';
@@ -259,6 +284,12 @@ class InputPatternWidget extends WidgetBase {
       '#title' => $this->t('Custom class'),
       '#default_value' => $this->getSetting('class'),
     ];
+    $element['custom'] = [
+      '#type' => 'textarea',
+      '#title' => $this->t('Custom attributes'),
+      '#description' => $this->t('Each variable is a new line. Can use with twig. Example: <br/>data-bs-toggle="tooltip"<br/>data-bs-title="{{entity.title.value}}"'),
+      '#default_value' => $this->getSetting('custom'),
+    ];
     return $element;
   }
 
@@ -317,10 +348,34 @@ class InputPatternWidget extends WidgetBase {
       $element['value']['#attributes']['class'][] = $settings['class'];
       unset($settings['class']);
     }
-    foreach (['size', 'step', 'maxlength', 'placeholder'] as $attribute) {
+    $native = ['size', 'step', 'maxlength', 'placeholder'];
+    foreach ($native as $attribute) {
       if (!empty($settings[$attribute])) {
         $element['value']['#' . $attribute] = $settings[$attribute];
       }
+      if (isset($settings[$attribute])) {
+        unset($settings[$attribute]);
+      }
+    }
+    if (!empty($settings['custom'])) {
+      $attributes = explode(PHP_EOL, $settings['custom']);
+      $context = [
+        'form' => $form,
+        'delta' => $delta,
+        'entity' => $items->getEntity() ?? '',
+        'values' => $form_state->getValues() ?? [],
+        'field_name' => $items->getName(),
+      ];
+      foreach ($attributes as $attribute) {
+        if (empty(trim($attribute))) {
+          continue;
+        }
+        $variables = explode('=', $attribute);
+        $key = trim(str_replace(['"', "'", ' '], ['', '', '-'], $variables[0]));
+        $val = trim(str_replace(['"', "'"], '', $variables[1] ?? $variables[0]));
+        $settings[$key] = $this->twig->renderInline($val, $context);
+      }
+      unset($settings['custom']);
     }
     foreach ($settings as $name => $value) {
       if (!empty($value)) {