@atlaskit/editor-core 178.1.0 → 178.1.2

package/dist/esm/ui/ElementBrowser/InsertMenu.js

@@ -3,15 +3,13 @@ import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProper
 import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 var _excluded = ["children"];
-
 var _templateObject, _templateObject2, _templateObject3, _templateObject4;
-
 /** @jsx jsx */
 import { useState, useCallback } from 'react';
 import { css, jsx } from '@emotion/react';
-import { Section, ButtonItem } from '@atlaskit/menu'; // AFP-2532 TODO: Fix automatic suppressions below
+import { Section, ButtonItem } from '@atlaskit/menu';
+// AFP-2532 TODO: Fix automatic suppressions below
 // eslint-disable-next-line @atlassian/tangerine/import/entry-points
-
 import { borderRadius, gridSize } from '@atlaskit/theme';
 import { themed } from '@atlaskit/theme/components';
 import { DN50, N0, N30A, N60A } from '@atlaskit/theme/colors';
@@ -23,19 +21,16 @@ import { getFeaturedQuickInsertItems, searchQuickInsertItems } from '../../plugi
 import { insertItem } from '../../plugins/quick-insert/commands';
 import ElementBrowser from './components/ElementBrowserLoader';
 import { ELEMENT_ITEM_HEIGHT } from './constants';
-
 var InsertMenu = function InsertMenu(_ref) {
   var editorView = _ref.editorView,
-      dropdownItems = _ref.dropdownItems,
-      showElementBrowserLink = _ref.showElementBrowserLink,
-      onInsert = _ref.onInsert,
-      toggleVisiblity = _ref.toggleVisiblity;
-
+    dropdownItems = _ref.dropdownItems,
+    showElementBrowserLink = _ref.showElementBrowserLink,
+    onInsert = _ref.onInsert,
+    toggleVisiblity = _ref.toggleVisiblity;
   var _useState = useState(0),
-      _useState2 = _slicedToArray(_useState, 2),
-      itemCount = _useState2[0],
-      setItemCount = _useState2[1];
-
+    _useState2 = _slicedToArray(_useState, 2),
+    itemCount = _useState2[0],
+    setItemCount = _useState2[1];
   var transform = useCallback(function (item) {
     return {
       title: item.content,
@@ -60,23 +55,19 @@ var InsertMenu = function InsertMenu(_ref) {
   var viewMoreItem = showElementBrowserLink && quickInsertDropdownItems.pop();
   var onInsertItem = useCallback(function (item) {
     toggleVisiblity();
-
     if (!editorView.hasFocus()) {
       editorView.focus();
     }
-
     insertItem(item)(editorView.state, editorView.dispatch);
   }, [editorView, toggleVisiblity]);
   var getItems = useCallback(function (quickInsertState) {
     return function (query, category) {
       var result;
-
       if (query) {
         result = searchQuickInsertItems(quickInsertState, {})(query, category);
       } else {
         result = quickInsertDropdownItems.concat(getFeaturedQuickInsertItems(quickInsertState, {})());
       }
-
       setItemCount(result.length);
       return result;
     };
@@ -92,7 +83,8 @@ var InsertMenu = function InsertMenu(_ref) {
       emptyStateHandler: quickInsertState === null || quickInsertState === void 0 ? void 0 : quickInsertState.emptyStateHandler,
       onInsertItem: onInsertItem,
       showSearch: true,
-      showCategories: false // On page resize we want the InlineElementBrowser to show updated tools/overflow items
+      showCategories: false
+      // On page resize we want the InlineElementBrowser to show updated tools/overflow items
       ,
       key: quickInsertDropdownItems.length
     }));
@@ -110,7 +102,6 @@ var InsertMenu = function InsertMenu(_ref) {
     item: viewMoreItem
   }));
 };
-
 var ViewMore = function ViewMore(_ref3) {
   var item = _ref3.item;
   return jsx(Section, {
@@ -121,12 +112,12 @@ var ViewMore = function ViewMore(_ref3) {
       css: itemBefore
     }, item.icon()),
     "aria-describedby": item.title,
-    "data-testid": "view-more-elements-item" // @ts-ignore Overriding Menu styles is not supported
+    "data-testid": "view-more-elements-item"
+    // @ts-ignore Overriding Menu styles is not supported
     ,
     css: css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n          padding: 0px 12px;\n        "])))
   }, item.title));
 };
-
 var getSvgIconForItem = function getSvgIconForItem(_ref4) {
   var name = _ref4.name;
   var Icon = {
@@ -143,16 +134,13 @@ var getSvgIconForItem = function getSvgIconForItem(_ref4) {
     label: ""
   }) : undefined;
 };
-
 var getInsertMenuHeight = function getInsertMenuHeight(_ref5) {
   var itemCount = _ref5.itemCount;
   // Figure based on visuals to exclude the searchbar, padding/margin, and the ViewMore item.
   var EXTRA_SPACE_EXCLUDING_ELEMENTLIST = 112;
-
   if (itemCount > 0 && itemCount < 6) {
     return itemCount * ELEMENT_ITEM_HEIGHT + EXTRA_SPACE_EXCLUDING_ELEMENTLIST;
   }
-
   return 560; // For showing 6 Elements.
 };
 
@@ -164,18 +152,14 @@ var insertMenuWrapper = function insertMenuWrapper(theme, itemCount) {
     dark: "var(--ds-surface-overlay, ".concat(DN50, ")")
   })(theme), borderRadius(), "var(--ds-shadow-overlay, ".concat("0 0 0 1px ".concat(N30A, ",\n    0 2px 1px ").concat(N30A, ",\n    0 0 20px -6px ").concat(N60A), ")"));
 };
-
 var itemBefore = css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  width: 40px;\n  height: 40px;\n  box-sizing: border-box;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  margin-right: ", "px;\n"])), gridSize() / 2);
 var flexWrapperStyles = css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  display: flex;\n  flex: 1;\n  box-sizing: border-box;\n  overflow: hidden;\n"])));
-
 var FlexWrapper = function FlexWrapper(props) {
   var children = props.children,
-      divProps = _objectWithoutProperties(props, _excluded);
-
+    divProps = _objectWithoutProperties(props, _excluded);
   return jsx("div", _extends({
     css: flexWrapperStyles
   }, divProps), children);
 };
-
 var ElementBrowserWrapper = withOuterListeners(FlexWrapper);
 export default InsertMenu;

package/dist/esm/ui/ElementBrowser/ModalElementBrowser.js

@@ -1,8 +1,6 @@
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
-
 var _templateObject, _templateObject2, _templateObject3, _templateObject4;
-
 /** @jsx jsx */
 import React, { useState, useCallback } from 'react';
 import { css, jsx } from '@emotion/react';
@@ -24,15 +22,13 @@ var wrapper = css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral
   dark: "var(--ds-surface-overlay, ".concat(DN50, ")")
 })(), borderRadius());
 var modalFooter = css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  display: flex;\n  padding: ", "px;\n\n  position: relative;\n  align-items: center;\n  justify-content: space-between;\n"])), MODAL_WRAPPER_PADDING);
-
 var ModalElementBrowser = function ModalElementBrowser(props) {
   var _useState = useState(),
-      _useState2 = _slicedToArray(_useState, 2),
-      selectedItem = _useState2[0],
-      setSelectedItem = _useState2[1];
-
+    _useState2 = _slicedToArray(_useState, 2),
+    selectedItem = _useState2[0],
+    setSelectedItem = _useState2[1];
   var helpUrl = props.helpUrl,
-      intl = props.intl;
+    intl = props.intl;
   var onSelectItem = useCallback(function (item) {
     setSelectedItem(item);
   }, [setSelectedItem]);
@@ -46,8 +42,9 @@ var ModalElementBrowser = function ModalElementBrowser(props) {
       },
       beforeElement: helpUrl ? HelpLink(helpUrl, intl.formatMessage(messages.help)) : undefined
     });
-  }, [onInsertItem, selectedItem, helpUrl, intl]); // Since Modal uses stackIndex it's shouldCloseOnEscapePress prop doesn't work.
+  }, [onInsertItem, selectedItem, helpUrl, intl]);
 
+  // Since Modal uses stackIndex it's shouldCloseOnEscapePress prop doesn't work.
   var onKeyDown = useCallback(function (e) {
     if (e.key === 'Escape') {
       props.onClose();
@@ -78,26 +75,24 @@ var ModalElementBrowser = function ModalElementBrowser(props) {
     onClose: props.onClose,
     height: "664px",
     width: "x-large",
-    autoFocus: false // defaults to true and doesn't work along with stackIndex=1.
+    autoFocus: false
+    // defaults to true and doesn't work along with stackIndex=1.
     // packages/design-system/modal-dialog/src/components/Content.tsx Line 287
     ,
     shouldCloseOnEscapePress: false
   }, jsx(RenderBody, null), jsx(RenderFooter, null))));
 };
+ModalElementBrowser.displayName = 'ModalElementBrowser';
 
-ModalElementBrowser.displayName = 'ModalElementBrowser'; // Prevent ModalElementBrowser click propagation through to the editor.
-
+// Prevent ModalElementBrowser click propagation through to the editor.
 var onModalClick = function onModalClick(e) {
   return e.stopPropagation();
 };
-
 var Footer = function Footer(_ref) {
   var onInsert = _ref.onInsert,
-      beforeElement = _ref.beforeElement;
-
+    beforeElement = _ref.beforeElement;
   var _useModal = useModal(),
-      onClose = _useModal.onClose;
-
+    onClose = _useModal.onClose;
   return jsx("div", {
     css: modalFooter
   }, beforeElement ? beforeElement : jsx("span", null), jsx("div", {
@@ -116,7 +111,6 @@ var Footer = function Footer(_ref) {
     testId: "ModalElementBrowser__close-button"
   }, "Close"))));
 };
-
 var HelpLink = function HelpLink(url, helpText) {
   return jsx(Button, {
     iconBefore: jsx(QuestionCircleIcon, {
@@ -129,5 +123,4 @@ var HelpLink = function HelpLink(url, helpText) {
     testId: "ModalElementBrowser__help-button"
   }, helpText);
 };
-
 export default injectIntl(ModalElementBrowser);

package/dist/esm/ui/ElementBrowser/components/CategoryList.js

@@ -3,16 +3,11 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import _extends from "@babel/runtime/helpers/extends";
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-
 var _templateObject;
-
 var _excluded = ["categories"],
-    _excluded2 = ["buttonStyles"];
-
+  _excluded2 = ["buttonStyles"];
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-
 /** @jsx jsx */
 import { css, jsx } from '@emotion/react';
 import React, { memo, useCallback, Fragment } from 'react';
@@ -22,17 +17,14 @@ import { withAnalyticsContext } from '@atlaskit/analytics-next';
 import { DEVICE_BREAKPOINT_NUMBERS, GRID_SIZE } from '../constants';
 import useFocus from '../hooks/use-focus';
 import { fireAnalyticsEvent, EVENT_TYPE, ACTION_SUBJECT, ACTION_SUBJECT_ID, ACTION } from '../../../plugins/analytics';
-
 function CategoryList(_ref) {
   var _ref$categories = _ref.categories,
-      categories = _ref$categories === void 0 ? [] : _ref$categories,
-      props = _objectWithoutProperties(_ref, _excluded);
-
+    categories = _ref$categories === void 0 ? [] : _ref$categories,
+    props = _objectWithoutProperties(_ref, _excluded);
   var _React$useState = React.useState(null),
-      _React$useState2 = _slicedToArray(_React$useState, 2),
-      focusedCategoryIndex = _React$useState2[0],
-      setFocusedCategoryIndex = _React$useState2[1];
-
+    _React$useState2 = _slicedToArray(_React$useState, 2),
+    focusedCategoryIndex = _React$useState2[0],
+    setFocusedCategoryIndex = _React$useState2[1];
   return jsx(Fragment, null, categories.map(function (category, index) {
     return jsx(CategoryListItem, _extends({
       key: category.title,
@@ -43,28 +35,26 @@ function CategoryList(_ref) {
     }, props));
   }));
 }
-
 function CategoryListItem(_ref2) {
   var category = _ref2.category,
-      onSelectCategory = _ref2.onSelectCategory,
-      selectedCategory = _ref2.selectedCategory,
-      index = _ref2.index,
-      focus = _ref2.focus,
-      setFocusedCategoryIndex = _ref2.setFocusedCategoryIndex,
-      createAnalyticsEvent = _ref2.createAnalyticsEvent;
+    onSelectCategory = _ref2.onSelectCategory,
+    selectedCategory = _ref2.selectedCategory,
+    index = _ref2.index,
+    focus = _ref2.focus,
+    setFocusedCategoryIndex = _ref2.setFocusedCategoryIndex,
+    createAnalyticsEvent = _ref2.createAnalyticsEvent;
   var ref = useFocus(focus);
   var onClick = useCallback(function () {
     onSelectCategory(category);
+
     /**
      * When user double clicks on same category, focus on first item.
      */
-
     if (selectedCategory === category.name) {
       setFocusedCategoryIndex(0);
     } else {
       setFocusedCategoryIndex(index);
     }
-
     fireAnalyticsEvent(createAnalyticsEvent)({
       payload: {
         action: ACTION.CLICKED,
@@ -81,9 +71,8 @@ function CategoryListItem(_ref2) {
   }, [focus, index, setFocusedCategoryIndex]);
   var getTheme = useCallback(function (currentTheme, themeProps) {
     var _currentTheme = currentTheme(themeProps),
-        buttonStyles = _currentTheme.buttonStyles,
-        rest = _objectWithoutProperties(_currentTheme, _excluded2);
-
+      buttonStyles = _currentTheme.buttonStyles,
+      rest = _objectWithoutProperties(_currentTheme, _excluded2);
     return _objectSpread({
       buttonStyles: _objectSpread(_objectSpread({}, buttonStyles), {}, {
         textAlign: 'start',
@@ -108,7 +97,6 @@ function CategoryListItem(_ref2) {
     testId: "element-browser-category-item"
   }, category.title));
 }
-
 var buttonWrapper = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  height: ", "px;\n  margin: 4px 4px 4px 0;\n\n  @media (min-width: ", "px) {\n    :not(:last-child) {\n      margin-bottom: 0;\n    }\n  }\n"])), GRID_SIZE * 4, DEVICE_BREAKPOINT_NUMBERS.medium);
 var MemoizedCategoryListWithAnalytics = /*#__PURE__*/memo(withAnalyticsContext({
   component: 'CategoryList'

package/dist/esm/ui/ElementBrowser/components/ElementBrowserLoader.js

@@ -1,7 +1,5 @@
 import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
-
 var _templateObject;
-
 /** @jsx jsx */
 import { css, jsx } from '@emotion/react';
 import React from 'react';
@@ -10,9 +8,7 @@ import Spinner from '@atlaskit/spinner';
 var spinnerContainer = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  height: 100%;\n  width: 100%;\n"])));
 var ElementBrowserLoader = Loadable({
   loader: function loader() {
-    return import(
-    /* webpackChunkName: "@atlaskit-internal_editor-element-browser" */
-    '../ElementBrowser').then(function (module) {
+    return import( /* webpackChunkName: "@atlaskit-internal_editor-element-browser" */'../ElementBrowser').then(function (module) {
       return module.default;
     });
   },

package/dist/esm/ui/ElementBrowser/components/ElementList/ElementList.js

@@ -2,11 +2,8 @@ import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral
 import _extends from "@babel/runtime/helpers/extends";
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10;
-
 var _excluded = ["items", "mode", "selectedItemIndex", "focusedItemIndex", "setColumnCount", "createAnalyticsEvent", "emptyStateHandler", "selectedCategory", "searchTerm"];
-
 /** @jsx jsx */
 import React, { Fragment, memo, useCallback, useEffect, useMemo, useState } from 'react';
 import { css, jsx } from '@emotion/react';
@@ -28,28 +25,24 @@ import { Modes } from '../../types';
 import cellSizeAndPositionGetter from './cellSizeAndPositionGetter';
 import EmptyState from './EmptyState';
 import { getColumnCount, getScrollbarWidth } from './utils';
-
 function ElementList(_ref) {
   var items = _ref.items,
-      mode = _ref.mode,
-      selectedItemIndex = _ref.selectedItemIndex,
-      focusedItemIndex = _ref.focusedItemIndex,
-      setColumnCount = _ref.setColumnCount,
-      createAnalyticsEvent = _ref.createAnalyticsEvent,
-      emptyStateHandler = _ref.emptyStateHandler,
-      selectedCategory = _ref.selectedCategory,
-      searchTerm = _ref.searchTerm,
-      props = _objectWithoutProperties(_ref, _excluded);
-
+    mode = _ref.mode,
+    selectedItemIndex = _ref.selectedItemIndex,
+    focusedItemIndex = _ref.focusedItemIndex,
+    setColumnCount = _ref.setColumnCount,
+    createAnalyticsEvent = _ref.createAnalyticsEvent,
+    emptyStateHandler = _ref.emptyStateHandler,
+    selectedCategory = _ref.selectedCategory,
+    searchTerm = _ref.searchTerm,
+    props = _objectWithoutProperties(_ref, _excluded);
   var _useContainerWidth = useContainerWidth(),
-      containerWidth = _useContainerWidth.containerWidth,
-      ContainerWidthMonitor = _useContainerWidth.ContainerWidthMonitor;
-
+    containerWidth = _useContainerWidth.containerWidth,
+    ContainerWidthMonitor = _useContainerWidth.ContainerWidthMonitor;
   var _useState = useState(SCROLLBAR_WIDTH),
-      _useState2 = _slicedToArray(_useState, 2),
-      scrollbarWidth = _useState2[0],
-      setScrollbarWidth = _useState2[1];
-
+    _useState2 = _slicedToArray(_useState, 2),
+    scrollbarWidth = _useState2[0],
+    setScrollbarWidth = _useState2[1];
   var fullMode = mode === Modes.full;
   useEffect(function () {
     /**
@@ -59,7 +52,6 @@ function ElementList(_ref) {
     if (fullMode && containerWidth > 0) {
       setColumnCount(getColumnCount(containerWidth));
       var updatedScrollbarWidth = getScrollbarWidth();
-
       if (updatedScrollbarWidth > 0) {
         setScrollbarWidth(updatedScrollbarWidth);
       }
@@ -77,13 +69,11 @@ function ElementList(_ref) {
   var cellRenderer = useMemo(function () {
     return function (_ref2) {
       var index = _ref2.index,
-          key = _ref2.key,
-          style = _ref2.style;
-
+        key = _ref2.key,
+        style = _ref2.style;
       if (items[index] == null) {
         return;
       }
-
       return jsx("div", {
         style: style,
         key: key,
@@ -117,69 +107,60 @@ function ElementList(_ref) {
       cellSizeAndPositionGetter: cellSizeAndPositionGetter(containerWidth - ELEMENT_LIST_PADDING * 2, scrollbarWidth),
       height: height,
       width: containerWidth - ELEMENT_LIST_PADDING * 2 // containerWidth - padding on Left/Right (for focus outline)
-
       /**
        * Refresh Collection on WidthObserver value change.
        * Length of the items used to force re-render to solve Firefox bug with react-virtualized retaining
        * scroll position after updating the data. If new data has different number of cells, a re-render
        * is forced to prevent the scroll position render bug.
-       */
-      ,
+       */,
       key: containerWidth + items.length,
       scrollToCell: selectedItemIndex
     });
   }))));
 }
-
 var MemoizedElementItem = /*#__PURE__*/memo(ElementItem);
 MemoizedElementItem.displayName = 'MemoizedElementItem';
 export function ElementItem(_ref4) {
   var inlineMode = _ref4.inlineMode,
-      selected = _ref4.selected,
-      item = _ref4.item,
-      index = _ref4.index,
-      onInsertItem = _ref4.onInsertItem,
-      focus = _ref4.focus,
-      setFocusedItemIndex = _ref4.setFocusedItemIndex;
+    selected = _ref4.selected,
+    item = _ref4.item,
+    index = _ref4.index,
+    onInsertItem = _ref4.onInsertItem,
+    focus = _ref4.focus,
+    setFocusedItemIndex = _ref4.setFocusedItemIndex;
   var ref = useFocus(focus);
+
   /**
    * Note: props.onSelectItem(item) is not called here as the StatelessElementBrowser's
    * useEffect would trigger it on selectedItemIndex change. (Line 106-110)
    * This implementation was changed for keyboard/click selection to work with `onInsertItem`.
    */
-
   var onClick = useCallback(function (e) {
     e.preventDefault();
     e.stopPropagation();
     setFocusedItemIndex(index);
-
     switch (e.nativeEvent.detail) {
       case 0:
         onInsertItem(item);
         break;
-
       case 1:
         if (inlineMode) {
           onInsertItem(item);
         }
-
         break;
-
       case 2:
         if (!inlineMode) {
           onInsertItem(item);
         }
-
         break;
-
       default:
         return;
     }
   }, [index, inlineMode, item, onInsertItem, setFocusedItemIndex]);
   var icon = item.icon,
-      title = item.title,
-      description = item.description,
-      keyshortcut = item.keyshortcut;
+    title = item.title,
+    description = item.description,
+    keyshortcut = item.keyshortcut;
   return jsx(Tooltip, {
     content: description,
     testId: "element-item-tooltip-".concat(index)
@@ -201,24 +182,24 @@ export function ElementItem(_ref4) {
     keyshortcut: keyshortcut
   })));
 }
+
 /**
  * Inline mode should use the existing Align-items:center value.
  */
-
 var itemStyleOverrides = {
   alignItems: 'flex-start'
 };
 var ElementBefore = /*#__PURE__*/memo(function (_ref5) {
   var icon = _ref5.icon,
-      title = _ref5.title;
+    title = _ref5.title;
   return jsx("div", {
     css: [itemIcon, itemIconStyle]
   }, icon ? icon() : jsx(IconFallback, null));
 });
 var ItemContent = /*#__PURE__*/memo(function (_ref6) {
   var title = _ref6.title,
-      description = _ref6.description,
-      keyshortcut = _ref6.keyshortcut;
+    description = _ref6.description,
+    keyshortcut = _ref6.keyshortcut;
   return jsx("div", {
     css: itemBody,
     className: "item-body"
@@ -239,11 +220,11 @@ var ItemContent = /*#__PURE__*/memo(function (_ref6) {
 var elementItemsWrapper = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  flex: 1;\n  flex-flow: row wrap;\n  align-items: flex-start;\n  justify-content: flex-start;\n  overflow: hidden;\n  padding: ", "px; // For Focus outline\n\n  .ReactVirtualized__Collection {\n    border-radius: 3px; // Standard border-radius across other components like Search or Item.\n    outline: none;\n\n    :focus {\n      box-shadow: 0 0 0 ", "px\n        ", ";\n    }\n  }\n  .ReactVirtualized__Collection__innerScrollContainer {\n    div[class='element-item-wrapper']:last-child {\n      padding-bottom: 4px;\n    }\n  }\n"])), ELEMENT_LIST_PADDING, ELEMENT_LIST_PADDING, "var(--ds-border-focused, ".concat(B100, ")"));
 var elementItemWrapper = css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  div {\n    button {\n      height: 75px;\n      align-items: flex-start;\n      padding: 12px 12px 11px;\n    }\n  }\n"])));
 var itemBody = css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  flex-wrap: nowrap;\n  justify-content: space-between;\n  line-height: 1.4;\n  width: 100%;\n\n  margin-top: -2px; // Fixes the Item Icon and text's alignment issue\n"])));
+
 /*
  * -webkit-line-clamp is also supported by firefox 🎉
  * https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/68#CSS
  */
-
 var multilineStyle = css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  display: -webkit-box;\n  -webkit-line-clamp: 2;\n  -webkit-box-orient: vertical;\n"])));
 var itemDescription = css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n  ", ";\n\n  overflow: hidden;\n  font-size: ", ";\n  color: ", ";\n  margin-top: 2px;\n"])), multilineStyle, relativeFontSizeToBase16(11.67), "var(--ds-text-subtle, ".concat(N200, ")"));
 var itemText = css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n  width: inherit;\n  white-space: initial;\n"])));

package/dist/esm/ui/ElementBrowser/components/ElementList/EmptyState.js

@@ -1,7 +1,5 @@
 import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
-
 var _templateObject, _templateObject2, _templateObject3, _templateObject4;
-
 /** @jsx jsx */
 import { css, jsx } from '@emotion/react';
 import { FormattedMessage } from 'react-intl-next';

package/dist/esm/ui/ElementBrowser/components/ElementList/NotFoundIllustration.js

@@ -1,10 +1,7 @@
 import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
-
 var _templateObject;
-
 /* eslint-disable @atlaskit/design-system/ensure-design-token-usage */
 // TODO: https://product-fabric.atlassian.net/browse/DSP-4249
-
 /** @jsx jsx */
 import { css, jsx } from '@emotion/react';
 var imageContainer = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  width: 120px;\n  height: 111px;\n  margin-top: 48px;\n"])));

package/dist/esm/ui/ElementBrowser/components/ElementList/cellSizeAndPositionGetter.js

@@ -1,29 +1,26 @@
 import { ELEMENT_ITEM_HEIGHT } from '../../constants';
 import { generateVirtualizedContainerDatum } from './utils';
+
 /**
  * Callback responsible for returning size and offset/position information
  * for a given cell.
  * https://github.com/bvaughn/react-virtualized/blob/master/docs/Collection.md
  **/
-
 export default function cellSizeAndPositionGetter(containerWidth, scrollbarWidth) {
   var GUTTER_SIZE = 4;
   /**
    * Save the currently rendered columnY positions.
    * Have to be within the current render scope.
    */
-
   var columnYMap = [];
   return function (_ref) {
     var index = _ref.index;
-
     var _generateVirtualizedC = generateVirtualizedContainerDatum(containerWidth, {
-      gutterSize: GUTTER_SIZE,
-      scrollbarWidth: scrollbarWidth
-    }),
-        columnCount = _generateVirtualizedC.columnCount,
-        availableWidth = _generateVirtualizedC.availableWidth;
-
+        gutterSize: GUTTER_SIZE,
+        scrollbarWidth: scrollbarWidth
+      }),
+      columnCount = _generateVirtualizedC.columnCount,
+      availableWidth = _generateVirtualizedC.availableWidth;
     var width = Math.floor(availableWidth / columnCount);
     var height = ELEMENT_ITEM_HEIGHT;
     var columnPosition = index % (columnCount || 1);

package/dist/esm/ui/ElementBrowser/components/ElementList/utils.js

@@ -1,19 +1,15 @@
 import { ELEMENT_LIST_PADDING, FLEX_ITEMS_CONTAINER_BREAKPOINT_NUMBERS, SCROLLBAR_WIDTH } from '../../constants';
 export function getColumnCount(clientWidth) {
   var small = FLEX_ITEMS_CONTAINER_BREAKPOINT_NUMBERS.small,
-      medium = FLEX_ITEMS_CONTAINER_BREAKPOINT_NUMBERS.medium,
-      large = FLEX_ITEMS_CONTAINER_BREAKPOINT_NUMBERS.large;
-
+    medium = FLEX_ITEMS_CONTAINER_BREAKPOINT_NUMBERS.medium,
+    large = FLEX_ITEMS_CONTAINER_BREAKPOINT_NUMBERS.large;
   switch (true) {
     case clientWidth < small:
       return 1;
-
     case clientWidth >= small && clientWidth < medium:
       return Math.floor(clientWidth / 200);
-
     case clientWidth >= large:
       return Math.floor(clientWidth / 248);
-
     default:
       return Math.floor(clientWidth / 220);
   }
@@ -31,7 +27,6 @@ var CALCULATED_SCROLLBAR_WIDTH;
 export function getScrollbarWidth() {
   if (!CALCULATED_SCROLLBAR_WIDTH) {
     var _container$parentNode;
-
     var container = document.createElement('div');
     container.style.visibility = 'hidden';
     container.style.overflow = 'scroll';
@@ -40,12 +35,10 @@ export function getScrollbarWidth() {
     container.appendChild(innerContainer);
     var scrollbarWidth = container.offsetWidth - innerContainer.offsetWidth;
     (_container$parentNode = container.parentNode) === null || _container$parentNode === void 0 ? void 0 : _container$parentNode.removeChild(container);
-
     if (scrollbarWidth) {
       CALCULATED_SCROLLBAR_WIDTH = scrollbarWidth;
       return scrollbarWidth;
     }
-
     return SCROLLBAR_WIDTH;
   } else {
     return CALCULATED_SCROLLBAR_WIDTH;