@atlaskit/smart-card 19.1.29 → 19.2.0

package/dist/cjs/view/InlineCard/index.js

@@ -59,6 +59,8 @@ var _ResolvingView = require("./ResolvingView");
 
 var _UnauthorisedView = require("./UnauthorisedView");
 
+var _extractors = require("@atlaskit/linking-common/extractors");
+
 var InlineCard = function InlineCard(_ref) {
   var _details$meta;
 
@@ -109,7 +111,7 @@ var InlineCard = function InlineCard(_ref) {
       }));
 
     case 'unauthorized':
-      var provider = (0, _context.extractProvider)(cardDetails);
+      var provider = (0, _extractors.extractProvider)(cardDetails);
       return /*#__PURE__*/_react.default.createElement(_UnauthorisedView.InlineCardUnauthorizedView, {
         icon: provider && provider.icon,
         url: url,
@@ -120,7 +122,7 @@ var InlineCard = function InlineCard(_ref) {
       });
 
     case 'forbidden':
-      var providerForbidden = (0, _context.extractProvider)(cardDetails);
+      var providerForbidden = (0, _extractors.extractProvider)(cardDetails);
       var cardMetadata = (_details$meta = details === null || details === void 0 ? void 0 : details.meta) !== null && _details$meta !== void 0 ? _details$meta : (0, _jsonld.getUnauthorizedJsonLd)().meta;
       var requestAccessContext = (0, _context.extractRequestAccessContext)({
         jsonLd: cardMetadata,
@@ -139,7 +141,7 @@ var InlineCard = function InlineCard(_ref) {
       });
 
     case 'not_found':
-      var providerNotFound = (0, _context.extractProvider)(cardDetails);
+      var providerNotFound = (0, _extractors.extractProvider)(cardDetails);
       return /*#__PURE__*/_react.default.createElement(_ErroredView.InlineCardErroredView, {
         url: url,
         icon: providerNotFound && providerNotFound.icon,

package/dist/es2019/constants.js

@@ -83,7 +83,7 @@ export let SmartLinkWidth;
  * When adding an element...
  * 1) Create base element if it doesn't already exist.
  *    Base element are inside src/view/FlexibleCard/components/elements.
- *    E.g. Badge,DateTime, Icon, Lozenge, etc.
+ *    E.g. Badge, DateTime, Icon, Lozenge, etc.
  * 2) Update FlexibleUiContext with the new prop for data representing
  *    the element, preferably with the same name as the element itself.
  *    (src/state/flexible-ui-context/types.ts)
@@ -111,6 +111,7 @@ export let ElementName;
   ElementName["CommentCount"] = "CommentCount";
   ElementName["CreatedBy"] = "CreatedBy";
   ElementName["CreatedOn"] = "CreatedOn";
+  ElementName["DueOn"] = "DueOn";
   ElementName["LinkIcon"] = "LinkIcon";
   ElementName["ModifiedBy"] = "ModifiedBy";
   ElementName["ModifiedOn"] = "ModifiedOn";
@@ -120,8 +121,10 @@ export let ElementName;
   ElementName["Provider"] = "Provider";
   ElementName["ReactCount"] = "ReactCount";
   ElementName["Snippet"] = "Snippet";
+  ElementName["SourceBranch"] = "SourceBranch";
   ElementName["State"] = "State";
   ElementName["SubscriberCount"] = "SubscriberCount";
+  ElementName["TargetBranch"] = "TargetBranch";
   ElementName["Title"] = "Title";
   ElementName["ViewCount"] = "ViewCount";
   ElementName["VoteCount"] = "VoteCount";

package/dist/es2019/extractors/block/index.js

@@ -1,15 +1,10 @@
-import { extractLink, extractTitle, extractTitleTextColor, extractSummary } from '../common/primitives';
+import { extractTitleTextColor, extractSummary } from '../common/primitives';
 import { extractLozenge } from '../common/lozenge';
 import { extractIcon } from '../common/icon';
-import { extractProvider } from '../common/context/extractProvider';
 import { extractCommentCount, extractProgrammingLanguage, extractSubscriberCount } from '../common/detail';
-import { extractMembers } from '../common/person/extractMembers';
-import { extractPersonAssignedTo } from '../common/person/extractPersonAssignedTo';
-import { extractPersonCreatedBy } from '../common/person/extractPersonCreatedBy';
-import { extractPersonUpdatedBy } from '../common/person/extractPersonUpdatedBy';
+import { extractLink, extractTitle, extractProvider, extractMembers, extractPersonAssignedTo, extractPersonCreatedBy, extractPersonUpdatedBy, extractImage } from '@atlaskit/linking-common/extractors';
 import { extractByline } from '../common/byline/extractByline';
 import { extractTitlePrefix } from '../common/title-prefix/extractTitlePrefix';
-import { extractImage } from '../common/preview/extractImage';
 import { extractActions } from '../common/actions/extractActions';
 import { extractPreviewAction } from '../common/actions/extractPreviewAction';
 import { extractIsTrusted } from '../common/meta/extractIsTrusted';

package/dist/es2019/extractors/common/actions/extractPreviewAction.js

@@ -1,7 +1,6 @@
 import { uiRenderSuccessEvent, uiRenderFailedEvent } from '../../../utils/analytics';
 import { extractDownloadUrl } from '../detail';
-import { extractProvider } from '../context';
-import { extractPreview } from '../preview';
+import { extractProvider, extractPreview } from '@atlaskit/linking-common/extractors';
 import { PreviewAction } from '../../../view/BlockCard';
 
 const getMetadataFromJsonLd = (jsonLd, platform) => {

package/dist/es2019/extractors/common/byline/extractByline.js

@@ -1,10 +1,7 @@
 import React from 'react';
 import { FormattedRelativeTime } from 'react-intl-next';
 import { selectUnit } from '@formatjs/intl-utils';
-import { extractPersonUpdatedBy } from '../person/extractPersonUpdatedBy';
-import { extractPersonCreatedBy } from '../person/extractPersonCreatedBy';
-import { extractDateCreated } from '../date/extractDateCreated';
-import { extractDateUpdated } from '../date/extractDateUpdated';
+import { extractDateCreated, extractDateUpdated, extractPersonCreatedBy, extractPersonUpdatedBy } from '@atlaskit/linking-common/extractors';
 export const extractByline = jsonLd => {
   const updatedAt = extractDateUpdated(jsonLd);
   const createdAt = extractDateCreated(jsonLd);

package/dist/es2019/extractors/common/context/index.js

@@ -1,3 +1 @@
-export { extractContext } from './extractContext';
-export { extractProvider } from './extractProvider';
 export { extractRequestAccessContext } from './extractAccessContext';

package/dist/es2019/extractors/common/icon/extractIcon.js

@@ -4,14 +4,13 @@ import CommitIcon from '@atlaskit/icon-object/glyph/commit/16';
 import PullRequestIcon from '@atlaskit/icon-object/glyph/pull-request/16';
 import BranchIcon from '@atlaskit/icon-object/glyph/branch/16';
 import RepoIcon from '@atlaskit/icon-object/glyph/code/16';
+import TaskIcon from '@atlaskit/icon-object/glyph/task/16';
 import { extractorPriorityMap } from './priority';
-import { extractProvider } from '../context/extractProvider';
-import { extractTitle } from '../primitives/extractTitle';
+import { extractProvider, extractUrlFromIconJsonLd, extractTitle } from '@atlaskit/linking-common/extractors';
 import { extractFileFormat } from './extractFileFormat';
 import { extractIconFromDocument } from './extractIconFromDocument';
 import { extractIconFromTask } from './extractIconFromTask';
 import { extractTaskType } from '../lozenge/extractTaskType';
-import { extractUrlFromIconJsonLd } from '../utils';
 export const extractIcon = (jsonLd, priority = 'type') => {
   const type = jsonLd['@type'];
   const opts = {
@@ -43,6 +42,11 @@ const extractIconByType = (type, opts) => {
     case 'atlassian:UndefinedLink':
       return extractIconFromDocument(type, opts);
 
+    case 'atlassian:Goal':
+      return opts.icon || /*#__PURE__*/React.createElement(TaskIcon, {
+        label: opts.title || 'goal'
+      });
+
     case 'atlassian:Project':
       return opts.icon || /*#__PURE__*/React.createElement(ProjectIcon, {
         label: opts.title || 'project',

package/dist/es2019/extractors/common/icon/priority.js

@@ -6,6 +6,7 @@ export const extractorPriorityMap = {
   'schema:BlogPosting': 10,
   'schema:SpreadsheetDigitalDocument': 10,
   'schema:PresentationDigitalDocument': 10,
+  'atlassian:Goal': 10,
   'atlassian:Task': 10,
   'atlassian:Project': 10,
   'atlassian:Template': 10,

package/dist/es2019/extractors/common/lozenge/extractLozenge.js

@@ -1,7 +1,7 @@
 import { extractState } from './extractState';
 import { extractTag } from './extractTag';
 import { extractTaskStatus } from './extractTaskStatus';
-import { extractType } from '../primitives/extractType';
+import { extractType } from '@atlaskit/linking-common/extractors';
 import { extractTaskType } from './extractTaskType';
 const DOC_TYPES = ['schema:BlogPosting', 'schema:TextDigitalDocument', 'schema:DigitalDocument', 'schema:PresentationDigitalDocument', 'schema:SpreadsheetDigitalDocument'];
 export const extractLozenge = jsonLd => {
@@ -20,6 +20,10 @@ export const extractLozenge = jsonLd => {
       const jsonLdDocument = jsonLd;
       const lozengeFromState = extractState(jsonLdDocument);
       return lozengeFromState;
+    } else if (type.includes('atlassian:Goal')) {
+      const jsonLdProject = jsonLd;
+      const lozengeFromState = extractState(jsonLdProject);
+      return lozengeFromState;
     } else if (type.includes('atlassian:Project')) {
       const jsonLdProject = jsonLd;
       const lozengeFromState = extractState(jsonLdProject);

package/dist/es2019/extractors/common/lozenge/extractState.js

@@ -16,14 +16,14 @@ export const extractState = jsonLd => {
       if (state.name) {
         return {
           text: state.name,
-          appearance: 'default'
+          appearance: state.appearance || 'default'
         };
       }
     } else if (state['@type'] === 'Object') {
       if (state.name) {
         return {
           text: state.name,
-          appearance: 'default'
+          appearance: state.appearance || 'default'
         };
       }
     }

package/dist/es2019/extractors/common/lozenge/extractTaskType.js

@@ -1,4 +1,4 @@
-import { extractUrlFromIconJsonLd } from '../utils';
+import { extractUrlFromIconJsonLd } from '@atlaskit/linking-common/extractors';
 export const extractTaskType = jsonLd => {
   // TODO: Remove once Jira migrate to the correct type.
   const taskType = jsonLd['atlassian:taskType'] || jsonLd.taskType;

package/dist/es2019/extractors/common/primitives/index.js

@@ -1,4 +1,2 @@
-export { extractLink } from './extractLink';
 export { extractSummary } from './extractSummary';
-export { extractTitle } from './extractTitle';
 export { extractTitleTextColor } from './extractTitleTextColor';

package/dist/es2019/extractors/embed/index.js

@@ -1,6 +1,4 @@
-import { extractLink, extractTitle } from '../common/primitives';
-import { extractProvider } from '../common/context';
-import { extractPreview } from '@atlaskit/linking-common';
+import { extractLink, extractTitle, extractProvider, extractPreview } from '@atlaskit/linking-common/extractors';
 import { extractIsTrusted } from '../common/meta/extractIsTrusted';
 
 const extractEmbedPreview = (jsonLd, platform) => {

package/dist/es2019/extractors/flexible/collaboratorGroup/index.js

@@ -1,4 +1,4 @@
-import { extractPersonFromJsonLd } from '../../common/utils';
+import { extractPersonFromJsonLd } from '@atlaskit/linking-common/extractors';
 // Temporary Extractor until https://product-fabric.atlassian.net/browse/EDM-2652 is ready
 export const extractPersonsUpdatedBy = jsonLd => {
   const updatedBy = jsonLd['atlassian:updatedBy'];

package/dist/es2019/extractors/flexible/extract-preview.js

@@ -1,4 +1,4 @@
-import { extractImage } from '../common/preview';
+import { extractImage } from '@atlaskit/linking-common/extractors';
 import { MediaType } from '../../constants';
 
 const extractPreview = data => {

package/dist/es2019/extractors/flexible/extract-priority.js

@@ -1,5 +1,5 @@
 import { IconType } from '../../constants';
-import { extractUrlFromIconJsonLd } from '../common/utils';
+import { extractUrlFromIconJsonLd } from '@atlaskit/linking-common/extractors';
 const priorityMapper = {
   blocker: IconType.PriorityBlocker,
   critical: IconType.PriorityCritical,

package/dist/es2019/extractors/flexible/icon/extract-jsonld-data-icon.js

@@ -5,7 +5,7 @@ import extractJiraTaskIcon from './extract-jira-task-icon';
 import extractProviderIcon from './extract-provider-icon';
 import extractUrlIcon from './extract-url-icon';
 import { extractTaskType } from '../../common/lozenge';
-import { extractTitle } from '../../common/primitives';
+import { extractTitle } from '@atlaskit/linking-common/extractors';
 import { extractorPriorityMap as priorityMap } from '../../common/icon/priority';
 import { IconType } from '../../../constants';
 
@@ -82,6 +82,12 @@ const extractJsonldDataIcon = data => {
         label: taskLabel
       };
 
+    case 'atlassian:Goal':
+      return urlIcon || {
+        icon: IconType.Task,
+        label: label || 'Goal'
+      };
+
     case 'atlassian:Project':
       return urlIcon || {
         icon: IconType.Project,

package/dist/es2019/extractors/flexible/icon/extract-provider-icon.js

@@ -1,7 +1,7 @@
 import { CONFLUENCE_GENERATOR_ID, JIRA_GENERATOR_ID } from '../../constants';
 import { IconType } from '../../../constants';
 import extractUrlIcon from './extract-url-icon';
-import { extractTitle } from '../../common/primitives';
+import { extractTitle } from '@atlaskit/linking-common/extractors';
 
 const extractProviderIcon = data => {
   if (!data) {

package/dist/es2019/extractors/flexible/icon/extract-url-icon.js

@@ -1,4 +1,4 @@
-import { extractUrlFromIconJsonLd } from '../../common/utils';
+import { extractUrlFromIconJsonLd } from '@atlaskit/linking-common/extractors';
 
 const extractUrlIcon = (icon, label) => {
   const url = icon && extractUrlFromIconJsonLd(icon);

package/dist/es2019/extractors/flexible/index.js

@@ -1,11 +1,9 @@
-import { extractLink, extractSummary, extractTitle } from '../common/primitives';
+import { extractSummary } from '../common/primitives';
 import { extractLozenge } from '../common/lozenge';
 import { extractLinkIcon } from './icon';
-import { extractCommentCount, extractCreatedBy, extractModifiedBy, extractProgrammingLanguage, extractSubscriberCount, extractViewCount, extractReactCount, extractVoteCount } from './utils';
-import { extractPersonCreatedBy } from '../common/person';
+import { extractCommentCount, extractCreatedBy, extractModifiedBy, extractProgrammingLanguage, extractSubscriberCount, extractViewCount, extractReactCount, extractVoteCount, extractSourceBranch, extractTargetBranch, extractDueOn } from './utils';
 import { extractPersonsUpdatedBy } from './collaboratorGroup';
-import { extractDateUpdated } from '../common/date/extractDateUpdated';
-import { extractDateCreated } from '../common/date/extractDateCreated';
+import { extractPersonCreatedBy, extractLink, extractTitle, extractDateUpdated, extractDateCreated } from '@atlaskit/linking-common/extractors';
 import extractPriority from './extract-priority';
 import extractProviderIcon from './icon/extract-provider-icon';
 import extractPreview from './extract-preview';
@@ -27,19 +25,22 @@ const extractFlexibleUiContext = (response, renderers) => {
     voteCount: extractVoteCount(data),
     createdBy: extractCreatedBy(data),
     createdOn: extractDateCreated(data),
+    dueOn: extractDueOn(data),
+    latestCommit: extractLatestCommit(data),
     linkIcon: extractLinkIcon(response, renderers),
     modifiedBy: extractModifiedBy(data),
     modifiedOn: extractDateUpdated(data),
     preview: extractPreview(data),
     priority: extractPriority(data),
+    provider: extractProviderIcon(data),
     programmingLanguage: extractProgrammingLanguage(data),
     snippet: extractSummary(data) || undefined,
     // Explicitly set here to remove an empty string
+    sourceBranch: extractSourceBranch(data),
     state: extractLozenge(data),
     subscriberCount: extractSubscriberCount(data),
+    targetBranch: extractTargetBranch(data),
     title: extractTitle(data) || url,
-    provider: extractProviderIcon(data),
-    latestCommit: extractLatestCommit(data),
     url
   };
 };

package/dist/es2019/extractors/flexible/utils.js

@@ -1,10 +1,17 @@
-import { extractPersonCreatedBy, extractPersonUpdatedBy } from '../common/person';
+import { extractPersonCreatedBy, extractPersonUpdatedBy } from '@atlaskit/linking-common/extractors';
+
+const extractLinkName = link => {
+  if (link && typeof link === 'object' && link['@type'] === 'Link') {
+    return link.name;
+  }
+};
 
 const extractValue = (data, key) => {
   return data === null || data === void 0 ? void 0 : data[key];
 };
 
 export const extractCommentCount = data => extractValue(data, 'schema:commentCount');
+export const extractDueOn = data => extractValue(data, 'endTime');
 export const extractViewCount = data => extractValue(data, 'atlassian:viewCount');
 export const extractReactCount = data => extractValue(data, 'atlassian:reactCount');
 export const extractVoteCount = data => extractValue(data, 'atlassian:voteCount');
@@ -23,4 +30,6 @@ export const extractModifiedBy = data => {
   }
 };
 export const extractProgrammingLanguage = data => extractValue(data, 'schema:programmingLanguage');
-export const extractSubscriberCount = data => extractValue(data, 'atlassian:subscriberCount');
+export const extractSourceBranch = data => extractLinkName(data['atlassian:mergeSource']);
+export const extractSubscriberCount = data => extractValue(data, 'atlassian:subscriberCount');
+export const extractTargetBranch = data => extractLinkName(data['atlassian:mergeDestination']);

package/dist/es2019/extractors/hover/extractMetadata.js

@@ -8,11 +8,12 @@ const elementNamesToItems = elementNames => {
 };
 
 export const extractMetadata = jsonLd => {
-  var _jsonLd$metadata, _metadata$primary, _metadata$secondary;
+  var _jsonLd$metadata, _metadata$primary, _metadata$secondary, _metadata$subtitle;
 
   const metadata = (_jsonLd$metadata = jsonLd.metadata) !== null && _jsonLd$metadata !== void 0 ? _jsonLd$metadata : [];
   return {
     primary: elementNamesToItems((_metadata$primary = metadata.primary) !== null && _metadata$primary !== void 0 ? _metadata$primary : []),
-    secondary: elementNamesToItems((_metadata$secondary = metadata.secondary) !== null && _metadata$secondary !== void 0 ? _metadata$secondary : [])
+    secondary: elementNamesToItems((_metadata$secondary = metadata.secondary) !== null && _metadata$secondary !== void 0 ? _metadata$secondary : []),
+    subtitle: elementNamesToItems((_metadata$subtitle = metadata.subtitle) !== null && _metadata$subtitle !== void 0 ? _metadata$subtitle : [])
   };
 };

package/dist/es2019/extractors/inline/index.js

@@ -1,8 +1,8 @@
-import { extractLink, extractTitle, extractTitleTextColor } from '../common/primitives';
+import { extractTitleTextColor } from '../common/primitives';
 import { extractLozenge } from '../common/lozenge';
 import { extractIcon } from '../common/icon';
 import { extractTitlePrefix } from '../common/title-prefix';
-import { extractProvider } from '../common/context';
+import { extractLink, extractTitle, extractProvider } from '@atlaskit/linking-common/extractors';
 import { CONFLUENCE_GENERATOR_ID, JIRA_GENERATOR_ID } from '../constants';
 export const extractInlineIcon = jsonLd => {
   const provider = extractProvider(jsonLd);

package/dist/es2019/version.json

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

package/dist/es2019/view/FlexibleCard/components/blocks/block/index.js

@@ -1,7 +1,7 @@
 /** @jsx jsx */
 import React from 'react';
 import { css, jsx } from '@emotion/core';
-import { SmartLinkDirection, SmartLinkSize } from '../../../../../constants';
+import { ElementName, SmartLinkDirection, SmartLinkSize } from '../../../../../constants';
 import { getBaseStyles, getGapSize, renderChildren } from '../utils';
 
 const getBlockStyles = (direction, size) => css`
@@ -11,6 +11,16 @@ const getBlockStyles = (direction, size) => css`
     content: '•';
     margin-right: ${getGapSize(size)}rem;
   }
+  // Pull request elements: source branch → target branch
+  [data-smart-element='${ElementName.SourceBranch}']
+    + [data-smart-element='${ElementName.TargetBranch}']:before {
+    content: '→';
+  }
+  // Pull request elements: target branch ← source branch
+  [data-smart-element='${ElementName.TargetBranch}']
+    + [data-smart-element='${ElementName.SourceBranch}']:before {
+    content: '←';
+  }
 `;
 /**
  * A block represents a collection of elements and actions that are arranged

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

@@ -16,18 +16,21 @@ export const ElementDisplaySchema = {
   [ElementName.VoteCount]: ['inline'],
   [ElementName.CreatedBy]: ['inline'],
   [ElementName.CreatedOn]: ['inline'],
+  [ElementName.DueOn]: ['inline'],
+  [ElementName.LatestCommit]: ['inline'],
   [ElementName.LinkIcon]: ['inline'],
   [ElementName.ModifiedBy]: ['inline'],
   [ElementName.ModifiedOn]: ['inline'],
   [ElementName.Preview]: ['block'],
   [ElementName.Priority]: ['inline'],
   [ElementName.ProgrammingLanguage]: ['inline'],
+  [ElementName.Provider]: ['inline'],
   [ElementName.Snippet]: ['block'],
+  [ElementName.SourceBranch]: ['inline'],
   [ElementName.State]: ['inline'],
   [ElementName.SubscriberCount]: ['inline'],
-  [ElementName.Title]: ['inline'],
-  [ElementName.Provider]: ['inline'],
-  [ElementName.LatestCommit]: ['inline']
+  [ElementName.TargetBranch]: ['inline'],
+  [ElementName.Title]: ['inline']
 };
 
 const getDirectionStyles = direction => {

package/dist/es2019/view/FlexibleCard/components/elements/avatar-group/index.js

@@ -43,6 +43,7 @@ const getStyles = size => {
 const AvatarGroup = ({
   items = [],
   maxCount = MAX_COUNT,
+  name,
   overrideCss,
   size = SmartLinkSize.Medium,
   testId = 'smart-element-avatar-group'
@@ -54,6 +55,7 @@ const AvatarGroup = ({
   return jsx("span", {
     css: [getStyles(size), overrideCss],
     "data-fit-to-content": true,
+    "data-smart-element": name,
     "data-smart-element-avatar-group": true,
     "data-testid": testId
   }, jsx(AtlaskitAvatarGroup, {

package/dist/es2019/view/FlexibleCard/components/elements/badge/index.js

@@ -93,6 +93,7 @@ const renderImageIcon = (url, testId) => {
 const Badge = ({
   icon,
   label,
+  name,
   overrideCss,
   testId = 'smart-element-badge',
   url
@@ -107,6 +108,7 @@ const Badge = ({
   return jsx("span", {
     css: [badgeStyles, overrideCss],
     "data-fit-to-content": true,
+    "data-smart-element": name,
     "data-smart-element-badge": true,
     "data-testid": testId
   }, jsx("span", {

package/dist/es2019/view/FlexibleCard/components/elements/date-time/index.js

@@ -34,6 +34,7 @@ const typeToDescriptorMap = {
 
 const DateTime = ({
   date,
+  name,
   overrideCss,
   type,
   testId = 'smart-element-date-time',
@@ -73,6 +74,7 @@ const DateTime = ({
   return jsx("span", {
     css: [styles, overrideCss],
     "data-separator": true,
+    "data-smart-element": name,
     "data-smart-element-date-time": true,
     "data-testid": testId
   }, text ? `${text} ${context}` : jsx(FormattedMessage, _extends({}, typeToDescriptorMap[type][typeVariant], {

package/dist/es2019/view/FlexibleCard/components/elements/icon/index.js

@@ -77,6 +77,7 @@ const renderImageIcon = (defaultIcon, icon, url, testId) => {
 const Icon = ({
   icon,
   label = 'Link',
+  name,
   position = SmartLinkPosition.Top,
   overrideCss,
   render,
@@ -94,6 +95,7 @@ const Icon = ({
   return jsx("div", {
     css: [styles, renderStyles, overrideCss],
     "data-fit-to-content": true,
+    "data-smart-element": name,
     "data-smart-element-icon": true,
     "data-testid": testId
   }, element);

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

@@ -33,6 +33,12 @@ export const CreatedOn = createElement(ElementName.CreatedOn);
  */
 
 export const CreatedBy = createElement(ElementName.CreatedBy);
+/**
+ * Creates a DueOn Lozenge element using the data from dueOn in the Flexible UI Context.
+ * @see Lozenge
+ */
+
+export const DueOn = createElement(ElementName.DueOn);
 /**
  * Creates an element that contains Last Commit hash
  */
@@ -92,6 +98,12 @@ export const ReactCount = createElement(ElementName.ReactCount);
  */
 
 export const Snippet = createElement(ElementName.Snippet);
+/**
+ * Creates a SourceBranch Text element using the data from sourceBranch in the Flexible UI Context.
+ * @see Text
+ */
+
+export const SourceBranch = createElement(ElementName.SourceBranch);
 /**
  * Creates a State Lozenge element using the data from State in the Flexible UI Context.
  * @see Lozenge
@@ -104,6 +116,12 @@ export const State = createElement(ElementName.State);
  */
 
 export const SubscriberCount = createElement(ElementName.SubscriberCount);
+/**
+ * Creates a TargetBranch Text element using the data from targetBranch in the Flexible UI Context.
+ * @see Text
+ */
+
+export const TargetBranch = createElement(ElementName.TargetBranch);
 /**
  * Creates a Title Link element using the data from Title in the Flexible UI Context.
  * This represents the main link text within the Smart Link.

package/dist/es2019/view/FlexibleCard/components/elements/link/index.js

@@ -81,6 +81,7 @@ const withTooltip = (trigger, content, testId) => jsx(Tooltip, {
 const Link = ({
   hideTooltip,
   maxLines = DEFAULT_MAX_LINES,
+  name,
   overrideCss,
   size = SmartLinkSize.Medium,
   testId = 'smart-element-link',
@@ -93,6 +94,7 @@ const Link = ({
   const hasSpace = useMemo(() => text ? hasWhiteSpace(text) : false, [text]);
   const anchor = jsx("a", {
     css: [getAnchorStyles(size, theme, getMaxLines(maxLines), hasSpace), overrideCss],
+    "data-smart-element": name,
     "data-smart-element-link": true,
     "data-testid": testId,
     onClick: onClick,

package/dist/es2019/view/FlexibleCard/components/elements/lozenge/index.js

@@ -15,6 +15,7 @@ const styles = css`
 
 const Lozenge = ({
   appearance = 'default',
+  name,
   overrideCss,
   text,
   testId = 'smart-element-lozenge'
@@ -26,6 +27,7 @@ const Lozenge = ({
   return jsx("span", {
     css: [styles, overrideCss],
     "data-fit-to-content": true,
+    "data-smart-element": name,
     "data-smart-element-lozenge": true,
     "data-testid": testId
   }, jsx(AtlaskitLozenge, {

package/dist/es2019/view/FlexibleCard/components/elements/media/index.js

@@ -55,6 +55,7 @@ const styles = css`
  */
 
 const Media = ({
+  name,
   overrideCss,
   testId = 'smart-element-media',
   type,
@@ -66,6 +67,7 @@ const Media = ({
 
   return jsx("div", {
     css: [styles, overrideCss],
+    "data-smart-element": name,
     "data-smart-element-media": true,
     "data-testid": testId
   }, jsx(ImageIcon, {

package/dist/es2019/view/FlexibleCard/components/elements/text/index.js

@@ -22,6 +22,7 @@ const Text = ({
   content,
   maxLines = 1,
   message,
+  name,
   overrideCss,
   testId = 'smart-element-text'
 }) => {
@@ -32,6 +33,7 @@ const Text = ({
   return jsx("span", {
     css: [getStyles(maxLines), overrideCss],
     "data-separator": true,
+    "data-smart-element": name,
     "data-smart-element-text": true,
     "data-testid": testId
   }, getFormattedMessage(message) || content);