@atlaskit/smart-card 43.28.7 → 43.29.0

package/dist/cjs/view/FlexibleCard/components/elements/common/base-lozenge-element/lozenge-action/lozenge-action-trigger/index.js

@@ -17,17 +17,18 @@ var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/h
 var _react2 = require("@compiled/react");
 var _reactIntlNext = require("react-intl-next");
 var _chevronDown = _interopRequireDefault(require("@atlaskit/icon/core/chevron-down"));
-var _lozenge = _interopRequireDefault(require("@atlaskit/lozenge"));
+var _lozenge = _interopRequireWildcard(require("@atlaskit/lozenge"));
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _compiled = require("@atlaskit/primitives/compiled");
 var _messages = require("../../../../../../../../messages");
-var _excluded = ["appearance", "isOpen", "maxWidth", "testId", "text", "triggerRef"];
+var _excluded = ["appearance", "isOpen", "maxWidth", "testId", "text", "triggerRef", "trailingMetric"];
 /* eslint-disable @atlaskit/design-system/use-tokens-typography */
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
 var styles = {
   chevronDown: "_18u012x7 _1e0c1txw",
   lozengeContainer: "_kkk2n7od _2rko12b0 _1dqonqa1 _189ee4h9 _1h6d1j28 _bfhk1j28 _1e0c1txw _4cvr1h6o _4t3i7vkz",
-  lozengeContainerSelected: "_1reo15vq _18m915vq _1h6d1v1w"
+  lozengeContainerSelected: "_1reo15vq _18m915vq _1h6d1v1w",
+  lozengeDropdownContainer: "_ca0q1b66 _u5f31b66 _n3td1b66 _19bv1b66"
 };
 var textStyles = null;
 var triggerLozengeStyles = null;
@@ -39,6 +40,7 @@ var LozengeActionTrigger = function LozengeActionTrigger(_ref) {
     testId = _ref.testId,
     text = _ref.text,
     triggerRef = _ref.triggerRef,
+    trailingMetric = _ref.trailingMetric,
     props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   var intl = (0, _reactIntlNext.useIntl)();
   var _useState = (0, _react.useState)(false),
@@ -99,7 +101,20 @@ var LozengeActionTrigger = function LozengeActionTrigger(_ref) {
       "aria-hidden": true
     })))));
   }, [appearance, isPressing, text, isOpen, lozengeBackgroundColor, lozengeForegroundColor, maxWidth]);
-  return /*#__PURE__*/React.createElement("button", (0, _extends2.default)({
+  return (0, _platformFeatureFlags.fg)('platform-dst-lozenge-tag-badge-visual-uplifts') ? /*#__PURE__*/React.createElement(_compiled.Box, {
+    xcss: styles.lozengeDropdownContainer
+  }, /*#__PURE__*/React.createElement(_lozenge.LozengeDropdownTrigger, (0, _extends2.default)({}, props, {
+    appearance: appearance,
+    trailingMetric: trailingMetric,
+    "data-action-open": isOpen,
+    "data-testid": "".concat(testId, "--trigger"),
+    maxWidth: maxWidth,
+    testId: testId,
+    ref: triggerRef,
+    "aria-label": (0, _platformFeatureFlags.fg)('platform_navx_flex_card_status_dropdown_a11y_fix') ? intl.formatMessage(_messages.messages.change_status, {
+      status: text
+    }) : undefined
+  }), text)) : /*#__PURE__*/React.createElement("button", (0, _extends2.default)({
     type: "button"
   }, props, {
     "data-action-open": isOpen,

package/dist/cjs/view/FlexibleCard/components/elements/due-on-element/index.js

@@ -14,7 +14,8 @@ var DueOnElement = function DueOnElement(props) {
   var context = (0, _flexibleUiContext.useFlexibleUiContext)();
   var data = context ? (0, _common.toDateLozengeProps)(context.dueOn) : null;
   return data ? /*#__PURE__*/_react.default.createElement(_common.BaseLozengeElement, (0, _extends2.default)({}, data, props, {
-    name: _constants.ElementName.DueOn
+    name: _constants.ElementName.DueOn,
+    isDateTag: true
   })) : null;
 };
 var _default = exports.default = DueOnElement;

package/dist/cjs/view/FlexibleCard/components/elements/state-element/index.js

@@ -1,21 +1,42 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-var _react = _interopRequireDefault(require("react"));
+var _react = _interopRequireWildcard(require("react"));
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _constants = require("../../../../../constants");
 var _flexibleUiContext = require("../../../../../state/flexible-ui-context");
 var _common = require("../common");
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
+var STATE_METRIC_REGEX = /^(.+?)\s+-\s+(\d+(?:\.\d+)?)$/;
 var StateElement = function StateElement(props) {
   var _context$state;
   var context = (0, _flexibleUiContext.useFlexibleUiContext)();
   var data = (_context$state = context === null || context === void 0 ? void 0 : context.state) !== null && _context$state !== void 0 ? _context$state : null;
-  return data ? /*#__PURE__*/_react.default.createElement(_common.BaseLozengeElement, (0, _extends2.default)({}, data, props, {
+  var metricProps = (0, _platformFeatureFlags.fg)('platform-dst-lozenge-tag-badge-visual-uplifts') ?
+  // eslint-disable-next-line react-hooks/rules-of-hooks
+  (0, _react.useMemo)(function () {
+    if (data && typeof data.text === 'string') {
+      var match = data.text.match(STATE_METRIC_REGEX);
+      if (match) {
+        return {
+          text: match[1],
+          trailingMetric: match[2]
+        };
+      }
+    }
+    return null;
+  }, [data]) : undefined;
+  if (!data) {
+    return null;
+  }
+  return /*#__PURE__*/_react.default.createElement(_common.BaseLozengeElement, (0, _extends2.default)({}, data, props, metricProps, {
     name: _constants.ElementName.State
-  })) : null;
+  }));
 };
 var _default = exports.default = StateElement;

package/dist/cjs/view/InlineCard/Frame/styled.compiled.css

@@ -1,7 +1,7 @@
 
 ._19itia51{border:var(--ds-border-width,1px) solid var(--ds-border,#0b120e24)}
 ._1yt4x7n9{padding:var(--ds-space-025,2px) 0}
-._2rko12b0{border-radius:var(--ds-radius-small,4px)}
+._2rko1ssi{border-radius:var(--ds-radius-medium,4px)}
 ._v56415x0{transition:all .1s ease-in-out}
 ._1h6d1w55{border-color:var(--ds-border-accent-blue,#357de8)}._12ji1r31{outline-color:currentColor}
 ._12y31o36{outline-width:medium}

package/dist/cjs/view/InlineCard/Frame/styled.js

@@ -26,7 +26,7 @@ var WrapperSpan = exports.WrapperSpan = /*#__PURE__*/(0, _react.forwardRef)(func
   return /*#__PURE__*/_react.default.createElement("span", (0, _extends2.default)({
     ref: ref
   }, props, {
-    className: (0, _runtime.ax)(["_1yt4x7n9 _2rko12b0 _v56415x0 _1e0c1nu9 _16d9qvcn _syaz13af _1rkwglyw _4cvx1w55", truncateInline && "_1reo15vq _18m915vq _ca0qidpf _u5f3idpf _n3tdidpf _19bvidpf _1bto1l2s _1nmz9jpi _1e0c1abx _1yyjkb7n _sudp1e54 _nr8z1o8l _1voyv77o _3kwxidpf _jqg5v77o _6vwiidpf", truncateInline && viewType === 'unauthorised' && "_syaz15cr", withoutBackground ? "_19bvidpf _18u01i6y" : "_19itia51 _bfhkhp5a _1a3b1r31 _4fprglyw _5goinqa1 _9oik1r31 _1bnxglyw _jf4cnqa1 _1nrm1r31 _c2waglyw _1iohnqa1", isHovered && "_1h6d1w55", isHovered && !withoutBackground && "_4bfu1r31 _1hmsglyw _ajmmnqa1", isSelected ? "_12ji1r31 _1qu2glyw _12y31o36 _80omtlke _16qsw5lj _uiztglyw _1a3b1r31 _4fprglyw _5goinqa1 _9oik1r31 _1bnxglyw _jf4cnqa1 _bfw7ia51 _1nrm1r31 _c2waglyw _1iohnqa1" : "_uizt1kdv"])
+    className: (0, _runtime.ax)(["_1yt4x7n9 _2rko1ssi _v56415x0 _1e0c1nu9 _16d9qvcn _syaz13af _1rkwglyw _4cvx1w55", truncateInline && "_1reo15vq _18m915vq _ca0qidpf _u5f3idpf _n3tdidpf _19bvidpf _1bto1l2s _1nmz9jpi _1e0c1abx _1yyjkb7n _sudp1e54 _nr8z1o8l _1voyv77o _3kwxidpf _jqg5v77o _6vwiidpf", truncateInline && viewType === 'unauthorised' && "_syaz15cr", withoutBackground ? "_19bvidpf _18u01i6y" : "_19itia51 _bfhkhp5a _1a3b1r31 _4fprglyw _5goinqa1 _9oik1r31 _1bnxglyw _jf4cnqa1 _1nrm1r31 _c2waglyw _1iohnqa1", isHovered && "_1h6d1w55", isHovered && !withoutBackground && "_4bfu1r31 _1hmsglyw _ajmmnqa1", isSelected ? "_12ji1r31 _1qu2glyw _12y31o36 _80omtlke _16qsw5lj _uiztglyw _1a3b1r31 _4fprglyw _5goinqa1 _9oik1r31 _1bnxglyw _jf4cnqa1 _bfw7ia51 _1nrm1r31 _c2waglyw _1iohnqa1" : "_uizt1kdv"])
   }), props.children);
 });
 var WrapperAnchor = exports.WrapperAnchor = /*#__PURE__*/(0, _react.forwardRef)(function (_ref2, ref) {
@@ -42,7 +42,7 @@ var WrapperAnchor = exports.WrapperAnchor = /*#__PURE__*/(0, _react.forwardRef)(
     href: href,
     ref: ref
   }, props, {
-    className: (0, _runtime.ax)(["_1yt4x7n9 _2rko12b0 _v56415x0 _1e0c1nu9 _16d9qvcn _syaz13af _1rkwglyw _4cvx1w55", truncateInline && "_1reo15vq _18m915vq _ca0qidpf _u5f3idpf _n3tdidpf _19bvidpf _1bto1l2s _1nmz9jpi _1e0c1abx _1yyjkb7n _sudp1e54 _nr8z1o8l _1voyv77o _3kwxidpf _jqg5v77o _6vwiidpf", truncateInline && viewType === 'unauthorised' && "_syaz15cr", withoutBackground ? "_19bvidpf _18u01i6y" : "_19itia51 _bfhkhp5a _1a3b1r31 _4fprglyw _5goinqa1 _9oik1r31 _1bnxglyw _jf4cnqa1 _1nrm1r31 _c2waglyw _1iohnqa1", isHovered && "_1h6d1w55", isHovered && !withoutBackground && "_4bfu1r31 _1hmsglyw _ajmmnqa1", isSelected ? "_12ji1r31 _1qu2glyw _12y31o36 _80omtlke _16qsw5lj _uiztglyw _1a3b1r31 _4fprglyw _5goinqa1 _9oik1r31 _1bnxglyw _jf4cnqa1 _bfw7ia51 _1nrm1r31 _c2waglyw _1iohnqa1" : "_uizt1kdv", isInteractive && "_nt751r31 _49pcglyw _1hvw1o36 _1372tlke _7ehiw5lj _1j5pglyw _1di615s3", viewType === 'errored' && "_4bfu1r31 _1hms8stv _ajmmnqa1 _9oik1r31 _1bnxglyw _jf4cnqa1"])
+    className: (0, _runtime.ax)(["_1yt4x7n9 _2rko1ssi _v56415x0 _1e0c1nu9 _16d9qvcn _syaz13af _1rkwglyw _4cvx1w55", truncateInline && "_1reo15vq _18m915vq _ca0qidpf _u5f3idpf _n3tdidpf _19bvidpf _1bto1l2s _1nmz9jpi _1e0c1abx _1yyjkb7n _sudp1e54 _nr8z1o8l _1voyv77o _3kwxidpf _jqg5v77o _6vwiidpf", truncateInline && viewType === 'unauthorised' && "_syaz15cr", withoutBackground ? "_19bvidpf _18u01i6y" : "_19itia51 _bfhkhp5a _1a3b1r31 _4fprglyw _5goinqa1 _9oik1r31 _1bnxglyw _jf4cnqa1 _1nrm1r31 _c2waglyw _1iohnqa1", isHovered && "_1h6d1w55", isHovered && !withoutBackground && "_4bfu1r31 _1hmsglyw _ajmmnqa1", isSelected ? "_12ji1r31 _1qu2glyw _12y31o36 _80omtlke _16qsw5lj _uiztglyw _1a3b1r31 _4fprglyw _5goinqa1 _9oik1r31 _1bnxglyw _jf4cnqa1 _bfw7ia51 _1nrm1r31 _c2waglyw _1iohnqa1" : "_uizt1kdv", isInteractive && "_nt751r31 _49pcglyw _1hvw1o36 _1372tlke _7ehiw5lj _1j5pglyw _1di615s3", viewType === 'errored' && "_4bfu1r31 _1hms8stv _ajmmnqa1 _9oik1r31 _1bnxglyw _jf4cnqa1"])
   }), props.children);
 });
 var baseWrapperStyles = null;

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

@@ -5,12 +5,14 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.InlineCardResolvedView = void 0;
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
 var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
 var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
 var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
 var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
 var _react = _interopRequireDefault(require("react"));
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _HoverCard = require("../../HoverCard");
 var _inlineLozenge = _interopRequireDefault(require("../common/inline-lozenge"));
 var _Frame = require("../Frame");
@@ -26,18 +28,37 @@ var InlineCardResolvedView = exports.InlineCardResolvedView = /*#__PURE__*/funct
   return (0, _createClass2.default)(InlineCardResolvedView, [{
     key: "renderLozenge",
     value: function renderLozenge() {
-      var _lozenge$style, _lozenge$style2;
+      var _lozenge$style3, _lozenge$style4;
       var lozenge = this.props.lozenge;
-      if (!lozenge) {
+      if (!lozenge || !(lozenge !== null && lozenge !== void 0 && lozenge.text)) {
         return null;
       }
+      if ((0, _platformFeatureFlags.fg)('platform-dst-lozenge-tag-badge-visual-uplifts')) {
+        var stateMetricMatch = lozenge.text.match(/^(.+?)\s+-\s+(\d+(?:\.\d+)?)$/);
+        if (stateMetricMatch) {
+          var _lozenge$style, _lozenge$style2;
+          var _stateMetricMatch = (0, _slicedToArray2.default)(stateMetricMatch, 3),
+            label = _stateMetricMatch[1],
+            metric = _stateMetricMatch[2];
+          var _appearance = lozenge.appearance || 'neutral';
+          return /*#__PURE__*/_react.default.createElement(_inlineLozenge.default, {
+            testId: "inline-card-resolved-view-lozenge",
+            appearance: _appearance,
+            style: {
+              backgroundColor: lozenge === null || lozenge === void 0 || (_lozenge$style = lozenge.style) === null || _lozenge$style === void 0 ? void 0 : _lozenge$style.backgroundColor,
+              color: lozenge === null || lozenge === void 0 || (_lozenge$style2 = lozenge.style) === null || _lozenge$style2 === void 0 ? void 0 : _lozenge$style2.color
+            },
+            trailingMetric: metric
+          }, label);
+        }
+      }
       var appearance = lozenge.appearance || 'default';
       return /*#__PURE__*/_react.default.createElement(_inlineLozenge.default, {
         testId: "inline-card-resolved-view-lozenge",
         appearance: appearance,
         style: {
-          backgroundColor: lozenge === null || lozenge === void 0 || (_lozenge$style = lozenge.style) === null || _lozenge$style === void 0 ? void 0 : _lozenge$style.backgroundColor,
-          color: lozenge === null || lozenge === void 0 || (_lozenge$style2 = lozenge.style) === null || _lozenge$style2 === void 0 ? void 0 : _lozenge$style2.color
+          backgroundColor: lozenge === null || lozenge === void 0 || (_lozenge$style3 = lozenge.style) === null || _lozenge$style3 === void 0 ? void 0 : _lozenge$style3.backgroundColor,
+          color: lozenge === null || lozenge === void 0 || (_lozenge$style4 = lozenge.style) === null || _lozenge$style4 === void 0 ? void 0 : _lozenge$style4.color
         },
         isBold: lozenge.isBold !== false
       }, lozenge.text);

package/dist/cjs/view/InlineCard/common/inline-lozenge/index.compiled.css

@@ -3,6 +3,7 @@
 ._19pkidpf{margin-top:0}
 ._1e0c1o8l{display:inline-block}
 ._2hwx1b66{margin-right:var(--ds-space-050,4px)}
+._2hwxt94y{margin-right:1px}
 ._kqswh2mm{position:relative}
 ._otyridpf{margin-bottom:0}
 ._p12f1osq{max-width:100%}

package/dist/cjs/view/InlineCard/common/inline-lozenge/index.js

@@ -17,19 +17,20 @@ var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
 var wrapperStylesOld = null;
 var wrapperStylesNew = null;
+var wrapperStylesNewLozenge = null;
 var InlineLozenge = function InlineLozenge(props) {
   var shouldAddLozengeAttribute = (0, _expValEquals.expValEquals)('confluence_compact_text_format', 'isEnabled', true) || (0, _expValEquals.expValEquals)('cc_editor_ai_content_mode', 'variant', 'test') && (0, _platformFeatureFlags.fg)('platform_editor_content_mode_button_mvp');
   if ((0, _platformFeatureFlags.fg)('jfp-magma-platform-lozenge-jump-fix')) {
     return /*#__PURE__*/React.createElement("span", (0, _extends2.default)({}, shouldAddLozengeAttribute && {
       'data-inline-card-lozenge': true
     }, {
-      className: (0, _runtime.ax)(["_1e0c1o8l _154i1n1a _kqswh2mm _19pkidpf _2hwx1b66 _otyridpf _18u0v77o _p12f1osq"])
+      className: (0, _runtime.ax)(["_1e0c1o8l _154i1n1a _kqswh2mm _19pkidpf _2hwx1b66 _otyridpf _18u0v77o _p12f1osq", (0, _platformFeatureFlags.fg)('platform-dst-lozenge-tag-badge-visual-uplifts') && "_2hwxt94y"])
     }), /*#__PURE__*/React.createElement(_lozenge.default, props));
   }
   return /*#__PURE__*/React.createElement("span", (0, _extends2.default)({}, shouldAddLozengeAttribute && {
     'data-inline-card-lozenge': true
   }, {
-    className: (0, _runtime.ax)(["_1e0c1o8l _s7n4t94y _19pkidpf _2hwx1b66 _otyridpf _18u0v77o _p12f1osq"])
+    className: (0, _runtime.ax)(["_1e0c1o8l _s7n4t94y _19pkidpf _2hwx1b66 _otyridpf _18u0v77o _p12f1osq", (0, _platformFeatureFlags.fg)('platform-dst-lozenge-tag-badge-visual-uplifts') && "_2hwxt94y"])
   }), /*#__PURE__*/React.createElement(_lozenge.default, props));
 };
 var _default = exports.default = InlineLozenge;

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

@@ -22,7 +22,7 @@ var _excluded = ["href", "children", "checkSafety", "onClick", "testId", "isLink
   _excluded2 = ["isLinkSafe", "showSafetyWarningModal"];
 var PACKAGE_DATA = {
   packageName: "@atlaskit/smart-card",
-  packageVersion: "0.0.0-development",
+  packageVersion: "43.28.7",
   componentName: 'linkUrl'
 };
 var Anchor = (0, _click.withLinkClickedEvent)('a');