From beb7fc4504bbca4ef9fcb7883fb00b84f1e332b9 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Harouna=20Traor=C3=A9?= <haroun@users.noreply.github.com>
Date: Fri, 27 Oct 2023 17:18:07 +0200
Subject: [PATCH 1/5] add multiple and size fields to select widget

---
 CHANGELOG.md                                  |  1 +
 i18n/en.json                                  |  2 ++
 .../form-select-field-widget/index.js         | 29 +++++++++++++++++++
 .../views/widget.html                         |  1 +
 4 files changed, 33 insertions(+)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 131383c..30ca4ae 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -5,6 +5,7 @@
 ### Adds
 
 * Add group widget which is a fieldset container for other form widgets.
+* Add multiple and size fields to select widget.
 
 ### Fixes
 
diff --git a/i18n/en.json b/i18n/en.json
index 1a1b6e6..a8a5249 100644
--- a/i18n/en.json
+++ b/i18n/en.json
@@ -84,8 +84,10 @@
   "recaptchaValidationError": "There was a problem validating your reCAPTCHA verification submission.",
   "requiredError": "This field is required",
   "select": "Select input",
+  "selectAllowMultiple": "Allow multiple options to be selected",
   "selectBlank": "",
   "selectChoice": "Select input options",
+  "selectSize": "Number of options in the list that should be visible",
   "submitLabel": "Submit button label",
   "templateOptional": "(Optional)",
   "text": "Text input",
diff --git a/modules/@apostrophecms/form-select-field-widget/index.js b/modules/@apostrophecms/form-select-field-widget/index.js
index c6e5c46..06ac765 100644
--- a/modules/@apostrophecms/form-select-field-widget/index.js
+++ b/modules/@apostrophecms/form-select-field-widget/index.js
@@ -26,6 +26,19 @@ module.exports = {
             }
           }
         }
+      },
+      allowMultiple: {
+        label: 'aposForm:selectAllowMultiple',
+        type: 'boolean',
+        def: true
+      },
+      size: {
+        label: 'aposForm:selectSize',
+        type: 'number',
+        def: 0,
+        if: {
+          allowMultiple: true
+        }
       }
     }
   },
@@ -38,5 +51,21 @@ module.exports = {
         output[widget.fieldName] = self.apos.launder.select(input[widget.fieldName], choices);
       }
     };
+  },
+  extendMethods (self) {
+    return {
+      async output(_super, req, widget, options, _with) {
+        return _super(
+          req,
+          {
+            ...widget,
+            allowMultiple: widget.allowMultiple ?? true,
+            size: widget.size ?? 0
+          },
+          options,
+          _with
+        );
+      }
+    };
   }
 };
diff --git a/modules/@apostrophecms/form-select-field-widget/views/widget.html b/modules/@apostrophecms/form-select-field-widget/views/widget.html
index 1c58568..30d9c58 100644
--- a/modules/@apostrophecms/form-select-field-widget/views/widget.html
+++ b/modules/@apostrophecms/form-select-field-widget/views/widget.html
@@ -17,6 +17,7 @@
   <select
     class="apos-form-input {{ prependIfPrefix('__input') }}" id="{{ id }}"
     name="{{ widget.fieldName}}" {% if widget.required %}required{% endif %}
+    {% if widget.allowMultiple %}multiple {% if widget.size %}size="{{ widget.size }}"{% endif %}{% endif %}
   >
     <option value="">{{ __t("aposForm:selectBlank") }}</option>
     {% for choice in widget.choices %}

From 019f4ed1bc314936ed72eb61e7f3eae41ad4b971 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Harouna=20Traor=C3=A9?= <haroun@users.noreply.github.com>
Date: Fri, 27 Oct 2023 17:30:13 +0200
Subject: [PATCH 2/5] fix typo

---
 modules/@apostrophecms/form-select-field-widget/index.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/modules/@apostrophecms/form-select-field-widget/index.js b/modules/@apostrophecms/form-select-field-widget/index.js
index 06ac765..b5ccdff 100644
--- a/modules/@apostrophecms/form-select-field-widget/index.js
+++ b/modules/@apostrophecms/form-select-field-widget/index.js
@@ -34,7 +34,7 @@ module.exports = {
       },
       size: {
         label: 'aposForm:selectSize',
-        type: 'number',
+        type: 'integer',
         def: 0,
         if: {
           allowMultiple: true

From 5ee552cd5084aeae9ab74822f40a82a56c1ca64b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Harouna=20Traor=C3=A9?= <haroun@users.noreply.github.com>
Date: Fri, 27 Oct 2023 17:47:24 +0200
Subject: [PATCH 3/5] set multiple default value to false for select widget

---
 modules/@apostrophecms/form-select-field-widget/index.js | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/modules/@apostrophecms/form-select-field-widget/index.js b/modules/@apostrophecms/form-select-field-widget/index.js
index b5ccdff..95764e0 100644
--- a/modules/@apostrophecms/form-select-field-widget/index.js
+++ b/modules/@apostrophecms/form-select-field-widget/index.js
@@ -30,12 +30,13 @@ module.exports = {
       allowMultiple: {
         label: 'aposForm:selectAllowMultiple',
         type: 'boolean',
-        def: true
+        def: false
       },
       size: {
         label: 'aposForm:selectSize',
         type: 'integer',
         def: 0,
+        min: 0,
         if: {
           allowMultiple: true
         }

From b520425186c4c4e0d8798a304c86e647c47f7e0c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Harouna=20Traor=C3=A9?= <haroun@users.noreply.github.com>
Date: Mon, 30 Oct 2023 16:28:20 +0100
Subject: [PATCH 4/5] default value is false for select multiple

---
 modules/@apostrophecms/form-select-field-widget/index.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/modules/@apostrophecms/form-select-field-widget/index.js b/modules/@apostrophecms/form-select-field-widget/index.js
index 95764e0..fdc2d93 100644
--- a/modules/@apostrophecms/form-select-field-widget/index.js
+++ b/modules/@apostrophecms/form-select-field-widget/index.js
@@ -60,7 +60,7 @@ module.exports = {
           req,
           {
             ...widget,
-            allowMultiple: widget.allowMultiple ?? true,
+            allowMultiple: widget.allowMultiple ?? false,
             size: widget.size ?? 0
           },
           options,

From 7d649191d887972ed9ebf585078ec6c0c50cf00e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Harouna=20Traor=C3=A9?= <haroun@users.noreply.github.com>
Date: Tue, 31 Oct 2023 10:33:39 +0100
Subject: [PATCH 5/5] add allow multiple option and documentation

---
 README.md                                     | 19 +++++
 .../form-select-field-widget/index.js         | 83 ++++++++++---------
 2 files changed, 65 insertions(+), 37 deletions(-)

diff --git a/README.md b/README.md
index 5add8a0..6c18319 100644
--- a/README.md
+++ b/README.md
@@ -103,6 +103,25 @@ module.exports = {
 };
 ```
 
+#### select field widget option
+
+The select field widget has an option `allowMultiple` to allow multiple select options to be selected. The default value is `false`.
+
+Once set to `true`, it will add two new fields to the select field widget schema: 
+
+|  Property | Type | Description |
+|---|---|---|
+| `allowMultiple` | Boolean | Set to `true` to enable multiple values to be selected in the select widget options, default value is `false` |
+| `size` | Integer | Number of options in the list that should be visible, default value is `0` |
+
+```javascript
+// modules/@apostrophecms/form-select-field/index.js
+modules.exports = {
+  options: {
+    allowMultiple: false
+  }
+}
+```
 
 ### Supporting file field uploads safely
 
diff --git a/modules/@apostrophecms/form-select-field-widget/index.js b/modules/@apostrophecms/form-select-field-widget/index.js
index fdc2d93..1183ce9 100644
--- a/modules/@apostrophecms/form-select-field-widget/index.js
+++ b/modules/@apostrophecms/form-select-field-widget/index.js
@@ -2,46 +2,55 @@ module.exports = {
   extend: '@apostrophecms/form-base-field-widget',
   options: {
     label: 'aposForm:select',
-    icon: 'form-select-icon'
+    icon: 'form-select-icon',
+    allowMultiple: false
   },
-  fields: {
-    add: {
-      choices: {
-        label: 'aposForm:selectChoice',
-        type: 'array',
-        titleField: 'label',
-        required: true,
-        fields: {
-          add: {
-            label: {
-              type: 'string',
-              required: true,
-              label: 'aposForm:checkboxChoicesLabel',
-              help: 'aposForm:checkboxChoicesLabelHelp'
-            },
-            value: {
-              type: 'string',
-              label: 'aposForm:checkboxChoicesValue',
-              help: 'aposForm:checkboxChoicesValueHelp'
-            }
+  fields(self) {
+    const optionalFields = self.options.allowMultiple
+      ? {
+        allowMultiple: {
+          label: 'aposForm:selectAllowMultiple',
+          type: 'boolean',
+          def: false
+        },
+        size: {
+          label: 'aposForm:selectSize',
+          type: 'integer',
+          def: 0,
+          min: 0,
+          if: {
+            allowMultiple: true
           }
         }
-      },
-      allowMultiple: {
-        label: 'aposForm:selectAllowMultiple',
-        type: 'boolean',
-        def: false
-      },
-      size: {
-        label: 'aposForm:selectSize',
-        type: 'integer',
-        def: 0,
-        min: 0,
-        if: {
-          allowMultiple: true
-        }
       }
-    }
+      : {};
+
+    return {
+      add: {
+        choices: {
+          label: 'aposForm:selectChoice',
+          type: 'array',
+          titleField: 'label',
+          required: true,
+          fields: {
+            add: {
+              label: {
+                type: 'string',
+                required: true,
+                label: 'aposForm:checkboxChoicesLabel',
+                help: 'aposForm:checkboxChoicesLabelHelp'
+              },
+              value: {
+                type: 'string',
+                label: 'aposForm:checkboxChoicesValue',
+                help: 'aposForm:checkboxChoicesValueHelp'
+              }
+            }
+          }
+        },
+        ...optionalFields
+      }
+    };
   },
   methods (self) {
     return {
@@ -60,7 +69,7 @@ module.exports = {
           req,
           {
             ...widget,
-            allowMultiple: widget.allowMultiple ?? false,
+            allowMultiple: (self.options.allowMultiple && widget.allowMultiple) ?? false,
             size: widget.size ?? 0
           },
           options,