@atlassian/aui 9.10.5 → 9.10.6

package/src/js/aui/avatar-group.js

@@ -3,18 +3,26 @@ import skate from './internal/skate';
 const DEFAULT_SIZE = 'medium';
 const VISIBLE_AVATAR_COUNT = 4;
 const OVERLAP_FACTOR = 0.25;
-const SIZES = {xsmall: 16, small: 24, medium: 32, large: 48, xlarge: 64, xxlarge: 96, xxxlarge: 128};
+const SIZES = {
+    xsmall: 16,
+    small: 24,
+    medium: 32,
+    large: 48,
+    xlarge: 64,
+    xxlarge: 96,
+    xxxlarge: 128,
+};
 
 const setAvatarGroupSize = (element, newValue, oldValue) => {
     if (oldValue) {
         element.classList.remove(`aui-avatar-group-${oldValue}`);
     }
     element.classList.add(`aui-avatar-group-${newValue}`);
-}
+};
 
 const getAvatarGroupSize = (value) => {
     return Object.keys(SIZES).includes(value) ? value : DEFAULT_SIZE;
-}
+};
 
 const updateAvatarGroup = (element, size) => {
     const avatars = element.querySelectorAll('aui-avatar');
@@ -27,12 +35,14 @@ const updateAvatarGroup = (element, size) => {
         oldDropdown.remove();
     }
 
-    if (hiddenAvatars.length === 0) { return };
+    if (hiddenAvatars.length === 0) {
+        return;
+    }
 
     const dropdown = createDropdown(size, hiddenAvatars);
 
     element.appendChild(dropdown);
-}
+};
 
 const createDropdown = (size, hiddenAvatars) => {
     const dropdown = document.createElement('div');
@@ -41,13 +51,13 @@ const createDropdown = (size, hiddenAvatars) => {
 
     hiddenAvatars.forEach((hiddenAvatar) => {
         menu.append(hiddenAvatar);
-    })
+    });
     dropdown.classList.add('aui-avatar-group-dropdown');
     dropdown.style.left = getLeftPosition(size, VISIBLE_AVATAR_COUNT + 0.2);
     dropdown.appendChild(button);
     dropdown.appendChild(menu);
     return dropdown;
-}
+};
 
 const createAvatarGroupDropdownButton = (content) => {
     const button = document.createElement('button');
@@ -56,18 +66,20 @@ const createAvatarGroupDropdownButton = (content) => {
     button.setAttribute('aria-expanded', false);
     button.setAttribute('aria-haspopup', 'dialog');
     return button;
-}
+};
 
 const createAvatarGroupDropdownMenu = () => {
     const dropdown = document.createElement('div');
     dropdown.classList.add('aui-avatar-group-dropdown-menu');
     return dropdown;
-}
+};
 
 const updateAvatarGroupItems = (avatars, size) => {
     avatars.forEach((avatar, index) => {
         const isHidden = index >= VISIBLE_AVATAR_COUNT;
-        avatar.classList.add(!isHidden ? 'aui-avatar-group-item' : 'aui-avatar-group-dropdown-item');
+        avatar.classList.add(
+            !isHidden ? 'aui-avatar-group-item' : 'aui-avatar-group-dropdown-item'
+        );
 
         if (!isHidden) {
             avatar.setAttribute('size', size);
@@ -90,23 +102,33 @@ document.addEventListener('click', (e) => {
     const isDropdownButton = e.target.matches('.aui-avatar-group-dropdown-button');
     const closestDropdown = e.target.closest('.aui-avatar-group-dropdown');
 
-    if (!isDropdownButton && closestDropdown !== null) return;
+    if (!isDropdownButton && closestDropdown !== null) {
+        return;
+    }
 
     if (isDropdownButton) {
-        closestDropdown.classList.contains('aui-avatar-group-dropdown-show') ? closeDropdown(closestDropdown) : openDropdown(closestDropdown);
+        closestDropdown.classList.contains('aui-avatar-group-dropdown-show')
+            ? closeDropdown(closestDropdown)
+            : openDropdown(closestDropdown);
     }
 
-    document.querySelectorAll('.aui-avatar-group-dropdown-show').forEach(dropdown => {
-        if (dropdown === closestDropdown) return;
+    document.querySelectorAll('.aui-avatar-group-dropdown-show').forEach((dropdown) => {
+        if (dropdown === closestDropdown) {
+            return;
+        }
 
-        closeDropdown(dropdown)
-    })
+        closeDropdown(dropdown);
+    });
 });
 
 document.addEventListener('keydown', (e) => {
-    if (e.key !== 'Escape') return;
+    if (e.key !== 'Escape') {
+        return;
+    }
     const dropdown = document.querySelector('.aui-avatar-group-dropdown-show');
-    if (!dropdown) return;
+    if (!dropdown) {
+        return;
+    }
 
     closeDropdown(dropdown);
 });
@@ -115,12 +137,12 @@ const closeDropdown = (dropdown) => {
     const button = dropdown.querySelector('.aui-avatar-group-dropdown-button');
     dropdown.classList.remove('aui-avatar-group-dropdown-show');
     button.setAttribute('aria-expanded', 'false');
-}
+};
 const openDropdown = (dropdown) => {
     const button = dropdown.querySelector('.aui-avatar-group-dropdown-button');
     dropdown.classList.add('aui-avatar-group-dropdown-show');
     button.setAttribute('aria-expanded', 'true');
-}
+};
 
 const AvatarGroupEl = skate('aui-avatar-group', {
     attributes: {
@@ -133,7 +155,7 @@ const AvatarGroupEl = skate('aui-avatar-group', {
                 skate.init(element);
 
                 updateAvatarGroup(element, size);
-            }
+            },
         },
     },
     created(element) {
@@ -142,15 +164,23 @@ const AvatarGroupEl = skate('aui-avatar-group', {
 });
 
 const wasNodeRemoved = (mutation, target) => {
-    return  mutation.removedNodes.length > 0 && target.classList.contains('aui-avatar-group') && mutation.removedNodes[0].classList.contains('aui-avatar-group-item');
-}
+    return (
+        mutation.removedNodes.length > 0 &&
+        target.classList.contains('aui-avatar-group') &&
+        mutation.removedNodes[0].classList.contains('aui-avatar-group-item')
+    );
+};
 
 const wasNodeAdded = (mutation, target) => {
-    return mutation.addedNodes.length > 0 && target.classList.contains('aui-avatar-group') && mutation.addedNodes[0].classList.contains('aui-avatar');
-}
+    return (
+        mutation.addedNodes.length > 0 &&
+        target.classList.contains('aui-avatar-group') &&
+        mutation.addedNodes[0].classList.contains('aui-avatar')
+    );
+};
 
-const mutationObserver = new MutationObserver(function(mutation) {
-    mutation.forEach(function(mutation) {
+const mutationObserver = new MutationObserver(function (mutation) {
+    mutation.forEach(function (mutation) {
         const target = mutation.target;
 
         if (wasNodeRemoved(mutation, target)) {
@@ -171,7 +201,7 @@ mutationObserver.observe(document.documentElement, {
     childList: true,
     subtree: true,
     attributeOldValue: false,
-    characterDataOldValue: false
+    characterDataOldValue: false,
 });
 
 export { AvatarGroupEl };

package/src/js/aui/avatar.js

@@ -5,7 +5,7 @@ import projectImage from '../../../../../packages/docs/src/docs/images/avatar-pr
 
 const DEFAULT_AVATAR_IMAGES = new Map([
     ['project', projectImage],
-    ['user', personImage]
+    ['user', personImage],
 ]);
 
 const getElementWrapper = (element, elementFind) => element.querySelector(elementFind);
@@ -16,21 +16,23 @@ const replaceClass = (element, newValue, oldValue) => {
 
     elementWrapper.classList.remove(`aui-avatar-${oldValue}`);
     elementWrapper.classList.add(`aui-avatar-${newValue}`);
-}
+};
 
-const getAvatarType = (element) => element.getAttribute('type') === 'project' ? 'project' : 'user';
+const getAvatarType = (element) =>
+    element.getAttribute('type') === 'project' ? 'project' : 'user';
 
 const setDefaultAvatarImage = (element) => {
-    if (element.hasAttribute('src')){
+    if (element.hasAttribute('src')) {
         setImageSrc(element, element.getAttribute('src'));
     } else {
         const avatarType = getAvatarType(element);
         const avatarSvg = DEFAULT_AVATAR_IMAGES.get(avatarType);
         setImageSrc(element, avatarSvg);
     }
-}
+};
 
-const setImageAttr = (element, name, value) => getElementWrapper(element, 'img').setAttribute(name, value);
+const setImageAttr = (element, name, value) =>
+    getElementWrapper(element, 'img').setAttribute(name, value);
 const setImageSrc = (element, src) => setImageAttr(element, 'src', src);
 const setImageAlt = (element, alt) => setImageAttr(element, 'alt', alt);
 const setImageTitle = (element, title) => setImageAttr(element, 'title', title);
@@ -46,10 +48,10 @@ const AvatarEl = skate('aui-avatar', {
    `),
 
     attributes: {
-        size(element, { newValue , oldValue}) {
+        size(element, { newValue, oldValue }) {
             replaceClass(element, newValue, oldValue);
         },
-        type(element, { newValue, oldValue}) {
+        type(element, { newValue, oldValue }) {
             replaceClass(element, newValue, oldValue);
             setDefaultAvatarImage(element);
         },
@@ -58,23 +60,23 @@ const AvatarEl = skate('aui-avatar', {
         },
         alt: {
             value: '',
-            fallback(element, {newValue: value}) {
+            fallback(element, { newValue: value }) {
                 setImageAlt(element, value);
-            }
+            },
         },
-        title(element, {newValue: value}) {
+        title(element, { newValue: value }) {
             setImageTitle(element, value);
         },
     },
 
-    created: function(element) {
+    created: function (element) {
         element.className = 'aui-avatar';
         setDefaultAvatarImage(element);
 
         if (containsBadge(element)) {
-            element.setAttribute('role', 'img')
+            element.setAttribute('role', 'img');
         }
-    }
+    },
 });
 
 export { AvatarEl };

package/src/js/aui/banner.js

@@ -26,10 +26,10 @@ function createBannerElement({ body = '', type = 'error' }) {
     banner.className = `aui-banner aui-banner-${type}`;
     banner.setAttribute('role', 'alert');
     banner.innerHTML = body;
-    
+
     const screenReaderInfo = document.createElement('div');
     screenReaderInfo.innerText = `${type}`;
-    screenReaderInfo.classList.add('assistive')
+    screenReaderInfo.classList.add('assistive');
     banner.prepend(screenReaderInfo);
 
     return banner;
@@ -41,7 +41,8 @@ function removeHiddenBanners(bannerContainer) {
         removeInVersion: '10.0.0',
         sinceVersion: '9.8.0',
         deprecationType: 'ATTRIBUTE',
-        extraInfo: 'The hidden attribute on the banner is no longer effective. Future banner function calls won\'t remove banners with this attribute.'
+        extraInfo:
+            "The hidden attribute on the banner is no longer effective. Future banner function calls won't remove banners with this attribute.",
     });
 
     hiddenBanners.forEach(function (banner) {
@@ -57,4 +58,4 @@ function renderBannerElement(bannerElement, bannerContainer) {
 
 amdify('aui/banner', banner);
 globalize('banner', banner);
-export default banner;
+export default banner;

package/src/js/aui/blanket.js

@@ -21,14 +21,15 @@ var overflowEl;
  * Dims the screen using a blanket div
  * @param useShim deprecated, it is calculated by dim() now
  */
-function dim (useShim, zIndex) {
-
+function dim(useShim, zIndex) {
     //if we're blanketing the page it means we want to hide the whatever is under the blanket from the screen readers as well
-    function hasAriaHidden(element) { // eslint-disable-line no-unused-vars
+    // eslint-disable-next-line no-unused-vars
+    function hasAriaHidden(element) {
         return element.hasAttribute('aria-hidden');
     }
 
-    function isAuiLayer(element) { // eslint-disable-line no-unused-vars
+    // eslint-disable-next-line no-unused-vars
+    function isAuiLayer(element) {
         return element.classList && element.classList.contains('aui-layer');
     }
 
@@ -40,7 +41,7 @@ function dim (useShim, zIndex) {
         useShimDeprecationLogger();
     }
 
-    const isBlanketShowing = (!!dim.$dim) && !dim.$dim[0].hasAttribute('hidden');
+    const isBlanketShowing = !!dim.$dim && !dim.$dim[0].hasAttribute('hidden');
 
     if (!!dim.$dim) {
         dim.$dim.remove();
@@ -58,7 +59,7 @@ function dim (useShim, zIndex) {
         dim.cachedOverflow = {
             overflow: overflowEl.style.overflow,
             overflowX: overflowEl.style.overflowX,
-            overflowY: overflowEl.style.overflowY
+            overflowY: overflowEl.style.overflowY,
         };
 
         overflowEl.style.overflowX = 'hidden';
@@ -69,7 +70,7 @@ function dim (useShim, zIndex) {
     dim.$dim.removeAttr('hidden');
 
     if (zIndex) {
-        dim.$dim.css({zIndex: zIndex});
+        dim.$dim.css({ zIndex: zIndex });
     }
 
     return dim.$dim;
@@ -79,8 +80,7 @@ function dim (useShim, zIndex) {
  * Removes semitransparent DIV
  * @see dim
  */
-function undim () {
-
+function undim() {
     if (dim.$dim) {
         dim.$dim[0].setAttribute('hidden', '');
 
@@ -93,13 +93,10 @@ function undim () {
 }
 
 const useShimDeprecationLogger = getMessageLogger('useShim', {
-    extraInfo: 'useShim has no alternative as it is now calculated by dim().'
+    extraInfo: 'useShim has no alternative as it is now calculated by dim().',
 });
 
 globalize('dim', dim);
 globalize('undim', undim);
 
-export {
-    dim,
-    undim
-};
+export { dim, undim };

package/src/js/aui/button.js

@@ -1,13 +1,13 @@
 import * as logger from './internal/log';
 import amdify from './internal/amdify';
 import skate from './internal/skate';
-import SpinnerEl, {SIZE} from './spinner';
+import SpinnerEl, { SIZE } from './spinner';
 
-function isBusy (button) {
+function isBusy(button) {
     return button.hasAttribute('aria-busy') && button.getAttribute('aria-busy') === 'true';
 }
 
-function isInputNode (button) {
+function isInputNode(button) {
     return button.nodeName === 'INPUT';
 }
 
@@ -66,8 +66,8 @@ skate('aui-button', {
             }
 
             return isBusy(this);
-        }
-    }
+        },
+    },
 });
 
 amdify('aui/button');