@unbxd-ui/unbxd-react-components 0.2.100 → 0.2.101-beta.1

package/.babelrc

@@ -0,0 +1,4 @@
+{
+    "presets": ["@babel/preset-env", "@babel/preset-react"],
+    "plugins": [ "@babel/plugin-proposal-export-default-from", "@babel/plugin-proposal-class-properties"]
+}

package/.eslintrc.js

@@ -0,0 +1,38 @@
+module.exports = {
+    "env": {
+        "browser": true,
+        "es6": true,
+        "amd": true,
+        "node": true
+    },
+    "extends": [
+        "eslint:recommended",
+        "plugin:react/recommended"
+    ],
+    "globals": {
+        "Atomics": "readonly",
+        "SharedArrayBuffer": "readonly"
+    },
+    "parser": "babel-eslint",
+    "parserOptions": {
+        "ecmaFeatures": {
+            "jsx": true
+        },
+        "ecmaVersion": 2018,
+        "sourceType": "module"
+    },
+    "plugins": [
+        "react",
+        "babel"
+    ],
+    "rules": {
+        "react/prop-types": [2, { ignore: ["children"] }],
+        "no-unsafe-finally": 0,
+        "no-func-assign": 0
+    },
+    "settings": {
+        "react": {
+            "version": "detect"
+        }
+    }
+};

package/CONTRIBUTE.md

@@ -0,0 +1,105 @@
+## Setting up the project for development
+
+### Prerequisites
+
+Install [npm](https://www.npmjs.com/get-npm)
+
+### Setting Up
+
+Install the npm packages using the following command
+
+```
+npm install
+```
+
+Start the JS build with watcher using the following command
+
+```
+npm run build -- --watch
+```
+
+To watch SCSS files & compile them to CSS use the following command
+
+```
+npm run scss -- --watch
+```
+
+**Note:** Prefix all the CSS classNames with namespace `"RCB-"`
+
+### Linting your JS files
+
+Run the following command to lint the JS code
+
+```
+npm run lint
+```
+
+Or Install your editor specific plugin by referring to [this link](https://eslint.org/docs/user-guide/integrations)
+
+### Viewing the components
+
+View the available components along with their accepted props using [storybook](https://storybook.js.org/)
+
+To start the storybook run the following command
+
+```
+npm run storybook
+```
+
+The storybook can then be viewed at http://localhost:6006/
+
+### Publishing the storybook to github pages
+
+Run the following command to publish the storybook to github pages:
+
+```
+npm run deploy-storybook
+```
+
+### Publishing the package to npm
+
+First login to npm using the following command:
+
+```
+npm login
+```
+
+Then run the following command to publish the package to npm:
+
+```
+npm run publish
+```
+
+This publishes the package to [unbxd-ui](https://www.npmjs.com/settings/unbxd-ui/packages) org on npm. 
+To be able to publish to this org you need to get yourself added on the team. Contact Divya or Manu for the same.
+
+
+### Creating new stories for the components
+
+To help boostrap a new story file, use the following steps
+
+1. Install the VS Code extension [File Templates](https://marketplace.visualstudio.com/items?itemName=brpaz.file-templates)
+2. Place the templates in the location expected by the extension
+    - In Mac,
+    ```cp ./vscode-templates/NewStoryTemplate.stories.js $HOME/Library/Application\ Support/Code/User/FileTemplates```
+
+    - In Linux,
+    ```cp ./vscode-templates/NewStoryTemplate.stories.js $HOME/.config/Code/User/FileTemplates```
+
+    - In Windows,
+    ```cp ./vscode-templates/NewStoryTemplate.stories.js C:\Users\User\AppData\Roaming\Code\User\FileTemplates```
+3. To use the templates you can do one of the following:
+    - In VSCode, right click on the folder where you want to generate the new file. You should see an option "Files : New from template". Selecting this option a list of available templates should appear. Just select your template and the file will be created.
+    - You can also do the same from the Command Palette. In this case the new file will be created in the root directory of the project.
+    - Its also possible to do the other way around and create a template based on an open file. For that "right-click" on any opened file and you should see the option of the context menu.
+
+**Note:** The template will expect the Component name as a parameter
+
+## FAQs
+1) I am getting error "No PostCSS Config found"
+
+Create a file called postcss.config.js in `/lib/components/` folder
+
+## TODO
+
+- Minify JS / CSS

package/components/Form/RangeSlider.js

@@ -15,7 +15,7 @@ var _Form = require("./Form");
 
 var _FormElementWrapper = _interopRequireDefault(require("./FormElementWrapper"));
 
-var _excluded = ["label", "name", "min", "max", "className", "value", "defaultValue", "appearance", "onChange", "disabled", "showBubble", "inputStyle", "bubbleStyle", "inputClassName"];
+var _excluded = ["label", "name", "min", "max", "className", "value", "defaultValue", "appearance", "onChange", "disabled", "showBubble", "inputStyle", "bubbleStyle"];
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
@@ -63,7 +63,6 @@ var RangeSlider = function RangeSlider(props) {
       inputStyle = _props$inputStyle === void 0 ? {} : _props$inputStyle,
       _props$bubbleStyle = props.bubbleStyle,
       bubbleStyle = _props$bubbleStyle === void 0 ? {} : _props$bubbleStyle,
-      inputClassName = props.inputClassName,
       restProps = _objectWithoutProperties(props, _excluded);
 
   var _useContext = (0, _react.useContext)(_Form.FormContext),
@@ -104,7 +103,7 @@ var RangeSlider = function RangeSlider(props) {
     id: name,
     defaultValue: defaultValue,
     disabled: disabled,
-    className: "RCB-form-el RCB-input-range ".concat(inputClassName),
+    className: "RCB-form-el RCB-input-range ".concat(className),
     onChange: onInputChange
   }, restProps), {}, {
     showBubble: showBubble
@@ -133,11 +132,8 @@ var RangeSlider = function RangeSlider(props) {
 };
 
 RangeSlider.propTypes = {
-  /** Pass any additional classNames to Input component container */
-  className: _propTypes["default"].string,
-
   /** Pass any additional classNames to Input component */
-  inputClassName: _propTypes["default"].string,
+  className: _propTypes["default"].string,
 
   /** Minimum value for range slider */
   min: _propTypes["default"].string.isRequired,

package/components/Tooltip/Tooltip.js

@@ -42,7 +42,7 @@ var DefaultTooltipActivator = function DefaultTooltipActivator() {
   return /*#__PURE__*/_react["default"].createElement(_react.Fragment, null, "i");
 };
 
-var Tooltip = function Tooltip(props, ref) {
+var Tooltip = function Tooltip(props) {
   var TooltipActivator = props.TooltipActivator,
       activatorAction = props.activatorAction,
       direction = props.direction,
@@ -80,14 +80,6 @@ var Tooltip = function Tooltip(props, ref) {
       break;
   }
 
-  (0, _react.useImperativeHandle)(ref, function () {
-    return {
-      hideToolTip: function hideToolTip() {
-        setIsOpen(false);
-      }
-    };
-  });
-
   var showToolTipClick = function showToolTipClick(e) {
     e.stopPropagation();
     setIsOpen(!isOpen);
@@ -118,11 +110,10 @@ var Tooltip = function Tooltip(props, ref) {
   }, children));
 };
 
-Tooltip = /*#__PURE__*/(0, _react.forwardRef)(Tooltip);
 Tooltip.propTypes = {
   TooltipActivator: _propTypes["default"].func,
   activatorAction: _propTypes["default"].oneOf(["click", "hover"]),
-  direction: _propTypes["default"].oneOf(["right", "bottom", "left", "top"])
+  direction: _propTypes["default"].oneOf(["right", "bottom"])
 };
 Tooltip.defaultProps = {
   TooltipActivator: DefaultTooltipActivator,

package/components/core.css

@@ -1,3 +1 @@
-.RCB-form-el-inline{margin:20px 0;display:inline-block}.RCB-form-el-inline .RCB-form-el-label{margin-right:15px}.RCB-form-el-inline .RCB-toggle{display:inline-block}.RCB-form-el-block{margin:20px 0}.RCB-form-el-block .RCB-form-el-label{display:block}.RCB-dropdown .RCB-list-item{list-style-type:none;padding:10px;cursor:pointer}.RCB-dropdown .RCB-list-item:hover{background-color:#eee}.RCB-dropdown .RCB-list-item.selected{background-color:#eee}.RCB-dd-with-create .RCB-inline-modal-body{display:flex;flex-direction:column}.RCB-dd-with-create .RCB-inline-modal-body .RCB-list{flex:1;overflow:scroll}.RCB-dd-with-create .RCB-dd-create-cta{padding:10px;text-align:center;border:1px solid #bfbfbf;cursor:pointer}.RCB-clear-selected{background:#f2f0f0;padding:3px 6px;font-size:11px;border-radius:15px;border:1px solid #ccc}.RCB-selection-wrapper{float:right}.RCB-selection-wrapper .RCB-select-arrow{float:unset}.RCB-select-arrow{float:right;font-size:12px;color:#96a9bc;margin-right:12px;margin-left:8px}.RCB-select-arrow:after{content:"\25BC";vertical-align:middle}.RCB-dd-label{display:inline-block;overflow:hidden;text-overflow:ellipsis;max-width:70%;vertical-align:top;white-space:nowrap}.RCB-file-input{cursor:pointer}.RCB-drag-drop-uploader{border:2px dashed rgba(104,128,145,0.42);padding:20px;text-align:center}.RCB-drag-over{background:#f3f3f3}.RCB-toggle{padding:2px 3px;background-color:#FFF;border:1px solid #CCC;border-radius:20px;box-sizing:content-box;cursor:pointer}.RCB-toggle.active{background-color:#2cb191}.RCB-toggle.active .RCB-toggle-knob{background-color:#FFF}.RCB-toggle-disable{cursor:not-allowed;opacity:0.8}.RCB-toggle-knob{background-color:#8399ae;border-radius:50%;transition:transform .3s ease}.RCB-modal{position:fixed;top:0;width:100%;height:100%;background:rgba(0,0,0,0.8);display:flex;justify-content:center;align-items:center;z-index:2}.RCB-modal-body{background:#FFF;padding:20px}.RCB-modal-header{display:flex;margin-bottom:10px}.RCB-modal-title{flex:1}.RCB-modal-close{cursor:pointer}.RCB-modal-close:before{content:"X"}.RCB-inline-modal{position:relative;display:inline-block}.RCB-inline-modal.hover-open .RCB-inline-modal-body{display:none}.RCB-inline-modal.hover-open:hover .RCB-inline-modal-body{display:block}.RCB-inline-modal-body{position:absolute;z-index:1}.RCB-inline-modal-body.RCB-align-left{left:0}.RCB-inline-modal-body.RCB-align-right{right:0}.RCB-list{margin:0;padding:0}.RCB-table{border-collapse:collapse;width:100%}.RCB-th.RCB-expand-column{width:50px}.RCB-th-sortable{cursor:pointer}.RCB-th-sort:after{content:"\2B0D"}.RCB-th-asc:after{content:"\25B2"}.RCB-th-dsc:after{content:"\25BC"}.RCB-tr .expand-open:before{content:"▼"}.RCB-tr .expand-close:before{content:"▶"}.RCB-paginate-wrapper .RCB-per-page-count{display:inline-block}.RCB-paginate-wrapper .RCB-form-el-cont{margin:0}.RCB-paginate-wrapper .RCB-inline-modal-btn{background:transparent;padding:0}.RCB-paginate-nav{display:inline-block;border-radius:12px;border:solid 1px #8399ae;background-color:#f6f7f9;vertical-align:middle;margin-left:15px;overflow:hidden}.RCB-page-nav{padding:0 5px;text-decoration:none;color:inherit}.RCB-page-nav:first-child{border-right:solid 1px #8399ae}.RCB-page-nav.disabled{color:#ccc;pointer-events:none;cursor:not-allowed}.RCB-no-data{text-align:center}.RCB-tabs-container{display:flex}.RCB-tab-title{list-style-type:none;padding:10px;cursor:pointer}.RCB-tab-title.selected{background:#FFF;font-weight:bold;border:1px solid #cacaca;position:relative;z-index:1}.RCB-tabs-horizontal{flex-direction:column}.RCB-tabs-horizontal .RCB-tab-title{display:inline-block}.RCB-tabs-horizontal .RCB-tab-title.selected{border-bottom:0;bottom:-1px}.RCB-tabs-vertical .RCB-tab-title{display:block}.RCB-tabs-vertical .RCB-tab-title.selected{border-right:0;right:-1px}.RCB-tab-content{list-style-type:none;border:1px solid #cacaca;padding:10px}.RCB-tab-content.selected{display:block}.RCB-tab-disabled{pointer-events:none;cursor:not-allowed;color:#ccc}.RCB-progress-bar{width:100%;position:relative;background:#ccc}.RCB-progress-value{height:100%;position:absolute;top:0;background:#3d9565}.RCB-tooltip{display:inline-block;position:relative}.RCB-tooltip .RCB-tooltip-body.RCB-tooltip-hover{display:inline-block}.RCB-tooltip .RCB-tooltip-body.RCB-tooltip-click{display:inline-block}.RCB-tooltip-body{display:none;position:absolute;z-index:1}.RCB-accordian-title{cursor:pointer}.RCB-list{list-style-type:none}.RCB-hidden{display:none}.RCB-no-pointer{pointer-events:none}.RCB-disabled .RCB-inline-modal-btn{cursor:not-allowed;pointer-events:none}
-
-/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9jb21wb25lbnRzL2NvcmUuY3NzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLG9CQUFvQixhQUFhLENBQUMsb0JBQW9CLENBQUMsdUNBQXVDLGlCQUFpQixDQUFDLGdDQUFnQyxvQkFBb0IsQ0FBQyxtQkFBbUIsYUFBYSxDQUFDLHNDQUFzQyxhQUFhLENBQUMsNkJBQTZCLG9CQUFvQixDQUFDLFlBQVksQ0FBQyxjQUFjLENBQUMsbUNBQW1DLHFCQUFxQixDQUFDLHNDQUFzQyxxQkFBcUIsQ0FBQywyQ0FBMkMsWUFBWSxDQUFDLHFCQUFxQixDQUFDLHFEQUFxRCxNQUFNLENBQUMsZUFBZSxDQUFDLHVDQUF1QyxZQUFZLENBQUMsaUJBQWlCLENBQUMsd0JBQXdCLENBQUMsY0FBYyxDQUFDLG9CQUFvQixrQkFBa0IsQ0FBQyxlQUFlLENBQUMsY0FBYyxDQUFDLGtCQUFrQixDQUFDLHFCQUFxQixDQUFDLHVCQUF1QixXQUFXLENBQUMseUNBQXlDLFdBQVcsQ0FBQyxrQkFBa0IsV0FBVyxDQUFDLGNBQWMsQ0FBQyxhQUFhLENBQUMsaUJBQWlCLENBQUMsZUFBZSxDQUFDLHdCQUF3QixlQUFlLENBQUMscUJBQXFCLENBQUMsY0FBYyxvQkFBb0IsQ0FBQyxlQUFlLENBQUMsc0JBQXNCLENBQUMsYUFBYSxDQUFDLGtCQUFrQixDQUFDLGtCQUFrQixDQUFDLGdCQUFnQixjQUFjLENBQUMsd0JBQXdCLHdDQUF3QyxDQUFDLFlBQVksQ0FBQyxpQkFBaUIsQ0FBQyxlQUFlLGtCQUFrQixDQUFDLFlBQVksZUFBZSxDQUFDLHFCQUFxQixDQUFDLHFCQUFxQixDQUFDLGtCQUFrQixDQUFDLHNCQUFzQixDQUFDLGNBQWMsQ0FBQyxtQkFBbUIsd0JBQXdCLENBQUMsb0NBQW9DLHFCQUFxQixDQUFDLG9CQUFvQixrQkFBa0IsQ0FBQyxXQUFXLENBQUMsaUJBQWlCLHdCQUF3QixDQUFDLGlCQUFpQixDQUE0Ryw2QkFBNkIsQ0FBQyxXQUFXLGNBQWMsQ0FBQyxLQUFLLENBQUMsVUFBVSxDQUFDLFdBQVcsQ0FBQywwQkFBMEIsQ0FBQyxZQUFZLENBQUMsc0JBQXNCLENBQUMsa0JBQWtCLENBQUMsU0FBUyxDQUFDLGdCQUFnQixlQUFlLENBQUMsWUFBWSxDQUFDLGtCQUFrQixZQUFZLENBQUMsa0JBQWtCLENBQUMsaUJBQWlCLE1BQU0sQ0FBQyxpQkFBaUIsY0FBYyxDQUFDLHdCQUF3QixXQUFXLENBQUMsa0JBQWtCLGlCQUFpQixDQUFDLG9CQUFvQixDQUFDLG9EQUFvRCxZQUFZLENBQUMsMERBQTBELGFBQWEsQ0FBQyx1QkFBdUIsaUJBQWlCLENBQUMsU0FBUyxDQUFDLHNDQUFzQyxNQUFNLENBQUMsdUNBQXVDLE9BQU8sQ0FBQyxVQUFVLFFBQVEsQ0FBQyxTQUFTLENBQUMsV0FBVyx3QkFBd0IsQ0FBQyxVQUFVLENBQUMsMEJBQTBCLFVBQVUsQ0FBQyxpQkFBaUIsY0FBYyxDQUFDLG1CQUFtQixlQUFlLENBQUMsa0JBQWtCLGVBQWUsQ0FBQyxrQkFBa0IsZUFBZSxDQUFDLDRCQUE0QixXQUFXLENBQUMsNkJBQTZCLFdBQVcsQ0FBQywwQ0FBMEMsb0JBQW9CLENBQUMsd0NBQXdDLFFBQVEsQ0FBQyw0Q0FBNEMsc0JBQXNCLENBQUMsU0FBUyxDQUFDLGtCQUFrQixvQkFBb0IsQ0FBQyxrQkFBa0IsQ0FBQyx3QkFBd0IsQ0FBQyx3QkFBd0IsQ0FBQyxxQkFBcUIsQ0FBQyxnQkFBZ0IsQ0FBQyxlQUFlLENBQUMsY0FBYyxhQUFhLENBQUMsb0JBQW9CLENBQUMsYUFBYSxDQUFDLDBCQUEwQiw4QkFBOEIsQ0FBQyx1QkFBdUIsVUFBVSxDQUFDLG1CQUFtQixDQUFDLGtCQUFrQixDQUFDLGFBQWEsaUJBQWlCLENBQUMsb0JBQW9CLFlBQVksQ0FBQyxlQUFlLG9CQUFvQixDQUFDLFlBQVksQ0FBQyxjQUFjLENBQUMsd0JBQXdCLGVBQWUsQ0FBQyxnQkFBZ0IsQ0FBQyx3QkFBd0IsQ0FBQyxpQkFBaUIsQ0FBQyxTQUFTLENBQUMscUJBQXFCLHFCQUFxQixDQUFDLG9DQUFvQyxvQkFBb0IsQ0FBQyw2Q0FBNkMsZUFBZSxDQUFDLFdBQVcsQ0FBQyxrQ0FBa0MsYUFBYSxDQUFDLDJDQUEyQyxjQUFjLENBQUMsVUFBVSxDQUFDLGlCQUFpQixvQkFBb0IsQ0FBQyx3QkFBd0IsQ0FBQyxZQUFZLENBQUMsMEJBQTBCLGFBQWEsQ0FBQyxrQkFBa0IsbUJBQW1CLENBQUMsa0JBQWtCLENBQUMsVUFBVSxDQUFDLGtCQUFrQixVQUFVLENBQUMsaUJBQWlCLENBQUMsZUFBZSxDQUFDLG9CQUFvQixXQUFXLENBQUMsaUJBQWlCLENBQUMsS0FBSyxDQUFDLGtCQUFrQixDQUFDLGFBQWEsb0JBQW9CLENBQUMsaUJBQWlCLENBQUMsaURBQWlELG9CQUFvQixDQUFDLGlEQUFpRCxvQkFBb0IsQ0FBQyxrQkFBa0IsWUFBWSxDQUFDLGlCQUFpQixDQUFDLFNBQVMsQ0FBQyxxQkFBcUIsY0FBYyxDQUFDLFVBQVUsb0JBQW9CLENBQUMsWUFBWSxZQUFZLENBQUMsZ0JBQWdCLG1CQUFtQixDQUFDLG9DQUFvQyxrQkFBa0IsQ0FBQyxtQkFBbUIiLCJmaWxlIjoiY29yZS5jc3MiLCJzb3VyY2VzQ29udGVudCI6WyIuUkNCLWZvcm0tZWwtaW5saW5le21hcmdpbjoyMHB4IDA7ZGlzcGxheTppbmxpbmUtYmxvY2t9LlJDQi1mb3JtLWVsLWlubGluZSAuUkNCLWZvcm0tZWwtbGFiZWx7bWFyZ2luLXJpZ2h0OjE1cHh9LlJDQi1mb3JtLWVsLWlubGluZSAuUkNCLXRvZ2dsZXtkaXNwbGF5OmlubGluZS1ibG9ja30uUkNCLWZvcm0tZWwtYmxvY2t7bWFyZ2luOjIwcHggMH0uUkNCLWZvcm0tZWwtYmxvY2sgLlJDQi1mb3JtLWVsLWxhYmVse2Rpc3BsYXk6YmxvY2t9LlJDQi1kcm9wZG93biAuUkNCLWxpc3QtaXRlbXtsaXN0LXN0eWxlLXR5cGU6bm9uZTtwYWRkaW5nOjEwcHg7Y3Vyc29yOnBvaW50ZXJ9LlJDQi1kcm9wZG93biAuUkNCLWxpc3QtaXRlbTpob3ZlcntiYWNrZ3JvdW5kLWNvbG9yOiNlZWV9LlJDQi1kcm9wZG93biAuUkNCLWxpc3QtaXRlbS5zZWxlY3RlZHtiYWNrZ3JvdW5kLWNvbG9yOiNlZWV9LlJDQi1kZC13aXRoLWNyZWF0ZSAuUkNCLWlubGluZS1tb2RhbC1ib2R5e2Rpc3BsYXk6ZmxleDtmbGV4LWRpcmVjdGlvbjpjb2x1bW59LlJDQi1kZC13aXRoLWNyZWF0ZSAuUkNCLWlubGluZS1tb2RhbC1ib2R5IC5SQ0ItbGlzdHtmbGV4OjE7b3ZlcmZsb3c6c2Nyb2xsfS5SQ0ItZGQtd2l0aC1jcmVhdGUgLlJDQi1kZC1jcmVhdGUtY3Rhe3BhZGRpbmc6MTBweDt0ZXh0LWFsaWduOmNlbnRlcjtib3JkZXI6MXB4IHNvbGlkICNiZmJmYmY7Y3Vyc29yOnBvaW50ZXJ9LlJDQi1jbGVhci1zZWxlY3RlZHtiYWNrZ3JvdW5kOiNmMmYwZjA7cGFkZGluZzozcHggNnB4O2ZvbnQtc2l6ZToxMXB4O2JvcmRlci1yYWRpdXM6MTVweDtib3JkZXI6MXB4IHNvbGlkICNjY2N9LlJDQi1zZWxlY3Rpb24td3JhcHBlcntmbG9hdDpyaWdodH0uUkNCLXNlbGVjdGlvbi13cmFwcGVyIC5SQ0Itc2VsZWN0LWFycm93e2Zsb2F0OnVuc2V0fS5SQ0Itc2VsZWN0LWFycm93e2Zsb2F0OnJpZ2h0O2ZvbnQtc2l6ZToxMnB4O2NvbG9yOiM5NmE5YmM7bWFyZ2luLXJpZ2h0OjEycHg7bWFyZ2luLWxlZnQ6OHB4fS5SQ0Itc2VsZWN0LWFycm93OmFmdGVye2NvbnRlbnQ6XCJcXDI1QkNcIjt2ZXJ0aWNhbC1hbGlnbjptaWRkbGV9LlJDQi1kZC1sYWJlbHtkaXNwbGF5OmlubGluZS1ibG9jaztvdmVyZmxvdzpoaWRkZW47dGV4dC1vdmVyZmxvdzplbGxpcHNpczttYXgtd2lkdGg6NzAlO3ZlcnRpY2FsLWFsaWduOnRvcDt3aGl0ZS1zcGFjZTpub3dyYXB9LlJDQi1maWxlLWlucHV0e2N1cnNvcjpwb2ludGVyfS5SQ0ItZHJhZy1kcm9wLXVwbG9hZGVye2JvcmRlcjoycHggZGFzaGVkIHJnYmEoMTA0LDEyOCwxNDUsMC40Mik7cGFkZGluZzoyMHB4O3RleHQtYWxpZ246Y2VudGVyfS5SQ0ItZHJhZy1vdmVye2JhY2tncm91bmQ6I2YzZjNmM30uUkNCLXRvZ2dsZXtwYWRkaW5nOjJweCAzcHg7YmFja2dyb3VuZC1jb2xvcjojRkZGO2JvcmRlcjoxcHggc29saWQgI0NDQztib3JkZXItcmFkaXVzOjIwcHg7Ym94LXNpemluZzpjb250ZW50LWJveDtjdXJzb3I6cG9pbnRlcn0uUkNCLXRvZ2dsZS5hY3RpdmV7YmFja2dyb3VuZC1jb2xvcjojMmNiMTkxfS5SQ0ItdG9nZ2xlLmFjdGl2ZSAuUkNCLXRvZ2dsZS1rbm9ie2JhY2tncm91bmQtY29sb3I6I0ZGRn0uUkNCLXRvZ2dsZS1kaXNhYmxle2N1cnNvcjpub3QtYWxsb3dlZDtvcGFjaXR5OjAuOH0uUkNCLXRvZ2dsZS1rbm9ie2JhY2tncm91bmQtY29sb3I6IzgzOTlhZTtib3JkZXItcmFkaXVzOjUwJTstd2Via2l0LXRyYW5zaXRpb246dHJhbnNmb3JtIC4zcyBlYXNlOy1tb3otdHJhbnNpdGlvbjp0cmFuc2Zvcm0gLjNzIGVhc2U7LW1zLXRyYW5zaXRpb246dHJhbnNmb3JtIC4zcyBlYXNlO3RyYW5zaXRpb246dHJhbnNmb3JtIC4zcyBlYXNlfS5SQ0ItbW9kYWx7cG9zaXRpb246Zml4ZWQ7dG9wOjA7d2lkdGg6MTAwJTtoZWlnaHQ6MTAwJTtiYWNrZ3JvdW5kOnJnYmEoMCwwLDAsMC44KTtkaXNwbGF5OmZsZXg7anVzdGlmeS1jb250ZW50OmNlbnRlcjthbGlnbi1pdGVtczpjZW50ZXI7ei1pbmRleDoyfS5SQ0ItbW9kYWwtYm9keXtiYWNrZ3JvdW5kOiNGRkY7cGFkZGluZzoyMHB4fS5SQ0ItbW9kYWwtaGVhZGVye2Rpc3BsYXk6ZmxleDttYXJnaW4tYm90dG9tOjEwcHh9LlJDQi1tb2RhbC10aXRsZXtmbGV4OjF9LlJDQi1tb2RhbC1jbG9zZXtjdXJzb3I6cG9pbnRlcn0uUkNCLW1vZGFsLWNsb3NlOmJlZm9yZXtjb250ZW50OlwiWFwifS5SQ0ItaW5saW5lLW1vZGFse3Bvc2l0aW9uOnJlbGF0aXZlO2Rpc3BsYXk6aW5saW5lLWJsb2NrfS5SQ0ItaW5saW5lLW1vZGFsLmhvdmVyLW9wZW4gLlJDQi1pbmxpbmUtbW9kYWwtYm9keXtkaXNwbGF5Om5vbmV9LlJDQi1pbmxpbmUtbW9kYWwuaG92ZXItb3Blbjpob3ZlciAuUkNCLWlubGluZS1tb2RhbC1ib2R5e2Rpc3BsYXk6YmxvY2t9LlJDQi1pbmxpbmUtbW9kYWwtYm9keXtwb3NpdGlvbjphYnNvbHV0ZTt6LWluZGV4OjF9LlJDQi1pbmxpbmUtbW9kYWwtYm9keS5SQ0ItYWxpZ24tbGVmdHtsZWZ0OjB9LlJDQi1pbmxpbmUtbW9kYWwtYm9keS5SQ0ItYWxpZ24tcmlnaHR7cmlnaHQ6MH0uUkNCLWxpc3R7bWFyZ2luOjA7cGFkZGluZzowfS5SQ0ItdGFibGV7Ym9yZGVyLWNvbGxhcHNlOmNvbGxhcHNlO3dpZHRoOjEwMCV9LlJDQi10aC5SQ0ItZXhwYW5kLWNvbHVtbnt3aWR0aDo1MHB4fS5SQ0ItdGgtc29ydGFibGV7Y3Vyc29yOnBvaW50ZXJ9LlJDQi10aC1zb3J0OmFmdGVye2NvbnRlbnQ6XCJcXDJCMERcIn0uUkNCLXRoLWFzYzphZnRlcntjb250ZW50OlwiXFwyNUIyXCJ9LlJDQi10aC1kc2M6YWZ0ZXJ7Y29udGVudDpcIlxcMjVCQ1wifS5SQ0ItdHIgLmV4cGFuZC1vcGVuOmJlZm9yZXtjb250ZW50Olwi4pa8XCJ9LlJDQi10ciAuZXhwYW5kLWNsb3NlOmJlZm9yZXtjb250ZW50Olwi4pa2XCJ9LlJDQi1wYWdpbmF0ZS13cmFwcGVyIC5SQ0ItcGVyLXBhZ2UtY291bnR7ZGlzcGxheTppbmxpbmUtYmxvY2t9LlJDQi1wYWdpbmF0ZS13cmFwcGVyIC5SQ0ItZm9ybS1lbC1jb250e21hcmdpbjowfS5SQ0ItcGFnaW5hdGUtd3JhcHBlciAuUkNCLWlubGluZS1tb2RhbC1idG57YmFja2dyb3VuZDp0cmFuc3BhcmVudDtwYWRkaW5nOjB9LlJDQi1wYWdpbmF0ZS1uYXZ7ZGlzcGxheTppbmxpbmUtYmxvY2s7Ym9yZGVyLXJhZGl1czoxMnB4O2JvcmRlcjpzb2xpZCAxcHggIzgzOTlhZTtiYWNrZ3JvdW5kLWNvbG9yOiNmNmY3Zjk7dmVydGljYWwtYWxpZ246bWlkZGxlO21hcmdpbi1sZWZ0OjE1cHg7b3ZlcmZsb3c6aGlkZGVufS5SQ0ItcGFnZS1uYXZ7cGFkZGluZzowIDVweDt0ZXh0LWRlY29yYXRpb246bm9uZTtjb2xvcjppbmhlcml0fS5SQ0ItcGFnZS1uYXY6Zmlyc3QtY2hpbGR7Ym9yZGVyLXJpZ2h0OnNvbGlkIDFweCAjODM5OWFlfS5SQ0ItcGFnZS1uYXYuZGlzYWJsZWR7Y29sb3I6I2NjYztwb2ludGVyLWV2ZW50czpub25lO2N1cnNvcjpub3QtYWxsb3dlZH0uUkNCLW5vLWRhdGF7dGV4dC1hbGlnbjpjZW50ZXJ9LlJDQi10YWJzLWNvbnRhaW5lcntkaXNwbGF5OmZsZXh9LlJDQi10YWItdGl0bGV7bGlzdC1zdHlsZS10eXBlOm5vbmU7cGFkZGluZzoxMHB4O2N1cnNvcjpwb2ludGVyfS5SQ0ItdGFiLXRpdGxlLnNlbGVjdGVke2JhY2tncm91bmQ6I0ZGRjtmb250LXdlaWdodDpib2xkO2JvcmRlcjoxcHggc29saWQgI2NhY2FjYTtwb3NpdGlvbjpyZWxhdGl2ZTt6LWluZGV4OjF9LlJDQi10YWJzLWhvcml6b250YWx7ZmxleC1kaXJlY3Rpb246Y29sdW1ufS5SQ0ItdGFicy1ob3Jpem9udGFsIC5SQ0ItdGFiLXRpdGxle2Rpc3BsYXk6aW5saW5lLWJsb2NrfS5SQ0ItdGFicy1ob3Jpem9udGFsIC5SQ0ItdGFiLXRpdGxlLnNlbGVjdGVke2JvcmRlci1ib3R0b206MDtib3R0b206LTFweH0uUkNCLXRhYnMtdmVydGljYWwgLlJDQi10YWItdGl0bGV7ZGlzcGxheTpibG9ja30uUkNCLXRhYnMtdmVydGljYWwgLlJDQi10YWItdGl0bGUuc2VsZWN0ZWR7Ym9yZGVyLXJpZ2h0OjA7cmlnaHQ6LTFweH0uUkNCLXRhYi1jb250ZW50e2xpc3Qtc3R5bGUtdHlwZTpub25lO2JvcmRlcjoxcHggc29saWQgI2NhY2FjYTtwYWRkaW5nOjEwcHh9LlJDQi10YWItY29udGVudC5zZWxlY3RlZHtkaXNwbGF5OmJsb2NrfS5SQ0ItdGFiLWRpc2FibGVke3BvaW50ZXItZXZlbnRzOm5vbmU7Y3Vyc29yOm5vdC1hbGxvd2VkO2NvbG9yOiNjY2N9LlJDQi1wcm9ncmVzcy1iYXJ7d2lkdGg6MTAwJTtwb3NpdGlvbjpyZWxhdGl2ZTtiYWNrZ3JvdW5kOiNjY2N9LlJDQi1wcm9ncmVzcy12YWx1ZXtoZWlnaHQ6MTAwJTtwb3NpdGlvbjphYnNvbHV0ZTt0b3A6MDtiYWNrZ3JvdW5kOiMzZDk1NjV9LlJDQi10b29sdGlwe2Rpc3BsYXk6aW5saW5lLWJsb2NrO3Bvc2l0aW9uOnJlbGF0aXZlfS5SQ0ItdG9vbHRpcCAuUkNCLXRvb2x0aXAtYm9keS5SQ0ItdG9vbHRpcC1ob3ZlcntkaXNwbGF5OmlubGluZS1ibG9ja30uUkNCLXRvb2x0aXAgLlJDQi10b29sdGlwLWJvZHkuUkNCLXRvb2x0aXAtY2xpY2t7ZGlzcGxheTppbmxpbmUtYmxvY2t9LlJDQi10b29sdGlwLWJvZHl7ZGlzcGxheTpub25lO3Bvc2l0aW9uOmFic29sdXRlO3otaW5kZXg6MX0uUkNCLWFjY29yZGlhbi10aXRsZXtjdXJzb3I6cG9pbnRlcn0uUkNCLWxpc3R7bGlzdC1zdHlsZS10eXBlOm5vbmV9LlJDQi1oaWRkZW57ZGlzcGxheTpub25lfS5SQ0Itbm8tcG9pbnRlcntwb2ludGVyLWV2ZW50czpub25lfS5SQ0ItZGlzYWJsZWQgLlJDQi1pbmxpbmUtbW9kYWwtYnRue2N1cnNvcjpub3QtYWxsb3dlZDtwb2ludGVyLWV2ZW50czpub25lfVxuIl19 */
+.RCB-form-el-inline{margin:20px 0;display:inline-block}.RCB-form-el-inline .RCB-form-el-label{margin-right:15px}.RCB-form-el-inline .RCB-toggle{display:inline-block}.RCB-form-el-block{margin:20px 0}.RCB-form-el-block .RCB-form-el-label{display:block}.RCB-dropdown .RCB-list-item{list-style-type:none;padding:10px;cursor:pointer}.RCB-dropdown .RCB-list-item:hover{background-color:#eee}.RCB-dropdown .RCB-list-item.selected{background-color:#eee}.RCB-dd-with-create .RCB-inline-modal-body{display:flex;flex-direction:column}.RCB-dd-with-create .RCB-inline-modal-body .RCB-list{flex:1;overflow:scroll}.RCB-dd-with-create .RCB-dd-create-cta{padding:10px;text-align:center;border:1px solid #bfbfbf;cursor:pointer}.RCB-clear-selected{background:#f2f0f0;padding:3px 6px;font-size:11px;border-radius:15px;border:1px solid #ccc}.RCB-selection-wrapper{float:right}.RCB-selection-wrapper .RCB-select-arrow{float:unset}.RCB-select-arrow{float:right;font-size:12px;color:#96a9bc;margin-right:12px;margin-left:8px}.RCB-select-arrow:after{content:"\25BC";vertical-align:middle}.RCB-dd-label{display:inline-block;overflow:hidden;text-overflow:ellipsis;max-width:70%;vertical-align:top;white-space:nowrap}.RCB-file-input{cursor:pointer}.RCB-drag-drop-uploader{border:2px dashed rgba(104,128,145,0.42);padding:20px;text-align:center}.RCB-drag-over{background:#f3f3f3}.RCB-toggle{padding:2px 3px;background-color:#FFF;border:1px solid #CCC;border-radius:20px;box-sizing:content-box;cursor:pointer}.RCB-toggle.active{background-color:#2cb191}.RCB-toggle.active .RCB-toggle-knob{background-color:#FFF}.RCB-toggle-disable{cursor:not-allowed;opacity:0.8}.RCB-toggle-knob{background-color:#8399ae;border-radius:50%;-webkit-transition:transform .3s ease;-moz-transition:transform .3s ease;-ms-transition:transform .3s ease;transition:transform .3s ease}.RCB-modal{position:fixed;top:0;width:100%;height:100%;background:rgba(0,0,0,0.8);display:flex;justify-content:center;align-items:center;z-index:2}.RCB-modal-body{background:#FFF;padding:20px}.RCB-modal-header{display:flex;margin-bottom:10px}.RCB-modal-title{flex:1}.RCB-modal-close{cursor:pointer}.RCB-modal-close:before{content:"X"}.RCB-inline-modal{position:relative;display:inline-block}.RCB-inline-modal.hover-open .RCB-inline-modal-body{display:none}.RCB-inline-modal.hover-open:hover .RCB-inline-modal-body{display:block}.RCB-inline-modal-body{position:absolute;z-index:1}.RCB-inline-modal-body.RCB-align-left{left:0}.RCB-inline-modal-body.RCB-align-right{right:0}.RCB-list{margin:0;padding:0}.RCB-table{border-collapse:collapse;width:100%}.RCB-th.RCB-expand-column{width:50px}.RCB-th-sortable{cursor:pointer}.RCB-th-sort:after{content:"\2B0D"}.RCB-th-asc:after{content:"\25B2"}.RCB-th-dsc:after{content:"\25BC"}.RCB-tr .expand-open:before{content:"▼"}.RCB-tr .expand-close:before{content:"▶"}.RCB-paginate-wrapper .RCB-per-page-count{display:inline-block}.RCB-paginate-wrapper .RCB-form-el-cont{margin:0}.RCB-paginate-wrapper .RCB-inline-modal-btn{background:transparent;padding:0}.RCB-paginate-nav{display:inline-block;border-radius:12px;border:solid 1px #8399ae;background-color:#f6f7f9;vertical-align:middle;margin-left:15px;overflow:hidden}.RCB-page-nav{padding:0 5px;text-decoration:none;color:inherit}.RCB-page-nav:first-child{border-right:solid 1px #8399ae}.RCB-page-nav.disabled{color:#ccc;pointer-events:none;cursor:not-allowed}.RCB-no-data{text-align:center}.RCB-tabs-container{display:flex}.RCB-tab-title{list-style-type:none;padding:10px;cursor:pointer}.RCB-tab-title.selected{background:#FFF;font-weight:bold;border:1px solid #cacaca;position:relative;z-index:1}.RCB-tabs-horizontal{flex-direction:column}.RCB-tabs-horizontal .RCB-tab-title{display:inline-block}.RCB-tabs-horizontal .RCB-tab-title.selected{border-bottom:0;bottom:-1px}.RCB-tabs-vertical .RCB-tab-title{display:block}.RCB-tabs-vertical .RCB-tab-title.selected{border-right:0;right:-1px}.RCB-tab-content{list-style-type:none;border:1px solid #cacaca;padding:10px}.RCB-tab-content.selected{display:block}.RCB-tab-disabled{pointer-events:none;cursor:not-allowed;color:#ccc}.RCB-progress-bar{width:100%;position:relative;background:#ccc}.RCB-progress-value{height:100%;position:absolute;top:0;background:#3d9565}.RCB-tooltip{display:inline-block;position:relative}.RCB-tooltip .RCB-tooltip-body.RCB-tooltip-hover{display:inline-block}.RCB-tooltip .RCB-tooltip-body.RCB-tooltip-click{display:inline-block}.RCB-tooltip-body{display:none;position:absolute;z-index:1}.RCB-accordian-title{cursor:pointer}.RCB-list{list-style-type:none}.RCB-hidden{display:none}.RCB-no-pointer{pointer-events:none}.RCB-disabled .RCB-inline-modal-btn{cursor:not-allowed;pointer-events:none}

package/components/theme.css

@@ -1,3 +1 @@
 .RCB-btn{border-radius:3px;cursor:pointer}.RCB-btn-default:hover{background:#f3f3f3}.RCB-btn-primary{background:#1fa7fd;color:#FFF;border:0}.RCB-btn-primary:hover{background:#208dd2}.RCB-btn-secondary{background:#FFF;border:1px solid #95c7e7}.RCB-btn-secondary:hover{background:#eef8ff}.RCB-btn-small{padding:6px 8px}.RCB-btn-medium{padding:10px 15px}.RCB-btn-large{padding:15px 22px}.RCB-form-error{font-size:12px;color:#d25b5b}.RCB-dd-search{position:relative}.RCB-dd-search-icon{position:absolute;top:5px;left:10px}.RCB-dd-search-icon:before{content:"\1F50D"}.RCB-dd-search-ip{width:100%;padding:10px 30px;border:none;border-bottom:1px solid #CCC}.RCB-inline-modal-btn{display:inline-block;background:#FFF;border:1px solid #eee;padding:10px;border-radius:3px;cursor:pointer}.RCB-inline-modal-body{background:#FFF;border:1px solid #efeeee;box-shadow:0 9px 12px 0 rgba(0,0,0,0.15)}.RCB-notif{padding:10px;border-radius:3px}.RCB-notif-success{color:#129274;border:solid 1px #2cb191;background-color:#edfffb}.RCB-notif-error{color:#d25b5b;border:solid 1px #e75178;background-color:#fff3f6}.RCB-notif-warning{color:#445870;border:solid 1px #efbf6a;background-color:#fffaf2}.RCB-notif-info{color:#509DB9;border:solid 1px #45b5c1;background-color:#f4fcff}.RCB-table td{padding:10px}.RCB-th{background-color:#2287b4;color:#FFF;font-weight:normal;padding:10px}.RCB-even-tr{background-color:#FFF}.RCB-odd-tr{background-color:#dcf1fa}.RCB-expanded-row{background-color:#ecf2f4}.RCB-paginate-bar{background-color:#a3c9db;text-align:right;font-size:14px;padding:5px;border-radius:5px 5px 0 0}.RCB-tooltip-btn{display:inline-block;font-style:italic;font-size:12px;color:#9199AA;background-color:#F8FAFB;border:1px solid #D0DDE2;padding:0px 6px;border-radius:50%;text-align:center}.RCB-tooltip-body{background:#FFF;padding:10px;border-radius:4px;box-shadow:0px 1px 7px 0px #ccc;margin-left:15px}.RCB-accordian-title{padding:10px;border:1px solid #ccc}
-
-/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9jb21wb25lbnRzL3RoZW1lLmNzcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxTQUFTLGlCQUFpQixDQUFDLGNBQWMsQ0FBQyx1QkFBdUIsa0JBQWtCLENBQUMsaUJBQWlCLGtCQUFrQixDQUFDLFVBQVUsQ0FBQyxRQUFRLENBQUMsdUJBQXVCLGtCQUFrQixDQUFDLG1CQUFtQixlQUFlLENBQUMsd0JBQXdCLENBQUMseUJBQXlCLGtCQUFrQixDQUFDLGVBQWUsZUFBZSxDQUFDLGdCQUFnQixpQkFBaUIsQ0FBQyxlQUFlLGlCQUFpQixDQUFDLGdCQUFnQixjQUFjLENBQUMsYUFBYSxDQUFDLGVBQWUsaUJBQWlCLENBQUMsb0JBQW9CLGlCQUFpQixDQUFDLE9BQU8sQ0FBQyxTQUFTLENBQUMsMkJBQTJCLGdCQUFnQixDQUFDLGtCQUFrQixVQUFVLENBQUMsaUJBQWlCLENBQUMsV0FBVyxDQUFDLDRCQUE0QixDQUFDLHNCQUFzQixvQkFBb0IsQ0FBQyxlQUFlLENBQUMscUJBQXFCLENBQUMsWUFBWSxDQUFDLGlCQUFpQixDQUFDLGNBQWMsQ0FBQyx1QkFBdUIsZUFBZSxDQUFDLHdCQUF3QixDQUFDLHdDQUF3QyxDQUFDLFdBQVcsWUFBWSxDQUFDLGlCQUFpQixDQUFDLG1CQUFtQixhQUFhLENBQUMsd0JBQXdCLENBQUMsd0JBQXdCLENBQUMsaUJBQWlCLGFBQWEsQ0FBQyx3QkFBd0IsQ0FBQyx3QkFBd0IsQ0FBQyxtQkFBbUIsYUFBYSxDQUFDLHdCQUF3QixDQUFDLHdCQUF3QixDQUFDLGdCQUFnQixhQUFhLENBQUMsd0JBQXdCLENBQUMsd0JBQXdCLENBQUMsY0FBYyxZQUFZLENBQUMsUUFBUSx3QkFBd0IsQ0FBQyxVQUFVLENBQUMsa0JBQWtCLENBQUMsWUFBWSxDQUFDLGFBQWEscUJBQXFCLENBQUMsWUFBWSx3QkFBd0IsQ0FBQyxrQkFBa0Isd0JBQXdCLENBQUMsa0JBQWtCLHdCQUF3QixDQUFDLGdCQUFnQixDQUFDLGNBQWMsQ0FBQyxXQUFXLENBQUMseUJBQXlCLENBQUMsaUJBQWlCLG9CQUFvQixDQUFDLGlCQUFpQixDQUFDLGNBQWMsQ0FBQyxhQUFhLENBQUMsd0JBQXdCLENBQUMsd0JBQXdCLENBQUMsZUFBZSxDQUFDLGlCQUFpQixDQUFDLGlCQUFpQixDQUFDLGtCQUFrQixlQUFlLENBQUMsWUFBWSxDQUFDLGlCQUFpQixDQUFDLCtCQUErQixDQUFDLGdCQUFnQixDQUFDLHFCQUFxQixZQUFZLENBQUMscUJBQXFCIiwiZmlsZSI6InRoZW1lLmNzcyIsInNvdXJjZXNDb250ZW50IjpbIi5SQ0ItYnRue2JvcmRlci1yYWRpdXM6M3B4O2N1cnNvcjpwb2ludGVyfS5SQ0ItYnRuLWRlZmF1bHQ6aG92ZXJ7YmFja2dyb3VuZDojZjNmM2YzfS5SQ0ItYnRuLXByaW1hcnl7YmFja2dyb3VuZDojMWZhN2ZkO2NvbG9yOiNGRkY7Ym9yZGVyOjB9LlJDQi1idG4tcHJpbWFyeTpob3ZlcntiYWNrZ3JvdW5kOiMyMDhkZDJ9LlJDQi1idG4tc2Vjb25kYXJ5e2JhY2tncm91bmQ6I0ZGRjtib3JkZXI6MXB4IHNvbGlkICM5NWM3ZTd9LlJDQi1idG4tc2Vjb25kYXJ5OmhvdmVye2JhY2tncm91bmQ6I2VlZjhmZn0uUkNCLWJ0bi1zbWFsbHtwYWRkaW5nOjZweCA4cHh9LlJDQi1idG4tbWVkaXVte3BhZGRpbmc6MTBweCAxNXB4fS5SQ0ItYnRuLWxhcmdle3BhZGRpbmc6MTVweCAyMnB4fS5SQ0ItZm9ybS1lcnJvcntmb250LXNpemU6MTJweDtjb2xvcjojZDI1YjVifS5SQ0ItZGQtc2VhcmNoe3Bvc2l0aW9uOnJlbGF0aXZlfS5SQ0ItZGQtc2VhcmNoLWljb257cG9zaXRpb246YWJzb2x1dGU7dG9wOjVweDtsZWZ0OjEwcHh9LlJDQi1kZC1zZWFyY2gtaWNvbjpiZWZvcmV7Y29udGVudDpcIlxcMUY1MERcIn0uUkNCLWRkLXNlYXJjaC1pcHt3aWR0aDoxMDAlO3BhZGRpbmc6MTBweCAzMHB4O2JvcmRlcjpub25lO2JvcmRlci1ib3R0b206MXB4IHNvbGlkICNDQ0N9LlJDQi1pbmxpbmUtbW9kYWwtYnRue2Rpc3BsYXk6aW5saW5lLWJsb2NrO2JhY2tncm91bmQ6I0ZGRjtib3JkZXI6MXB4IHNvbGlkICNlZWU7cGFkZGluZzoxMHB4O2JvcmRlci1yYWRpdXM6M3B4O2N1cnNvcjpwb2ludGVyfS5SQ0ItaW5saW5lLW1vZGFsLWJvZHl7YmFja2dyb3VuZDojRkZGO2JvcmRlcjoxcHggc29saWQgI2VmZWVlZTtib3gtc2hhZG93OjAgOXB4IDEycHggMCByZ2JhKDAsMCwwLDAuMTUpfS5SQ0Itbm90aWZ7cGFkZGluZzoxMHB4O2JvcmRlci1yYWRpdXM6M3B4fS5SQ0Itbm90aWYtc3VjY2Vzc3tjb2xvcjojMTI5Mjc0O2JvcmRlcjpzb2xpZCAxcHggIzJjYjE5MTtiYWNrZ3JvdW5kLWNvbG9yOiNlZGZmZmJ9LlJDQi1ub3RpZi1lcnJvcntjb2xvcjojZDI1YjViO2JvcmRlcjpzb2xpZCAxcHggI2U3NTE3ODtiYWNrZ3JvdW5kLWNvbG9yOiNmZmYzZjZ9LlJDQi1ub3RpZi13YXJuaW5ne2NvbG9yOiM0NDU4NzA7Ym9yZGVyOnNvbGlkIDFweCAjZWZiZjZhO2JhY2tncm91bmQtY29sb3I6I2ZmZmFmMn0uUkNCLW5vdGlmLWluZm97Y29sb3I6IzUwOURCOTtib3JkZXI6c29saWQgMXB4ICM0NWI1YzE7YmFja2dyb3VuZC1jb2xvcjojZjRmY2ZmfS5SQ0ItdGFibGUgdGR7cGFkZGluZzoxMHB4fS5SQ0ItdGh7YmFja2dyb3VuZC1jb2xvcjojMjI4N2I0O2NvbG9yOiNGRkY7Zm9udC13ZWlnaHQ6bm9ybWFsO3BhZGRpbmc6MTBweH0uUkNCLWV2ZW4tdHJ7YmFja2dyb3VuZC1jb2xvcjojRkZGfS5SQ0Itb2RkLXRye2JhY2tncm91bmQtY29sb3I6I2RjZjFmYX0uUkNCLWV4cGFuZGVkLXJvd3tiYWNrZ3JvdW5kLWNvbG9yOiNlY2YyZjR9LlJDQi1wYWdpbmF0ZS1iYXJ7YmFja2dyb3VuZC1jb2xvcjojYTNjOWRiO3RleHQtYWxpZ246cmlnaHQ7Zm9udC1zaXplOjE0cHg7cGFkZGluZzo1cHg7Ym9yZGVyLXJhZGl1czo1cHggNXB4IDAgMH0uUkNCLXRvb2x0aXAtYnRue2Rpc3BsYXk6aW5saW5lLWJsb2NrO2ZvbnQtc3R5bGU6aXRhbGljO2ZvbnQtc2l6ZToxMnB4O2NvbG9yOiM5MTk5QUE7YmFja2dyb3VuZC1jb2xvcjojRjhGQUZCO2JvcmRlcjoxcHggc29saWQgI0QwRERFMjtwYWRkaW5nOjBweCA2cHg7Ym9yZGVyLXJhZGl1czo1MCU7dGV4dC1hbGlnbjpjZW50ZXJ9LlJDQi10b29sdGlwLWJvZHl7YmFja2dyb3VuZDojRkZGO3BhZGRpbmc6MTBweDtib3JkZXItcmFkaXVzOjRweDtib3gtc2hhZG93OjBweCAxcHggN3B4IDBweCAjY2NjO21hcmdpbi1sZWZ0OjE1cHh9LlJDQi1hY2NvcmRpYW4tdGl0bGV7cGFkZGluZzoxMHB4O2JvcmRlcjoxcHggc29saWQgI2NjY31cbiJdfQ== */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@unbxd-ui/unbxd-react-components",
-  "version": "0.2.100",
+  "version": "0.2.101-beta.1",
   "description": "React components library",
   "keywords": [
     "react components",
@@ -35,8 +35,8 @@
     "publish": "npm run publish-css && npm run build && npm run copypackage && npm run copyscss && cd lib && npm publish"
   },
   "dependencies": {
-    "@storybook/addon-a11y": "^6.4.10",
-    "@storybook/addon-storysource": "^6.4.10",
+    "@storybook/addon-a11y": "^7.0.25",
+    "@storybook/addon-storysource": "^7.0.25",
     "bluebird": "^3.7.2",
     "dequal": "^1.0.1",
     "lodash.clonedeep": "^4.5.0",
@@ -44,6 +44,7 @@
     "react-dom": "^16.14.0",
     "react-window": "^1.8.6",
     "react-window-infinite-loader": "^1.0.7",
+    "sass": "^1.63.6",
     "whatwg-fetch": "^3.6.2"
   },
   "devDependencies": {
@@ -53,28 +54,37 @@
     "@babel/plugin-proposal-export-default-from": "^7.14.5",
     "@babel/preset-env": "^7.15.8",
     "@babel/preset-react": "^7.14.5",
-    "@storybook/addon-actions": "^6.4.10",
-    "@storybook/addon-console": "^1.2.3",
-    "@storybook/addon-docs": "^6.4.10",
+    "@storybook/addon-actions": "^7.0.25",
+    "@storybook/addon-console": "^2.0.0",
+    "@storybook/addon-docs": "^7.0.25",
     "@storybook/addon-info": "^5.3.21",
-    "@storybook/addon-links": "^6.4.10",
-    "@storybook/addons": "^6.4.10",
-    "@storybook/react": "^6.4.10",
-    "@storybook/storybook-deployer": "^2.8.10",
+    "@storybook/addon-links": "^7.0.25",
+    "@storybook/addons": "^7.0.25",
+    "@storybook/react": "^7.0.25",
+    "@storybook/storybook-deployer": "^2.8.16",
+    "autoprefixer": "^10.4.14",
     "babel-eslint": "^10.1.0",
     "babel-loader": "^8.2.3",
+    "cross-env": "^7.0.3",
     "css-loader": "^3.6.0",
     "eslint": "^6.8.0",
     "eslint-plugin-babel": "^5.3.1",
     "eslint-plugin-react": "^7.26.1",
     "mini-css-extract-plugin": "^0.8.2",
-    "node-sass": "^4.14.1",
-    "optimize-css-assets-webpack-plugin": "^5.0.8",
-    "postcss-cli": "^6.1.3",
+    "node-sass": "^8.0.0",
+    "optimize-css-assets-webpack-plugin": "^6.0.1",
+    "postcss-cli": "^10.1.0",
     "sass-loader": "^7.3.1",
     "storybook-readme": "^5.0.9",
     "terser-webpack-plugin": "^1.4.5",
     "webpack": "^4.46.0",
     "webpack-cli": "^3.3.12"
+  },
+  "overrides": {
+    "fbjs": "^3.0.5",
+    "marked": "^5.1.0",
+    "prismjs": "^1.29.0",
+    "glob-parent": "5.1.2",
+    "parse-url": "^8.1.0"
   }
 }

package/src/Intro.stories.mdx

@@ -0,0 +1,119 @@
+import { Meta } from '@storybook/addon-docs/blocks';
+
+<Meta title="Design System|Introduction" />
+
+## Introduction to the RCB (React Components Bundle) library
+
+RCB contains a bunch of low level components (atoms of a design system) that you can use individually 
+or combine them to make additional components (molecules of a design system) to build web pages.
+
+## Using the components library
+
+First, install the package from npm
+
+```
+npm install react-components-bundle
+```
+
+Next, import the required components. There are 2 ways to achieve this.
+
+If you want a minimal footprint from the RCB library and include only the components which you use, 
+then import the components individually as shown below. 
+This enables tree shaking and therefore components that you did not use will not get included in your final bundle.
+
+```
+import Button from "react-components-bundle/components/Button";
+```
+
+If size of the bundle does not matter or you will use all/most of the components in the RCB library, 
+then you can import the components as shown below:
+
+```
+import { Button } from "react-components-bundle";
+```
+
+### Using core CSS
+
+Finally, include the core CSS like below,
+
+```
+import "react-components-bundle/components/core.css";
+```
+
+The core CSS file will contain the core styles without which the component will not behave as expected. 
+Hence do not forget to include this. 
+
+### Using theme CSS
+
+Theme CSS file will contain the styles which suggests a theme for all the components but is not a must have to use the library.
+
+You can use the theme CSS in 2 ways:
+
+**1. Use individual component CSS**
+
+You can import the individual files for each of the components like below:
+
+```
+import "react-components-bundle/components/Table/tableTheme.css";
+```
+
+**2. Include the bundled CSS file which has all component's CSS**
+
+You can import the bundled CSS file which contains all the component's CSS like below:
+
+```
+import "react-components-bundle/components/theme.css";
+```
+
+## Library structure
+
+```
+react-components-bundle
+│
+│
+└─── components
+│    │   
+│    └─── Button
+│    │
+│    └─── DataLoader
+│    │   
+│    └─── Form
+│    │    │   
+│    │    └─── Input
+│    │    │    
+│    │    └─── Checkbox
+│    │    │    
+│    │    └─── DragDropFileUploader
+│    │    │    
+│    │    └─── Dropdown
+│    │    │   
+│    │    └─── FileUploader
+│    │    │   
+│    │    └─── RadioList
+│    │    │   
+│    │    └─── RangeSlider
+│    │    │    
+│    │    └─── TextArea
+│    │    │    
+│    │    └─── Toggle
+│    │
+│    └─── InlineModal
+│    │
+│    └─── List
+│    │
+│    └─── Modal
+│    │
+│    └─── NotificationComponent
+│    │
+│    └─── ProgressBar
+│    │
+│    └─── Table
+│    │
+│    └─── TabsComponent
+│   
+└─── core
+     │
+     └─── dataLoader
+     │
+     └─── utils
+```

package/src/components/Accordian/Accordian.js

@@ -0,0 +1,89 @@
+import React, { useState, cloneElement } from "react";
+import PropTypes from "prop-types";
+import List from "../List";
+
+const ALL = "ALL";
+
+const getDefaultOpenedItems = (items = [], defaultOpen) =>{
+    let arr = [];
+    if(items.length > 0) {
+        items.forEach((item) => {
+            const {
+                id
+            } = item;
+            if(id === defaultOpen || defaultOpen === ALL ) {
+                arr.push(id)
+            }
+        })
+    }
+    return arr;
+}
+
+const AccordianItem = (props) => {
+    const {
+        itemData,
+        allowOneOpen,
+        openedItems,
+        setOpenedItems
+    } = props;    
+    const { titleComponent, bodyComponent, id } = itemData;
+    const isOpen = openedItems.find(item => item === id) ? true: false;
+    const onItemClick = () => {
+        let newList = [id];
+        if(!allowOneOpen) {
+            newList = isOpen ? openedItems.filter(item => item !== id) : [...openedItems, id]
+        }
+        setOpenedItems(newList)
+    }
+    return <li className={`RCB-accordian-item ${isOpen ? "RCB-accordian-open" : "RCB-accordian-close"}`}>
+        <div className="RCB-accordian-title" onClick={onItemClick}>{cloneElement(titleComponent, { isOpen: isOpen })}</div>        
+        {isOpen && <div className="RCB-accordian-body">{bodyComponent}</div>}
+    </li>
+};
+
+AccordianItem.propTypes = {
+    itemData: PropTypes.shape({
+        id: PropTypes.string.isRequired,
+        titleComponent: PropTypes.element.isRequired,
+        bodyComponent: PropTypes.element.isRequired,
+    }),
+    setOpenedItems: PropTypes.func,
+    openedItems: PropTypes.array,
+    allowOneOpen: PropTypes.bool
+};
+
+
+const Accordian = ({defaultOpen, items, allowOneOpen}) => {
+    const defaultOpened = getDefaultOpenedItems(items, defaultOpen);
+    const [openedItems, setOpenedItems] = useState(defaultOpened);
+    return (<div className={`RCB-accordian`}>
+        {
+            <List 
+                items={items}
+                openedItems={openedItems}
+                defaultOpen={defaultOpen}
+                allowOneOpen={allowOneOpen}
+                setOpenedItems={setOpenedItems}
+                ListItem={AccordianItem} /> 
+        }
+    </div>);
+};
+
+Accordian.propTypes = {
+    defaultOpen: PropTypes.string,
+    items: PropTypes.arrayOf(PropTypes.shape({
+        id: PropTypes.string.isRequired,
+        titleComponent: PropTypes.element.isRequired,
+        bodyComponent: PropTypes.element.isRequired,
+    })).isRequired,
+    // /* set to false if you want more than one accordian item to be open at a time */
+    allowOneOpen: PropTypes.bool
+};
+
+Accordian.defaultProps = {
+    allowOneOpen: false,
+    defaultOpen:"",//"ALL","ID","",
+    items:[]
+};
+
+export default Accordian;

package/src/components/Accordian/Accordian.stories.js

@@ -0,0 +1,92 @@
+import React, { Fragment, useState } from "react";
+import Accordian from "./Accordian";
+
+
+export default {
+    title: 'Accordian',
+    component: Accordian,
+};
+
+const AccordianBody = () => {
+    const [count, setRandomNumber] = useState(1);
+    const onSetRandom = ()=>{
+        setRandomNumber(Math.round(Math.random()*10))
+    }
+    return <div style={{padding:'20px'}}>
+        <h3>This is accordian body</h3>
+        <button onClick={onSetRandom}> changed to {count}</button>
+    </div>
+}
+const AccordianTitle = ({id}) => {
+    return <div>
+        {`Title ${id}`}
+    </div>
+}  
+const Template = (args) => <Accordian {...args} />;
+
+export const Default = Template.bind();
+Default.args = {
+    items: [{
+        id: "41",
+        titleComponent: <AccordianTitle id={'41'}/>,
+        bodyComponent: <AccordianBody/>,
+    }, {
+        id: "42",
+        titleComponent: <AccordianTitle id={'42'}/>,
+        bodyComponent: <AccordianBody/>
+    }, {
+        id: "43",
+        titleComponent: <AccordianTitle id={'43'}/>,
+        bodyComponent: <AccordianBody/>
+    }, {
+        id: "44",
+        titleComponent: <AccordianTitle id={'44'}/>,
+        bodyComponent: <AccordianBody/>
+    }],
+    defaultOpen:""
+};
+
+export const DefaultOpen = Template.bind();
+DefaultOpen.args = {
+    items: [{
+        id: "41",
+        titleComponent: <AccordianTitle id={'41'}/>,
+        bodyComponent: <AccordianBody/>,
+    }, {
+        id: "42",
+        titleComponent: <AccordianTitle id={'42'}/>,
+        bodyComponent: <AccordianBody/>
+    }, {
+        id: "43",
+        titleComponent: <AccordianTitle id={'43'}/>,
+        bodyComponent: <AccordianBody/>
+    }, {
+        id: "44",
+        titleComponent: <AccordianTitle id={'44'}/>,
+        bodyComponent: <AccordianBody/>
+    }],
+    defaultOpen:"42"
+}
+
+export const OpenAtLeastOneAlways = Template.bind();
+OpenAtLeastOneAlways.args = {
+    items: [{
+        id: "411",
+        titleComponent: <AccordianTitle id={'41'}/>,
+        bodyComponent: <AccordianBody/>,
+    }, {
+        id: "421",
+        titleComponent: <AccordianTitle id={'42'}/>,
+        bodyComponent: <AccordianBody/>
+    }, {
+        id: "431",
+        titleComponent: <AccordianTitle id={'43'}/>,
+        bodyComponent: <AccordianBody/>
+    }, {
+        id: "441",
+        titleComponent: <AccordianTitle id={'44'}/>,
+        bodyComponent: <AccordianBody/>
+    }],
+    defaultOpen:"421",
+    allowOneOpen:true
+}

package/src/components/Accordian/accordianCore.scss

@@ -0,0 +1,8 @@
+.RCB {
+    &-accordian-title {
+       cursor: pointer;
+    }
+    &-list {
+        list-style-type: none;
+    }
+}