@atlaskit/smart-card 26.5.9 → 26.5.11

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @atlaskit/smart-card
 
+## 26.5.11
+
+### Patch Changes
+
+- [`0dd86b5573c`](https://bitbucket.org/atlassian/atlassian-frontend/commits/0dd86b5573c) - Small refactoring to move lozenge action to lozenge element
+
+## 26.5.10
+
+### Patch Changes
+
+- [`70f573b2c44`](https://bitbucket.org/atlassian/atlassian-frontend/commits/70f573b2c44) - Internal change to use space tokens for spacing properties. There is no visual change.
+
 ## 26.5.9
 
 ### Patch Changes

package/dist/cjs/version.json

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

package/dist/cjs/view/EmbedCard/views/UnresolvedView.js

@@ -12,6 +12,7 @@ var _constants = require("@atlaskit/theme/constants");
 var _reactIntlNext = require("react-intl-next");
 var _messages = require("../../../messages");
 var _utils = require("../../common/utils");
+/* eslint-disable @atlaskit/design-system/ensure-design-token-usage-spacing */
 /** @jsx jsx */
 
 var EmbedCardUnresolvedView = function EmbedCardUnresolvedView(_ref) {

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

@@ -9,7 +9,7 @@ var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/hel
 var _react = _interopRequireDefault(require("react"));
 var _react2 = require("@emotion/react");
 var _lozenge = _interopRequireDefault(require("@atlaskit/lozenge"));
-var _lozengeAction = _interopRequireDefault(require("../../common/lozenge-action"));
+var _lozengeAction = _interopRequireDefault(require("./lozenge-action"));
 var _flexibleUiContext = require("../../../../../state/flexible-ui-context");
 var _templateObject;
 /** @jsx jsx */

package/dist/cjs/view/FlexibleCard/components/{common → elements/lozenge}/lozenge-action/index.js

@@ -18,13 +18,13 @@ var _lozengeActionTrigger = _interopRequireDefault(require("./lozenge-action-tri
 var _lozengeActionError = _interopRequireDefault(require("./lozenge-action-error"));
 var _errorBoundary = _interopRequireDefault(require("./error-boundary"));
 var _styled = require("./styled");
-var _useInvoke = _interopRequireDefault(require("../../../../../state/hooks/use-invoke"));
-var _extractLozengeActionItems = _interopRequireDefault(require("../../../../../extractors/action/extract-lozenge-action-items"));
-var _createStatusUpdateRequest = _interopRequireDefault(require("../../../../../utils/actions/create-status-update-request"));
-var _useResolve = _interopRequireDefault(require("../../../../../state/hooks/use-resolve"));
+var _useInvoke = _interopRequireDefault(require("../../../../../../state/hooks/use-invoke"));
+var _extractLozengeActionItems = _interopRequireDefault(require("../../../../../../extractors/action/extract-lozenge-action-items"));
+var _createStatusUpdateRequest = _interopRequireDefault(require("../../../../../../utils/actions/create-status-update-request"));
+var _useResolve = _interopRequireDefault(require("../../../../../../state/hooks/use-resolve"));
 var _types = require("./lozenge-action-error/types");
-var _flexibleUiContext = require("../../../../../state/flexible-ui-context");
-var _analytics = require("../../../../../utils/analytics/analytics");
+var _flexibleUiContext = require("../../../../../../state/flexible-ui-context");
+var _analytics = require("../../../../../../utils/analytics/analytics");
 var _lozengeActionAnalytics = require("./lozenge-action-analytics");
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }

package/dist/cjs/view/FlexibleCard/components/{common → elements/lozenge}/lozenge-action/lozenge-action-analytics.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.validationUpdateErrorAnalyticsPayload = exports.unknownUpdateErrorAnalyticsPayload = exports.unknownLoadErrorAnalyticsPayload = exports.permissionLoadErrorAnalyticsPayload = void 0;
-var _analytics = require("../../../../../utils/analytics/analytics");
+var _analytics = require("../../../../../../utils/analytics/analytics");
 var unknownLoadErrorAnalyticsPayload = {
   smartLinkActionType: _analytics.TrackQuickActionType.StatusUpdate,
   reason: _analytics.TrackQuickActionFailureReason.UnknownError,

package/dist/cjs/view/FlexibleCard/components/{common → elements/lozenge}/lozenge-action/lozenge-action-error/index.js

@@ -13,11 +13,11 @@ var _dropdownMenu = require("@atlaskit/dropdown-menu");
 var _colors = require("@atlaskit/theme/colors");
 var _error = _interopRequireDefault(require("@atlaskit/icon/glyph/error"));
 var _styled = require("./styled");
-var _utils = require("../../../utils");
-var _messages = require("../../../../../../messages");
-var _flexibleUiContext = require("../../../../../../state/flexible-ui-context");
-var _utils2 = require("../../../../../EmbedModal/utils");
-var _useResolve = _interopRequireDefault(require("../../../../../../state/hooks/use-resolve"));
+var _utils = require("../../../../utils");
+var _messages = require("../../../../../../../messages");
+var _flexibleUiContext = require("../../../../../../../state/flexible-ui-context");
+var _utils2 = require("../../../../../../EmbedModal/utils");
+var _useResolve = _interopRequireDefault(require("../../../../../../../state/hooks/use-resolve"));
 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) { (0, _defineProperty2.default)(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 */
 var MAX_LINE_NUMBER = 8;

package/dist/cjs/view/FlexibleCard/components/{common → elements/lozenge}/lozenge-action/lozenge-action-error/styled.js

@@ -8,7 +8,7 @@ exports.textStyles = exports.linkStyles = exports.dropdownItemGroupStyles = expo
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
 var _react = require("@emotion/react");
 var _colors = require("@atlaskit/theme/colors");
-var _utils = require("../../../utils");
+var _utils = require("../../../../utils");
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
 var dropdownItemGroupStyles = (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  button {\n    width: 220px;\n\n    &:hover {\n      background-color: inherit;\n      cursor: default;\n    }\n  }\n"])));
 exports.dropdownItemGroupStyles = dropdownItemGroupStyles;

package/dist/cjs/view/FlexibleCard/components/{common → elements/lozenge}/lozenge-action/lozenge-action-error/types.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.LozengeActionErrorMessages = void 0;
-var _messages = require("../../../../../../messages");
+var _messages = require("../../../../../../../messages");
 var LozengeActionErrorMessages = {
   noData: {
     descriptor: _messages.messages['status_change_permission_error']

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

@@ -27,10 +27,12 @@ var Shimmer = function Shimmer(_ref) {
   var testId = _ref.testId;
   var skeletonCustomStyles = {
     position: 'absolute',
+    // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage-spacing
     top: '50%',
+    // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage-spacing
     left: '50%',
     transform: 'translate(-50%, -50%)',
-    marginRight: 4
+    marginRight: "var(--ds-space-050, 4px)"
   };
   return /*#__PURE__*/_react.default.createElement(_linkingCommon.Skeleton, {
     width: 14,

package/dist/cjs/view/common/Metadata.js

@@ -7,7 +7,6 @@ Object.defineProperty(exports, "__esModule", {
 exports.Metadata = void 0;
 var _react = require("@emotion/react");
 var _tooltip = _interopRequireDefault(require("@atlaskit/tooltip"));
-var _utils = require("./utils");
 var _colors = require("@atlaskit/theme/colors");
 /** @jsx jsx */
 
@@ -21,8 +20,8 @@ var Metadata = function Metadata(_ref) {
     metadataIcon = (0, _react.jsx)("img", {
       src: iconUrl,
       css: {
-        width: (0, _utils.gs)(1),
-        height: (0, _utils.gs)(1)
+        width: "var(--ds-space-100, 8px)",
+        height: "var(--ds-space-100, 8px)"
       }
     });
   }
@@ -30,14 +29,14 @@ var Metadata = function Metadata(_ref) {
     css: {
       display: 'flex',
       alignItems: 'center',
-      marginRight: (0, _utils.gs)(0.5)
+      marginRight: "var(--ds-space-050, 4px)"
     }
   }, metadataIcon, (0, _react.jsx)("span", {
     css: {
-      fontSize: (0, _utils.gs)(1.5),
+      fontSize: "var(--ds-space-150, 12px)",
       color: "".concat("var(--ds-text-subtlest, ".concat(_colors.N300, ")")),
-      marginRight: (0, _utils.gs)(0.5),
-      marginLeft: '2px'
+      marginRight: "var(--ds-space-050, 4px)",
+      marginLeft: "var(--ds-space-025, 2px)"
     }
   }, text));
   if (tooltip) {

package/dist/es2019/version.json

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

package/dist/es2019/view/EmbedCard/views/UnresolvedView.js

@@ -1,4 +1,5 @@
 import _extends from "@babel/runtime/helpers/extends";
+/* eslint-disable @atlaskit/design-system/ensure-design-token-usage-spacing */
 /** @jsx jsx */
 import { jsx } from '@emotion/react';
 import Button from '@atlaskit/button/custom-theme-button';

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

@@ -2,7 +2,7 @@
 import React from 'react';
 import { css, jsx } from '@emotion/react';
 import AtlaskitLozenge from '@atlaskit/lozenge';
-import LozengeAction from '../../common/lozenge-action';
+import LozengeAction from './lozenge-action';
 import { useFlexibleUiOptionContext } from '../../../../../state/flexible-ui-context';
 const styles = css`
   display: inline-flex;

package/dist/es2019/view/FlexibleCard/components/{common → elements/lozenge}/lozenge-action/index.js

@@ -8,13 +8,13 @@ import LozengeActionTrigger from './lozenge-action-trigger';
 import LozengeActionError from './lozenge-action-error';
 import withErrorBoundary from './error-boundary';
 import { dropdownItemGroupStyles } from './styled';
-import useInvoke from '../../../../../state/hooks/use-invoke';
-import extractLozengeActionItems from '../../../../../extractors/action/extract-lozenge-action-items';
-import createStatusUpdateRequest from '../../../../../utils/actions/create-status-update-request';
-import useResolve from '../../../../../state/hooks/use-resolve';
+import useInvoke from '../../../../../../state/hooks/use-invoke';
+import extractLozengeActionItems from '../../../../../../extractors/action/extract-lozenge-action-items';
+import createStatusUpdateRequest from '../../../../../../utils/actions/create-status-update-request';
+import useResolve from '../../../../../../state/hooks/use-resolve';
 import { LozengeActionErrorMessages } from './lozenge-action-error/types';
-import { useFlexibleUiAnalyticsContext } from '../../../../../state/flexible-ui-context';
-import { TrackQuickActionType } from '../../../../../utils/analytics/analytics';
+import { useFlexibleUiAnalyticsContext } from '../../../../../../state/flexible-ui-context';
+import { TrackQuickActionType } from '../../../../../../utils/analytics/analytics';
 import { permissionLoadErrorAnalyticsPayload, unknownLoadErrorAnalyticsPayload, unknownUpdateErrorAnalyticsPayload, validationUpdateErrorAnalyticsPayload } from './lozenge-action-analytics';
 const validateItems = (items = [], text) => {
   return items.filter(item => item.text !== text);

package/dist/es2019/view/FlexibleCard/components/{common → elements/lozenge}/lozenge-action/lozenge-action-analytics.js

@@ -1,4 +1,4 @@
-import { TrackQuickActionFailureReason, TrackQuickActionType } from '../../../../../utils/analytics/analytics';
+import { TrackQuickActionFailureReason, TrackQuickActionType } from '../../../../../../utils/analytics/analytics';
 export const unknownLoadErrorAnalyticsPayload = {
   smartLinkActionType: TrackQuickActionType.StatusUpdate,
   reason: TrackQuickActionFailureReason.UnknownError,

package/dist/es2019/view/FlexibleCard/components/{common → elements/lozenge}/lozenge-action/lozenge-action-error/index.js

@@ -6,11 +6,11 @@ import { DropdownItem, DropdownItemGroup } from '@atlaskit/dropdown-menu';
 import { R50, R500 } from '@atlaskit/theme/colors';
 import ErrorIcon from '@atlaskit/icon/glyph/error';
 import { dropdownItemGroupStyles, contentStyles, linkStyles, textStyles } from './styled';
-import { getFormattedMessage } from '../../../utils';
-import { messages } from '../../../../../../messages';
-import { useFlexibleUiAnalyticsContext } from '../../../../../../state/flexible-ui-context';
-import { openPreviewModal } from '../../../../../EmbedModal/utils';
-import useResolve from '../../../../../../state/hooks/use-resolve';
+import { getFormattedMessage } from '../../../../utils';
+import { messages } from '../../../../../../../messages';
+import { useFlexibleUiAnalyticsContext } from '../../../../../../../state/flexible-ui-context';
+import { openPreviewModal } from '../../../../../../EmbedModal/utils';
+import useResolve from '../../../../../../../state/hooks/use-resolve';
 const MAX_LINE_NUMBER = 8;
 const LozengeActionError = ({
   errorMessage,

package/dist/es2019/view/FlexibleCard/components/{common → elements/lozenge}/lozenge-action/lozenge-action-error/styled.js

@@ -1,6 +1,6 @@
 import { css } from '@emotion/react';
 import { N800 } from '@atlaskit/theme/colors';
-import { getTruncateStyles } from '../../../utils';
+import { getTruncateStyles } from '../../../../utils';
 export const dropdownItemGroupStyles = css`
   button {
     width: 220px;

package/dist/es2019/view/FlexibleCard/components/{common → elements/lozenge}/lozenge-action/lozenge-action-error/types.js

@@ -1,4 +1,4 @@
-import { messages } from '../../../../../../messages';
+import { messages } from '../../../../../../../messages';
 export const LozengeActionErrorMessages = {
   noData: {
     descriptor: messages['status_change_permission_error']

package/dist/es2019/view/InlineCard/Icon.js

@@ -30,10 +30,12 @@ export const Shimmer = ({
 }) => {
   const skeletonCustomStyles = {
     position: 'absolute',
+    // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage-spacing
     top: '50%',
+    // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage-spacing
     left: '50%',
     transform: 'translate(-50%, -50%)',
-    marginRight: 4
+    marginRight: "var(--ds-space-050, 4px)"
   };
   return /*#__PURE__*/React.createElement(Skeleton, {
     width: 14,

package/dist/es2019/view/common/Metadata.js

@@ -1,7 +1,6 @@
 /** @jsx jsx */
 import { jsx } from '@emotion/react';
 import Tooltip from '@atlaskit/tooltip';
-import { gs } from './utils';
 import { N300 } from '@atlaskit/theme/colors';
 export const Metadata = ({
   text,
@@ -14,8 +13,8 @@ export const Metadata = ({
     metadataIcon = jsx("img", {
       src: iconUrl,
       css: {
-        width: gs(1),
-        height: gs(1)
+        width: "var(--ds-space-100, 8px)",
+        height: "var(--ds-space-100, 8px)"
       }
     });
   }
@@ -23,14 +22,14 @@ export const Metadata = ({
     css: {
       display: 'flex',
       alignItems: 'center',
-      marginRight: gs(0.5)
+      marginRight: "var(--ds-space-050, 4px)"
     }
   }, metadataIcon, jsx("span", {
     css: {
-      fontSize: gs(1.5),
+      fontSize: "var(--ds-space-150, 12px)",
       color: `${`var(--ds-text-subtlest, ${N300})`}`,
-      marginRight: gs(0.5),
-      marginLeft: '2px'
+      marginRight: "var(--ds-space-050, 4px)",
+      marginLeft: "var(--ds-space-025, 2px)"
     }
   }, text));
   if (tooltip) {

package/dist/esm/version.json

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

package/dist/esm/view/EmbedCard/views/UnresolvedView.js

@@ -1,4 +1,5 @@
 import _extends from "@babel/runtime/helpers/extends";
+/* eslint-disable @atlaskit/design-system/ensure-design-token-usage-spacing */
 /** @jsx jsx */
 import { jsx } from '@emotion/react';
 import Button from '@atlaskit/button/custom-theme-button';

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

@@ -4,7 +4,7 @@ var _templateObject;
 import React from 'react';
 import { css, jsx } from '@emotion/react';
 import AtlaskitLozenge from '@atlaskit/lozenge';
-import LozengeAction from '../../common/lozenge-action';
+import LozengeAction from './lozenge-action';
 import { useFlexibleUiOptionContext } from '../../../../../state/flexible-ui-context';
 var styles = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display: inline-flex;\n  line-height: inherit;\n"])));
 

package/dist/esm/view/FlexibleCard/components/{common → elements/lozenge}/lozenge-action/index.js

@@ -11,13 +11,13 @@ import LozengeActionTrigger from './lozenge-action-trigger';
 import LozengeActionError from './lozenge-action-error';
 import withErrorBoundary from './error-boundary';
 import { dropdownItemGroupStyles } from './styled';
-import useInvoke from '../../../../../state/hooks/use-invoke';
-import extractLozengeActionItems from '../../../../../extractors/action/extract-lozenge-action-items';
-import createStatusUpdateRequest from '../../../../../utils/actions/create-status-update-request';
-import useResolve from '../../../../../state/hooks/use-resolve';
+import useInvoke from '../../../../../../state/hooks/use-invoke';
+import extractLozengeActionItems from '../../../../../../extractors/action/extract-lozenge-action-items';
+import createStatusUpdateRequest from '../../../../../../utils/actions/create-status-update-request';
+import useResolve from '../../../../../../state/hooks/use-resolve';
 import { LozengeActionErrorMessages } from './lozenge-action-error/types';
-import { useFlexibleUiAnalyticsContext } from '../../../../../state/flexible-ui-context';
-import { TrackQuickActionType } from '../../../../../utils/analytics/analytics';
+import { useFlexibleUiAnalyticsContext } from '../../../../../../state/flexible-ui-context';
+import { TrackQuickActionType } from '../../../../../../utils/analytics/analytics';
 import { permissionLoadErrorAnalyticsPayload, unknownLoadErrorAnalyticsPayload, unknownUpdateErrorAnalyticsPayload, validationUpdateErrorAnalyticsPayload } from './lozenge-action-analytics';
 var validateItems = function validateItems() {
   var items = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];

package/dist/esm/view/FlexibleCard/components/{common → elements/lozenge}/lozenge-action/lozenge-action-analytics.js

@@ -1,4 +1,4 @@
-import { TrackQuickActionFailureReason, TrackQuickActionType } from '../../../../../utils/analytics/analytics';
+import { TrackQuickActionFailureReason, TrackQuickActionType } from '../../../../../../utils/analytics/analytics';
 export var unknownLoadErrorAnalyticsPayload = {
   smartLinkActionType: TrackQuickActionType.StatusUpdate,
   reason: TrackQuickActionFailureReason.UnknownError,

package/dist/esm/view/FlexibleCard/components/{common → elements/lozenge}/lozenge-action/lozenge-action-error/index.js

@@ -9,11 +9,11 @@ import { DropdownItem, DropdownItemGroup } from '@atlaskit/dropdown-menu';
 import { R50, R500 } from '@atlaskit/theme/colors';
 import ErrorIcon from '@atlaskit/icon/glyph/error';
 import { dropdownItemGroupStyles, contentStyles, linkStyles, textStyles } from './styled';
-import { getFormattedMessage } from '../../../utils';
-import { messages } from '../../../../../../messages';
-import { useFlexibleUiAnalyticsContext } from '../../../../../../state/flexible-ui-context';
-import { openPreviewModal } from '../../../../../EmbedModal/utils';
-import useResolve from '../../../../../../state/hooks/use-resolve';
+import { getFormattedMessage } from '../../../../utils';
+import { messages } from '../../../../../../../messages';
+import { useFlexibleUiAnalyticsContext } from '../../../../../../../state/flexible-ui-context';
+import { openPreviewModal } from '../../../../../../EmbedModal/utils';
+import useResolve from '../../../../../../../state/hooks/use-resolve';
 var MAX_LINE_NUMBER = 8;
 var LozengeActionError = function LozengeActionError(_ref) {
   var errorMessage = _ref.errorMessage,

package/dist/esm/view/FlexibleCard/components/{common → elements/lozenge}/lozenge-action/lozenge-action-error/styled.js

@@ -2,7 +2,7 @@ import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
 import { css } from '@emotion/react';
 import { N800 } from '@atlaskit/theme/colors';
-import { getTruncateStyles } from '../../../utils';
+import { getTruncateStyles } from '../../../../utils';
 export var dropdownItemGroupStyles = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  button {\n    width: 220px;\n\n    &:hover {\n      background-color: inherit;\n      cursor: default;\n    }\n  }\n"])));
 var sharedBlockStyles = css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  display: flex;\n  gap: 0.5rem;\n  line-height: 1rem;\n  min-width: 0;\n  overflow: hidden;\n  flex-direction: row;\n  align-items: center;\n"])));
 export var contentStyles = css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  ", ";\n\n  margin-top: ", ";\n  align-items: flex-start;\n\n  > span,\n  > div {\n    font-size: 0.875rem;\n    line-height: 1.25rem;\n    color: ", ";\n  }\n"])), sharedBlockStyles, "var(--ds-space-025, 2px)", "var(--ds-text, ".concat(N800, ")"));

package/dist/esm/view/FlexibleCard/components/{common → elements/lozenge}/lozenge-action/lozenge-action-error/types.js

@@ -1,4 +1,4 @@
-import { messages } from '../../../../../../messages';
+import { messages } from '../../../../../../../messages';
 export var LozengeActionErrorMessages = {
   noData: {
     descriptor: messages['status_change_permission_error']

package/dist/esm/view/InlineCard/Icon.js

@@ -19,10 +19,12 @@ export var Shimmer = function Shimmer(_ref) {
   var testId = _ref.testId;
   var skeletonCustomStyles = {
     position: 'absolute',
+    // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage-spacing
     top: '50%',
+    // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage-spacing
     left: '50%',
     transform: 'translate(-50%, -50%)',
-    marginRight: 4
+    marginRight: "var(--ds-space-050, 4px)"
   };
   return /*#__PURE__*/React.createElement(Skeleton, {
     width: 14,

package/dist/esm/view/common/Metadata.js

@@ -1,7 +1,6 @@
 /** @jsx jsx */
 import { jsx } from '@emotion/react';
 import Tooltip from '@atlaskit/tooltip';
-import { gs } from './utils';
 import { N300 } from '@atlaskit/theme/colors';
 export var Metadata = function Metadata(_ref) {
   var text = _ref.text,
@@ -13,8 +12,8 @@ export var Metadata = function Metadata(_ref) {
     metadataIcon = jsx("img", {
       src: iconUrl,
       css: {
-        width: gs(1),
-        height: gs(1)
+        width: "var(--ds-space-100, 8px)",
+        height: "var(--ds-space-100, 8px)"
       }
     });
   }
@@ -22,14 +21,14 @@ export var Metadata = function Metadata(_ref) {
     css: {
       display: 'flex',
       alignItems: 'center',
-      marginRight: gs(0.5)
+      marginRight: "var(--ds-space-050, 4px)"
     }
   }, metadataIcon, jsx("span", {
     css: {
-      fontSize: gs(1.5),
+      fontSize: "var(--ds-space-150, 12px)",
       color: "".concat("var(--ds-text-subtlest, ".concat(N300, ")")),
-      marginRight: gs(0.5),
-      marginLeft: '2px'
+      marginRight: "var(--ds-space-050, 4px)",
+      marginLeft: "var(--ds-space-025, 2px)"
     }
   }, text));
   if (tooltip) {

package/dist/types/extractors/action/extract-lozenge-action-items.d.ts

@@ -1,4 +1,4 @@
 import type { GetStatusTransitionsInvokeResponse } from '@atlaskit/linking-types/smart-link-actions';
-import { LozengeItem } from '../../view/FlexibleCard/components/common/lozenge-action/types';
+import { LozengeItem } from '../../view/FlexibleCard/components/elements/lozenge/lozenge-action/types';
 declare const extractLozengeActionItems: (response: GetStatusTransitionsInvokeResponse) => LozengeItem[];
 export default extractLozengeActionItems;

package/dist/{types-ts4.5/view/FlexibleCard/components/common → types/view/FlexibleCard/components/elements/lozenge}/lozenge-action/lozenge-action-analytics.d.ts

@@ -1,4 +1,4 @@
-import { TrackQuickActionFailureReason, TrackQuickActionType } from '../../../../../utils/analytics/analytics';
+import { TrackQuickActionFailureReason, TrackQuickActionType } from '../../../../../../utils/analytics/analytics';
 export declare const unknownLoadErrorAnalyticsPayload: {
     smartLinkActionType: TrackQuickActionType;
     reason: TrackQuickActionFailureReason;

package/dist/types/view/FlexibleCard/components/{common → elements/lozenge}/lozenge-action/lozenge-action-error/types.d.ts

@@ -1,5 +1,5 @@
-import { MessageProps } from '../../../types';
-import { PreviewActionData } from '../../../../../../state/flexible-ui-context/types';
+import { MessageProps } from '../../../../types';
+import { PreviewActionData } from '../../../../../../../state/flexible-ui-context/types';
 export type LozengeActionErrorProps = {
     /**
      * Error message to be displayed inside the dropdown

package/dist/{types-ts4.5/view/FlexibleCard/components/common → types/view/FlexibleCard/components/elements/lozenge}/lozenge-action/types.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import type { ThemeAppearance } from '@atlaskit/lozenge';
-import type { LinkLozengeInvokeActions } from '../../../../../extractors/common/lozenge/types';
+import type { LinkLozengeInvokeActions } from '../../../../../../extractors/common/lozenge/types';
 export type LozengeItem = {
     appearance?: ThemeAppearance;
     id: string;

package/dist/types-ts4.5/extractors/action/extract-lozenge-action-items.d.ts

@@ -1,4 +1,4 @@
 import type { GetStatusTransitionsInvokeResponse } from '@atlaskit/linking-types/smart-link-actions';
-import { LozengeItem } from '../../view/FlexibleCard/components/common/lozenge-action/types';
+import { LozengeItem } from '../../view/FlexibleCard/components/elements/lozenge/lozenge-action/types';
 declare const extractLozengeActionItems: (response: GetStatusTransitionsInvokeResponse) => LozengeItem[];
 export default extractLozengeActionItems;

package/dist/{types/view/FlexibleCard/components/common → types-ts4.5/view/FlexibleCard/components/elements/lozenge}/lozenge-action/lozenge-action-analytics.d.ts

@@ -1,4 +1,4 @@
-import { TrackQuickActionFailureReason, TrackQuickActionType } from '../../../../../utils/analytics/analytics';
+import { TrackQuickActionFailureReason, TrackQuickActionType } from '../../../../../../utils/analytics/analytics';
 export declare const unknownLoadErrorAnalyticsPayload: {
     smartLinkActionType: TrackQuickActionType;
     reason: TrackQuickActionFailureReason;

package/dist/types-ts4.5/view/FlexibleCard/components/{common → elements/lozenge}/lozenge-action/lozenge-action-error/types.d.ts

@@ -1,5 +1,5 @@
-import { MessageProps } from '../../../types';
-import { PreviewActionData } from '../../../../../../state/flexible-ui-context/types';
+import { MessageProps } from '../../../../types';
+import { PreviewActionData } from '../../../../../../../state/flexible-ui-context/types';
 export type LozengeActionErrorProps = {
     /**
      * Error message to be displayed inside the dropdown

package/dist/{types/view/FlexibleCard/components/common → types-ts4.5/view/FlexibleCard/components/elements/lozenge}/lozenge-action/types.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import type { ThemeAppearance } from '@atlaskit/lozenge';
-import type { LinkLozengeInvokeActions } from '../../../../../extractors/common/lozenge/types';
+import type { LinkLozengeInvokeActions } from '../../../../../../extractors/common/lozenge/types';
 export type LozengeItem = {
     appearance?: ThemeAppearance;
     id: string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/smart-card",
-  "version": "26.5.9",
+  "version": "26.5.11",
   "description": "Smart card component",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -36,7 +36,7 @@
     "@atlaskit/avatar-group": "^9.3.0",
     "@atlaskit/button": "^16.7.0",
     "@atlaskit/dropdown-menu": "^11.9.0",
-    "@atlaskit/frontend-utilities": "^2.6.0",
+    "@atlaskit/frontend-utilities": "^2.7.0",
     "@atlaskit/icon": "^21.12.0",
     "@atlaskit/icon-file-type": "^6.4.0",
     "@atlaskit/icon-object": "^6.3.0",
@@ -52,7 +52,7 @@
     "@atlaskit/modal-dialog": "^12.6.0",
     "@atlaskit/outbound-auth-flow-client": "^3.4.0",
     "@atlaskit/platform-feature-flags": "^0.2.1",
-    "@atlaskit/popup": "^1.6.0",
+    "@atlaskit/popup": "^1.7.0",
     "@atlaskit/spinner": "^15.5.0",
     "@atlaskit/theme": "^12.5.0",
     "@atlaskit/tokens": "^1.5.0",