Socket
Socket
Sign inDemoInstall

react-slack-chat

Package Overview
Dependencies
19
Maintainers
1
Versions
35
Alerts
File Explorer

Advanced tools

npm Scripts

Install Socket

Detect and block malicious and high-risk dependencies

Install

Comparing version 1.12.0 to 1.15.0

.github/ISSUE_TEMPLATE/bug_report.md

24

dist/example/vendors~node-module-ReactSlackChat.bundle.js
(window["webpackJsonp"] = window["webpackJsonp"] || []).push([["vendors~node-module-ReactSlackChat"],{
/***/ "./node_modules/prop-types/checkPropTypes.js":
/*!***************************************************!*\
!*** ./node_modules/prop-types/checkPropTypes.js ***!
\***************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
eval("/**\n * Copyright (c) 2013-present, Facebook, Inc.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n\n\nvar printWarning = function() {};\n\nif (true) {\n var ReactPropTypesSecret = __webpack_require__(/*! ./lib/ReactPropTypesSecret */ \"./node_modules/prop-types/lib/ReactPropTypesSecret.js\");\n var loggedTypeFailures = {};\n\n printWarning = function(text) {\n var message = 'Warning: ' + text;\n if (typeof console !== 'undefined') {\n console.error(message);\n }\n try {\n // --- Welcome to debugging React ---\n // This error was thrown as a convenience so that you can use this stack\n // to find the callsite that caused this warning to fire.\n throw new Error(message);\n } catch (x) {}\n };\n}\n\n/**\n * Assert that the values match with the type specs.\n * Error messages are memorized and will only be shown once.\n *\n * @param {object} typeSpecs Map of name to a ReactPropType\n * @param {object} values Runtime values that need to be type-checked\n * @param {string} location e.g. \"prop\", \"context\", \"child context\"\n * @param {string} componentName Name of the component for error messages.\n * @param {?Function} getStack Returns the component stack.\n * @private\n */\nfunction checkPropTypes(typeSpecs, values, location, componentName, getStack) {\n if (true) {\n for (var typeSpecName in typeSpecs) {\n if (typeSpecs.hasOwnProperty(typeSpecName)) {\n var error;\n // Prop type validation may throw. In case they do, we don't want to\n // fail the render phase where it didn't fail before. So we log it.\n // After these have been cleaned up, we'll let them throw.\n try {\n // This is intentionally an invariant that gets caught. It's the same\n // behavior as without this statement except with a better message.\n if (typeof typeSpecs[typeSpecName] !== 'function') {\n var err = Error(\n (componentName || 'React class') + ': ' + location + ' type `' + typeSpecName + '` is invalid; ' +\n 'it must be a function, usually from the `prop-types` package, but received `' + typeof typeSpecs[typeSpecName] + '`.'\n );\n err.name = 'Invariant Violation';\n throw err;\n }\n error = typeSpecs[typeSpecName](values, typeSpecName, componentName, location, null, ReactPropTypesSecret);\n } catch (ex) {\n error = ex;\n }\n if (error && !(error instanceof Error)) {\n printWarning(\n (componentName || 'React class') + ': type specification of ' +\n location + ' `' + typeSpecName + '` is invalid; the type checker ' +\n 'function must return `null` or an `Error` but returned a ' + typeof error + '. ' +\n 'You may have forgotten to pass an argument to the type checker ' +\n 'creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and ' +\n 'shape all require an argument).'\n )\n\n }\n if (error instanceof Error && !(error.message in loggedTypeFailures)) {\n // Only monitor this failure once because there tends to be a lot of the\n // same error.\n loggedTypeFailures[error.message] = true;\n\n var stack = getStack ? getStack() : '';\n\n printWarning(\n 'Failed ' + location + ' type: ' + error.message + (stack != null ? stack : '')\n );\n }\n }\n }\n }\n}\n\nmodule.exports = checkPropTypes;\n\n\n//# sourceURL=webpack:///./node_modules/prop-types/checkPropTypes.js?");
/***/ }),
/***/ "./node_modules/prop-types/factoryWithTypeCheckers.js":

@@ -38,14 +26,2 @@ /*!************************************************************!*\

/***/ "./node_modules/prop-types/lib/ReactPropTypesSecret.js":
/*!*************************************************************!*\
!*** ./node_modules/prop-types/lib/ReactPropTypesSecret.js ***!
\*************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
eval("/**\n * Copyright (c) 2013-present, Facebook, Inc.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n\n\nvar ReactPropTypesSecret = 'SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED';\n\nmodule.exports = ReactPropTypesSecret;\n\n\n//# sourceURL=webpack:///./node_modules/prop-types/lib/ReactPropTypesSecret.js?");
/***/ }),
/***/ "./node_modules/webpack/buildin/module.js":

@@ -52,0 +28,0 @@ /*!***********************************!*\

19

package.json
{
"name": "react-slack-chat",
"version": "1.12.0",
"version": "1.15.0",
"description": "A Beautiful Gooey / Material Design Slack Chat Web Integrating Widget.",

@@ -8,7 +8,7 @@ "private": false,

"scripts": {
"start": "SYSTEM_HOOKS=true npx webpack-dev-server --config ./build/webpack.config.js --mode development",
"start": "cross-env SYSTEM_HOOKS=true npx webpack-dev-server --config ./build/webpack.config.js --mode development",
"build": "npm run build:lite && npm run build:withHooks",
"deploy": "npm run build && SYSTEM_HOOKS=true npx webpack --config ./build/webpack.config.deploy.js --mode development && gh-pages -d ./dist/example",
"deploy": "npm run build && cross-env SYSTEM_HOOKS=true npx webpack --config ./build/webpack.config.deploy.js --mode development && gh-pages -d ./dist/example",
"build:lite": "npx webpack --config ./build/webpack.config.prod.js -p --mode production",
"build:withHooks": "SYSTEM_HOOKS=true npx webpack --config ./build/webpack.config.prod.js -p --mode production",
"build:withHooks": "cross-env SYSTEM_HOOKS=true npx webpack --config ./build/webpack.config.prod.js -p --mode production",
"stats": "npx webpack --config ./build/webpack.config.prod.js -p --json > stats.json",

@@ -51,2 +51,4 @@ "test": "echo \"No test specified\" && exit 0",

"babel-loader": "^8.0.5",
"core-js": "^3.8.1",
"cross-env": "^7.0.3",
"css-loader": "^2.1.1",

@@ -57,5 +59,6 @@ "gh-pages": "^2.0.1",

"lint-staged": "^8.1.7",
"node-sass": "^4.12.0",
"public-ip": "^3.1.0",
"node-sass": "^4.14.1",
"public-ip": "^4.0.3",
"react-hot-loader": "^4.8.4",
"regenerator-runtime": "^0.13.7",
"sass-loader": "^7.1.0",

@@ -67,3 +70,3 @@ "style-loader": "^0.23.1",

"webpack-cli": "^3.3.1",
"webpack-dev-server": "^3.3.1"
"webpack-dev-server": "^3.11.1"
},

@@ -78,4 +81,4 @@ "dependencies": {

"react-dom": "^16.8.6",
"slack": "^7.7.3"
"slack": "^11.0.2"
}
}

84

README.md

@@ -5,3 +5,2 @@ # React Slack Chat

![Node Version](https://img.shields.io/badge/node-v9-blue.svg)
![Node Version](https://img.shields.io/badge/node-v9-blue.svg)
![React](https://img.shields.io/badge/React-v16.8-lightblue.svg)

@@ -13,3 +12,3 @@ ![Babel](https://img.shields.io/badge/Babel-v7-yellow.svg)

A Beautiful Gooey / Material Design Slack Chat Web Integrating Widget. This widget can be integrated as a Live Chat / Help Desk / Discussions for Special Interest Sites in **Solo Single Customer Mode (1:1)** or **Community Chat (Shoutbox) Mode**.
A Server-less Beautiful Gooey / Material Design Slack Chat Web Integrating Widget. This widget can be integrated as a Live Chat / Help Desk / Discussions for Special Interest Sites in **Solo Single Customer Mode (1:1)** or **Community Chat (Shoutbox) Mode**.

@@ -24,5 +23,4 @@ Give your users the Perfect Support / Engagement experience, with the comfort of Slack.

1. [Pollyfill babel](https://babeljs.io/docs/usage/polyfill/). Your app has to do it to avoid multiple instancing errors from `babel-polyfill`.
2. Setup a [Slack Bot](https://my.slack.com/services/new/bot) for your team. Note your API token.
3. [Base64 encode](https://www.base64encode.org/) your newly created API token and fasten your seat-belts.
1. Setup a [Slack Bot](https://my.slack.com/services/new/bot) for your team. Note your API token.
2. [Base64 encode](https://www.base64encode.org/) your newly created API token and fasten your seat-belts.

@@ -40,3 +38,3 @@ ## Installation

- `react-slack-chat.js`: The default import from consuming this library. There are no default system hooks, you are free to supply your own custom hooks (Documented below).
- `react-slack-chat`: The default import from consuming this library. There are no default system hooks, you are free to supply your own custom hooks (Documented below).

@@ -53,2 +51,5 @@ - `react-slack-chat-with-default-hooks.js`: Has all the default sytem hooks [documented below](https://github.com/5punk/react-slack-chat/blob/master/README.md#default-system-hooks), you can still add and pass custom keyword based action hooks.

### [Code snippet](https://github.com/5punk/react-slack-chat/blob/master/src/components/App/App.js) from [Demo App](https://5punk.github.io/react-slack-chat/):
```

@@ -87,3 +88,3 @@

id: 'getSystemInfo',
action: () => 'MY SYSTEM INFO!'
action: () => Promise.resolve('MY SYSTEM INFO!')
}

@@ -102,21 +103,24 @@ ]}

- `botname`: [UNIQUE][required] The name of the user / bot. Can be Visitor ID / Email ID / CorpID / IP address etc.
- `apiToken`: [REQUIRED] The [BASE64 ENCODED](https://www.base64encode.org/) API Token for the bot you created for your team. You can create one [here](https://my.slack.com/services/new/bot).
- `channels`: [REQUIRED] At least one slack channel object needs to be passed for the first channel view. Refer example above.
- `userImage`: [REQUIRED] An image URL for the user / bot (Does not need to be unique).
- `helpText`: [OPTIONAL] The Help Text visible on the minimized view of the chat Widget.
- `themeColor`: [OPTIONAL] A Hex Color value accent you want the widget to be themed with, stylish stuff.
- `hooks`: [OPTIONAL] Custom Action Hooks, let's administrators execute commands. In the format `$=>@botName:HOOK_ID`. Example: `$=>@5punk:getCurrentPath`
- `apiToken`: [REQUIRED][String] The [BASE64 ENCODED](https://www.base64encode.org/) API Token for the bot you created for your team. You can create one [here](https://my.slack.com/services/new/bot).
- `channels`: [REQUIRED][Array] At least one slack channel object needs to be passed for the first channel view. Refer example above.
- `userImage`: [REQUIRED][String] An image URL for the user / bot (Does not need to be unique).
- `helpText`: [OPTIONAL][String] The Help Text visible on the minimized view of the chat Widget.
- `themeColor`: [OPTIONAL][String] A Hex Color value accent you want the widget to be themed with, stylish stuff.
- `hooks`: [OPTIONAL][Array] Custom Action Hooks, let's administrators execute commands. Executed in Slack with the format `$=>@botName:HOOK_ID`. Example: `$=>@5punk:getCurrentPath`
- `debugMode`: [OPTIONAL] Pass a boolean (`true`/`false`) flag to start debug logs.
- `defaultChannel`: [OPTIONAL] Channel name to bypass the channel list and go directly to a specific channel.
- `defaultMessage`: [OPTIONAL] Prepend a default message to the beginning of the message list, such as an automatic greeting when a user first joins the channel.
- `singleUserMode`: [OPTIONAL] Pass a boolean to filter messages so the user only sees his/her messages and replies directed at the user in threads on the Slack side.
- `closeChatButton`: [OPTIONAL] Pass a boolean to add an "x" close button in the corner of the chat window instead of going back to channel list and minimizing.
- `defaultChannel`: [OPTIONAL][String] Channel name to bypass the channel list and go directly to a specific channel.
- `defaultMessage`: [OPTIONAL][String] Prepend a default message to the beginning of the message list, such as an automatic greeting when a user first joins the channel.
- `singleUserMode`: [OPTIONAL][Boolean] Pass a boolean to filter messages so the user only sees his/her messages and replies directed at the user in threads on the Slack side.
- `closeChatButton`: [OPTIONAL][Boolean] Pass a boolean to add an "x" close button in the corner of the chat window instead of going back to channel list and minimizing.
## Default System Hooks
> All hooks can **ONLY be executed by Administrators**. Admins are usually the **team members** that belong to the Slack Team (Backend).
> All hooks can **ONLY be executed by Administrators** only if the site customer / visitor has the chat window open. Admins are usually the **team members** that belong to the Slack Team (Backend).
> All responses of hooks, are **only visible** to the backend Administrators (Visible to the members in the Slack App).
ReactSlackChat gives you a few hooks ready to use out of the box.
ReactSlackChat ships in two flavors. The lite version (default import) ships with **NO** default system hooks.
The package imported from the path `react-slack-chat/dist/react-slack-chat-with-default-hooks` gives you a few hooks ready to use out of the box.
An Admin can call any hook with the following command via the Slack App Backend

@@ -136,2 +140,44 @@

## Custom Hooks
> All hooks can **ONLY be executed by Administrators** only if the site customer / visitor has the chat window open. Admins are usually the **team members** that belong to the Slack Team (Backend).
> All responses of hooks, are **only visible** to the backend Administrators (Visible to the members in the Slack App).
Adding custom hooks is easy. Just pass an array of actionable custom hooks as a prop to the library. The default lite version and _heavier_ library that ships with some basic default system hooks, both support custom hooks.
You're expected to follow the format:
```
{
id: [STRING],
action: [PROMISE] // Any action that you want each customer / visitor on your widget / app to execute
}
```
The promise has to be resolved to allow you to create async functions and actions on different Action IDs the Slack Admins try to execute.
An example of hooks passed as a prop can be:
```
hooks={[
{
/* My Custom Hook */
id: 'getIPAddress',
action: () => IPAddress.get() // returns a promise
},
{
id: 'showHelpWizard',
action: () => {
return dispatch(showHelpWizard(true))
.then(data => //success)
.fail(uILogger.error('FAILED'))
}
},
.
.
.
]}
```
## Screenshots

@@ -138,0 +184,0 @@ 

stats.json
dist/example/bundle.js

Sorry, the diff of this file is too big to display

dist/example/node-module-ReactSlackChat.bundle.js

Sorry, the diff of this file is too big to display

dist/react-slack-chat-with-default-hooks.js

Sorry, the diff of this file is too big to display

dist/react-slack-chat.js

Sorry, the diff of this file is too big to display

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap

About

Packages

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc