@atlaskit/emoji 65.0.0 → 65.2.0

package/dist/es2019/components/common/EmojiPreview.js

@@ -1,152 +0,0 @@
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-
-/** @jsx jsx */
-import { jsx } from '@emotion/core';
-import AkButton from '@atlaskit/button/standard-button';
-import AddIcon from '@atlaskit/icon/glyph/add';
-import { PureComponent } from 'react';
-import { FormattedMessage, injectIntl } from 'react-intl-next';
-import EmojiButton from '../../components/common/EmojiButton';
-import { messages } from '../i18n';
-import ToneSelector from './ToneSelector';
-import { setSkinToneAriaLabelText } from './setSkinToneAriaLabelText';
-import { addCustomEmoji, addCustomEmojiButton, emojiPickerAddEmoji, emojiPreview, toneSelectorContainer } from './styles';
-import { EmojiPreviewComponent } from './EmojiPreviewComponent';
-export class EmojiPreview extends PureComponent {
-  constructor(...args) {
-    super(...args);
-
-    _defineProperty(this, "state", {
-      selectingTone: false
-    });
-
-    _defineProperty(this, "onToneButtonClick", () => {
-      this.setState({
-        selectingTone: !this.state.selectingTone
-      });
-    });
-
-    _defineProperty(this, "onToneSelected", toneValue => {
-      this.setState({
-        selectingTone: false
-      });
-
-      if (this.props.onToneSelected) {
-        this.props.onToneSelected(toneValue);
-      }
-    });
-
-    _defineProperty(this, "onMouseLeave", () => {
-      const {
-        selectingTone
-      } = this.state;
-      const {
-        onToneSelectorCancelled
-      } = this.props;
-
-      if (selectingTone && onToneSelectorCancelled) {
-        onToneSelectorCancelled();
-      }
-
-      this.setState({
-        selectingTone: false
-      });
-    });
-  }
-
-  renderTones() {
-    const {
-      toneEmoji,
-      selectedTone,
-      intl
-    } = this.props;
-    const {
-      formatMessage
-    } = intl;
-
-    if (!toneEmoji) {
-      return null;
-    }
-
-    let previewEmoji = toneEmoji;
-
-    if (selectedTone && previewEmoji.skinVariations) {
-      previewEmoji = previewEmoji.skinVariations[(selectedTone || 1) - 1];
-    }
-
-    return jsx("div", {
-      className: toneSelectorContainer
-    }, this.state.selectingTone && jsx(ToneSelector, {
-      emoji: toneEmoji,
-      onToneSelected: this.onToneSelected,
-      previewEmojiId: previewEmoji.id
-    }), jsx(EmojiButton, {
-      ariaExpanded: this.state.selectingTone,
-      emoji: previewEmoji,
-      selectOnHover: true,
-      onSelected: this.onToneButtonClick,
-      ariaLabelText: formatMessage(messages.emojiSelectSkinToneButtonAriaLabelText, {
-        selectedTone: `${setSkinToneAriaLabelText(previewEmoji.name)} selected`
-      })
-    }));
-  }
-
-  renderEmojiPreview() {
-    const {
-      selectingTone
-    } = this.state;
-    const {
-      emoji,
-      uploadEnabled
-    } = this.props;
-
-    if (!emoji || selectingTone || uploadEnabled) {
-      return null;
-    }
-
-    return jsx(EmojiPreviewComponent, {
-      emoji: emoji
-    });
-  } // note: emoji-picker-add-emoji className is used by pollinator synthetic checks
-
-
-  renderAddOwnEmoji() {
-    const {
-      onOpenUpload,
-      uploadEnabled,
-      intl
-    } = this.props;
-    const {
-      selectingTone
-    } = this.state;
-    const {
-      formatMessage
-    } = intl;
-
-    if (!uploadEnabled || selectingTone) {
-      return null;
-    }
-
-    return jsx("div", {
-      css: addCustomEmoji
-    }, jsx(FormattedMessage, messages.addCustomEmojiLabel, label => jsx(AkButton, {
-      onClick: onOpenUpload,
-      iconBefore: jsx(AddIcon, {
-        label: formatMessage(messages.addCustomEmojiLabel),
-        size: "small"
-      }),
-      appearance: "subtle",
-      css: addCustomEmojiButton,
-      className: emojiPickerAddEmoji
-    }, label)));
-  }
-
-  render() {
-    return jsx("div", {
-      css: emojiPreview,
-      onMouseLeave: this.onMouseLeave
-    }, this.renderAddOwnEmoji(), this.renderEmojiPreview(), this.renderTones());
-  }
-
-}
-export default injectIntl(EmojiPreview);

package/dist/esm/components/common/EmojiPreview.js

@@ -1,170 +0,0 @@
-import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
-import _createClass from "@babel/runtime/helpers/createClass";
-import _assertThisInitialized from "@babel/runtime/helpers/assertThisInitialized";
-import _inherits from "@babel/runtime/helpers/inherits";
-import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
-import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-
-function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
-
-function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
-
-/** @jsx jsx */
-import { jsx } from '@emotion/core';
-import AkButton from '@atlaskit/button/standard-button';
-import AddIcon from '@atlaskit/icon/glyph/add';
-import { PureComponent } from 'react';
-import { FormattedMessage, injectIntl } from 'react-intl-next';
-import EmojiButton from '../../components/common/EmojiButton';
-import { messages } from '../i18n';
-import ToneSelector from './ToneSelector';
-import { setSkinToneAriaLabelText } from './setSkinToneAriaLabelText';
-import { addCustomEmoji, addCustomEmojiButton, emojiPickerAddEmoji, emojiPreview, toneSelectorContainer } from './styles';
-import { EmojiPreviewComponent } from './EmojiPreviewComponent';
-export var EmojiPreview = /*#__PURE__*/function (_PureComponent) {
-  _inherits(EmojiPreview, _PureComponent);
-
-  var _super = _createSuper(EmojiPreview);
-
-  function EmojiPreview() {
-    var _this;
-
-    _classCallCheck(this, EmojiPreview);
-
-    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-      args[_key] = arguments[_key];
-    }
-
-    _this = _super.call.apply(_super, [this].concat(args));
-
-    _defineProperty(_assertThisInitialized(_this), "state", {
-      selectingTone: false
-    });
-
-    _defineProperty(_assertThisInitialized(_this), "onToneButtonClick", function () {
-      _this.setState({
-        selectingTone: !_this.state.selectingTone
-      });
-    });
-
-    _defineProperty(_assertThisInitialized(_this), "onToneSelected", function (toneValue) {
-      _this.setState({
-        selectingTone: false
-      });
-
-      if (_this.props.onToneSelected) {
-        _this.props.onToneSelected(toneValue);
-      }
-    });
-
-    _defineProperty(_assertThisInitialized(_this), "onMouseLeave", function () {
-      var selectingTone = _this.state.selectingTone;
-      var onToneSelectorCancelled = _this.props.onToneSelectorCancelled;
-
-      if (selectingTone && onToneSelectorCancelled) {
-        onToneSelectorCancelled();
-      }
-
-      _this.setState({
-        selectingTone: false
-      });
-    });
-
-    return _this;
-  }
-
-  _createClass(EmojiPreview, [{
-    key: "renderTones",
-    value: function renderTones() {
-      var _this$props = this.props,
-          toneEmoji = _this$props.toneEmoji,
-          selectedTone = _this$props.selectedTone,
-          intl = _this$props.intl;
-      var formatMessage = intl.formatMessage;
-
-      if (!toneEmoji) {
-        return null;
-      }
-
-      var previewEmoji = toneEmoji;
-
-      if (selectedTone && previewEmoji.skinVariations) {
-        previewEmoji = previewEmoji.skinVariations[(selectedTone || 1) - 1];
-      }
-
-      return jsx("div", {
-        className: toneSelectorContainer
-      }, this.state.selectingTone && jsx(ToneSelector, {
-        emoji: toneEmoji,
-        onToneSelected: this.onToneSelected,
-        previewEmojiId: previewEmoji.id
-      }), jsx(EmojiButton, {
-        ariaExpanded: this.state.selectingTone,
-        emoji: previewEmoji,
-        selectOnHover: true,
-        onSelected: this.onToneButtonClick,
-        ariaLabelText: formatMessage(messages.emojiSelectSkinToneButtonAriaLabelText, {
-          selectedTone: "".concat(setSkinToneAriaLabelText(previewEmoji.name), " selected")
-        })
-      }));
-    }
-  }, {
-    key: "renderEmojiPreview",
-    value: function renderEmojiPreview() {
-      var selectingTone = this.state.selectingTone;
-      var _this$props2 = this.props,
-          emoji = _this$props2.emoji,
-          uploadEnabled = _this$props2.uploadEnabled;
-
-      if (!emoji || selectingTone || uploadEnabled) {
-        return null;
-      }
-
-      return jsx(EmojiPreviewComponent, {
-        emoji: emoji
-      });
-    } // note: emoji-picker-add-emoji className is used by pollinator synthetic checks
-
-  }, {
-    key: "renderAddOwnEmoji",
-    value: function renderAddOwnEmoji() {
-      var _this$props3 = this.props,
-          onOpenUpload = _this$props3.onOpenUpload,
-          uploadEnabled = _this$props3.uploadEnabled,
-          intl = _this$props3.intl;
-      var selectingTone = this.state.selectingTone;
-      var formatMessage = intl.formatMessage;
-
-      if (!uploadEnabled || selectingTone) {
-        return null;
-      }
-
-      return jsx("div", {
-        css: addCustomEmoji
-      }, jsx(FormattedMessage, messages.addCustomEmojiLabel, function (label) {
-        return jsx(AkButton, {
-          onClick: onOpenUpload,
-          iconBefore: jsx(AddIcon, {
-            label: formatMessage(messages.addCustomEmojiLabel),
-            size: "small"
-          }),
-          appearance: "subtle",
-          css: addCustomEmojiButton,
-          className: emojiPickerAddEmoji
-        }, label);
-      }));
-    }
-  }, {
-    key: "render",
-    value: function render() {
-      return jsx("div", {
-        css: emojiPreview,
-        onMouseLeave: this.onMouseLeave
-      }, this.renderAddOwnEmoji(), this.renderEmojiPreview(), this.renderTones());
-    }
-  }]);
-
-  return EmojiPreview;
-}(PureComponent);
-export default injectIntl(EmojiPreview);

package/dist/types/components/common/EmojiPreview.d.ts

@@ -1,31 +0,0 @@
-import { PureComponent } from 'react';
-import { WrappedComponentProps } from 'react-intl-next';
-import { EmojiDescription, EmojiDescriptionWithVariations, OnToneSelected, OnToneSelectorCancelled, ToneSelection } from '../../types';
-export interface Props {
-    emoji?: EmojiDescription;
-    toneEmoji?: EmojiDescriptionWithVariations;
-    selectedTone?: ToneSelection;
-    onToneSelected?: OnToneSelected;
-    onToneSelectorCancelled?: OnToneSelectorCancelled;
-    uploadEnabled?: boolean;
-    onOpenUpload?: () => void;
-}
-export interface State {
-    selectingTone: boolean;
-}
-export declare class EmojiPreview extends PureComponent<Props & WrappedComponentProps, State> {
-    state: {
-        selectingTone: boolean;
-    };
-    onToneButtonClick: () => void;
-    onToneSelected: (toneValue: number) => void;
-    onMouseLeave: () => void;
-    renderTones(): JSX.Element | null;
-    renderEmojiPreview(): JSX.Element | null;
-    renderAddOwnEmoji(): JSX.Element | null;
-    render(): JSX.Element;
-}
-declare const _default: import("react").FC<import("react-intl-next").WithIntlProps<Props & WrappedComponentProps<"intl">>> & {
-    WrappedComponent: import("react").ComponentType<Props & WrappedComponentProps<"intl">>;
-};
-export default _default;