@atlaskit/smart-card 42.0.3 → 42.1.0

package/dist/esm/view/FlexibleCard/components/common/loading-skeleton/index.compiled.css

@@ -1,7 +1,7 @@
 
 ._2rkolb4i{border-radius:var(--ds-radius-xsmall,2px)}._12vemgnk{background-repeat:no-repeat}
 ._1e0c1o8l{display:inline-block}
-._1itkx3i8{background-image:var(--_16116mi)}
+._1itkvl7m{background-image:linear-gradient(to right,transparent 0,var(--ds-skeleton,#edeef1) 20%,transparent 40%,transparent 100%)}
 ._1lrw6rms{background-size:280% 100%}
 ._1o51q7pw{animation-fill-mode:forwards}
 ._1pglp3kn{animation-timing-function:linear}

package/dist/esm/view/FlexibleCard/components/common/loading-skeleton/index.js

@@ -1,4 +1,4 @@
-/* index.tsx generated by @compiled/babel-plugin v0.36.1 */
+/* index.tsx generated by @compiled/babel-plugin v0.38.1 */
 import "./index.compiled.css";
 import * as React from 'react';
 import { ax, ix } from "@compiled/react/runtime";
@@ -10,11 +10,10 @@ export var LoadingSkeleton = function LoadingSkeleton(_ref) {
     height = _ref.height;
   return /*#__PURE__*/React.createElement("span", {
     "data-testid": testId,
-    className: ax(["_2rkolb4i _uiztglyw _bfhk178v _1itkx3i8 _12vemgnk _1lrw6rms _1e0c1o8l _5sag9cwz _1o51q7pw _tip812c5 _j7hqqkar _1pglp3kn"]),
     style: {
       width: width,
-      height: height,
-      "--_16116mi": ix("linear-gradient( to right, transparent 0%, ".concat("var(--ds-skeleton, #edeef1)", " 20%, transparent 40%, transparent 100% )"))
-    }
+      height: height
+    },
+    className: ax(["_2rkolb4i _uiztglyw _bfhk178v _1itkvl7m _12vemgnk _1lrw6rms _1e0c1o8l _5sag9cwz _1o51q7pw _tip812c5 _j7hqqkar _1pglp3kn"])
   });
 };

package/dist/esm/view/FlexibleCard/components/container/index.compiled.css

@@ -1,20 +1,23 @@
 
-._19itkzr3{border:var(--_1hbmzy2)}
+._19it7r9e{border:var(--ds-border-width,1px) solid var(--ds-border,#091e4224)}
 ._1yt418y6{padding:var(--_1xumd0e)}
 ._2rkopb1k{border-radius:var(--ds-radius-xlarge,9pt)}
 ._zulp1bpf{gap:var(--ds-space-100,8px) 0}
 ._zulpr2fv{gap:var(--ds-space-250,20px) 0}
 ._zulpswc3{gap:var(--ds-space-050,4px) 0}
 ._zulpzu5n{gap:var(--ds-space-200,1pc) 0}._18u0v77o{margin-left:var(--ds-space-025,2px)}
+._18ywh2mm a{position:relative}
 ._19bv16ru{padding-left:calc(var(--preview-block-width) + var(--ds-space-250, 20px))}
 ._19bv1g7w{padding-left:calc(var(--preview-block-width) + var(--ds-space-200, 1pc))}
 ._19bver0k{padding-left:calc(var(--preview-block-width) + var(--ds-space-300, 24px))}
 ._19bvlbes{padding-left:calc(var(--preview-block-width) + var(--ds-space-100, 8px))}
 ._19pkv77o{margin-top:var(--ds-space-025,2px)}
 ._1e0c1txw{display:flex}
+._1nq3h2mm button{position:relative}
+._1nxdkb7n a{z-index:1}
 ._1pcmkb7n:hover~.actions-button-group{opacity:1}
 ._1reo15vq{overflow-x:hidden}
-._1t4ckb7n .has-action, ._1nxdkb7n a, ._xnbykb7n button{z-index:1}
+._1t4ckb7n .has-action{z-index:1}
 ._1ul9idpf{min-width:0}
 ._1yob1eak{--container-gap-right:var(--ds-space-200,16px)}
 ._1yob1ejb{--container-gap-right:var(--ds-space-300,24px)}
@@ -26,16 +29,18 @@
 ._bfhkhp5a{background-color:var(--ds-surface-raised,#fff)}
 ._jb7v18y6{--container-padding:var(--_1xumd0e)}
 ._kqswh2mm{position:relative}
-._nqwih2mm .has-action, ._18ywh2mm a, ._1nq3h2mm button{position:relative}
+._nqwih2mm .has-action{position:relative}
 ._otyrv77o{margin-bottom:var(--ds-space-025,2px)}
 ._r37x1r5k{--preview-block-width:30%}
 ._u5f316ru{padding-right:calc(var(--preview-block-width) + var(--ds-space-250, 20px))}
 ._u5f31g7w{padding-right:calc(var(--preview-block-width) + var(--ds-space-200, 1pc))}
 ._u5f3er0k{padding-right:calc(var(--preview-block-width) + var(--ds-space-300, 24px))}
 ._u5f3lbes{padding-right:calc(var(--preview-block-width) + var(--ds-space-100, 8px))}
+._xnbykb7n button{z-index:1}
 ._y5vk167t{--container-gap-left:var(--_73mooq)}
 ._y5vk1eak{--container-gap-left:var(--ds-space-200,16px)}
 ._y5vk1ejb{--container-gap-left:var(--ds-space-300,24px)}
 ._y5vku2gc{--container-gap-left:var(--ds-space-100,8px)}
 ._y5vkv47k{--container-gap-left:var(--ds-space-250,20px)}
-._1v7y1i6y .has-action:focus, ._ufn21i6y a:focus{outline-offset:var(--ds-space-negative-025,-2px)}
+._1v7y1i6y .has-action:focus{outline-offset:var(--ds-space-negative-025,-2px)}
+._ufn21i6y a:focus{outline-offset:var(--ds-space-negative-025,-2px)}

package/dist/esm/view/FlexibleCard/components/container/index.js

@@ -1,4 +1,4 @@
-/* index.tsx generated by @compiled/babel-plugin v0.36.1 */
+/* index.tsx generated by @compiled/babel-plugin v0.38.1 */
 /* eslint-disable @atlaskit/design-system/consistent-css-prop-usage */
 /* eslint-disable @atlaskit/ui-styling-standard/no-unsafe-values */
 import "./index.compiled.css";
@@ -193,12 +193,11 @@ var Container = function Container(_ref3) {
   var container = /*#__PURE__*/React.createElement("div", {
     "data-smart-link-container": true,
     "data-testid": testId,
-    className: ax(["_1e0c1txw _2lx21bp4 _1ul9idpf _1reo15vq _kqswh2mm _1pcmkb7n _1v7y1i6y _ufn21i6y", gapStyleMap[size], !hideBackground && "_bfhkhp5a", "_1yt418y6 _jb7v18y6 _y5vk167t _1yob1wow _r37x1r5k", previewOnLeft && previewOnLeftStyleMap[size], previewOnRight && previewOnRightStyleMap[size], !hideElevation && "_19itkzr3 _2rkopb1k _19pkv77o _2hwxv77o _otyrv77o _18u0v77o", clickableContainer && "_nqwih2mm _18ywh2mm _1nq3h2mm _1t4ckb7n _1nxdkb7n _xnbykb7n"]),
+    className: ax(["_1e0c1txw _2lx21bp4 _1ul9idpf _1reo15vq _kqswh2mm _1pcmkb7n _1v7y1i6y _ufn21i6y", gapStyleMap[size], !hideBackground && "_bfhkhp5a", "_1yt418y6 _jb7v18y6 _y5vk167t _1yob1wow _r37x1r5k", previewOnLeft && previewOnLeftStyleMap[size], previewOnRight && previewOnRightStyleMap[size], !hideElevation && "_19it7r9e _2rkopb1k _19pkv77o _2hwxv77o _otyrv77o _18u0v77o", clickableContainer && "_nqwih2mm _18ywh2mm _1nq3h2mm _1t4ckb7n _1nxdkb7n _xnbykb7n"]),
     style: {
       "--_1xumd0e": ix(padding),
       "--_73mooq": ix(previewOnLeft ? gap : padding),
-      "--_12k13bg": ix(previewOnRight ? gap : padding),
-      "--_1hbmzy2": ix("var(--ds-border-width, 1px)".concat(" solid ", "var(--ds-border, #091E4224)"))
+      "--_12k13bg": ix(previewOnRight ? gap : padding)
     }
   }, clickableContainer ? getLayeredLink(testId, context, children, onClick) : null, filterChildren(children, removeBlockRestriction));
   if (context !== null && context !== void 0 && context.url && (canShowHoverPreview || canShowAuthTooltip)) {

package/dist/esm/view/FlexibleCard/components/container/layered-link/index.js

@@ -1,4 +1,4 @@
-/* index.tsx generated by @compiled/babel-plugin v0.36.1 */
+/* index.tsx generated by @compiled/babel-plugin v0.38.1 */
 import "./index.compiled.css";
 import * as React from 'react';
 import { ax, ix } from "@compiled/react/runtime";

package/dist/esm/view/FlexibleCard/components/elements/common/base-atlaskit-badge-element/index.js

@@ -1,4 +1,4 @@
-/* index.tsx generated by @compiled/babel-plugin v0.36.1 */
+/* index.tsx generated by @compiled/babel-plugin v0.38.1 */
 import "./index.compiled.css";
 import * as React from 'react';
 import { ax, ix } from "@compiled/react/runtime";

package/dist/esm/view/FlexibleCard/components/elements/common/base-avatar-group-element/index.js

@@ -1,4 +1,4 @@
-/* index.tsx generated by @compiled/babel-plugin v0.36.1 */
+/* index.tsx generated by @compiled/babel-plugin v0.38.1 */
 import _extends from "@babel/runtime/helpers/extends";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import "./index.compiled.css";

package/dist/esm/view/FlexibleCard/components/elements/common/base-badge-element/index.compiled.css

@@ -1,15 +1,38 @@
 ._11c81o8v{font:var(--ds-font-body-small,normal 400 11px/1pc ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
 ._zulp1b66{gap:var(--ds-space-050,4px)}
-._19bvze3t, ._1xr1ze3t img, ._9n9oze3t span, ._7wy9ze3t svg{padding-left:var(--ds-space-0,0)}
-._1bsb7vkz, ._mezj7vkz img, ._e2oo7vkz span, ._w8l57vkz svg{width:1pc}
-._1e0c116y, ._v4pn116y img, ._1b94116y span, ._1ii7116y svg{display:inline-flex}
+._14bqze3t img{padding-top:var(--ds-space-0,0)}
+._17527vkz svg{height:1pc}
+._19bvze3t{padding-left:var(--ds-space-0,0)}
+._1b94116y span{display:inline-flex}
+._1bsb7vkz{width:1pc}
 ._1e0c116y{display:inline-flex}
+._1ii7116y svg{display:inline-flex}
+._1m2uze3t span{padding-bottom:var(--ds-space-0,0)}
+._1oh2ze3t span{padding-top:var(--ds-space-0,0)}
 ._1ul91ns9{min-width:-moz-fit-content;min-width:fit-content}
+._1xjx7vkz span{height:1pc}
+._1xr1ze3t img{padding-left:var(--ds-space-0,0)}
+._1ym6ze3t img{padding-bottom:var(--ds-space-0,0)}
+._3tceze3t img{padding-right:var(--ds-space-0,0)}
 ._4cvr1h6o{align-items:center}
-._4t3i7vkz, ._bna77vkz img, ._1xjx7vkz span, ._17527vkz svg{height:1pc}
-._ca0qze3t, ._14bqze3t img, ._1oh2ze3t span, ._i2i3ze3t svg{padding-top:var(--ds-space-0,0)}
-._n3tdze3t, ._1ym6ze3t img, ._1m2uze3t span, ._5jw9ze3t svg{padding-bottom:var(--ds-space-0,0)}
-._s7n4nkob, ._rtqbnkob img, ._e4kmnkob span, ._z239nkob svg{vertical-align:middle}
+._4t3i7vkz{height:1pc}
+._5jw9ze3t svg{padding-bottom:var(--ds-space-0,0)}
+._7wy9ze3t svg{padding-left:var(--ds-space-0,0)}
+._99ztze3t span{padding-right:var(--ds-space-0,0)}
+._9n9oze3t span{padding-left:var(--ds-space-0,0)}
+._bna77vkz img{height:1pc}
+._ca0qze3t{padding-top:var(--ds-space-0,0)}
+._e2oo7vkz span{width:1pc}
+._e4kmnkob span{vertical-align:middle}
+._i2i3ze3t svg{padding-top:var(--ds-space-0,0)}
+._mezj7vkz img{width:1pc}
+._n3tdze3t{padding-bottom:var(--ds-space-0,0)}
+._rtqbnkob img{vertical-align:middle}
+._s7n4nkob{vertical-align:middle}
 ._syaz131l{color:var(--ds-text-subtlest,#626f86)}
 ._syaz1gjq{color:var(--ds-text-subtle,#44546f)}
-._u5f3ze3t, ._3tceze3t img, ._99ztze3t span, ._uhasze3t svg{padding-right:var(--ds-space-0,0)}
+._u5f3ze3t{padding-right:var(--ds-space-0,0)}
+._uhasze3t svg{padding-right:var(--ds-space-0,0)}
+._v4pn116y img{display:inline-flex}
+._w8l57vkz svg{width:1pc}
+._z239nkob svg{vertical-align:middle}

package/dist/esm/view/FlexibleCard/components/elements/common/base-badge-element/index.js

@@ -1,4 +1,4 @@
-/* index.tsx generated by @compiled/babel-plugin v0.36.1 */
+/* index.tsx generated by @compiled/babel-plugin v0.38.1 */
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 var _messageMapper;
 import "./index.compiled.css";

package/dist/esm/view/FlexibleCard/components/elements/common/base-date-time-element/index.js

@@ -1,4 +1,4 @@
-/* index.tsx generated by @compiled/babel-plugin v0.36.1 */
+/* index.tsx generated by @compiled/babel-plugin v0.38.1 */
 import _extends from "@babel/runtime/helpers/extends";
 import "./index.compiled.css";
 import * as React from 'react';

package/dist/esm/view/FlexibleCard/components/elements/common/base-icon-element/index.js

@@ -1,4 +1,4 @@
-/* index.tsx generated by @compiled/babel-plugin v0.36.1 */
+/* index.tsx generated by @compiled/babel-plugin v0.38.1 */
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import _typeof from "@babel/runtime/helpers/typeof";
 import "./index.compiled.css";

package/dist/esm/view/FlexibleCard/components/elements/common/base-link-element/index.compiled.css

@@ -1,3 +1,4 @@
+
 ._11c82smr{font:var(--ds-font-body,normal 400 14px/20px ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
 ._11c8dcr7{font:var(--ds-font-body-UNSAFE_small,normal 400 9pt/1pc ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
 ._11c8lodh{font:var(--ds-font-heading-medium,normal 500 20px/24px ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
@@ -19,18 +20,38 @@ a._10uedcr7{font:var(--ds-font-body-UNSAFE_small,normal 400 9pt/1pc ui-sans-seri
 ._syaz1gjq{color:var(--ds-text-subtle,#44546f)}
 ._vwz41j6v{line-height:1rem}
 ._vwz41k8s{line-height:1.5rem}
-a._ye10131l{color:var(--ds-text-subtlest,#626f86)}
+a._ye10131l{color:var(--ds-text-subtlest,#626f86)}._10531gjq:visited{color:var(--ds-text-subtle,#44546f)}
+._1726nqa1:visited{text-decoration-style:solid}
+._1x288stv:visited{text-decoration-line:underline}
+._1ydc1r31:visited{text-decoration-color:currentColor}
+a._1h4d131l:visited{color:var(--ds-text-subtlest,#626f86)}
+a._64n6nqa1:visited{text-decoration-style:solid}
+a._pnzf1r31:visited{text-decoration-color:currentColor}
+a._ue8d8stv:visited{text-decoration-line:underline}
+._1a3b1r31:focus{text-decoration-color:currentColor}
+._4fpr8stv:focus{text-decoration-line:underline}
+._5goinqa1:focus{text-decoration-style:solid}
+._f8pj1gjq:focus{color:var(--ds-text-subtle,#44546f)}
+a._1bianqa1:focus{text-decoration-style:solid}
+a._1e2m8stv:focus{text-decoration-line:underline}
+a._93u91r31:focus{text-decoration-color:currentColor}
+a._dlb7131l:focus{color:var(--ds-text-subtlest,#626f86)}
 ._1bnx8stv:hover{text-decoration-line:underline}
 ._30l314q2:hover{color:var(--ds-link,#0c66e4)}
+._30l31gjq:hover{color:var(--ds-text-subtle,#44546f)}
 ._9oik1r31:hover{text-decoration-color:currentColor}
 ._jf4cnqa1:hover{text-decoration-style:solid}
-._1iohnqa1:active, ._5goinqa1:focus, ._jf4cnqa1:hover, ._1726nqa1:visited{text-decoration-style:solid}
-._1nrm1r31:active, ._1a3b1r31:focus, ._9oik1r31:hover, ._1ydc1r31:visited{text-decoration-color:currentColor}
+a._1l4b8stv:hover{text-decoration-line:underline}
+a._93jhnqa1:hover{text-decoration-style:solid}
+a._g2lk1r31:hover{text-decoration-color:currentColor}
+a._rnxt131l:hover{color:var(--ds-text-subtlest,#626f86)}
+._1iohnqa1:active{text-decoration-style:solid}
+._1nrm1r31:active{text-decoration-color:currentColor}
 ._9h8h16c2:active{color:var(--ds-link-pressed,#05c)}
-._9h8h1gjq:active, ._f8pj1gjq:focus, ._30l31gjq:hover, ._10531gjq:visited{color:var(--ds-text-subtle,#44546f)}
-._c2wa8stv:active, ._4fpr8stv:focus, ._1bnx8stv:hover, ._1x288stv:visited{text-decoration-line:underline}
-a._1ray131l:active, a._dlb7131l:focus, a._rnxt131l:hover, a._1h4d131l:visited{color:var(--ds-text-subtlest,#626f86)}
-a._fjv61r31:active, a._93u91r31:focus, a._g2lk1r31:hover, a._pnzf1r31:visited{text-decoration-color:currentColor}
-a._hlwq8stv:active, a._1e2m8stv:focus, a._1l4b8stv:hover, a._ue8d8stv:visited{text-decoration-line:underline}
-a._yni7nqa1:active, a._1bianqa1:focus, a._93jhnqa1:hover, a._64n6nqa1:visited{text-decoration-style:solid}
+._9h8h1gjq:active{color:var(--ds-text-subtle,#44546f)}
+._c2wa8stv:active{text-decoration-line:underline}
+a._1ray131l:active{color:var(--ds-text-subtlest,#626f86)}
+a._fjv61r31:active{text-decoration-color:currentColor}
+a._hlwq8stv:active{text-decoration-line:underline}
+a._yni7nqa1:active{text-decoration-style:solid}
 @supports not (-webkit-line-clamp:1){._102k1j6v{max-height:1rem}._102k1k8s{max-height:1.5rem}._102k1wto{max-height:3rem}._102kviql{max-height:2rem}}

package/dist/esm/view/FlexibleCard/components/elements/common/base-link-element/index.js

@@ -1,4 +1,4 @@
-/* index.tsx generated by @compiled/babel-plugin v0.36.1 */
+/* index.tsx generated by @compiled/babel-plugin v0.38.1 */
 import _extends from "@babel/runtime/helpers/extends";
 import "./index.compiled.css";
 import { ax, ix } from "@compiled/react/runtime";

package/dist/esm/view/FlexibleCard/components/elements/common/base-lozenge-element/index.js

@@ -1,4 +1,4 @@
-/* index.tsx generated by @compiled/babel-plugin v0.36.1 */
+/* index.tsx generated by @compiled/babel-plugin v0.38.1 */
 import _extends from "@babel/runtime/helpers/extends";
 import "./index.compiled.css";
 import * as React from 'react';

package/dist/esm/view/FlexibleCard/components/elements/common/base-lozenge-element/lozenge-action/lozenge-action-error/index.compiled.css

@@ -1,6 +1,7 @@
+._102e2smr >span{font:var(--ds-font-body,normal 400 14px/20px ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
 ._11c81ixg{font:var(--ds-font-body-large,normal 400 1pc/24px ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
 ._11c82smr{font:var(--ds-font-body,normal 400 14px/20px ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
-._pqme2smr >div, ._102e2smr >span{font:var(--ds-font-body,normal 400 14px/20px ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
+._pqme2smr >div{font:var(--ds-font-body,normal 400 14px/20px ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
 ._zulpu2gc{gap:var(--ds-space-100,8px)}
 ._14hp1wdt button{width:220px}
 ._18m915vq{overflow-y:hidden}
@@ -15,6 +16,7 @@
 ._1e0ccj1k{display:-webkit-box}
 ._1nmz1hna{word-break:break-word}
 ._1reo15vq{overflow-x:hidden}
+._1t4p1fxt >span{color:var(--ds-text,#172b4d)}
 ._1ul9idpf{min-width:0}
 ._1yyj1n6p{-webkit-line-clamp:var(--_t4prqe)}
 ._2lx2vrvc{flex-direction:row}
@@ -24,7 +26,7 @@
 ._bfhk1j28{background-color:transparent}
 ._ca0qze3t{padding-top:var(--ds-space-0,0)}
 ._n3tdze3t{padding-bottom:var(--ds-space-0,0)}
-._ngc01fxt >div, ._1t4p1fxt >span{color:var(--ds-text,#172b4d)}
+._ngc01fxt >div{color:var(--ds-text,#172b4d)}
 ._o5724jg8{white-space:normal}
 ._otyrv77o{margin-bottom:var(--ds-space-025,2px)}
 ._sudp1e54{-webkit-box-orient:vertical}

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

@@ -1,4 +1,4 @@
-/* index.tsx generated by @compiled/babel-plugin v0.36.1 */
+/* index.tsx generated by @compiled/babel-plugin v0.38.1 */
 import "./index.compiled.css";
 import * as React from 'react';
 import { ax, ix } from "@compiled/react/runtime";

package/dist/esm/view/FlexibleCard/components/elements/common/base-lozenge-element/lozenge-action/lozenge-action-items-group/index.compiled.css

@@ -1,3 +1,4 @@
+
 ._11lvutpp button{padding-left:var(--ds-space-150,9pt)}
 ._14hp1wdt button{width:220px}
 ._18m91wug{overflow-y:auto}
@@ -6,10 +7,15 @@
 ._c71l1mjv{max-height:300px}
 ._d4lf1f4h button{min-height:28px}
 ._yhjmutpp button{padding-right:var(--ds-space-150,9pt)}
-._1ll7166n button:focus, ._qprf166n button:focus-visible{background-color:var(--ds-background-neutral-subtle-hovered,#091e420f)}
-._1pv01r31 button:focus, ._1m1b1r31 button:focus-visible{outline-color:currentColor}
-._n6y8usvi button:focus, ._109gusvi button:focus-visible{box-sizing:border-box}
-._ph3k1o36 button:focus, ._1twe1o36 button:focus-visible{outline-width:medium}
-._qh55glyw button:focus, ._lt2aglyw button:focus-visible{outline-style:none}
-._z29h1bda button:focus, ._wlxp1bda button:focus-visible{box-shadow:var(--_1uho1ce)}
+._1ll7166n button:focus{background-color:var(--ds-background-neutral-subtle-hovered,#091e420f)}
+._1pv01r31 button:focus{outline-color:currentColor}
+._n6y8usvi button:focus{box-sizing:border-box}
+._ph3k1o36 button:focus{outline-width:medium}
+._qh55glyw button:focus{outline-style:none}
+._z29hu4to button:focus{box-shadow:inset 2px 0 0 var(--ds-border-selected,#0c66e4)}._109gusvi button:focus-visible{box-sizing:border-box}
+._1m1b1r31 button:focus-visible{outline-color:currentColor}
+._1twe1o36 button:focus-visible{outline-width:medium}
+._lt2aglyw button:focus-visible{outline-style:none}
+._qprf166n button:focus-visible{background-color:var(--ds-background-neutral-subtle-hovered,#091e420f)}
+._wlxpu4to button:focus-visible{box-shadow:inset 2px 0 0 var(--ds-border-selected,#0c66e4)}
 ._6pup1kw7 button:hover{background-color:inherit}

package/dist/esm/view/FlexibleCard/components/elements/common/base-lozenge-element/lozenge-action/lozenge-action-items-group/index.js

@@ -1,4 +1,4 @@
-/* index.tsx generated by @compiled/babel-plugin v0.36.1 */
+/* index.tsx generated by @compiled/babel-plugin v0.38.1 */
 import _extends from "@babel/runtime/helpers/extends";
 import "./index.compiled.css";
 import * as React from 'react';
@@ -12,10 +12,7 @@ var LozengeActionItemsGroup = function LozengeActionItemsGroup(_ref) {
     onClick = _ref.onClick;
   return /*#__PURE__*/React.createElement("span", {
     "data-testid": "".concat(testId, "-item-group"),
-    className: ax(["_c71l1mjv _18m91wug _1pv01r31 _1m1b1r31 _qh55glyw _lt2aglyw _ph3k1o36 _1twe1o36 _1ll7166n _qprf166n _n6y8usvi _109gusvi _z29h1bda _wlxp1bda _1gfl12x7 _yhjmutpp _1gqn12x7 _11lvutpp _d4lf1f4h _14hp1wdt _6pup1kw7"]),
-    style: {
-      "--_1uho1ce": ix("inset 2px 0 0 ".concat("var(--ds-border-selected, #0C66E4)"))
-    }
+    className: ax(["_c71l1mjv _18m91wug _1pv01r31 _1m1b1r31 _qh55glyw _lt2aglyw _ph3k1o36 _1twe1o36 _1ll7166n _qprf166n _n6y8usvi _109gusvi _z29hu4to _wlxpu4to _1gfl12x7 _yhjmutpp _1gqn12x7 _11lvutpp _d4lf1f4h _14hp1wdt _6pup1kw7"])
   }, /*#__PURE__*/React.createElement(DropdownItemGroup, null, items.map(function (item, idx) {
     return /*#__PURE__*/React.createElement(LozengeActionItem, _extends({}, item, {
       key: idx,

package/dist/esm/view/FlexibleCard/components/elements/common/base-lozenge-element/lozenge-action/lozenge-action-trigger/index.compiled.css

@@ -1,5 +1,6 @@
 
 ._kkk2n7od{all:unset}
+._1d3914y2[aria-expanded=true]{border-radius:5px}
 ._2rko12b0{border-radius:var(--ds-radius-small,4px)}
 ._15vhn7od{font-variant:unset}
 ._189e1dm9{border-width:var(--ds-border-width-selected,2px)}
@@ -14,23 +15,32 @@
 ._19pkv77o{margin-top:var(--ds-space-025,2px)}
 ._1e0c1txw{display:flex}
 ._1p1dn7od{text-transform:unset}
+._1q2vglyw[aria-expanded=true]{outline-style:none}
 ._1reo15vq{overflow-x:hidden}
 ._1wybn7od{font-size:unset}
 ._2hwxv77o{margin-right:var(--ds-space-025,2px)}
 ._4cvr1h6o{align-items:center}
 ._4t3i7vkz{height:1pc}
+._6ssh1vm4[aria-expanded=true]{box-shadow:0 0 0 2px var(--ds-border-focused,#388bff)}
 ._80omtlke{cursor:pointer}
 ._bfhk1j28{background-color:transparent}
 ._ca0qidpf{padding-top:0}
 ._ect4n7od{font-family:unset}
+._j8b81o36[aria-expanded=true]{outline-width:medium}
 ._k48pn7od{font-weight:unset}
 ._n3tdidpf{padding-bottom:0}
 ._otyrv77o{margin-bottom:var(--ds-space-025,2px)}
+._p8tl1r31[aria-expanded=true]{outline-color:currentColor}
 ._syazn7od{color:unset}
 ._u5f3idpf{padding-right:0}
 ._vwz4idpf{line-height:0}
 ._zg8ln7od{font-style:unset}
-._1bas14y2:focus-visible, ._19h614y2:focus-within, ._1d3914y2[aria-expanded=true]{border-radius:5px}._128m1o36:focus-visible, ._11ow1o36:focus-within, ._j8b81o36[aria-expanded=true]{outline-width:medium}
-._1ejjo89b:focus-visible, ._1u6lo89b:focus-within, ._6ssho89b[aria-expanded=true]{box-shadow:var(--_sq39bb)}
-._mizu1r31:focus-visible, ._1guj1r31:focus-within, ._p8tl1r31[aria-expanded=true]{outline-color:currentColor}
-._ra3xglyw:focus-visible, ._pbhaglyw:focus-within, ._1q2vglyw[aria-expanded=true]{outline-style:none}
+._19h614y2:focus-within{border-radius:5px}._11ow1o36:focus-within{outline-width:medium}
+._1guj1r31:focus-within{outline-color:currentColor}
+._1u6l1vm4:focus-within{box-shadow:0 0 0 2px var(--ds-border-focused,#388bff)}
+._pbhaglyw:focus-within{outline-style:none}
+._1bas14y2:focus-visible{border-radius:5px}
+._128m1o36:focus-visible{outline-width:medium}
+._1ejj1vm4:focus-visible{box-shadow:0 0 0 2px var(--ds-border-focused,#388bff)}
+._mizu1r31:focus-visible{outline-color:currentColor}
+._ra3xglyw:focus-visible{outline-style:none}

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

@@ -1,4 +1,4 @@
-/* index.tsx generated by @compiled/babel-plugin v0.36.1 */
+/* index.tsx generated by @compiled/babel-plugin v0.38.1 */
 import _extends from "@babel/runtime/helpers/extends";
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
@@ -112,10 +112,7 @@ var LozengeActionTrigger = function LozengeActionTrigger(_ref) {
     onKeyDown: onMouseOrKeyDown,
     onKeyUp: onMouseOrKeyUp,
     ref: triggerRef,
-    className: ax(["_kkk2n7od _ca0qidpf _u5f3idpf _n3tdidpf _19bvidpf _15vhn7od _1dqonqa1 _189e1dm9 _1h6d1j28 _bfhk1j28 _syazn7od _80omtlke _ect4n7od _1wybn7od _zg8ln7od _k48pn7od _vwz4idpf _1p1dn7od _19pkv77o _2hwxv77o _otyrv77o _18u0v77o _mizu1r31 _1guj1r31 _p8tl1r31 _ra3xglyw _pbhaglyw _1q2vglyw _128m1o36 _11ow1o36 _j8b81o36 _1bas14y2 _19h614y2 _1d3914y2 _1ejjo89b _1u6lo89b _6ssho89b"]),
-    style: {
-      "--_sq39bb": ix("0 0 0 2px ".concat("var(--ds-border-focused, #388BFF)"))
-    }
+    className: ax(["_kkk2n7od _ca0qidpf _u5f3idpf _n3tdidpf _19bvidpf _15vhn7od _1dqonqa1 _189e1dm9 _1h6d1j28 _bfhk1j28 _syazn7od _80omtlke _ect4n7od _1wybn7od _zg8ln7od _k48pn7od _vwz4idpf _1p1dn7od _19pkv77o _2hwxv77o _otyrv77o _18u0v77o _mizu1r31 _1guj1r31 _p8tl1r31 _ra3xglyw _pbhaglyw _1q2vglyw _128m1o36 _11ow1o36 _j8b81o36 _1bas14y2 _19h614y2 _1d3914y2 _1ejj1vm4 _1u6l1vm4 _6ssh1vm4"])
   }), lozenge);
 };
 export default LozengeActionTrigger;

package/dist/esm/view/FlexibleCard/components/elements/common/base-text-element/index.js

@@ -1,4 +1,4 @@
-/* index.tsx generated by @compiled/babel-plugin v0.36.1 */
+/* index.tsx generated by @compiled/babel-plugin v0.38.1 */
 import "./index.compiled.css";
 import * as React from 'react';
 import { ax, ix } from "@compiled/react/runtime";

package/dist/esm/view/FlexibleCard/components/elements/custom-by-access-type-element/index.js

@@ -1,4 +1,4 @@
-/* index.tsx generated by @compiled/babel-plugin v0.36.1 */
+/* index.tsx generated by @compiled/babel-plugin v0.38.1 */
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["className", "testId"];

package/dist/esm/view/FlexibleCard/components/elements/media-element/index.compiled.css

@@ -1,11 +1,17 @@
-._173baqso >img, ._1niwaqso >span{object-position:center center}
+._173baqso >img{object-position:center center}
 ._1bsb1osq{width:100%}
-._1chb1osq >img, ._1usb1osq >span{max-height:100%}
+._1chb1osq >img{max-height:100%}
 ._1e0c1txw{display:flex}
 ._1h1tcq2i{aspect-ratio:16/9}
+._1lg71osq >span{min-height:100%}
+._1niwaqso >span{object-position:center center}
+._1usb1osq >span{max-height:100%}
 ._4t3i1ns9{height:-moz-fit-content;height:fit-content}
-._5c331osq >img, ._l9z01osq >span{max-width:100%}
-._6o691dfr >img, ._vr2g1dfr >span{object-fit:cover}
-._6slq1osq >img, ._x1m21osq >span{min-width:100%}
-._jqez1osq >img, ._1lg71osq >span{min-height:100%}
-@supports not (aspect-ratio:auto){._1aoq15vq{overflow-x:hidden}._1iqz15vq{overflow-y:hidden}._6fioj63w{padding-top:56.25%}._l0jmidpf{height:0}._12zuh2mm{position:relative}._t0h9stnw >img, ._1ulbstnw >span{position:absolute}._byj21ooe >img, ._3hvr1ooe >span{transform:translate(-50%,-50%)}._1c0s1ssb >img, ._15j31ssb >span{left:50%}._1npy1ssb >img, ._19he1ssb >span{top:50%}._n3vc1wug >img, ._1qj91wug >span{width:auto}._4fdy1wug >img, ._18cv1wug >span{height:auto}}
+._5c331osq >img{max-width:100%}
+._6o691dfr >img{object-fit:cover}
+._6slq1osq >img{min-width:100%}
+._jqez1osq >img{min-height:100%}
+._l9z01osq >span{max-width:100%}
+._vr2g1dfr >span{object-fit:cover}
+._x1m21osq >span{min-width:100%}
+@supports not (aspect-ratio:auto){._1aoq15vq{overflow-x:hidden}._1iqz15vq{overflow-y:hidden}._6fioj63w{padding-top:56.25%}._l0jmidpf{height:0}._12zuh2mm{position:relative}._t0h9stnw >img{position:absolute}._1ulbstnw >span{position:absolute}._byj21ooe >img{transform:translate(-50%,-50%)}._3hvr1ooe >span{transform:translate(-50%,-50%)}._1c0s1ssb >img{left:50%}._15j31ssb >span{left:50%}._1npy1ssb >img{top:50%}._19he1ssb >span{top:50%}._n3vc1wug >img{width:auto}._1qj91wug >span{width:auto}._4fdy1wug >img{height:auto}._18cv1wug >span{height:auto}}

package/dist/esm/view/FlexibleCard/components/elements/media-element/index.js

@@ -1,4 +1,4 @@
-/* index.tsx generated by @compiled/babel-plugin v0.36.1 */
+/* index.tsx generated by @compiled/babel-plugin v0.38.1 */
 import "./index.compiled.css";
 import * as React from 'react';
 import { ax, ix } from "@compiled/react/runtime";

package/dist/esm/view/FlexibleCard/components/elements/snippet-element/index.js

@@ -1,4 +1,4 @@
-/* index.tsx generated by @compiled/babel-plugin v0.36.1 */
+/* index.tsx generated by @compiled/babel-plugin v0.38.1 */
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["content", "maxLines", "className"];

package/dist/esm/view/HoverCard/components/ContentContainer.js

@@ -1,4 +1,4 @@
-/* ContentContainer.tsx generated by @compiled/babel-plugin v0.36.1 */
+/* ContentContainer.tsx generated by @compiled/babel-plugin v0.38.1 */
 import _extends from "@babel/runtime/helpers/extends";
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";

package/dist/esm/view/HoverCard/components/views/forbidden/index.js

@@ -1,4 +1,4 @@
-/* index.tsx generated by @compiled/babel-plugin v0.36.1 */
+/* index.tsx generated by @compiled/babel-plugin v0.38.1 */
 import _extends from "@babel/runtime/helpers/extends";
 import "./index.compiled.css";
 import * as React from 'react';

package/dist/esm/view/HoverCard/components/views/resolved/index.js

@@ -1,4 +1,4 @@
-/* index.tsx generated by @compiled/babel-plugin v0.36.1 */
+/* index.tsx generated by @compiled/babel-plugin v0.38.1 */
 import _extends from "@babel/runtime/helpers/extends";
 import "./index.compiled.css";
 import { ax, ix } from "@compiled/react/runtime";

package/dist/esm/view/HoverCard/components/views/resolving/index.js

@@ -1,4 +1,4 @@
-/* index.tsx generated by @compiled/babel-plugin v0.36.1 */
+/* index.tsx generated by @compiled/babel-plugin v0.38.1 */
 import _extends from "@babel/runtime/helpers/extends";
 import "./index.compiled.css";
 import { ax, ix } from "@compiled/react/runtime";

package/dist/esm/view/HoverCard/components/views/unauthorised/index.js

@@ -1,4 +1,4 @@
-/* index.tsx generated by @compiled/babel-plugin v0.36.1 */
+/* index.tsx generated by @compiled/babel-plugin v0.38.1 */
 import _extends from "@babel/runtime/helpers/extends";
 import "./index.compiled.css";
 import * as React from 'react';

package/dist/esm/view/InlineCard/ErroredView/index.js

@@ -1,4 +1,4 @@
-/* index.tsx generated by @compiled/babel-plugin v0.36.1 */
+/* index.tsx generated by @compiled/babel-plugin v0.38.1 */
 import { ax, ix } from "@compiled/react/runtime";
 import React from 'react';
 import { FormattedMessage } from 'react-intl-next';

package/dist/esm/view/InlineCard/ForbiddenView/index.js

@@ -1,4 +1,4 @@
-/* index.tsx generated by @compiled/babel-plugin v0.36.1 */
+/* index.tsx generated by @compiled/babel-plugin v0.38.1 */
 import _extends from "@babel/runtime/helpers/extends";
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import "./index.compiled.css";

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

@@ -1,4 +1,4 @@
-/* styled.tsx generated by @compiled/babel-plugin v0.36.1 */
+/* styled.tsx generated by @compiled/babel-plugin v0.38.1 */
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["truncateInline", "withoutBackground", "isHovered", "isInteractive", "isSelected", "href"],

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

@@ -1,4 +1,4 @@
-/* Icon.tsx generated by @compiled/babel-plugin v0.36.1 */
+/* Icon.tsx generated by @compiled/babel-plugin v0.38.1 */
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["as", "style"];

package/dist/esm/view/InlineCard/IconAndTitleLayout/index.js

@@ -1,4 +1,4 @@
-/* index.tsx generated by @compiled/babel-plugin v0.36.1 */
+/* index.tsx generated by @compiled/babel-plugin v0.38.1 */
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";

package/dist/esm/view/InlineCard/IconAndTitleLayout/styled.js

@@ -1,4 +1,4 @@
-/* styled.tsx generated by @compiled/babel-plugin v0.36.1 */
+/* styled.tsx generated by @compiled/babel-plugin v0.38.1 */
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["as", "style"];

package/dist/esm/view/InlineCard/ResolvingView/index.js

@@ -1,4 +1,4 @@
-/* index.tsx generated by @compiled/babel-plugin v0.36.1 */
+/* index.tsx generated by @compiled/babel-plugin v0.38.1 */
 import "./index.compiled.css";
 import { ax, ix } from "@compiled/react/runtime";
 import React from 'react';

package/dist/esm/view/InlineCard/UnauthorisedView/index.js

@@ -1,4 +1,4 @@
-/* index.tsx generated by @compiled/babel-plugin v0.36.1 */
+/* index.tsx generated by @compiled/babel-plugin v0.38.1 */
 import _extends from "@babel/runtime/helpers/extends";
 import { ax, ix } from "@compiled/react/runtime";
 import React from 'react';

package/dist/esm/view/InlineCard/common/action-button/index.js

@@ -1,4 +1,4 @@
-/* index.tsx generated by @compiled/babel-plugin v0.36.1 */
+/* index.tsx generated by @compiled/babel-plugin v0.38.1 */
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["children", "isDisabled"];

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

@@ -1,4 +1,4 @@
-/* index.tsx generated by @compiled/babel-plugin v0.36.1 */
+/* index.tsx generated by @compiled/babel-plugin v0.38.1 */
 import "./index.compiled.css";
 import * as React from 'react';
 import { ax, ix } from "@compiled/react/runtime";

package/dist/esm/view/LinkUrl/HyperlinkResolver/index.js

@@ -8,10 +8,11 @@ import FeatureGates from '@atlaskit/feature-gate-js-client';
 import { extractSmartLinkProvider } from '@atlaskit/link-extractors';
 import { fg } from '@atlaskit/platform-feature-flags';
 import { SmartCardContext } from '../../../state';
-import { getServices } from '../../../state/helpers';
+import { getFirstPartyIdentifier, getServices, getThirdPartyARI } from '../../../state/helpers';
 import useResolveHyperlink from '../../../state/hooks/use-resolve-hyperlink';
 import useResolveHyperlinkValidator, { isGoogleDomain, isSharePointDomain } from '../../../state/hooks/use-resolve-hyperlink/useResolveHyperlinkValidator';
 import withIntlProvider from '../../common/intl-provider';
+import { useFire3PWorkflowsClickEvent } from '../../SmartLinkEvents/useSmartLinkEvents';
 import Hyperlink from '../Hyperlink';
 import withErrorBoundary from './error-boundary';
 import { ResolveHyperlink } from './resolve-hyperlink';
@@ -34,11 +35,20 @@ var HyperlinkWithSmartLinkResolverInner = function HyperlinkWithSmartLinkResolve
     actions = _useResolveHyperlink.actions,
     state = _useResolveHyperlink.state;
   var services = getServices(state === null || state === void 0 ? void 0 : state.details);
+  var thirdPartyARI = getThirdPartyARI(state === null || state === void 0 ? void 0 : state.details);
+  var firstPartyIdentifier = getFirstPartyIdentifier();
+  var fire3PClickEvent = fg('platform_smartlink_3pclick_analytics') ?
+  // eslint-disable-next-line react-hooks/rules-of-hooks
+  useFire3PWorkflowsClickEvent(firstPartyIdentifier, thirdPartyARI) : undefined;
   var onClick = useCallback(function (e) {
-    // TODO: AI3W-1203: 3P link click analytics
-
+    // Only fire the event if the feature flag is on and other conditions are met
+    if ((state === null || state === void 0 ? void 0 : state.status) === 'resolved' && (e === null || e === void 0 ? void 0 : e.button) === 0 && fire3PClickEvent && fg('platform_smartlink_3pclick_analytics')) {
+      // 0 taken from button state representation -
+      // https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/button
+      fire3PClickEvent();
+    }
     onClickCallback === null || onClickCallback === void 0 || onClickCallback(e);
-  }, [onClickCallback]);
+  }, [onClickCallback, fire3PClickEvent, state === null || state === void 0 ? void 0 : state.status]);
 
   // TODO: AI3W-1113: Show auth button
   var onAuthorize = fg('platform_linking_plain_hyperlink_connect_button') ?