@atlaskit/smart-card 35.2.12 → 36.0.0

package/dist/es2019/view/BlockCard/views/ForbiddenViewOld.js

@@ -1,103 +0,0 @@
-import _extends from "@babel/runtime/helpers/extends";
-import React, { useMemo } from 'react';
-import { useIntl } from 'react-intl-next';
-import { useAnalyticsEvents } from '@atlaskit/analytics-next';
-import LockLockedIcon from '@atlaskit/icon/core/lock-locked';
-import LegacyLockIcon from '@atlaskit/icon/glyph/lock';
-import { extractProvider } from '@atlaskit/link-extractors';
-import { fg } from '@atlaskit/platform-feature-flags';
-import { R300 } from '@atlaskit/theme/colors';
-import { extractRequestAccessContextImproved } from '../../../extractors/common/context/extractAccessContext';
-import extractHostname from '../../../extractors/common/hostname/extractHostname';
-import { messages } from '../../../messages';
-import { toMessage } from '../../../utils/intl-utils';
-import { getForbiddenJsonLd } from '../../../utils/jsonld';
-import Text from '../../FlexibleCard/components/elements/text';
-import { ForbiddenAction } from '../actions/ForbiddenAction';
-import UnresolvedView from './unresolved-view';
-
-/**
- * This view represent a Block Card with the 'Forbidden' status.
- * It should have a "Try another account" button that will allow a user to connect another account and view the block card.
- *
- * @see SmartLinkStatus
- * @see FlexibleCardProps
- */
-export const ForbiddenViewOld = ({
-  testId = 'smart-block-forbidden-view',
-  ...props
-}) => {
-  var _details$meta;
-  const {
-    createAnalyticsEvent
-  } = useAnalyticsEvents();
-  const intl = useIntl();
-  const {
-    cardState,
-    onAuthorize,
-    url
-  } = props;
-  const details = cardState === null || cardState === void 0 ? void 0 : cardState.details;
-  const cardMetadata = (_details$meta = details === null || details === void 0 ? void 0 : details.meta) !== null && _details$meta !== void 0 ? _details$meta : getForbiddenJsonLd().meta;
-  const provider = extractProvider(details === null || details === void 0 ? void 0 : details.data);
-  const providerName = (provider === null || provider === void 0 ? void 0 : provider.text) || '';
-  const messageContext = useMemo(() => {
-    const hostname = /*#__PURE__*/React.createElement("b", null, extractHostname(url));
-    return {
-      product: providerName,
-      hostname
-    };
-  }, [providerName, url]);
-  const requestAccessContext = useMemo(() => {
-    return extractRequestAccessContextImproved({
-      jsonLd: cardMetadata,
-      url,
-      product: providerName,
-      createAnalyticsEvent
-    });
-  }, [cardMetadata, providerName, url, createAnalyticsEvent]);
-  const title = useMemo(() => {
-    const descriptor = toMessage(messages.invalid_permissions, requestAccessContext === null || requestAccessContext === void 0 ? void 0 : requestAccessContext.titleMessageKey);
-    return intl.formatMessage(descriptor, {
-      product: providerName
-    });
-  }, [intl, providerName, requestAccessContext === null || requestAccessContext === void 0 ? void 0 : requestAccessContext.titleMessageKey]);
-  const actions = useMemo(() => {
-    let actionFromAccessContext = [];
-    const tryAnotherAccountAction = onAuthorize ? [ForbiddenAction(onAuthorize, 'try_another_account')] : [];
-    if (requestAccessContext) {
-      const {
-        action,
-        callToActionMessageKey
-      } = requestAccessContext;
-      actionFromAccessContext = action && callToActionMessageKey ? [ForbiddenAction(action.promise, callToActionMessageKey, messageContext, requestAccessContext === null || requestAccessContext === void 0 ? void 0 : requestAccessContext.buttonDisabled)] : [];
-    }
-    return [...tryAnotherAccountAction, ...actionFromAccessContext];
-  }, [onAuthorize, requestAccessContext, messageContext]);
-  return /*#__PURE__*/React.createElement(UnresolvedView, _extends({}, props, {
-    actions: actions,
-    showPreview: true,
-    testId: testId,
-    title: title
-  }), fg('platform-smart-card-icon-migration') ? /*#__PURE__*/React.createElement(LockLockedIcon, {
-    label: "forbidden-lock-icon",
-    color: "var(--ds-icon-danger, #C9372C)",
-    LEGACY_fallbackIcon: LegacyLockIcon,
-    LEGACY_size: "small",
-    testId: `${testId}-lock-icon`
-  }) :
-  /*#__PURE__*/
-  // eslint-disable-next-line @atlaskit/design-system/no-legacy-icons -- TODO - https://product-fabric.atlassian.net/browse/DSP-19497
-  React.createElement(LegacyLockIcon, {
-    label: "forbidden-lock-icon",
-    size: "small",
-    primaryColor: `var(--ds-icon-danger, ${R300})`,
-    testId: `${testId}-lock-icon`
-  }), /*#__PURE__*/React.createElement(Text, {
-    maxLines: 3,
-    message: {
-      descriptor: toMessage(messages.invalid_permissions_description, requestAccessContext === null || requestAccessContext === void 0 ? void 0 : requestAccessContext.descriptiveMessageKey),
-      values: messageContext
-    }
-  }));
-};

package/dist/es2019/view/BlockCard/views/NotFoundViewOld.js

@@ -1,61 +0,0 @@
-import _extends from "@babel/runtime/helpers/extends";
-import React, { useMemo } from 'react';
-import { useIntl } from 'react-intl-next';
-import LockLockedIcon from '@atlaskit/icon/core/lock-locked';
-import LegacyLockIcon from '@atlaskit/icon/glyph/lock';
-import { extractProvider } from '@atlaskit/link-extractors';
-import { fg } from '@atlaskit/platform-feature-flags';
-import { R300 } from '@atlaskit/theme/colors';
-import { messages } from '../../../messages';
-import Text from '../../FlexibleCard/components/elements/text';
-import UnresolvedView from './unresolved-view';
-
-/**
- * This view represents a Block Card with a 'Not_Found' status.
- *
- * @see SmartLinkStatus
- * @see FlexibleCardProps
- */
-export const NotFoundViewOld = ({
-  testId = 'smart-block-not-found-view',
-  ...props
-}) => {
-  var _cardState$details2;
-  const intl = useIntl();
-  const {
-    cardState
-  } = props;
-  const product = useMemo(() => {
-    var _cardState$details, _provider$text;
-    const provider = extractProvider(cardState === null || cardState === void 0 ? void 0 : (_cardState$details = cardState.details) === null || _cardState$details === void 0 ? void 0 : _cardState$details.data);
-    return (_provider$text = provider === null || provider === void 0 ? void 0 : provider.text) !== null && _provider$text !== void 0 ? _provider$text : '';
-  }, [cardState === null || cardState === void 0 ? void 0 : (_cardState$details2 = cardState.details) === null || _cardState$details2 === void 0 ? void 0 : _cardState$details2.data]);
-  const title = useMemo(() => intl.formatMessage(messages.not_found_title, {
-    product
-  }), [intl, product]);
-  const description = useMemo(() => ({
-    descriptor: messages.not_found_description
-  }), []);
-  return /*#__PURE__*/React.createElement(UnresolvedView, _extends({}, props, {
-    testId: testId,
-    title: title
-  }), fg('platform-smart-card-icon-migration') ? /*#__PURE__*/React.createElement(LockLockedIcon, {
-    label: "not-found-lock-icon",
-    color: "var(--ds-icon-danger, #C9372C)",
-    LEGACY_fallbackIcon: LegacyLockIcon,
-    LEGACY_size: "small",
-    testId: `${testId}-lock-icon`
-  }) :
-  /*#__PURE__*/
-  // eslint-disable-next-line @atlaskit/design-system/no-legacy-icons -- TODO - https://product-fabric.atlassian.net/browse/DSP-19497
-  React.createElement(LegacyLockIcon, {
-    label: "not-found-lock-icon",
-    size: "small",
-    primaryColor: `var(--ds-icon-danger, ${R300})`,
-    testId: `${testId}-lock-icon`
-  }), /*#__PURE__*/React.createElement(Text, {
-    message: description,
-    testId: `${testId}-message`,
-    maxLines: 3
-  }));
-};

package/dist/es2019/view/BlockCard/views/ResolvedViewOld.js

@@ -1,75 +0,0 @@
-import _extends from "@babel/runtime/helpers/extends";
-import React, { useEffect, useMemo, useState } from 'react';
-import { ActionName, ElementName, SmartLinkPosition } from '../../../constants';
-import FlexibleCard from '../../FlexibleCard';
-import { FooterBlock, MetadataBlock, PreviewBlock, SnippetBlock, TitleBlock } from '../../FlexibleCard/components/blocks';
-import { metadataBlockCss } from './styledOld';
-import { FlexibleCardUiOptions, FooterBlockOptionsOld, getSimulatedBetterMetadata, PreviewBlockOptions, titleBlockOptionsOld } from './utils';
-
-/**
- * This view represents a Block card that has an 'Resolved' status.
- * @see SmartLinkStatus
- * @see FlexibleCardProps
- */
-const ResolvedViewOld = ({
-  cardState,
-  onClick,
-  onError,
-  onResolve,
-  actionOptions,
-  testId = 'smart-block-resolved-view',
-  url
-}) => {
-  const [isPreviewBlockErrored, setIsPreviewBlockErrored] = useState(false);
-  useEffect(() => {
-    setIsPreviewBlockErrored(false);
-  }, [url, cardState]);
-  const {
-    titleMetadata,
-    topMetadata,
-    bottomMetadata
-  } = getSimulatedBetterMetadata(cardState.details);
-  const footerActions = useMemo(() => [{
-    name: ActionName.FollowAction,
-    hideIcon: true
-  }, {
-    name: ActionName.PreviewAction,
-    hideIcon: true
-  }, {
-    name: ActionName.DownloadAction,
-    hideIcon: true
-  }], []);
-  return /*#__PURE__*/React.createElement(FlexibleCard, {
-    appearance: "block",
-    cardState: cardState,
-    onClick: onClick,
-    onError: onError,
-    onResolve: onResolve,
-    origin: "smartLinkCard",
-    actionOptions: actionOptions,
-    testId: testId,
-    ui: FlexibleCardUiOptions,
-    url: url
-  }, /*#__PURE__*/React.createElement(TitleBlock, _extends({}, titleBlockOptionsOld, {
-    metadata: titleMetadata,
-    subtitle: [{
-      name: ElementName.Location
-    }],
-    metadataPosition: SmartLinkPosition.Top
-  })), /*#__PURE__*/React.createElement(MetadataBlock, {
-    primary: topMetadata,
-    maxLines: 1,
-    overrideCss: metadataBlockCss
-  }), /*#__PURE__*/React.createElement(SnippetBlock, null), /*#__PURE__*/React.createElement(MetadataBlock, {
-    primary: bottomMetadata,
-    maxLines: 1,
-    overrideCss: metadataBlockCss
-  }), !isPreviewBlockErrored ? /*#__PURE__*/React.createElement(PreviewBlock, _extends({}, PreviewBlockOptions, {
-    onError: () => {
-      setIsPreviewBlockErrored(true);
-    }
-  })) : null, /*#__PURE__*/React.createElement(FooterBlock, _extends({}, FooterBlockOptionsOld, {
-    actions: footerActions
-  })));
-};
-export default ResolvedViewOld;

package/dist/es2019/view/BlockCard/views/styledOld.js

@@ -1,51 +0,0 @@
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-import { css } from '@emotion/react';
-import { N40 } from '@atlaskit/theme/colors';
-// in editor prosemirror adds padding-left so we need to overwrite it
-// renderer overwrites the margin-right so we need to add it here
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
-export const metadataBlockCss = css({
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
-  'span[data-smart-element-avatar-group]': {
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
-    '> ul': {
-      paddingLeft: '0px',
-      marginRight: "var(--ds-space-100, 0.5rem)"
-    }
-  },
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
-  '[data-smart-element-group]': {
-    // eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
-    lineHeight: '1rem'
-  }
-});
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
-export const titleBlockCss = css({
-  gap: "var(--ds-space-100, 0.5em)",
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
-  "[data-smart-element='Title']": {
-    fontWeight: "var(--ds-font-weight-semibold, 600)"
-  }
-});
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
-export const footerBlockCss = css({
-  height: '1.5rem',
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
-  '.actions-button-group': {
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
-    'button, button:hover, button:focus, button:active': {
-      // eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
-      fontSize: '0.875rem'
-    }
-  }
-});
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
-export const flexibleBlockCardStyle = css({
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
-  '& > div': {
-    borderRadius: "var(--ds-border-radius-200, 8px)",
-    border: `1px solid ${`var(--ds-border, ${N40})`}`
-  }
-});

package/dist/es2019/view/BlockCard/views/unresolved-view/UnresolvedViewOld.js

@@ -1,42 +0,0 @@
-import _extends from "@babel/runtime/helpers/extends";
-import React from 'react';
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled
-import { css } from '@emotion/react';
-import FlexibleCard from '../../../FlexibleCard';
-import { CustomBlock, InternalFooterBlock, PreviewBlock, TitleBlock } from '../../../FlexibleCard/components/blocks';
-import { FlexibleCardUiOptions, FooterBlockOptionsOld, PreviewBlockOptions, titleBlockOptionsOld } from '../utils';
-const customBlockStyles = css({
-  alignItems: 'flex-start'
-});
-const UnresolvedViewOld = ({
-  actions,
-  cardState,
-  children,
-  onAuthorize,
-  onClick,
-  onError,
-  showPreview = false,
-  testId,
-  title,
-  url
-}) => /*#__PURE__*/React.createElement(FlexibleCard, {
-  appearance: "block",
-  cardState: cardState,
-  onAuthorize: onAuthorize,
-  onClick: onClick,
-  onError: onError,
-  origin: "smartLinkCard",
-  testId: testId,
-  ui: FlexibleCardUiOptions,
-  url: url
-}, /*#__PURE__*/React.createElement(TitleBlock, _extends({}, titleBlockOptionsOld, {
-  hideIcon: !!title,
-  text: title
-})), /*#__PURE__*/React.createElement(CustomBlock, {
-  overrideCss: customBlockStyles
-}, children), showPreview && /*#__PURE__*/React.createElement(PreviewBlock, PreviewBlockOptions), /*#__PURE__*/React.createElement(InternalFooterBlock, _extends({}, FooterBlockOptionsOld, {
-  actions: actions,
-  testId: "smart-block-card-footer"
-})));
-export default UnresolvedViewOld;

package/dist/es2019/view/BlockCard/views/utils/withFlexibleUIBlockCardStyleOld.js

@@ -1,15 +0,0 @@
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-import { jsx } from '@emotion/react';
-import { flexibleBlockCardStyle } from '../styledOld';
-export const withFlexibleUIBlockCardStyleOld = FlexibleBlockCardView => props => {
-  return (
-    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
-    jsx("div", {
-      css: flexibleBlockCardStyle
-    }, jsx(FlexibleBlockCardView, props))
-  );
-};

package/dist/es2019/view/EmbedCard/components/ErrorFrameOld.js

@@ -1,91 +0,0 @@
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
-import React from 'react';
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-import { css, jsx } from '@emotion/react';
-import { B200, N20A, N30A, N40A, N50A } from '@atlaskit/theme/colors';
-import { br, gs, mq } from '../../common/utils';
-export const FrameOld = (props = {
-  isSelected: false,
-  isHoverable: false,
-  isFluidHeight: false
-}) => props.compact ? jsx(CompactFrameOld, props) : jsx(ExpandedFrameOld, props);
-const sharedBaseFrameStyles = css({
-  width: '100%',
-  display: 'flex'
-});
-
-// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
-const sharedFrameStyles = {
-  maxWidth: gs(95),
-  backgroundColor: "var(--ds-surface-raised, white)"
-};
-export const ExpandedFrameOld = ({
-  children,
-  isSelected,
-  isHoverable,
-  testId,
-  className,
-  isFluidHeight
-}) => {
-  return jsx("div", {
-    css: [sharedBaseFrameStyles, sharedFrameStyles,
-    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
-    mq({
-      '&:hover': isHoverable ? {
-        // TODO: https://product-fabric.atlassian.net/browse/DSP-4064
-        backgroundColor: `var(--ds-background-neutral-subtle-hovered, ${N20A})`,
-        cursor: 'pointer'
-      } : undefined,
-      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
-      minHeight: isFluidHeight ? 0 : [gs(21), gs(15)],
-      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
-      borderRadius: isSelected ? br() : br(0.5),
-      border: `2px solid ${isSelected ? `var(--ds-border-selected, ${B200})` : 'transparent'}`,
-      justifyContent: 'space-between',
-      overflow: 'hidden',
-      boxShadow: `var(--ds-shadow-raised, ${`0 1px 1px ${N50A}, 0 0 1px 1px ${N40A}`})`
-    })],
-    "data-testid": testId
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
-    ,
-    className: className,
-    "data-trello-do-not-use-override": testId
-  }, children);
-};
-export const CompactFrameOld = ({
-  children,
-  isHoverable,
-  isSelected,
-  testId,
-  className,
-  inheritDimensions
-}) => {
-  return jsx("div", {
-    css: [sharedBaseFrameStyles, sharedFrameStyles,
-    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
-    mq({
-      '&:hover': isHoverable ? {
-        backgroundColor: `var(--ds-background-neutral-hovered, ${N30A})`
-      } : undefined,
-      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
-      borderRadius: isSelected ? br() : br(0.5),
-      border: isSelected ? `2px solid ${`var(--ds-border-selected, ${B200})`}` : '',
-      justifyContent: 'center',
-      alignItems: 'center',
-      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
-      height: inheritDimensions ? '100%' : gs(5),
-      backgroundColor: `var(--ds-background-neutral, ${N20A})`,
-      width: ['calc(100% - 16px)', '100%'],
-      // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
-      padding: [`0px ${gs(1)}`, '0']
-    })],
-    "data-testid": testId
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
-    ,
-    className: className
-  }, children);
-};

package/dist/es2019/view/EmbedCard/components/ExpandedFrameOld.js

@@ -1,96 +0,0 @@
-/* ExpandedFrameOld.tsx generated by @compiled/babel-plugin v0.36.1 */
-import * as React from 'react';
-import { ax, ix } from "@compiled/react/runtime";
-import Tooltip from '@atlaskit/tooltip';
-import { useMouseDownEvent } from '../../../state/analytics/useLinkClicked';
-import { handleClickCommon } from '../../common/utils';
-import { className, Content, Header, IconWrapper, LinkWrapper, TextWrapper, TooltipWrapper, Wrapper } from './styledOld';
-export const ExpandedFrameOld = ({
-  isPlaceholder = false,
-  children,
-  onClick,
-  icon,
-  text,
-  isSelected,
-  frameStyle = 'showOnHover',
-  href,
-  minWidth,
-  maxWidth,
-  testId = 'expanded-frame',
-  inheritDimensions,
-  allowScrollBar = false,
-  setOverflow = true
-}) => {
-  const isInteractive = () => !isPlaceholder && (Boolean(href) || Boolean(onClick));
-  const handleClick = event => handleClickCommon(event, onClick);
-  const handleMouseDown = useMouseDownEvent();
-  const renderHeader = () => {
-    return (
-      /*#__PURE__*/
-      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
-      React.createElement(Header, {
-        className: "embed-header",
-        frameStyle: frameStyle
-      }, /*#__PURE__*/React.createElement(IconWrapper, {
-        isPlaceholder: isPlaceholder
-      }, !isPlaceholder && icon), /*#__PURE__*/React.createElement(TooltipWrapper, null, /*#__PURE__*/React.createElement(Tooltip, {
-        content: text,
-        hideTooltipOnMouseDown: true
-      }, /*#__PURE__*/React.createElement(TextWrapper, {
-        isPlaceholder: isPlaceholder
-      }, !isPlaceholder && /*#__PURE__*/React.createElement("a", {
-        href: href,
-        onClick: handleClick,
-        onMouseDown: handleMouseDown
-      }, text)))))
-    );
-  };
-  const renderContent = () => {
-    return /*#__PURE__*/React.createElement(Content, {
-      "data-testid": "embed-content-wrapper",
-      allowScrollBar: allowScrollBar,
-      removeOverflow: !setOverflow,
-      isInteractive: isInteractive(),
-      frameStyle: frameStyle
-      // This fixes an issue with input fields in cross domain iframes (ie. databases and jira fields from different domains)
-      // See: HOT-107830
-      ,
-      contentEditable: 'false',
-      suppressContentEditableWarning: true
-    }, children);
-  };
-  if (!isPlaceholder && href) {
-    return /*#__PURE__*/React.createElement(LinkWrapper
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
-    , {
-      className: className,
-      isInteractive: isInteractive(),
-      isSelected: isSelected,
-      frameStyle: frameStyle,
-      minWidth: minWidth,
-      maxWidth: maxWidth,
-      "data-testid": testId,
-      "data-trello-do-not-use-override": testId
-      // Due to limitations of testing library, we can't assert ::after
-      ,
-      "data-is-selected": isSelected,
-      inheritDimensions: inheritDimensions
-    }, renderHeader(), renderContent());
-  } else {
-    return /*#__PURE__*/React.createElement(Wrapper
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
-    , {
-      className: className,
-      isInteractive: isInteractive(),
-      isSelected: isSelected,
-      minWidth: minWidth,
-      frameStyle: frameStyle,
-      maxWidth: maxWidth,
-      "data-testid": testId,
-      "data-trello-do-not-use-override": testId,
-      "data-is-selected": isSelected,
-      "data-wrapper-type": "default",
-      "data-is-interactive": isInteractive()
-    }, renderHeader(), renderContent());
-  }
-};

package/dist/es2019/view/EmbedCard/components/FrameOld.js

@@ -1,114 +0,0 @@
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
-import React, { useEffect, useRef, useState } from 'react';
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-import { css, jsx } from '@emotion/react';
-import { di } from 'react-magnetic-di';
-import { getIframeSandboxAttribute } from '../../../utils';
-import { IFrame } from './IFrame';
-import { IframeDwellTracker } from './IframeDwellTracker';
-function mergeRefs(refs) {
-  return value => {
-    refs.forEach(ref => {
-      if (typeof ref === 'function') {
-        ref(value);
-      } else if (ref !== null) {
-        ref.current = value;
-      }
-    });
-  };
-}
-const iframeStyles = css({
-  border: 0,
-  top: 0,
-  left: 0,
-  width: '100%',
-  height: '100%',
-  position: 'relative',
-  overflow: 'hidden',
-  borderRadius: '3px'
-});
-export const FrameOld = /*#__PURE__*/React.forwardRef(({
-  url,
-  isTrusted = false,
-  testId,
-  onIframeDwell,
-  onIframeFocus,
-  title
-}, iframeRef) => {
-  const [isIframeLoaded, setIframeLoaded] = useState(false);
-  const [isMouseOver, setMouseOver] = useState(false);
-  const [isWindowFocused, setWindowFocused] = useState(true);
-  const ref = useRef();
-  const mergedRef = mergeRefs([iframeRef, ref]);
-  const [percentVisible, setPercentVisible] = useState(0);
-
-  /**
-   * These are the 'percent visible' thresholds at which the intersectionObserver will
-   * trigger a state change. Eg. when the user scrolls and moves from 74% to 76%, or
-   * vice versa. It's in a state object so that its static for the useEffect
-   */
-  const [threshold] = useState([0.75, 0.8, 0.85, 0.9, 0.95, 1]);
-  useEffect(() => {
-    if (!ref || !ref.current) {
-      return;
-    }
-    const observer = new IntersectionObserver(entries => {
-      entries.forEach(entry => {
-        setPercentVisible(entry === null || entry === void 0 ? void 0 : entry.intersectionRatio);
-      });
-    }, {
-      threshold
-    });
-    observer.observe(ref.current);
-    return () => {
-      observer.disconnect();
-    };
-  }, [threshold, mergedRef]);
-  useEffect(() => {
-    const onBlur = () => {
-      setWindowFocused(false);
-      if (document.activeElement === ref.current) {
-        onIframeFocus && onIframeFocus();
-      }
-    };
-    const onFocus = () => {
-      setWindowFocused(true);
-    };
-    window.addEventListener('blur', onBlur);
-    window.addEventListener('focus', onFocus);
-    return () => {
-      window.removeEventListener('blur', onBlur);
-      window.removeEventListener('focus', onFocus);
-    };
-  }, [ref, onIframeFocus]);
-  if (!url) {
-    return null;
-  }
-  return jsx(React.Fragment, null, jsx(IframeDwellTracker, {
-    isIframeLoaded: isIframeLoaded,
-    isMouseOver: isMouseOver,
-    isWindowFocused: isWindowFocused,
-    iframePercentVisible: percentVisible,
-    onIframeDwell: onIframeDwell
-  }), jsx(IFrame, {
-    childRef: mergedRef,
-    src: url,
-    "data-testid": `${testId}-frame`,
-    "data-iframe-loaded": isIframeLoaded,
-    css: iframeStyles,
-    onMouseEnter: () => setMouseOver(true),
-    onMouseLeave: () => setMouseOver(false),
-    allowFullScreen: true,
-    scrolling: "yes",
-    allow: "autoplay; encrypted-media; clipboard-write",
-    onLoad: () => {
-      setIframeLoaded(true);
-    },
-    sandbox: getIframeSandboxAttribute(isTrusted),
-    title: title
-  }));
-});