@atlaskit/smart-card 18.0.7 → 18.0.10

package/CHANGELOG.md

@@ -1,5 +1,23 @@
 # @atlaskit/smart-card
 
+## 18.0.10
+
+### Patch Changes
+
+- [`b687926f768`](https://bitbucket.org/atlassian/atlassian-frontend/commits/b687926f768) - Fix bug where individual action item was not hidden by default with showActionOnHover flag
+
+## 18.0.9
+
+### Patch Changes
+
+- [`6adaa6b5c18`](https://bitbucket.org/atlassian/atlassian-frontend/commits/6adaa6b5c18) - Updated default renderer onClick to not fire on a Flexible UI link to prevent links from being openned twice
+
+## 18.0.8
+
+### Patch Changes
+
+- [`d9b55e7cd29`](https://bitbucket.org/atlassian/atlassian-frontend/commits/d9b55e7cd29) - Add classname for placeholder element that is shown while we load js module
+
 ## 18.0.7
 
 ### Patch Changes

package/dist/cjs/version.json

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

package/dist/cjs/view/CardWithUrl/component.js

@@ -80,7 +80,11 @@ function CardWithUrlContent(_ref) {
       analytics.ui.cardClickedEvent(isFlexibleUi ? 'flexible' : appearance, definitionId, extensionKey, isModifierKeyPressed);
     }
 
-    onClick ? onClick(event) : handleClick(event);
+    if (onClick) {
+      onClick(event);
+    } else if (!isFlexibleUi) {
+      handleClick(event);
+    }
   }, [state.status, analytics.ui, appearance, definitionId, extensionKey, onClick, handleClick, isFlexibleUi]);
   var handleAuthorize = (0, _react.useCallback)(function () {
     return actions.authorize(appearance);

package/dist/cjs/view/CardWithUrl/loader.js

@@ -23,7 +23,7 @@ var _reactErrorBoundary = require("react-error-boundary");
 
 var _ufoExperiences = require("../../state/analytics/ufoExperiences");
 
-var _LinkView = require("../LinkView");
+var _LazyFallback = require("./component-lazy/LazyFallback");
 
 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); }
 
@@ -106,15 +106,7 @@ function CardWithURLRenderer(props) {
     throw new Error('@atlaskit/smart-card: url property is missing.');
   }
 
-  return /*#__PURE__*/_react.default.createElement(_reactErrorBoundary.ErrorBoundary, {
-    FallbackComponent: ErrorFallback,
-    onError: logError
-  }, /*#__PURE__*/_react.default.createElement(_react.Suspense, {
-    fallback: /*#__PURE__*/_react.default.createElement(_LinkView.CardLinkView, {
-      key: 'chunk-placeholder',
-      link: url
-    })
-  }, /*#__PURE__*/_react.default.createElement(LazyCardWithUrlContent, {
+  var cardWithUrlProps = {
     id: id,
     url: url,
     appearance: appearance,
@@ -131,7 +123,13 @@ function CardWithURLRenderer(props) {
     embedIframeRef: embedIframeRef,
     inlinePreloaderStyle: inlinePreloaderStyle,
     ui: ui
-  }, children)));
+  };
+  return /*#__PURE__*/_react.default.createElement(_reactErrorBoundary.ErrorBoundary, {
+    FallbackComponent: ErrorFallback,
+    onError: logError
+  }, /*#__PURE__*/_react.default.createElement(_react.Suspense, {
+    fallback: /*#__PURE__*/_react.default.createElement(_LazyFallback.LoadingCardLink, cardWithUrlProps)
+  }, /*#__PURE__*/_react.default.createElement(LazyCardWithUrlContent, cardWithUrlProps, children)));
 }
 
 var ErrorFallback = function ErrorFallback() {

package/dist/cjs/view/FlexibleCard/components/blocks/action-group/index.js

@@ -48,7 +48,8 @@ var ActionGroup = function ActionGroup(_ref) {
   var firstActions = isMoreThenTwoItems ? items.slice(0, visibleButtonsNum - 1) : items;
   var restActions = isMoreThenTwoItems ? items.slice(visibleButtonsNum - 1) : [];
   return (0, _core.jsx)("div", {
-    css: styles
+    css: styles,
+    className: "actions-button-group"
   }, (0, _core.jsx)(_buttonGroup.default, null, (0, _utils.renderActionItems)(firstActions, size, appearance), restActions.length > 0 ? (0, _core.jsx)(_dropdownMenu.default, {
     onOpenChange: function onOpenChange(_ref2) {
       var isOpen = _ref2.isOpen;
@@ -59,7 +60,6 @@ var ActionGroup = function ActionGroup(_ref) {
           props = (0, _objectWithoutProperties2.default)(_ref3, _excluded);
       return (0, _core.jsx)(_standardButton.default, (0, _extends2.default)({}, props, {
         spacing: _action.sizeToSpacing[size],
-        className: "action-group-more-button",
         testId: "action-group-more-button",
         iconBefore: (0, _core.jsx)(_more.default, {
           label: "more"

package/dist/cjs/view/FlexibleCard/components/blocks/title-block/utils.js

@@ -41,7 +41,7 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 
 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; }
 
-var actionOnHoverOnlyStyle = (0, _core.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  .action-group-more-button {\n    visibility: hidden;\n  }\n\n  &:hover {\n    .action-group-more-button {\n      visibility: visible;\n    }\n  }\n"])));
+var actionOnHoverOnlyStyle = (0, _core.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  .actions-button-group {\n    visibility: hidden;\n  }\n\n  &:hover {\n    .actions-button-group {\n      visibility: visible;\n    }\n  }\n"])));
 exports.actionOnHoverOnlyStyle = actionOnHoverOnlyStyle;
 
 var BaseTitleBlockComponent = function BaseTitleBlockComponent(_ref) {

package/dist/es2019/version.json

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

package/dist/es2019/view/CardWithUrl/component.js

@@ -52,7 +52,11 @@ export function CardWithUrlContent({
       analytics.ui.cardClickedEvent(isFlexibleUi ? 'flexible' : appearance, definitionId, extensionKey, isModifierKeyPressed);
     }
 
-    onClick ? onClick(event) : handleClick(event);
+    if (onClick) {
+      onClick(event);
+    } else if (!isFlexibleUi) {
+      handleClick(event);
+    }
   }, [state.status, analytics.ui, appearance, definitionId, extensionKey, onClick, handleClick, isFlexibleUi]);
   const handleAuthorize = useCallback(() => actions.authorize(appearance), [actions, appearance]);
   const handleRetry = useCallback(() => {

package/dist/es2019/view/CardWithUrl/loader.js

@@ -4,7 +4,7 @@ import { uiRenderFailedEvent, fireSmartLinkEvent } from '../../utils/analytics';
 import { clearMarks, clearMeasures } from '../../utils/performance';
 import { ErrorBoundary } from 'react-error-boundary';
 import { failUfoExperience, startUfoExperience } from '../../state/analytics/ufoExperiences';
-import { CardLinkView } from '../LinkView';
+import { LoadingCardLink } from './component-lazy/LazyFallback';
 const LazyCardWithUrlContent = /*#__PURE__*/lazy(() => import(
 /* webpackChunkName: "@atlaskit-internal_smartcard-urlcardcontent" */
 './component-lazy/index'));
@@ -78,32 +78,30 @@ export function CardWithURLRenderer(props) {
     throw new Error('@atlaskit/smart-card: url property is missing.');
   }
 
+  const cardWithUrlProps = {
+    id,
+    url,
+    appearance,
+    onClick,
+    isSelected,
+    isFrameVisible,
+    dispatchAnalytics,
+    container,
+    onResolve,
+    testId,
+    showActions,
+    inheritDimensions,
+    platform,
+    embedIframeRef,
+    inlinePreloaderStyle,
+    ui
+  };
   return /*#__PURE__*/React.createElement(ErrorBoundary, {
     FallbackComponent: ErrorFallback,
     onError: logError
   }, /*#__PURE__*/React.createElement(Suspense, {
-    fallback: /*#__PURE__*/React.createElement(CardLinkView, {
-      key: 'chunk-placeholder',
-      link: url
-    })
-  }, /*#__PURE__*/React.createElement(LazyCardWithUrlContent, {
-    id: id,
-    url: url,
-    appearance: appearance,
-    onClick: onClick,
-    isSelected: isSelected,
-    isFrameVisible: isFrameVisible,
-    dispatchAnalytics: dispatchAnalytics,
-    container: container,
-    onResolve: onResolve,
-    testId: testId,
-    showActions: showActions,
-    inheritDimensions: inheritDimensions,
-    platform: platform,
-    embedIframeRef: embedIframeRef,
-    inlinePreloaderStyle: inlinePreloaderStyle,
-    ui: ui
-  }, children)));
+    fallback: /*#__PURE__*/React.createElement(LoadingCardLink, cardWithUrlProps)
+  }, /*#__PURE__*/React.createElement(LazyCardWithUrlContent, cardWithUrlProps, children)));
 }
 
 const ErrorFallback = () => {

package/dist/es2019/view/FlexibleCard/components/blocks/action-group/index.js

@@ -25,7 +25,8 @@ const ActionGroup = ({
   const firstActions = isMoreThenTwoItems ? items.slice(0, visibleButtonsNum - 1) : items;
   const restActions = isMoreThenTwoItems ? items.slice(visibleButtonsNum - 1) : [];
   return jsx("div", {
-    css: styles
+    css: styles,
+    className: "actions-button-group"
   }, jsx(ButtonGroup, null, renderActionItems(firstActions, size, appearance), restActions.length > 0 ? jsx(DropdownMenu, {
     onOpenChange: ({
       isOpen
@@ -35,7 +36,6 @@ const ActionGroup = ({
       ...props
     }) => jsx(Button, _extends({}, props, {
       spacing: sizeToSpacing[size],
-      className: "action-group-more-button",
       testId: "action-group-more-button",
       iconBefore: jsx(MoreIcon, {
         label: "more"

package/dist/es2019/view/FlexibleCard/components/blocks/title-block/utils.js

@@ -11,12 +11,12 @@ import { SmartLinkAlignment, SmartLinkWidth, SmartLinkDirection } from '../../..
 import ElementGroup from '../element-group';
 import { renderElementItems } from '../utils';
 export const actionOnHoverOnlyStyle = css`
-  .action-group-more-button {
+  .actions-button-group {
     visibility: hidden;
   }
 
   &:hover {
-    .action-group-more-button {
+    .actions-button-group {
       visibility: visible;
     }
   }

package/dist/esm/version.json

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

package/dist/esm/view/CardWithUrl/component.js

@@ -54,7 +54,11 @@ export function CardWithUrlContent(_ref) {
       analytics.ui.cardClickedEvent(isFlexibleUi ? 'flexible' : appearance, definitionId, extensionKey, isModifierKeyPressed);
     }
 
-    onClick ? onClick(event) : handleClick(event);
+    if (onClick) {
+      onClick(event);
+    } else if (!isFlexibleUi) {
+      handleClick(event);
+    }
   }, [state.status, analytics.ui, appearance, definitionId, extensionKey, onClick, handleClick, isFlexibleUi]);
   var handleAuthorize = useCallback(function () {
     return actions.authorize(appearance);

package/dist/esm/view/CardWithUrl/loader.js

@@ -5,7 +5,7 @@ import { uiRenderFailedEvent, fireSmartLinkEvent } from '../../utils/analytics';
 import { clearMarks, clearMeasures } from '../../utils/performance';
 import { ErrorBoundary } from 'react-error-boundary';
 import { failUfoExperience, startUfoExperience } from '../../state/analytics/ufoExperiences';
-import { CardLinkView } from '../LinkView';
+import { LoadingCardLink } from './component-lazy/LazyFallback';
 var LazyCardWithUrlContent = /*#__PURE__*/lazy(function () {
   return import(
   /* webpackChunkName: "@atlaskit-internal_smartcard-urlcardcontent" */
@@ -82,15 +82,7 @@ export function CardWithURLRenderer(props) {
     throw new Error('@atlaskit/smart-card: url property is missing.');
   }
 
-  return /*#__PURE__*/React.createElement(ErrorBoundary, {
-    FallbackComponent: ErrorFallback,
-    onError: logError
-  }, /*#__PURE__*/React.createElement(Suspense, {
-    fallback: /*#__PURE__*/React.createElement(CardLinkView, {
-      key: 'chunk-placeholder',
-      link: url
-    })
-  }, /*#__PURE__*/React.createElement(LazyCardWithUrlContent, {
+  var cardWithUrlProps = {
     id: id,
     url: url,
     appearance: appearance,
@@ -107,7 +99,13 @@ export function CardWithURLRenderer(props) {
     embedIframeRef: embedIframeRef,
     inlinePreloaderStyle: inlinePreloaderStyle,
     ui: ui
-  }, children)));
+  };
+  return /*#__PURE__*/React.createElement(ErrorBoundary, {
+    FallbackComponent: ErrorFallback,
+    onError: logError
+  }, /*#__PURE__*/React.createElement(Suspense, {
+    fallback: /*#__PURE__*/React.createElement(LoadingCardLink, cardWithUrlProps)
+  }, /*#__PURE__*/React.createElement(LazyCardWithUrlContent, cardWithUrlProps, children)));
 }
 
 var ErrorFallback = function ErrorFallback() {

package/dist/esm/view/FlexibleCard/components/blocks/action-group/index.js

@@ -29,7 +29,8 @@ var ActionGroup = function ActionGroup(_ref) {
   var firstActions = isMoreThenTwoItems ? items.slice(0, visibleButtonsNum - 1) : items;
   var restActions = isMoreThenTwoItems ? items.slice(visibleButtonsNum - 1) : [];
   return jsx("div", {
-    css: styles
+    css: styles,
+    className: "actions-button-group"
   }, jsx(ButtonGroup, null, renderActionItems(firstActions, size, appearance), restActions.length > 0 ? jsx(DropdownMenu, {
     onOpenChange: function onOpenChange(_ref2) {
       var isOpen = _ref2.isOpen;
@@ -41,7 +42,6 @@ var ActionGroup = function ActionGroup(_ref) {
 
       return jsx(Button, _extends({}, props, {
         spacing: sizeToSpacing[size],
-        className: "action-group-more-button",
         testId: "action-group-more-button",
         iconBefore: jsx(MoreIcon, {
           label: "more"

package/dist/esm/view/FlexibleCard/components/blocks/title-block/utils.js

@@ -16,7 +16,7 @@ import ActionGroup from '../action-group';
 import { SmartLinkAlignment, SmartLinkWidth, SmartLinkDirection } from '../../../../../constants';
 import ElementGroup from '../element-group';
 import { renderElementItems } from '../utils';
-export var actionOnHoverOnlyStyle = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  .action-group-more-button {\n    visibility: hidden;\n  }\n\n  &:hover {\n    .action-group-more-button {\n      visibility: visible;\n    }\n  }\n"])));
+export var actionOnHoverOnlyStyle = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  .actions-button-group {\n    visibility: hidden;\n  }\n\n  &:hover {\n    .actions-button-group {\n      visibility: visible;\n    }\n  }\n"])));
 export var BaseTitleBlockComponent = function BaseTitleBlockComponent(_ref) {
   var children = _ref.children,
       blockTestIdPostfix = _ref.blockTestIdPostfix,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/smart-card",
-  "version": "18.0.7",
+  "version": "18.0.10",
   "description": "Smart card component",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"