✨ new(rating): adding rating element in FUI.

assets/js/public/forms-section-elements.js

@@ -49,6 +49,7 @@
 							const select = $( this ).find( '.forminator-select' );
 							const select2 = $( this ).find( '.forminator-select2' );
 							const slider = $( this ).find( '.forminator-slider' );
+							const rating = $( this ).find( '.forminator-rating' );
 
 							// Unique id
 							SHOWCASE.uniqueFormField( this );
@@ -80,11 +81,15 @@
 								FUI.select2();
 							}
 
+							// Load rating field.
+							if ( rating.length ) {
+								FUI.rating( rating );
+							}
+
 							// Load radio and checkbox function
 							FUI.radioStates( radio );
 							FUI.checkboxStates( checkbox );
 							FUI.multiSelectStates( multiselect );
-
 						});
 					});
 				}

assets/scss/forms-appearance/_default.scss

@@ -638,6 +638,30 @@
 						color: $dropdown-active--color;
 					}
 				}
+
+				&[aria-multiselectable="true"] {
+					.select2-results__option--selected {
+						background-color: $dropdown-active--background;
+						color: $dropdown-active--color;
+
+						.forminator-checkbox {
+							.forminator-checkbox-box {
+								border-color: $dropdown-active--background;
+							}
+						} 
+					}
+				}
+			}
+		}
+
+		// Checkbox in dropdown
+		.forminator-checkbox {
+			.forminator-checkbox-box {
+				background: $dropdown-active--color;
+
+				&::before {
+					color: $dropdown-active--background;
+				}
 			}
 		}
 	}

form-ui.html

@@ -1046,7 +1046,7 @@ <h1>Forminator Forms</h1>
 				<div class="forminator-field">
 					<label class="forminator-label">Field label <span class="forminator-required">*</span></label>
 					<select placeholder="Placeholder"
-						class="forminator-select">
+						class="forminator-select2">
 						<option>Option 1</option>
 						<option>Option 2</option>
 						<option>Option 3</option>

gulpfile.js

@@ -102,6 +102,7 @@ library.watch.scripts.all = [
 	library.source.scripts + 'select2.js',
 	library.source.scripts + 'authentication.js',
 	library.source.scripts + 'slider.js',
+	library.source.scripts + 'rating.js',
 	library.source.scripts + 'poll-chart.js',
 	library.source.scripts + 'form-submit.js'
 ];
@@ -116,7 +117,8 @@ library.watch.scripts.form = [
 	library.source.scripts + 'multiselect-states.js',
 	library.source.scripts + 'select2.js',
 	library.source.scripts + 'authentication.js',
-	library.source.scripts + 'slider.js'
+	library.source.scripts + 'slider.js',
+	library.source.scripts + 'rating.js'
 ];
 
 library.watch.scripts.poll = [