feat(separator): Add style property on Separator UiElement

monsieurbiz · Nov 4, 2024 · 9339180 · 9339180
1 parent 836a40d
commit 9339180
Show file tree

Hide file tree

Showing 9 changed files with 62 additions and 1 deletion.
diff --git a/src/Form/Type/UiElement/SeparatorType.php b/src/Form/Type/UiElement/SeparatorType.php
@@ -15,12 +15,19 @@
 
 use Symfony\Component\Form\AbstractType;
 use Symfony\Component\Form\Extension\Core\Type\CheckboxType;
+use Symfony\Component\Form\Extension\Core\Type\ChoiceType;
 use Symfony\Component\Form\FormBuilderInterface;
 use Symfony\Component\Form\FormEvent;
 use Symfony\Component\Form\FormEvents;
 
 class SeparatorType extends AbstractType
 {
+    public const SOLID_STYLE = 'solid';
+
+    public const DASHED_STYLE = 'dashed';
+
+    public const DOTTED_STYLE = 'dotted';
+
     /**
      * @inheritdoc
      */
@@ -31,6 +38,14 @@ public function buildForm(FormBuilderInterface $builder, array $options): void
                 'label' => 'monsieurbiz_richeditor_plugin.ui_element.monsieurbiz.separator.field.hidden',
                 'required' => false,
             ])
+            ->add('style', ChoiceType::class, [
+                'label' => 'monsieurbiz_richeditor_plugin.ui_element.monsieurbiz.separator.field.style.label',
+                'choices' => [
+                    'monsieurbiz_richeditor_plugin.ui_element.monsieurbiz.separator.field.style.choices.solid' => self::SOLID_STYLE,
+                    'monsieurbiz_richeditor_plugin.ui_element.monsieurbiz.separator.field.style.choices.dashed' => self::DASHED_STYLE,
+                    'monsieurbiz_richeditor_plugin.ui_element.monsieurbiz.separator.field.style.choices.dotted' => self::DOTTED_STYLE,
+                ],
+            ])
             ->addEventListener(FormEvents::PRE_SET_DATA, function (FormEvent $event): void {
                 /** @var array $data */
                 $data = $event->getData();

diff --git a/src/Resources/translations/messages.en.yml b/src/Resources/translations/messages.en.yml
@@ -73,6 +73,12 @@ monsieurbiz_richeditor_plugin:
       description: 'A separator element. The separator can be a hidden one.'
       field:
         hidden: 'Hidden separator'
+        style:
+         label: 'Style'
+         choices:
+           solid: 'Solid'
+           dashed: 'Dashed'
+           dotted: 'Dotted'
     monsieurbiz.button:
       title: 'Button Element'
       short_description: 'A button with a text and a link.'

diff --git a/src/Resources/translations/messages.es.yml b/src/Resources/translations/messages.es.yml
@@ -73,6 +73,12 @@ monsieurbiz_richeditor_plugin:
       description: 'Un elemento separador. El separador puede ser uno oculto.'
       field:
         hidden: 'Separador oculto'
+        style:
+         label: 'Estilo'
+         choices:
+           solid: 'Sólido'
+           dashed: 'Punteado'
+           dotted: 'Punteado'
     monsieurbiz.button:
       title: 'Elemento de botón'
       short_description: 'Un botón con un texto y un enlace.'

diff --git a/src/Resources/translations/messages.fr.yml b/src/Resources/translations/messages.fr.yml
@@ -73,6 +73,12 @@ monsieurbiz_richeditor_plugin:
       description: 'Une lame permettant de faire séparateur. Le séparateur peut être caché.'
       field:
         hidden: 'Séparateur caché'
+        style:
+         label: 'Style'
+         choices:
+           solid: 'Solide'
+           dashed: 'Pointillé'
+           dotted: 'Pointé'
     monsieurbiz.button:
       title: 'Lame Bouton'
       short_description: 'Un bouton avec un texte et un lien.'

diff --git a/src/Resources/translations/messages.hr.yml b/src/Resources/translations/messages.hr.yml
@@ -73,6 +73,12 @@ monsieurbiz_richeditor_plugin:
       description: 'Vidljivi ili nevidljivi element koji se nalazi između dva druga elementa i tako ih razdvaja.'
       field:
         hidden: 'Skriveni razdjelnik'
+        style:
+         label: 'Stil'
+         choices:
+           solid: 'Solidan'
+           dashed: 'Isprekidan'
+           dotted: 'Točkast'
     monsieurbiz.button:
       title: 'Gumb'
       short_description: 'Gumb s tekstom i linkom.'

diff --git a/src/Resources/translations/messages.nl.yml b/src/Resources/translations/messages.nl.yml
@@ -55,6 +55,12 @@ monsieurbiz_richeditor_plugin:
       description: 'Een scheidingselement dat optioneel verborgen kan zijn.'
       field:
         hidden: 'Verborgen scheidingselement'
+        style:
+         label: 'Stijl'
+         choices:
+           solid: 'Solide'
+           dashed: 'Gestippeld'
+           dotted: 'Gepunt'
     monsieurbiz.button:
       title: 'Knop'
       short_description: 'Een knop met tekst en een link.'

diff --git a/src/Resources/translations/messages.pl.yaml b/src/Resources/translations/messages.pl.yaml
@@ -73,6 +73,12 @@ monsieurbiz_richeditor_plugin:
             description: 'Element separatora. Separator może być ukryty.'
             field:
                 hidden: 'Ukryty separator'
+                style:
+                    label: 'Styl'
+                    choices:
+                        solid: 'Solidny'
+                        dashed: 'Kreskowany'
+                        dotted: 'Kropkowany'
         monsieurbiz.button:
             title: 'Element przycisku'
             short_description: 'Przycisk z tekstem i linkiem.'

diff --git a/src/Resources/views/Admin/UiElement/separator.html.twig b/src/Resources/views/Admin/UiElement/separator.html.twig
@@ -3,5 +3,9 @@
     type: separator
     element fields :
         hidden
+        style
 #}
 <div class="ui {% if element is not empty and element.hidden is not empty %}hidden{% endif %} divider"></div>
+{% if element.style is defined and element is not empty %}
+    <div class="ui label">{{ ('monsieurbiz_richeditor_plugin.ui_element.monsieurbiz.separator.field.style.choices.' ~ element.style)|trans }}</div>
+{% endif %}
diff --git a/src/Resources/views/Shop/UiElement/separator.html.twig b/src/Resources/views/Shop/UiElement/separator.html.twig
@@ -3,5 +3,11 @@
     type: separator
     element fields :
         hidden
+        style
 #}
-<div class="ui {% if element.hidden is not empty %}hidden{% endif %} divider"></div>
+{% set borderStyleMap = {
+    (constant('MonsieurBiz\\SyliusRichEditorPlugin\\Form\\Type\\UiElement\\SeparatorType::SOLID_STYLE')): 'border-top: 1px solid; border-bottom: none;',
+    (constant('MonsieurBiz\\SyliusRichEditorPlugin\\Form\\Type\\UiElement\\SeparatorType::DOTTED_STYLE')): 'border-top: 1px dotted; border-bottom: none;',
+    (constant('MonsieurBiz\\SyliusRichEditorPlugin\\Form\\Type\\UiElement\\SeparatorType::DASHED_STYLE')): 'border-top: 1px dashed; border-bottom: none;',
+} %}
+<div class="ui {% if element.hidden is not empty %}hidden{% endif %} divider" {% if element.style is defined and element.style is not empty %}style="{{ borderStyleMap[element.style] }}"{% endif %}></div>