@sendbird/uikit-react 3.0.0-beta.4 → 3.0.0-rc.0

package/index-c95d2aab.js

@@ -0,0 +1,121 @@
+import { b as _toConsumableArray } from './_rollupPluginBabelHelpers-084fb589.js';
+import React__default, { useContext } from 'react';
+import PropTypes from 'prop-types';
+import Icon, { IconTypes, IconColors } from './ui/Icon.js';
+import Loader from './ui/Loader.js';
+import { a as LocalizationContext } from './LocalizationContext-fb3dafcd.js';
+import { L as Label, a as LabelTypography, b as LabelColors } from './index-71e2bf26.js';
+
+function Types() {
+  return {
+    LOADING: 'LOADING',
+    NO_CHANNELS: 'NO_CHANNELS',
+    NO_MESSAGES: 'NO_MESSAGES',
+    WRONG: 'WRONG',
+    SEARCH_IN: 'SEARCH_IN',
+    SEARCHING: 'SEARCHING',
+    NO_RESULTS: 'NO_RESULTS'
+  };
+}
+var PlaceHolderTypes$1 = Types();
+
+var PlaceHolderTypes = PlaceHolderTypes$1;
+function PlaceHolder(_ref) {
+  var className = _ref.className,
+      type = _ref.type,
+      retryToConnect = _ref.retryToConnect,
+      searchInString = _ref.searchInString;
+
+  var _useContext = useContext(LocalizationContext),
+      stringSet = _useContext.stringSet;
+
+  return /*#__PURE__*/React__default.createElement("div", {
+    className: [].concat(_toConsumableArray(Array.isArray(className) ? className : [className]), ['sendbird-place-holder']).join(' ')
+  }, type === PlaceHolderTypes.LOADING && /*#__PURE__*/React__default.createElement(Loader, {
+    width: "48px",
+    height: "48px"
+  }, /*#__PURE__*/React__default.createElement(Icon, {
+    type: IconTypes.SPINNER,
+    fillColor: IconColors.PRIMARY,
+    width: "48px",
+    height: "48px"
+  })), (type === PlaceHolderTypes.NO_CHANNELS || type === PlaceHolderTypes.NO_MESSAGES || type === PlaceHolderTypes.WRONG) && /*#__PURE__*/React__default.createElement("div", {
+    className: "sendbird-place-holder__body"
+  }, type === PlaceHolderTypes.NO_CHANNELS && /*#__PURE__*/React__default.createElement(Icon, {
+    className: "sendbird-place-holder__body__icon",
+    type: IconTypes.CHAT,
+    fillColor: IconColors.ON_BACKGROUND_3,
+    width: "64px",
+    height: "64px"
+  }), type === PlaceHolderTypes.WRONG && /*#__PURE__*/React__default.createElement(Icon, {
+    className: "sendbird-place-holder__body__icon",
+    type: IconTypes.ERROR,
+    fillColor: IconColors.ON_BACKGROUND_3,
+    width: "64px",
+    height: "64px"
+  }), type === PlaceHolderTypes.NO_MESSAGES && /*#__PURE__*/React__default.createElement(Icon, {
+    className: "sendbird-place-holder__body__icon",
+    type: IconTypes.MESSAGE,
+    fillColor: IconColors.ON_BACKGROUND_3,
+    width: "64px",
+    height: "64px"
+  }), /*#__PURE__*/React__default.createElement(Label, {
+    className: "sendbird-place-holder__body__text",
+    type: LabelTypography.BODY_1,
+    color: LabelColors.ONBACKGROUND_2
+  }, type === PlaceHolderTypes.NO_CHANNELS && stringSet.PLACE_HOLDER__NO_CHANNEL, type === PlaceHolderTypes.WRONG && stringSet.PLACE_HOLDER__WRONG, type === PlaceHolderTypes.NO_MESSAGES && stringSet.PLACE_HOLDER__NO_MESSAGES), retryToConnect && /*#__PURE__*/React__default.createElement("div", {
+    className: "sendbird-place-holder__body__reconnect",
+    role: "button",
+    onClick: retryToConnect,
+    onKeyPress: retryToConnect,
+    tabIndex: 0
+  }, /*#__PURE__*/React__default.createElement(Icon, {
+    className: "sendbird-place-holder__body__reconnect__icon",
+    type: IconTypes.REFRESH,
+    fillColor: IconColors.PRIMARY,
+    width: "20px",
+    height: "20px"
+  }), /*#__PURE__*/React__default.createElement(Label, {
+    className: "sendbird-place-holder__body__reconnect__text",
+    type: LabelTypography.BUTTON_1,
+    color: LabelColors.PRIMARY
+  }, stringSet.PLACE_HOLDER__RETRY_TO_CONNECT))), (type === PlaceHolderTypes.NO_RESULTS || type === PlaceHolderTypes.SEARCH_IN || type === PlaceHolderTypes.SEARCHING) && /*#__PURE__*/React__default.createElement("div", {
+    className: "sendbird-place-holder__body--align-top"
+  }, type === PlaceHolderTypes.SEARCH_IN && /*#__PURE__*/React__default.createElement("div", {
+    className: "sendbird-place-holder__body--align-top__text"
+  }, /*#__PURE__*/React__default.createElement(Label, {
+    className: "sendbird-place-holder__body--align-top__text__search-in",
+    type: LabelTypography.BUTTON_2,
+    color: LabelColors.ONBACKGROUND_2
+  }, stringSet.SEARCH_IN), /*#__PURE__*/React__default.createElement(Label, {
+    className: "sendbird-place-holder__body--align-top__text__channel-name",
+    type: LabelTypography.BUTTON_2,
+    color: LabelColors.PRIMARY
+  }, "'".concat(searchInString)), /*#__PURE__*/React__default.createElement(Label, {
+    className: "sendbird-place-holder__body--align-top__text__quote",
+    type: LabelTypography.BUTTON_2,
+    color: LabelColors.PRIMARY
+  }, '\'')), type === PlaceHolderTypes.SEARCHING && /*#__PURE__*/React__default.createElement(Label, {
+    className: "sendbird-place-hlder__body--align-top__searching",
+    type: LabelTypography.BODY_1,
+    color: LabelColors.ONBACKGROUND_2
+  }, stringSet.SEARCHING), type === PlaceHolderTypes.NO_RESULTS && /*#__PURE__*/React__default.createElement(Label, {
+    className: "sendbird-place-hlder__body--align-top__no-result",
+    type: LabelTypography.BODY_1,
+    color: LabelColors.ONBACKGROUND_2
+  }, stringSet.NO_SEARCHED_MESSAGE)));
+}
+PlaceHolder.propTypes = {
+  className: PropTypes.oneOfType([PropTypes.string, PropTypes.arrayOf(PropTypes.string)]),
+  type: PropTypes.oneOfType([PropTypes.oneOf(Object.keys(PlaceHolderTypes)), PropTypes.string]).isRequired,
+  retryToConnect: PropTypes.func,
+  searchInString: PropTypes.string
+};
+PlaceHolder.defaultProps = {
+  className: '',
+  retryToConnect: null,
+  searchInString: ''
+};
+
+export { PlaceHolder as P, PlaceHolderTypes as a, PlaceHolderTypes$1 as b };
+//# sourceMappingURL=index-c95d2aab.js.map

package/index-c95d2aab.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index-c95d2aab.js","sources":["../src/ui/PlaceHolder/type.js","../src/ui/PlaceHolder/index.jsx"],"sourcesContent":["export function Types() {\n  return {\n    LOADING: 'LOADING',\n    NO_CHANNELS: 'NO_CHANNELS',\n    NO_MESSAGES: 'NO_MESSAGES',\n    WRONG: 'WRONG',\n    SEARCH_IN: 'SEARCH_IN',\n    SEARCHING: 'SEARCHING',\n    NO_RESULTS: 'NO_RESULTS',\n  };\n}\n\nexport default Types();\n","import React, { useContext } from 'react';\nimport PropTypes from 'prop-types';\n\nimport './index.scss';\nimport Icon, { IconTypes, IconColors } from '../Icon';\nimport Loader from '../Loader';\nimport { LocalizationContext } from '../../lib/LocalizationContext';\nimport Label, { LabelColors, LabelTypography } from '../Label';\nimport _PlaceHolderTypes from './type';\n\nexport const PlaceHolderTypes = _PlaceHolderTypes;\n\nexport default function PlaceHolder({\n  className,\n  type,\n  retryToConnect,\n  searchInString,\n}) {\n  const { stringSet } = useContext(LocalizationContext);\n  return (\n    <div className={[\n      ...(Array.isArray(className) ? className : [className]),\n      'sendbird-place-holder',\n    ].join(' ')}\n    >\n      {\n        type === PlaceHolderTypes.LOADING && (\n          <Loader\n            width=\"48px\"\n            height=\"48px\"\n          >\n            <Icon\n              type={IconTypes.SPINNER}\n              fillColor={IconColors.PRIMARY}\n              width=\"48px\"\n              height=\"48px\"\n            />\n          </Loader>\n        )\n      }\n      {\n        (\n          type === PlaceHolderTypes.NO_CHANNELS\n          || type === PlaceHolderTypes.NO_MESSAGES\n          || type === PlaceHolderTypes.WRONG\n        ) && (\n          <div className=\"sendbird-place-holder__body\">\n            {\n              type === PlaceHolderTypes.NO_CHANNELS && (\n                <Icon\n                  className=\"sendbird-place-holder__body__icon\"\n                  type={IconTypes.CHAT}\n                  fillColor={IconColors.ON_BACKGROUND_3}\n                  width=\"64px\"\n                  height=\"64px\"\n                />\n              )\n            }\n            {\n              type === PlaceHolderTypes.WRONG && (\n                <Icon\n                  className=\"sendbird-place-holder__body__icon\"\n                  type={IconTypes.ERROR}\n                  fillColor={IconColors.ON_BACKGROUND_3}\n                  width=\"64px\"\n                  height=\"64px\"\n                />\n              )\n            }\n            {\n              type === PlaceHolderTypes.NO_MESSAGES && (\n                <Icon\n                  className=\"sendbird-place-holder__body__icon\"\n                  type={IconTypes.MESSAGE}\n                  fillColor={IconColors.ON_BACKGROUND_3}\n                  width=\"64px\"\n                  height=\"64px\"\n                />\n              )\n            }\n            <Label\n              className=\"sendbird-place-holder__body__text\"\n              type={LabelTypography.BODY_1}\n              color={LabelColors.ONBACKGROUND_2}\n            >\n              {\n                type === PlaceHolderTypes.NO_CHANNELS && (\n                  stringSet.PLACE_HOLDER__NO_CHANNEL\n                )\n              }\n              {\n                type === PlaceHolderTypes.WRONG && (\n                  stringSet.PLACE_HOLDER__WRONG\n                )\n              }\n              {\n                type === PlaceHolderTypes.NO_MESSAGES && (\n                  stringSet.PLACE_HOLDER__NO_MESSAGES\n                )\n              }\n            </Label>\n            {\n              retryToConnect && (\n                <div\n                  className=\"sendbird-place-holder__body__reconnect\"\n                  role=\"button\"\n                  onClick={retryToConnect}\n                  onKeyPress={retryToConnect}\n                  tabIndex={0}\n                >\n                  <Icon\n                    className=\"sendbird-place-holder__body__reconnect__icon\"\n                    type={IconTypes.REFRESH}\n                    fillColor={IconColors.PRIMARY}\n                    width=\"20px\"\n                    height=\"20px\"\n                  />\n                  <Label\n                    className=\"sendbird-place-holder__body__reconnect__text\"\n                    type={LabelTypography.BUTTON_1}\n                    color={LabelColors.PRIMARY}\n                  >\n                    {stringSet.PLACE_HOLDER__RETRY_TO_CONNECT}\n                  </Label>\n                </div>\n              )\n            }\n          </div>\n        )\n      }\n      {\n        (\n          type === PlaceHolderTypes.NO_RESULTS\n          || type === PlaceHolderTypes.SEARCH_IN\n          || type === PlaceHolderTypes.SEARCHING\n        ) && (\n          <div className=\"sendbird-place-holder__body--align-top\">\n            {\n              type === PlaceHolderTypes.SEARCH_IN && (\n                <div className=\"sendbird-place-holder__body--align-top__text\">\n                  <Label\n                    className=\"sendbird-place-holder__body--align-top__text__search-in\"\n                    type={LabelTypography.BUTTON_2}\n                    color={LabelColors.ONBACKGROUND_2}\n                  >\n                    {stringSet.SEARCH_IN}\n                  </Label>\n                  <Label\n                    className=\"sendbird-place-holder__body--align-top__text__channel-name\"\n                    type={LabelTypography.BUTTON_2}\n                    color={LabelColors.PRIMARY}\n                  >\n                    {`'${searchInString}`}\n                  </Label>\n                  <Label\n                    className=\"sendbird-place-holder__body--align-top__text__quote\"\n                    type={LabelTypography.BUTTON_2}\n                    color={LabelColors.PRIMARY}\n                  >\n                    {'\\''}\n                  </Label>\n                </div>\n              )\n            }\n            {\n              type === PlaceHolderTypes.SEARCHING && (\n                <Label\n                  className=\"sendbird-place-hlder__body--align-top__searching\"\n                  type={LabelTypography.BODY_1}\n                  color={LabelColors.ONBACKGROUND_2}\n                >\n                  {stringSet.SEARCHING}\n                </Label>\n              )\n            }\n            {\n              type === PlaceHolderTypes.NO_RESULTS && (\n                <Label\n                  className=\"sendbird-place-hlder__body--align-top__no-result\"\n                  type={LabelTypography.BODY_1}\n                  color={LabelColors.ONBACKGROUND_2}\n                >\n                  {stringSet.NO_SEARCHED_MESSAGE}\n                </Label>\n              )\n            }\n          </div>\n        )\n      }\n    </div>\n  );\n}\n\nPlaceHolder.propTypes = {\n  className: PropTypes.oneOfType([\n    PropTypes.string,\n    PropTypes.arrayOf(PropTypes.string),\n  ]),\n  type: PropTypes.oneOfType([\n    PropTypes.oneOf(Object.keys(PlaceHolderTypes)),\n    PropTypes.string,\n  ]).isRequired,\n  retryToConnect: PropTypes.func,\n  searchInString: PropTypes.string,\n};\n\nPlaceHolder.defaultProps = {\n  className: '',\n  retryToConnect: null,\n  searchInString: '',\n};\n"],"names":["Types","LOADING","NO_CHANNELS","NO_MESSAGES","WRONG","SEARCH_IN","SEARCHING","NO_RESULTS","PlaceHolderTypes","_PlaceHolderTypes","PlaceHolder","className","type","retryToConnect","searchInString","useContext","LocalizationContext","stringSet","React","Array","isArray","join","IconTypes","SPINNER","IconColors","PRIMARY","CHAT","ON_BACKGROUND_3","ERROR","MESSAGE","LabelTypography","BODY_1","LabelColors","ONBACKGROUND_2","PLACE_HOLDER__NO_CHANNEL","PLACE_HOLDER__WRONG","PLACE_HOLDER__NO_MESSAGES","REFRESH","BUTTON_1","PLACE_HOLDER__RETRY_TO_CONNECT","BUTTON_2","NO_SEARCHED_MESSAGE","propTypes","PropTypes","oneOfType","string","arrayOf","oneOf","Object","keys","isRequired","func","defaultProps"],"mappings":";;;;;;;;AAAO,SAASA,KAAT,GAAiB;AACtB,SAAO;AACLC,IAAAA,OAAO,EAAE,SADJ;AAELC,IAAAA,WAAW,EAAE,aAFR;AAGLC,IAAAA,WAAW,EAAE,aAHR;AAILC,IAAAA,KAAK,EAAE,OAJF;AAKLC,IAAAA,SAAS,EAAE,WALN;AAMLC,IAAAA,SAAS,EAAE,WANN;AAOLC,IAAAA,UAAU,EAAE;AAPP,GAAP;AASD;AAED,yBAAeP,KAAK,EAApB;;ICFaQ,gBAAgB,GAAGC;AAEjB,SAASC,WAAT,OAKZ;AAAA,MAJDC,SAIC,QAJDA,SAIC;AAAA,MAHDC,IAGC,QAHDA,IAGC;AAAA,MAFDC,cAEC,QAFDA,cAEC;AAAA,MADDC,cACC,QADDA,cACC;;AACD,oBAAsBC,UAAU,CAACC,mBAAD,CAAhC;AAAA,MAAQC,SAAR,eAAQA,SAAR;;AACA,sBACEC;AAAK,IAAA,SAAS,EAAE,6BACVC,KAAK,CAACC,OAAN,CAAcT,SAAd,IAA2BA,SAA3B,GAAuC,CAACA,SAAD,CAD7B,IAEd,uBAFc,GAGdU,IAHc,CAGT,GAHS;AAAhB,KAMIT,IAAI,KAAKJ,gBAAgB,CAACP,OAA1B,iBACEiB,6BAAC,MAAD;AACE,IAAA,KAAK,EAAC,MADR;AAEE,IAAA,MAAM,EAAC;AAFT,kBAIEA,6BAAC,IAAD;AACE,IAAA,IAAI,EAAEI,SAAS,CAACC,OADlB;AAEE,IAAA,SAAS,EAAEC,UAAU,CAACC,OAFxB;AAGE,IAAA,KAAK,EAAC,MAHR;AAIE,IAAA,MAAM,EAAC;AAJT,IAJF,CAPN,EAqBI,CACEb,IAAI,KAAKJ,gBAAgB,CAACN,WAA1B,IACGU,IAAI,KAAKJ,gBAAgB,CAACL,WAD7B,IAEGS,IAAI,KAAKJ,gBAAgB,CAACJ,KAH/B,kBAKEc;AAAK,IAAA,SAAS,EAAC;AAAf,KAEIN,IAAI,KAAKJ,gBAAgB,CAACN,WAA1B,iBACEgB,6BAAC,IAAD;AACE,IAAA,SAAS,EAAC,mCADZ;AAEE,IAAA,IAAI,EAAEI,SAAS,CAACI,IAFlB;AAGE,IAAA,SAAS,EAAEF,UAAU,CAACG,eAHxB;AAIE,IAAA,KAAK,EAAC,MAJR;AAKE,IAAA,MAAM,EAAC;AALT,IAHN,EAaIf,IAAI,KAAKJ,gBAAgB,CAACJ,KAA1B,iBACEc,6BAAC,IAAD;AACE,IAAA,SAAS,EAAC,mCADZ;AAEE,IAAA,IAAI,EAAEI,SAAS,CAACM,KAFlB;AAGE,IAAA,SAAS,EAAEJ,UAAU,CAACG,eAHxB;AAIE,IAAA,KAAK,EAAC,MAJR;AAKE,IAAA,MAAM,EAAC;AALT,IAdN,EAwBIf,IAAI,KAAKJ,gBAAgB,CAACL,WAA1B,iBACEe,6BAAC,IAAD;AACE,IAAA,SAAS,EAAC,mCADZ;AAEE,IAAA,IAAI,EAAEI,SAAS,CAACO,OAFlB;AAGE,IAAA,SAAS,EAAEL,UAAU,CAACG,eAHxB;AAIE,IAAA,KAAK,EAAC,MAJR;AAKE,IAAA,MAAM,EAAC;AALT,IAzBN,eAkCET,6BAAC,KAAD;AACE,IAAA,SAAS,EAAC,mCADZ;AAEE,IAAA,IAAI,EAAEY,eAAe,CAACC,MAFxB;AAGE,IAAA,KAAK,EAAEC,WAAW,CAACC;AAHrB,KAMIrB,IAAI,KAAKJ,gBAAgB,CAACN,WAA1B,IACEe,SAAS,CAACiB,wBAPhB,EAWItB,IAAI,KAAKJ,gBAAgB,CAACJ,KAA1B,IACEa,SAAS,CAACkB,mBAZhB,EAgBIvB,IAAI,KAAKJ,gBAAgB,CAACL,WAA1B,IACEc,SAAS,CAACmB,yBAjBhB,CAlCF,EAwDIvB,cAAc,iBACZK;AACE,IAAA,SAAS,EAAC,wCADZ;AAEE,IAAA,IAAI,EAAC,QAFP;AAGE,IAAA,OAAO,EAAEL,cAHX;AAIE,IAAA,UAAU,EAAEA,cAJd;AAKE,IAAA,QAAQ,EAAE;AALZ,kBAOEK,6BAAC,IAAD;AACE,IAAA,SAAS,EAAC,8CADZ;AAEE,IAAA,IAAI,EAAEI,SAAS,CAACe,OAFlB;AAGE,IAAA,SAAS,EAAEb,UAAU,CAACC,OAHxB;AAIE,IAAA,KAAK,EAAC,MAJR;AAKE,IAAA,MAAM,EAAC;AALT,IAPF,eAcEP,6BAAC,KAAD;AACE,IAAA,SAAS,EAAC,8CADZ;AAEE,IAAA,IAAI,EAAEY,eAAe,CAACQ,QAFxB;AAGE,IAAA,KAAK,EAAEN,WAAW,CAACP;AAHrB,KAKGR,SAAS,CAACsB,8BALb,CAdF,CAzDN,CA1BN,EA+GI,CACE3B,IAAI,KAAKJ,gBAAgB,CAACD,UAA1B,IACGK,IAAI,KAAKJ,gBAAgB,CAACH,SAD7B,IAEGO,IAAI,KAAKJ,gBAAgB,CAACF,SAH/B,kBAKEY;AAAK,IAAA,SAAS,EAAC;AAAf,KAEIN,IAAI,KAAKJ,gBAAgB,CAACH,SAA1B,iBACEa;AAAK,IAAA,SAAS,EAAC;AAAf,kBACEA,6BAAC,KAAD;AACE,IAAA,SAAS,EAAC,yDADZ;AAEE,IAAA,IAAI,EAAEY,eAAe,CAACU,QAFxB;AAGE,IAAA,KAAK,EAAER,WAAW,CAACC;AAHrB,KAKGhB,SAAS,CAACZ,SALb,CADF,eAQEa,6BAAC,KAAD;AACE,IAAA,SAAS,EAAC,4DADZ;AAEE,IAAA,IAAI,EAAEY,eAAe,CAACU,QAFxB;AAGE,IAAA,KAAK,EAAER,WAAW,CAACP;AAHrB,gBAKOX,cALP,EARF,eAeEI,6BAAC,KAAD;AACE,IAAA,SAAS,EAAC,qDADZ;AAEE,IAAA,IAAI,EAAEY,eAAe,CAACU,QAFxB;AAGE,IAAA,KAAK,EAAER,WAAW,CAACP;AAHrB,KAKG,IALH,CAfF,CAHN,EA6BIb,IAAI,KAAKJ,gBAAgB,CAACF,SAA1B,iBACEY,6BAAC,KAAD;AACE,IAAA,SAAS,EAAC,kDADZ;AAEE,IAAA,IAAI,EAAEY,eAAe,CAACC,MAFxB;AAGE,IAAA,KAAK,EAAEC,WAAW,CAACC;AAHrB,KAKGhB,SAAS,CAACX,SALb,CA9BN,EAwCIM,IAAI,KAAKJ,gBAAgB,CAACD,UAA1B,iBACEW,6BAAC,KAAD;AACE,IAAA,SAAS,EAAC,kDADZ;AAEE,IAAA,IAAI,EAAEY,eAAe,CAACC,MAFxB;AAGE,IAAA,KAAK,EAAEC,WAAW,CAACC;AAHrB,KAKGhB,SAAS,CAACwB,mBALb,CAzCN,CApHN,CADF;AA4KD;AAED/B,WAAW,CAACgC,SAAZ,GAAwB;AACtB/B,EAAAA,SAAS,EAAEgC,SAAS,CAACC,SAAV,CAAoB,CAC7BD,SAAS,CAACE,MADmB,EAE7BF,SAAS,CAACG,OAAV,CAAkBH,SAAS,CAACE,MAA5B,CAF6B,CAApB,CADW;AAKtBjC,EAAAA,IAAI,EAAE+B,SAAS,CAACC,SAAV,CAAoB,CACxBD,SAAS,CAACI,KAAV,CAAgBC,MAAM,CAACC,IAAP,CAAYzC,gBAAZ,CAAhB,CADwB,EAExBmC,SAAS,CAACE,MAFc,CAApB,EAGHK,UARmB;AAStBrC,EAAAA,cAAc,EAAE8B,SAAS,CAACQ,IATJ;AAUtBrC,EAAAA,cAAc,EAAE6B,SAAS,CAACE;AAVJ,CAAxB;AAaAnC,WAAW,CAAC0C,YAAZ,GAA2B;AACzBzC,EAAAA,SAAS,EAAE,EADc;AAEzBE,EAAAA,cAAc,EAAE,IAFS;AAGzBC,EAAAA,cAAc,EAAE;AAHS,CAA3B;;;;"}