@atlaskit/smart-card 35.2.12 → 36.0.1

package/dist/es2019/view/FlexibleCard/components/elements/atlaskit-badge/AtlaskitBadgeOld.js

@@ -1,37 +0,0 @@
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-import { css, jsx } from '@emotion/react';
-import AKBadge from '@atlaskit/badge';
-const badgeStyles = css({
-  alignItems: 'center',
-  display: 'inline-flex'
-});
-
-/**
- * A base element that displays a visual indicator for a numeric value
- * @internal
- * @see StoryPoints
- * */
-
-const AtlaskitBadgeOld = ({
-  value,
-  name,
-  overrideCss,
-  testId = 'smart-element-atlaskit-badge'
-}) => {
-  if (!value) {
-    return null;
-  }
-  return jsx("span", {
-    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
-    css: [badgeStyles, overrideCss],
-    "data-fit-to-content": true,
-    "data-smart-element": name,
-    "data-smart-element-atlaskit-badge": true,
-    "data-testid": testId
-  }, jsx(AKBadge, null, value));
-};
-export default AtlaskitBadgeOld;

package/dist/es2019/view/FlexibleCard/components/elements/avatar-group/AvatarGroupOld.js

@@ -1,117 +0,0 @@
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
-import { useMemo } from 'react';
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-import { css, jsx } from '@emotion/react';
-import { useIntl } from 'react-intl-next';
-import AtlaskitAvatarGroup from '@atlaskit/avatar-group';
-import { ElementName, SmartLinkSize } from '../../../../../constants';
-import { messages } from '../../../../../messages';
-import { getFormattedMessageAsString } from '../../utils';
-const MAX_COUNT = 4;
-const getStyles = size => {
-  const styles = css({
-    display: 'inline-flex',
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
-    ul: {
-      marginRight: "var(--ds-space-100, 0.5rem)",
-      marginTop: 0
-    }
-  });
-  switch (size) {
-    case SmartLinkSize.XLarge:
-    case SmartLinkSize.Large:
-      // Default AK small size
-      return styles;
-    case SmartLinkSize.Medium:
-    case SmartLinkSize.Small:
-    default:
-      // eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression -- needs manual remediation
-      return css`
-				${styles}
-				li {
-					span,
-					svg {
-						max-height: 1.25rem;
-						max-width: 1.25rem;
-					}
-				}
-			`;
-  }
-};
-const getPersonNameWithPrefix = (elementName, personName, intl) => {
-  switch (elementName) {
-    case ElementName.AssignedToGroup:
-      return getFormattedMessageAsString(intl, messages.assigned_to, personName);
-    case ElementName.OwnedByGroup:
-      return getFormattedMessageAsString(intl, messages.owned_by, personName);
-    case ElementName.AuthorGroup:
-      return getFormattedMessageAsString(intl, messages.created_by, personName);
-    default:
-      return personName;
-  }
-};
-
-/**
- * A base element that displays a group of avatars.
- * @internal
- * @param {AvatarGroupProps} AvatarGroupProps - The props necessary for the AvatarGroup.
- * @see AuthorGroup
- * @see CollaboratorGroup
- */
-const AvatarGroupOld = ({
-  items = [],
-  maxCount = MAX_COUNT,
-  name,
-  overrideCss,
-  size = SmartLinkSize.Medium,
-  testId = 'smart-element-avatar-group',
-  showNamePrefix = false,
-  showFallbackAvatar = true
-}) => {
-  const intl = useIntl();
-  const data = useMemo(() => {
-    if (!items.length && showFallbackAvatar) {
-      switch (name) {
-        case ElementName.AssignedToGroup:
-          return [{
-            name: getFormattedMessageAsString(intl, messages.unassigned)
-          }];
-        default:
-          return [];
-      }
-    }
-
-    //show a name prefix if there is one Avatar in a group only
-    if (name && items.length === 1 && showNamePrefix) {
-      return items.map(person => {
-        return {
-          ...person,
-          name: getPersonNameWithPrefix(name, person.name, intl) || person.name
-        };
-      });
-    }
-    return items;
-  }, [name, items, showNamePrefix, showFallbackAvatar, intl]);
-  if (!data.length) {
-    return null;
-  }
-  return jsx("span", {
-    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
-    css: [getStyles(size), overrideCss],
-    "data-fit-to-content": true,
-    "data-smart-element": name,
-    "data-smart-element-avatar-group": true,
-    "data-testid": testId
-  }, jsx(AtlaskitAvatarGroup, {
-    maxCount: maxCount,
-    appearance: "stack",
-    size: "small",
-    data: data,
-    testId: testId
-  }));
-};
-export default AvatarGroupOld;

package/dist/es2019/view/FlexibleCard/components/elements/badge/BadgeOld.js

@@ -1,121 +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 { IconType } from '../../../../../constants';
-import { messages } from '../../../../../messages';
-import AtlaskitIcon from '../../common/atlaskit-icon';
-import ImageIcon from '../../common/image-icon';
-import { getFormattedMessage, getIconSizeStyles } from '../../utils';
-const badgeStyles = css({
-  alignItems: 'center',
-  display: 'inline-flex',
-  minWidth: 'fit-content'
-});
-
-// eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
-const iconStyles = css`
-	color: ${"var(--ds-icon-subtle, #626F86)"};
-	line-height: 0;
-	vertical-align: middle;
-	${getIconSizeStyles('1rem')}
-	img,
-  span,
-  svg {
-		line-height: 0;
-		vertical-align: middle;
-	}
-`;
-const labelStyles = css({
-  color: "var(--ds-text-subtlest, #626F86)",
-  font: "var(--ds-font-body-UNSAFE_small, normal 400 12px/16px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, \"Helvetica Neue\", sans-serif)",
-  paddingLeft: "var(--ds-space-025, 0.125rem)",
-  verticalAlign: 'middle'
-});
-const messageMapper = {
-  [IconType.PriorityBlocker]: messages.priority_blocker,
-  [IconType.PriorityCritical]: messages.priority_critical,
-  [IconType.PriorityHigh]: messages.priority_high,
-  [IconType.PriorityHighest]: messages.priority_highest,
-  [IconType.PriorityLow]: messages.priority_low,
-  [IconType.PriorityLowest]: messages.priority_lowest,
-  [IconType.PriorityMajor]: messages.priority_major,
-  [IconType.PriorityMedium]: messages.priority_medium,
-  [IconType.PriorityMinor]: messages.priority_minor,
-  [IconType.PriorityTrivial]: messages.priority_trivial,
-  [IconType.PriorityUndefined]: messages.priority_undefined
-};
-const getFormattedMessageFromIcon = icon => {
-  if (icon) {
-    const descriptor = messageMapper[icon];
-    if (descriptor) {
-      return getFormattedMessage({
-        descriptor
-      });
-    }
-  }
-};
-const renderAtlaskitIcon = (icon, testId) => {
-  if (icon) {
-    return jsx(AtlaskitIcon, {
-      icon: icon,
-      label: icon,
-      testId: `${testId}-icon`
-    });
-  }
-};
-const renderImageIcon = (url, testId) => {
-  if (url) {
-    return jsx(ImageIcon, {
-      testId: testId,
-      url: url
-    });
-  }
-};
-
-/**
- * A base element that displays some text with an associated icon.
- * @internal
- * @param {BadgeProps} BadgeProps - The props necessary for the Badge.
- * @see CommentCount
- * @see ViewCount
- * @see ReactCount
- * @see VoteCount
- * @see SubscriberCount
- * @see Priority
- * @see ProgrammingLanguage
- * @see Provider
- */
-const BadgeOld = ({
-  hideIcon = false,
-  icon,
-  label,
-  name,
-  overrideCss,
-  testId = 'smart-element-badge',
-  url
-}) => {
-  const formattedMessageOrLabel = getFormattedMessageFromIcon(icon) || label;
-  const badgeIcon = renderAtlaskitIcon(icon, testId) || renderImageIcon(url, testId);
-  if (!formattedMessageOrLabel || !badgeIcon) {
-    return null;
-  }
-  return jsx("span", {
-    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
-    css: [badgeStyles, overrideCss],
-    "data-fit-to-content": true,
-    "data-smart-element": name,
-    "data-smart-element-badge": true,
-    "data-testid": testId
-  }, !hideIcon && jsx("span", {
-    css: iconStyles
-  }, badgeIcon), jsx("span", {
-    css: labelStyles,
-    "data-testid": `${testId}-label`
-  }, formattedMessageOrLabel));
-};
-export default BadgeOld;

package/dist/es2019/view/FlexibleCard/components/elements/date-time/DateTimeOld.js

@@ -1,89 +0,0 @@
-import _extends from "@babel/runtime/helpers/extends";
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-import { css, jsx } from '@emotion/react';
-import { selectUnit } from '@formatjs/intl-utils';
-import { FormattedMessage, useIntl } from 'react-intl-next';
-import { messages } from '../../../../../messages';
-import { getTruncateStyles } from '../../utils';
-const styles = css({
-  color: "var(--ds-text-subtlest, #626F86)",
-  font: "var(--ds-font-body-UNSAFE_small, normal 400 12px/16px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, \"Helvetica Neue\", sans-serif)"
-},
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
-getTruncateStyles(1));
-const typeToDescriptorMap = {
-  created: {
-    relative: messages.created_on_relative,
-    absolute: messages.created_on_absolute
-  },
-  modified: {
-    relative: messages.modified_on_relative,
-    absolute: messages.modified_on_absolute
-  },
-  sent: {
-    relative: messages.sent_on_relative,
-    absolute: messages.sent_on_absolute
-  }
-};
-
-/**
- * A base element that displays an ISO Timestamp in text.
- * @internal
- * @param {DateTimeProps} DateTimeProps - The props necessary for the DateTime element.
- * @see CreatedOn
- * @see ModifiedOn
- * @see SentOn
- */
-const DateTimeOld = ({
-  date,
-  name,
-  overrideCss,
-  type,
-  testId = 'smart-element-date-time',
-  text
-}) => {
-  const {
-    formatRelativeTime,
-    formatDate
-  } = useIntl();
-  if (!type || !date) {
-    return null;
-  }
-  const isLongerThenWeek = Math.abs(date.getTime() - Date.now()) > 1000 * 60 * 60 * 24 * 7;
-  let context;
-  let typeVariant;
-  if (isLongerThenWeek) {
-    typeVariant = 'absolute';
-    context = formatDate(date, {
-      month: 'short',
-      day: 'numeric',
-      year: 'numeric'
-    });
-  } else {
-    const {
-      value,
-      unit
-    } = selectUnit(date, Date.now());
-    typeVariant = 'relative';
-    context = formatRelativeTime(value, unit, {
-      numeric: 'auto'
-    });
-  }
-  return jsx("span", {
-    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
-    css: [styles, overrideCss],
-    "data-separator": true,
-    "data-smart-element": name,
-    "data-smart-element-date-time": true,
-    "data-testid": testId
-  }, text ? `${text} ${context}` : jsx(FormattedMessage, _extends({}, typeToDescriptorMap[type][typeVariant], {
-    values: {
-      context
-    }
-  })));
-};
-export default DateTimeOld;

package/dist/es2019/view/FlexibleCard/components/elements/icon/IconOld.js

@@ -1,130 +0,0 @@
-import _extends from "@babel/runtime/helpers/extends";
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
-import React, { useMemo } from 'react';
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-import { css, jsx } from '@emotion/react';
-import LinkIcon from '@atlaskit/icon/core/migration/link';
-import { fg } from '@atlaskit/platform-feature-flags';
-import { Box, xcss } from '@atlaskit/primitives';
-import { SmartLinkPosition, SmartLinkSize } from '../../../../../constants';
-import AtlaskitIcon from '../../common/atlaskit-icon';
-import ImageIcon from '../../common/image-icon';
-import { getIconSizeStyles, getIconWidth, getTruncateStyles } from '../../utils';
-const getPositionStyles = position => {
-  switch (position) {
-    case SmartLinkPosition.Center:
-      return css({
-        alignSelf: 'center'
-      });
-    case SmartLinkPosition.Top:
-    default:
-      return css({
-        alignSelf: 'flex-start',
-        margin: 0
-      });
-  }
-};
-const getIconStyles = (position, width) =>
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
-css(getPositionStyles(position), getIconSizeStyles(width));
-const getCustomRenderStyles = value =>
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
-css(getTruncateStyles(1, value), {
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/design-system/use-tokens-typography -- Ignored via go/DSP-18766
-  lineHeight: value,
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
-  fontSize: value,
-  textAlign: 'center',
-  textOverflow: 'clip',
-  WebkitBoxOrient: 'unset',
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
-  span: {
-    margin: 0,
-    padding: 0,
-    verticalAlign: 'baseline'
-  }
-});
-const renderAtlaskitIcon = (icon, testId, size = SmartLinkSize.Medium) => {
-  if (icon) {
-    return jsx(AtlaskitIcon, _extends({
-      icon: icon,
-      testId: `${testId}-icon`
-    }, fg('platform-smart-card-icon-migration') && {
-      size
-    }));
-  }
-};
-const renderDefaultIcon = (label, testId) => jsx(LinkIcon, {
-  label: label,
-  testId: `${testId}-default`,
-  color: "currentColor"
-});
-const renderImageIcon = (defaultIcon, url, testId, size = SmartLinkSize.Medium) => {
-  const width = size === SmartLinkSize.Large ? "var(--ds-space-300, 24px)" : "var(--ds-space-200, 16px)";
-  if (url) {
-    return jsx(ImageIcon, _extends({
-      defaultIcon: defaultIcon,
-      testId: testId,
-      url: url
-    }, fg('platform-smart-card-icon-migration') && {
-      width,
-      height: width
-    }));
-  }
-};
-
-/**
- * A base element that displays an Icon or favicon.
- * @internal
- * @param {IconProps} IconProps - The props necessary for the Icon element.
- * @see LinkIcon
- */
-const IconOld = ({
-  icon,
-  overrideIcon,
-  label = 'Link',
-  name,
-  position = SmartLinkPosition.Top,
-  overrideCss,
-  render,
-  size = SmartLinkSize.Medium,
-  testId = 'smart-element-icon',
-  url
-}) => {
-  const element = useMemo(() => {
-    const defaultIcon = renderDefaultIcon(label, testId);
-    return overrideIcon || (render === null || render === void 0 ? void 0 : render()) || renderImageIcon(defaultIcon, url, testId, fg('platform-smart-card-icon-migration') ? size : undefined) || renderAtlaskitIcon(icon, testId, fg('platform-smart-card-icon-migration') ? size : undefined) || defaultIcon;
-  }, [overrideIcon, icon, label, render, testId, url, size]);
-  const width = getIconWidth(size);
-  const styles = getIconStyles(position, width);
-  const renderStyles = render ? getCustomRenderStyles(width) : undefined;
-  return jsx("div", {
-    css: [
-    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage -- needs dynamic css
-    !fg('platform-smart-card-icon-migration') && styles,
-    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage -- needs dynamic css
-    renderStyles,
-    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage -- needs dynamic css
-    overrideCss],
-    "data-fit-to-content": true,
-    "data-smart-element": name,
-    "data-smart-element-icon": true,
-    "data-testid": testId
-  }, fg('platform-smart-card-icon-migration') ? jsx(Box, {
-    xcss: iconWrapperStyle,
-    style: {
-      width,
-      height: width
-    }
-  }, element) : element);
-};
-const iconWrapperStyle = xcss({
-  display: 'flex',
-  alignItems: 'center',
-  justifyContent: 'center'
-});
-export default IconOld;

package/dist/es2019/view/FlexibleCard/components/elements/link/LinkOld.js

@@ -1,132 +0,0 @@
-import _extends from "@babel/runtime/helpers/extends";
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
-import React, { useMemo } from 'react';
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-import { css, jsx } from '@emotion/react';
-import Tooltip from '@atlaskit/tooltip';
-import { SmartLinkInternalTheme, SmartLinkSize, SmartLinkTheme } from '../../../../../constants';
-import { useMouseDownEvent } from '../../../../../state/analytics/useLinkClicked';
-import { getLinkLineHeight, getLinkSizeStyles, getTruncateStyles, hasWhiteSpace } from '../../utils';
-const DEFAULT_MAX_LINES = 2;
-const MAXIMUM_MAX_LINES = 2;
-const MINIMUM_MAX_LINES = 1;
-const containerStyles = css({
-  flex: '1 1 auto'
-});
-const getThemeStyles = theme => {
-  switch (theme) {
-    case SmartLinkInternalTheme.Grey:
-      // We are being specifc with the CSS selectors to ensure that Confluence overrides
-      // do not affect our internal Smart Card styles
-      return css({
-        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
-        'a&': {
-          color: "var(--ds-text-subtlest, #626F86)",
-          '&:active, &:visited, &:focus, &:hover': {
-            color: "var(--ds-text-subtlest, #626F86)",
-            textDecoration: 'underline'
-          },
-          font: "var(--ds-font-body-UNSAFE_small, normal 400 12px/16px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, \"Helvetica Neue\", sans-serif)"
-        }
-      });
-    // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
-    case SmartLinkTheme.Black:
-      return css({
-        color: "var(--ds-text-subtle, #44546F)",
-        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
-        ':active': {
-          color: "var(--ds-text, #172B4D)"
-        },
-        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
-        ':hover': {
-          color: "var(--ds-text-subtle, #44546F)",
-          textDecoration: 'underline'
-        }
-      });
-    case SmartLinkTheme.Link:
-    default:
-      return css({
-        color: "var(--ds-link, #0C66E4)",
-        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
-        ':active': {
-          color: "var(--ds-link-pressed, #0055CC)"
-        },
-        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
-        ':hover': {
-          color: "var(--ds-link, #0C66E4)",
-          textDecoration: 'underline'
-        }
-      });
-  }
-};
-const getAnchorStyles = (size, theme, maxLines, hasSpace) => {
-  const sizeStyles = getLinkSizeStyles(size);
-  return css({
-    flex: '1 1 auto'
-  },
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
-  sizeStyles,
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
-  getTruncateStyles(maxLines, getLinkLineHeight(size), hasSpace ? 'break-word' : 'break-all'),
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
-  getThemeStyles(theme));
-};
-const getMaxLines = maxLines => {
-  if (maxLines > MAXIMUM_MAX_LINES) {
-    return DEFAULT_MAX_LINES;
-  }
-  if (maxLines < MINIMUM_MAX_LINES) {
-    return MINIMUM_MAX_LINES;
-  }
-  return maxLines;
-};
-const withTooltip = (trigger, content, testId) => jsx(Tooltip, {
-  content: content,
-  testId: `${testId}-tooltip`,
-  tag: "span"
-}, trigger);
-
-/**
- * A base element that represent an anchor.
- * @internal
- * @param {LinkProps} LinkProps - The props necessary for the Link element.
- * @see LinkIcon
- */
-const LinkOld = ({
-  hideTooltip,
-  maxLines = DEFAULT_MAX_LINES,
-  name,
-  overrideCss,
-  size = SmartLinkSize.Medium,
-  testId = 'smart-element-link',
-  text,
-  theme = SmartLinkTheme.Link,
-  url,
-  onClick,
-  target = '_blank'
-}) => {
-  const onMouseDown = useMouseDownEvent();
-  const hasSpace = useMemo(() => text ? hasWhiteSpace(text) : false, [text]);
-  const anchor = jsx("a", _extends({
-    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
-    css: [getAnchorStyles(size, theme, getMaxLines(maxLines), hasSpace), overrideCss],
-    "data-smart-element": name,
-    "data-smart-element-link": true,
-    "data-testid": testId,
-    onClick: onClick,
-    onMouseDown: onMouseDown,
-    href: url
-    // We do not want set the target if it is the default value of '_self'. This prevents link
-    // click issues in Confluence and Trello which rely on it not being set unless necessary.
-  }, target !== '_self' && {
-    target
-  }), text);
-  return jsx("span", {
-    css: containerStyles
-  }, hideTooltip || text === undefined ? anchor : withTooltip(anchor, text, testId));
-};
-export default LinkOld;

package/dist/es2019/view/FlexibleCard/components/elements/lozenge/LozengeOld.js

@@ -1,61 +0,0 @@
-import _extends from "@babel/runtime/helpers/extends";
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-import { css, jsx } from '@emotion/react';
-import AtlaskitLozenge from '@atlaskit/lozenge';
-import { fg } from '@atlaskit/platform-feature-flags';
-import { useFlexibleUiOptionContext } from '../../../../../state/flexible-ui-context';
-import LozengeAction from './lozenge-action';
-const styles = css({
-  display: 'inline-flex',
-  // eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
-  lineHeight: 'inherit'
-});
-
-/**
- * A base element that displays a Lozenge.
- * @internal
- * @param {LozengeProps} LozengeProps - The props necessary for the Lozenge element.
- * @see State
- */
-const LozengeOld = ({
-  action,
-  appearance = 'default',
-  name,
-  overrideCss,
-  style,
-  text,
-  testId = 'smart-element-lozenge'
-}) => {
-  const ui = useFlexibleUiOptionContext();
-  if (!text) {
-    return null;
-  }
-  const lozenge = action ? jsx(LozengeAction, {
-    action: action,
-    appearance: appearance,
-    testId: testId,
-    text: text,
-    zIndex: ui === null || ui === void 0 ? void 0 : ui.zIndex
-  }) : jsx(AtlaskitLozenge, _extends({
-    appearance: appearance
-  }, fg('platform-component-visual-refresh') ? {
-    isBold: true
-  } : undefined, {
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
-    style: style,
-    testId: `${testId}-lozenge`
-  }), text);
-  return jsx("span", {
-    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
-    css: [styles, overrideCss],
-    "data-fit-to-content": true,
-    "data-smart-element": name,
-    "data-smart-element-lozenge": true,
-    "data-testid": testId
-  }, lozenge);
-};
-export default LozengeOld;