@corva/ui 3.1.0-rc.4 → 3.1.0-rc.5

package/components/UserMention/style.css.js

@@ -1 +1,8 @@
-import t from'./../../ext-esm/style-inject/dist/style-inject.es.js';var n={mention:"style_mention__ItOCH",mention__control:"style_mention__control__n07-d","mention--multiLine":"style_mention--multiLine__AUiad",mention__suggestions:"style_mention__suggestions__SA5o5",mention__suggestions__list:"style_mention__suggestions__list__rwfgI",mention__suggestions__item:"style_mention__suggestions__item__gqwq0",mention__highlighter:"style_mention__highlighter__pNPhl",mention__input:"style_mention__input__5-hJw",mention__suggestion:"style_mention__suggestion__xzP4Y",mention__suggestion__info:"style_mention__suggestion__info__2yJKq",mention__suggestion__info__name:"style_mention__suggestion__info__name__yq1t4",mention__suggestion__info__group:"style_mention__suggestion__info__group__MkVWS"};t('.style_mention__ItOCH{margin:0;min-width:0;width:100%}.style_mention__control__n07-d{width:100%}.style_mention--multiLine__AUiad .style_mention__control__n07-d{height:70px;max-height:70px;overflow-y:auto}.style_mention__suggestions__SA5o5{background-color:#fff;border-radius:4px;box-shadow:0 5px 5px -3px rgba(0,0,0,.2),0 8px 10px 1px rgba(0,0,0,.14),0 3px 14px 2px rgba(0,0,0,.12);max-height:260px;max-width:calc(100% - 32px);min-width:250px!important;overflow-x:hidden}.style_mention__suggestions__list__rwfgI{font-size:14px;max-height:260px;overflow-y:auto;position:relative}.style_mention__suggestions__item__gqwq0{align-items:center;box-sizing:content-box;color:rgba(0,0,0,.87);display:flex;font-family:Roboto,Helvetica,Arial,sans-serif;font-size:1rem;font-weight:400;justify-content:flex-start;line-height:1.5em;min-width:250px;overflow:hidden;padding:11px 16px;position:relative;text-align:left;text-decoration:none;white-space:nowrap;width:auto}.style_mention__suggestions__item__gqwq0:hover{background-color:rgba(0,0,0,.08)!important}.style_mention__highlighter__pNPhl{letter-spacing:0;line-height:normal}.style_mention__highlighter__pNPhl span,.style_mention__highlighter__pNPhl strong{letter-spacing:normal;line-height:normal!important;margin:0!important;padding:0!important;visibility:visible!important}.style_mention__input__5-hJw{border:none;letter-spacing:normal!important;line-height:normal!important;outline:none;padding:0}.style_mention__suggestion__xzP4Y{align-items:center;display:flex;position:relative;width:100%}.style_mention__suggestion__xzP4Y:after{background-color:rgba(0,0,0,.08);bottom:-11px;content:"";height:1px;position:absolute;right:-16px;width:calc(100% - 35px)}.style_mention__suggestion__info__2yJKq{display:flex;flex:1;flex-direction:column;overflow:hidden;padding-left:1rem}.style_mention__suggestion__info__name__yq1t4{display:inline-block;font-size:1rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:100%}.style_mention__suggestion__info__group__MkVWS{color:#b1b1b1;font-size:.9rem}');export{n as default};
+import styleInject from './../../ext-esm/style-inject/dist/style-inject.es.js';
+
+var css_248z = ".style_mention__ItOCH {\n  width: 100%;\n  margin: 0;\n  min-width: 0;\n}\n\n.style_mention__control__n07-d {\n  width: 100%;\n}\n\n.style_mention--multiLine__AUiad .style_mention__control__n07-d {\n  max-height: 70px;\n  height: 70px;\n  overflow-y: auto;\n}\n\n.style_mention__suggestions__SA5o5 {\n  box-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14),\n    0px 3px 14px 2px rgba(0, 0, 0, 0.12);\n  border-radius: 4px;\n  background-color: #fff;\n  max-width: calc(100% - 32px);\n  min-width: 250px !important;\n  overflow-x: hidden;\n  max-height: 260px;\n}\n\n.style_mention__suggestions__list__rwfgI {\n  font-size: 14px;\n  position: relative;\n  max-height: 260px;\n  overflow-y: auto;\n}\n\n.style_mention__suggestions__item__gqwq0 {\n  color: rgba(0, 0, 0, 0.87);\n  width: auto;\n  min-width: 250px;\n  overflow: hidden;\n  font-size: 1rem;\n  box-sizing: content-box;\n  font-weight: 400;\n  font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;\n  line-height: 1.5em;\n  white-space: nowrap;\n  padding: 11px 16px;\n\n  display: flex;\n  position: relative;\n  box-sizing: content-box;\n  text-align: left;\n  align-items: center;\n  justify-content: flex-start;\n  text-decoration: none;\n}\n\n.style_mention__suggestions__item__gqwq0:hover {\n  background-color: rgba(0, 0, 0, 0.08) !important;\n}\n\n/* START\n** NOTE: do not touch - will affect all user mention places\n**/\n\n.style_mention__highlighter__pNPhl {\n  letter-spacing: 0;\n  line-height: normal;\n}\n\n.style_mention__highlighter__pNPhl strong,\n.style_mention__highlighter__pNPhl span {\n  visibility: visible !important;\n  line-height: normal !important;\n  letter-spacing: normal;\n  padding: 0 !important;\n  margin: 0 !important;\n}\n\n.style_mention__input__5-hJw {\n  outline: none;\n  border: none;\n  padding: 0;\n  line-height: normal !important;\n  letter-spacing: normal !important;\n}\n\n/* END */\n\n.style_mention__suggestion__xzP4Y {\n  display: flex;\n  width: 100%;\n  align-items: center;\n  position: relative;\n}\n\n.style_mention__suggestion__xzP4Y:after {\n  content: '';\n  position: absolute;\n  bottom: -11px;\n  right: -16px;\n  width: calc(100% - 35px);\n  height: 1px;\n  background-color: rgba(0, 0, 0, 0.08);\n}\n\n.style_mention__suggestion__info__2yJKq {\n  display: flex;\n  flex-direction: column;\n  padding-left: 1rem;\n  flex: 1;\n  overflow: hidden;\n}\n\n.style_mention__suggestion__info__name__yq1t4 {\n  font-size: 1rem;\n  text-overflow: ellipsis;\n  overflow: hidden;\n  white-space: nowrap;\n  display: inline-block;\n  width: 100%;\n}\n\n.style_mention__suggestion__info__group__MkVWS {\n  font-size: 0.9rem;\n  color: #b1b1b1;\n}\n";
+var styles = {"mention":"style_mention__ItOCH","mention__control":"style_mention__control__n07-d","mention--multiLine":"style_mention--multiLine__AUiad","mention__suggestions":"style_mention__suggestions__SA5o5","mention__suggestions__list":"style_mention__suggestions__list__rwfgI","mention__suggestions__item":"style_mention__suggestions__item__gqwq0","mention__highlighter":"style_mention__highlighter__pNPhl","mention__input":"style_mention__input__5-hJw","mention__suggestion":"style_mention__suggestion__xzP4Y","mention__suggestion__info":"style_mention__suggestion__info__2yJKq","mention__suggestion__info__name":"style_mention__suggestion__info__name__yq1t4","mention__suggestion__info__group":"style_mention__suggestion__info__group__MkVWS"};
+styleInject(css_248z);
+
+export { styles as default };
+//# sourceMappingURL=style.css.js.map

package/components/UserMention/style.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,wBAAwB,sDAAyD;AACjF;AACA;AACA;AACA;AACA;AACA;"}

package/components/UserMention/utils/index.js

@@ -1 +1,129 @@
-import e from"@babel/runtime/helpers/asyncToGenerator";import r from"@babel/runtime/regenerator";import"../../DevCenter/DevCenterRouterContext/DevCenterRouterContext.js";import{UniversalLink as t}from"../../DevCenter/DevCenterRouterContext/UniversalLink/UniversalLink.js";import"react";import"@babel/runtime/helpers/defineProperty";import"@babel/runtime/helpers/objectWithoutProperties";import"react-router";import{jsx as n}from"react/jsx-runtime";import{PLACEHOLDERS as o,USER_MARKUP as i}from"../constants.js";import a from"../style.css.js";import s from"../../UserCardPopover.js";import{getUserAutocomplete as c}from"../../../clients/jsonApi/index.js";var u,p=function(e){return e.replace(/[-[\]{}()*+?.,\\^$|#\s]/g,"\\$&")},l=function(e){var r=p(e),t=e[e.indexOf(o.display)+o.display.length],n=e[e.indexOf(o.display)+o.display.length];return new RegExp(r.replace(o.display,"([^".concat(p(t||""),"]+?)")).replace(o.id,"([^".concat(p(n||""),"]+?)")),"g")},m=function(e,r,o){var a=arguments.length>3&&void 0!==arguments[3]?arguments[3]:"#039be5",c=arguments.length>4?arguments[4]:void 0;if(!e)return e;var u=l(i),p=e.split(u),m=3,f=p.reduce((function(e,i,u){var l=e;if(u%m-1==0){var f="@".concat(p[u+1]),d=r&&r.length&&r.find((function(e){return e.id===Number(i)})),h=d&&!o?n(s,{user:d,wrapperStyle:{display:"inline-block",color:a},currentUser:c,children:f},"userCard-".concat(u)):n(t,{href:"/config/users/".concat(i),children:f},"userLink-".concat(u));l.push(h)}return u%m==0&&l.push(i),l}),[]);return f},f=function(e){return e.data.map((function(e){return{id:e.id,display:"".concat(e.first_name," ").concat(e.last_name),photo:e.profile_photo,title:e.title}}))},d=(u=e(r.mark((function e(t,n,o){var i,a;return r.wrap((function(e){for(;;)switch(e.prev=e.next){case 0:if(t){e.next=2;break}return e.abrupt("return",n([]));case 2:return e.prev=2,e.next=5,c(null,t,o);case 5:i=e.sent,e.next=11;break;case 8:e.prev=8,e.t0=e.catch(2),console.error(e.t0);case 11:if(i&&0!==i.data.length){e.next=13;break}return e.abrupt("return",n([]));case 13:return a=f(i),e.abrupt("return",n(a));case 15:case"end":return e.stop()}}),e,null,[[2,8]])}))),function(e,r,t){return u.apply(this,arguments)}),h=function(){return document.getElementsByClassName(a.mention__suggestions__list).length>0};export{m as formatMentionText,d as handleFetchUsers,h as isSuggestionsListOpened};
+import _asyncToGenerator from '@babel/runtime/helpers/asyncToGenerator';
+import _regeneratorRuntime from '@babel/runtime/regenerator';
+import '../../DevCenter/DevCenterRouterContext/DevCenterRouterContext.js';
+import { UniversalLink } from '../../DevCenter/DevCenterRouterContext/UniversalLink/UniversalLink.js';
+import 'react';
+import '@babel/runtime/helpers/defineProperty';
+import '@babel/runtime/helpers/objectWithoutProperties';
+import 'react-router';
+import { jsx } from 'react/jsx-runtime';
+import { PLACEHOLDERS, USER_MARKUP } from '../constants.js';
+import styles from '../style.css.js';
+import UserCardPopover from '../../UserCardPopover.js';
+import { getUserAutocomplete } from '../../../clients/jsonApi/index.js';
+
+var escapeString = function escapeString(str) {
+  return str.replace(/[-[\]{}()*+?.,\\^$|#\s]/g, '\\$&');
+};
+var markupToRegex = function markupToRegex(markup) {
+  var escapedMarkup = escapeString(markup);
+  var charAfterDisplay = markup[markup.indexOf(PLACEHOLDERS.display) + PLACEHOLDERS.display.length];
+  var charAfterId = markup[markup.indexOf(PLACEHOLDERS.display) + PLACEHOLDERS.display.length];
+  return new RegExp(escapedMarkup.replace(PLACEHOLDERS.display, "([^".concat(escapeString(charAfterDisplay || ''), "]+?)")).replace(PLACEHOLDERS.id, "([^".concat(escapeString(charAfterId || ''), "]+?)")), 'g');
+};
+var formatMentionText = function formatMentionText(text, mentionedUsers, isNativeView) {
+  var color = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : '#039be5';
+  var currentUser = arguments.length > 4 ? arguments[4] : undefined;
+  if (!text) return text;
+  var regexp = markupToRegex(USER_MARKUP);
+  var parts = text.split(regexp);
+
+  // NOTE: Because we have 2 groups in our regexp
+  // every 2nd element will be the user id
+  // every 3rd element will be the user name
+
+  var n = 3; // NOTE: Match/User ID/User name
+  var componentParts = parts.reduce(function (acc, p, i) {
+    var newParts = acc;
+    if (i % n - 1 === 0) {
+      var userName = "@".concat(parts[i + 1]);
+      var user = mentionedUsers && mentionedUsers.length && mentionedUsers.find(function (item) {
+        return item.id === Number(p);
+      });
+      var part = user && !isNativeView ? /*#__PURE__*/jsx(UserCardPopover, {
+        user: user,
+        wrapperStyle: {
+          display: 'inline-block',
+          color: color
+        }
+        // eslint-disable-next-line react/no-array-index-key
+        ,
+
+        currentUser: currentUser,
+        children: userName
+      }, "userCard-".concat(i)) :
+      /*#__PURE__*/
+      // NOTE: Disable link since user profile for mobile is not completed
+      // eslint-disable-next-line react/no-array-index-key
+      jsx(UniversalLink, {
+        href: "/config/users/".concat(p),
+        children: userName
+      }, "userLink-".concat(i));
+      newParts.push(part);
+    }
+    if (i % n === 0) newParts.push(p);
+    return newParts;
+  }, []);
+  return componentParts;
+};
+var transformUserDataFromResponse = function transformUserDataFromResponse(res) {
+  return res.data.map(function (item) {
+    return {
+      id: item.id,
+      display: "".concat(item.first_name, " ").concat(item.last_name),
+      photo: item.profile_photo,
+      title: item.title
+    };
+  });
+};
+var handleFetchUsers = /*#__PURE__*/function () {
+  var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(search, callback, companyId) {
+    var res, usersData;
+    return _regeneratorRuntime.wrap(function _callee$(_context) {
+      while (1) {
+        switch (_context.prev = _context.next) {
+          case 0:
+            if (search) {
+              _context.next = 2;
+              break;
+            }
+            return _context.abrupt("return", callback([]));
+          case 2:
+            _context.prev = 2;
+            _context.next = 5;
+            return getUserAutocomplete(null, search, companyId);
+          case 5:
+            res = _context.sent;
+            _context.next = 11;
+            break;
+          case 8:
+            _context.prev = 8;
+            _context.t0 = _context["catch"](2);
+            console.error(_context.t0);
+          case 11:
+            if (!(!res || res.data.length === 0)) {
+              _context.next = 13;
+              break;
+            }
+            return _context.abrupt("return", callback([]));
+          case 13:
+            usersData = transformUserDataFromResponse(res);
+            return _context.abrupt("return", callback(usersData));
+          case 15:
+          case "end":
+            return _context.stop();
+        }
+      }
+    }, _callee, null, [[2, 8]]);
+  }));
+  return function handleFetchUsers(_x, _x2, _x3) {
+    return _ref.apply(this, arguments);
+  };
+}();
+var isSuggestionsListOpened = function isSuggestionsListOpened() {
+  var elements = document.getElementsByClassName(styles.mention__suggestions__list);
+  return elements.length > 0;
+};
+
+export { formatMentionText, handleFetchUsers, isSuggestionsListOpened };
+//# sourceMappingURL=index.js.map

package/components/UserMention/utils/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../../src/components/UserMention/utils/index.js"],"sourcesContent":["import { UniversalLink } from '../../DevCenter/DevCenterRouterContext';\nimport { USER_MARKUP, PLACEHOLDERS } from '../constants';\n\nimport styles from '../style.css';\n\nimport UserCardPopover from '~/components/UserCardPopover';\nimport { getUserAutocomplete } from '~/clients/jsonApi';\n\nconst escapeString = str => str.replace(/[-[\\]{}()*+?.,\\\\^$|#\\s]/g, '\\\\$&');\n\nconst markupToRegex = markup => {\n  const escapedMarkup = escapeString(markup);\n  const charAfterDisplay =\n    markup[markup.indexOf(PLACEHOLDERS.display) + PLACEHOLDERS.display.length];\n  const charAfterId = markup[markup.indexOf(PLACEHOLDERS.display) + PLACEHOLDERS.display.length];\n  return new RegExp(\n    escapedMarkup\n      .replace(PLACEHOLDERS.display, `([^${escapeString(charAfterDisplay || '')}]+?)`)\n      .replace(PLACEHOLDERS.id, `([^${escapeString(charAfterId || '')}]+?)`),\n    'g'\n  );\n};\n\nexport const formatMentionText = (\n  text,\n  mentionedUsers,\n  isNativeView,\n  color = '#039be5',\n  currentUser\n) => {\n  if (!text) return text;\n\n  const regexp = markupToRegex(USER_MARKUP);\n  const parts = text.split(regexp);\n\n  // NOTE: Because we have 2 groups in our regexp\n  // every 2nd element will be the user id\n  // every 3rd element will be the user name\n\n  const n = 3; // NOTE: Match/User ID/User name\n  const componentParts = parts.reduce((acc, p, i) => {\n    const newParts = acc;\n\n    if ((i % n) - 1 === 0) {\n      const userName = `@${parts[i + 1]}`;\n      const user =\n        mentionedUsers &&\n        mentionedUsers.length &&\n        mentionedUsers.find(item => item.id === Number(p));\n\n      const part =\n        user && !isNativeView ? (\n          <UserCardPopover\n            user={user}\n            wrapperStyle={{ display: 'inline-block', color }}\n            // eslint-disable-next-line react/no-array-index-key\n            key={`userCard-${i}`}\n            currentUser={currentUser}\n          >\n            {userName}\n          </UserCardPopover>\n        ) : (\n          // NOTE: Disable link since user profile for mobile is not completed\n          // eslint-disable-next-line react/no-array-index-key\n          <UniversalLink href={`/config/users/${p}`} key={`userLink-${i}`}>\n            {userName}\n          </UniversalLink>\n        );\n\n      newParts.push(part);\n    }\n\n    if (i % n === 0) newParts.push(p);\n\n    return newParts;\n  }, []);\n\n  return componentParts;\n};\n\nconst transformUserDataFromResponse = res =>\n  res.data.map(item => ({\n    id: item.id,\n    display: `${item.first_name} ${item.last_name}`,\n    photo: item.profile_photo,\n    title: item.title,\n  }));\n\nexport const handleFetchUsers = async (search, callback, companyId) => {\n  if (!search) return callback([]);\n\n  let res;\n  try {\n    res = await getUserAutocomplete(null, search, companyId);\n  } catch (e) {\n    console.error(e);\n  }\n\n  if (!res || res.data.length === 0) return callback([]);\n\n  const usersData = transformUserDataFromResponse(res);\n\n  return callback(usersData);\n};\n\nexport const isSuggestionsListOpened = () => {\n  const elements = document.getElementsByClassName(styles.mention__suggestions__list);\n\n  return elements.length > 0;\n};\n"],"names":["escapeString","str","replace","markupToRegex","markup","escapedMarkup","charAfterDisplay","indexOf","PLACEHOLDERS","display","length","charAfterId","RegExp","id","formatMentionText","text","mentionedUsers","isNativeView","color","currentUser","regexp","USER_MARKUP","parts","split","n","componentParts","reduce","acc","p","i","newParts","userName","user","find","item","Number","part","_jsx","push","transformUserDataFromResponse","res","data","map","first_name","last_name","photo","profile_photo","title","handleFetchUsers","search","callback","companyId","getUserAutocomplete","console","error","usersData","isSuggestionsListOpened","elements","document","getElementsByClassName","styles","mention__suggestions__list"],"mappings":"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"}

package/components/VirtualizedTable/CustomizeColumnsDialog.js

@@ -1 +1,79 @@
-import e from"@babel/runtime/helpers/defineProperty";import r from"@babel/runtime/helpers/slicedToArray";import{useState as o,useEffect as t}from"react";import n from"prop-types";import{Dialog as i,DialogTitle as c,DialogContent as l,DialogActions as a,Button as s}from"@material-ui/core";import p from"./DraggableList.js";import{jsxs as u,jsx as f}from"react/jsx-runtime";function m(e,r){var o=Object.keys(e);if(Object.getOwnPropertySymbols){var t=Object.getOwnPropertySymbols(e);r&&(t=t.filter((function(r){return Object.getOwnPropertyDescriptor(e,r).enumerable}))),o.push.apply(o,t)}return o}function d(r){for(var o=1;o<arguments.length;o++){var t=null!=arguments[o]?arguments[o]:{};o%2?m(Object(t),!0).forEach((function(o){e(r,o,t[o])})):Object.getOwnPropertyDescriptors?Object.defineProperties(r,Object.getOwnPropertyDescriptors(t)):m(Object(t)).forEach((function(e){Object.defineProperty(r,e,Object.getOwnPropertyDescriptor(t,e))}))}return r}function h(e){var n=e.open,m=e.columns,h=e.handleCloseWithOK,b=e.handleCloseWithCancel,y=o(m),O=r(y,2),j=O[0],C=O[1];t((function(){C(m)}),[m]);return u(i,{disableBackdropClick:!0,disableEscapeKeyDown:!0,fullWidth:!0,maxWidth:"xs",open:n,children:[f(c,{children:"Customize Columns"}),f(l,{children:f(p,{items:j,onSort:function(e){C(e)},onClick:function(e){var r=j.map((function(r){return r.key===e.key?d(d({},r),{},{show:!!r.disabled||!r.show}):r}));C(r)}})}),u(a,{children:[f(s,{autoFocus:!0,onClick:function(){C(m),b()},color:"primary",children:"Cancel"}),f(s,{onClick:function(){h(j)},color:"primary",variant:"contained",children:"Ok"})]})]})}h.propTypes={open:n.bool.isRequired,handleCloseWithOK:n.func.isRequired,handleCloseWithCancel:n.func.isRequired,columns:n.array.isRequired};export{h as default};
+import _defineProperty from '@babel/runtime/helpers/defineProperty';
+import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
+import { useState, useEffect } from 'react';
+import PropTypes from 'prop-types';
+import { Dialog, DialogTitle, DialogContent, DialogActions, Button } from '@material-ui/core';
+import DraggableList from './DraggableList.js';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function CustomizeColumnsDialog(_ref) {
+  var open = _ref.open,
+    columns = _ref.columns,
+    handleCloseWithOK = _ref.handleCloseWithOK,
+    handleCloseWithCancel = _ref.handleCloseWithCancel;
+  var _useState = useState(columns),
+    _useState2 = _slicedToArray(_useState, 2),
+    draggableItems = _useState2[0],
+    setDraggableItems = _useState2[1];
+  useEffect(function () {
+    setDraggableItems(columns);
+  }, [columns]);
+  var handleClick = function handleClick(currentItem) {
+    var updatedItems = draggableItems.map(function (item) {
+      return item.key === currentItem.key ? _objectSpread(_objectSpread({}, item), {}, {
+        show: item.disabled ? true : !item.show
+      }) : item;
+    });
+    setDraggableItems(updatedItems);
+  };
+  var handleSort = function handleSort(newItems) {
+    setDraggableItems(newItems);
+  };
+  var handleCancel = function handleCancel() {
+    setDraggableItems(columns);
+    handleCloseWithCancel();
+  };
+  var handleOK = function handleOK() {
+    handleCloseWithOK(draggableItems);
+  };
+  return /*#__PURE__*/jsxs(Dialog, {
+    disableBackdropClick: true,
+    disableEscapeKeyDown: true,
+    fullWidth: true,
+    maxWidth: "xs",
+    open: open,
+    children: [/*#__PURE__*/jsx(DialogTitle, {
+      children: "Customize Columns"
+    }), /*#__PURE__*/jsx(DialogContent, {
+      children: /*#__PURE__*/jsx(DraggableList, {
+        items: draggableItems,
+        onSort: handleSort,
+        onClick: handleClick
+      })
+    }), /*#__PURE__*/jsxs(DialogActions, {
+      children: [/*#__PURE__*/jsx(Button, {
+        autoFocus: true,
+        onClick: handleCancel,
+        color: "primary",
+        children: "Cancel"
+      }), /*#__PURE__*/jsx(Button, {
+        onClick: handleOK,
+        color: "primary",
+        variant: "contained",
+        children: "Ok"
+      })]
+    })]
+  });
+}
+CustomizeColumnsDialog.propTypes = {
+  open: PropTypes.bool.isRequired,
+  handleCloseWithOK: PropTypes.func.isRequired,
+  handleCloseWithCancel: PropTypes.func.isRequired,
+  // eslint-disable-next-line react/forbid-prop-types
+  columns: PropTypes.array.isRequired
+};
+
+export { CustomizeColumnsDialog as default };
+//# sourceMappingURL=CustomizeColumnsDialog.js.map

package/components/VirtualizedTable/CustomizeColumnsDialog.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CustomizeColumnsDialog.js","sources":["../../../src/components/VirtualizedTable/CustomizeColumnsDialog.js"],"sourcesContent":["import { useState, useEffect } from 'react';\nimport PropTypes from 'prop-types';\nimport { Button, Dialog, DialogTitle, DialogContent, DialogActions } from '@material-ui/core';\n\nimport DraggableList from './DraggableList';\n\nfunction CustomizeColumnsDialog({ open, columns, handleCloseWithOK, handleCloseWithCancel }) {\n  const [draggableItems, setDraggableItems] = useState(columns);\n\n  useEffect(() => {\n    setDraggableItems(columns);\n  }, [columns]);\n\n  const handleClick = currentItem => {\n    const updatedItems = draggableItems.map(item =>\n      item.key === currentItem.key\n        ? {\n            ...item,\n            show: item.disabled ? true : !item.show,\n          }\n        : item\n    );\n    setDraggableItems(updatedItems);\n  };\n\n  const handleSort = newItems => {\n    setDraggableItems(newItems);\n  };\n\n  const handleCancel = () => {\n    setDraggableItems(columns);\n    handleCloseWithCancel();\n  };\n\n  const handleOK = () => {\n    handleCloseWithOK(draggableItems);\n  };\n\n  return (\n    <Dialog disableBackdropClick disableEscapeKeyDown fullWidth maxWidth=\"xs\" open={open}>\n      <DialogTitle>Customize Columns</DialogTitle>\n      <DialogContent>\n        <DraggableList items={draggableItems} onSort={handleSort} onClick={handleClick} />\n      </DialogContent>\n      <DialogActions>\n        <Button autoFocus onClick={handleCancel} color=\"primary\">\n          Cancel\n        </Button>\n        <Button onClick={handleOK} color=\"primary\" variant=\"contained\">\n          Ok\n        </Button>\n      </DialogActions>\n    </Dialog>\n  );\n}\n\nCustomizeColumnsDialog.propTypes = {\n  open: PropTypes.bool.isRequired,\n  handleCloseWithOK: PropTypes.func.isRequired,\n  handleCloseWithCancel: PropTypes.func.isRequired,\n  // eslint-disable-next-line react/forbid-prop-types\n  columns: PropTypes.array.isRequired,\n};\n\nexport default CustomizeColumnsDialog;\n"],"names":["CustomizeColumnsDialog","open","columns","handleCloseWithOK","handleCloseWithCancel","useState","draggableItems","setDraggableItems","useEffect","handleClick","currentItem","updatedItems","map","item","key","show","disabled","handleSort","newItems","handleCancel","handleOK","_jsxs","_jsx","propTypes","PropTypes","bool","isRequired","func","array"],"mappings":"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"}

package/components/VirtualizedTable/DraggableList.js

@@ -1 +1,97 @@
-import e from"prop-types";import{SortableHandle as r,SortableElement as i,SortableContainer as a,arrayMove as t}from"react-sortable-hoc";import{makeStyles as o,Checkbox as n,Typography as l}from"@material-ui/core";import d from"@material-ui/icons/DragIndicator";import{jsx as s,jsxs as c}from"react/jsx-runtime";var m=o({draggableList:{borderNottom:"1px solid #e0e0e0",listStyle:"none",padding:"0"},draggableListItem:{cursor:"pointer",borderTop:"1px solid #e0e0e0",lineHeight:"1rem",zIndex:1500,display:"flex",alignItems:"center","&:hover $draggableListItemDraghandle":{opacity:1}},draggableListItemCheckBox:{padding:"8px"},draggableListItemDraghandle:{color:"#777",opacity:0}}),g=r((function(){return s(d,{className:"c-draggable-list__item_draghandle",fontSize:"small"})})),u=i((function(e){var r=e.item,i=e.onClick,a=m();return c("li",{className:a.draggableListItem,children:[s(g,{}),s(n,{className:a.draggableListItemCheckBox,color:"primary",checked:r.show,onClick:function(){return i(r)}}),s(l,{variant:"body2",children:r.customLabel||r.label||r})]})})),p=a((function(e){var r=e.items,i=e.onClick,a=m();return s("ul",{className:a.draggableList,children:r.map((function(e,r){return s(u,{index:r,item:e,onClick:i,disabled:e.disabled},e.label)}))})}));function b(e){var r=e.items,i=e.onSort,a=e.onClick;return s(p,{useDragHandle:!0,items:r,onSortEnd:function(e){var a=e.oldIndex,o=e.newIndex,n=t(r,a,o);i(n)},onClick:a})}b.propTypes={items:e.arrayOf(e.shape({})).isRequired,onSort:e.func.isRequired,onClick:e.func.isRequired};export{b as default};
+import PropTypes from 'prop-types';
+import { SortableHandle, SortableElement, SortableContainer, arrayMove } from 'react-sortable-hoc';
+import { makeStyles, Checkbox, Typography } from '@material-ui/core';
+import DragIndicatorIcon from '@material-ui/icons/DragIndicator';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+var useStyles = makeStyles({
+  draggableList: {
+    borderNottom: '1px solid #e0e0e0',
+    listStyle: 'none',
+    padding: '0'
+  },
+  draggableListItem: {
+    cursor: 'pointer',
+    borderTop: '1px solid #e0e0e0',
+    lineHeight: '1rem',
+    zIndex: 1500,
+    display: 'flex',
+    alignItems: 'center',
+    '&:hover $draggableListItemDraghandle': {
+      opacity: 1
+    }
+  },
+  draggableListItemCheckBox: {
+    padding: '8px'
+  },
+  draggableListItemDraghandle: {
+    color: '#777',
+    opacity: 0
+  }
+});
+var DragHandle = SortableHandle(function () {
+  return /*#__PURE__*/jsx(DragIndicatorIcon, {
+    className: "c-draggable-list__item_draghandle",
+    fontSize: "small"
+  });
+});
+var SortableItem = SortableElement(function (_ref) {
+  var item = _ref.item,
+    _onClick = _ref.onClick;
+  var classes = useStyles();
+  return /*#__PURE__*/jsxs("li", {
+    className: classes.draggableListItem,
+    children: [/*#__PURE__*/jsx(DragHandle, {}), /*#__PURE__*/jsx(Checkbox, {
+      className: classes.draggableListItemCheckBox,
+      color: "primary",
+      checked: item.show,
+      onClick: function onClick() {
+        return _onClick(item);
+      }
+    }), /*#__PURE__*/jsx(Typography, {
+      variant: "body2",
+      children: item.customLabel || item.label || item
+    })]
+  });
+});
+var SortableList = SortableContainer(function (_ref2) {
+  var items = _ref2.items,
+    onClick = _ref2.onClick;
+  var classes = useStyles();
+  return /*#__PURE__*/jsx("ul", {
+    className: classes.draggableList,
+    children: items.map(function (item, index) {
+      return /*#__PURE__*/jsx(SortableItem, {
+        index: index,
+        item: item,
+        onClick: onClick,
+        disabled: item.disabled
+      }, item.label);
+    })
+  });
+});
+function DraggableList(_ref3) {
+  var items = _ref3.items,
+    onSort = _ref3.onSort,
+    onClick = _ref3.onClick;
+  var onSortEnd = function onSortEnd(_ref4) {
+    var oldIndex = _ref4.oldIndex,
+      newIndex = _ref4.newIndex;
+    var newItems = arrayMove(items, oldIndex, newIndex);
+    onSort(newItems);
+  };
+  return /*#__PURE__*/jsx(SortableList, {
+    useDragHandle: true,
+    items: items,
+    onSortEnd: onSortEnd,
+    onClick: onClick
+  });
+}
+DraggableList.propTypes = {
+  items: PropTypes.arrayOf(PropTypes.shape({})).isRequired,
+  onSort: PropTypes.func.isRequired,
+  onClick: PropTypes.func.isRequired
+};
+
+export { DraggableList as default };
+//# sourceMappingURL=DraggableList.js.map

package/components/VirtualizedTable/DraggableList.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DraggableList.js","sources":["../../../src/components/VirtualizedTable/DraggableList.js"],"sourcesContent":["import PropTypes from 'prop-types';\nimport { SortableContainer, SortableElement, SortableHandle, arrayMove } from 'react-sortable-hoc';\nimport { Checkbox, Typography, makeStyles } from '@material-ui/core';\nimport DragIndicatorIcon from '@material-ui/icons/DragIndicator';\n\nconst useStyles = makeStyles({\n  draggableList: {\n    borderNottom: '1px solid #e0e0e0',\n    listStyle: 'none',\n    padding: '0',\n  },\n  draggableListItem: {\n    cursor: 'pointer',\n    borderTop: '1px solid #e0e0e0',\n    lineHeight: '1rem',\n    zIndex: 1500,\n    display: 'flex',\n    alignItems: 'center',\n    '&:hover $draggableListItemDraghandle': {\n      opacity: 1,\n    },\n  },\n  draggableListItemCheckBox: {\n    padding: '8px',\n  },\n  draggableListItemDraghandle: {\n    color: '#777',\n    opacity: 0,\n  },\n});\n\nconst DragHandle = SortableHandle(() => (\n  <DragIndicatorIcon className=\"c-draggable-list__item_draghandle\" fontSize=\"small\" />\n));\n\nconst SortableItem = SortableElement(({ item, onClick }) => {\n  const classes = useStyles();\n  return (\n    <li className={classes.draggableListItem}>\n      <DragHandle />\n      <Checkbox\n        className={classes.draggableListItemCheckBox}\n        color=\"primary\"\n        checked={item.show}\n        onClick={() => onClick(item)}\n      />\n      <Typography variant=\"body2\">{item.customLabel || item.label || item}</Typography>\n    </li>\n  );\n});\n\nconst SortableList = SortableContainer(({ items, onClick }) => {\n  const classes = useStyles();\n  return (\n    <ul className={classes.draggableList}>\n      {items.map((item, index) => (\n        <SortableItem\n          key={item.label}\n          index={index}\n          item={item}\n          onClick={onClick}\n          disabled={item.disabled}\n        />\n      ))}\n    </ul>\n  );\n});\n\nfunction DraggableList({ items, onSort, onClick }) {\n  const onSortEnd = ({ oldIndex, newIndex }) => {\n    const newItems = arrayMove(items, oldIndex, newIndex);\n    onSort(newItems);\n  };\n\n  return <SortableList useDragHandle items={items} onSortEnd={onSortEnd} onClick={onClick} />;\n}\n\nDraggableList.propTypes = {\n  items: PropTypes.arrayOf(PropTypes.shape({})).isRequired,\n  onSort: PropTypes.func.isRequired,\n  onClick: PropTypes.func.isRequired,\n};\n\nexport default DraggableList;\n"],"names":["useStyles","makeStyles","draggableList","borderNottom","listStyle","padding","draggableListItem","cursor","borderTop","lineHeight","zIndex","display","alignItems","opacity","draggableListItemCheckBox","draggableListItemDraghandle","color","DragHandle","SortableHandle","_jsx","SortableItem","SortableElement","item","onClick","classes","_jsxs","show","customLabel","label","SortableList","SortableContainer","items","map","index","disabled","DraggableList","onSort","onSortEnd","oldIndex","newIndex","newItems","arrayMove","propTypes","PropTypes","arrayOf","shape","isRequired","func"],"mappings":"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"}