cozy-ui 146.0.0 → 146.2.0

package/react/MemberRow/locales/en.json

@@ -0,0 +1,8 @@
+{
+  "MemberRow": {
+    "owner": "Owner",
+    "you": "You",
+    "remove": "Remove from sharing",
+    "defaultName": "Anonymous"
+  }
+}

package/react/MemberRow/locales/es.json

@@ -0,0 +1,8 @@
+{
+  "MemberRow": {
+    "owner": "Propietario",
+    "you": "Tú",
+    "remove": "Quitar del uso compartido",
+    "defaultName": "Anónimo"
+  }
+}

package/react/MemberRow/locales/fr.json

@@ -0,0 +1,8 @@
+{
+  "MemberRow": {
+    "owner": "Propriétaire",
+    "you": "Vous",
+    "remove": "Arrêter le partage",
+    "defaultName": "Anonyme"
+  }
+}

package/react/MemberRow/locales/index.js

@@ -0,0 +1,17 @@
+import de from './de.json'
+import en from './en.json'
+import es from './es.json'
+import fr from './fr.json'
+import it from './it.json'
+import ru from './ru.json'
+import vi from './vi.json'
+
+export const locales = {
+  de,
+  en,
+  es,
+  fr,
+  it,
+  ru,
+  vi
+}

package/react/MemberRow/locales/it.json

@@ -0,0 +1,8 @@
+{
+  "MemberRow": {
+    "owner": "Proprietario",
+    "you": "Tu",
+    "remove": "Rimuovi dalla condivisione",
+    "defaultName": "Anonimo"
+  }
+}

package/react/MemberRow/locales/ru.json

@@ -0,0 +1,8 @@
+{
+  "MemberRow": {
+    "owner": "Владелец",
+    "you": "Вы",
+    "remove": "Удалить из общего доступа",
+    "defaultName": "Аноним"
+  }
+}

package/react/MemberRow/locales/vi.json

@@ -0,0 +1,8 @@
+{
+  "MemberRow": {
+    "owner": "Chủ sở hữu",
+    "you": "Bạn",
+    "remove": "Xóa khỏi chia sẻ",
+    "defaultName": "Ẩn danh"
+  }
+}

package/react/MemberRow/propTypes.js

@@ -0,0 +1,33 @@
+import PropTypes from 'prop-types'
+
+const rolePropType = PropTypes.shape({
+  value: PropTypes.string.isRequired,
+  label: PropTypes.string.isRequired
+})
+
+export const rolesPropType = PropTypes.arrayOf(rolePropType)
+
+export const memberPropType = PropTypes.shape({
+  id: PropTypes.string.isRequired,
+  name: PropTypes.string,
+  subtitle: PropTypes.node,
+  avatarUrl: PropTypes.string,
+  initials: PropTypes.string,
+  color: PropTypes.string,
+  isGroup: PropTypes.bool,
+  isOwner: PropTypes.bool,
+  isCurrentUser: PropTypes.bool,
+  role: PropTypes.string,
+  roles: rolesPropType,
+  canChangeRole: PropTypes.bool,
+  canRemove: PropTypes.bool,
+  removeIcon: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
+  removeLabel: PropTypes.string,
+  action: PropTypes.shape({
+    label: PropTypes.string.isRequired,
+    onClick: PropTypes.func.isRequired
+  }),
+  isPending: PropTypes.bool,
+  onClick: PropTypes.func,
+  data: PropTypes.any
+})

package/react/MuiCozyTheme/makePalette.js

@@ -6,7 +6,7 @@ const opacityByTheme = {
   light: {
     action: {
       hoverOpacity: 0.04,
-      selectedOpacity: 0.18,
+      selectedOpacity: 0.08,
       disabledOpacity: 0.32,
       focusOpacity: 0.12,
       activatedOpacity: 0.12,
@@ -24,7 +24,7 @@ const opacityByTheme = {
   dark: {
     action: {
       hoverOpacity: 0.08,
-      selectedOpacity: 0.18,
+      selectedOpacity: 0.16,
       disabledOpacity: 0.32,
       focusOpacity: 0.24,
       activatedOpacity: 0.24,

package/stylus/settings/themes/light.styl

@@ -40,16 +40,16 @@ html,
     /*
     Secondary colors
 
-    Stylus: secondaryColorLightest     - #DDE0E3, CSS: var(--secondaryColorLightest)
-    Stylus: secondaryColorLight        - #9DA2A6, CSS: var(--secondaryColorLight)
-    Stylus: secondaryColor             - #7C8086, CSS: var(--secondaryColor)
-    Stylus: secondaryColorDark         - #5D6169, CSS: var(--secondaryColorDark)
+    Stylus: secondaryColorLightest     - #F2F2F3, CSS: var(--secondaryColorLightest)
+    Stylus: secondaryColorLight        - #F2F2F3, CSS: var(--secondaryColorLight)
+    Stylus: secondaryColor             - #7A7781, CSS: var(--secondaryColor)
+    Stylus: secondaryColorDark         - #64626A, CSS: var(--secondaryColorDark)
     Stylus: secondaryContrastTextColor -  #FFF, CSS: var(--secondaryContrastTextColor)
 
     Styleguide Settings.theme.secondary
     */
     --secondaryColorLightest palette.Secondary['100']
-    --secondaryColorLight palette.Secondary['200']
+    --secondaryColorLight palette.Secondary['100']
     --secondaryColor palette.Secondary['600']
     --secondaryColorDark palette.Secondary['700']
     --secondaryContrastTextColor palette.Common['white']

package/theme/palette.json

@@ -14,16 +14,16 @@
   },
 
   "Secondary": {
-   "50": "#f1f5fa",
-   "100": "#e8f0fa",
-   "200": "#d1e0f2",
-   "300": "#b5d1f1",
-   "400": "#96bce8",
-   "500": "#85b5ec",
-   "600": "#5c9ce6",
-   "700": "#5085c3",
-   "800": "#243b55",
-   "900": "#081f39",
+   "50": "#FCFCFD",
+   "100": "#F2F2F3",
+   "200": "#D8D7DA",
+   "300": "#BEBDC2",
+   "400": "#A4A2A9",
+   "500": "#8D8A93",
+   "600": "#7A7781",
+   "700": "#64626A",
+   "800": "#55535A",
+   "900": "#3A383D",
    "ContrastText": "#fff"
   },
 

package/transpiled/react/MemberList/EmptyMembers.d.ts

@@ -0,0 +1,2 @@
+export default EmptyMembers;
+declare function EmptyMembers(): JSX.Element;

package/transpiled/react/MemberList/EmptyMembers.js

@@ -0,0 +1,42 @@
+import { Icon, Team } from '@linagora/twake-icons';
+import cx from 'classnames';
+import React from 'react';
+import { useI18n, useExtendI18n } from 'twake-i18n';
+import { locales } from "cozy-ui/transpiled/react/MemberList/locales";
+import Typography from "cozy-ui/transpiled/react/Typography";
+import useBreakpoints from "cozy-ui/transpiled/react/providers/Breakpoints";
+import { alpha, makeStyles } from "cozy-ui/transpiled/react/styles";
+var useStyles = makeStyles(function (theme) {
+  return {
+    root: {
+      backgroundColor: alpha(theme.palette.secondary.main, theme.palette.action.hoverOpacity)
+    }
+  };
+});
+
+var EmptyMembers = function EmptyMembers() {
+  useExtendI18n(locales);
+
+  var _useI18n = useI18n(),
+      t = _useI18n.t;
+
+  var _useBreakpoints = useBreakpoints(),
+      isMobile = _useBreakpoints.isMobile;
+
+  var classes = useStyles();
+  return /*#__PURE__*/React.createElement("div", {
+    className: cx('u-flex u-flex-column u-flex-items-center u-pv-2 u-ph-1 u-bdrs-6', isMobile ? 'u-mh-1' : 'u-mh-2', classes.root)
+  }, /*#__PURE__*/React.createElement(Icon, {
+    icon: Team,
+    size: 48,
+    color: "var(--primaryColorLight)"
+  }), /*#__PURE__*/React.createElement(Typography, {
+    variant: "body2",
+    className: "u-mt-half"
+  }, t('MemberList.empty.title')), /*#__PURE__*/React.createElement(Typography, {
+    variant: "caption",
+    color: "textSecondary"
+  }, t('MemberList.empty.subtitle')));
+};
+
+export default EmptyMembers;

package/transpiled/react/MemberList/MemberList.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/transpiled/react/MemberList/index.d.ts

@@ -0,0 +1,61 @@
+export default MemberList;
+/**
+ * Lists the members of a sharing, the owner first
+ *
+ * @param {object} props
+ * @param {object[]} props.members - Members to display, see `MemberRow`
+ * @param {object[]} props.roles - Roles a member can get, as `{ value, label }`
+ * @param {Function} props.onRoleChange - Called with the member and its new role
+ * @param {Function} props.onRemove - Called with the member to remove
+ * @param {boolean} [props.showEmptyState] - Whether to show a placeholder
+ * when there is no member but the owner
+ * @param {string} [props.className] - Class name of the list
+ */
+declare function MemberList({ members, roles, onRoleChange, onRemove, showEmptyState, className }: {
+    members: object[];
+    roles: object[];
+    onRoleChange: Function;
+    onRemove: Function;
+    showEmptyState?: boolean | undefined;
+    className?: string | undefined;
+}): JSX.Element;
+declare namespace MemberList {
+    namespace propTypes {
+        const members: PropTypes.Validator<(PropTypes.InferProps<{
+            id: PropTypes.Validator<string>;
+            name: PropTypes.Requireable<string>;
+            subtitle: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+            avatarUrl: PropTypes.Requireable<string>;
+            initials: PropTypes.Requireable<string>;
+            color: PropTypes.Requireable<string>;
+            isGroup: PropTypes.Requireable<boolean>;
+            isOwner: PropTypes.Requireable<boolean>;
+            isCurrentUser: PropTypes.Requireable<boolean>;
+            role: PropTypes.Requireable<string>;
+            roles: PropTypes.Requireable<(PropTypes.InferProps<{
+                value: PropTypes.Validator<string>;
+                label: PropTypes.Validator<string>;
+            }> | null)[]>;
+            canChangeRole: PropTypes.Requireable<boolean>;
+            canRemove: PropTypes.Requireable<boolean>;
+            removeIcon: PropTypes.Requireable<object>;
+            removeLabel: PropTypes.Requireable<string>;
+            action: PropTypes.Requireable<PropTypes.InferProps<{
+                label: PropTypes.Validator<string>;
+                onClick: PropTypes.Validator<(...args: any[]) => any>;
+            }>>;
+            isPending: PropTypes.Requireable<boolean>;
+            onClick: PropTypes.Requireable<(...args: any[]) => any>;
+            data: PropTypes.Requireable<any>;
+        }> | null)[]>;
+        const roles: PropTypes.Validator<(PropTypes.InferProps<{
+            value: PropTypes.Validator<string>;
+            label: PropTypes.Validator<string>;
+        }> | null)[]>;
+        const onRoleChange: PropTypes.Validator<(...args: any[]) => any>;
+        const onRemove: PropTypes.Validator<(...args: any[]) => any>;
+        const showEmptyState: PropTypes.Requireable<boolean>;
+        const className: PropTypes.Requireable<string>;
+    }
+}
+import PropTypes from "prop-types";

package/transpiled/react/MemberList/index.js

@@ -0,0 +1,63 @@
+import PropTypes from 'prop-types';
+import React from 'react';
+import { useGetIsMounted } from 'rooks';
+import EmptyMembers from "cozy-ui/transpiled/react/MemberList/EmptyMembers";
+import List from "cozy-ui/transpiled/react/List";
+import MemberRow from "cozy-ui/transpiled/react/MemberRow";
+import { memberPropType, rolesPropType } from "cozy-ui/transpiled/react/MemberRow/propTypes";
+/**
+ * Lists the members of a sharing, the owner first
+ *
+ * @param {object} props
+ * @param {object[]} props.members - Members to display, see `MemberRow`
+ * @param {object[]} props.roles - Roles a member can get, as `{ value, label }`
+ * @param {Function} props.onRoleChange - Called with the member and its new role
+ * @param {Function} props.onRemove - Called with the member to remove
+ * @param {boolean} [props.showEmptyState] - Whether to show a placeholder
+ * when there is no member but the owner
+ * @param {string} [props.className] - Class name of the list
+ */
+
+var MemberList = function MemberList(_ref) {
+  var members = _ref.members,
+      roles = _ref.roles,
+      onRoleChange = _ref.onRoleChange,
+      onRemove = _ref.onRemove,
+      _ref$showEmptyState = _ref.showEmptyState,
+      showEmptyState = _ref$showEmptyState === void 0 ? true : _ref$showEmptyState,
+      className = _ref.className;
+  var getIsMounted = useGetIsMounted();
+  var owner = members.find(function (member) {
+    return member.isOwner;
+  });
+  var otherMembers = members.filter(function (member) {
+    return !member.isOwner;
+  });
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(List, {
+    className: className
+  }, owner && /*#__PURE__*/React.createElement(MemberRow, {
+    member: owner,
+    roles: roles,
+    onRoleChange: onRoleChange,
+    onRemove: onRemove
+  }), otherMembers.map(function (member) {
+    return /*#__PURE__*/React.createElement(MemberRow, {
+      key: member.id,
+      member: member,
+      roles: roles,
+      isNew: getIsMounted(),
+      onRoleChange: onRoleChange,
+      onRemove: onRemove
+    });
+  })), showEmptyState && otherMembers.length === 0 && /*#__PURE__*/React.createElement(EmptyMembers, null));
+};
+
+MemberList.propTypes = {
+  members: PropTypes.arrayOf(memberPropType).isRequired,
+  roles: rolesPropType.isRequired,
+  onRoleChange: PropTypes.func.isRequired,
+  onRemove: PropTypes.func.isRequired,
+  showEmptyState: PropTypes.bool,
+  className: PropTypes.string
+};
+export default MemberList;

package/transpiled/react/MemberList/locales/index.d.ts

@@ -0,0 +1,16 @@
+export namespace locales {
+    export { de };
+    export { en };
+    export { es };
+    export { fr };
+    export { it };
+    export { ru };
+    export { vi };
+}
+import de from "./de.json";
+import en from "./en.json";
+import es from "./es.json";
+import fr from "./fr.json";
+import it from "./it.json";
+import ru from "./ru.json";
+import vi from "./vi.json";

package/transpiled/react/MemberList/locales/index.js

@@ -0,0 +1,65 @@
+var de = {
+  MemberList: {
+    empty: {
+      title: "Noch niemand hinzugef\xFCgt",
+      subtitle: "Eingeladene Personen werden hier angezeigt."
+    }
+  }
+};
+var en = {
+  MemberList: {
+    empty: {
+      title: "No one has been added yet",
+      subtitle: "People invited to join will be listed here."
+    }
+  }
+};
+var es = {
+  MemberList: {
+    empty: {
+      title: "Todav\xEDa no se ha a\xF1adido a nadie",
+      subtitle: "Las personas invitadas aparecer\xE1n aqu\xED."
+    }
+  }
+};
+var fr = {
+  MemberList: {
+    empty: {
+      title: "Personne n'a encore \xE9t\xE9 ajout\xE9",
+      subtitle: "Les personnes invit\xE9es appara\xEEtront ici."
+    }
+  }
+};
+var it = {
+  MemberList: {
+    empty: {
+      title: "Nessuno \xE8 stato ancora aggiunto",
+      subtitle: "Le persone invitate verranno elencate qui."
+    }
+  }
+};
+var ru = {
+  MemberList: {
+    empty: {
+      title: "\u041F\u043E\u043A\u0430 \u043D\u0438\u043A\u0442\u043E \u043D\u0435 \u0434\u043E\u0431\u0430\u0432\u043B\u0435\u043D",
+      subtitle: "\u0417\u0434\u0435\u0441\u044C \u043F\u043E\u044F\u0432\u044F\u0442\u0441\u044F \u043F\u0440\u0438\u0433\u043B\u0430\u0448\u0451\u043D\u043D\u044B\u0435 \u043F\u043E\u043B\u044C\u0437\u043E\u0432\u0430\u0442\u0435\u043B\u0438."
+    }
+  }
+};
+var vi = {
+  MemberList: {
+    empty: {
+      title: "Ch\u01B0a c\xF3 ai \u0111\u01B0\u1EE3c th\xEAm",
+      subtitle: "Nh\u1EEFng ng\u01B0\u1EDDi \u0111\u01B0\u1EE3c m\u1EDDi s\u1EBD hi\u1EC3n th\u1ECB t\u1EA1i \u0111\xE2y."
+    }
+  }
+};
+export var locales = {
+  de: de,
+  en: en,
+  es: es,
+  fr: fr,
+  it: it,
+  ru: ru,
+  vi: vi
+};

package/transpiled/react/MemberRow/MemberAvatar.d.ts

@@ -0,0 +1,6 @@
+export default MemberAvatar;
+declare function MemberAvatar({ initials, avatarUrl, ...rest }: {
+    [x: string]: any;
+    initials: any;
+    avatarUrl: any;
+}): JSX.Element;

package/transpiled/react/MemberRow/MemberAvatar.js

@@ -0,0 +1,34 @@
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+var _excluded = ["initials", "avatarUrl"];
+import React, { useState } from 'react';
+import Avatar from "cozy-ui/transpiled/react/Avatar";
+
+var MemberAvatar = function MemberAvatar(_ref) {
+  var initials = _ref.initials,
+      avatarUrl = _ref.avatarUrl,
+      rest = _objectWithoutProperties(_ref, _excluded);
+
+  // Remember which image url failed to load so we can fall back to the
+  // initials. Storing the url (instead of a boolean) means a new url is
+  // retried automatically, without an effect to reset the error state.
+  var _useState = useState(null),
+      _useState2 = _slicedToArray(_useState, 2),
+      erroredSrc = _useState2[0],
+      setErroredSrc = _useState2[1]; // The avatar can become unreachable (eg. the related sharing is revoked
+  // while its members are still rendered), in which case the image request
+  // fails. Without a fallback the browser shows a broken-image icon, so we
+  // render the initials instead.
+
+
+  return /*#__PURE__*/React.createElement(Avatar, rest, avatarUrl && erroredSrc !== avatarUrl ? /*#__PURE__*/React.createElement("img", {
+    width: "100%",
+    height: "100%",
+    src: avatarUrl,
+    onError: function onError() {
+      return setErroredSrc(avatarUrl);
+    }
+  }) : initials);
+};
+
+export default MemberAvatar;

package/transpiled/react/MemberRow/MemberAvatar.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/transpiled/react/MemberRow/MemberGroupAvatar.d.ts

@@ -0,0 +1,6 @@
+export default MemberGroupAvatar;
+declare function MemberGroupAvatar({ size, color, className }: {
+    size: any;
+    color?: string | undefined;
+    className: any;
+}): JSX.Element;

package/transpiled/react/MemberRow/MemberGroupAvatar.js

@@ -0,0 +1,21 @@
+import { Icon, Peoples } from '@linagora/twake-icons';
+import React from 'react';
+import Avatar, { colorToGradient } from "cozy-ui/transpiled/react/Avatar";
+import { COLORS } from "cozy-ui/transpiled/react/ColorList/helpers";
+var DEFAULT_COLOR = COLORS[4];
+
+var MemberGroupAvatar = function MemberGroupAvatar(_ref) {
+  var size = _ref.size,
+      _ref$color = _ref.color,
+      color = _ref$color === void 0 ? DEFAULT_COLOR : _ref$color,
+      className = _ref.className;
+  return /*#__PURE__*/React.createElement(Avatar, {
+    size: size,
+    color: colorToGradient(color),
+    className: className
+  }, /*#__PURE__*/React.createElement(Icon, {
+    icon: Peoples
+  }));
+};
+
+export default MemberGroupAvatar;

package/transpiled/react/MemberRow/MemberRoleMenu.d.ts

@@ -0,0 +1,45 @@
+export default MemberRoleMenu;
+declare function MemberRoleMenu({ member, value, roles, onChange }: {
+    member: any;
+    value: any;
+    roles: any;
+    onChange: any;
+}): JSX.Element;
+declare namespace MemberRoleMenu {
+    namespace propTypes {
+        const member: PropTypes.Validator<PropTypes.InferProps<{
+            id: PropTypes.Validator<string>;
+            name: PropTypes.Requireable<string>;
+            subtitle: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+            avatarUrl: PropTypes.Requireable<string>;
+            initials: PropTypes.Requireable<string>;
+            color: PropTypes.Requireable<string>;
+            isGroup: PropTypes.Requireable<boolean>;
+            isOwner: PropTypes.Requireable<boolean>;
+            isCurrentUser: PropTypes.Requireable<boolean>;
+            role: PropTypes.Requireable<string>;
+            roles: PropTypes.Requireable<(PropTypes.InferProps<{
+                value: PropTypes.Validator<string>;
+                label: PropTypes.Validator<string>;
+            }> | null)[]>;
+            canChangeRole: PropTypes.Requireable<boolean>;
+            canRemove: PropTypes.Requireable<boolean>;
+            removeIcon: PropTypes.Requireable<object>;
+            removeLabel: PropTypes.Requireable<string>;
+            action: PropTypes.Requireable<PropTypes.InferProps<{
+                label: PropTypes.Validator<string>;
+                onClick: PropTypes.Validator<(...args: any[]) => any>;
+            }>>;
+            isPending: PropTypes.Requireable<boolean>;
+            onClick: PropTypes.Requireable<(...args: any[]) => any>;
+            data: PropTypes.Requireable<any>;
+        }>>;
+        const value: PropTypes.Validator<string>;
+        const roles: PropTypes.Validator<(PropTypes.InferProps<{
+            value: PropTypes.Validator<string>;
+            label: PropTypes.Validator<string>;
+        }> | null)[]>;
+        const onChange: PropTypes.Validator<(...args: any[]) => any>;
+    }
+}
+import PropTypes from "prop-types";

package/transpiled/react/MemberRow/MemberRoleMenu.js

@@ -0,0 +1,87 @@
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import PropTypes from 'prop-types';
+import React, { useRef, useState } from 'react';
+import MemberRoleMenuHeader from "cozy-ui/transpiled/react/MemberRow/MemberRoleMenuHeader";
+import { memberPropType, rolesPropType } from "cozy-ui/transpiled/react/MemberRow/propTypes";
+import ActionsMenuItem from "cozy-ui/transpiled/react/ActionsMenu/ActionsMenuItem";
+import ActionsMenuWrapper from "cozy-ui/transpiled/react/ActionsMenu/ActionsMenuWrapper";
+import DropdownButton from "cozy-ui/transpiled/react/DropdownButton";
+import ListItemIcon from "cozy-ui/transpiled/react/ListItemIcon";
+import ListItemText from "cozy-ui/transpiled/react/ListItemText";
+import Radios from "cozy-ui/transpiled/react/Radios";
+import useBreakpoints from "cozy-ui/transpiled/react/providers/Breakpoints";
+
+var MemberRoleMenu = function MemberRoleMenu(_ref) {
+  var _roles$find;
+
+  var member = _ref.member,
+      value = _ref.value,
+      roles = _ref.roles,
+      onChange = _ref.onChange;
+
+  var _useBreakpoints = useBreakpoints(),
+      isMobile = _useBreakpoints.isMobile;
+
+  var buttonRef = useRef();
+
+  var _useState = useState(false),
+      _useState2 = _slicedToArray(_useState, 2),
+      isMenuDisplayed = _useState2[0],
+      setMenuDisplayed = _useState2[1];
+
+  var label = (_roles$find = roles.find(function (role) {
+    return role.value === value;
+  })) === null || _roles$find === void 0 ? void 0 : _roles$find.label;
+
+  var handleRoleClick = function handleRoleClick(role) {
+    if (role.value !== value) onChange(role.value);
+  };
+
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(DropdownButton, {
+    ref: buttonRef,
+    "aria-controls": "simple-menu",
+    "aria-haspopup": "true",
+    onClick: function onClick() {
+      return setMenuDisplayed(true);
+    },
+    textVariant: "body2"
+  }, label), /*#__PURE__*/React.createElement(ActionsMenuWrapper, {
+    open: isMenuDisplayed,
+    anchorEl: buttonRef.current,
+    getContentAnchorEl: null,
+    anchorOrigin: {
+      vertical: 'bottom',
+      horizontal: 'left'
+    },
+    transformOrigin: {
+      vertical: 'top',
+      horizontal: 'left'
+    },
+    keepMounted: true,
+    autoClose: true,
+    onClose: function onClose() {
+      return setMenuDisplayed(false);
+    }
+  }, isMobile && /*#__PURE__*/React.createElement(MemberRoleMenuHeader, {
+    member: member
+  }), roles.map(function (role) {
+    return /*#__PURE__*/React.createElement(ActionsMenuItem, {
+      key: role.value,
+      onClick: function onClick() {
+        return handleRoleClick(role);
+      }
+    }, /*#__PURE__*/React.createElement(ListItemIcon, null, /*#__PURE__*/React.createElement(Radios, {
+      checked: role.value === value
+    })), /*#__PURE__*/React.createElement(ListItemText, {
+      primary: role.label
+    }));
+  })));
+};
+
+MemberRoleMenu.propTypes = {
+  member: memberPropType.isRequired,
+  value: PropTypes.string.isRequired,
+  roles: rolesPropType.isRequired,
+  onChange: PropTypes.func.isRequired
+};
+export default MemberRoleMenu;

package/transpiled/react/MemberRow/MemberRoleMenu.spec.d.ts

@@ -0,0 +1 @@
+export {};