@corva/ui 0.34.0-rc.2 → 0.34.0-rc.3

package/components/UserCard/index.js

@@ -1 +1,181 @@
-import e from"prop-types";import{withStyles as t}from"@material-ui/core/styles";import r from"@material-ui/core/Card";import a from"@material-ui/core/CardActions";import i from"@material-ui/core/CardContent";import o from"@material-ui/core/CardMedia";import c from"@material-ui/core/Chip";import n from"@material-ui/core/Button";import s from"@material-ui/core/Typography";import l from"@material-ui/core/colors/blue";import m from"@material-ui/icons/Email";import d from"@material-ui/icons/Phone";import p from"./style.css.js";import"../DevCenter/DevCenterRouterContext/DevCenterRouterContext.js";import{UniversalLink as u}from"../DevCenter/DevCenterRouterContext/UniversalLink/UniversalLink.js";import"react";import"@babel/runtime/helpers/defineProperty";import"@babel/runtime/helpers/objectWithoutProperties";import"react-router";import{jsxs as h,jsx as f}from"react/jsx-runtime";var g="UserCardDialogPo";function b(e){var t=e.user,l=t.id,b=t.email,v=t.mobile,C=t.title,N=t.first_name,y=t.last_name,_=t.profile_photo,x=e.currentUser,B=e.classes;return h(r,{"data-testid":"".concat(g),className:B.card,children:[f(o,{"data-testid":"".concat(g,"_placeholder"),className:B.media,image:_||"https://cdn.corva.ai/app/images/user-placeholder.svg",title:"".concat(N," ").concat(y),children:Number(x.id)===Number(l)&&f("div",{className:p.cUserCardMediaBackdrop,children:f(u,{href:"/config/users/".concat(l),children:f(c,{"data-not-migrated-MuiChip":!0,"data-testid":"".concat(g,"_viewProfile"),className:p.cUserCardMediaBackdropToProfile,label:"View Profile"})})})}),h(i,{className:B.content,children:[f(s,{"data-testid":"".concat(g,"_name"),variant:"h5",className:B.userName,children:"".concat(N," ").concat(y)}),C&&f(s,{variant:"subtitle1",children:C}),f("br",{}),b&&f("a",{href:"mailto:".concat(b),target:"_top",children:h(s,{"data-testid":"".concat(g,"_email"),gutterBottom:!0,variant:"body1",className:B.contact,children:[f(m,{className:B.contactIcon}),b]})}),v&&f("a",{href:"tel:".concat(v),target:"_top",children:h(s,{"data-testid":"".concat(g,"_phone"),variant:"body1",className:B.contact,children:[f(d,{className:B.contactIcon}),v]})})]}),h(a,{className:B.actions,children:[b?f("a",{href:"mailto:".concat(b),target:"_top",children:f(n,{"data-testid":"".concat(g,"_emailButton"),className:B.actionButton,variant:"contained",color:"primary",children:"Email"})}):f(n,{disabled:!0,className:B.actionButton,variant:"contained",color:"primary",children:"Email"}),f(n,{"data-testid":"".concat(g,"_messageButton"),disabled:!0,className:B.actionButton,variant:"contained",color:"primary",children:"Message"})]})]})}b.propTypes={user:e.shape({id:e.number.isRequired,email:e.string,mobile:e.string,title:e.string,role:e.string,first_name:e.string.isRequired,last_name:e.string.isRequired,profile_photo:e.string}).isRequired,classes:e.shape({}).isRequired,currentUser:e.shape({id:e.oneOfType([e.number,e.string])})},b.defaultProps={currentUser:{}};var v=t((function(e){return{card:{width:352},media:{height:264,width:"100%"},content:{cursor:"auto",padding:"10px 28px 28px 28px"},userName:{fontWeight:"bold"},contact:{display:"flex",alignItems:"center",fontSize:12,color:l[900],cursor:"pointer"},contactIcon:{height:15,width:15,marginRight:10,color:e.palette.grey[300]},actions:{display:"flex",justifyContent:"space-between",padding:"0 28px 28px 28px"},actionButton:{width:139}}}))(b);export{v as default};
+import '@babel/runtime/helpers/defineProperty';
+import blue from '@material-ui/core/colors/blue';
+import { jsxs, jsx } from 'react/jsx-runtime';
+import 'react';
+import '@babel/runtime/helpers/objectWithoutProperties';
+import PropTypes from 'prop-types';
+import { withStyles } from '@material-ui/core/styles';
+import Card from '@material-ui/core/Card';
+import CardActions from '@material-ui/core/CardActions';
+import CardContent from '@material-ui/core/CardContent';
+import CardMedia from '@material-ui/core/CardMedia';
+import Chip from '@material-ui/core/Chip';
+import Button from '@material-ui/core/Button';
+import Typography from '@material-ui/core/Typography';
+import EmailIcon from '@material-ui/icons/Email';
+import PhoneIcon from '@material-ui/icons/Phone';
+import styles from './style.css.js';
+import '../DevCenter/DevCenterRouterContext/DevCenterRouterContext.js';
+import 'react-router';
+import { UniversalLink } from '../DevCenter/DevCenterRouterContext/UniversalLink/UniversalLink.js';
+
+var PAGE_NAME = 'UserCardDialogPo';
+
+var muiStyles = function muiStyles(theme) {
+  return {
+    card: {
+      width: 352
+    },
+    media: {
+      height: 264,
+      width: '100%'
+    },
+    content: {
+      cursor: 'auto',
+      padding: '10px 28px 28px 28px'
+    },
+    userName: {
+      fontWeight: 'bold'
+    },
+    contact: {
+      display: 'flex',
+      alignItems: 'center',
+      fontSize: 12,
+      color: blue[900],
+      cursor: 'pointer'
+    },
+    contactIcon: {
+      height: 15,
+      width: 15,
+      marginRight: 10,
+      color: theme.palette.grey[300]
+    },
+    actions: {
+      display: 'flex',
+      justifyContent: 'space-between',
+      padding: '0 28px 28px 28px'
+    },
+    actionButton: {
+      width: 139
+    }
+  };
+};
+
+function UserCard(_ref) {
+  var _ref$user = _ref.user,
+      id = _ref$user.id,
+      email = _ref$user.email,
+      mobile = _ref$user.mobile,
+      title = _ref$user.title,
+      firstName = _ref$user.first_name,
+      lastName = _ref$user.last_name,
+      profilePhoto = _ref$user.profile_photo,
+      currentUser = _ref.currentUser,
+      classes = _ref.classes;
+  return /*#__PURE__*/jsxs(Card, {
+    "data-testid": "".concat(PAGE_NAME),
+    className: classes.card,
+    children: [/*#__PURE__*/jsx(CardMedia, {
+      "data-testid": "".concat(PAGE_NAME, "_placeholder"),
+      className: classes.media,
+      image: profilePhoto || 'https://cdn.corva.ai/app/images/user-placeholder.svg',
+      title: "".concat(firstName, " ").concat(lastName),
+      children: Number(currentUser.id) === Number(id) && /*#__PURE__*/jsx("div", {
+        className: styles.cUserCardMediaBackdrop,
+        children: /*#__PURE__*/jsx(UniversalLink, {
+          href: "/config/users/".concat(id),
+          children: /*#__PURE__*/jsx(Chip, {
+            "data-not-migrated-MuiChip": true,
+            "data-testid": "".concat(PAGE_NAME, "_viewProfile"),
+            className: styles.cUserCardMediaBackdropToProfile,
+            label: "View Profile"
+          })
+        })
+      })
+    }), /*#__PURE__*/jsxs(CardContent, {
+      className: classes.content,
+      children: [/*#__PURE__*/jsx(Typography, {
+        "data-testid": "".concat(PAGE_NAME, "_name"),
+        variant: "h5",
+        className: classes.userName,
+        children: "".concat(firstName, " ").concat(lastName)
+      }), title && /*#__PURE__*/jsx(Typography, {
+        variant: "subtitle1",
+        children: title
+      }), /*#__PURE__*/jsx("br", {}), email && /*#__PURE__*/jsx("a", {
+        href: "mailto:".concat(email),
+        target: "_top",
+        children: /*#__PURE__*/jsxs(Typography, {
+          "data-testid": "".concat(PAGE_NAME, "_email"),
+          gutterBottom: true,
+          variant: "body1",
+          className: classes.contact,
+          children: [/*#__PURE__*/jsx(EmailIcon, {
+            className: classes.contactIcon
+          }), email]
+        })
+      }), mobile && /*#__PURE__*/jsx("a", {
+        href: "tel:".concat(mobile),
+        target: "_top",
+        children: /*#__PURE__*/jsxs(Typography, {
+          "data-testid": "".concat(PAGE_NAME, "_phone"),
+          variant: "body1",
+          className: classes.contact,
+          children: [/*#__PURE__*/jsx(PhoneIcon, {
+            className: classes.contactIcon
+          }), mobile]
+        })
+      })]
+    }), /*#__PURE__*/jsxs(CardActions, {
+      className: classes.actions,
+      children: [email ? /*#__PURE__*/jsx("a", {
+        href: "mailto:".concat(email),
+        target: "_top",
+        children: /*#__PURE__*/jsx(Button, {
+          "data-testid": "".concat(PAGE_NAME, "_emailButton"),
+          className: classes.actionButton,
+          variant: "contained",
+          color: "primary",
+          children: "Email"
+        })
+      }) : /*#__PURE__*/jsx(Button, {
+        disabled: true,
+        className: classes.actionButton,
+        variant: "contained",
+        color: "primary",
+        children: "Email"
+      }), /*#__PURE__*/jsx(Button, {
+        "data-testid": "".concat(PAGE_NAME, "_messageButton"),
+        disabled: true,
+        className: classes.actionButton,
+        variant: "contained",
+        color: "primary",
+        children: "Message"
+      })]
+    })]
+  });
+}
+
+UserCard.propTypes = {
+  user: PropTypes.shape({
+    id: PropTypes.number.isRequired,
+    email: PropTypes.string,
+    mobile: PropTypes.string,
+    title: PropTypes.string,
+    role: PropTypes.string,
+    first_name: PropTypes.string.isRequired,
+    last_name: PropTypes.string.isRequired,
+    profile_photo: PropTypes.string
+  }).isRequired,
+  classes: PropTypes.shape({}).isRequired,
+  currentUser: PropTypes.shape({
+    id: PropTypes.oneOfType([PropTypes.number, PropTypes.string])
+  })
+};
+UserCard.defaultProps = {
+  currentUser: {}
+};
+var UserCard$1 = withStyles(muiStyles)(UserCard);
+
+export default UserCard$1;
+//# sourceMappingURL=index.js.map

package/components/UserCard/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../src/components/UserCard/index.js"],"sourcesContent":["import PropTypes from 'prop-types';\nimport { withStyles } from '@material-ui/core/styles';\n\nimport Card from '@material-ui/core/Card';\nimport CardActions from '@material-ui/core/CardActions';\nimport CardContent from '@material-ui/core/CardContent';\nimport CardMedia from '@material-ui/core/CardMedia';\nimport Chip from '@material-ui/core/Chip';\nimport Button from '@material-ui/core/Button';\nimport Typography from '@material-ui/core/Typography';\n\nimport blue from '@material-ui/core/colors/blue';\n\nimport EmailIcon from '@material-ui/icons/Email';\nimport PhoneIcon from '@material-ui/icons/Phone';\n\nimport styles from './style.css';\nimport { UniversalLink } from '../DevCenter/DevCenterRouterContext';\n\nconst PAGE_NAME = 'UserCardDialogPo';\n\nconst muiStyles = theme => ({\n  card: {\n    width: 352,\n  },\n  media: {\n    height: 264,\n    width: '100%',\n  },\n  content: { cursor: 'auto', padding: '10px 28px 28px 28px' },\n  userName: { fontWeight: 'bold' },\n  contact: {\n    display: 'flex',\n    alignItems: 'center',\n    fontSize: 12,\n    color: blue[900],\n    cursor: 'pointer',\n  },\n  contactIcon: {\n    height: 15,\n    width: 15,\n    marginRight: 10,\n    color: theme.palette.grey[300],\n  },\n  actions: {\n    display: 'flex',\n    justifyContent: 'space-between',\n    padding: '0 28px 28px 28px',\n  },\n  actionButton: {\n    width: 139,\n  },\n});\n\nfunction UserCard({\n  user: {\n    id,\n    email,\n    mobile,\n    title,\n    first_name: firstName,\n    last_name: lastName,\n    profile_photo: profilePhoto,\n  },\n  currentUser,\n  classes,\n}) {\n  return (\n    <Card data-testid={`${PAGE_NAME}`} className={classes.card}>\n      <CardMedia\n        data-testid={`${PAGE_NAME}_placeholder`}\n        className={classes.media}\n        image={profilePhoto || 'https://cdn.corva.ai/app/images/user-placeholder.svg'}\n        title={`${firstName} ${lastName}`}\n      >\n        {Number(currentUser.id) === Number(id) && (\n          <div className={styles.cUserCardMediaBackdrop}>\n            <UniversalLink href={`/config/users/${id}`}>\n              <Chip\n                data-not-migrated-MuiChip\n                data-testid={`${PAGE_NAME}_viewProfile`}\n                className={styles.cUserCardMediaBackdropToProfile}\n                label=\"View Profile\"\n              />\n            </UniversalLink>\n          </div>\n        )}\n      </CardMedia>\n      <CardContent className={classes.content}>\n        <Typography data-testid={`${PAGE_NAME}_name`} variant=\"h5\" className={classes.userName}>\n          {`${firstName} ${lastName}`}\n        </Typography>\n        {title && <Typography variant=\"subtitle1\">{title}</Typography>}\n        <br />\n        {email && (\n          <a href={`mailto:${email}`} target=\"_top\">\n            <Typography\n              data-testid={`${PAGE_NAME}_email`}\n              gutterBottom\n              variant=\"body1\"\n              className={classes.contact}\n            >\n              <EmailIcon className={classes.contactIcon} />\n              {email}\n            </Typography>\n          </a>\n        )}\n        {mobile && (\n          <a href={`tel:${mobile}`} target=\"_top\">\n            <Typography\n              data-testid={`${PAGE_NAME}_phone`}\n              variant=\"body1\"\n              className={classes.contact}\n            >\n              <PhoneIcon className={classes.contactIcon} />\n              {mobile}\n            </Typography>\n          </a>\n        )}\n      </CardContent>\n      <CardActions className={classes.actions}>\n        {email ? (\n          <a href={`mailto:${email}`} target=\"_top\">\n            <Button\n              data-testid={`${PAGE_NAME}_emailButton`}\n              className={classes.actionButton}\n              variant=\"contained\"\n              color=\"primary\"\n            >\n              Email\n            </Button>\n          </a>\n        ) : (\n          <Button disabled className={classes.actionButton} variant=\"contained\" color=\"primary\">\n            Email\n          </Button>\n        )}\n\n        {/* NOTE: Disabled since chat is turned off */}\n        <Button\n          data-testid={`${PAGE_NAME}_messageButton`}\n          disabled\n          className={classes.actionButton}\n          variant=\"contained\"\n          color=\"primary\"\n        >\n          Message\n        </Button>\n      </CardActions>\n    </Card>\n  );\n}\n\nUserCard.propTypes = {\n  user: PropTypes.shape({\n    id: PropTypes.number.isRequired,\n    email: PropTypes.string,\n    mobile: PropTypes.string,\n    title: PropTypes.string,\n    role: PropTypes.string,\n    first_name: PropTypes.string.isRequired,\n    last_name: PropTypes.string.isRequired,\n    profile_photo: PropTypes.string,\n  }).isRequired,\n  classes: PropTypes.shape({}).isRequired,\n  currentUser: PropTypes.shape({\n    id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),\n  }),\n};\n\nUserCard.defaultProps = {\n  currentUser: {},\n};\n\nexport default withStyles(muiStyles)(UserCard);\n"],"names":["PAGE_NAME","muiStyles","theme","card","width","media","height","content","cursor","padding","userName","fontWeight","contact","display","alignItems","fontSize","color","blue","contactIcon","marginRight","palette","grey","actions","justifyContent","actionButton","UserCard","user","id","email","mobile","title","firstName","first_name","lastName","last_name","profilePhoto","profile_photo","currentUser","classes","_jsxs","_jsx","Number","styles","cUserCardMediaBackdrop","cUserCardMediaBackdropToProfile","propTypes","PropTypes","shape","number","isRequired","string","role","oneOfType","defaultProps","withStyles"],"mappings":"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"}

package/components/UserCard/style.css.js

@@ -1 +1,8 @@
-import e from'./../../ext-esm/style-inject/dist/style-inject.es.js';var r={cUserCardMediaBackdrop:"style_cUserCardMediaBackdrop__iJBty",cUserCardMediaBackdropToProfile:"style_cUserCardMediaBackdropToProfile__jljG2"};e(".style_cUserCardMediaBackdrop__iJBty{height:100%;position:relative;width:100%}.style_cUserCardMediaBackdrop__iJBty:hover{background-color:rgba(47,47,47,.25);transition:background-color .1s linear}.style_cUserCardMediaBackdrop__iJBty:hover .style_cUserCardMediaBackdropToProfile__jljG2{background-color:#303030;color:#fff;cursor:pointer;display:flex;font-family:Roboto;font-size:16px;font-weight:200;height:30px;justify-content:center;line-height:21px;opacity:.86;width:139px}.style_cUserCardMediaBackdropToProfile__jljG2{display:none;left:50%;position:absolute;top:14px;transform:translateX(-50%)}");export{r as default};
+import styleInject from '../../ext-esm/style-inject/dist/style-inject.es.js';
+
+var css_248z = ".style_cUserCardMediaBackdrop__2eVbp {\n  width: 100%;\n  height: 100%;\n  position: relative;\n}\n\n.style_cUserCardMediaBackdrop__2eVbp:hover {\n  background-color: rgba(47, 47, 47, 0.25);\n  transition: background-color 100ms linear;\n}\n\n.style_cUserCardMediaBackdrop__2eVbp:hover .style_cUserCardMediaBackdropToProfile__1cnxg {\n  display: flex;\n  background-color: #303030;\n  opacity: 0.86;\n  color: #fff;\n  cursor: pointer;\n  width: 139px;\n  height: 30px;\n  justify-content: center;\n  font-family: Roboto;\n  font-size: 16px;\n  line-height: 21px;\n  font-weight: 200;\n}\n\n.style_cUserCardMediaBackdropToProfile__1cnxg {\n  top: 14px;\n  left: 50%;\n  transform: translateX(-50%);\n  position: absolute;\n  display: none;\n}\n";
+var styles = {"cUserCardMediaBackdrop":"style_cUserCardMediaBackdrop__2eVbp","cUserCardMediaBackdropToProfile":"style_cUserCardMediaBackdropToProfile__1cnxg"};
+styleInject(css_248z);
+
+export default styles;
+//# sourceMappingURL=style.css.js.map

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

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

package/components/UserCardPopover.js

@@ -1 +1,82 @@
-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};
+import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
+import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
+import { withStyles, Popover } from '@material-ui/core';
+import { useState } from 'react';
+import PropTypes from 'prop-types';
+import UserCard from './UserCard/index.js';
+
+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 default UserCardPopover$1;
+//# sourceMappingURL=UserCardPopover.js.map

package/components/UserCardPopover.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"UserCardPopover.js","sources":["../../src/components/UserCardPopover.js"],"sourcesContent":["import { useState } from 'react';\nimport PropTypes from 'prop-types';\nimport { withStyles, Popover } from '@material-ui/core';\n\nimport UserCard from '~components/UserCard';\n\nconst muiStyles = {\n  popoverPaper: { background: 'transparent' },\n  childrenWrapper: { cursor: 'pointer' },\n};\n\nfunction UserCardPopover(props) {\n  const [anchorEl, setAnchorEl] = useState(null);\n  const open = Boolean(anchorEl);\n\n  const handlePopoverOpen = event => {\n    setAnchorEl(event.currentTarget);\n  };\n\n  const handlePopoverClose = () => {\n    setAnchorEl(null);\n  };\n\n  return (\n    <>\n      <div\n        aria-owns={open ? 'user-popover' : undefined}\n        aria-haspopup=\"true\"\n        onClick={handlePopoverOpen}\n        className={props.classes.childrenWrapper}\n        style={props.wrapperStyle}\n      >\n        {props.children}\n      </div>\n      <Popover\n        id=\"user-popover\"\n        open={open}\n        classes={{ paper: props.classes.popoverPaper }}\n        anchorEl={anchorEl}\n        anchorOrigin={{\n          vertical: 'bottom',\n          horizontal: 'left',\n        }}\n        transformOrigin={{\n          vertical: 'top',\n          horizontal: 'left',\n        }}\n        onClose={handlePopoverClose}\n      >\n        <UserCard user={props.user} currentUser={props.currentUser} />\n      </Popover>\n    </>\n  );\n}\n\nUserCardPopover.propTypes = {\n  wrapperStyle: PropTypes.shape({}),\n  user: PropTypes.shape({}).isRequired,\n  children: PropTypes.node.isRequired,\n\n  currentUser: PropTypes.shape({}),\n\n  classes: PropTypes.shape({\n    popoverPaper: PropTypes.string.isRequired,\n    childrenWrapper: PropTypes.string.isRequired,\n  }).isRequired,\n};\n\nUserCardPopover.defaultProps = {\n  wrapperStyle: {},\n  currentUser: {},\n};\n\nexport default withStyles(muiStyles)(UserCardPopover);\n"],"names":["muiStyles","popoverPaper","background","childrenWrapper","cursor","UserCardPopover","props","useState","anchorEl","setAnchorEl","open","Boolean","handlePopoverOpen","event","currentTarget","handlePopoverClose","_jsxs","_jsx","undefined","classes","wrapperStyle","children","paper","vertical","horizontal","user","currentUser","propTypes","PropTypes","shape","isRequired","node","string","defaultProps","withStyles"],"mappings":";;;;;;;AAMA,IAAMA,SAAS,GAAG;AAChBC,EAAAA,YAAY,EAAE;AAAEC,IAAAA,UAAU,EAAE;AAAd,GADE;AAEhBC,EAAAA,eAAe,EAAE;AAAEC,IAAAA,MAAM,EAAE;AAAV;AAFD,CAAlB;;AAKA,SAASC,eAAT,CAAyBC,KAAzB,EAAgC;AAAA,kBACEC,QAAQ,CAAC,IAAD,CADV;AAAA;AAAA,MACvBC,QADuB;AAAA,MACbC,WADa;;AAE9B,MAAMC,IAAI,GAAGC,OAAO,CAACH,QAAD,CAApB;;AAEA,MAAMI,iBAAiB,GAAG,SAApBA,iBAAoB,CAAAC,KAAK,EAAI;AACjCJ,IAAAA,WAAW,CAACI,KAAK,CAACC,aAAP,CAAX;AACD,GAFD;;AAIA,MAAMC,kBAAkB,GAAG,SAArBA,kBAAqB,GAAM;AAC/BN,IAAAA,WAAW,CAAC,IAAD,CAAX;AACD,GAFD;;AAIA,sBACEO;AAAA,4BACEC;AACE,mBAAWP,IAAI,GAAG,cAAH,GAAoBQ,SADrC;AAEE,uBAAc,MAFhB;AAGE,MAAA,OAAO,EAAEN,iBAHX;AAIE,MAAA,SAAS,EAAEN,KAAK,CAACa,OAAN,CAAchB,eAJ3B;AAKE,MAAA,KAAK,EAAEG,KAAK,CAACc,YALf;AAAA,gBAOGd,KAAK,CAACe;AAPT,MADF,eAUEJ,IAAC,OAAD;AACE,MAAA,EAAE,EAAC,cADL;AAEE,MAAA,IAAI,EAAEP,IAFR;AAGE,MAAA,OAAO,EAAE;AAAEY,QAAAA,KAAK,EAAEhB,KAAK,CAACa,OAAN,CAAclB;AAAvB,OAHX;AAIE,MAAA,QAAQ,EAAEO,QAJZ;AAKE,MAAA,YAAY,EAAE;AACZe,QAAAA,QAAQ,EAAE,QADE;AAEZC,QAAAA,UAAU,EAAE;AAFA,OALhB;AASE,MAAA,eAAe,EAAE;AACfD,QAAAA,QAAQ,EAAE,KADK;AAEfC,QAAAA,UAAU,EAAE;AAFG,OATnB;AAaE,MAAA,OAAO,EAAET,kBAbX;AAAA,6BAeEE,IAAC,QAAD;AAAU,QAAA,IAAI,EAAEX,KAAK,CAACmB,IAAtB;AAA4B,QAAA,WAAW,EAAEnB,KAAK,CAACoB;AAA/C;AAfF,MAVF;AAAA,IADF;AA8BD;;AAEDrB,eAAe,CAACsB,SAAhB,GAA4B;AAC1BP,EAAAA,YAAY,EAAEQ,SAAS,CAACC,KAAV,CAAgB,EAAhB,CADY;AAE1BJ,EAAAA,IAAI,EAAEG,SAAS,CAACC,KAAV,CAAgB,EAAhB,EAAoBC,UAFA;AAG1BT,EAAAA,QAAQ,EAAEO,SAAS,CAACG,IAAV,CAAeD,UAHC;AAK1BJ,EAAAA,WAAW,EAAEE,SAAS,CAACC,KAAV,CAAgB,EAAhB,CALa;AAO1BV,EAAAA,OAAO,EAAES,SAAS,CAACC,KAAV,CAAgB;AACvB5B,IAAAA,YAAY,EAAE2B,SAAS,CAACI,MAAV,CAAiBF,UADR;AAEvB3B,IAAAA,eAAe,EAAEyB,SAAS,CAACI,MAAV,CAAiBF;AAFX,GAAhB,EAGNA;AAVuB,CAA5B;AAaAzB,eAAe,CAAC4B,YAAhB,GAA+B;AAC7Bb,EAAAA,YAAY,EAAE,EADe;AAE7BM,EAAAA,WAAW,EAAE;AAFgB,CAA/B;AAKA,wBAAeQ,UAAU,CAAClC,SAAD,CAAV,CAAsBK,eAAtB,CAAf;;;;"}

package/components/UserMention/constants.js

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

package/components/UserMention/constants.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"constants.js","sources":["../../../src/components/UserMention/constants.js"],"sourcesContent":["export const USER_MARKUP = '@[user:__id__|__display__]';\n\nexport const PLACEHOLDERS = {\n  id: '__id__',\n  display: '__display__',\n};\n"],"names":["USER_MARKUP","PLACEHOLDERS","id","display"],"mappings":"IAAaA,WAAW,GAAG;IAEdC,YAAY,GAAG;AAC1BC,EAAAA,EAAE,EAAE,QADsB;AAE1BC,EAAAA,OAAO,EAAE;AAFiB;;;;"}

package/components/UserMention/index.js

@@ -1 +1,203 @@
-import e from"@babel/runtime/helpers/defineProperty";import{useCallback as o,useEffect as n}from"react";import{debounce as r}from"lodash";import t from"prop-types";import{withStyles as i}from"@material-ui/core/styles";import{MentionsInput as s,Mention as a}from"react-mentions";import l from"@material-ui/core/colors/blue";import"../../permissions/PermissionsContext.js";import{PERMISSIONS as c}from"../../permissions/constants/index.js";import"@babel/runtime/helpers/slicedToArray";import{withPermissionsHOC as p}from"../../permissions/withPermissionsHOC.js";import"@babel/runtime/helpers/asyncToGenerator";import"@babel/runtime/regenerator";import"../../clients/jsonApi/index.js";import"../../permissions/ProvidePermissions.js";import u from"../Avatar/index.js";import{handleFetchUsers as m}from"./utils/index.js";import{USER_MARKUP as d}from"./constants.js";import f from"./style.css.js";import{jsx as g,jsxs as y}from"react/jsx-runtime";function b(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?b(Object(r),!0).forEach((function(n){e(o,n,r[n])})):Object.getOwnPropertyDescriptors?Object.defineProperties(o,Object.getOwnPropertyDescriptors(r)):b(Object(r)).forEach((function(e){Object.defineProperty(o,e,Object.getOwnPropertyDescriptor(r,e))}))}return o}var _={backgroundColor:l[100]},j={color:"#00bcd4"},O={suggestions:{item:{"&focused":{backgroundColor:"rgba(0, 0, 0, 0.08)"}}}},v=h(h({},O),{},{input:{color:"transparent",caretColor:"#fff",zIndex:1},highlighter:{color:"#fff"}}),P=h(h({},O),{},{input:{color:"#000"}}),w=function(e){var t=e.onChange,i=e.singleLine,l=e.suggestionsPortalHost,c=e.value,p=e.inputRef,b=e.classes,h=e.withLightTheme,O=e.placeholder,w=e.onMount,C=e.onKeyDown,S=e.onKeyUp,x=e.autoFocus,R=e.disabled,D=e.companyId,K=e.currentUser,L=e.isCompanySelectVisible,N=o(r((function(e,o){var n=L&&K&&K.company_id!==D?[K.company_id,D]:null;m(e,o,n)}),400),[D]);return n(w,[]),g(s,{value:c,onChange:function(e,o){t(o)},singleLine:i,allowSpaceInQuery:!0,classNames:f,placeholder:O,suggestionsPortalHost:l,inputRef:p,style:h?P:v,onKeyDown:C,onKeyUp:S,autoFocus:x,disabled:R,children:g(a,{markup:d,renderSuggestion:function(e){return function(e,o){return y("div",{className:f.mention__suggestion,children:[g(u,{alt:e.display,displayName:e.display,className:o.avatar,imgSrc:e.photo}),y("div",{className:f.mention__suggestion__info,children:[g("span",{"data-testid":"".concat("userMention","_name_").concat(e.display),className:f.mention__suggestion__info__name,children:e.display}),e.title&&g("span",{className:f.mention__suggestion__info__group,children:e.title})]})]})}(e,b)},trigger:"@",data:N,displayTransform:function(e,o){return"@".concat(o)},style:h?_:j,appendSpaceOnAdd:!0})})};w.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,onMount:t.func,onKeyDown:t.func,onKeyUp:t.func,autoFocus:t.bool,disabled:t.bool,currentUser:t.shape({company_id:t.number.isRequired}).isRequired,companyId:t.number,isCompanySelectVisible:t.bool.isRequired},w.defaultProps={onChange:function(){},singleLine:!1,suggestionsPortalHost:null,value:"",inputRef:null,withLightTheme:!0,placeholder:"Mention people using '@'",onMount:function(){},onKeyDown:function(){},onKeyUp:function(){},autoFocus:!0,disabled:!1,companyId:null};var C=p({isCompanySelectVisible:c.companySelectorView})(i({avatar:{height:45,width:45,border:"1.5px solid #fff"}})(w));export{C as default};
+import _defineProperty from '@babel/runtime/helpers/defineProperty';
+import { debounce } from 'lodash';
+import '@babel/runtime/helpers/slicedToArray';
+import '@babel/runtime/regenerator';
+import '@babel/runtime/helpers/asyncToGenerator';
+import blue from '@material-ui/core/colors/blue';
+import 'query-string';
+import '../../clients/api/apiCore.js';
+import '../../clients/constants.js';
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { useCallback, useEffect } from 'react';
+import PropTypes from 'prop-types';
+import { withStyles } from '@material-ui/core/styles';
+import Avatar from '../Avatar/index.js';
+import { MentionsInput, Mention } from 'react-mentions';
+import '../../permissions/PermissionsContext.js';
+import { PERMISSIONS } from '../../permissions/constants/index.js';
+import { withPermissionsHOC } from '../../permissions/withPermissionsHOC.js';
+import '../../permissions/ProvidePermissions.js';
+import { USER_MARKUP } from './constants.js';
+import styles from './style.css.js';
+import { handleFetchUsers } from './utils/index.js';
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (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 = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { 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: 'transparent',
+    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(Avatar, {
+      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,
+      withLightTheme = _ref.withLightTheme,
+      placeholder = _ref.placeholder,
+      onMount = _ref.onMount,
+      onKeyDown = _ref.onKeyDown,
+      onKeyUp = _ref.onKeyUp,
+      autoFocus = _ref.autoFocus,
+      disabled = _ref.disabled,
+      companyId = _ref.companyId,
+      currentUser = _ref.currentUser,
+      isCompanySelectVisible = _ref.isCompanySelectVisible;
+
+  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);
+  };
+
+  useEffect(onMount, []);
+  return /*#__PURE__*/jsx(MentionsInput, {
+    value: value,
+    onChange: onInputChange,
+    singleLine: singleLine,
+    allowSpaceInQuery: true,
+    classNames: styles,
+    placeholder: placeholder,
+    suggestionsPortalHost: suggestionsPortalHost,
+    inputRef: inputRef,
+    style: withLightTheme ? lightThemeInputStyles : darkThemeInputStyles,
+    onKeyDown: onKeyDown,
+    onKeyUp: onKeyUp,
+    autoFocus: autoFocus,
+    disabled: disabled,
+    children: /*#__PURE__*/jsx(Mention, {
+      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
+    })
+  });
+};
+
+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,
+  onMount: PropTypes.func,
+  onKeyDown: PropTypes.func,
+  onKeyUp: PropTypes.func,
+  autoFocus: PropTypes.bool,
+  disabled: PropTypes.bool,
+  currentUser: PropTypes.shape({
+    company_id: PropTypes.number.isRequired
+  }).isRequired,
+  companyId: PropTypes.number,
+  isCompanySelectVisible: PropTypes.bool.isRequired
+};
+UserMention.defaultProps = {
+  onChange: function onChange() {
+    return undefined;
+  },
+  singleLine: false,
+  suggestionsPortalHost: null,
+  value: '',
+  inputRef: null,
+  withLightTheme: true,
+  placeholder: "Mention people using '@'",
+  onMount: function onMount() {
+    return undefined;
+  },
+  onKeyDown: function onKeyDown() {
+    return undefined;
+  },
+  onKeyUp: function onKeyUp() {
+    return undefined;
+  },
+  autoFocus: true,
+  disabled: false,
+  companyId: null
+};
+var UserMention$1 = withPermissionsHOC({
+  isCompanySelectVisible: PERMISSIONS.companySelectorView
+})(withStyles(muiStyles)(UserMention));
+
+export default UserMention$1;
+//# sourceMappingURL=index.js.map

package/components/UserMention/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../src/components/UserMention/index.js"],"sourcesContent":["import { useCallback, useEffect } from 'react';\nimport { debounce } from 'lodash';\nimport PropTypes from 'prop-types';\nimport { withStyles } from '@material-ui/core/styles';\nimport { MentionsInput, Mention } from 'react-mentions';\nimport blue from '@material-ui/core/colors/blue';\nimport { withPermissionsHOC, PERMISSIONS } from '~/permissions';\nimport Avatar from '~components/Avatar';\n\nimport { handleFetchUsers } from './utils';\nimport { USER_MARKUP } from './constants';\n\nimport styles from './style.css';\n\nconst PAGE_NAME = 'userMention';\n\nconst muiStyles = {\n  avatar: {\n    height: 45,\n    width: 45,\n    border: '1.5px solid #fff',\n  },\n};\n\nconst mentionLightStyle = {\n  backgroundColor: blue[100],\n};\nconst mentionDarkStyle = {\n  color: '#00bcd4',\n};\n\n// NOTE: IMPORTANT! 'input', 'mention' and 'highliter' should always have same font/latter/height/line etc values\nconst inputStyles = {\n  suggestions: {\n    item: {\n      '&focused': {\n        backgroundColor: 'rgba(0, 0, 0, 0.08)',\n      },\n    },\n  },\n};\n\nconst darkThemeInputStyles = {\n  ...inputStyles,\n  input: {\n    color: 'transparent',\n    caretColor: '#fff',\n    zIndex: 1,\n  },\n  highlighter: {\n    color: '#fff',\n  },\n};\n\nconst lightThemeInputStyles = {\n  ...inputStyles,\n  input: { color: '#000' },\n};\n\nconst renderSuggestion = (entry, classes) => (\n  <div className={styles.mention__suggestion}>\n    <Avatar\n      alt={entry.display}\n      displayName={entry.display}\n      className={classes.avatar}\n      imgSrc={entry.photo}\n    />\n    <div className={styles.mention__suggestion__info}>\n      <span\n        data-testid={`${PAGE_NAME}_name_${entry.display}`}\n        className={styles.mention__suggestion__info__name}\n      >\n        {entry.display}\n      </span>\n      {entry.title && (\n        <span className={styles.mention__suggestion__info__group}>{entry.title}</span>\n      )}\n    </div>\n  </div>\n);\n\nconst UserMention = ({\n  onChange,\n  singleLine,\n  suggestionsPortalHost,\n  value,\n  inputRef,\n  classes,\n  withLightTheme,\n  placeholder,\n  onMount,\n  onKeyDown,\n  onKeyUp,\n  autoFocus,\n  disabled,\n  companyId,\n  currentUser,\n  isCompanySelectVisible,\n}) => {\n  const fetchUsers = (search, callback) => {\n    const companyIds =\n      isCompanySelectVisible && currentUser && currentUser.company_id !== companyId\n        ? [currentUser.company_id, companyId]\n        : null;\n\n    handleFetchUsers(search, callback, companyIds);\n  };\n\n  const debouncedUsersFetch = useCallback(debounce(fetchUsers, 400), [companyId]);\n\n  const onInputChange = (event, newValue) => {\n    onChange(newValue);\n  };\n\n  useEffect(onMount, []);\n\n  return (\n    <MentionsInput\n      value={value}\n      onChange={onInputChange}\n      singleLine={singleLine}\n      allowSpaceInQuery\n      classNames={styles}\n      placeholder={placeholder}\n      suggestionsPortalHost={suggestionsPortalHost}\n      inputRef={inputRef}\n      style={withLightTheme ? lightThemeInputStyles : darkThemeInputStyles}\n      onKeyDown={onKeyDown}\n      onKeyUp={onKeyUp}\n      autoFocus={autoFocus}\n      disabled={disabled}\n    >\n      <Mention\n        markup={USER_MARKUP}\n        renderSuggestion={entry => renderSuggestion(entry, classes)}\n        trigger=\"@\"\n        data={debouncedUsersFetch}\n        displayTransform={(id, display) => `@${display}`}\n        style={withLightTheme ? mentionLightStyle : mentionDarkStyle}\n        appendSpaceOnAdd\n      />\n    </MentionsInput>\n  );\n};\n\nUserMention.propTypes = {\n  onChange: PropTypes.func,\n  singleLine: PropTypes.bool,\n  suggestionsPortalHost: PropTypes.shape({\n    current: PropTypes.instanceOf(Element),\n  }),\n  value: PropTypes.string,\n  inputRef: PropTypes.shape({}),\n  classes: PropTypes.shape({\n    avatar: PropTypes.string.isRequired,\n  }).isRequired,\n  withLightTheme: PropTypes.bool,\n  placeholder: PropTypes.string,\n\n  onMount: PropTypes.func,\n  onKeyDown: PropTypes.func,\n  onKeyUp: PropTypes.func,\n  autoFocus: PropTypes.bool,\n  disabled: PropTypes.bool,\n\n  currentUser: PropTypes.shape({\n    company_id: PropTypes.number.isRequired,\n  }).isRequired,\n  companyId: PropTypes.number,\n  isCompanySelectVisible: PropTypes.bool.isRequired,\n};\n\nUserMention.defaultProps = {\n  onChange: () => undefined,\n  singleLine: false,\n  suggestionsPortalHost: null,\n  value: '',\n  inputRef: null,\n  withLightTheme: true,\n  placeholder: \"Mention people using '@'\",\n\n  onMount: () => undefined,\n  onKeyDown: () => undefined,\n  onKeyUp: () => undefined,\n  autoFocus: true,\n  disabled: false,\n\n  companyId: null,\n};\n\nexport default withPermissionsHOC({ isCompanySelectVisible: PERMISSIONS.companySelectorView })(\n  withStyles(muiStyles)(UserMention)\n);\n"],"names":["PAGE_NAME","muiStyles","avatar","height","width","border","mentionLightStyle","backgroundColor","blue","mentionDarkStyle","color","inputStyles","suggestions","item","darkThemeInputStyles","input","caretColor","zIndex","highlighter","lightThemeInputStyles","renderSuggestion","entry","classes","_jsxs","styles","mention__suggestion","_jsx","display","photo","mention__suggestion__info","mention__suggestion__info__name","title","mention__suggestion__info__group","UserMention","onChange","singleLine","suggestionsPortalHost","value","inputRef","withLightTheme","placeholder","onMount","onKeyDown","onKeyUp","autoFocus","disabled","companyId","currentUser","isCompanySelectVisible","fetchUsers","search","callback","companyIds","company_id","handleFetchUsers","debouncedUsersFetch","useCallback","debounce","onInputChange","event","newValue","useEffect","USER_MARKUP","id","propTypes","PropTypes","func","bool","shape","current","instanceOf","Element","string","isRequired","number","defaultProps","undefined","withPermissionsHOC","PERMISSIONS","companySelectorView","withStyles"],"mappings":"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"}

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;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__3rzRB {\n  width: 100%;\n  margin: 0;\n  min-width: 0;\n}\n\n.style_mention__control__S6VdC {\n  width: 100%;\n}\n\n.style_mention--multiLine___HB5R .style_mention__control__S6VdC {\n  max-height: 70px;\n  height: 70px;\n  overflow-y: auto;\n}\n\n.style_mention__suggestions__1qW8P {\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__1utbK {\n  font-size: 14px;\n  position: relative;\n  max-height: 260px;\n  overflow-y: auto;\n}\n\n.style_mention__suggestions__item__2kTTp {\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__2kTTp: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__2rYGX {\n  letter-spacing: 0;\n  line-height: normal;\n}\n\n.style_mention__highlighter__2rYGX strong,\n.style_mention__highlighter__2rYGX 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__3Urfs {\n  outline: none;\n  border: none;\n  padding: 0;\n  line-height: normal !important;\n  letter-spacing: normal;\n}\n\n/* END */\n\n.style_mention__suggestion__RfxNx {\n  display: flex;\n  width: 100%;\n  align-items: center;\n  position: relative;\n}\n\n.style_mention__suggestion__RfxNx: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__2-InA {\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__1DiGY {\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__270i- {\n  font-size: 0.9rem;\n  color: #b1b1b1;\n}\n";
+var styles = {"mention":"style_mention__3rzRB","mention__control":"style_mention__control__S6VdC","mention--multiLine":"style_mention--multiLine___HB5R","mention__suggestions":"style_mention__suggestions__1qW8P","mention__suggestions__list":"style_mention__suggestions__list__1utbK","mention__suggestions__item":"style_mention__suggestions__item__2kTTp","mention__highlighter":"style_mention__highlighter__2rYGX","mention__input":"style_mention__input__3Urfs","mention__suggestion":"style_mention__suggestion__RfxNx","mention__suggestion__info":"style_mention__suggestion__info__2-InA","mention__suggestion__info__name":"style_mention__suggestion__info__name__1DiGY","mention__suggestion__info__group":"style_mention__suggestion__info__group__270i-"};
+styleInject(css_248z);
+
+export default styles;
+//# 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,oDAAyD;AACjF;AACA;AACA;AACA;AACA;AACA;"}