Merge branch 'develop' into simplifyTemplatesParameters

lubber-de · Oct 30, 2024 · 8ab2fa9 · 8ab2fa9
2 parents 217042a + 14bf847
commit 8ab2fa9
Show file tree

Hide file tree

Showing 25 changed files with 1,135 additions and 254 deletions.
diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml
@@ -26,7 +26,7 @@ jobs:
     strategy:
       fail-fast: false
       matrix:
-        node-version: [12, 14, 16, 18, latest]
+        node-version: [12, 14, 16, 18, 20, 22]
     steps:
     - uses: actions/checkout@v4
     - name: Setup Node.js ${{ matrix.node-version }}

diff --git a/src/definitions/behaviors/form.js b/src/definitions/behaviors/form.js
@@ -38,6 +38,7 @@
                 element     = this,
 
                 formErrors  = [],
+                formErrorsTracker = {},
                 keyHeldDown = false,
 
                 // set at run-time
@@ -948,7 +949,7 @@
                                     $prompt.css('display', 'none');
                                 }
                                 $prompt
-                                    .appendTo($fieldGroup)
+                                    .appendTo($fieldGroup.filter('.' + className.error))
                                 ;
                             }
                             $prompt
@@ -1285,6 +1286,7 @@
                         $module.removeClass(className.initial);
                         // reset errors
                         formErrors = [];
+                        formErrorsTracker = {};
                         if (module.determine.isValid()) {
                             module.debug('Form has no validation errors, submitting');
                             module.set.success();
@@ -1388,7 +1390,22 @@
                                     var invalidFields = module.validate.rule(field, rule, true) || [];
                                     if (invalidFields.length > 0) {
                                         module.debug('Field is invalid', identifier, rule.type);
-                                        fieldErrors.push(module.get.prompt(rule, field));
+                                        var fieldError = module.get.prompt(rule, field);
+                                        if (!settings.inline) {
+                                            if (
+                                                // Always allow the first error prompt for new field identifiers
+                                                (!(identifier in formErrorsTracker)
+                                                // Also allow multiple error prompts per field identifier but make sure each prompt is unique
+                                                || formErrorsTracker[identifier].indexOf(fieldError) === -1)
+                                                // Limit the number of unique error prompts for every field identifier if specified
+                                                && (!errorLimit || (formErrorsTracker[identifier] || []).length < errorLimit)
+                                            ) {
+                                                fieldErrors.push(fieldError);
+                                                (formErrorsTracker[identifier] = formErrorsTracker[identifier] || []).push(fieldError);
+                                            }
+                                        } else {
+                                            fieldErrors.push(fieldError);
+                                        }
                                         fieldValid = false;
                                         if (showErrors) {
                                             $(invalidFields).closest($group).addClass(className.error);
@@ -1403,7 +1420,7 @@
                                 settings.onValid.call($field);
                             }
                         } else {
-                            if (showErrors) {
+                            if (showErrors && fieldErrors.length > 0) {
                                 formErrors = formErrors.concat(fieldErrors);
                                 module.add.prompt(identifier, fieldErrors, true);
                                 settings.onInvalid.call($field, fieldErrors);

diff --git a/src/definitions/collections/form.less b/src/definitions/collections/form.less
@@ -653,13 +653,15 @@
         }
 
         /* Placeholder */
+        .ui.form .@{state} .ui.dropdown > .default.text,
         .ui.form .@{state} ::placeholder {
             color: @formStates[@@state][inputPlaceholderColor];
         }
         .ui.form .@{state} :-ms-input-placeholder when (@supportIE) {
             color: @formStates[@@state][inputPlaceholderColor] !important;
         }
 
+        .ui.form .@{state} .ui.dropdown > input:focus ~ .default.text,
         .ui.form .@{state} :focus::placeholder {
             color: @formStates[@@state][inputPlaceholderFocusColor];
         }
@@ -847,12 +849,16 @@
     }
 }
 
-.ui.ui.ui.ui.form .fields > label:empty::after,
-.ui.ui.ui.ui.form .field > label:empty::after {
+.ui.ui.ui.ui.form .fields:not(.required) > label:empty::after,
+.ui.ui.ui.ui.form .fields:not(.grouped):not(.inline) > .field:not(.required) > label:empty::after {
     content: " ";
     display: inline-block;
 }
 
+.ui.ui.ui.ui.form .inline.fields .field:not(.required) > label:empty {
+    display: none;
+}
+
 /*******************************
            Variations
 *******************************/

diff --git a/src/definitions/collections/message.less b/src/definitions/collections/message.less
@@ -195,6 +195,7 @@
 
     .ui.compact.message {
         display: inline-block;
+        max-width: 100%;
     }
     .ui.compact.icon.message {
         display: inline-flex;

diff --git a/src/definitions/elements/button.less b/src/definitions/elements/button.less
@@ -1098,6 +1098,7 @@
     .ui.ui.circular.buttons .button,
     .ui.ui.ui.ui.circular.button {
         border-radius: @circularBorderRadius;
+        min-width: @circularMinWidth;
     }
 
     .ui.circular.buttons .button > .icon,

diff --git a/src/definitions/elements/label.less b/src/definitions/elements/label.less
@@ -184,6 +184,7 @@ a.ui.label {
              Types
 *******************************/
 & when (@variationLabelImage) {
+    .ui.image.labels .label,
     .ui.image.label {
         width: auto;
         margin-top: 0;
@@ -199,6 +200,10 @@ a.ui.label {
             padding: @imageLabelPadding;
         }
     }
+    .ui.labels .image.label,
+    .ui.image.labels .label {
+        margin-bottom: @groupVerticalMargin;
+    }
 
     .ui.image.label img {
         display: inline-block;

diff --git a/src/definitions/modules/dropdown.js b/src/definitions/modules/dropdown.js
@@ -1230,7 +1230,9 @@
                             if (module.is.searchSelection()) {
                                 module.remove.searchTerm();
                             }
-                            module.hide();
+                            if (settings.collapseOnClearable) {
+                                module.hide();
+                            }
                             event.stopPropagation();
                         },
                     },
@@ -4096,6 +4098,7 @@
         headerDivider: true, // whether option headers should have an additional divider line underneath when converted from <select> <optgroup>
 
         collapseOnActionable: true, // whether the dropdown should collapse upon selection of an actionable item
+        collapseOnClearable: false, // whether the dropdown should collapse upon clicking the clearable icon
 
         // label settings on multi-select
         label: {

diff --git a/src/definitions/modules/dropdown.less b/src/definitions/modules/dropdown.less
@@ -751,7 +751,7 @@ select.ui.dropdown {
         opacity: @selectionTextUnderlayIconOpacity;
     }
     .ui.active.search.dropdown input.search:focus + .text {
-        color: @selectionTextUnderlayColor !important;
+        color: @selectionTextUnderlayColor;
     }
 
     .ui.search.dropdown.button > span.sizer {
@@ -922,6 +922,9 @@ select.ui.dropdown {
             padding: inherit;
             margin: @multipleSelectionChildMargin;
             line-height: @multipleSelectionChildLineHeight;
+            &.default {
+                z-index: -1;
+            }
         }
 
         .ui.multiple.search.dropdown > .label ~ .text {
@@ -1976,7 +1979,7 @@ select.ui.dropdown {
         opacity: @invertedSelectionTextUnderlayIconOpacity;
     }
     .ui.inverted.active.search.dropdown input.search:focus + .text {
-        color: @invertedSelectionTextUnderlayColor !important;
+        color: @invertedSelectionTextUnderlayColor;
     }
 
     .ui.dropdown .inverted.menu > .message:not(.ui),

diff --git a/src/definitions/modules/shape.js b/src/definitions/modules/shape.js
@@ -185,7 +185,7 @@
                 set: {
 
                     defaultSide: function () {
-                        $activeSide = $side.filter('.' + settings.className.active);
+                        $activeSide = $side.filter('.' + className.active);
                         $nextSide = $activeSide.next(selector.side).length > 0
                             ? $activeSide.next(selector.side)
                             : $side.first();
@@ -211,7 +211,7 @@
 
                     currentStageSize: function () {
                         var
-                            $activeSide = $side.filter('.' + settings.className.active),
+                            $activeSide = $side.filter('.' + className.active),
                             width       = $activeSide.outerWidth(true),
                             height      = $activeSide.outerHeight(true)
                         ;
@@ -227,7 +227,7 @@
                         var
                             $clone      = $module.clone().addClass(className.loading),
                             $side       = $clone.find('>' + selector.sides + '>' + selector.side),
-                            $activeSide = $side.filter('.' + settings.className.active),
+                            $activeSide = $side.filter('.' + className.active),
                             $nextSide   = nextIndex
                                 ? $side.eq(nextIndex)
                                 : ($activeSide.next(selector.side).length > 0

diff --git a/src/themes/default/elements/button.variables b/src/themes/default/elements/button.variables
@@ -394,6 +394,7 @@
 /* Circular */
 @circularBorderRadius: 10em;
 @circularIconWidth: 1em;
+@circularMinWidth: 2.5em;
 @circularGroupMargin: 0.25em;
 @circularVerticalGroupMargin: @circularGroupMargin;