@atlaskit/smart-card 36.15.0 → 36.15.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (28) hide show
  1. package/CHANGELOG.md +8 -0
  2. package/dist/cjs/utils/analytics/analytics.js +1 -1
  3. package/dist/cjs/view/InlineCard/ForbiddenView/index.compiled.css +1 -0
  4. package/dist/cjs/view/InlineCard/ForbiddenView/index.js +18 -2
  5. package/dist/cjs/view/InlineCard/IconAndTitleLayout/index.js +2 -0
  6. package/dist/cjs/view/InlineCard/ResolvedView/index.js +13 -0
  7. package/dist/cjs/view/InlineCard/common/inline-lozenge/index.compiled.css +7 -0
  8. package/dist/cjs/view/InlineCard/common/inline-lozenge/index.js +22 -0
  9. package/dist/cjs/view/LinkUrl/index.js +1 -1
  10. package/dist/es2019/utils/analytics/analytics.js +1 -1
  11. package/dist/es2019/view/InlineCard/ForbiddenView/index.compiled.css +1 -0
  12. package/dist/es2019/view/InlineCard/ForbiddenView/index.js +18 -2
  13. package/dist/es2019/view/InlineCard/IconAndTitleLayout/index.js +2 -0
  14. package/dist/es2019/view/InlineCard/ResolvedView/index.js +13 -0
  15. package/dist/es2019/view/InlineCard/common/inline-lozenge/index.compiled.css +7 -0
  16. package/dist/es2019/view/InlineCard/common/inline-lozenge/index.js +10 -0
  17. package/dist/es2019/view/LinkUrl/index.js +1 -1
  18. package/dist/esm/utils/analytics/analytics.js +1 -1
  19. package/dist/esm/view/InlineCard/ForbiddenView/index.compiled.css +1 -0
  20. package/dist/esm/view/InlineCard/ForbiddenView/index.js +18 -2
  21. package/dist/esm/view/InlineCard/IconAndTitleLayout/index.js +2 -0
  22. package/dist/esm/view/InlineCard/ResolvedView/index.js +13 -0
  23. package/dist/esm/view/InlineCard/common/inline-lozenge/index.compiled.css +7 -0
  24. package/dist/esm/view/InlineCard/common/inline-lozenge/index.js +12 -0
  25. package/dist/esm/view/LinkUrl/index.js +1 -1
  26. package/dist/types/view/InlineCard/common/inline-lozenge/index.d.ts +5 -0
  27. package/dist/types-ts4.5/view/InlineCard/common/inline-lozenge/index.d.ts +5 -0
  28. package/package.json +8 -5
package/CHANGELOG.md CHANGED
@@ -1,5 +1,13 @@
1
1
  # @atlaskit/smart-card
2
2
 
3
+ ## 36.15.1
4
+
5
+ ### Patch Changes
6
+
7
+ - [#151434](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/151434)
8
+ [`af0089cbc89d6`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/af0089cbc89d6) -
9
+ [ux] Fix InlineCard Lozenge overlap other element in smaller space
10
+
3
11
  ## 36.15.0
4
12
 
5
13
  ### Minor Changes
@@ -11,7 +11,7 @@ var ANALYTICS_CHANNEL = exports.ANALYTICS_CHANNEL = 'media';
11
11
  var context = exports.context = {
12
12
  componentName: 'smart-cards',
13
13
  packageName: "@atlaskit/smart-card",
14
- packageVersion: "36.15.0"
14
+ packageVersion: "36.15.1"
15
15
  };
16
16
  var TrackQuickActionType = exports.TrackQuickActionType = /*#__PURE__*/function (TrackQuickActionType) {
17
17
  TrackQuickActionType["StatusUpdate"] = "StatusUpdate";
@@ -5,4 +5,5 @@
5
5
  ._bfhksm61{background-color:var(--ds-background-neutral-subtle,#00000000)}
6
6
  ._ca0qze3t{padding-top:var(--ds-space-0,0)}
7
7
  ._n3tdze3t{padding-bottom:var(--ds-space-0,0)}
8
+ ._p12f1osq{max-width:100%}
8
9
  ._u5f3ze3t{padding-right:var(--ds-space-0,0)}
@@ -22,13 +22,15 @@ var _colors = require("@atlaskit/theme/colors");
22
22
  var _messages = require("../../../messages");
23
23
  var _HoverCard = require("../../HoverCard");
24
24
  var _actionButton = require("../common/action-button");
25
+ var _inlineLozenge = _interopRequireDefault(require("../common/inline-lozenge"));
25
26
  var _Frame = require("../Frame");
26
27
  var _IconAndTitleLayout = require("../IconAndTitleLayout");
27
28
  var _styled = require("../styled");
28
29
  var _withFrameStyleControl = _interopRequireDefault(require("../utils/withFrameStyleControl"));
29
30
  var styles = {
30
31
  iconWrapper: "_2hwx1i6y _1e0cbu77",
31
- actionButtonLozengeStyle: "_2rkogqwt _bfhksm61 _ca0qze3t _u5f3ze3t _n3tdze3t _19bvze3t"
32
+ actionButtonLozengeStyleOld: "_2rkogqwt _bfhksm61 _ca0qze3t _u5f3ze3t _n3tdze3t _19bvze3t",
33
+ actionButtonLozengeStyleNew: "_2rkogqwt _bfhksm61 _ca0qze3t _u5f3ze3t _n3tdze3t _19bvze3t _p12f1osq"
32
34
  };
33
35
  var fallbackForbiddenIcon = function fallbackForbiddenIcon() {
34
36
  if ((0, _platformFeatureFlags.fg)('platform-linking-visual-refresh-v1')) {
@@ -113,8 +115,22 @@ var InlineCardForbiddenView = exports.InlineCardForbiddenView = function InlineC
113
115
  }
114
116
  if (onAuthorise) {
115
117
  if ((0, _platformFeatureFlags.fg)('platform-linking-visual-refresh-v1')) {
118
+ if ((0, _platformFeatureFlags.fg)('platform-linking-visual-refresh-inline-lozenge')) {
119
+ return /*#__PURE__*/_react.default.createElement(_compiled.Pressable, {
120
+ xcss: styles.actionButtonLozengeStyleNew,
121
+ onClick: handleRetry,
122
+ style: {
123
+ font: "inherit"
124
+ },
125
+ testId: "button-connect-other-account"
126
+ }, /*#__PURE__*/_react.default.createElement(_inlineLozenge.default, (0, _extends2.default)({
127
+ appearance: "moved"
128
+ }, (0, _platformFeatureFlags.fg)('platform-component-visual-refresh') ? {
129
+ isBold: true
130
+ } : undefined), renderForbiddenAccessMessage()));
131
+ }
116
132
  return /*#__PURE__*/_react.default.createElement(_IconAndTitleLayout.LozengeWrapper, null, /*#__PURE__*/_react.default.createElement(_compiled.Pressable, {
117
- xcss: styles.actionButtonLozengeStyle,
133
+ xcss: styles.actionButtonLozengeStyleOld,
118
134
  onClick: handleRetry,
119
135
  testId: "button-connect-other-account"
120
136
  }, /*#__PURE__*/_react.default.createElement(_lozenge.default, (0, _extends2.default)({
@@ -279,6 +279,8 @@ var LozengeWrapperOldVisualRefresh = (0, _react.forwardRef)(function (_ref5, __c
279
279
  className: (0, _runtime.ax)(["_1e0c1o8l _s7n4t94y _19pkidpf _2hwx1b66 _otyridpf _18u0v77o", __cmplp.className])
280
280
  }));
281
281
  });
282
+
283
+ // Remove on platform-linking-visual-refresh-inline-lozenge cleanup
282
284
  if (process.env.NODE_ENV !== 'production') {
283
285
  LozengeWrapperOldVisualRefresh.displayName = 'LozengeWrapperOldVisualRefresh';
284
286
  }
@@ -15,6 +15,7 @@ var _react = _interopRequireDefault(require("react"));
15
15
  var _lozenge = _interopRequireDefault(require("@atlaskit/lozenge"));
16
16
  var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
17
17
  var _HoverCard = require("../../HoverCard");
18
+ var _inlineLozenge = _interopRequireDefault(require("../common/inline-lozenge"));
18
19
  var _Frame = require("../Frame");
19
20
  var _IconAndTitleLayout = require("../IconAndTitleLayout");
20
21
  function _callSuper(t, o, e) { return o = (0, _getPrototypeOf2.default)(o), (0, _possibleConstructorReturn2.default)(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], (0, _getPrototypeOf2.default)(t).constructor) : o.apply(t, e)); }
@@ -33,6 +34,18 @@ var InlineCardResolvedView = exports.InlineCardResolvedView = /*#__PURE__*/funct
33
34
  return null;
34
35
  }
35
36
  var appearance = lozenge.appearance || 'default';
37
+ if ((0, _platformFeatureFlags.fg)('platform-linking-visual-refresh-inline-lozenge')) {
38
+ var _lozenge$style, _lozenge$style2;
39
+ return /*#__PURE__*/_react.default.createElement(_inlineLozenge.default, {
40
+ testId: "inline-card-resolved-view-lozenge",
41
+ appearance: appearance,
42
+ style: {
43
+ backgroundColor: lozenge === null || lozenge === void 0 || (_lozenge$style = lozenge.style) === null || _lozenge$style === void 0 ? void 0 : _lozenge$style.backgroundColor,
44
+ color: lozenge === null || lozenge === void 0 || (_lozenge$style2 = lozenge.style) === null || _lozenge$style2 === void 0 ? void 0 : _lozenge$style2.color
45
+ },
46
+ isBold: (0, _platformFeatureFlags.fg)('platform-component-visual-refresh') ? lozenge.isBold !== false : lozenge.isBold
47
+ }, lozenge.text);
48
+ }
36
49
  return /*#__PURE__*/_react.default.createElement(_IconAndTitleLayout.LozengeWrapper, null, /*#__PURE__*/_react.default.createElement(_lozenge.default, {
37
50
  testId: "inline-card-resolved-view-lozenge",
38
51
  appearance: appearance
@@ -0,0 +1,7 @@
1
+ ._18u0v77o{margin-left:var(--ds-space-025,2px)}
2
+ ._19pkidpf{margin-top:0}
3
+ ._1e0c1o8l{display:inline-block}
4
+ ._2hwx1b66{margin-right:var(--ds-space-050,4px)}
5
+ ._otyridpf{margin-bottom:0}
6
+ ._p12f1osq{max-width:100%}
7
+ ._s7n4t94y{vertical-align:1px}
@@ -0,0 +1,22 @@
1
+ /* index.tsx generated by @compiled/babel-plugin v0.36.1 */
2
+ "use strict";
3
+
4
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
5
+ var _typeof = require("@babel/runtime/helpers/typeof");
6
+ Object.defineProperty(exports, "__esModule", {
7
+ value: true
8
+ });
9
+ exports.default = void 0;
10
+ require("./index.compiled.css");
11
+ var React = _interopRequireWildcard(require("react"));
12
+ var _runtime = require("@compiled/react/runtime");
13
+ var _lozenge = _interopRequireDefault(require("@atlaskit/lozenge"));
14
+ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
15
+ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
16
+ var wrapperStyles = null;
17
+ var InlineLozenge = function InlineLozenge(props) {
18
+ return /*#__PURE__*/React.createElement("span", {
19
+ className: (0, _runtime.ax)(["_1e0c1o8l _s7n4t94y _19pkidpf _2hwx1b66 _otyridpf _18u0v77o _p12f1osq"])
20
+ }, /*#__PURE__*/React.createElement(_lozenge.default, props));
21
+ };
22
+ var _default = exports.default = InlineLozenge;
@@ -20,7 +20,7 @@ var _excluded = ["href", "children", "checkSafety", "onClick", "testId", "isLink
20
20
  _excluded2 = ["isLinkSafe", "showSafetyWarningModal"];
21
21
  var PACKAGE_DATA = {
22
22
  packageName: "@atlaskit/smart-card",
23
- packageVersion: "36.15.0",
23
+ packageVersion: "36.15.1",
24
24
  componentName: 'linkUrl'
25
25
  };
26
26
  var Anchor = (0, _click.withLinkClickedEvent)('a');
@@ -2,7 +2,7 @@ export const ANALYTICS_CHANNEL = 'media';
2
2
  export const context = {
3
3
  componentName: 'smart-cards',
4
4
  packageName: "@atlaskit/smart-card",
5
- packageVersion: "36.15.0"
5
+ packageVersion: "36.15.1"
6
6
  };
7
7
  export let TrackQuickActionType = /*#__PURE__*/function (TrackQuickActionType) {
8
8
  TrackQuickActionType["StatusUpdate"] = "StatusUpdate";
@@ -5,4 +5,5 @@
5
5
  ._bfhksm61{background-color:var(--ds-background-neutral-subtle,#00000000)}
6
6
  ._ca0qze3t{padding-top:var(--ds-space-0,0)}
7
7
  ._n3tdze3t{padding-bottom:var(--ds-space-0,0)}
8
+ ._p12f1osq{max-width:100%}
8
9
  ._u5f3ze3t{padding-right:var(--ds-space-0,0)}
@@ -14,13 +14,15 @@ import { N500 } from '@atlaskit/theme/colors';
14
14
  import { messages } from '../../../messages';
15
15
  import { HoverCard } from '../../HoverCard';
16
16
  import { ActionButton } from '../common/action-button';
17
+ import InlineLozenge from '../common/inline-lozenge';
17
18
  import { Frame } from '../Frame';
18
19
  import { IconAndTitleLayout, LozengeWrapper } from '../IconAndTitleLayout';
19
20
  import { IconStyledButtonOldVisualRefresh } from '../styled';
20
21
  import withFrameStyleControl from '../utils/withFrameStyleControl';
21
22
  const styles = {
22
23
  iconWrapper: "_2hwx1i6y _1e0cbu77",
23
- actionButtonLozengeStyle: "_2rkogqwt _bfhksm61 _ca0qze3t _u5f3ze3t _n3tdze3t _19bvze3t"
24
+ actionButtonLozengeStyleOld: "_2rkogqwt _bfhksm61 _ca0qze3t _u5f3ze3t _n3tdze3t _19bvze3t",
25
+ actionButtonLozengeStyleNew: "_2rkogqwt _bfhksm61 _ca0qze3t _u5f3ze3t _n3tdze3t _19bvze3t _p12f1osq"
24
26
  };
25
27
  const fallbackForbiddenIcon = () => {
26
28
  if (fg('platform-linking-visual-refresh-v1')) {
@@ -103,8 +105,22 @@ export const InlineCardForbiddenView = ({
103
105
  }
104
106
  if (onAuthorise) {
105
107
  if (fg('platform-linking-visual-refresh-v1')) {
108
+ if (fg('platform-linking-visual-refresh-inline-lozenge')) {
109
+ return /*#__PURE__*/React.createElement(Pressable, {
110
+ xcss: styles.actionButtonLozengeStyleNew,
111
+ onClick: handleRetry,
112
+ style: {
113
+ font: `inherit`
114
+ },
115
+ testId: "button-connect-other-account"
116
+ }, /*#__PURE__*/React.createElement(InlineLozenge, _extends({
117
+ appearance: "moved"
118
+ }, fg('platform-component-visual-refresh') ? {
119
+ isBold: true
120
+ } : undefined), renderForbiddenAccessMessage()));
121
+ }
106
122
  return /*#__PURE__*/React.createElement(LozengeWrapper, null, /*#__PURE__*/React.createElement(Pressable, {
107
- xcss: styles.actionButtonLozengeStyle,
123
+ xcss: styles.actionButtonLozengeStyleOld,
108
124
  onClick: handleRetry,
109
125
  testId: "button-connect-other-account"
110
126
  }, /*#__PURE__*/React.createElement(Lozenge, _extends({
@@ -265,6 +265,8 @@ const LozengeWrapperOldVisualRefresh = forwardRef(({
265
265
  className: ax(["_1e0c1o8l _s7n4t94y _19pkidpf _2hwx1b66 _otyridpf _18u0v77o", __cmplp.className])
266
266
  }));
267
267
  });
268
+
269
+ // Remove on platform-linking-visual-refresh-inline-lozenge cleanup
268
270
  if (process.env.NODE_ENV !== 'production') {
269
271
  LozengeWrapperOldVisualRefresh.displayName = 'LozengeWrapperOldVisualRefresh';
270
272
  }
@@ -3,6 +3,7 @@ import React from 'react';
3
3
  import Lozenge from '@atlaskit/lozenge';
4
4
  import { fg } from '@atlaskit/platform-feature-flags';
5
5
  import { HoverCard } from '../../HoverCard';
6
+ import InlineLozenge from '../common/inline-lozenge';
6
7
  import { Frame } from '../Frame';
7
8
  import { IconAndTitleLayout, LozengeWrapper } from '../IconAndTitleLayout';
8
9
  export class InlineCardResolvedView extends React.Component {
@@ -14,6 +15,18 @@ export class InlineCardResolvedView extends React.Component {
14
15
  return null;
15
16
  }
16
17
  const appearance = lozenge.appearance || 'default';
18
+ if (fg('platform-linking-visual-refresh-inline-lozenge')) {
19
+ var _lozenge$style, _lozenge$style2;
20
+ return /*#__PURE__*/React.createElement(InlineLozenge, {
21
+ testId: "inline-card-resolved-view-lozenge",
22
+ appearance: appearance,
23
+ style: {
24
+ backgroundColor: lozenge === null || lozenge === void 0 ? void 0 : (_lozenge$style = lozenge.style) === null || _lozenge$style === void 0 ? void 0 : _lozenge$style.backgroundColor,
25
+ color: lozenge === null || lozenge === void 0 ? void 0 : (_lozenge$style2 = lozenge.style) === null || _lozenge$style2 === void 0 ? void 0 : _lozenge$style2.color
26
+ },
27
+ isBold: fg('platform-component-visual-refresh') ? lozenge.isBold !== false : lozenge.isBold
28
+ }, lozenge.text);
29
+ }
17
30
  return /*#__PURE__*/React.createElement(LozengeWrapper, null, /*#__PURE__*/React.createElement(Lozenge, {
18
31
  testId: "inline-card-resolved-view-lozenge",
19
32
  appearance: appearance
@@ -0,0 +1,7 @@
1
+ ._18u0v77o{margin-left:var(--ds-space-025,2px)}
2
+ ._19pkidpf{margin-top:0}
3
+ ._1e0c1o8l{display:inline-block}
4
+ ._2hwx1b66{margin-right:var(--ds-space-050,4px)}
5
+ ._otyridpf{margin-bottom:0}
6
+ ._p12f1osq{max-width:100%}
7
+ ._s7n4t94y{vertical-align:1px}
@@ -0,0 +1,10 @@
1
+ /* index.tsx generated by @compiled/babel-plugin v0.36.1 */
2
+ import "./index.compiled.css";
3
+ import * as React from 'react';
4
+ import { ax, ix } from "@compiled/react/runtime";
5
+ import Lozenge from '@atlaskit/lozenge';
6
+ const wrapperStyles = null;
7
+ const InlineLozenge = props => /*#__PURE__*/React.createElement("span", {
8
+ className: ax(["_1e0c1o8l _s7n4t94y _19pkidpf _2hwx1b66 _otyridpf _18u0v77o _p12f1osq"])
9
+ }, /*#__PURE__*/React.createElement(Lozenge, props));
10
+ export default InlineLozenge;
@@ -10,7 +10,7 @@ import LinkWarningModal from './LinkWarningModal';
10
10
  import { useLinkWarningModal } from './LinkWarningModal/hooks/use-link-warning-modal';
11
11
  const PACKAGE_DATA = {
12
12
  packageName: "@atlaskit/smart-card",
13
- packageVersion: "36.15.0",
13
+ packageVersion: "36.15.1",
14
14
  componentName: 'linkUrl'
15
15
  };
16
16
  const Anchor = withLinkClickedEvent('a');
@@ -4,7 +4,7 @@ export var ANALYTICS_CHANNEL = 'media';
4
4
  export var context = {
5
5
  componentName: 'smart-cards',
6
6
  packageName: "@atlaskit/smart-card",
7
- packageVersion: "36.15.0"
7
+ packageVersion: "36.15.1"
8
8
  };
9
9
  export var TrackQuickActionType = /*#__PURE__*/function (TrackQuickActionType) {
10
10
  TrackQuickActionType["StatusUpdate"] = "StatusUpdate";
@@ -5,4 +5,5 @@
5
5
  ._bfhksm61{background-color:var(--ds-background-neutral-subtle,#00000000)}
6
6
  ._ca0qze3t{padding-top:var(--ds-space-0,0)}
7
7
  ._n3tdze3t{padding-bottom:var(--ds-space-0,0)}
8
+ ._p12f1osq{max-width:100%}
8
9
  ._u5f3ze3t{padding-right:var(--ds-space-0,0)}
@@ -15,13 +15,15 @@ import { N500 } from '@atlaskit/theme/colors';
15
15
  import { messages } from '../../../messages';
16
16
  import { HoverCard } from '../../HoverCard';
17
17
  import { ActionButton } from '../common/action-button';
18
+ import InlineLozenge from '../common/inline-lozenge';
18
19
  import { Frame } from '../Frame';
19
20
  import { IconAndTitleLayout, LozengeWrapper } from '../IconAndTitleLayout';
20
21
  import { IconStyledButtonOldVisualRefresh } from '../styled';
21
22
  import withFrameStyleControl from '../utils/withFrameStyleControl';
22
23
  var styles = {
23
24
  iconWrapper: "_2hwx1i6y _1e0cbu77",
24
- actionButtonLozengeStyle: "_2rkogqwt _bfhksm61 _ca0qze3t _u5f3ze3t _n3tdze3t _19bvze3t"
25
+ actionButtonLozengeStyleOld: "_2rkogqwt _bfhksm61 _ca0qze3t _u5f3ze3t _n3tdze3t _19bvze3t",
26
+ actionButtonLozengeStyleNew: "_2rkogqwt _bfhksm61 _ca0qze3t _u5f3ze3t _n3tdze3t _19bvze3t _p12f1osq"
25
27
  };
26
28
  var fallbackForbiddenIcon = function fallbackForbiddenIcon() {
27
29
  if (fg('platform-linking-visual-refresh-v1')) {
@@ -106,8 +108,22 @@ export var InlineCardForbiddenView = function InlineCardForbiddenView(_ref) {
106
108
  }
107
109
  if (onAuthorise) {
108
110
  if (fg('platform-linking-visual-refresh-v1')) {
111
+ if (fg('platform-linking-visual-refresh-inline-lozenge')) {
112
+ return /*#__PURE__*/React.createElement(Pressable, {
113
+ xcss: styles.actionButtonLozengeStyleNew,
114
+ onClick: handleRetry,
115
+ style: {
116
+ font: "inherit"
117
+ },
118
+ testId: "button-connect-other-account"
119
+ }, /*#__PURE__*/React.createElement(InlineLozenge, _extends({
120
+ appearance: "moved"
121
+ }, fg('platform-component-visual-refresh') ? {
122
+ isBold: true
123
+ } : undefined), renderForbiddenAccessMessage()));
124
+ }
109
125
  return /*#__PURE__*/React.createElement(LozengeWrapper, null, /*#__PURE__*/React.createElement(Pressable, {
110
- xcss: styles.actionButtonLozengeStyle,
126
+ xcss: styles.actionButtonLozengeStyleOld,
111
127
  onClick: handleRetry,
112
128
  testId: "button-connect-other-account"
113
129
  }, /*#__PURE__*/React.createElement(Lozenge, _extends({
@@ -270,6 +270,8 @@ var LozengeWrapperOldVisualRefresh = forwardRef(function (_ref5, __cmplr) {
270
270
  className: ax(["_1e0c1o8l _s7n4t94y _19pkidpf _2hwx1b66 _otyridpf _18u0v77o", __cmplp.className])
271
271
  }));
272
272
  });
273
+
274
+ // Remove on platform-linking-visual-refresh-inline-lozenge cleanup
273
275
  if (process.env.NODE_ENV !== 'production') {
274
276
  LozengeWrapperOldVisualRefresh.displayName = 'LozengeWrapperOldVisualRefresh';
275
277
  }
@@ -10,6 +10,7 @@ import React from 'react';
10
10
  import Lozenge from '@atlaskit/lozenge';
11
11
  import { fg } from '@atlaskit/platform-feature-flags';
12
12
  import { HoverCard } from '../../HoverCard';
13
+ import InlineLozenge from '../common/inline-lozenge';
13
14
  import { Frame } from '../Frame';
14
15
  import { IconAndTitleLayout, LozengeWrapper } from '../IconAndTitleLayout';
15
16
  export var InlineCardResolvedView = /*#__PURE__*/function (_React$Component) {
@@ -26,6 +27,18 @@ export var InlineCardResolvedView = /*#__PURE__*/function (_React$Component) {
26
27
  return null;
27
28
  }
28
29
  var appearance = lozenge.appearance || 'default';
30
+ if (fg('platform-linking-visual-refresh-inline-lozenge')) {
31
+ var _lozenge$style, _lozenge$style2;
32
+ return /*#__PURE__*/React.createElement(InlineLozenge, {
33
+ testId: "inline-card-resolved-view-lozenge",
34
+ appearance: appearance,
35
+ style: {
36
+ backgroundColor: lozenge === null || lozenge === void 0 || (_lozenge$style = lozenge.style) === null || _lozenge$style === void 0 ? void 0 : _lozenge$style.backgroundColor,
37
+ color: lozenge === null || lozenge === void 0 || (_lozenge$style2 = lozenge.style) === null || _lozenge$style2 === void 0 ? void 0 : _lozenge$style2.color
38
+ },
39
+ isBold: fg('platform-component-visual-refresh') ? lozenge.isBold !== false : lozenge.isBold
40
+ }, lozenge.text);
41
+ }
29
42
  return /*#__PURE__*/React.createElement(LozengeWrapper, null, /*#__PURE__*/React.createElement(Lozenge, {
30
43
  testId: "inline-card-resolved-view-lozenge",
31
44
  appearance: appearance
@@ -0,0 +1,7 @@
1
+ ._18u0v77o{margin-left:var(--ds-space-025,2px)}
2
+ ._19pkidpf{margin-top:0}
3
+ ._1e0c1o8l{display:inline-block}
4
+ ._2hwx1b66{margin-right:var(--ds-space-050,4px)}
5
+ ._otyridpf{margin-bottom:0}
6
+ ._p12f1osq{max-width:100%}
7
+ ._s7n4t94y{vertical-align:1px}
@@ -0,0 +1,12 @@
1
+ /* index.tsx generated by @compiled/babel-plugin v0.36.1 */
2
+ import "./index.compiled.css";
3
+ import * as React from 'react';
4
+ import { ax, ix } from "@compiled/react/runtime";
5
+ import Lozenge from '@atlaskit/lozenge';
6
+ var wrapperStyles = null;
7
+ var InlineLozenge = function InlineLozenge(props) {
8
+ return /*#__PURE__*/React.createElement("span", {
9
+ className: ax(["_1e0c1o8l _s7n4t94y _19pkidpf _2hwx1b66 _otyridpf _18u0v77o _p12f1osq"])
10
+ }, /*#__PURE__*/React.createElement(Lozenge, props));
11
+ };
12
+ export default InlineLozenge;
@@ -13,7 +13,7 @@ import LinkWarningModal from './LinkWarningModal';
13
13
  import { useLinkWarningModal } from './LinkWarningModal/hooks/use-link-warning-modal';
14
14
  var PACKAGE_DATA = {
15
15
  packageName: "@atlaskit/smart-card",
16
- packageVersion: "36.15.0",
16
+ packageVersion: "36.15.1",
17
17
  componentName: 'linkUrl'
18
18
  };
19
19
  var Anchor = withLinkClickedEvent('a');
@@ -0,0 +1,5 @@
1
+ /// <reference types="react" />
2
+ import { type LozengeProps } from '@atlaskit/lozenge';
3
+ type InlineLozengeProps = LozengeProps;
4
+ declare const InlineLozenge: (props: InlineLozengeProps) => JSX.Element;
5
+ export default InlineLozenge;
@@ -0,0 +1,5 @@
1
+ /// <reference types="react" />
2
+ import { type LozengeProps } from '@atlaskit/lozenge';
3
+ type InlineLozengeProps = LozengeProps;
4
+ declare const InlineLozenge: (props: InlineLozengeProps) => JSX.Element;
5
+ export default InlineLozenge;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/smart-card",
3
- "version": "36.15.0",
3
+ "version": "36.15.1",
4
4
  "description": "Smart card component",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"
@@ -39,9 +39,9 @@
39
39
  "@atlaskit/form": "^12.0.0",
40
40
  "@atlaskit/frontend-utilities": "^3.0.0",
41
41
  "@atlaskit/heading": "^5.2.0",
42
- "@atlaskit/icon": "^25.6.0",
42
+ "@atlaskit/icon": "^25.7.0",
43
43
  "@atlaskit/icon-file-type": "^7.0.0",
44
- "@atlaskit/icon-lab": "^4.10.0",
44
+ "@atlaskit/icon-lab": "^4.11.0",
45
45
  "@atlaskit/icon-object": "^7.1.0",
46
46
  "@atlaskit/icon-priority": "^6.3.0",
47
47
  "@atlaskit/image": "^3.0.0",
@@ -97,12 +97,12 @@
97
97
  "@atlaskit/css-reset": "^7.2.0",
98
98
  "@atlaskit/link-test-helpers": "^8.0.0",
99
99
  "@atlaskit/media-test-helpers": "^36.0.0",
100
- "@atlaskit/react-ufo": "^3.9.0",
100
+ "@atlaskit/react-ufo": "^3.10.0",
101
101
  "@atlaskit/ssr": "workspace:^",
102
102
  "@atlaskit/visual-regression": "workspace:^",
103
103
  "@atlassian/analytics-tooling": "^0.5.0",
104
104
  "@atlassian/feature-flags-test-utils": "^0.3.0",
105
- "@atlassian/gemini": "^1.17.0",
105
+ "@atlassian/gemini": "^1.18.0",
106
106
  "@testing-library/dom": "^10.1.0",
107
107
  "@testing-library/jest-dom": "^6.4.5",
108
108
  "@testing-library/react": "^13.4.0",
@@ -221,6 +221,9 @@
221
221
  "platform-linking-visual-refresh-v2": {
222
222
  "type": "boolean"
223
223
  },
224
+ "platform-linking-visual-refresh-inline-lozenge": {
225
+ "type": "boolean"
226
+ },
224
227
  "platform-linking-flexible-card-openness": {
225
228
  "type": "boolean"
226
229
  },