@corva/ui 3.1.0-rc.5 → 3.1.0

package/components/UserCardPopover.js

@@ -1,76 +1 @@
-import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import { useState } from 'react';
-import PropTypes from 'prop-types';
-import { withStyles, Popover } from '@material-ui/core';
-import UserCard from './UserCard/index.js';
-import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
-
-var muiStyles = {
-  popoverPaper: {
-    background: 'transparent'
-  },
-  childrenWrapper: {
-    cursor: 'pointer'
-  }
-};
-function UserCardPopover(props) {
-  var _useState = useState(null),
-    _useState2 = _slicedToArray(_useState, 2),
-    anchorEl = _useState2[0],
-    setAnchorEl = _useState2[1];
-  var open = Boolean(anchorEl);
-  var handlePopoverOpen = function handlePopoverOpen(event) {
-    setAnchorEl(event.currentTarget);
-  };
-  var handlePopoverClose = function handlePopoverClose() {
-    setAnchorEl(null);
-  };
-  return /*#__PURE__*/jsxs(Fragment, {
-    children: [/*#__PURE__*/jsx("div", {
-      "aria-owns": open ? 'user-popover' : undefined,
-      "aria-haspopup": "true",
-      onClick: handlePopoverOpen,
-      className: props.classes.childrenWrapper,
-      style: props.wrapperStyle,
-      children: props.children
-    }), /*#__PURE__*/jsx(Popover, {
-      id: "user-popover",
-      open: open,
-      classes: {
-        paper: props.classes.popoverPaper
-      },
-      anchorEl: anchorEl,
-      anchorOrigin: {
-        vertical: 'bottom',
-        horizontal: 'left'
-      },
-      transformOrigin: {
-        vertical: 'top',
-        horizontal: 'left'
-      },
-      onClose: handlePopoverClose,
-      children: /*#__PURE__*/jsx(UserCard, {
-        user: props.user,
-        currentUser: props.currentUser
-      })
-    })]
-  });
-}
-UserCardPopover.propTypes = {
-  wrapperStyle: PropTypes.shape({}),
-  user: PropTypes.shape({}).isRequired,
-  children: PropTypes.node.isRequired,
-  currentUser: PropTypes.shape({}),
-  classes: PropTypes.shape({
-    popoverPaper: PropTypes.string.isRequired,
-    childrenWrapper: PropTypes.string.isRequired
-  }).isRequired
-};
-UserCardPopover.defaultProps = {
-  wrapperStyle: {},
-  currentUser: {}
-};
-var UserCardPopover$1 = withStyles(muiStyles)(UserCardPopover);
-
-export { UserCardPopover$1 as default };
-//# sourceMappingURL=UserCardPopover.js.map
+import r from"@babel/runtime/helpers/slicedToArray";import{useState as e}from"react";import o from"prop-types";import{withStyles as p,Popover as i}from"@material-ui/core";import s from"./UserCard/index.js";import{jsxs as a,Fragment as t,jsx as n}from"react/jsx-runtime";function l(o){var p=e(null),l=r(p,2),c=l[0],u=l[1],d=Boolean(c);return a(t,{children:[n("div",{"aria-owns":d?"user-popover":void 0,"aria-haspopup":"true",onClick:function(r){u(r.currentTarget)},className:o.classes.childrenWrapper,style:o.wrapperStyle,children:o.children}),n(i,{id:"user-popover",open:d,classes:{paper:o.classes.popoverPaper},anchorEl:c,anchorOrigin:{vertical:"bottom",horizontal:"left"},transformOrigin:{vertical:"top",horizontal:"left"},onClose:function(){u(null)},children:n(s,{user:o.user,currentUser:o.currentUser})})]})}l.propTypes={wrapperStyle:o.shape({}),user:o.shape({}).isRequired,children:o.node.isRequired,currentUser:o.shape({}),classes:o.shape({popoverPaper:o.string.isRequired,childrenWrapper:o.string.isRequired}).isRequired},l.defaultProps={wrapperStyle:{},currentUser:{}};var c=p({popoverPaper:{background:"transparent"},childrenWrapper:{cursor:"pointer"}})(l);export{c as default};

package/components/UserMention/constants.js

@@ -1,8 +1 @@
-var USER_MARKUP = '@[user:__id__|__display__]';
-var PLACEHOLDERS = {
-  id: '__id__',
-  display: '__display__'
-};
-
-export { PLACEHOLDERS, USER_MARKUP };
-//# sourceMappingURL=constants.js.map
+var _="@[user:__id__|__display__]",d={id:"__id__",display:"__display__"};export{d as PLACEHOLDERS,_ as USER_MARKUP};

package/components/UserMention/index.js

@@ -1,230 +1 @@
-import _defineProperty from '@babel/runtime/helpers/defineProperty';
-import { useEffect, useCallback } from 'react';
-import { debounce } from 'lodash';
-import PropTypes from 'prop-types';
-import { withStyles } from '@material-ui/core/styles';
-import { MentionsInput, Mention } from 'react-mentions';
-import blue from '@material-ui/core/colors/blue';
-import { handleFetchUsers } from './utils/index.js';
-import { USER_MARKUP } from './constants.js';
-import styles from './style.css.js';
-import { AvatarComponent } from '../Avatar/index.js';
-import '../../permissions/PermissionsContext.js';
-import { PERMISSIONS } from '../../permissions/constants/index.js';
-import '@babel/runtime/helpers/slicedToArray';
-import { withPermissionsHOC } from '../../permissions/withPermissionsHOC.js';
-import '@babel/runtime/helpers/asyncToGenerator';
-import '@babel/runtime/regenerator';
-import 'query-string';
-import '../../clients/api/apiCore.js';
-import '../../clients/constants.js';
-import '../../permissions/ProvidePermissions.js';
-import { jsx, jsxs } 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; }
-var PAGE_NAME = 'userMention';
-var muiStyles = {
-  avatar: {
-    height: 45,
-    width: 45,
-    border: '1.5px solid #fff'
-  }
-};
-var mentionLightStyle = {
-  backgroundColor: blue[100]
-};
-var mentionDarkStyle = {
-  color: '#00bcd4'
-};
-
-// NOTE: IMPORTANT! 'input', 'mention' and 'highliter' should always have same font/latter/height/line etc values
-var inputStyles = {
-  suggestions: {
-    item: {
-      '&focused': {
-        backgroundColor: 'rgba(0, 0, 0, 0.08)'
-      }
-    }
-  }
-};
-var darkThemeInputStyles = _objectSpread(_objectSpread({}, inputStyles), {}, {
-  input: {
-    color: '#fff',
-    caretColor: '#fff',
-    zIndex: 1
-  },
-  highlighter: {
-    color: '#fff'
-  }
-});
-var lightThemeInputStyles = _objectSpread(_objectSpread({}, inputStyles), {}, {
-  input: {
-    color: '#000'
-  }
-});
-var _renderSuggestion = function renderSuggestion(entry, classes) {
-  return /*#__PURE__*/jsxs("div", {
-    className: styles.mention__suggestion,
-    children: [/*#__PURE__*/jsx(AvatarComponent, {
-      alt: entry.display,
-      displayName: entry.display,
-      className: classes.avatar,
-      imgSrc: entry.photo
-    }), /*#__PURE__*/jsxs("div", {
-      className: styles.mention__suggestion__info,
-      children: [/*#__PURE__*/jsx("span", {
-        "data-testid": "".concat(PAGE_NAME, "_name_").concat(entry.display),
-        className: styles.mention__suggestion__info__name,
-        children: entry.display
-      }), entry.title && /*#__PURE__*/jsx("span", {
-        className: styles.mention__suggestion__info__group,
-        children: entry.title
-      })]
-    })]
-  });
-};
-var UserMention = function UserMention(_ref) {
-  var onChange = _ref.onChange,
-    singleLine = _ref.singleLine,
-    suggestionsPortalHost = _ref.suggestionsPortalHost,
-    value = _ref.value,
-    inputRef = _ref.inputRef,
-    classes = _ref.classes,
-    style = _ref.style,
-    withLightTheme = _ref.withLightTheme,
-    placeholder = _ref.placeholder,
-    onMount = _ref.onMount,
-    onKeyDown = _ref.onKeyDown,
-    onKeyUp = _ref.onKeyUp,
-    onFocus = _ref.onFocus,
-    onBlur = _ref.onBlur,
-    autoFocus = _ref.autoFocus,
-    disabled = _ref.disabled,
-    companyId = _ref.companyId,
-    currentUser = _ref.currentUser,
-    isCompanySelectVisible = _ref.isCompanySelectVisible,
-    mentionProps = _ref.mentionProps,
-    allowSuggestionsAboveCursor = _ref.allowSuggestionsAboveCursor;
-  useEffect(onMount, []);
-  var fetchUsers = function fetchUsers(search, callback) {
-    var companyIds = isCompanySelectVisible && currentUser && currentUser.company_id !== companyId ? [currentUser.company_id, companyId] : null;
-    handleFetchUsers(search, callback, companyIds);
-  };
-  var debouncedUsersFetch = useCallback(debounce(fetchUsers, 400), [companyId]);
-  var onInputChange = function onInputChange(event, newValue) {
-    onChange(newValue);
-  };
-  var themedStyle = Object.assign(withLightTheme ? lightThemeInputStyles : darkThemeInputStyles, style);
-  return /*#__PURE__*/jsx(MentionsInput, {
-    value: value,
-    onChange: onInputChange,
-    singleLine: singleLine,
-    allowSpaceInQuery: true,
-    classNames: styles,
-    placeholder: placeholder,
-    suggestionsPortalHost: suggestionsPortalHost,
-    inputRef: inputRef,
-    style: themedStyle,
-    onKeyDown: onKeyDown,
-    onKeyUp: onKeyUp,
-    autoFocus: autoFocus,
-    onFocus: onFocus,
-    onBlur: onBlur,
-    disabled: disabled,
-    allowSuggestionsAboveCursor: allowSuggestionsAboveCursor,
-    children: /*#__PURE__*/jsx(Mention, _objectSpread({
-      markup: USER_MARKUP,
-      renderSuggestion: function renderSuggestion(entry) {
-        return _renderSuggestion(entry, classes);
-      },
-      trigger: "@",
-      data: debouncedUsersFetch,
-      displayTransform: function displayTransform(id, display) {
-        return "@".concat(display);
-      },
-      style: withLightTheme ? mentionLightStyle : mentionDarkStyle,
-      appendSpaceOnAdd: true
-    }, mentionProps))
-  });
-};
-UserMention.propTypes = {
-  onChange: PropTypes.func,
-  singleLine: PropTypes.bool,
-  suggestionsPortalHost: PropTypes.shape({
-    current: PropTypes.instanceOf(Element)
-  }),
-  value: PropTypes.string,
-  inputRef: PropTypes.shape({}),
-  classes: PropTypes.shape({
-    avatar: PropTypes.string.isRequired
-  }).isRequired,
-  withLightTheme: PropTypes.bool,
-  placeholder: PropTypes.string,
-  style: PropTypes.shape({}),
-  mentionProps: PropTypes.shape({}),
-  onMount: PropTypes.func,
-  onKeyDown: PropTypes.func,
-  onKeyUp: PropTypes.func,
-  onFocus: PropTypes.func,
-  onBlur: PropTypes.func,
-  autoFocus: PropTypes.bool,
-  disabled: PropTypes.bool,
-  currentUser: PropTypes.shape({
-    company_id: PropTypes.number.isRequired
-  }).isRequired,
-  companyId: PropTypes.number,
-  isCompanySelectVisible: PropTypes.bool.isRequired,
-  allowSuggestionsAboveCursor: PropTypes.bool
-};
-UserMention.defaultProps = {
-  onChange: function onChange() {
-    return undefined;
-  },
-  singleLine: false,
-  suggestionsPortalHost: null,
-  value: '',
-  inputRef: null,
-  withLightTheme: false,
-  placeholder: "Mention people using '@'",
-  style: {
-    suggestions: {
-      list: {
-        background: '#414141'
-      },
-      item: {
-        color: 'white',
-        height: 30,
-        '&focused': {
-          backgroundColor: 'rgba(255, 255, 255, 0.08)'
-        }
-      }
-    }
-  },
-  mentionProps: {},
-  onMount: function onMount() {
-    return undefined;
-  },
-  onKeyDown: function onKeyDown() {
-    return undefined;
-  },
-  onKeyUp: function onKeyUp() {
-    return undefined;
-  },
-  onFocus: function onFocus() {
-    return undefined;
-  },
-  onBlur: function onBlur() {
-    return undefined;
-  },
-  autoFocus: true,
-  disabled: false,
-  allowSuggestionsAboveCursor: false,
-  companyId: null
-};
-var UserMention$1 = withPermissionsHOC({
-  isCompanySelectVisible: PERMISSIONS.companySelectorView
-})(withStyles(muiStyles)(UserMention));
-
-export { UserMention$1 as default };
-//# sourceMappingURL=index.js.map
+import e from"@babel/runtime/helpers/defineProperty";import{useEffect as o,useCallback as n}from"react";import{debounce as r}from"lodash";import t from"prop-types";import{withStyles as s}from"@material-ui/core/styles";import{MentionsInput as i,Mention as a}from"react-mentions";import l from"@material-ui/core/colors/blue";import{handleFetchUsers as u}from"./utils/index.js";import{USER_MARKUP as c}from"./constants.js";import p from"./style.css.js";import{AvatarComponent as m}from"../Avatar/index.js";import"../../permissions/PermissionsContext.js";import{PERMISSIONS as f}from"../../permissions/constants/index.js";import"@babel/runtime/helpers/slicedToArray";import{withPermissionsHOC as g}from"../../permissions/withPermissionsHOC.js";import"@babel/runtime/helpers/asyncToGenerator";import"@babel/runtime/regenerator";import"../../clients/jsonApi/index.js";import"../../permissions/ProvidePermissions.js";import{jsx as d,jsxs as b}from"react/jsx-runtime";function y(e,o){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);o&&(r=r.filter((function(o){return Object.getOwnPropertyDescriptor(e,o).enumerable}))),n.push.apply(n,r)}return n}function h(o){for(var n=1;n<arguments.length;n++){var r=null!=arguments[n]?arguments[n]:{};n%2?y(Object(r),!0).forEach((function(n){e(o,n,r[n])})):Object.getOwnPropertyDescriptors?Object.defineProperties(o,Object.getOwnPropertyDescriptors(r)):y(Object(r)).forEach((function(e){Object.defineProperty(o,e,Object.getOwnPropertyDescriptor(r,e))}))}return o}var v={backgroundColor:l[100]},j={color:"#00bcd4"},_={suggestions:{item:{"&focused":{backgroundColor:"rgba(0, 0, 0, 0.08)"}}}},w=h(h({},_),{},{input:{color:"#fff",caretColor:"#fff",zIndex:1},highlighter:{color:"#fff"}}),O=h(h({},_),{},{input:{color:"#000"}}),P=function(e){var t=e.onChange,s=e.singleLine,l=e.suggestionsPortalHost,f=e.value,g=e.inputRef,y=e.classes,_=e.style,P=e.withLightTheme,C=e.placeholder,S=e.onMount,x=e.onKeyDown,R=e.onKeyUp,A=e.onFocus,D=e.onBlur,F=e.autoFocus,K=e.disabled,L=e.companyId,N=e.currentUser,T=e.isCompanySelectVisible,k=e.mentionProps,U=e.allowSuggestionsAboveCursor;o(S,[]);var q=n(r((function(e,o){var n=T&&N&&N.company_id!==L?[N.company_id,L]:null;u(e,o,n)}),400),[L]),H=Object.assign(P?O:w,_);return d(i,{value:f,onChange:function(e,o){t(o)},singleLine:s,allowSpaceInQuery:!0,classNames:p,placeholder:C,suggestionsPortalHost:l,inputRef:g,style:H,onKeyDown:x,onKeyUp:R,autoFocus:F,onFocus:A,onBlur:D,disabled:K,allowSuggestionsAboveCursor:U,children:d(a,h({markup:c,renderSuggestion:function(e){return function(e,o){return b("div",{className:p.mention__suggestion,children:[d(m,{alt:e.display,displayName:e.display,className:o.avatar,imgSrc:e.photo}),b("div",{className:p.mention__suggestion__info,children:[d("span",{"data-testid":"".concat("userMention","_name_").concat(e.display),className:p.mention__suggestion__info__name,children:e.display}),e.title&&d("span",{className:p.mention__suggestion__info__group,children:e.title})]})]})}(e,y)},trigger:"@",data:q,displayTransform:function(e,o){return"@".concat(o)},style:P?v:j,appendSpaceOnAdd:!0},k))})};P.propTypes={onChange:t.func,singleLine:t.bool,suggestionsPortalHost:t.shape({current:t.instanceOf(Element)}),value:t.string,inputRef:t.shape({}),classes:t.shape({avatar:t.string.isRequired}).isRequired,withLightTheme:t.bool,placeholder:t.string,style:t.shape({}),mentionProps:t.shape({}),onMount:t.func,onKeyDown:t.func,onKeyUp:t.func,onFocus:t.func,onBlur:t.func,autoFocus:t.bool,disabled:t.bool,currentUser:t.shape({company_id:t.number.isRequired}).isRequired,companyId:t.number,isCompanySelectVisible:t.bool.isRequired,allowSuggestionsAboveCursor:t.bool},P.defaultProps={onChange:function(){},singleLine:!1,suggestionsPortalHost:null,value:"",inputRef:null,withLightTheme:!1,placeholder:"Mention people using '@'",style:{suggestions:{list:{background:"#414141"},item:{color:"white",height:30,"&focused":{backgroundColor:"rgba(255, 255, 255, 0.08)"}}}},mentionProps:{},onMount:function(){},onKeyDown:function(){},onKeyUp:function(){},onFocus:function(){},onBlur:function(){},autoFocus:!0,disabled:!1,allowSuggestionsAboveCursor:!1,companyId:null};var C=g({isCompanySelectVisible:f.companySelectorView})(s({avatar:{height:45,width:45,border:"1.5px solid #fff"}})(P));export{C as default};

package/components/UserMention/style.css.js

@@ -1,8 +1 @@
-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
+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};

package/components/UserMention/utils/index.js

@@ -1,129 +1 @@
-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
+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};

package/components/VirtualizedTable/CustomizeColumnsDialog.js

@@ -1,79 +1 @@
-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
+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};

package/components/VirtualizedTable/DraggableList.js

@@ -1,97 +1 @@
-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
+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};