@atlaskit/link-datasource 1.19.7 → 1.19.9

package/dist/cjs/ui/jira-issues-modal/basic-filters/utils/extractValuesFromNonComplexJQL.js

@@ -20,11 +20,19 @@ function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Re
 // Map of field keys to their respective clauses in the Jast
 
 var getFieldValues = function getFieldValues(operand) {
+  var mapValuesFromList = function mapValuesFromList(value) {
+    if (value.operandType === _jqlAst.OPERAND_TYPE_VALUE) {
+      return value.value;
+    }
+    // we only support EMPTY keyword atm, hence making sure if operandType is a KEYWORD, then its an EMPTY keyword
+    if (value.operandType === _jqlAst.OPERAND_TYPE_KEYWORD && value.value === _jqlAst.OPERAND_EMPTY) {
+      return value.value;
+    }
+    return undefined;
+  };
   switch (operand.operandType) {
     case _jqlAst.OPERAND_TYPE_LIST:
-      return operand.values.map(function (value) {
-        return value.operandType === _jqlAst.OPERAND_TYPE_VALUE && value.value || undefined;
-      }).filter(function (value) {
+      return operand.values.map(mapValuesFromList).filter(function (value) {
         return !!value;
       });
     case _jqlAst.OPERAND_TYPE_VALUE:

package/dist/cjs/ui/jira-issues-modal/modal/index.js

@@ -62,7 +62,11 @@ var contentContainerStyles = (0, _react2.css)({
   display: 'grid',
   maxHeight: '420px',
   overflow: 'auto',
-  borderBottom: "2px solid ".concat("var(--ds-background-accent-gray-subtler, ".concat(_colors.N40, ")"))
+  borderBottom: "2px solid ".concat("var(--ds-background-accent-gray-subtler, ".concat(_colors.N40, ")")),
+  background: _issueLikeTable.scrollableContainerShadowsCssComponents.background,
+  backgroundRepeat: _issueLikeTable.scrollableContainerShadowsCssComponents.backgroundRepeat,
+  backgroundSize: _issueLikeTable.scrollableContainerShadowsCssComponents.backgroundSize,
+  backgroundAttachment: _issueLikeTable.scrollableContainerShadowsCssComponents.backgroundAttachment
 });
 var placeholderSmartLinkStyles = (0, _react2.css)({
   backgroundColor: "var(--ds-surface-raised, ".concat(_colors.N0, ")"),

package/dist/cjs/ui/table-footer/index.js

@@ -21,8 +21,8 @@ var _messages = require("./messages");
 var _syncInfo = require("./sync-info");
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
 /** @jsx jsx */
-var FooterWrapper = _styled.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  padding: 0 ", ";\n  box-sizing: border-box;\n  border-radius: inherit;\n  background: ", ";\n"])), "var(--ds-space-200, 16px)", "var(--ds-background-input, ".concat(_colors.N0, ")"));
-var TopBorderWrapper = _styled.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  box-sizing: border-box;\n  justify-content: space-between;\n  padding: ", " 0;\n  border-top: 2px solid ", ";\n"])), "var(--ds-space-250, 20px)", "var(--ds-background-accent-gray-subtler, ".concat(_colors.N40, ")"));
+var FooterWrapper = _styled.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  padding: 0 ", ";\n  box-sizing: border-box;\n  border-radius: inherit;\n  border-top-left-radius: 0;\n  border-top-right-radius: 0;\n  background: ", ";\n  border-top: 2px solid ", ";\n"])), "var(--ds-space-200, 16px)", "var(--ds-background-input, ".concat(_colors.N0, ")"), "var(--ds-background-accent-gray-subtler, ".concat(_colors.N40, ")"));
+var TopBorderWrapper = _styled.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  box-sizing: border-box;\n  justify-content: space-between;\n  padding: ", " 0;\n"])), "var(--ds-space-250, 20px)");
 var ItemCounterWrapper = _styled.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  align-self: center;\n"])));
 var SyncWrapper = _styled.default.div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  align-items: center;\n  color: ", ";\n"])), "var(--ds-text-accent-gray, ".concat(_colors.N90, ")"));
 var SyncTextWrapper = _styled.default.div(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n  margin-right: 5px;\n  font-size: 12px;\n"])));

package/dist/es2019/analytics/constants.js

@@ -1,5 +1,5 @@
 export const EVENT_CHANNEL = 'media';
 export const packageMetaData = {
   packageName: "@atlaskit/link-datasource",
-  packageVersion: "1.19.7"
+  packageVersion: "1.19.9"
 };

package/dist/es2019/ui/assets-modal/modal/index.js

@@ -21,6 +21,7 @@ import i18nEN from '../../../i18n/en';
 import { PermissionError } from '../../../services/cmdbService.utils';
 import { AccessRequired } from '../../../ui/common/error-state/access-required';
 import { ModalLoadingError } from '../../common/error-state/modal-loading-error';
+import { scrollableContainerShadowsCssComponents } from '../../issue-like-table';
 import { AssetsSearchContainer } from '../search-container';
 import { AssetsSearchContainerLoading } from '../search-container/loading-state';
 import { modalMessages } from './messages';
@@ -28,7 +29,11 @@ import { RenderAssetsContent } from './render-assets-content';
 const modalBodyWrapperStyles = css({
   display: 'grid',
   height: '420px',
-  overflow: 'auto'
+  overflow: 'auto',
+  background: scrollableContainerShadowsCssComponents.background,
+  backgroundRepeat: scrollableContainerShadowsCssComponents.backgroundRepeat,
+  backgroundSize: scrollableContainerShadowsCssComponents.backgroundSize,
+  backgroundAttachment: scrollableContainerShadowsCssComponents.backgroundAttachment
 });
 const modalBodyErrorWrapperStyles = css({
   alignItems: 'center'

package/dist/es2019/ui/issue-like-table/empty-state/index.js

@@ -15,16 +15,17 @@ const SkeletonComponent = ({
 const tableBodyStyles = css({
   borderBottom: 0
 });
+const padding = `${"var(--ds-space-100, 8px)"} ${"var(--ds-space-100, 8px)"}`;
 const cellStyles = css({
-  paddingBlock: "var(--ds-space-100, 12px)",
+  padding,
   borderRight: `0.5px solid ${`var(--ds-border, ${N40})`}`,
   borderBottom: `0.5px solid ${`var(--ds-border, ${N40})`}`,
   '&:first-child': {
-    paddingLeft: `${"var(--ds-space-100, 4px)"}`
+    paddingLeft: `${"var(--ds-space-100, 8px)"}`
   },
   '&:last-child': {
     borderRight: 0,
-    paddingRight: `${"var(--ds-space-100, 4px)"}`
+    paddingRight: `${"var(--ds-space-100, 8px)"}`
   }
 });
 const baseColumns = [{
@@ -115,7 +116,8 @@ export default (({
   }) => jsx(TableHeading, {
     key: key,
     style: {
-      width
+      width,
+      padding
     }
   }, jsx(Skeleton, {
     appearance: "darkGray",

package/dist/es2019/ui/issue-like-table/index.js

@@ -23,7 +23,7 @@ import { Table, TableHeading } from './styled';
 import { useIsOnScreen } from './useIsOnScreen';
 const tableSidePadding = "var(--ds-space-200, 16px)";
 const tableHeadStyles = css({
-  background: "var(--ds-surface, #FFF)",
+  background: "var(--ds-elevation-surface-current, #FFF)",
   position: 'sticky',
   top: 0,
   zIndex: stickyTableHeadersIndex
@@ -33,7 +33,7 @@ const ColumnPickerHeader = styled.th`
   z-index: 10;
   position: sticky;
   right: calc(-1 * ${tableSidePadding});
-  background-color: ${"var(--ds-surface, #FFF)"};
+  background-color: ${"var(--ds-elevation-surface-current, #FFF)"};
   border-bottom: 2px solid ${`var(--ds-border, ${N40})`}; /* It is required to have solid (not half-transparent) color because of this gradient business below */
 
   padding-right: ${"var(--ds-space-100, 4px)"};
@@ -41,7 +41,7 @@ const ColumnPickerHeader = styled.th`
   background: linear-gradient(
     90deg,
     rgba(255, 255, 255, 0) 0%,
-    ${"var(--ds-surface, #FFF)"} 10%
+    ${"var(--ds-elevation-surface-current, #FFF)"} 10%
   );
   vertical-align: middle; /* Keeps dropdown button in the middle */
   &:last-of-type {
@@ -56,19 +56,131 @@ const truncatedCellStyles = css({
   borderRight: `0.5px solid ${`var(--ds-border, ${N40})`}`,
   borderBottom: `0.5px solid ${`var(--ds-border, ${N40})`}`,
   '&:first-child': {
-    paddingLeft: `${"var(--ds-space-100, 4px)"}`
+    paddingLeft: `${"var(--ds-space-100, 8px)"}`
   },
   '&:last-child': {
     borderRight: 0,
-    paddingRight: `${"var(--ds-space-100, 4px)"}`
+    paddingRight: `${"var(--ds-space-100, 8px)"}`
   }
 });
 const tableContainerStyles = css({
-  borderRadius: 'inherit'
+  borderRadius: 'inherit',
+  borderBottomLeftRadius: 0,
+  borderBottomRightRadius: 0
 });
+
+/**
+ * Following section deals with slight gradient shadows that we add
+ * on all four sides when there is more content in that direction.
+ *
+ * We do that by applying two gradients to the background -
+ * one is "static" ('local') and other is "sticky" ('scroll'). \
+ * "Static" one makes a white color gradient, that when window is at the end of scrollable area goes on top
+ * of "sticky" (gray) one, dominating and hence disabling sticky one.
+ */
+
+const shadowColor = "var(--ds-shadow-overflow-perimeter, rgba(0, 0, 0, 0.1))";
+const shadowColorLight = "var(--ds-shadow-overflow-perimeter, rgba(0, 0, 0, 0.05))";
+const leftWhiteOverrideGradient = {
+  background: `
+  linear-gradient(
+    90deg,
+    ${"var(--ds-elevation-surface-current, #FFF)"} 30%,
+    rgba(255, 255, 255, 0)
+  ) left center`,
+  size: `40px 100%`,
+  attachment: `local`
+};
+const topWhiteOverrideGradient = {
+  background: `
+  linear-gradient(
+    0deg,
+    rgba(255, 255, 255, 0),
+    ${"var(--ds-elevation-surface-current, #FFF)"} 30%
+  ) top center`,
+  size: `100% 100px`,
+  attachment: `local`
+};
+const rightWhiteOverrideGradient = {
+  background: `
+  linear-gradient(
+    90deg,
+    rgba(255, 255, 255, 0),
+    ${"var(--ds-elevation-surface-current, #FFF)"} 70%
+  ) right center`,
+  size: `40px 100%`,
+  attachment: `local`
+};
+const bottomWhiteOverride = {
+  background: `
+  linear-gradient(
+    0deg,
+    ${"var(--ds-elevation-surface-current, #FFF)"} 30%,
+    rgba(255, 255, 255, 0)
+  ) bottom center`,
+  size: `100% 40px`,
+  attachment: `local`
+};
+const leftShadowGradient = {
+  background: `
+  linear-gradient(
+    90deg,
+    ${shadowColor},
+    rgba(0, 0, 0, 0)
+  ) left center`,
+  size: `14px 100%`,
+  attachment: `scroll`
+};
+const topShadowGradient = {
+  background: `
+  linear-gradient(
+    0deg,
+    rgba(0, 0, 0, 0),
+    ${shadowColorLight}
+  ) 0 52px`,
+  size: `100% 14px`,
+  attachment: `scroll`
+};
+const rightShadowGradient = {
+  background: `
+  linear-gradient(
+    90deg,
+    rgba(0, 0, 0, 0),
+    ${shadowColor}
+  ) right center`,
+  size: `14px 100%`,
+  attachment: `scroll`
+};
+const bottomShadowGradient = {
+  background: `
+  linear-gradient(
+    0deg,
+    ${shadowColorLight},
+    rgba(0, 0, 0, 0)
+  ) bottom center`,
+  size: `100% 10px`,
+  attachment: `scroll`
+};
+const shadows = [leftWhiteOverrideGradient, leftShadowGradient, rightWhiteOverrideGradient, rightShadowGradient, topWhiteOverrideGradient, topShadowGradient, bottomWhiteOverride, bottomShadowGradient];
+export const scrollableContainerShadowsCssComponents = {
+  background: shadows.map(({
+    background
+  }) => background).join(','),
+  backgroundRepeat: 'no-repeat',
+  backgroundSize: shadows.map(({
+    size
+  }) => size).join(','),
+  backgroundAttachment: shadows.map(({
+    attachment
+  }) => attachment).join(',')
+};
 const scrollableContainerStyles = css({
   overflow: 'auto',
-  boxSizing: 'border-box'
+  boxSizing: 'border-box',
+  background: scrollableContainerShadowsCssComponents.background,
+  backgroundRepeat: scrollableContainerShadowsCssComponents.backgroundRepeat,
+  backgroundSize: scrollableContainerShadowsCssComponents.backgroundSize,
+  backgroundAttachment: scrollableContainerShadowsCssComponents.backgroundAttachment
 });
 const tableStyles = css({
   // These styles are needed to prevent thead bottom border from scrolling away.
@@ -102,11 +214,11 @@ const BASE_WIDTH = 8;
 const DEFAULT_WIDTH = BASE_WIDTH * 22;
 export const COLUMN_MIN_WIDTH = BASE_WIDTH * 3;
 const keyBasedWidthMap = {
-  priority: BASE_WIDTH * 4,
+  priority: BASE_WIDTH * 5,
   status: BASE_WIDTH * 18,
   summary: BASE_WIDTH * 45,
   description: BASE_WIDTH * 31.25,
-  type: BASE_WIDTH * 4,
+  type: BASE_WIDTH * 5,
   key: BASE_WIDTH * 13
 };
 function getDefaultColumnWidth(key, type) {
@@ -118,7 +230,7 @@ function getDefaultColumnWidth(key, type) {
     case 'date':
       return BASE_WIDTH * 14;
     case 'icon':
-      return BASE_WIDTH * 4;
+      return BASE_WIDTH * 5;
     default:
       return DEFAULT_WIDTH;
   }
@@ -442,7 +554,7 @@ export const IssueLikeDataTableView = ({
     if (key !== null && key !== void 0 && key.includes('loading')) {
       loadingRowStyle = {
         ...loadingRowStyle,
-        paddingBlock: "var(--ds-space-100, 12px)"
+        paddingBlock: "var(--ds-space-100, 8px)"
       };
     }
     return jsx("td", {

package/dist/es2019/ui/issue-like-table/styled.js

@@ -5,12 +5,15 @@ export const FieldTextFontSize = '14px';
 export const Table = styled.table`
   width: 100%;
 `;
+const lineHeight = "var(--ds-font-lineHeight-300, 24px)";
+const verticalPadding = "var(--ds-space-025, 2px)";
 export const TableHeading = styled.th`
   position: relative;
-  line-height: ${"var(--ds-font-lineHeight-300, 16px)"};
+  line-height: ${lineHeight};
+  padding: ${verticalPadding} ${"var(--ds-space-050, 4px)"};
   border-right: 0.5px solid ${`var(--ds-border, ${N40})`};
   border-bottom: 2px solid ${`var(--ds-border, ${N40})`};
-  height: calc(52px - ${"var(--ds-space-050, 4px)"} * 2 - 2px);
+  height: calc(${lineHeight} * 2 + ${verticalPadding} * 2);
   vertical-align: bottom;
 
   &.has-column-picker:nth-last-of-type(2) {
@@ -18,7 +21,7 @@ export const TableHeading = styled.th`
   }
 
   &:first-child {
-    padding-left: ${"var(--ds-space-100, 4px)"};
+    padding-left: ${"var(--ds-space-050, 4px)"};
   }
 
   &:last-child {
@@ -27,13 +30,12 @@ export const TableHeading = styled.th`
 
   & [data-testid='datasource-header-content--container'] {
     width: 100%;
-    padding: ${"var(--ds-space-100, 4px)"} ${"var(--ds-space-050, 2px)"};
+    padding: ${verticalPadding} ${"var(--ds-space-050, 4px)"};
     display: -webkit-box;
     -webkit-line-clamp: 2;
     -webkit-box-orient: vertical;
     white-space: normal;
     overflow: hidden;
-    max-height: 2.5rem;
     word-wrap: break-word;
 
     &:hover {

package/dist/es2019/ui/jira-issues-modal/basic-filters/hooks/messages.js

@@ -0,0 +1,8 @@
+import { defineMessages } from 'react-intl-next';
+export const filterOptionMessages = defineMessages({
+  assigneeUnassignedFilterOption: {
+    id: 'linkDataSource.basic-filter.dropdown.select.assignee.unassigned',
+    description: 'Text to display for Unassigned assignee filter option.',
+    defaultMessage: 'Unassigned'
+  }
+});

package/dist/es2019/ui/jira-issues-modal/basic-filters/hooks/useFilterOptions.js

@@ -1,10 +1,20 @@
 import { useCallback, useEffect, useRef, useState } from 'react';
+import { useIntl } from 'react-intl-next';
 import { useBasicFilterAGG } from '../../../../services/useBasicFilterAGG';
 import { mapFieldValuesToFilterOptions, mapFieldValuesToPageCursor, mapFieldValuesToTotalCount } from '../utils/transformers';
+import { filterOptionMessages } from './messages';
+export const getAssigneeUnassignedFilterOption = formatMessage => ({
+  label: formatMessage(filterOptionMessages.assigneeUnassignedFilterOption),
+  optionType: 'avatarLabel',
+  value: 'empty'
+});
 export const useFilterOptions = ({
   filterType,
   cloudId
 }) => {
+  const {
+    formatMessage
+  } = useIntl();
   const [filterOptions, setFilterOptions] = useState([]);
   const [totalCount, setTotalCount] = useState(0);
   const [status, setStatus] = useState('empty');
@@ -37,26 +47,37 @@ export const useFilterOptions = ({
         setErrors(response.errors);
         return;
       }
+      const mappedResponse = mapFieldValuesToFilterOptions(response);
+      let mappedTotalCount = mapFieldValuesToTotalCount(response);
       if (isNewSearch) {
-        setFilterOptions(mapFieldValuesToFilterOptions(response));
         if (isRequestLikeInitialSearch) {
           /**
            * The initial dataset is used in couple of paths, eg: when a user searches and clears the search text.
            * During these times, we dont want to fetch data again and again, hence a mini cache setup to store and provide the initial dataset
            */
           initialData.current = response;
+
+          /**
+           * For assignee filter option, we want `Unassigned` as an option.
+           * Since `Unassigned/EMPTY` is not returned by the API, we add it manually, but only for the initial list
+           */
+          if (filterType === 'assignee') {
+            mappedResponse.unshift(getAssigneeUnassignedFilterOption(formatMessage));
+            mappedTotalCount += 1;
+          }
         }
+        setFilterOptions(mappedResponse);
       } else {
-        setFilterOptions([...filterOptions, ...mapFieldValuesToFilterOptions(response)]);
+        setFilterOptions([...filterOptions, ...mappedResponse]);
       }
-      setTotalCount(mapFieldValuesToTotalCount(response));
+      setTotalCount(mappedTotalCount);
       setNextPageCursor(mapFieldValuesToPageCursor(response));
       setStatus('resolved');
     } catch (error) {
       setStatus('rejected');
       setErrors([error]);
     }
-  }, [cloudId, filterOptions, filterType, getFieldValues]);
+  }, [cloudId, filterOptions, filterType, formatMessage, getFieldValues]);
   useEffect(() => {
     if (status !== 'rejected' && errors.length !== 0) {
       setErrors([]);

package/dist/es2019/ui/jira-issues-modal/basic-filters/hooks/useHydrateJqlQuery.js

@@ -1,10 +1,16 @@
 import { useCallback, useEffect, useState } from 'react';
+import { useIntl } from 'react-intl-next';
+import { OPERAND_EMPTY } from '@atlaskit/jql-ast';
 import { useBasicFilterAGG } from '../../../../services/useBasicFilterAGG';
 import { extractValuesFromNonComplexJQL } from '../utils/extractValuesFromNonComplexJQL';
 import { removeFuzzyCharacter } from '../utils/isClauseTooComplex';
 import { mapHydrateResponseData } from '../utils/transformers';
+import { getAssigneeUnassignedFilterOption } from './useFilterOptions';
 export const useHydrateJqlQuery = (cloudId, jql) => {
   const [hydratedOptions, setHydratedOptions] = useState({});
+  const {
+    formatMessage
+  } = useIntl();
   const [status, setStatus] = useState('empty');
   const [errors, setErrors] = useState([]);
   const {
@@ -19,6 +25,10 @@ export const useHydrateJqlQuery = (cloudId, jql) => {
         setErrors(response.errors);
         return;
       }
+      const {
+        assignee: mappedHydratedAssigneeValue,
+        ...restOfMappedHydratedResponse
+      } = mapHydrateResponseData(response);
 
       /**
        * Hydrate logic does not return text field, hence we parse and extract value from jql
@@ -26,11 +36,19 @@ export const useHydrateJqlQuery = (cloudId, jql) => {
       const {
         text,
         summary,
-        key
+        key,
+        assignee: extractedAssigneeValue
       } = extractValuesFromNonComplexJQL(jql);
       const [textFieldValue] = text || summary || key || [];
       const mappedValues = {
-        ...mapHydrateResponseData(response),
+        ...restOfMappedHydratedResponse,
+        /**
+         * Special handling for assignee as we need to inject Unassigned value if JQL contains EMPTY keyword for assignee
+         */
+        assignee: [...(mappedHydratedAssigneeValue || []),
+        // all values provided by the hydrate API for assignee
+        ...(extractedAssigneeValue !== null && extractedAssigneeValue !== void 0 && extractedAssigneeValue.includes(OPERAND_EMPTY) // checks and adds EMPTY filter option if extracted assignee values from jql contains EMPTY
+        ? [getAssigneeUnassignedFilterOption(formatMessage)] : [])],
         ...(textFieldValue ? {
           basicInputTextValue: removeFuzzyCharacter(textFieldValue)
         } : {})
@@ -41,7 +59,7 @@ export const useHydrateJqlQuery = (cloudId, jql) => {
       setErrors([error]);
       setStatus('rejected');
     }
-  }, [cloudId, getHydratedJQL, jql]);
+  }, [cloudId, formatMessage, getHydratedJQL, jql]);
   useEffect(() => {
     if (status !== 'rejected' && errors.length !== 0) {
       setErrors([]);

package/dist/es2019/ui/jira-issues-modal/basic-filters/ui/async-popup-select/messages.js

@@ -1,4 +1,5 @@
-export const asyncPopupSelectMessages = {
+import { defineMessages } from 'react-intl-next';
+export const asyncPopupSelectMessages = defineMessages({
   selectPlaceholder: {
     id: 'linkDataSource.basic-filter.dropdown.select.placeholder',
     description: 'Placeholder text to be displayed for the search input box.',
@@ -34,4 +35,4 @@ export const asyncPopupSelectMessages = {
     defaultMessage: 'Show more',
     description: 'The text to show more options in dropdown'
   }
-};
+});

package/dist/es2019/ui/jira-issues-modal/basic-filters/ui/menu-list/messages.js

@@ -1,4 +1,5 @@
-export const asyncPopupSelectMessages = {
+import { defineMessages } from 'react-intl-next';
+export const asyncPopupSelectMessages = defineMessages({
   loadingMessage: {
     id: 'linkDataSource.basic-filter.loading-message',
     defaultMessage: 'Loading...',
@@ -14,4 +15,4 @@ export const asyncPopupSelectMessages = {
     defaultMessage: 'Something went wrong',
     description: 'The text for when an error occurs when loading options'
   }
-};
+});

package/dist/es2019/ui/jira-issues-modal/basic-filters/utils/extractValuesFromNonComplexJQL.js

@@ -6,9 +6,19 @@ import { isQueryTooComplex } from './isQueryTooComplex';
 // Map of field keys to their respective clauses in the Jast
 
 const getFieldValues = operand => {
+  const mapValuesFromList = value => {
+    if (value.operandType === OPERAND_TYPE_VALUE) {
+      return value.value;
+    }
+    // we only support EMPTY keyword atm, hence making sure if operandType is a KEYWORD, then its an EMPTY keyword
+    if (value.operandType === OPERAND_TYPE_KEYWORD && value.value === OPERAND_EMPTY) {
+      return value.value;
+    }
+    return undefined;
+  };
   switch (operand.operandType) {
     case OPERAND_TYPE_LIST:
-      return operand.values.map(value => value.operandType === OPERAND_TYPE_VALUE && value.value || undefined).filter(value => !!value);
+      return operand.values.map(mapValuesFromList).filter(value => !!value);
     case OPERAND_TYPE_VALUE:
       return operand.value ? [operand.value] : [];
     case OPERAND_TYPE_KEYWORD:

package/dist/es2019/ui/jira-issues-modal/modal/index.js

@@ -22,7 +22,7 @@ import { AccessRequired } from '../../common/error-state/access-required';
 import { ModalLoadingError } from '../../common/error-state/modal-loading-error';
 import { NoInstancesView } from '../../common/error-state/no-instances';
 import { NoResults } from '../../common/error-state/no-results';
-import { EmptyState, IssueLikeDataTableView } from '../../issue-like-table';
+import { EmptyState, IssueLikeDataTableView, scrollableContainerShadowsCssComponents } from '../../issue-like-table';
 import LinkRenderType from '../../issue-like-table/render-type/link';
 import { availableBasicFilterTypes } from '../basic-filters/ui';
 import { InitialStateView } from '../initial-state-view';
@@ -46,7 +46,11 @@ const contentContainerStyles = css({
   display: 'grid',
   maxHeight: '420px',
   overflow: 'auto',
-  borderBottom: `2px solid ${`var(--ds-background-accent-gray-subtler, ${N40})`}`
+  borderBottom: `2px solid ${`var(--ds-background-accent-gray-subtler, ${N40})`}`,
+  background: scrollableContainerShadowsCssComponents.background,
+  backgroundRepeat: scrollableContainerShadowsCssComponents.backgroundRepeat,
+  backgroundSize: scrollableContainerShadowsCssComponents.backgroundSize,
+  backgroundAttachment: scrollableContainerShadowsCssComponents.backgroundAttachment
 });
 const placeholderSmartLinkStyles = css({
   backgroundColor: `var(--ds-surface-raised, ${N0})`,

package/dist/es2019/ui/table-footer/index.js

@@ -15,14 +15,16 @@ const FooterWrapper = styled.div`
   padding: 0 ${"var(--ds-space-200, 16px)"};
   box-sizing: border-box;
   border-radius: inherit;
+  border-top-left-radius: 0;
+  border-top-right-radius: 0;
   background: ${`var(--ds-background-input, ${N0})`};
+  border-top: 2px solid ${`var(--ds-background-accent-gray-subtler, ${N40})`};
 `;
 const TopBorderWrapper = styled.div`
   display: flex;
   box-sizing: border-box;
   justify-content: space-between;
   padding: ${"var(--ds-space-250, 20px)"} 0;
-  border-top: 2px solid ${`var(--ds-background-accent-gray-subtler, ${N40})`};
 `;
 const ItemCounterWrapper = styled.div`
   display: flex;

package/dist/esm/analytics/constants.js

@@ -1,5 +1,5 @@
 export var EVENT_CHANNEL = 'media';
 export var packageMetaData = {
   packageName: "@atlaskit/link-datasource",
-  packageVersion: "1.19.7"
+  packageVersion: "1.19.9"
 };

package/dist/esm/ui/assets-modal/modal/index.js

@@ -27,6 +27,7 @@ import i18nEN from '../../../i18n/en';
 import { PermissionError } from '../../../services/cmdbService.utils';
 import { AccessRequired } from '../../../ui/common/error-state/access-required';
 import { ModalLoadingError } from '../../common/error-state/modal-loading-error';
+import { scrollableContainerShadowsCssComponents } from '../../issue-like-table';
 import { AssetsSearchContainer } from '../search-container';
 import { AssetsSearchContainerLoading } from '../search-container/loading-state';
 import { modalMessages } from './messages';
@@ -34,7 +35,11 @@ import { RenderAssetsContent } from './render-assets-content';
 var modalBodyWrapperStyles = css({
   display: 'grid',
   height: '420px',
-  overflow: 'auto'
+  overflow: 'auto',
+  background: scrollableContainerShadowsCssComponents.background,
+  backgroundRepeat: scrollableContainerShadowsCssComponents.backgroundRepeat,
+  backgroundSize: scrollableContainerShadowsCssComponents.backgroundSize,
+  backgroundAttachment: scrollableContainerShadowsCssComponents.backgroundAttachment
 });
 var modalBodyErrorWrapperStyles = css({
   alignItems: 'center'

package/dist/esm/ui/issue-like-table/empty-state/index.js

@@ -16,16 +16,17 @@ var SkeletonComponent = function SkeletonComponent(_ref) {
 var tableBodyStyles = css({
   borderBottom: 0
 });
+var padding = "var(--ds-space-100, 8px)".concat(" ", "var(--ds-space-100, 8px)");
 var cellStyles = css({
-  paddingBlock: "var(--ds-space-100, 12px)",
+  padding: padding,
   borderRight: "0.5px solid ".concat("var(--ds-border, ".concat(N40, ")")),
   borderBottom: "0.5px solid ".concat("var(--ds-border, ".concat(N40, ")")),
   '&:first-child': {
-    paddingLeft: "var(--ds-space-100, 4px)"
+    paddingLeft: "var(--ds-space-100, 8px)"
   },
   '&:last-child': {
     borderRight: 0,
-    paddingRight: "var(--ds-space-100, 4px)"
+    paddingRight: "var(--ds-space-100, 8px)"
   }
 });
 var baseColumns = [{
@@ -115,7 +116,8 @@ export default (function (_ref4) {
     return jsx(TableHeading, {
       key: key,
       style: {
-        width: width
+        width: width,
+        padding: padding
       }
     }, jsx(Skeleton, {
       appearance: "darkGray",