@atlaskit/smart-card 35.2.12 → 36.0.0

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

@@ -1,104 +0,0 @@
-import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
-import _createClass from "@babel/runtime/helpers/createClass";
-import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
-import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
-import _inherits from "@babel/runtime/helpers/inherits";
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e)); }
-function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
-import React from 'react';
-import { FormattedMessage } from 'react-intl-next';
-import ButtonOld from '@atlaskit/button';
-import ErrorIcon from '@atlaskit/icon/utility/migration/error';
-import { fg } from '@atlaskit/platform-feature-flags';
-import { Box, xcss } from '@atlaskit/primitives';
-import { R300 } from '@atlaskit/theme/colors';
-import { messages } from '../../../messages';
-import { HoverCard } from '../../HoverCard';
-import { Frame } from '../Frame';
-import { AKIconWrapper } from '../Icon';
-import { AKIconWrapper as AKIconWrapperOld } from '../Icon-emotion';
-import { IconAndTitleLayout } from '../IconAndTitleLayout';
-import { IconStyledButtonOldVisualRefresh } from '../styled';
-import { IconStyledButton as IconStyledButtonOld } from '../styled-emotion';
-import withFrameStyleControl from '../utils/withFrameStyleControl';
-var iconWrapperStyles = xcss({
-  marginRight: 'space.negative.025'
-});
-export var InlineCardErroredViewOld = /*#__PURE__*/function (_React$Component) {
-  function InlineCardErroredViewOld() {
-    var _this;
-    _classCallCheck(this, InlineCardErroredViewOld);
-    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-      args[_key] = arguments[_key];
-    }
-    _this = _callSuper(this, InlineCardErroredViewOld, [].concat(args));
-    _defineProperty(_this, "frameRef", /*#__PURE__*/React.createRef());
-    _defineProperty(_this, "handleRetry", function (event) {
-      var onRetry = _this.props.onRetry;
-      if (onRetry) {
-        event.preventDefault();
-        event.stopPropagation();
-        onRetry();
-      }
-    });
-    _defineProperty(_this, "renderActionButton", function () {
-      var onRetry = _this.props.onRetry;
-      var Button = withFrameStyleControl(ButtonOld, _this.frameRef);
-      return onRetry && /*#__PURE__*/React.createElement(Button, {
-        spacing: "none",
-        component: fg('bandicoots-compiled-migration-smartcard') ? IconStyledButtonOldVisualRefresh : IconStyledButtonOld,
-        onClick: _this.handleRetry,
-        role: "button"
-      }, /*#__PURE__*/React.createElement(FormattedMessage, messages.try_again));
-    });
-    return _this;
-  }
-  _inherits(InlineCardErroredViewOld, _React$Component);
-  return _createClass(InlineCardErroredViewOld, [{
-    key: "render",
-    value: function render() {
-      var _this$props = this.props,
-        url = _this$props.url,
-        onClick = _this$props.onClick,
-        isSelected = _this$props.isSelected,
-        _this$props$testId = _this$props.testId,
-        testId = _this$props$testId === void 0 ? 'inline-card-errored-view' : _this$props$testId,
-        icon = _this$props.icon,
-        message = _this$props.message,
-        truncateInline = _this$props.truncateInline;
-      var Wrapper = fg('bandicoots-compiled-migration-smartcard') ? AKIconWrapper : AKIconWrapperOld;
-      var content = /*#__PURE__*/React.createElement(Frame, {
-        testId: testId,
-        isSelected: isSelected,
-        ref: this.frameRef,
-        truncateInline: truncateInline
-      }, /*#__PURE__*/React.createElement(IconAndTitleLayout, {
-        icon: icon || (fg('platform-smart-card-icon-migration') ? /*#__PURE__*/React.createElement(Box, {
-          as: "span",
-          xcss: iconWrapperStyles
-        }, /*#__PURE__*/React.createElement(ErrorIcon, {
-          color: "var(--ds-icon-danger, #C9372C)",
-          label: "error",
-          LEGACY_size: "small",
-          testId: "errored-view-default-icon"
-        })) : /*#__PURE__*/React.createElement(Wrapper, null, /*#__PURE__*/React.createElement(ErrorIcon, {
-          label: "error",
-          LEGACY_size: "small",
-          color: "var(--ds-icon-danger, ".concat(R300, ")"),
-          testId: "errored-view-default-icon"
-        }))),
-        link: url,
-        title: url,
-        onClick: onClick,
-        rightSide: message
-      }), this.renderActionButton());
-      if (this.props.showHoverPreview) {
-        return /*#__PURE__*/React.createElement(HoverCard, {
-          url: url
-        }, content);
-      }
-      return content;
-    }
-  }]);
-}(React.Component);

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

@@ -1,179 +0,0 @@
-import _extends from "@babel/runtime/helpers/extends";
-import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
-import _createClass from "@babel/runtime/helpers/createClass";
-import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
-import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
-import _inherits from "@babel/runtime/helpers/inherits";
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e)); }
-function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
-import React from 'react';
-import { FormattedMessage } from 'react-intl-next';
-import ButtonOld from '@atlaskit/button';
-import LockLockedIcon from '@atlaskit/icon/core/lock-locked';
-import LegacyLockIcon from '@atlaskit/icon/glyph/lock-filled';
-import Lozenge from '@atlaskit/lozenge';
-import { fg } from '@atlaskit/platform-feature-flags';
-import { Box, xcss } from '@atlaskit/primitives';
-import { N500, R400 } from '@atlaskit/theme/colors';
-import { messages } from '../../../messages';
-import { HoverCard } from '../../HoverCard';
-import { Frame } from '../Frame';
-import { AKIconWrapper } from '../Icon';
-import { AKIconWrapper as AKIconWrapperOld } from '../Icon-emotion';
-import { IconAndTitleLayout, LozengeWrapper } from '../IconAndTitleLayout';
-import { IconStyledButtonOldVisualRefresh } from '../styled';
-import { IconStyledButton as IconStyledButtonOld } from '../styled-emotion';
-import withFrameStyleControl from '../utils/withFrameStyleControl';
-var iconWrapperStyles = xcss({
-  marginRight: 'space.negative.025'
-});
-var fallbackForbiddenIcon = function fallbackForbiddenIcon() {
-  if (fg('bandicoots-compiled-migration-smartcard')) {
-    return fg('platform-smart-card-icon-migration') ? /*#__PURE__*/React.createElement(Box, {
-      as: "span",
-      xcss: iconWrapperStyles
-    }, /*#__PURE__*/React.createElement(LockLockedIcon, {
-      label: "error",
-      color: "var(--ds-icon-danger, #C9372C)",
-      LEGACY_fallbackIcon: LegacyLockIcon,
-      LEGACY_size: "small",
-      testId: "forbidden-view-fallback-icon"
-    })) : /*#__PURE__*/React.createElement(AKIconWrapper, null, /*#__PURE__*/React.createElement(LegacyLockIcon, {
-      label: "error",
-      size: "small",
-      primaryColor: "var(--ds-icon-danger, ".concat(R400, ")"),
-      testId: "forbidden-view-fallback-icon"
-    }));
-  } else {
-    return fg('platform-smart-card-icon-migration') ? /*#__PURE__*/React.createElement(Box, {
-      as: "span",
-      xcss: iconWrapperStyles
-    }, /*#__PURE__*/React.createElement(LockLockedIcon, {
-      label: "error",
-      color: "var(--ds-icon-danger, #C9372C)",
-      LEGACY_fallbackIcon: LegacyLockIcon,
-      LEGACY_size: "small",
-      testId: "forbidden-view-fallback-icon"
-    })) : /*#__PURE__*/React.createElement(AKIconWrapperOld, null, /*#__PURE__*/React.createElement(LegacyLockIcon, {
-      label: "error",
-      size: "small",
-      primaryColor: "var(--ds-icon-danger, ".concat(R400, ")"),
-      testId: "forbidden-view-fallback-icon"
-    }));
-  }
-};
-export var InlineCardForbiddenViewOld = /*#__PURE__*/function (_React$Component) {
-  function InlineCardForbiddenViewOld() {
-    var _this$props;
-    var _this;
-    _classCallCheck(this, InlineCardForbiddenViewOld);
-    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-      args[_key] = arguments[_key];
-    }
-    _this = _callSuper(this, InlineCardForbiddenViewOld, [].concat(args));
-    _defineProperty(_this, "frameRef", /*#__PURE__*/React.createRef());
-    _defineProperty(_this, "state", {
-      hasRequestAccessContextMessage: !!((_this$props = _this.props) !== null && _this$props !== void 0 && (_this$props = _this$props.requestAccessContext) !== null && _this$props !== void 0 && _this$props.callToActionMessageKey)
-    });
-    _defineProperty(_this, "handleRetry", function (event) {
-      var onAuthorise = _this.props.onAuthorise;
-      event.preventDefault();
-      event.stopPropagation();
-      if (onAuthorise) {
-        onAuthorise();
-      } else {
-        var _this$props2;
-        (_this$props2 = _this.props) === null || _this$props2 === void 0 || (_this$props2 = _this$props2.requestAccessContext) === null || _this$props2 === void 0 || (_this$props2 = _this$props2.action) === null || _this$props2 === void 0 || _this$props2.promise();
-      }
-    });
-    _defineProperty(_this, "renderForbiddenAccessMessage", function () {
-      var _this$props3;
-      if ((_this$props3 = _this.props) !== null && _this$props3 !== void 0 && (_this$props3 = _this$props3.requestAccessContext) !== null && _this$props3 !== void 0 && _this$props3.callToActionMessageKey) {
-        var callToActionMessageKey = _this.props.requestAccessContext.callToActionMessageKey;
-        return /*#__PURE__*/React.createElement(FormattedMessage, _extends({}, messages[callToActionMessageKey], {
-          values: {
-            product: _this.props.context
-          }
-        }));
-      }
-      return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(FormattedMessage, messages.invalid_permissions, function (formattedMessage) {
-        return /*#__PURE__*/React.createElement(React.Fragment, null, formattedMessage);
-      }));
-    });
-    _defineProperty(_this, "renderActionButton", function () {
-      var _this$props$requestAc;
-      var onAuthorise = _this.props.onAuthorise;
-      var Button = withFrameStyleControl(ButtonOld, _this.frameRef);
-      var accessType = (_this$props$requestAc = _this.props.requestAccessContext) === null || _this$props$requestAc === void 0 ? void 0 : _this$props$requestAc.accessType;
-      if (_this.state.hasRequestAccessContextMessage) {
-        if (fg('bandicoots-compiled-migration-smartcard')) {
-          return /*#__PURE__*/React.createElement(Button, {
-            spacing: "none",
-            onClick: _this.handleRetry,
-            component: IconStyledButtonOldVisualRefresh,
-            testId: "button-connect-other-account",
-            role: "button",
-            isDisabled: accessType === 'PENDING_REQUEST_EXISTS'
-          }, _this.renderForbiddenAccessMessage());
-        } else {
-          return /*#__PURE__*/React.createElement(Button, {
-            spacing: "none",
-            onClick: _this.handleRetry,
-            component: IconStyledButtonOld,
-            testId: "button-connect-other-account",
-            role: "button",
-            isDisabled: accessType === 'PENDING_REQUEST_EXISTS'
-          }, _this.renderForbiddenAccessMessage());
-        }
-      }
-      if (onAuthorise) {
-        return /*#__PURE__*/React.createElement(Button, {
-          spacing: "none",
-          onClick: _this.handleRetry,
-          appearance: "subtle-link",
-          testId: "button-connect-other-account",
-          role: "button"
-        }, /*#__PURE__*/React.createElement(LozengeWrapper, null, /*#__PURE__*/React.createElement(Lozenge, _extends({
-          appearance: 'moved'
-        }, fg('platform-component-visual-refresh') ? {
-          isBold: true
-        } : undefined), _this.renderForbiddenAccessMessage())));
-      }
-      return null;
-    });
-    return _this;
-  }
-  _inherits(InlineCardForbiddenViewOld, _React$Component);
-  return _createClass(InlineCardForbiddenViewOld, [{
-    key: "render",
-    value: function render() {
-      var _this$props4 = this.props,
-        url = _this$props4.url,
-        icon = _this$props4.icon,
-        onClick = _this$props4.onClick,
-        isSelected = _this$props4.isSelected,
-        _this$props4$testId = _this$props4.testId,
-        testId = _this$props4$testId === void 0 ? 'inline-card-forbidden-view' : _this$props4$testId,
-        truncateInline = _this$props4.truncateInline;
-      var content = /*#__PURE__*/React.createElement(Frame, {
-        testId: testId,
-        isSelected: isSelected,
-        ref: this.frameRef,
-        truncateInline: truncateInline
-      }, /*#__PURE__*/React.createElement(IconAndTitleLayout, {
-        icon: icon ? icon : fallbackForbiddenIcon(),
-        link: url,
-        title: url,
-        onClick: onClick,
-        titleColor: "var(--ds-text-subtle, ".concat(N500, ")")
-      }), this.renderActionButton());
-      if (this.props.showHoverPreview) {
-        return /*#__PURE__*/React.createElement(HoverCard, {
-          url: url
-        }, content);
-      }
-      return content;
-    }
-  }]);
-}(React.Component);

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

@@ -1,131 +0,0 @@
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-import styled from '@emotion/styled';
-import { B100, B200, B400, B50, N40 } from '@atlaskit/theme/colors';
-var lineHeight = 22;
-var selectedStyles = {
-  cursor: 'pointer',
-  boxShadow: "0 0 0 2px ".concat("var(--ds-border-selected, ".concat(B100, ")")),
-  outline: 'none',
-  userSelect: 'none',
-  '&, :hover, :focus, :active': {
-    textDecoration: 'none'
-  },
-  '&:hover': {
-    border: "1px solid ".concat("var(--ds-border, ".concat(N40, ")"))
-  }
-};
-var isInteractive = function isInteractive(_ref) {
-  var isInteractive = _ref.isInteractive;
-  if (isInteractive) {
-    return {
-      ':active': {
-        backgroundColor: "var(--ds-background-selected, ".concat(B50, ")")
-      },
-      ':focus': selectedStyles
-    };
-  }
-  return undefined;
-};
-var isSelected = function isSelected(_ref2) {
-  var isSelected = _ref2.isSelected;
-  if (isSelected) {
-    return selectedStyles;
-  } else {
-    return {
-      userSelect: 'text'
-    };
-  }
-};
-var hoveredStyles = {
-  borderColor: "var(--ds-border-accent-blue, ".concat(B200, ")")
-};
-var activeHoveredFocusedStyles = function activeHoveredFocusedStyles(props) {
-  if (props.withoutBackground) {
-    return undefined;
-  }
-  return {
-    textDecoration: 'none'
-  };
-};
-var hoveredWihBorderStyles = function hoveredWihBorderStyles(props) {
-  return _objectSpread(_objectSpread({}, hoveredStyles), activeHoveredFocusedStyles(props));
-};
-
-/*
-  Inline smart cards should have the following layout:
-  ------------------------------------
-  | icon | title | action OR lozenge |
-  ------------------------------------
-  The aim is to ensure (1) all children are
-  in line with each other, (2) are vertically
-  centered.
-*/
-// NB: `padding` consistent with @mentions.
-// NB: `display: inline` required for `box-decoration-break` to work.
-// NB: `box-decoration-break` required for retaining properties (border-radius) on wrap.
-var baseWrapperStyles = function baseWrapperStyles(props) {
-  return _objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread({
-    // eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
-    lineHeight: "".concat(lineHeight, "px"),
-    padding: "var(--ds-space-025, 2px)".concat(" 0px")
-  }, props.withoutBackground ? {
-    paddingLeft: 0,
-    marginLeft: "var(--ds-space-negative-025, -2px)"
-  } : undefined), {}, {
-    display: 'inline',
-    boxDecorationBreak: 'clone',
-    borderRadius: "var(--ds-border-radius-100, 4px)",
-    color: "var(--ds-link, ".concat(B400, ")")
-  }, props.withoutBackground ? undefined : {
-    backgroundColor: "var(--ds-surface-raised, white)"
-  }), isSelected(props)), props.withoutBackground ? undefined : {
-    border: "1px solid ".concat("var(--ds-border, ".concat(N40, ")"))
-  }), {}, {
-    '&:hover': hoveredStyles,
-    '&, :hover, :focus, :active': activeHoveredFocusedStyles(props),
-    transition: '0.1s all ease-in-out',
-    MozUserSelect: 'none'
-  }, props.isHovered ? hoveredWihBorderStyles(props) : undefined);
-};
-var truncateStyles = {
-  overflow: 'hidden',
-  textOverflow: 'ellipsis',
-  wordBreak: 'break-all',
-  // The height of a truncated card is 1px higher than that of a non-truncated card, so we subtract 1px from the line height.
-  // eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
-  lineHeight: "".concat(lineHeight - 1, "px"),
-  display: '-webkit-inline-box',
-  WebkitLineClamp: 1,
-  WebkitBoxOrient: 'vertical',
-  // We need to remove the padding because display: -webkit-inline-box will cause any padding to be
-  // added to the total height, causing truncated cards to have greater height than non-truncated cards which use display: inline.
-  padding: 0,
-  '@supports not (-webkit-line-clamp: 1)': {
-    display: 'inline-block',
-    maxHeight: "".concat(lineHeight, "px"),
-    // If the browser does not support webkit, we don't need to remove the padding
-    padding: "var(--ds-space-025, 2px)".concat(" 0px")
-  }
-};
-var isTruncated = function isTruncated(_ref3) {
-  var truncateInline = _ref3.truncateInline;
-  if (truncateInline) {
-    return truncateStyles;
-  }
-  return undefined;
-};
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/ui-styling-standard/no-dynamic-styles -- Ignored via go/DSP-18766
-export var WrapperAnchor = styled.a(function (props) {
-  return _objectSpread(_objectSpread(_objectSpread({}, baseWrapperStyles(props)), isInteractive(props)), isTruncated(props));
-});
-WrapperAnchor.displayName = 'WrapperAnchor';
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/ui-styling-standard/no-dynamic-styles -- Ignored via go/DSP-18766
-export var WrapperSpan = styled.span(function (props) {
-  return _objectSpread(_objectSpread({}, baseWrapperStyles(props)), isTruncated(props));
-});
-WrapperSpan.displayName = 'WrapperSpan';

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

@@ -1,51 +0,0 @@
-import React from 'react';
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-import styled from '@emotion/styled';
-import { SpanSkeleton } from '@atlaskit/linking-common';
-// TODO: Figure out a more scalable/responsive solution
-// for vertical alignment.
-// Current rationale: vertically positioned at the top of
-// the smart card container (when set to 0). Offset this
-// to position it with appropriate whitespace from the top.
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
-export var Icon = styled.img({
-  height: '16px',
-  width: '16px',
-  marginRight: "var(--ds-space-050, 4px)",
-  borderRadius: '2px',
-  userSelect: 'none',
-  position: 'absolute',
-  top: '50%',
-  left: '50%',
-  transform: 'translate(-50%, -50%)'
-});
-
-// TODO: Remove on platform-smart-card-icon-migration or bandicoots-compiled-migration-smartcard cleanup
-// Used for 'untrue' icons which claim to be 16x16 but
-// are less than that in height/width.
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
-export var AKIconWrapper = styled.span({
-  marginRight: "var(--ds-space-negative-025, -2px)"
-});
-export var Shimmer = function Shimmer(_ref) {
-  var testId = _ref.testId;
-  var skeletonCustomStyles = {
-    position: 'absolute',
-    // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
-    top: '50%',
-    // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
-    left: '50%',
-    transform: 'translate(-50%, -50%)',
-    marginRight: "var(--ds-space-050, 4px)"
-  };
-  return /*#__PURE__*/React.createElement(SpanSkeleton, {
-    width: 16,
-    height: 16,
-    borderRadius: 2,
-    testId: testId
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
-    ,
-    style: skeletonCustomStyles
-  });
-};

package/dist/esm/view/InlineCard/IconAndTitleLayout/IconAndTitleLayoutOld.compiled.css

@@ -1 +0,0 @@
-._1bsb1osq{width:100%}