@atlaskit/smart-card 23.13.2 → 23.13.3

package/dist/es2019/view/FlexibleCard/components/blocks/action-group/index.js

@@ -6,14 +6,15 @@ import { FormattedMessage } from 'react-intl-next';
 import { css, jsx } from '@emotion/react';
 import ButtonGroup from '@atlaskit/button/button-group';
 import Tooltip from '@atlaskit/tooltip';
-import { renderActionItems } from '../utils';
 import DropdownMenu from '@atlaskit/dropdown-menu';
-import { SmartLinkSize } from '../../../../../constants';
+import { ActionName, SmartLinkSize } from '../../../../../constants';
 import Button from '@atlaskit/button/standard-button';
 import MoreIcon from '@atlaskit/icon/glyph/more';
 import { sizeToButtonSpacing } from '../../utils';
 import { tokens } from '../../../../../utils/token';
 import { messages } from '../../../../../messages';
+import { useFlexibleUiContext } from '../../../../../state/flexible-ui-context';
+import ActionGroupItem from './action-group-item';
 const styles = css`
   display: inline-flex;
   line-height: 1rem;
@@ -30,6 +31,35 @@ const styles = css`
     }
   }
 `;
+
+const renderActionItems = (items = [], size = SmartLinkSize.Medium, appearance, asDropDownItems, onActionItemClick) => items.map((item, idx) => jsx(ActionGroupItem, {
+  item: item,
+  key: idx,
+  size: size,
+  appearance: appearance,
+  asDropDownItems: asDropDownItems,
+  onActionItemClick: onActionItemClick
+}));
+
+const filterActionItems = (items = [], context) => {
+  return items.filter(item => {
+    switch (item.name) {
+      // Action that require data from the data context to render.
+      case ActionName.DownloadAction:
+        return Boolean(context === null || context === void 0 ? void 0 : context.downloadAction);
+
+      case ActionName.PreviewAction:
+        return Boolean(context === null || context === void 0 ? void 0 : context.previewAction);
+
+      case ActionName.ViewAction:
+        return Boolean(context === null || context === void 0 ? void 0 : context.viewAction);
+
+      default:
+        // Named and custom actions that user defines.
+        return Boolean(ActionName[item.name]);
+    }
+  });
+};
 /**
  * Creates a group of Action components. Accepts an array of Actions, in addition to some styling
  * preferences.
@@ -38,6 +68,7 @@ const styles = css`
  * @see Action
  */
 
+
 const ActionGroup = ({
   items = [],
   size = SmartLinkSize.Medium,
@@ -46,7 +77,10 @@ const ActionGroup = ({
   onDropdownOpenChange,
   testId
 }) => {
+  const context = useFlexibleUiContext();
   const [isOpen, setIsOpen] = useState(false);
+  const renderableActionItems = useMemo(() => filterActionItems(items, context), [context, items]);
+  const isMoreThenTwoItems = renderableActionItems.length > visibleButtonsNum;
   const onOpenChange = useCallback(attrs => {
     setIsOpen(attrs.isOpen);
 
@@ -54,46 +88,53 @@ const ActionGroup = ({
       onDropdownOpenChange(attrs.isOpen);
     }
   }, [onDropdownOpenChange]);
-  const onActionClick = useCallback(() => {
+  const onActionItemClick = useCallback(() => {
     if (isOpen) {
       onOpenChange({
         isOpen: false
       });
     }
   }, [isOpen, onOpenChange]);
-  const renderableActions = items.filter(action => renderActionItems([action]));
-  const [buttonActions, dropdownItemActions] = useMemo(() => {
-    const isMoreThenTwoItems = renderableActions && renderableActions.length > visibleButtonsNum;
-    const buttons = isMoreThenTwoItems ? renderableActions.slice(0, visibleButtonsNum - 1) : renderableActions;
-    const dropdownItems = isMoreThenTwoItems ? renderableActions.slice(visibleButtonsNum - 1) : [];
-    return [buttons, dropdownItems];
-  }, [renderableActions, visibleButtonsNum]);
-  const dropdownMenuElement = renderActionItems(dropdownItemActions, size, appearance, true, onActionClick);
-  const buttonGroupElement = renderActionItems(buttonActions, size, appearance, false, onActionClick);
-  return jsx("div", {
+  const actionButtons = useMemo(() => {
+    const actionItems = isMoreThenTwoItems ? renderableActionItems.slice(0, visibleButtonsNum - 1) : renderableActionItems;
+    return renderActionItems(actionItems, size, appearance, false, onActionItemClick);
+  }, [appearance, isMoreThenTwoItems, onActionItemClick, renderableActionItems, size, visibleButtonsNum]);
+  const moreActionDropdown = useMemo(() => {
+    const actionItems = isMoreThenTwoItems ? renderableActionItems.slice(visibleButtonsNum - 1) : [];
+
+    if (actionItems.length > 0) {
+      const spacing = sizeToButtonSpacing[size];
+      const moreIcon = jsx(MoreIcon, {
+        label: "more"
+      });
+      const formatMessage = jsx(FormattedMessage, messages.more_actions);
+      return jsx(DropdownMenu, {
+        isOpen: isOpen,
+        onOpenChange: onOpenChange,
+        trigger: ({
+          triggerRef,
+          ...props
+        }) => jsx(Tooltip, {
+          content: formatMessage,
+          hideTooltipOnClick: true,
+          testId: "action-group-more-button-tooltip",
+          tag: "span"
+        }, jsx(Button, _extends({}, props, {
+          spacing: spacing,
+          testId: "action-group-more-button",
+          iconBefore: moreIcon,
+          ref: triggerRef
+        }))),
+        testId: "action-group-dropdown"
+      }, renderActionItems(actionItems, size, appearance, true, onActionItemClick));
+    }
+
+    return null;
+  }, [appearance, isMoreThenTwoItems, isOpen, onActionItemClick, onOpenChange, renderableActionItems, size, visibleButtonsNum]);
+  return renderableActionItems.length > 0 ? jsx("div", {
     css: styles,
     className: "actions-button-group"
-  }, jsx(ButtonGroup, null, buttonGroupElement, dropdownItemActions.length > 0 && dropdownMenuElement && dropdownMenuElement.length > 0 ? jsx(DropdownMenu, {
-    isOpen: isOpen,
-    onOpenChange: onOpenChange,
-    trigger: ({
-      triggerRef,
-      ...props
-    }) => jsx(Tooltip, {
-      content: jsx(FormattedMessage, messages.more_actions),
-      hideTooltipOnClick: true,
-      testId: "action-group-more-button-tooltip",
-      tag: "span"
-    }, jsx(Button, _extends({}, props, {
-      spacing: sizeToButtonSpacing[size],
-      testId: "action-group-more-button",
-      iconBefore: jsx(MoreIcon, {
-        label: "more"
-      }),
-      ref: triggerRef
-    }))),
-    testId: "action-group-dropdown"
-  }, dropdownMenuElement) : null));
+  }, jsx(ButtonGroup, null, actionButtons, moreActionDropdown)) : null;
 };
 
 export default ActionGroup;

package/dist/es2019/view/FlexibleCard/components/blocks/utils.js

@@ -3,10 +3,10 @@ import React from 'react';
 import { css } from '@emotion/react';
 import { ElementName, SmartLinkDirection, SmartLinkSize } from '../../../../constants';
 import * as Elements from '../elements';
-import * as Actions from '../actions';
 import { isFlexibleUiElement } from '../../../../utils/flexible';
 import ActionGroup from './action-group';
-import ElementGroup from './element-group';
+import ElementGroup from './element-group'; // Determine whether the element can be display as inline/block.
+
 export const ElementDisplaySchema = {
   [ElementName.AttachmentCount]: ['inline'],
   [ElementName.AuthorGroup]: ['inline'],
@@ -106,7 +106,7 @@ const isElementDisplayValid = (name, display) => {
   return (_ElementDisplaySchema = (_ElementDisplaySchema2 = ElementDisplaySchema[name]) === null || _ElementDisplaySchema2 === void 0 ? void 0 : _ElementDisplaySchema2.includes(display)) !== null && _ElementDisplaySchema !== void 0 ? _ElementDisplaySchema : false;
 };
 
-const isJSXElementNull = children => {
+export const isJSXElementNull = children => {
   return Boolean(children.type() === null);
 };
 
@@ -150,57 +150,4 @@ export const renderElementItems = (items = [], display = 'inline') => {
   if (elements.length) {
     return elements;
   }
-};
-export const renderActionItems = (items = [], size = SmartLinkSize.Medium, appearance, asDropDownItems, onActionItemClick) => {
-  const actions = items.reduce((acc, curr, idx) => {
-    const {
-      name,
-      hideContent,
-      hideIcon,
-      onClick,
-      ...props
-    } = curr;
-    const Action = Actions[name];
-    const actionProps = { ...props
-    };
-
-    if (hideContent && !asDropDownItems) {
-      actionProps.content = '';
-    }
-
-    if (hideIcon) {
-      actionProps.icon = undefined;
-    }
-
-    if (Action) {
-      const handleOnClick = () => {
-        if (onActionItemClick) {
-          onActionItemClick();
-        }
-
-        if (onClick) {
-          onClick();
-        }
-      };
-
-      const action = /*#__PURE__*/React.createElement(Action, _extends({
-        url: '',
-        asDropDownItem: asDropDownItems,
-        size: size,
-        key: idx,
-        appearance: appearance,
-        onClick: handleOnClick
-      }, actionProps));
-
-      if (!isJSXElementNull(action)) {
-        return [...acc, action];
-      }
-    }
-
-    return acc;
-  }, []);
-
-  if (actions.length) {
-    return actions;
-  }
 };

package/dist/es2019/view/FlexibleCard/index.js

@@ -1,5 +1,5 @@
 import _extends from "@babel/runtime/helpers/extends";
-import React, { useEffect } from 'react';
+import React, { useEffect, useMemo } from 'react';
 import { SmartLinkStatus } from '../../constants';
 import Container from './components/container';
 import { FlexibleUiAnalyticsContext, FlexibleUiContext } from '../../state/flexible-ui-context';
@@ -30,7 +30,7 @@ const FlexibleCard = ({
     details
   } = cardState;
   const status = cardType;
-  const context = getContextByStatus(url, status, details, renderers);
+  const context = useMemo(() => getContextByStatus(url, status, details, renderers), [details, renderers, status, url]);
   const retry = getRetryOptions(url, status, details, onAuthorize);
   const {
     title

package/dist/es2019/view/HoverCard/components/HoverCardComponent.js

@@ -111,6 +111,28 @@ export const HoverCardComponent = ({
       hideCard();
     }
   }, [closeOnChildClick, hideCard]);
+  const content = useCallback(({
+    update
+  }) => jsx(HoverCardContent, {
+    onMouseEnter: initShowCard,
+    onMouseLeave: initHideCard,
+    analytics: analytics,
+    cardActions: linkActions,
+    cardState: linkState,
+    onActionClick: onActionClick,
+    onResolve: update,
+    renderers: renderers,
+    url: url
+  }), [analytics, initHideCard, initShowCard, linkActions, linkState, onActionClick, renderers, url]);
+  const trigger = useCallback(triggerProps => jsx("span", {
+    ref: parentSpan
+  }, jsx("span", _extends({}, triggerProps, {
+    onMouseEnter: initShowCard,
+    onMouseLeave: initHideCard,
+    onMouseMove: setMousePosition,
+    onClick: onChildClick,
+    "data-testid": "hover-card-trigger-wrapper"
+  }), children)), [children, initHideCard, initShowCard, onChildClick, setMousePosition]);
   return jsx(Popup, {
     testId: "hover-card",
     isOpen: isOpen && canOpen,
@@ -118,28 +140,8 @@ export const HoverCardComponent = ({
     placement: "bottom-start",
     offset: popupOffset.current,
     autoFocus: false,
-    content: ({
-      update
-    }) => jsx(HoverCardContent, {
-      onMouseEnter: initShowCard,
-      onMouseLeave: initHideCard,
-      analytics: analytics,
-      cardActions: linkActions,
-      cardState: linkState,
-      onActionClick: onActionClick,
-      onResolve: update,
-      renderers: renderers,
-      url: url
-    }),
-    trigger: triggerProps => jsx("span", {
-      ref: parentSpan
-    }, jsx("span", _extends({}, triggerProps, {
-      onMouseEnter: initShowCard,
-      onMouseLeave: initHideCard,
-      onMouseMove: setMousePosition,
-      onClick: onChildClick,
-      "data-testid": "hover-card-trigger-wrapper"
-    }), children)),
+    content: content,
+    trigger: trigger,
     zIndex: 511 // Temporary fix for Confluence inline comment on editor mod has z-index of 500, Jira issue view has z-index of 510
 
   });

package/dist/esm/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/smart-card",
-	"version": "23.13.2",
+	"version": "23.13.3",
 	"sideEffects": false
 }

package/dist/esm/view/FlexibleCard/components/blocks/action-group/action-group-item/index.js

@@ -0,0 +1,69 @@
+import _extends from "@babel/runtime/helpers/extends";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+var _excluded = ["name", "hideContent", "hideIcon", "onClick"];
+
+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 { jsx } from '@emotion/react';
+import React, { useCallback } from 'react';
+import * as Actions from '../../../actions';
+import { isJSXElementNull } from '../../utils';
+
+var ActionGroupItem = function ActionGroupItem(_ref) {
+  var item = _ref.item,
+      size = _ref.size,
+      appearance = _ref.appearance,
+      asDropDownItems = _ref.asDropDownItems,
+      onActionItemClick = _ref.onActionItemClick;
+
+  var name = item.name,
+      hideContent = item.hideContent,
+      hideIcon = item.hideIcon,
+      onClick = item.onClick,
+      props = _objectWithoutProperties(item, _excluded);
+
+  var handleOnClick = useCallback(function () {
+    if (onActionItemClick) {
+      onActionItemClick();
+    }
+
+    if (onClick) {
+      onClick();
+    }
+  }, [onActionItemClick, onClick]);
+  var Action = Actions[name];
+
+  if (!Action) {
+    return null;
+  }
+
+  var actionProps = _objectSpread({}, props);
+
+  if (hideContent && !asDropDownItems) {
+    actionProps.content = '';
+  }
+
+  if (hideIcon) {
+    actionProps.icon = undefined;
+  }
+
+  var action = jsx(Action, _extends({
+    url: "",
+    asDropDownItem: asDropDownItems,
+    size: size,
+    appearance: appearance,
+    onClick: handleOnClick
+  }, actionProps));
+
+  if (!isJSXElementNull(action)) {
+    return action;
+  }
+
+  return null;
+};
+
+export default ActionGroupItem;

package/dist/esm/view/FlexibleCard/components/blocks/action-group/index.js

@@ -12,15 +12,56 @@ import { FormattedMessage } from 'react-intl-next';
 import { css, jsx } from '@emotion/react';
 import ButtonGroup from '@atlaskit/button/button-group';
 import Tooltip from '@atlaskit/tooltip';
-import { renderActionItems } from '../utils';
 import DropdownMenu from '@atlaskit/dropdown-menu';
-import { SmartLinkSize } from '../../../../../constants';
+import { ActionName, SmartLinkSize } from '../../../../../constants';
 import Button from '@atlaskit/button/standard-button';
 import MoreIcon from '@atlaskit/icon/glyph/more';
 import { sizeToButtonSpacing } from '../../utils';
 import { tokens } from '../../../../../utils/token';
 import { messages } from '../../../../../messages';
+import { useFlexibleUiContext } from '../../../../../state/flexible-ui-context';
+import ActionGroupItem from './action-group-item';
 var styles = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display: inline-flex;\n  line-height: 1rem;\n  > div {\n    align-items: center;\n    button:focus {\n      // AK button removes the default browser outline on focus and apply\n      // box-shadow styling to create the outline appearance.\n      // Due to our container elements (Container/Block/ElementGroup) has\n      // overflow hidden to prevent the metadata element from leaking outside\n      // of its container, the box-shadow doesn't show properly.\n      // Invert the AK box-shadow styling.\n      box-shadow: inset 0 0 0 2px ", ";\n    }\n  }\n"])), tokens.focus);
+
+var renderActionItems = function renderActionItems() {
+  var items = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
+  var size = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : SmartLinkSize.Medium;
+  var appearance = arguments.length > 2 ? arguments[2] : undefined;
+  var asDropDownItems = arguments.length > 3 ? arguments[3] : undefined;
+  var onActionItemClick = arguments.length > 4 ? arguments[4] : undefined;
+  return items.map(function (item, idx) {
+    return jsx(ActionGroupItem, {
+      item: item,
+      key: idx,
+      size: size,
+      appearance: appearance,
+      asDropDownItems: asDropDownItems,
+      onActionItemClick: onActionItemClick
+    });
+  });
+};
+
+var filterActionItems = function filterActionItems() {
+  var items = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
+  var context = arguments.length > 1 ? arguments[1] : undefined;
+  return items.filter(function (item) {
+    switch (item.name) {
+      // Action that require data from the data context to render.
+      case ActionName.DownloadAction:
+        return Boolean(context === null || context === void 0 ? void 0 : context.downloadAction);
+
+      case ActionName.PreviewAction:
+        return Boolean(context === null || context === void 0 ? void 0 : context.previewAction);
+
+      case ActionName.ViewAction:
+        return Boolean(context === null || context === void 0 ? void 0 : context.viewAction);
+
+      default:
+        // Named and custom actions that user defines.
+        return Boolean(ActionName[item.name]);
+    }
+  });
+};
 /**
  * Creates a group of Action components. Accepts an array of Actions, in addition to some styling
  * preferences.
@@ -29,6 +70,7 @@ var styles = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["
  * @see Action
  */
 
+
 var ActionGroup = function ActionGroup(_ref) {
   var _ref$items = _ref.items,
       items = _ref$items === void 0 ? [] : _ref$items,
@@ -39,12 +81,17 @@ var ActionGroup = function ActionGroup(_ref) {
       visibleButtonsNum = _ref$visibleButtonsNu === void 0 ? 2 : _ref$visibleButtonsNu,
       onDropdownOpenChange = _ref.onDropdownOpenChange,
       testId = _ref.testId;
+  var context = useFlexibleUiContext();
 
   var _useState = useState(false),
       _useState2 = _slicedToArray(_useState, 2),
       isOpen = _useState2[0],
       setIsOpen = _useState2[1];
 
+  var renderableActionItems = useMemo(function () {
+    return filterActionItems(items, context);
+  }, [context, items]);
+  var isMoreThenTwoItems = renderableActionItems.length > visibleButtonsNum;
   var onOpenChange = useCallback(function (attrs) {
     setIsOpen(attrs.isOpen);
 
@@ -52,55 +99,55 @@ var ActionGroup = function ActionGroup(_ref) {
       onDropdownOpenChange(attrs.isOpen);
     }
   }, [onDropdownOpenChange]);
-  var onActionClick = useCallback(function () {
+  var onActionItemClick = useCallback(function () {
     if (isOpen) {
       onOpenChange({
         isOpen: false
       });
     }
   }, [isOpen, onOpenChange]);
-  var renderableActions = items.filter(function (action) {
-    return renderActionItems([action]);
-  });
+  var actionButtons = useMemo(function () {
+    var actionItems = isMoreThenTwoItems ? renderableActionItems.slice(0, visibleButtonsNum - 1) : renderableActionItems;
+    return renderActionItems(actionItems, size, appearance, false, onActionItemClick);
+  }, [appearance, isMoreThenTwoItems, onActionItemClick, renderableActionItems, size, visibleButtonsNum]);
+  var moreActionDropdown = useMemo(function () {
+    var actionItems = isMoreThenTwoItems ? renderableActionItems.slice(visibleButtonsNum - 1) : [];
+
+    if (actionItems.length > 0) {
+      var spacing = sizeToButtonSpacing[size];
+      var moreIcon = jsx(MoreIcon, {
+        label: "more"
+      });
+      var formatMessage = jsx(FormattedMessage, messages.more_actions);
+      return jsx(DropdownMenu, {
+        isOpen: isOpen,
+        onOpenChange: onOpenChange,
+        trigger: function trigger(_ref2) {
+          var triggerRef = _ref2.triggerRef,
+              props = _objectWithoutProperties(_ref2, _excluded);
+
+          return jsx(Tooltip, {
+            content: formatMessage,
+            hideTooltipOnClick: true,
+            testId: "action-group-more-button-tooltip",
+            tag: "span"
+          }, jsx(Button, _extends({}, props, {
+            spacing: spacing,
+            testId: "action-group-more-button",
+            iconBefore: moreIcon,
+            ref: triggerRef
+          })));
+        },
+        testId: "action-group-dropdown"
+      }, renderActionItems(actionItems, size, appearance, true, onActionItemClick));
+    }
 
-  var _useMemo = useMemo(function () {
-    var isMoreThenTwoItems = renderableActions && renderableActions.length > visibleButtonsNum;
-    var buttons = isMoreThenTwoItems ? renderableActions.slice(0, visibleButtonsNum - 1) : renderableActions;
-    var dropdownItems = isMoreThenTwoItems ? renderableActions.slice(visibleButtonsNum - 1) : [];
-    return [buttons, dropdownItems];
-  }, [renderableActions, visibleButtonsNum]),
-      _useMemo2 = _slicedToArray(_useMemo, 2),
-      buttonActions = _useMemo2[0],
-      dropdownItemActions = _useMemo2[1];
-
-  var dropdownMenuElement = renderActionItems(dropdownItemActions, size, appearance, true, onActionClick);
-  var buttonGroupElement = renderActionItems(buttonActions, size, appearance, false, onActionClick);
-  return jsx("div", {
+    return null;
+  }, [appearance, isMoreThenTwoItems, isOpen, onActionItemClick, onOpenChange, renderableActionItems, size, visibleButtonsNum]);
+  return renderableActionItems.length > 0 ? jsx("div", {
     css: styles,
     className: "actions-button-group"
-  }, jsx(ButtonGroup, null, buttonGroupElement, dropdownItemActions.length > 0 && dropdownMenuElement && dropdownMenuElement.length > 0 ? jsx(DropdownMenu, {
-    isOpen: isOpen,
-    onOpenChange: onOpenChange,
-    trigger: function trigger(_ref2) {
-      var triggerRef = _ref2.triggerRef,
-          props = _objectWithoutProperties(_ref2, _excluded);
-
-      return jsx(Tooltip, {
-        content: jsx(FormattedMessage, messages.more_actions),
-        hideTooltipOnClick: true,
-        testId: "action-group-more-button-tooltip",
-        tag: "span"
-      }, jsx(Button, _extends({}, props, {
-        spacing: sizeToButtonSpacing[size],
-        testId: "action-group-more-button",
-        iconBefore: jsx(MoreIcon, {
-          label: "more"
-        }),
-        ref: triggerRef
-      })));
-    },
-    testId: "action-group-dropdown"
-  }, dropdownMenuElement) : null));
+  }, jsx(ButtonGroup, null, actionButtons, moreActionDropdown)) : null;
 };
 
 export default ActionGroup;

package/dist/esm/view/FlexibleCard/components/blocks/utils.js

@@ -3,23 +3,18 @@ import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
-var _excluded = ["name"],
-    _excluded2 = ["name", "hideContent", "hideIcon", "onClick"];
+var _excluded = ["name"];
 
 var _ElementDisplaySchema, _templateObject, _templateObject2, _templateObject3, _templateObject4;
 
-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; }
-
 import React from 'react';
 import { css } from '@emotion/react';
 import { ElementName, SmartLinkDirection, SmartLinkSize } from '../../../../constants';
 import * as Elements from '../elements';
-import * as Actions from '../actions';
 import { isFlexibleUiElement } from '../../../../utils/flexible';
 import ActionGroup from './action-group';
-import ElementGroup from './element-group';
+import ElementGroup from './element-group'; // Determine whether the element can be display as inline/block.
+
 export var ElementDisplaySchema = (_ElementDisplaySchema = {}, _defineProperty(_ElementDisplaySchema, ElementName.AttachmentCount, ['inline']), _defineProperty(_ElementDisplaySchema, ElementName.AuthorGroup, ['inline']), _defineProperty(_ElementDisplaySchema, ElementName.ChecklistProgress, ['inline']), _defineProperty(_ElementDisplaySchema, ElementName.CollaboratorGroup, ['inline']), _defineProperty(_ElementDisplaySchema, ElementName.CommentCount, ['inline']), _defineProperty(_ElementDisplaySchema, ElementName.ViewCount, ['inline']), _defineProperty(_ElementDisplaySchema, ElementName.ReactCount, ['inline']), _defineProperty(_ElementDisplaySchema, ElementName.VoteCount, ['inline']), _defineProperty(_ElementDisplaySchema, ElementName.CreatedBy, ['inline']), _defineProperty(_ElementDisplaySchema, ElementName.CreatedOn, ['inline']), _defineProperty(_ElementDisplaySchema, ElementName.DueOn, ['inline']), _defineProperty(_ElementDisplaySchema, ElementName.LatestCommit, ['inline']), _defineProperty(_ElementDisplaySchema, ElementName.LinkIcon, ['inline']), _defineProperty(_ElementDisplaySchema, ElementName.ModifiedBy, ['inline']), _defineProperty(_ElementDisplaySchema, ElementName.ModifiedOn, ['inline']), _defineProperty(_ElementDisplaySchema, ElementName.Preview, ['block']), _defineProperty(_ElementDisplaySchema, ElementName.Priority, ['inline']), _defineProperty(_ElementDisplaySchema, ElementName.ProgrammingLanguage, ['inline']), _defineProperty(_ElementDisplaySchema, ElementName.Provider, ['inline']), _defineProperty(_ElementDisplaySchema, ElementName.Snippet, ['block']), _defineProperty(_ElementDisplaySchema, ElementName.SourceBranch, ['inline']), _defineProperty(_ElementDisplaySchema, ElementName.State, ['inline']), _defineProperty(_ElementDisplaySchema, ElementName.SubscriberCount, ['inline']), _defineProperty(_ElementDisplaySchema, ElementName.TargetBranch, ['inline']), _defineProperty(_ElementDisplaySchema, ElementName.Title, ['inline']), _ElementDisplaySchema);
 
 var getDirectionStyles = function getDirectionStyles(direction) {
@@ -64,7 +59,7 @@ var isElementDisplayValid = function isElementDisplayValid(name, display) {
   return (_ElementDisplaySchema2 = (_ElementDisplaySchema3 = ElementDisplaySchema[name]) === null || _ElementDisplaySchema3 === void 0 ? void 0 : _ElementDisplaySchema3.includes(display)) !== null && _ElementDisplaySchema2 !== void 0 ? _ElementDisplaySchema2 : false;
 };
 
-var isJSXElementNull = function isJSXElementNull(children) {
+export var isJSXElementNull = function isJSXElementNull(children) {
   return Boolean(children.type() === null);
 };
 
@@ -111,61 +106,4 @@ export var renderElementItems = function renderElementItems() {
   if (elements.length) {
     return elements;
   }
-};
-export var renderActionItems = function renderActionItems() {
-  var items = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
-  var size = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : SmartLinkSize.Medium;
-  var appearance = arguments.length > 2 ? arguments[2] : undefined;
-  var asDropDownItems = arguments.length > 3 ? arguments[3] : undefined;
-  var onActionItemClick = arguments.length > 4 ? arguments[4] : undefined;
-  var actions = items.reduce(function (acc, curr, idx) {
-    var name = curr.name,
-        hideContent = curr.hideContent,
-        hideIcon = curr.hideIcon,
-        onClick = curr.onClick,
-        props = _objectWithoutProperties(curr, _excluded2);
-
-    var Action = Actions[name];
-
-    var actionProps = _objectSpread({}, props);
-
-    if (hideContent && !asDropDownItems) {
-      actionProps.content = '';
-    }
-
-    if (hideIcon) {
-      actionProps.icon = undefined;
-    }
-
-    if (Action) {
-      var handleOnClick = function handleOnClick() {
-        if (onActionItemClick) {
-          onActionItemClick();
-        }
-
-        if (onClick) {
-          onClick();
-        }
-      };
-
-      var action = /*#__PURE__*/React.createElement(Action, _extends({
-        url: '',
-        asDropDownItem: asDropDownItems,
-        size: size,
-        key: idx,
-        appearance: appearance,
-        onClick: handleOnClick
-      }, actionProps));
-
-      if (!isJSXElementNull(action)) {
-        return [].concat(_toConsumableArray(acc), [action]);
-      }
-    }
-
-    return acc;
-  }, []);
-
-  if (actions.length) {
-    return actions;
-  }
 };