@atlassian/aui 9.9.6 → 9.9.7

package/src/js/aui/inline-dialog2.js

@@ -1,21 +1,21 @@
 import $ from './jquery';
 import Alignment from './internal/alignment';
 import amdify from './internal/amdify';
-import attributes, {setBooleanAttribute} from './internal/attributes';
+import attributes, { setBooleanAttribute } from './internal/attributes';
 import enforce from './internal/enforcer';
 import globalize from './internal/globalize';
-import layer, {EVENT_PREFIX} from './layer';
+import layer, { EVENT_PREFIX } from './layer';
 import skate from './internal/skate';
 import state from './internal/state';
-import {doIfTrigger, forEachTrigger, getTrigger, setTrigger} from './trigger';
-import {ifGone} from './internal/elements';
+import { doIfTrigger, forEachTrigger, getTrigger, setTrigger } from './trigger';
+import { ifGone } from './internal/elements';
 import getFocusManager from './focus-manager';
 
 const DEFAULT_HOVEROUT_DELAY = 1000;
 
 function changeTrigger(element, newTrigger) {
     if (isPopupMenu(element)) {
-        doIfTrigger(element, function(oldTrigger) {
+        doIfTrigger(element, function (oldTrigger) {
             oldTrigger.setAttribute('aria-expanded', 'false');
             newTrigger.setAttribute('aria-expanded', element.open);
         });
@@ -24,28 +24,29 @@ function changeTrigger(element, newTrigger) {
     setTrigger(element, newTrigger);
 }
 
-function enableAlignment (element, trigger) {
+function enableAlignment(element, trigger) {
     if (element._auiAlignment) {
         element._auiAlignment.changeTarget(trigger);
-        element._auiAlignment.enable()
+        element._auiAlignment.enable();
     } else {
         let alignmentOptions = {
-            overflowContainer: element.getAttribute('contained-by') === 'viewport' ? 'viewport' : 'window',
+            overflowContainer:
+                element.getAttribute('contained-by') === 'viewport' ? 'viewport' : 'window',
             positionFixed: false,
-            eventsEnabled: true
+            eventsEnabled: true,
         };
 
         element._auiAlignment = new Alignment(element, trigger, alignmentOptions);
     }
 }
 
-function disableAlignment (element) {
+function disableAlignment(element) {
     if (element._auiAlignment) {
         element._auiAlignment.disable();
     }
 }
 
-function destroyAlignment (element) {
+function destroyAlignment(element) {
     if (element._auiAlignment) {
         element._auiAlignment.destroy();
         delete element._auiAlignment;
@@ -70,7 +71,7 @@ function showOnEnter(element, e) {
     clearTimeout(element._closingTimeout);
 }
 
-function closeAfter (delay = 0) {
+function closeAfter(delay = 0) {
     return function closing(element) {
         if (!element.open || layer(element).isPersistent()) {
             return;
@@ -83,7 +84,7 @@ function closeAfter (delay = 0) {
             }
             element._closingTimeout = null;
         }, delay);
-    }
+    };
 }
 
 const messageHandler = {
@@ -105,10 +106,10 @@ const messageHandler = {
     blur: closeAfter(0),
 };
 
-function handleMessage (element, message) {
+function handleMessage(element, message) {
     var messageTypeMap = {
         toggle: ['click'],
-        hover: ['mouseenter', 'mouseleave', 'focus', 'blur']
+        hover: ['mouseenter', 'mouseleave', 'focus', 'blur'],
     };
 
     var messageList = messageTypeMap[element.respondsTo];
@@ -121,7 +122,7 @@ function onMouseEnter(e) {
     var element = e.currentTarget;
     state(element).set('mouse-inside', true);
     element.message({
-        type: 'mouseenter'
+        type: 'mouseenter',
     });
 }
 
@@ -129,7 +130,7 @@ function onMouseLeave(e) {
     var element = e.currentTarget;
     state(element).set('mouse-inside', false);
     element.message({
-        type: 'mouseleave'
+        type: 'mouseleave',
     });
 }
 
@@ -144,7 +145,7 @@ function rebindMouseEvents(el) {
     state(el).set('mouse-inside', undefined);
     el.removeEventListener('mouseenter', onMouseEnter);
     el.removeEventListener('mouseleave', onMouseLeave);
-    el.removeEventListener('blur', onBlur)
+    el.removeEventListener('blur', onBlur);
 
     if (el.respondsTo === 'hover') {
         state(el).set('mouse-inside', false);
@@ -155,13 +156,13 @@ function rebindMouseEvents(el) {
 }
 
 function namespaceEvent(eventName, elId) {
-    return `${eventName}.nested-layer-${elId}`
+    return `${eventName}.nested-layer-${elId}`;
 }
 
 function setupNestedLayerHandlers(el) {
     let $el = $(el);
     const elId = el.id;
-    const noNestedTriggers = e => {
+    const noNestedTriggers = (e) => {
         return $el.find(getTrigger(e.target)).length < 1;
     };
     // Temporary timeout variable to resolve AUI-5025 issue
@@ -169,13 +170,13 @@ function setupNestedLayerHandlers(el) {
     const selectCloseTimeout = 150;
 
     $(document)
-        .on(namespaceEvent('aui-layer-show', elId), e => {
+        .on(namespaceEvent('aui-layer-show', elId), (e) => {
             if (noNestedTriggers(e)) {
                 return;
             }
             $el.attr('persistent', '');
         })
-        .on(namespaceEvent('aui-layer-hide', elId), e => {
+        .on(namespaceEvent('aui-layer-hide', elId), (e) => {
             if (noNestedTriggers(e)) {
                 return;
             }
@@ -244,7 +245,7 @@ function maybeInitialise(element) {
     layer(element);
     $(element).on({
         // fired only after the layer is shown
-        [`${EVENT_PREFIX}show`]: function(e) {
+        [`${EVENT_PREFIX}show`]: function (e) {
             const el = this;
             // This handler can be fired by nested layer/component.
             // We need to be sure that the event was triggered by the inline dialog;
@@ -268,7 +269,7 @@ function maybeInitialise(element) {
             });
         },
         // fired only after the layer is hidden
-        [`${EVENT_PREFIX}hide`]: function(e) {
+        [`${EVENT_PREFIX}hide`]: function (e) {
             const el = this;
             // This handler can be fired by nested layer/component.
             // We need to be sure that the event was triggered by the inline dialog;
@@ -296,7 +297,7 @@ function maybeInitialise(element) {
                 }
             });
             setTrigger(el, null);
-        }
+        },
     });
 
     element.__initialised = true;
@@ -306,7 +307,7 @@ const RESPONDS_TO_ATTRIBUTE_ENUM = {
     attribute: 'responds-to',
     values: ['toggle', 'hover'],
     missingDefault: 'toggle',
-    invalidDefault: 'toggle'
+    invalidDefault: 'toggle',
 };
 
 const InlineDialogEl = skate('aui-inline-dialog', {
@@ -330,7 +331,7 @@ const InlineDialogEl = skate('aui-inline-dialog', {
             // a flag to help avoid things getting called a second time via the attribute mutation handler
             this.__propUpdate = true;
             if (value) {
-                maybeShow(this)
+                maybeShow(this);
             } else {
                 maybeHide(this);
             }
@@ -367,10 +368,10 @@ const InlineDialogEl = skate('aui-inline-dialog', {
         message: function (msg) {
             handleMessage(this, msg);
             return this;
-        }
+        },
     },
     attributes: {
-        open: function (element, change) {
+        'open': function (element, change) {
             maybeInitialise(element);
 
             if (element.__propUpdate) {
@@ -392,12 +393,18 @@ const InlineDialogEl = skate('aui-inline-dialog', {
             }
         },
         'responds-to': function (element, change) {
-            const oldComputedValue = attributes.computeEnumValue(RESPONDS_TO_ATTRIBUTE_ENUM, change.oldValue);
-            const newComputedValue = attributes.computeEnumValue(RESPONDS_TO_ATTRIBUTE_ENUM, change.newValue);
+            const oldComputedValue = attributes.computeEnumValue(
+                RESPONDS_TO_ATTRIBUTE_ENUM,
+                change.oldValue
+            );
+            const newComputedValue = attributes.computeEnumValue(
+                RESPONDS_TO_ATTRIBUTE_ENUM,
+                change.newValue
+            );
             if (oldComputedValue !== newComputedValue) {
                 rebindMouseEvents(element);
             }
-        }
+        },
     },
 
     created: maybeInitialise,
@@ -434,7 +441,7 @@ const InlineDialogEl = skate('aui-inline-dialog', {
         $('<div class="aui-inline-dialog-contents"></div>')
             .append(element.childNodes)
             .appendTo(element);
-    }
+    },
 });
 
 amdify('aui/inline-dialog2', InlineDialogEl);

package/src/js/aui/internal/add-id.js

@@ -10,7 +10,7 @@ import uniqueId from '../unique-id';
  *
  * @returns {undefined}
  */
-function addId (el, prefix = '') {
+function addId(el, prefix = '') {
     var element = $(el);
     var addprefix = prefix || false;
 

package/src/js/aui/internal/alignment.js

@@ -43,10 +43,10 @@ function getPlacement(element) {
 }
 
 function getAlignment(element) {
-    let [side, snap] = (getAlignmentAttribute(element)).split(' ');
+    let [side, snap] = getAlignmentAttribute(element).split(' ');
     return {
         side,
-        snap
+        snap,
     };
 }
 
@@ -63,7 +63,7 @@ function addAlignmentClasses(element, side, snap) {
     }
 }
 
-function getContainer (element) {
+function getContainer(element) {
     let container = getAttribute(element, ATTR_CONTAINER) || window;
 
     if (typeof container === 'string') {
@@ -73,7 +73,7 @@ function getContainer (element) {
     return container;
 }
 
-function calculateBestAlignmentSnap (target) {
+function calculateBestAlignmentSnap(target) {
     let container = getContainer(target);
     let snap = 'left';
 
@@ -85,7 +85,10 @@ function calculateBestAlignmentSnap (target) {
         let containerBounds = container.getBoundingClientRect();
         let targetBounds = target.getBoundingClientRect();
 
-        if ((targetBounds.left - containerBounds.left) > (containerBounds.right - containerBounds.left) / 2) {
+        if (
+            targetBounds.left - containerBounds.left >
+            (containerBounds.right - containerBounds.left) / 2
+        ) {
             snap = 'right';
         }
     }
@@ -93,13 +96,12 @@ function calculateBestAlignmentSnap (target) {
     return snap;
 }
 
-function calculatePlacement (element, target) {
+function calculatePlacement(element, target) {
     const alignment = getAlignment(element);
 
     let placement;
 
     if (!alignment.snap || alignment.snap === 'auto') {
-
         alignment.snap = calculateBestAlignmentSnap(target);
 
         if (alignment.side === 'submenu') {
@@ -158,13 +160,15 @@ const allowedPlacement = {
  *   scroll and resize. Equivalent of calling .enable() after init but saves one update cycle.
  */
 function Alignment(element, target, options = {}) {
-    const alignment = getAlignment(element)
+    const alignment = getAlignment(element);
     const placement = calculatePlacement(element, target);
     const allowedAutoPlacements = allowedPlacement[placement.split('-')[0]];
 
     const frame = target.ownerDocument.defaultView.frameElement;
 
-    this._eventListenersEnabled = options.hasOwnProperty('eventsEnabled') ? options.eventsEnabled : false;
+    this._eventListenersEnabled = options.hasOwnProperty('eventsEnabled')
+        ? options.eventsEnabled
+        : false;
     this._triggerOnEvents = false;
 
     const modifiers = [
@@ -173,8 +177,12 @@ function Alignment(element, target, options = {}) {
             enabled: options.hasOwnProperty('flip') ? options.flip : true,
             options: {
                 allowedAutoPlacements,
-                boundary: frame || (options.hasOwnProperty('flipContainer') ? options.flipContainer : 'clippingParents'), // clippingParents by default
-            }
+                boundary:
+                    frame ||
+                    (options.hasOwnProperty('flipContainer')
+                        ? options.flipContainer
+                        : 'clippingParents'), // clippingParents by default
+            },
         },
         {
             name: 'preventOverflow',
@@ -182,8 +190,12 @@ function Alignment(element, target, options = {}) {
             options: {
                 padding: 0, // as of Popper 2.0 it's 0 by default, but explicitly specify in case of defaults change.
                 escapeWithReference: false,
-                rootBoundary: frame || (options.hasOwnProperty('overflowContainer') ? options.overflowContainer : 'document'), //viewport by default
-            }
+                rootBoundary:
+                    frame ||
+                    (options.hasOwnProperty('overflowContainer')
+                        ? options.overflowContainer
+                        : 'document'), //viewport by default
+            },
         },
         {
             name: 'offset',
@@ -194,44 +206,45 @@ function Alignment(element, target, options = {}) {
         },
         {
             name: 'hide',
-            enabled: false
+            enabled: false,
         },
         {
             name: 'computeStyles',
             options: {
                 gpuAcceleration: document.body.classList.contains(GPU_ACCELERATION_FLAG),
                 // adaptive: false, // true by default, breaks CSS transitions (do we need it?)
-            }
+            },
         },
         {
             name: 'eventListeners',
-            enabled: this._eventListenersEnabled
+            enabled: this._eventListenersEnabled,
         },
-        { // left for backwards compatibility
+        {
+            // left for backwards compatibility
             name: 'x-placement',
             enabled: true,
             phase: 'write',
             requires: ['computeStyles'],
-            fn: ({state}) => {
+            fn: ({ state }) => {
                 if (state.elements.popper) {
                     // popper-specific attributes are NOT contracted, public API of AUI layered element
-                    state.elements.popper.setAttribute('x-placement', state.placement)
+                    state.elements.popper.setAttribute('x-placement', state.placement);
                 }
-            }
+            },
         },
         {
             name: 'onUpdate',
             enabled: options.hasOwnProperty('onUpdate'),
             phase: 'afterWrite',
-            effect: ({state, name}) => {
+            effect: ({ state, name }) => {
                 // enable it after initial cycle
                 state.modifiersData[`${name}#persistent`] = {
                     enabled: true,
-                    fn: options.onUpdate
+                    fn: options.onUpdate,
                 };
             },
 
-            fn: ({state, name}) => {
+            fn: ({ state, name }) => {
                 const o = state.modifiersData[`${name}#persistent`];
 
                 if (o.enabled) {
@@ -239,19 +252,19 @@ function Alignment(element, target, options = {}) {
                 }
 
                 return state;
-            }
+            },
         },
         {
             name: 'onEvents',
             enabled: options.hasOwnProperty('onEvents'),
             phase: 'afterWrite',
-            effect: ({state, name}) => {
+            effect: ({ state, name }) => {
                 // enable it after initial cycle
                 state.modifiersData[`${name}#persistent`] = {
-                    fn: options.onEvents
+                    fn: options.onEvents,
                 };
             },
-            fn: ({state, name}) => {
+            fn: ({ state, name }) => {
                 const o = state.modifiersData[`${name}#persistent`];
 
                 if (this._triggerOnEvents) {
@@ -263,33 +276,26 @@ function Alignment(element, target, options = {}) {
                     this._triggerOnEvents = false;
                 }
                 return state;
-            }
-        }
+            },
+        },
     ];
 
     // IE/Edge may throw a "Permission denied" error when strict-comparing two documents
     // eslint-disable-next-line eqeqeq
-    if (frame && (target.ownerDocument != element.ownerDocument)) {
+    if (frame && target.ownerDocument != element.ownerDocument) {
         modifiers.push({
             name: 'iframeOffset',
             enabled: true,
             fn(data) {
                 const rect = frame.getBoundingClientRect();
                 const style = window.getComputedStyle(frame);
-                const sum = (a, b) => a + b
-                const getTotalValue = values => values.map(parseFloat).filter(Boolean).reduce(sum, 0);
+                const sum = (a, b) => a + b;
+                const getTotalValue = (values) =>
+                    values.map(parseFloat).filter(Boolean).reduce(sum, 0);
 
-                const top = getTotalValue([
-                    rect.top,
-                    style.paddingTop,
-                    style.borderTop
-                ]);
+                const top = getTotalValue([rect.top, style.paddingTop, style.borderTop]);
 
-                const left = getTotalValue([
-                    rect.left,
-                    style.paddingLeft,
-                    style.borderLeft
-                ]);
+                const left = getTotalValue([rect.left, style.paddingLeft, style.borderLeft]);
 
                 data.offsets.reference.left += left;
                 data.offsets.reference.top += top;
@@ -297,16 +303,19 @@ function Alignment(element, target, options = {}) {
                 data.offsets.popper.left += left;
                 data.offsets.popper.top += top;
 
-                return data
-            }
+                return data;
+            },
         });
     }
 
     const popperConfig = {
         placement, //controlled by the flip modifier
-        strategy: options.hasOwnProperty('positionFixed') && !options.positionFixed ? 'absolute' : 'fixed',
+        strategy:
+            options.hasOwnProperty('positionFixed') && !options.positionFixed
+                ? 'absolute'
+                : 'fixed',
         modifiers,
-        onFirstUpdate: options.onCreate
+        onFirstUpdate: options.onCreate,
     };
 
     this.popper = createPopper(target, element, popperConfig);
@@ -315,7 +324,6 @@ function Alignment(element, target, options = {}) {
 }
 
 Alignment.prototype = {
-
     destroy() {
         this.popper.destroy();
         return this;
@@ -368,10 +376,10 @@ Alignment.prototype = {
      * @returns {Alignment}
      */
     disable() {
-        this._eventListenersEnabled  = false;
+        this._eventListenersEnabled = false;
         this._triggerOnEvents = true;
 
-        this.popper.setOptions({});  // setOptions will re-instanciate all modifiers.
+        this.popper.setOptions({}); // setOptions will re-instanciate all modifiers.
         return this;
     },
 };

package/src/js/aui/internal/amdify.js

@@ -1,4 +1,3 @@
-
 export default function (name, fn) {
     if (window.define) {
         var alias = window.define;

package/src/js/aui/internal/animation.js

@@ -1,4 +1,3 @@
-
 /**
  * Force a re-compute of the style of an element.
  *
@@ -23,11 +22,9 @@
  *
  * @param el The DOM or jQuery element for which style should be recomputed
  */
-function recomputeStyle (el) {
+function recomputeStyle(el) {
     el = el.jquery ? el[0] : el;
     window.getComputedStyle(el, null).getPropertyValue('left');
 }
 
-export {
-    recomputeStyle
-};
+export { recomputeStyle };

package/src/js/aui/internal/attributes.js

@@ -15,7 +15,7 @@ export function setBooleanAttribute(el, attr, newValue) {
 }
 
 export function computeEnumValue(enumOptions, value) {
-    const matchesEnumValue = enumValue => enumValue.toLowerCase() === value.toLowerCase();
+    const matchesEnumValue = (enumValue) => enumValue.toLowerCase() === value.toLowerCase();
 
     const isMissing = value === null;
     const isInvalid = !isMissing && !enumOptions.values.filter(matchesEnumValue).length;
@@ -39,7 +39,6 @@ export function computeEnumValue(enumOptions, value) {
     return enumOptions.values.length ? enumOptions.values.filter(matchesEnumValue)[0] : null;
 }
 
-
 export function setEnumAttribute(el, enumOptions, newValue) {
     el.setAttribute(enumOptions.attribute, newValue);
 }
@@ -57,5 +56,5 @@ export default {
     setBooleanAttribute,
 
     computeEnumValue,
-    setEnumAttribute
+    setEnumAttribute,
 };

package/src/js/aui/internal/browser.js

@@ -1,10 +1,9 @@
-
 var ua = navigator.userAgent.toLowerCase();
 var isIE = /msie/.test(ua);
 var isWinXP = /windows nt 5.1/.test(ua);
 var isWinVista = /windows nt 6.0/.test(ua);
 var isWin7 = /windows nt 6.1/.test(ua);
-var isMacOSX = (/mac os x/.test(ua));
+var isMacOSX = /mac os x/.test(ua);
 var doesSupportHtml5DateInput;
 var doesSupportFocusWithin;
 
@@ -14,15 +13,15 @@ var doesSupportFocusWithin;
  * From manual testing, all IE versions on Windows 7 appear to have the bug,
  * but no IE versions on Windows 8 have it.
  */
-export function needsLayeringShim () {
+export function needsLayeringShim() {
     return isIE && (isWinXP || isWinVista || isWin7);
 }
 
-export function supportsVoiceOver () {
+export function supportsVoiceOver() {
     return isMacOSX;
 }
 
-export function supportsDateField () {
+export function supportsDateField() {
     if (typeof doesSupportHtml5DateInput === 'undefined') {
         var el = document.createElement('input');
         el.setAttribute('type', 'date');
@@ -31,7 +30,7 @@ export function supportsDateField () {
     return doesSupportHtml5DateInput;
 }
 
-export function supportsFocusWithin () {
+export function supportsFocusWithin() {
     if (typeof doesSupportFocusWithin === 'undefined') {
         try {
             document.querySelector(':focus-within');

package/src/js/aui/internal/constants.js

@@ -1,5 +1,3 @@
 const INPUT_SUFFIX = '-input';
 
-export {
-    INPUT_SUFFIX
-}
+export { INPUT_SUFFIX };

package/src/js/aui/internal/deduplicateIDs.js

@@ -1,7 +1,9 @@
 import $ from '../jquery';
 
 function replaceAttributeForID($clone, id, value, attribute) {
-    $clone.find(`[${attribute}]`).attr(attribute, (i, oldValue) => id === oldValue ? value : undefined);
+    $clone
+        .find(`[${attribute}]`)
+        .attr(attribute, (i, oldValue) => (id === oldValue ? value : undefined));
 }
 
 function setCorrespondingTriggersID($clone, id, uuid) {
@@ -12,10 +14,9 @@ function setCorrespondingTriggersID($clone, id, uuid) {
 export default function deduplicateIDs($clone, uidFunction) {
     let wrapper = $('<div></div>');
     wrapper.append($clone);
-    wrapper.find('[id]')
-        .each((i, el) => {
-            const uuid = uidFunction(`${el.id}-`);
-            setCorrespondingTriggersID(wrapper, el.id, uuid);
-            el.id = uuid;
-        });
+    wrapper.find('[id]').each((i, el) => {
+        const uuid = uidFunction(`${el.id}-`);
+        setCorrespondingTriggersID(wrapper, el.id, uuid);
+        el.id = uuid;
+    });
 }