@atlassian/aui 9.2.16-bbd82a2f8 → 9.2.16

package/src/js/aui/select.js

@@ -16,7 +16,7 @@ import SuggestionsView from './internal/select/suggestions-view';
 import template from './internal/select/template';
 import uniqueId from './unique-id';
 import { INPUT_SUFFIX } from './internal/constants';
-import {ifGone} from './internal/elements';
+import { ifGone } from './internal/elements';
 
 var DESELECTED = -1;
 var NO_HIGHLIGHT = -1;
@@ -41,11 +41,11 @@ function hasResults(element) {
     return element._suggestionModel.getNumberOfResults();
 }
 
-function waitForAssistive (callback) {
+function waitForAssistive(callback) {
     setTimeout(callback, 50);
 }
 
-function setBusyState (element) {
+function setBusyState(element) {
     if (!element._button.isBusy()) {
         element._button.busy();
         element._input.setAttribute('aria-busy', 'true');
@@ -53,23 +53,23 @@ function setBusyState (element) {
     }
 }
 
-function setIdleState (element) {
+function setIdleState(element) {
     element._button.idle();
     element._input.setAttribute('aria-busy', 'false');
     element._dropdown.setAttribute('aria-busy', 'false');
 }
 
-function matchPrefix (model, query) {
+function matchPrefix(model, query) {
     var value = model.get('label').toLowerCase();
     return value.indexOf(query.toLowerCase()) === 0;
 }
 
-function hideDropdown (element) {
+function hideDropdown(element) {
     element._suggestionsView.hide();
     element._input.setAttribute('aria-expanded', 'false');
 }
 
-function setInitialVisualState (element) {
+function setInitialVisualState(element) {
     var initialHighlightedItem = hasResults(element) ? 0 : NO_HIGHLIGHT;
 
     element._suggestionModel.highlight(initialHighlightedItem);
@@ -77,12 +77,12 @@ function setInitialVisualState (element) {
     hideDropdown(element);
 }
 
-function setElementImage (element, imageSource) {
+function setElementImage(element, imageSource) {
     $(element._input).addClass('aui-select-has-inline-image');
     element._input.setAttribute('style', 'background-image: url(' + encodeURI(imageSource) + ')');
 }
 
-function suggest (element, autoHighlight, query) {
+function suggest(element, autoHighlight, query) {
     element._autoHighlight = autoHighlight;
 
     if (query === undefined) {
@@ -92,14 +92,16 @@ function suggest (element, autoHighlight, query) {
     element._progressiveDataSet.query(query);
 }
 
-function setInputImageToHighlightedSuggestion (element) {
-    var imageSource = (element._suggestionModel.highlighted() && element._suggestionModel.highlighted().get('img-src'));
+function setInputImageToHighlightedSuggestion(element) {
+    var imageSource =
+        element._suggestionModel.highlighted() &&
+        element._suggestionModel.highlighted().get('img-src');
     if (imageSource) {
         setElementImage(element, imageSource);
     }
 }
 
-function setValueAndDisplayFromModel (element, model) {
+function setValueAndDisplayFromModel(element, model) {
     if (!model) {
         return;
     }
@@ -118,25 +120,25 @@ function setValueAndDisplayFromModel (element, model) {
 
     select.innerHTML = '';
     select.options.add(option);
-    select.dispatchEvent(new CustomEvent('change', {bubbles: true}));
+    select.dispatchEvent(new CustomEvent('change', { bubbles: true }));
 }
 
-function clearValue (element) {
+function clearValue(element) {
     element._input.value = '';
     element._select.innerHTML = '';
 }
 
-function selectHighlightedSuggestion (element) {
+function selectHighlightedSuggestion(element) {
     setValueAndDisplayFromModel(element, element._suggestionModel.highlighted());
     setInputImageToHighlightedSuggestion(element);
     setInitialVisualState(element);
 }
 
-function convertOptionToModel (option) {
+function convertOptionToModel(option) {
     return new SuggestionModel(option.serialize());
 }
 
-function convertOptionsToModels (element) {
+function convertOptionsToModels(element) {
     var models = [];
 
     for (var i = 0; i < element._datalist.children.length; i++) {
@@ -153,7 +155,7 @@ function convertOptionsToModels (element) {
  * @param data
  * @returns {boolean} true if the results are different from the previous set; false otherwise.
  */
-function clearAndSet (element, data) {
+function clearAndSet(element, data) {
     const before = element._suggestionModel.getNumberOfResults();
     element._suggestionModel.set();
     element._suggestionModel.set(data.results);
@@ -161,12 +163,12 @@ function clearAndSet (element, data) {
     return before !== after;
 }
 
-function getActiveId (select) {
+function getActiveId(select) {
     var active = select._dropdown.querySelector('.aui-select-active');
     return active && active.id;
 }
 
-function getIndexInResults (id, results) {
+function getIndexInResults(id, results) {
     var resultsIds = $.map(results, function (result) {
         return result.id;
     });
@@ -174,7 +176,7 @@ function getIndexInResults (id, results) {
     return resultsIds.indexOf(id);
 }
 
-function createNewValueModel (element) {
+function createNewValueModel(element) {
     var option = new Option();
     option.setAttribute('value', element._input.value);
     var newValueSuggestionModel = convertOptionToModel(option);
@@ -182,12 +184,12 @@ function createNewValueModel (element) {
     return newValueSuggestionModel;
 }
 
-function initialiseProgressiveDataSet (element) {
+function initialiseProgressiveDataSet(element) {
     element._progressiveDataSet = new ProgressiveDataSet(convertOptionsToModels(element), {
         model: SuggestionModel,
         matcher: matchPrefix,
         queryEndpoint: element._queryEndpoint,
-        maxResults: DEFAULT_SS_PDS_SIZE
+        maxResults: DEFAULT_SS_PDS_SIZE,
     });
 
     element._isSync = !element._queryEndpoint;
@@ -259,20 +261,27 @@ function initialiseProgressiveDataSet (element) {
         element._input.setAttribute('aria-expanded', 'true');
 
         // If the response is async (append operation), has elements to append and has a highlighted element, we need to update the status.
-        if (!element._isSync && resultsChanged && element._suggestionsView.getActive() && state(element).get('should-flag-new-suggestions')) {
-            element.querySelector('.aui-select-status').innerHTML = I18n.getText('aui.select.new.suggestions');
+        if (
+            !element._isSync &&
+            resultsChanged &&
+            element._suggestionsView.getActive() &&
+            state(element).get('should-flag-new-suggestions')
+        ) {
+            element.querySelector('.aui-select-status').innerHTML = I18n.getText(
+                'aui.select.new.suggestions'
+            );
         }
 
         element._suggestionsView.show();
     });
 }
 
-function associateDropdownAndTrigger (element) {
+function associateDropdownAndTrigger(element) {
     element._dropdown.id = element._listId;
     element.querySelector('button').setAttribute('aria-controls', element._listId);
 }
 
-function bindHighlightMouseover (element) {
+function bindHighlightMouseover(element) {
     $(element._dropdown).on('mouseover', 'li', function (e) {
         if (hasResults(element)) {
             element._suggestionModel.highlight($(e.target).index());
@@ -280,10 +289,10 @@ function bindHighlightMouseover (element) {
     });
 }
 
-export function bindSelectMousedown (element) {
+export function bindSelectMousedown(element) {
     let preventClosingContainerLayer = false;
 
-    $(document).on('aui-close-layers-on-outer-click.single-select', e => {
+    $(document).on('aui-close-layers-on-outer-click.single-select', (e) => {
         if (preventClosingContainerLayer) {
             e.preventDefault();
             preventClosingContainerLayer = false;
@@ -308,7 +317,7 @@ export function bindSelectMousedown (element) {
     });
 }
 
-function initialiseValue (element) {
+function initialiseValue(element) {
     var option = element._datalist.querySelector('aui-option[selected]');
 
     if (option) {
@@ -316,11 +325,11 @@ function initialiseValue (element) {
     }
 }
 
-function isQueryInProgress (element) {
+function isQueryInProgress(element) {
     return element._progressiveDataSet.activeQueryCount > 0;
 }
 
-function focusInHandler (element) {
+function focusInHandler(element) {
     //if there is a selected value the single select should do an empty
     //search and return everything
     var searchValue = element.value ? '' : element._input.value;
@@ -329,7 +338,7 @@ function focusInHandler (element) {
     suggest(element, true, searchValue);
 }
 
-function cancelInProgressQueries (element) {
+function cancelInProgressQueries(element) {
     if (isQueryInProgress(element)) {
         state(element).set('should-cancel-response', true);
     }
@@ -341,7 +350,7 @@ function getSelectedLabel(element) {
     }
 }
 
-function handleInvalidInputOnFocusOut (element) {
+function handleInvalidInputOnFocusOut(element) {
     var selectCanBeEmpty = !element.hasAttribute('no-empty-values');
     var selectionIsEmpty = !element._input.value;
     var selectionNotExact = element._input.value !== getSelectedLabel(element);
@@ -366,14 +375,14 @@ function handleHighlightOnFocusOut(element) {
     element._suggestionModel.highlight(NO_HIGHLIGHT);
 }
 
-function focusOutHandler (element) {
+function focusOutHandler(element) {
     cancelInProgressQueries(element);
     handleInvalidInputOnFocusOut(element);
     handleHighlightOnFocusOut(element);
     hideDropdown(element);
 }
 
-function handleTabOut (element) {
+function handleTabOut(element) {
     var isSuggestionViewVisible = element._suggestionsView.isVisible();
     if (isSuggestionViewVisible) {
         selectHighlightedSuggestion(element);
@@ -405,7 +414,11 @@ const SelectEl = skate('aui-select', {
                 }
             });
 
-            element._suggestionsView.render(suggestionsToAdd, oldSuggestions.length, element._listId);
+            element._suggestionsView.render(
+                suggestionsToAdd,
+                oldSuggestions.length,
+                element._listId
+            );
         };
 
         element._suggestionModel.onHighlightChange = function () {
@@ -453,7 +466,7 @@ const SelectEl = skate('aui-select', {
 
         src(element, data) {
             element._queryEndpoint = data.newValue;
-        }
+        },
     },
 
     events: {
@@ -462,7 +475,10 @@ const SelectEl = skate('aui-select', {
         },
 
         'mousedown button': function (element) {
-            if (document.activeElement === element._input && !element._dropdown.hasAttribute('hidden')) {
+            if (
+                document.activeElement === element._input &&
+                !element._dropdown.hasAttribute('hidden')
+            ) {
                 state(element).set('prevent-open-on-button-click', true);
             }
         },
@@ -482,7 +498,7 @@ const SelectEl = skate('aui-select', {
             }
         },
 
-        input: function (element) {
+        'input': function (element) {
             if (!element._input.value) {
                 if (state(element).get('button-clicked-prevent-dropdown-hide')) {
                     state(element).set('button-clicked-prevent-dropdown-hide', false);
@@ -528,21 +544,21 @@ const SelectEl = skate('aui-select', {
             }
 
             handled = handled || e.defaultPrevented;
-            setTimeout(function emulateCrossBrowserInputEvent () {
+            setTimeout(function emulateCrossBrowserInputEvent() {
                 if (element._input.value !== currentValue && !handled) {
-                    element.dispatchEvent(new CustomEvent('input', {bubbles: true}));
+                    element.dispatchEvent(new CustomEvent('input', { bubbles: true }));
                 }
             }, 0);
-        }
+        },
     },
 
     prototype: {
-        get value () {
+        get value() {
             var selected = this._select.options[this._select.selectedIndex];
             return selected ? selected.value : '';
         },
 
-        set value (value) {
+        set value(value) {
             if (value === '') {
                 clearValue(this);
             } else if (value) {
@@ -551,7 +567,7 @@ const SelectEl = skate('aui-select', {
 
                 // Create a new value if allowed and the value doesn't exist.
                 if (!model && this.hasAttribute('can-create-values')) {
-                    model = new SuggestionModel({value: value, label: value});
+                    model = new SuggestionModel({ value: value, label: value });
                 }
 
                 setValueAndDisplayFromModel(this, model);
@@ -559,7 +575,7 @@ const SelectEl = skate('aui-select', {
             return this;
         },
 
-        get displayValue () {
+        get displayValue() {
             return this._input.value;
         },
 
@@ -573,8 +589,8 @@ const SelectEl = skate('aui-select', {
             this._input.focus();
             focusInHandler(this);
             return this;
-        }
-    }
+        },
+    },
 });
 
 amdify('aui/select', SelectEl);

package/src/js/aui/select2.js

@@ -26,15 +26,23 @@ $.fn.auiSelect2 = function (first) {
         var auiOpts = $.extend({}, first);
         var auiAvatarClass = auiOpts.hasAvatar ? ' ' + auiHasAvatar : '';
         //add our classes in addition to those the caller specified
-        auiOpts.containerCssClass  = auiContainer + auiAvatarClass + (auiOpts.containerCssClass ? ' ' + auiOpts.containerCssClass : '');
-        auiOpts.dropdownCssClass  = auiDropdown + auiAvatarClass + (auiOpts.dropdownCssClass  ? ' ' + auiOpts.dropdownCssClass : '');
+        auiOpts.containerCssClass =
+            auiContainer +
+            auiAvatarClass +
+            (auiOpts.containerCssClass ? ' ' + auiOpts.containerCssClass : '');
+        auiOpts.dropdownCssClass =
+            auiDropdown +
+            auiAvatarClass +
+            (auiOpts.dropdownCssClass ? ' ' + auiOpts.dropdownCssClass : '');
         updatedArgs = Array.prototype.slice.call(arguments, 1);
         updatedArgs.unshift(auiOpts);
     } else if (!arguments.length) {
-        updatedArgs = [{
-            containerCssClass: auiContainer,
-            dropdownCssClass: auiDropdown
-        }];
+        updatedArgs = [
+            {
+                containerCssClass: auiContainer,
+                dropdownCssClass: auiDropdown,
+            },
+        ];
     } else {
         updatedArgs = arguments;
     }