@atlaskit/mention 27.17.1 → 27.18.0

package/dist/es2019/api/PresenceResource.js

@@ -1,7 +1,9 @@
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
+/* eslint-disable @repo/internal/deprecations/deprecation-ticket-required -- VOLTC-139 tracks removal of these deprecated re-export shims. */
+
 import { buildAtlAttributionHeaderValue } from '../util/atl-attribution';
-import debug from '../util/logger';
-import { AbstractResource } from './MentionResource';
+import { AbstractPresenceResource } from './AbstractPresenceResource';
+import { DefaultPresenceCache } from './DefaultPresenceCache';
+import { DefaultPresenceParser } from './DefaultPresenceParser';
 
 /**
  * Configuration for the PresenceResource, which manages real-time user
@@ -9,31 +11,7 @@ import { AbstractResource } from './MentionResource';
  * presence service.
  */
 
-class CacheEntry {
-  constructor(pres, timeout) {
-    this.presence = pres;
-    this.expiry = Date.now() + timeout;
-  }
-  expired() {
-    return Date.now() > this.expiry;
-  }
-}
-class AbstractPresenceResource extends AbstractResource {
-  refreshPresence(userIds) {
-    throw new Error(`not yet implemented.\nParams: userIds=${userIds}`);
-  }
-  notifyListeners(presences) {
-    this.changeListeners.forEach((listener, key) => {
-      try {
-        listener(presences);
-      } catch (e) {
-        // ignore error from listener
-        debug(`error from listener '${key}', ignoring`, e);
-      }
-    });
-  }
-}
-class PresenceResource extends AbstractPresenceResource {
+export class PresenceResource extends AbstractPresenceResource {
   constructor(config) {
     super();
     if (!config.url) {
@@ -102,163 +80,19 @@ class PresenceResource extends AbstractPresenceResource {
     return url;
   }
 }
-export class DefaultPresenceCache {
-  constructor(cacheTimeout, cacheTrigger) {
-    this.expiryInMillis = cacheTimeout ? cacheTimeout : DefaultPresenceCache.defaultTimeout;
-    this.flushTrigger = cacheTrigger ? cacheTrigger : DefaultPresenceCache.defaultFlushTrigger;
-    this.cache = {};
-    this.size = 0;
-  }
-
-  /**
-   * Precondition: _delete is only called internally if userId exists in cache
-   * Removes cache entry
-   * @param userId
-   */
-  _delete(userId) {
-    delete this.cache[userId];
-    this.size--;
-  }
-
-  /**
-   * Checks a cache entry and calls delete if the info has expired
-   * @param userId
-   */
-  _deleteIfExpired(userId) {
-    if (this.contains(userId) && this.cache[userId].expired()) {
-      this._delete(userId);
-    }
-  }
-
-  /**
-   * Cleans expired entries from cache
-   */
-  _removeExpired() {
-    Object.keys(this.cache).forEach(id => {
-      this._deleteIfExpired(id);
-    });
-  }
-
-  /**
-   * Checks if a user exists in the cache
-   * @param userId
-   */
-  contains(userId) {
-    return this.cache.hasOwnProperty(userId);
-  }
-
-  /**
-   * Retrieves a presence from the cache after checking for expired entries
-   * @param userId - to index the cache
-   * @returns Presence - the presence that matches the userId
-   */
-  get(userId) {
-    this._deleteIfExpired(userId);
-    if (!this.contains(userId)) {
-      return {};
-    }
-    return this.cache[userId].presence;
-  }
-
-  /**
-   * Retrieve multiple presences at once from the cache
-   * @param userIds - to index the cache
-   * @returns PresenceMap - A map of userIds to cached Presences
-   */
-  getBulk(userIds) {
-    const presences = {};
-    for (const userId of userIds) {
-      if (this.contains(userId)) {
-        presences[userId] = this.get(userId);
-      }
-    }
-    return presences;
-  }
+export default PresenceResource;
 
-  /**
-   * For a given list of ids, returns a subset
-   * of all the ids with missing cache entries.
-   * @param userIds - to index the cache
-   * @returns string[] - ids missing from the cache
-   */
-  getMissingUserIds(userIds) {
-    return userIds.filter(id => !this.contains(id));
-  }
+/**
+ * @deprecated Use `import { DefaultPresenceCache } from '@atlaskit/mention/presence-resource'` instead.
+ */
+export { DefaultPresenceCache } from './DefaultPresenceCache';
 
-  /**
-   * Precondition: presMap only contains ids of users not in cache
-   *               expired users must first be removed then reinserted with updated presence
-   * Updates the cache by adding the new Presence entries and setting the expiry time
-   * @param presMap
-   */
-  update(presMap) {
-    if (this.size >= this.flushTrigger) {
-      this._removeExpired();
-    }
-    Object.keys(presMap).forEach(userId => {
-      this.cache[userId] = new CacheEntry(presMap[userId], this.expiryInMillis);
-      this.size++;
-    });
-  }
-}
-_defineProperty(DefaultPresenceCache, "defaultTimeout", 20000);
-_defineProperty(DefaultPresenceCache, "defaultFlushTrigger", 50);
-export class DefaultPresenceParser {
-  mapState(state) {
-    if (state === 'unavailable') {
-      return 'offline';
-    } else if (state === 'available') {
-      return 'online';
-    } else {
-      return state;
-    }
-  }
-  parse(response) {
-    const presences = {};
-    if (response.hasOwnProperty('data') && response['data'].hasOwnProperty('PresenceBulk')) {
-      const results = response['data'].PresenceBulk;
-      // Store map of state and time indexed by userId.  Ignore null results.
-      for (const user of results) {
-        if (user.userId && user.state) {
-          const state = DefaultPresenceParser.extractState(user) || user.state;
-          presences[user.userId] = {
-            status: this.mapState(state)
-          };
-        } else if (!user.hasOwnProperty('userId') || !user.hasOwnProperty('state')) {
-          // eslint-disable-next-line no-console
-          console.error('Unexpected response from presence service contains keys: ' + Object.keys(user));
-        }
-      }
-    }
-    return presences;
-  }
-  static extractState(presence) {
-    if (DefaultPresenceParser.isFocusState(presence)) {
-      return DefaultPresenceParser.FOCUS_STATE;
-    }
-    return presence.state;
-  }
+/**
+ * @deprecated Use `import { DefaultPresenceParser } from '@atlaskit/mention/presence-resource'` instead.
+ */
+export { DefaultPresenceParser } from './DefaultPresenceParser';
 
-  /*
-     This is a bit of an odd exception. In the case where a user is in "Focus Mode", their presence state
-     is returned as 'busy' along with a `stateMetadata` object containing a `focus` field.
-     In this case we ignore the value of the `state` field and treat the presence as a 'focus' state.
-    */
-  static isFocusState(presence) {
-    if (presence.stateMetadata) {
-      try {
-        const metadata = JSON.parse(presence.stateMetadata);
-        return metadata && !!metadata.focus;
-      } catch (e) {
-        // eslint-disable-next-line no-console
-        console.error(`Failed to parse presence's stateMetadata for user with id ${presence.userId}: ${presence.stateMetadata}`);
-        // eslint-disable-next-line no-console
-        console.error(e);
-      }
-    }
-    return false;
-  }
-}
-_defineProperty(DefaultPresenceParser, "FOCUS_STATE", 'focus');
-export { AbstractPresenceResource };
-export default PresenceResource;
+/**
+ * @deprecated Use `import { AbstractPresenceResource } from '@atlaskit/mention/presence-resource'` instead.
+ */
+export { AbstractPresenceResource } from './AbstractPresenceResource';

package/dist/es2019/api/Queue.js

@@ -0,0 +1 @@
+export {};

package/dist/es2019/api/isResolvingMentionProvider.js

@@ -0,0 +1 @@
+export const isResolvingMentionProvider = p => !!(p && p.supportsMentionNameResolving && p.supportsMentionNameResolving());

package/dist/es2019/api/mergeNameResolverQueues.js

@@ -0,0 +1,25 @@
+/**
+ * Merge the two queues making sure to merge callback arrays for items in queueB already in queueA.
+ * This addresses [this ticket](https://product-fabric.atlassian.net/browse/QS-3789).
+ */
+export function mergeNameResolverQueues(queueA, queueB) {
+  const queueBeingMerged = new Map([...queueA]);
+
+  // now add the items from the second queue that are not already in the
+  //  merged queue being built
+  [...queueB].forEach(item => {
+    const [key, queueBCallbacks] = item;
+    const itemAlreadyInMergedQueue = queueBeingMerged.has(key);
+    if (!itemAlreadyInMergedQueue) {
+      queueBeingMerged.set(key, queueBCallbacks);
+    } else {
+      var _queueBeingMerged$get;
+      // item already in merged queue, merge the callback arrays
+      const queueACallbacks = (_queueBeingMerged$get = queueBeingMerged.get(key)) !== null && _queueBeingMerged$get !== void 0 ? _queueBeingMerged$get : [];
+      const mergedCallbacks = new Set([...queueBCallbacks, ...queueACallbacks]);
+      const deduplicatedCallbacks = Array.from(mergedCallbacks.values()); // prevents calling them twice
+      queueBeingMerged.set(key, deduplicatedCallbacks);
+    }
+  });
+  return queueBeingMerged;
+}

package/dist/es2019/components/Mention/MentionInternal.js

@@ -0,0 +1,225 @@
+/* MentionInternal.tsx generated by @compiled/babel-plugin v2.0.0 */
+import _extends from "@babel/runtime/helpers/extends";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import "./MentionInternal.compiled.css";
+import { ax, ix } from "@compiled/react/runtime";
+/* eslint-disable @atlaskit/design-system/no-deprecated-imports, @typescript-eslint/ban-types -- Preserve existing mention implementation while focus-ring usage is reviewed separately. */
+
+import React from 'react';
+import FocusRing from '@atlaskit/focus-ring';
+import { UFOExperienceState } from '@atlaskit/ufo';
+import { UNKNOWN_USER_ID } from '../../_constants';
+import { isRestricted } from '../../is-restricted';
+import { MentionType } from '../../types';
+import { UnknownUserError } from '../../util/i18n';
+import AsyncDisabledMentionTooltip from '../DisabledMentionTooltip';
+import MessagesIntlProvider from '../MessagesIntlProvider';
+import AsyncNoAccessTooltip from '../NoAccessTooltip';
+import PrimitiveMention from './PrimitiveMention';
+import { ANALYTICS_HOVER_DELAY } from './index';
+import { UfoErrorBoundary, mentionRenderedUfoExperience } from './ufoExperiences';
+const avatarStyles = null;
+const avatarFallbackStyles = null;
+const avatarImageStyles = null;
+const agentAvatarStyles = null;
+export class MentionInternal extends React.PureComponent {
+  constructor(props) {
+    super(props);
+    _defineProperty(this, "state", {
+      hasAvatarError: false
+    });
+    _defineProperty(this, "handleAvatarError", () => {
+      this.setState({
+        hasAvatarError: true
+      });
+    });
+    _defineProperty(this, "handleOnClick", e => {
+      const {
+        id,
+        text,
+        onClick,
+        isDisabled
+      } = this.props;
+      if (isDisabled) {
+        // Disabled chips do not invoke their click handler.
+        return;
+      }
+      if (onClick) {
+        onClick(id, text, e);
+      }
+    });
+    _defineProperty(this, "handleOnMouseEnter", e => {
+      const {
+        id,
+        text,
+        onMouseEnter,
+        onHover
+      } = this.props;
+      if (onMouseEnter) {
+        onMouseEnter(id, text, e);
+      }
+      this.hoverTimeout = window.setTimeout(() => {
+        if (onHover) {
+          onHover();
+        }
+        this.hoverTimeout = undefined;
+      }, ANALYTICS_HOVER_DELAY);
+    });
+    _defineProperty(this, "handleOnMouseLeave", e => {
+      const {
+        id,
+        text,
+        onMouseLeave
+      } = this.props;
+      if (onMouseLeave) {
+        onMouseLeave(id, text, e);
+      }
+      if (this.hoverTimeout) {
+        clearTimeout(this.hoverTimeout);
+      }
+    });
+    _defineProperty(this, "getMentionType", () => {
+      const {
+        accessLevel,
+        isHighlighted,
+        isDisabled
+      } = this.props;
+      if (isDisabled) {
+        return MentionType.DISABLED;
+      }
+      if (isHighlighted) {
+        return MentionType.SELF;
+      }
+      if (isRestricted(accessLevel)) {
+        return MentionType.RESTRICTED;
+      }
+      return MentionType.DEFAULT;
+    });
+    mentionRenderedUfoExperience.getInstance(props.id).start();
+  }
+  componentDidMount() {
+    mentionRenderedUfoExperience.getInstance(this.props.id).success();
+  }
+  static getDerivedStateFromProps(props, state) {
+    if (props.avatarUrl !== state.avatarUrl) {
+      return {
+        avatarUrl: props.avatarUrl,
+        hasAvatarError: false
+      };
+    }
+    return null;
+  }
+  componentWillUnmount() {
+    if (this.hoverTimeout) {
+      clearTimeout(this.hoverTimeout);
+    }
+    const ufoInstance = mentionRenderedUfoExperience.getInstance(this.props.id);
+    if ([UFOExperienceState['STARTED'], UFOExperienceState['IN_PROGRESS']].includes(ufoInstance.state)) {
+      ufoInstance.abort();
+    }
+  }
+  renderUnknownUserError(id) {
+    return /*#__PURE__*/React.createElement(UnknownUserError, {
+      values: {
+        userId: id.slice(-5)
+      }
+    }, message => /*#__PURE__*/React.createElement(React.Fragment, null, `@${message}`));
+  }
+  render() {
+    const {
+      handleAvatarError,
+      handleOnClick,
+      handleOnMouseEnter,
+      handleOnMouseLeave,
+      props
+    } = this;
+    const {
+      appType,
+      avatarUrl,
+      text,
+      id,
+      accessLevel,
+      localId,
+      disabledTooltip,
+      isAvatarImagePreShaped,
+      renderAvatarSlot
+    } = props;
+    const mentionType = this.getMentionType();
+    const failedMention = text === `@${UNKNOWN_USER_ID}`;
+    const showAvatarSlot = Boolean(renderAvatarSlot) && !failedMention;
+    const visibleText = showAvatarSlot && text.startsWith('@') ? text.slice(1) : text;
+    const shouldApplyAgentShape = appType === 'agent' && !isAvatarImagePreShaped;
+    const shouldRenderAvatar = avatarUrl && !this.state.hasAvatarError;
+    const showRestrictedTooltip = mentionType === MentionType.RESTRICTED;
+    const showDisabledTooltip = mentionType === MentionType.DISABLED && !!disabledTooltip;
+
+    // A11y: when the chip is in the disabled visual state, expose
+    // `aria-disabled` so assistive tech announces it as such. The
+    // disabled-tooltip text is mirrored into `aria-label` so the
+    // announcement carries the reason even without portal-id wiring for
+    // `aria-describedby`.
+    const isDisabledChip = mentionType === MentionType.DISABLED;
+    const disabledA11yProps = isDisabledChip ? {
+      'aria-disabled': true,
+      tabIndex: 0,
+      ...(disabledTooltip ? {
+        'aria-label': `${text || '@...'} — ${disabledTooltip}`
+      } : {})
+    } : {};
+    const mentionComponent = /*#__PURE__*/React.createElement(FocusRing, null, /*#__PURE__*/React.createElement(PrimitiveMention, _extends({
+      isAvatarVisible: showAvatarSlot,
+      mentionType: mentionType,
+      onClick: handleOnClick,
+      onMouseEnter: handleOnMouseEnter,
+      onMouseLeave: handleOnMouseLeave,
+      spellCheck: false,
+      "data-testid": `mention-${id}`,
+      "data-mention-type": mentionType,
+      "data-mention-tooltip": showRestrictedTooltip || showDisabledTooltip
+    }, disabledA11yProps), failedMention ? this.renderUnknownUserError(id) : showAvatarSlot ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("span", {
+      "aria-hidden": "true",
+      "data-testid": "mention-avatar-slot",
+      className: ax(["_1reo15vq _18m915vq _2rko1rr0 _1e0c116y _1bsb7vkz _4t3i7vkz _4cvr1h6o _1bah1h6o _1o9zidpf _12l21b66 _s7n410e5", shouldApplyAgentShape && "_2rkoidpf _mkrz1l17", this.state.hasAvatarError && "_s7n41q9y"])
+    }, shouldRenderAvatar ? /*#__PURE__*/React.createElement("img", {
+      alt: "",
+      decoding: "async",
+      draggable: false,
+      height: 16,
+      loading: "lazy",
+      onError: handleAvatarError,
+      src: avatarUrl,
+      "data-testid": "mention-avatar",
+      width: 16,
+      className: ax(["_1e0c1ule _1bsb1osq _4t3i1osq _5ral1dfr"])
+    }) : this.state.hasAvatarError ? '@' : null), /*#__PURE__*/React.createElement("span", null, visibleText || '...')) : text || '@...'));
+    const ssrPlaceholderProp = props.ssrPlaceholderId ? {
+      'data-ssr-placeholder': props.ssrPlaceholderId
+    } : {};
+    const wrappedMention = (() => {
+      if (showRestrictedTooltip) {
+        return /*#__PURE__*/React.createElement(React.Suspense, {
+          fallback: mentionComponent
+        }, /*#__PURE__*/React.createElement(AsyncNoAccessTooltip, {
+          name: text
+        }, mentionComponent));
+      }
+      if (showDisabledTooltip) {
+        return /*#__PURE__*/React.createElement(React.Suspense, {
+          fallback: mentionComponent
+        }, /*#__PURE__*/React.createElement(AsyncDisabledMentionTooltip, {
+          tooltip: disabledTooltip
+        }, mentionComponent));
+      }
+      return mentionComponent;
+    })();
+    return /*#__PURE__*/React.createElement(UfoErrorBoundary, {
+      id: id
+    }, /*#__PURE__*/React.createElement("span", _extends({
+      id: localId,
+      "data-mention-id": id,
+      "data-local-id": localId,
+      "data-access-level": accessLevel,
+      spellCheck: false
+    }, ssrPlaceholderProp), /*#__PURE__*/React.createElement(MessagesIntlProvider, null, wrappedMention)));
+  }
+}

package/dist/es2019/components/Mention/ResourcedMention.js

@@ -1,9 +1,10 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import React from 'react';
-import { isResolvingMentionProvider } from '../../api/MentionResource';
-import { isPromise, MentionNameStatus } from '../../types';
-import Mention, { UNKNOWN_USER_ID } from './';
+import { isResolvingMentionProvider } from '../../api/isResolvingMentionProvider';
+import { isPromise } from '../../is-promise';
+import { MentionNameStatus } from '../../types';
 import debug from '../../util/logger';
+import Mention, { UNKNOWN_USER_ID } from './';
 export default class ResourcedMention extends React.PureComponent {
   constructor(_props) {
     super(_props);