@sendbird/uikit-react 3.0.0-alpha.1 → 3.0.0-beta.2

package/cjs/ui/ChatHeader.js

@@ -0,0 +1,145 @@
+'use strict';
+
+var React = require('react');
+var PropTypes = require('prop-types');
+var ui_Label = require('../index-21f31180.js');
+var LocalizationContext = require('../LocalizationContext-3b5ce8ae.js');
+var ui_Icon = require('./Icon.js');
+var ui_IconButton = require('./IconButton.js');
+var ui_ChannelAvatar = require('./ChannelAvatar.js');
+require('../_rollupPluginBabelHelpers-e54d2387.js');
+require('../stringSet-f4da182b.js');
+require('../index-d9439e95.js');
+require('./Avatar.js');
+require('../tslib.es6-d7d0a427.js');
+require('./ImageRenderer.js');
+require('../uuid-ba6cc3c5.js');
+require('../utils-b95288a8.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
+
+var getChannelTitle = function getChannelTitle() {
+  var channel = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+  var currentUserId = arguments.length > 1 ? arguments[1] : undefined;
+  var stringSet = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : ui_Label.LabelStringSet;
+
+  if (!channel || !channel.name && !channel.members) {
+    return stringSet.NO_TITLE;
+  }
+
+  if (channel.name && channel.name !== 'Group Channel') {
+    return channel.name;
+  }
+
+  if (channel.members.length === 1) {
+    return stringSet.NO_MEMBERS;
+  }
+
+  return channel.members.filter(function (_ref) {
+    var userId = _ref.userId;
+    return userId !== currentUserId;
+  }).map(function (_ref2) {
+    var nickname = _ref2.nickname;
+    return nickname || stringSet.NO_NAME;
+  }).join(', ');
+};
+
+// delete
+
+var noop = function noop() {};
+
+function ChatHeader(props) {
+  var currentGroupChannel = props.currentGroupChannel,
+      currentUser = props.currentUser,
+      title = props.title,
+      subTitle = props.subTitle,
+      isMuted = props.isMuted,
+      theme = props.theme,
+      showSearchIcon = props.showSearchIcon,
+      onSearchClick = props.onSearchClick,
+      onActionClick = props.onActionClick;
+  var userId = currentUser.userId;
+
+  var _useContext = React.useContext(LocalizationContext.LocalizationContext),
+      stringSet = _useContext.stringSet;
+
+  return /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "sendbird-chat-header"
+  }, /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "sendbird-chat-header__left"
+  }, /*#__PURE__*/React__default["default"].createElement(ui_ChannelAvatar, {
+    theme: theme,
+    channel: currentGroupChannel,
+    userId: userId,
+    height: 32,
+    width: 32
+  }), /*#__PURE__*/React__default["default"].createElement(ui_Label.Label, {
+    className: "sendbird-chat-header__left__title",
+    type: ui_Label.LabelTypography.H_2,
+    color: ui_Label.LabelColors.ONBACKGROUND_1
+  }, title || getChannelTitle(currentGroupChannel, userId, stringSet)), /*#__PURE__*/React__default["default"].createElement(ui_Label.Label, {
+    className: "sendbird-chat-header__left__subtitle",
+    type: ui_Label.LabelTypography.BODY_1,
+    color: ui_Label.LabelColors.ONBACKGROUND_2
+  }, subTitle)), /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "sendbird-chat-header__right"
+  }, (typeof isMuted === 'string' && isMuted === 'true' || typeof isMuted === 'boolean' && isMuted) && /*#__PURE__*/React__default["default"].createElement(ui_Icon["default"], {
+    className: "sendbird-chat-header__right__mute",
+    type: ui_Icon.IconTypes.NOTIFICATIONS_OFF_FILLED,
+    width: "24px",
+    height: "24px"
+  }), showSearchIcon && /*#__PURE__*/React__default["default"].createElement(ui_IconButton, {
+    className: "sendbird-chat-header__right__search",
+    width: "32px",
+    height: "32px",
+    onClick: onSearchClick
+  }, /*#__PURE__*/React__default["default"].createElement(ui_Icon["default"], {
+    type: ui_Icon.IconTypes.SEARCH,
+    fillColor: ui_Icon.IconColors.PRIMARY,
+    width: "24px",
+    height: "24px"
+  })), /*#__PURE__*/React__default["default"].createElement(ui_IconButton, {
+    className: "sendbird-chat-header__right__info",
+    width: "32px",
+    height: "32px",
+    onClick: onActionClick
+  }, /*#__PURE__*/React__default["default"].createElement(ui_Icon["default"], {
+    type: ui_Icon.IconTypes.INFO,
+    fillColor: ui_Icon.IconColors.PRIMARY,
+    width: "24px",
+    height: "24px"
+  }))));
+}
+ChatHeader.propTypes = {
+  currentGroupChannel: PropTypes__default["default"].shape({
+    members: PropTypes__default["default"].arrayOf(PropTypes__default["default"].shape({})),
+    coverUrl: PropTypes__default["default"].string
+  }),
+  currentUser: PropTypes__default["default"].shape({
+    userId: PropTypes__default["default"].string
+  }),
+  title: PropTypes__default["default"].string,
+  subTitle: PropTypes__default["default"].oneOfType([PropTypes__default["default"].bool, PropTypes__default["default"].string]),
+  isMuted: PropTypes__default["default"].oneOfType([PropTypes__default["default"].string, PropTypes__default["default"].bool]),
+  theme: PropTypes__default["default"].string,
+  showSearchIcon: PropTypes__default["default"].bool,
+  onSearchClick: PropTypes__default["default"].func,
+  onActionClick: PropTypes__default["default"].func
+};
+ChatHeader.defaultProps = {
+  currentGroupChannel: {},
+  currentUser: {},
+  title: '',
+  subTitle: '',
+  isMuted: false,
+  theme: 'light',
+  showSearchIcon: false,
+  onSearchClick: noop,
+  onActionClick: noop
+};
+
+module.exports = ChatHeader;
+//# sourceMappingURL=ChatHeader.js.map

package/cjs/ui/ChatHeader.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChatHeader.js","sources":["../../../src/ui/ChatHeader/utils.js","../../../src/ui/ChatHeader/index.jsx"],"sourcesContent":["import formatDistanceToNowStrict from 'date-fns/formatDistanceToNowStrict';\nimport { LabelStringSet } from '../Label';\n\nexport const prettyDate = (date) => formatDistanceToNowStrict(date, { addSuffix: true });\n\nexport const getChannelTitle = (channel = {}, currentUserId, stringSet = LabelStringSet) => {\n  if (!channel || (!channel.name && !channel.members)) {\n    return stringSet.NO_TITLE;\n  }\n  if (channel.name && channel.name !== 'Group Channel') {\n    return channel.name;\n  }\n\n  if (channel.members.length === 1) {\n    return stringSet.NO_MEMBERS;\n  }\n\n  return channel.members\n    .filter(({ userId }) => userId !== currentUserId)\n    .map(({ nickname }) => (nickname || stringSet.NO_NAME))\n    .join(', ');\n};\n","// delete\nimport React, { useContext } from 'react';\nimport PropTypes from 'prop-types';\n\nimport './index.scss';\nimport * as utils from './utils';\n\nimport { LocalizationContext } from '../../lib/LocalizationContext';\nimport Label, { LabelTypography, LabelColors } from '../Label';\nimport Icon, { IconTypes, IconColors } from '../Icon';\nimport IconButton from '../IconButton';\nimport ChannelAvatar from '../ChannelAvatar/index';\n\nconst noop = () => { };\nexport default function ChatHeader(props) {\n  const {\n    currentGroupChannel,\n    currentUser,\n    title,\n    subTitle,\n    isMuted,\n    theme,\n    showSearchIcon,\n    onSearchClick,\n    onActionClick,\n  } = props;\n  const { userId } = currentUser;\n  const { stringSet } = useContext(LocalizationContext);\n  return (\n    <div className=\"sendbird-chat-header\">\n      <div className=\"sendbird-chat-header__left\">\n        <ChannelAvatar\n          theme={theme}\n          channel={currentGroupChannel}\n          userId={userId}\n          height={32}\n          width={32}\n        />\n        <Label\n          className=\"sendbird-chat-header__left__title\"\n          type={LabelTypography.H_2}\n          color={LabelColors.ONBACKGROUND_1}\n        >\n          {title || utils.getChannelTitle(currentGroupChannel, userId, stringSet)}\n        </Label>\n        <Label\n          className=\"sendbird-chat-header__left__subtitle\"\n          type={LabelTypography.BODY_1}\n          color={LabelColors.ONBACKGROUND_2}\n        >\n          {subTitle}\n        </Label>\n      </div>\n      <div className=\"sendbird-chat-header__right\">\n        {\n          ((typeof isMuted === 'string' && isMuted === 'true') || (typeof isMuted === 'boolean' && isMuted))\n            && (\n              <Icon\n                className=\"sendbird-chat-header__right__mute\"\n                type={IconTypes.NOTIFICATIONS_OFF_FILLED}\n                width=\"24px\"\n                height=\"24px\"\n              />\n            )\n        }\n        {\n          showSearchIcon && (\n            <IconButton\n              className=\"sendbird-chat-header__right__search\"\n              width=\"32px\"\n              height=\"32px\"\n              onClick={onSearchClick}\n            >\n              <Icon\n                type={IconTypes.SEARCH}\n                fillColor={IconColors.PRIMARY}\n                width=\"24px\"\n                height=\"24px\"\n              />\n            </IconButton>\n          )\n        }\n        <IconButton\n          className=\"sendbird-chat-header__right__info\"\n          width=\"32px\"\n          height=\"32px\"\n          onClick={onActionClick}\n        >\n          <Icon\n            type={IconTypes.INFO}\n            fillColor={IconColors.PRIMARY}\n            width=\"24px\"\n            height=\"24px\"\n          />\n        </IconButton>\n      </div>\n    </div>\n  );\n}\n\nChatHeader.propTypes = {\n  currentGroupChannel: PropTypes.shape({\n    members: PropTypes.arrayOf(PropTypes.shape({})),\n    coverUrl: PropTypes.string,\n  }),\n  currentUser: PropTypes.shape({\n    userId: PropTypes.string,\n  }),\n  title: PropTypes.string,\n  subTitle: PropTypes.oneOfType([\n    PropTypes.bool,\n    PropTypes.string,\n  ]),\n  isMuted: PropTypes.oneOfType([\n    PropTypes.string,\n    PropTypes.bool,\n  ]),\n  theme: PropTypes.string,\n  showSearchIcon: PropTypes.bool,\n  onSearchClick: PropTypes.func,\n  onActionClick: PropTypes.func,\n};\n\nChatHeader.defaultProps = {\n  currentGroupChannel: {},\n  currentUser: {},\n  title: '',\n  subTitle: '',\n  isMuted: false,\n  theme: 'light',\n  showSearchIcon: false,\n  onSearchClick: noop,\n  onActionClick: noop,\n};\n"],"names":["getChannelTitle","channel","currentUserId","stringSet","LabelStringSet","name","members","NO_TITLE","length","NO_MEMBERS","filter","userId","map","nickname","NO_NAME","join","noop","ChatHeader","props","currentGroupChannel","currentUser","title","subTitle","isMuted","theme","showSearchIcon","onSearchClick","onActionClick","useContext","LocalizationContext","React","ChannelAvatar","Label","LabelTypography","H_2","LabelColors","ONBACKGROUND_1","utils","BODY_1","ONBACKGROUND_2","Icon","IconTypes","NOTIFICATIONS_OFF_FILLED","IconButton","SEARCH","IconColors","PRIMARY","INFO","propTypes","PropTypes","shape","arrayOf","coverUrl","string","oneOfType","bool","func","defaultProps"],"mappings":"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"}

package/cjs/ui/Checkbox.js

@@ -0,0 +1,49 @@
+'use strict';
+
+var _rollupPluginBabelHelpers = require('../_rollupPluginBabelHelpers-e54d2387.js');
+var React = require('react');
+var PropTypes = require('prop-types');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
+
+function Checkbox(_ref) {
+  var id = _ref.id,
+      checked = _ref.checked,
+      onChange = _ref.onChange;
+
+  var _useState = React.useState(checked),
+      _useState2 = _rollupPluginBabelHelpers._slicedToArray(_useState, 2),
+      isChecked = _useState2[0],
+      setCheck = _useState2[1];
+
+  return /*#__PURE__*/React__default["default"].createElement("label", {
+    className: "sendbird-checkbox",
+    htmlFor: id
+  }, /*#__PURE__*/React__default["default"].createElement("input", {
+    id: id,
+    type: "checkbox",
+    checked: isChecked,
+    onClick: function onClick() {
+      return setCheck(!isChecked);
+    },
+    onChange: onChange
+  }), /*#__PURE__*/React__default["default"].createElement("span", {
+    className: "sendbird-checkbox--checkmark"
+  }));
+}
+Checkbox.propTypes = {
+  id: PropTypes__default["default"].string,
+  checked: PropTypes__default["default"].bool,
+  onChange: PropTypes__default["default"].func
+};
+Checkbox.defaultProps = {
+  id: 'sendbird-checkbox-input',
+  checked: false,
+  onChange: function onChange() {}
+};
+
+module.exports = Checkbox;
+//# sourceMappingURL=Checkbox.js.map

package/cjs/ui/Checkbox.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Checkbox.js","sources":["../../../src/ui/Checkbox/index.jsx"],"sourcesContent":["import React, { useState } from 'react';\nimport PropTypes from 'prop-types';\n\nimport './index.scss';\n\nexport default function Checkbox({\n  id,\n  checked,\n  onChange,\n}) {\n  const [isChecked, setCheck] = useState(checked);\n  return (\n    <label className=\"sendbird-checkbox\" htmlFor={id}>\n      <input\n        id={id}\n        type=\"checkbox\"\n        checked={isChecked}\n        onClick={() => setCheck(!isChecked)}\n        onChange={onChange}\n      />\n      <span className=\"sendbird-checkbox--checkmark\" />\n    </label>\n  );\n}\n\nCheckbox.propTypes = {\n  id: PropTypes.string,\n  checked: PropTypes.bool,\n  onChange: PropTypes.func,\n};\n\nCheckbox.defaultProps = {\n  id: 'sendbird-checkbox-input',\n  checked: false,\n  onChange: () => { },\n};\n"],"names":["Checkbox","id","checked","onChange","useState","isChecked","setCheck","React","propTypes","PropTypes","string","bool","func","defaultProps"],"mappings":";;;;;;;;;;;AAKe,SAASA,QAAT,OAIZ;AAAA,MAHDC,EAGC,QAHDA,EAGC;AAAA,MAFDC,OAEC,QAFDA,OAEC;AAAA,MADDC,QACC,QADDA,QACC;;AACD,kBAA8BC,cAAQ,CAACF,OAAD,CAAtC;AAAA;AAAA,MAAOG,SAAP;AAAA,MAAkBC,QAAlB;;AACA,sBACEC;AAAO,IAAA,SAAS,EAAC,mBAAjB;AAAqC,IAAA,OAAO,EAAEN;AAA9C,kBACEM;AACE,IAAA,EAAE,EAAEN,EADN;AAEE,IAAA,IAAI,EAAC,UAFP;AAGE,IAAA,OAAO,EAAEI,SAHX;AAIE,IAAA,OAAO,EAAE;AAAA,aAAMC,QAAQ,CAAC,CAACD,SAAF,CAAd;AAAA,KAJX;AAKE,IAAA,QAAQ,EAAEF;AALZ,IADF,eAQEI;AAAM,IAAA,SAAS,EAAC;AAAhB,IARF,CADF;AAYD;AAEDP,QAAQ,CAACQ,SAAT,GAAqB;AACnBP,EAAAA,EAAE,EAAEQ,6BAAS,CAACC,MADK;AAEnBR,EAAAA,OAAO,EAAEO,6BAAS,CAACE,IAFA;AAGnBR,EAAAA,QAAQ,EAAEM,6BAAS,CAACG;AAHD,CAArB;AAMAZ,QAAQ,CAACa,YAAT,GAAwB;AACtBZ,EAAAA,EAAE,EAAE,yBADkB;AAEtBC,EAAAA,OAAO,EAAE,KAFa;AAGtBC,EAAAA,QAAQ,EAAE,oBAAM;AAHM,CAAxB;;;;"}

package/cjs/ui/ConnectionStatus.js

@@ -0,0 +1,34 @@
+'use strict';
+
+var React = require('react');
+var ui_Icon = require('./Icon.js');
+var ui_Label = require('../index-21f31180.js');
+var LocalizationContext = require('../LocalizationContext-3b5ce8ae.js');
+require('../_rollupPluginBabelHelpers-e54d2387.js');
+require('prop-types');
+require('../stringSet-f4da182b.js');
+require('../index-d9439e95.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+
+function ConnectionStatus() {
+  var _useContext = React.useContext(LocalizationContext.LocalizationContext),
+      stringSet = _useContext.stringSet;
+
+  return /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "sendbird-connection-status"
+  }, /*#__PURE__*/React__default["default"].createElement(ui_Label.Label, {
+    type: ui_Label.LabelTypography.BODY_2,
+    color: ui_Label.LabelColors.ONBACKGROUND_2
+  }, stringSet.TRYING_TO_CONNECT), /*#__PURE__*/React__default["default"].createElement(ui_Icon["default"], {
+    type: ui_Icon.IconTypes.DISCONNECTED,
+    fillColor: ui_Icon.IconColors.SENT,
+    width: "14px",
+    height: "14px"
+  }));
+}
+
+module.exports = ConnectionStatus;
+//# sourceMappingURL=ConnectionStatus.js.map

package/cjs/ui/ConnectionStatus.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ConnectionStatus.js","sources":["../../../src/ui/ConnectionStatus/index.jsx"],"sourcesContent":["import React, { useContext } from 'react';\n\nimport Icon, { IconTypes, IconColors } from '../Icon';\nimport Label, { LabelTypography, LabelColors } from '../Label';\nimport { LocalizationContext } from '../../lib/LocalizationContext';\n\nimport './index.scss';\n\nfunction ConnectionStatus() {\n  const { stringSet } = useContext(LocalizationContext);\n  return (\n    <div className=\"sendbird-connection-status\">\n      <Label\n        type={LabelTypography.BODY_2}\n        color={LabelColors.ONBACKGROUND_2}\n      >\n        {stringSet.TRYING_TO_CONNECT}\n      </Label>\n      <Icon\n        type={IconTypes.DISCONNECTED}\n        fillColor={IconColors.SENT}\n        width=\"14px\"\n        height=\"14px\"\n      />\n    </div>\n  );\n}\n\nexport default ConnectionStatus;\n"],"names":["ConnectionStatus","useContext","LocalizationContext","stringSet","React","Label","LabelTypography","BODY_2","LabelColors","ONBACKGROUND_2","TRYING_TO_CONNECT","Icon","IconTypes","DISCONNECTED","IconColors","SENT"],"mappings":";;;;;;;;;;;;;;;AAQA,SAASA,gBAAT,GAA4B;AAC1B,oBAAsBC,gBAAU,CAACC,uCAAD,CAAhC;AAAA,MAAQC,SAAR,eAAQA,SAAR;;AACA,sBACEC;AAAK,IAAA,SAAS,EAAC;AAAf,kBACEA,wCAACC,cAAD;AACE,IAAA,IAAI,EAAEC,wBAAe,CAACC,MADxB;AAEE,IAAA,KAAK,EAAEC,oBAAW,CAACC;AAFrB,KAIGN,SAAS,CAACO,iBAJb,CADF,eAOEN,wCAACO,kBAAD;AACE,IAAA,IAAI,EAAEC,iBAAS,CAACC,YADlB;AAEE,IAAA,SAAS,EAAEC,kBAAU,CAACC,IAFxB;AAGE,IAAA,KAAK,EAAC,MAHR;AAIE,IAAA,MAAM,EAAC;AAJT,IAPF,CADF;AAgBD;;;;"}