cozy-ui 75.0.0 → 75.1.0

package/CHANGELOG.md

@@ -1,3 +1,17 @@
+# [75.1.0](https://github.com/cozy/cozy-ui/compare/v75.0.1...v75.1.0) (2022-09-21)
+
+
+### Features
+
+* **Viewer:** Contact can now be edited ([2b9cee9](https://github.com/cozy/cozy-ui/commit/2b9cee9))
+
+## [75.0.1](https://github.com/cozy/cozy-ui/compare/v75.0.0...v75.0.1) (2022-09-20)
+
+
+### Bug Fixes
+
+* **Field:** Use ref instead of inputRef when using Input comp ([d7317a9](https://github.com/cozy/cozy-ui/commit/d7317a9))
+
 # [75.0.0](https://github.com/cozy/cozy-ui/compare/v74.7.0...v75.0.0) (2022-09-16)
 
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "cozy-ui",
-  "version": "75.0.0",
+  "version": "75.1.0",
   "description": "Cozy apps UI SDK",
   "main": "./index.js",
   "bin": {

package/react/ActionMenu/ActionMenuHeader.jsx

@@ -0,0 +1,18 @@
+import React from 'react'
+import PropTypes from 'prop-types'
+import cx from 'classnames'
+
+import styles from './styles.styl'
+
+export const ActionMenuHeader = ({ children, className }) => {
+  return (
+    <div className={cx(styles['c-actionmenu-header'], className)}>
+      {children}
+    </div>
+  )
+}
+
+ActionMenuHeader.propTypes = {
+  children: PropTypes.node,
+  className: PropTypes.string
+}

package/react/ActionMenu/ActionMenuItem.jsx

@@ -0,0 +1,47 @@
+import React from 'react'
+import PropTypes from 'prop-types'
+import cx from 'classnames'
+
+import { Media, Bd, Img } from '../Media'
+import { spacingProp } from '../Stack'
+
+import styles from './styles.styl'
+
+export const ActionMenuItem = ({
+  left,
+  children,
+  right,
+  onClick,
+  className,
+  contentSpacing
+}) => {
+  return (
+    <Media
+      className={cx(styles['c-actionmenu-item'], className)}
+      onClick={onClick}
+      align="top"
+    >
+      {left && <Img className="u-mh-1">{left}</Img>}
+      <Bd
+        className={cx(left ? 'u-mr-1' : 'u-mh-1', `u-stack-${contentSpacing}`)}
+      >
+        {children}
+      </Bd>
+      {right && <Img className="u-mr-1">{right}</Img>}
+    </Media>
+  )
+}
+
+ActionMenuItem.propTypes = {
+  left: PropTypes.node,
+  right: PropTypes.node,
+  children: PropTypes.node,
+  onClick: PropTypes.func,
+  className: PropTypes.string,
+  /** Controls spacing between between children of the ActionMenuItem */
+  contentSpacing: spacingProp
+}
+
+ActionMenuItem.defaultProps = {
+  contentSpacing: 'xs'
+}

package/react/ActionMenu/ActionMenuRadio.jsx

@@ -0,0 +1,9 @@
+import React from 'react'
+
+import Radio from '../Radio'
+
+import styles from './styles.styl'
+
+export const ActionMenuRadio = props => {
+  return <Radio {...props} className={styles['c-actionmenu-radio']} />
+}

package/react/ActionMenu/ActionMenuWrapper.jsx

@@ -0,0 +1,32 @@
+import React from 'react'
+
+import BottomDrawer from '../BottomDrawer'
+import NotInlineWrapper from './NotInlineWrapper'
+
+const ActionMenuWrapper = ({
+  inline,
+  onClose,
+  anchorElRef,
+  popperOptions,
+  placement,
+  preventOverflow,
+  children
+}) => {
+  if (!inline) {
+    return <BottomDrawer onClose={onClose}>{children}</BottomDrawer>
+  }
+
+  return (
+    <NotInlineWrapper
+      anchorElRef={anchorElRef}
+      popperOptions={popperOptions}
+      placement={placement}
+      preventOverflow={preventOverflow}
+      onClose={onClose}
+    >
+      {children}
+    </NotInlineWrapper>
+  )
+}
+
+export default ActionMenuWrapper

package/react/ActionMenu/NotInlineWrapper.jsx

@@ -0,0 +1,59 @@
+import React, { useState } from 'react'
+import { usePopper } from 'react-popper'
+import ClickAwayListener from '@material-ui/core/ClickAwayListener'
+
+import { getCssVariableValue } from '../utils/color'
+
+const NotInlineWrapper = ({
+  anchorElRef,
+  popperOptions,
+  placement,
+  preventOverflow,
+  onClose,
+  children
+}) => {
+  const [popperElement, setPopperElement] = useState(null)
+  const referenceElement = anchorElRef ? anchorElRef.current : null
+
+  const normalOverflowModifiers = [
+    {
+      name: 'preventOverflow',
+      enabled: false
+    },
+    {
+      name: 'hide',
+      enabled: false
+    }
+  ]
+  const options = popperOptions || {
+    placement,
+    modifiers: preventOverflow ? undefined : normalOverflowModifiers
+  }
+
+  const { styles, attributes } = usePopper(
+    referenceElement,
+    popperElement,
+    options
+  )
+
+  const handleClose = e => {
+    if (referenceElement.contains(e.target)) return
+    onClose(e)
+  }
+  return (
+    <div
+      ref={setPopperElement}
+      style={{
+        ...styles.popper,
+        zIndex: getCssVariableValue('zIndex-popover')
+      }}
+      {...attributes.popper}
+    >
+      <ClickAwayListener onClickAway={handleClose}>
+        {children}
+      </ClickAwayListener>
+    </div>
+  )
+}
+
+export default NotInlineWrapper

package/react/ActionMenu/index.jsx

@@ -1,93 +1,17 @@
-import ClickAwayListener from '@material-ui/core/ClickAwayListener'
-import PropTypes from 'prop-types'
 import React from 'react'
+import PropTypes from 'prop-types'
 import cx from 'classnames'
-import { usePopper } from 'react-popper'
 
-import BottomDrawer from '../BottomDrawer'
-import Radio from '../Radio'
 import createDepreciationLogger from '../helpers/createDepreciationLogger'
-import styles from './styles.styl'
 import useBreakpoints from '../hooks/useBreakpoints'
-import { Media, Bd, Img } from '../Media'
-import { getCssVariableValue } from '../utils/color'
-import { spacingProp } from '../Stack'
+import ActionMenuWrapper from './ActionMenuWrapper'
+import { ActionMenuHeader } from './ActionMenuHeader'
+import { ActionMenuItem } from './ActionMenuItem'
+import { ActionMenuRadio } from './ActionMenuRadio'
 import { useActionMenuEffects } from './ActionMenuEffects'
 
-const ActionMenuWrapper = ({
-  inline,
-  onClose,
-  anchorElRef,
-  popperOptions,
-  placement,
-  preventOverflow,
-  children
-}) => {
-  if (!inline) return <BottomDrawer onClose={onClose}>{children}</BottomDrawer>
-  return (
-    <NotInlineWrapper
-      anchorElRef={anchorElRef}
-      popperOptions={popperOptions}
-      placement={placement}
-      preventOverflow={preventOverflow}
-      onClose={onClose}
-    >
-      {children}
-    </NotInlineWrapper>
-  )
-}
-
-const NotInlineWrapper = ({
-  anchorElRef,
-  popperOptions,
-  placement,
-  preventOverflow,
-  onClose,
-  children
-}) => {
-  const [popperElement, setPopperElement] = React.useState(null)
-  const referenceElement = anchorElRef ? anchorElRef.current : null
-
-  const normalOverflowModifiers = [
-    {
-      name: 'preventOverflow',
-      enabled: false
-    },
-    {
-      name: 'hide',
-      enabled: false
-    }
-  ]
-  const options = popperOptions || {
-    placement,
-    modifiers: preventOverflow ? undefined : normalOverflowModifiers
-  }
-
-  const { styles, attributes } = usePopper(
-    referenceElement,
-    popperElement,
-    options
-  )
+import styles from './styles.styl'
 
-  const handleClose = e => {
-    if (referenceElement.contains(e.target)) return
-    onClose(e)
-  }
-  return (
-    <div
-      ref={setPopperElement}
-      style={{
-        ...styles.popper,
-        zIndex: getCssVariableValue('zIndex-popover')
-      }}
-      {...attributes.popper}
-    >
-      <ClickAwayListener onClickAway={handleClose}>
-        {children}
-      </ClickAwayListener>
-    </div>
-  )
-}
 const logDepecratedPlacement = createDepreciationLogger()
 const logDepecratedOverflow = createDepreciationLogger()
 const logDepecratedContainer = createDepreciationLogger()
@@ -183,61 +107,5 @@ ActionMenu.defaultProps = {
   autoclose: false
 }
 
-const ActionMenuHeader = ({ children, className }) => {
-  return (
-    <div className={cx(styles['c-actionmenu-header'], className)}>
-      {children}
-    </div>
-  )
-}
-
-ActionMenuHeader.propTypes = {
-  children: PropTypes.node,
-  className: PropTypes.string
-}
-
-const ActionMenuItem = ({
-  left,
-  children,
-  right,
-  onClick,
-  className,
-  contentSpacing
-}) => {
-  return (
-    <Media
-      className={cx(styles['c-actionmenu-item'], className)}
-      onClick={onClick}
-      align="top"
-    >
-      {left && <Img className="u-mh-1">{left}</Img>}
-      <Bd
-        className={cx(left ? 'u-mr-1' : 'u-mh-1', `u-stack-${contentSpacing}`)}
-      >
-        {children}
-      </Bd>
-      {right && <Img className="u-mr-1">{right}</Img>}
-    </Media>
-  )
-}
-
-const ActionMenuRadio = props => {
-  return <Radio {...props} className={styles['c-actionmenu-radio']} />
-}
-
-ActionMenuItem.propTypes = {
-  left: PropTypes.node,
-  right: PropTypes.node,
-  children: PropTypes.node,
-  onClick: PropTypes.func,
-  className: PropTypes.string,
-  /** Controls spacing between between children of the ActionMenuItem */
-  contentSpacing: spacingProp
-}
-
-ActionMenuItem.defaultProps = {
-  contentSpacing: 'xs'
-}
-
 export default ActionMenu
 export { ActionMenuHeader, ActionMenuItem, ActionMenuRadio }

package/react/Field/index.jsx

@@ -1,4 +1,4 @@
-import React from 'react'
+import React, { useState } from 'react'
 import cx from 'classnames'
 import omit from 'lodash/omit'
 import PropTypes from 'prop-types'
@@ -21,59 +21,52 @@ const inputSpecificPropTypes = {
   onKeyUp: PropTypes.func
 }
 
-class InputPassword extends React.Component {
-  state = {
-    visible: false
-  }
+const InputPassword = ({
+  hideLabel,
+  showLabel,
+  fullwidth,
+  secondaryComponent,
+  inputRef,
+  ...restProps
+}) => {
+  const [visible, setVisible] = useState(false)
 
-  toggleVisibility() {
-    this.setState({ visible: !this.state.visible })
+  const toggleVisibility = () => {
+    setVisible(visible => !visible)
   }
 
-  render() {
-    const {
-      hideLabel,
-      showLabel,
-      fullwidth,
-      secondaryComponent,
-      ...restProps
-    } = this.props
-    const { visible } = this.state
-
-    return (
-      <div className={styles['o-field-input']}>
-        {!secondaryComponent && (
-          <div
-            className={cx(
-              labelStyles['c-label'],
-              styles['o-field-input-action'],
-              { [styles['o-side-fullwidth']]: fullwidth }
-            )}
-            onClick={() => this.toggleVisibility()}
-          >
-            {visible ? hideLabel : showLabel}
-          </div>
-        )}
-        {secondaryComponent && (
-          <div
-            className={cx(styles['o-field-input-action'], {
-              [styles['o-side-fullwidth']]: fullwidth
-            })}
-            onClick={() => this.toggleVisibility()}
-          >
-            {secondaryComponent({
-              visible
-            })}
-          </div>
-        )}
-        <Input
-          {...restProps}
-          fullwidth={fullwidth}
-          type={visible ? 'text' : 'password'}
-        />
-      </div>
-    )
-  }
+  return (
+    <div className={styles['o-field-input']}>
+      {!secondaryComponent && (
+        <div
+          className={cx(
+            labelStyles['c-label'],
+            styles['o-field-input-action'],
+            { [styles['o-side-fullwidth']]: fullwidth }
+          )}
+          onClick={toggleVisibility}
+        >
+          {visible ? hideLabel : showLabel}
+        </div>
+      )}
+      {secondaryComponent && (
+        <div
+          className={cx(styles['o-field-input-action'], {
+            [styles['o-side-fullwidth']]: fullwidth
+          })}
+          onClick={toggleVisibility}
+        >
+          {secondaryComponent({ visible })}
+        </div>
+      )}
+      <Input
+        {...restProps}
+        ref={inputRef}
+        fullwidth={fullwidth}
+        type={visible ? 'text' : 'password'}
+      />
+    </div>
+  )
 }
 
 InputPassword.propTypes = {
@@ -207,7 +200,7 @@ const Field = props => {
             disabled={disabled}
             fullwidth={fullwidth}
             id={id}
-            inputRef={inputRef}
+            ref={inputRef}
             name={name}
             type={type}
             placeholder={placeholder}

package/react/Input/index.jsx

@@ -62,10 +62,6 @@ Input.propTypes = {
   error: PropTypes.bool,
   size: PropTypes.oneOf(['tiny', 'medium', 'large']),
   fullwidth: PropTypes.bool,
-  /**
-   * Use that property to pass a ref callback to the native input component.
-   */
-  inputRef: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
   onChange: PropTypes.func,
   onKeyUp: PropTypes.func
 }

package/react/Viewer/Panel/ActionMenuWrapper.jsx

@@ -14,7 +14,7 @@ import ActionMenuDesktop from './ActionMenuDesktop'
 const mespapiersAppSlug = 'mespapiers'
 
 const checkEditableAttribute = name => {
-  const isNotEditableAttributes = ['datetime', 'qualification', 'contact']
+  const isNotEditableAttributes = ['datetime', 'qualification']
   return !isNotEditableAttributes.includes(name)
 }
 

package/transpiled/react/ActionMenu/ActionMenuHeader.js

@@ -0,0 +1,21 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import cx from 'classnames';
+var styles = {
+  "c-actionmenu": "styles__c-actionmenu___22Fp1",
+  "c-actionmenu--inline": "styles__c-actionmenu--inline___1SXZa",
+  "c-actionmenu-header": "styles__c-actionmenu-header___2rcGc",
+  "c-actionmenu-item": "styles__c-actionmenu-item___gODqd",
+  "c-actionmenu-radio": "styles__c-actionmenu-radio___Km9uj"
+};
+export var ActionMenuHeader = function ActionMenuHeader(_ref) {
+  var children = _ref.children,
+      className = _ref.className;
+  return /*#__PURE__*/React.createElement("div", {
+    className: cx(styles['c-actionmenu-header'], className)
+  }, children);
+};
+ActionMenuHeader.propTypes = {
+  children: PropTypes.node,
+  className: PropTypes.string
+};

package/transpiled/react/ActionMenu/ActionMenuItem.js

@@ -0,0 +1,44 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import cx from 'classnames';
+import { Media, Bd, Img } from "cozy-ui/transpiled/react/Media";
+import { spacingProp } from "cozy-ui/transpiled/react/Stack";
+var styles = {
+  "c-actionmenu": "styles__c-actionmenu___22Fp1",
+  "c-actionmenu--inline": "styles__c-actionmenu--inline___1SXZa",
+  "c-actionmenu-header": "styles__c-actionmenu-header___2rcGc",
+  "c-actionmenu-item": "styles__c-actionmenu-item___gODqd",
+  "c-actionmenu-radio": "styles__c-actionmenu-radio___Km9uj"
+};
+export var ActionMenuItem = function ActionMenuItem(_ref) {
+  var left = _ref.left,
+      children = _ref.children,
+      right = _ref.right,
+      onClick = _ref.onClick,
+      className = _ref.className,
+      contentSpacing = _ref.contentSpacing;
+  return /*#__PURE__*/React.createElement(Media, {
+    className: cx(styles['c-actionmenu-item'], className),
+    onClick: onClick,
+    align: "top"
+  }, left && /*#__PURE__*/React.createElement(Img, {
+    className: "u-mh-1"
+  }, left), /*#__PURE__*/React.createElement(Bd, {
+    className: cx(left ? 'u-mr-1' : 'u-mh-1', "u-stack-".concat(contentSpacing))
+  }, children), right && /*#__PURE__*/React.createElement(Img, {
+    className: "u-mr-1"
+  }, right));
+};
+ActionMenuItem.propTypes = {
+  left: PropTypes.node,
+  right: PropTypes.node,
+  children: PropTypes.node,
+  onClick: PropTypes.func,
+  className: PropTypes.string,
+
+  /** Controls spacing between between children of the ActionMenuItem */
+  contentSpacing: spacingProp
+};
+ActionMenuItem.defaultProps = {
+  contentSpacing: 'xs'
+};

package/transpiled/react/ActionMenu/ActionMenuRadio.js

@@ -0,0 +1,15 @@
+import _extends from "@babel/runtime/helpers/extends";
+import React from 'react';
+import Radio from "cozy-ui/transpiled/react/Radio";
+var styles = {
+  "c-actionmenu": "styles__c-actionmenu___22Fp1",
+  "c-actionmenu--inline": "styles__c-actionmenu--inline___1SXZa",
+  "c-actionmenu-header": "styles__c-actionmenu-header___2rcGc",
+  "c-actionmenu-item": "styles__c-actionmenu-item___gODqd",
+  "c-actionmenu-radio": "styles__c-actionmenu-radio___Km9uj"
+};
+export var ActionMenuRadio = function ActionMenuRadio(props) {
+  return /*#__PURE__*/React.createElement(Radio, _extends({}, props, {
+    className: styles['c-actionmenu-radio']
+  }));
+};

package/transpiled/react/ActionMenu/ActionMenuWrapper.js

@@ -0,0 +1,29 @@
+import React from 'react';
+import BottomDrawer from "cozy-ui/transpiled/react/BottomDrawer";
+import NotInlineWrapper from "cozy-ui/transpiled/react/ActionMenu/NotInlineWrapper";
+
+var ActionMenuWrapper = function ActionMenuWrapper(_ref) {
+  var inline = _ref.inline,
+      onClose = _ref.onClose,
+      anchorElRef = _ref.anchorElRef,
+      popperOptions = _ref.popperOptions,
+      placement = _ref.placement,
+      preventOverflow = _ref.preventOverflow,
+      children = _ref.children;
+
+  if (!inline) {
+    return /*#__PURE__*/React.createElement(BottomDrawer, {
+      onClose: onClose
+    }, children);
+  }
+
+  return /*#__PURE__*/React.createElement(NotInlineWrapper, {
+    anchorElRef: anchorElRef,
+    popperOptions: popperOptions,
+    placement: placement,
+    preventOverflow: preventOverflow,
+    onClose: onClose
+  }, children);
+};
+
+export default ActionMenuWrapper;

package/transpiled/react/ActionMenu/NotInlineWrapper.js

@@ -0,0 +1,59 @@
+import _extends from "@babel/runtime/helpers/extends";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+
+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; }
+
+import React, { useState } from 'react';
+import { usePopper } from 'react-popper';
+import ClickAwayListener from '@material-ui/core/ClickAwayListener';
+import { getCssVariableValue } from "cozy-ui/transpiled/react/utils/color";
+
+var NotInlineWrapper = function NotInlineWrapper(_ref) {
+  var anchorElRef = _ref.anchorElRef,
+      popperOptions = _ref.popperOptions,
+      placement = _ref.placement,
+      preventOverflow = _ref.preventOverflow,
+      onClose = _ref.onClose,
+      children = _ref.children;
+
+  var _useState = useState(null),
+      _useState2 = _slicedToArray(_useState, 2),
+      popperElement = _useState2[0],
+      setPopperElement = _useState2[1];
+
+  var referenceElement = anchorElRef ? anchorElRef.current : null;
+  var normalOverflowModifiers = [{
+    name: 'preventOverflow',
+    enabled: false
+  }, {
+    name: 'hide',
+    enabled: false
+  }];
+  var options = popperOptions || {
+    placement: placement,
+    modifiers: preventOverflow ? undefined : normalOverflowModifiers
+  };
+
+  var _usePopper = usePopper(referenceElement, popperElement, options),
+      styles = _usePopper.styles,
+      attributes = _usePopper.attributes;
+
+  var handleClose = function handleClose(e) {
+    if (referenceElement.contains(e.target)) return;
+    onClose(e);
+  };
+
+  return /*#__PURE__*/React.createElement("div", _extends({
+    ref: setPopperElement,
+    style: _objectSpread(_objectSpread({}, styles.popper), {}, {
+      zIndex: getCssVariableValue('zIndex-popover')
+    })
+  }, attributes.popper), /*#__PURE__*/React.createElement(ClickAwayListener, {
+    onClickAway: handleClose
+  }, children));
+};
+
+export default NotInlineWrapper;

package/transpiled/react/ActionMenu/index.js

@@ -1,19 +1,14 @@
-import _extends from "@babel/runtime/helpers/extends";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
-import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
-
-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; }
-
-import ClickAwayListener from '@material-ui/core/ClickAwayListener';
-import PropTypes from 'prop-types';
 import React from 'react';
+import PropTypes from 'prop-types';
 import cx from 'classnames';
-import { usePopper } from 'react-popper';
-import BottomDrawer from "cozy-ui/transpiled/react/BottomDrawer";
-import Radio from "cozy-ui/transpiled/react/Radio";
 import createDepreciationLogger from "cozy-ui/transpiled/react/helpers/createDepreciationLogger";
+import useBreakpoints from "cozy-ui/transpiled/react/hooks/useBreakpoints";
+import ActionMenuWrapper from "cozy-ui/transpiled/react/ActionMenu/ActionMenuWrapper";
+import { ActionMenuHeader } from "cozy-ui/transpiled/react/ActionMenu/ActionMenuHeader";
+import { ActionMenuItem } from "cozy-ui/transpiled/react/ActionMenu/ActionMenuItem";
+import { ActionMenuRadio } from "cozy-ui/transpiled/react/ActionMenu/ActionMenuRadio";
+import { useActionMenuEffects } from "cozy-ui/transpiled/react/ActionMenu/ActionMenuEffects";
 var styles = {
   "c-actionmenu": "styles__c-actionmenu___22Fp1",
   "c-actionmenu--inline": "styles__c-actionmenu--inline___1SXZa",
@@ -21,91 +16,20 @@ var styles = {
   "c-actionmenu-item": "styles__c-actionmenu-item___gODqd",
   "c-actionmenu-radio": "styles__c-actionmenu-radio___Km9uj"
 };
-import useBreakpoints from "cozy-ui/transpiled/react/hooks/useBreakpoints";
-import { Media, Bd, Img } from "cozy-ui/transpiled/react/Media";
-import { getCssVariableValue } from "cozy-ui/transpiled/react/utils/color";
-import { spacingProp } from "cozy-ui/transpiled/react/Stack";
-import { useActionMenuEffects } from "cozy-ui/transpiled/react/ActionMenu/ActionMenuEffects";
-
-var ActionMenuWrapper = function ActionMenuWrapper(_ref) {
-  var inline = _ref.inline,
-      onClose = _ref.onClose,
-      anchorElRef = _ref.anchorElRef,
-      popperOptions = _ref.popperOptions,
-      placement = _ref.placement,
-      preventOverflow = _ref.preventOverflow,
-      children = _ref.children;
-  if (!inline) return /*#__PURE__*/React.createElement(BottomDrawer, {
-    onClose: onClose
-  }, children);
-  return /*#__PURE__*/React.createElement(NotInlineWrapper, {
-    anchorElRef: anchorElRef,
-    popperOptions: popperOptions,
-    placement: placement,
-    preventOverflow: preventOverflow,
-    onClose: onClose
-  }, children);
-};
-
-var NotInlineWrapper = function NotInlineWrapper(_ref2) {
-  var anchorElRef = _ref2.anchorElRef,
-      popperOptions = _ref2.popperOptions,
-      placement = _ref2.placement,
-      preventOverflow = _ref2.preventOverflow,
-      onClose = _ref2.onClose,
-      children = _ref2.children;
-
-  var _React$useState = React.useState(null),
-      _React$useState2 = _slicedToArray(_React$useState, 2),
-      popperElement = _React$useState2[0],
-      setPopperElement = _React$useState2[1];
-
-  var referenceElement = anchorElRef ? anchorElRef.current : null;
-  var normalOverflowModifiers = [{
-    name: 'preventOverflow',
-    enabled: false
-  }, {
-    name: 'hide',
-    enabled: false
-  }];
-  var options = popperOptions || {
-    placement: placement,
-    modifiers: preventOverflow ? undefined : normalOverflowModifiers
-  };
-
-  var _usePopper = usePopper(referenceElement, popperElement, options),
-      styles = _usePopper.styles,
-      attributes = _usePopper.attributes;
-
-  var handleClose = function handleClose(e) {
-    if (referenceElement.contains(e.target)) return;
-    onClose(e);
-  };
-
-  return /*#__PURE__*/React.createElement("div", _extends({
-    ref: setPopperElement,
-    style: _objectSpread(_objectSpread({}, styles.popper), {}, {
-      zIndex: getCssVariableValue('zIndex-popover')
-    })
-  }, attributes.popper), /*#__PURE__*/React.createElement(ClickAwayListener, {
-    onClickAway: handleClose
-  }, children));
-};
-
 var logDepecratedPlacement = createDepreciationLogger();
 var logDepecratedOverflow = createDepreciationLogger();
 var logDepecratedContainer = createDepreciationLogger();
 
-var ActionMenu = function ActionMenu(_ref3) {
-  var children = _ref3.children,
-      autoclose = _ref3.autoclose,
-      className = _ref3.className,
-      onClose = _ref3.onClose,
-      placement = _ref3.placement,
-      preventOverflow = _ref3.preventOverflow,
-      popperOptions = _ref3.popperOptions,
-      anchorElRef = _ref3.anchorElRef,
-      containerElRef = _ref3.containerElRef;
+var ActionMenu = function ActionMenu(_ref) {
+  var children = _ref.children,
+      autoclose = _ref.autoclose,
+      className = _ref.className,
+      onClose = _ref.onClose,
+      placement = _ref.placement,
+      preventOverflow = _ref.preventOverflow,
+      popperOptions = _ref.popperOptions,
+      anchorElRef = _ref.anchorElRef,
+      containerElRef = _ref.containerElRef;
   if (placement) logDepecratedPlacement('<ActionMenu placement /> is deprecated, use <ActionMenu popperOptions={{ placement }} /> instead');
   if (preventOverflow) logDepecratedOverflow('<ActionMenu preventOverflow /> is deprecated, use <ActionMenu popperOptions={{ modifiers }} /> instead');
   if (containerElRef) logDepecratedContainer('<ActionMenu containerElRef /> is not needed anymore, it can be removed.');
@@ -158,58 +82,5 @@ ActionMenu.defaultProps = {
   },
   autoclose: false
 };
-
-var ActionMenuHeader = function ActionMenuHeader(_ref4) {
-  var children = _ref4.children,
-      className = _ref4.className;
-  return /*#__PURE__*/React.createElement("div", {
-    className: cx(styles['c-actionmenu-header'], className)
-  }, children);
-};
-
-ActionMenuHeader.propTypes = {
-  children: PropTypes.node,
-  className: PropTypes.string
-};
-
-var ActionMenuItem = function ActionMenuItem(_ref5) {
-  var left = _ref5.left,
-      children = _ref5.children,
-      right = _ref5.right,
-      onClick = _ref5.onClick,
-      className = _ref5.className,
-      contentSpacing = _ref5.contentSpacing;
-  return /*#__PURE__*/React.createElement(Media, {
-    className: cx(styles['c-actionmenu-item'], className),
-    onClick: onClick,
-    align: "top"
-  }, left && /*#__PURE__*/React.createElement(Img, {
-    className: "u-mh-1"
-  }, left), /*#__PURE__*/React.createElement(Bd, {
-    className: cx(left ? 'u-mr-1' : 'u-mh-1', "u-stack-".concat(contentSpacing))
-  }, children), right && /*#__PURE__*/React.createElement(Img, {
-    className: "u-mr-1"
-  }, right));
-};
-
-var ActionMenuRadio = function ActionMenuRadio(props) {
-  return /*#__PURE__*/React.createElement(Radio, _extends({}, props, {
-    className: styles['c-actionmenu-radio']
-  }));
-};
-
-ActionMenuItem.propTypes = {
-  left: PropTypes.node,
-  right: PropTypes.node,
-  children: PropTypes.node,
-  onClick: PropTypes.func,
-  className: PropTypes.string,
-
-  /** Controls spacing between between children of the ActionMenuItem */
-  contentSpacing: spacingProp
-};
-ActionMenuItem.defaultProps = {
-  contentSpacing: 'xs'
-};
 export default ActionMenu;
 export { ActionMenuHeader, ActionMenuItem, ActionMenuRadio };

package/transpiled/react/Field/index.js

@@ -1,25 +1,16 @@
 import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
 import _extends from "@babel/runtime/helpers/extends";
-import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
-import _createClass from "@babel/runtime/helpers/createClass";
-import _assertThisInitialized from "@babel/runtime/helpers/assertThisInitialized";
-import _inherits from "@babel/runtime/helpers/inherits";
-import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
-import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
-var _excluded = ["hideLabel", "showLabel", "fullwidth", "secondaryComponent"],
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+var _excluded = ["hideLabel", "showLabel", "fullwidth", "secondaryComponent", "inputRef"],
     _excluded2 = ["className", "variant"];
 
 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 _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
-
-function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
-
-import React from 'react';
+import React, { useState } from 'react';
 import cx from 'classnames';
 import omit from 'lodash/omit';
 import PropTypes from 'prop-types';
@@ -56,72 +47,41 @@ var inputSpecificPropTypes = {
   onKeyUp: PropTypes.func
 };
 
-var InputPassword = /*#__PURE__*/function (_React$Component) {
-  _inherits(InputPassword, _React$Component);
-
-  var _super = _createSuper(InputPassword);
-
-  function InputPassword() {
-    var _this;
-
-    _classCallCheck(this, InputPassword);
-
-    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-      args[_key] = arguments[_key];
-    }
-
-    _this = _super.call.apply(_super, [this].concat(args));
-
-    _defineProperty(_assertThisInitialized(_this), "state", {
-      visible: false
+var InputPassword = function InputPassword(_ref) {
+  var hideLabel = _ref.hideLabel,
+      showLabel = _ref.showLabel,
+      fullwidth = _ref.fullwidth,
+      secondaryComponent = _ref.secondaryComponent,
+      inputRef = _ref.inputRef,
+      restProps = _objectWithoutProperties(_ref, _excluded);
+
+  var _useState = useState(false),
+      _useState2 = _slicedToArray(_useState, 2),
+      visible = _useState2[0],
+      setVisible = _useState2[1];
+
+  var toggleVisibility = function toggleVisibility() {
+    setVisible(function (visible) {
+      return !visible;
     });
+  };
 
-    return _this;
-  }
-
-  _createClass(InputPassword, [{
-    key: "toggleVisibility",
-    value: function toggleVisibility() {
-      this.setState({
-        visible: !this.state.visible
-      });
-    }
-  }, {
-    key: "render",
-    value: function render() {
-      var _this2 = this;
-
-      var _this$props = this.props,
-          hideLabel = _this$props.hideLabel,
-          showLabel = _this$props.showLabel,
-          fullwidth = _this$props.fullwidth,
-          secondaryComponent = _this$props.secondaryComponent,
-          restProps = _objectWithoutProperties(_this$props, _excluded);
-
-      var visible = this.state.visible;
-      return /*#__PURE__*/React.createElement("div", {
-        className: styles['o-field-input']
-      }, !secondaryComponent && /*#__PURE__*/React.createElement("div", {
-        className: cx(labelStyles['c-label'], styles['o-field-input-action'], _defineProperty({}, styles['o-side-fullwidth'], fullwidth)),
-        onClick: function onClick() {
-          return _this2.toggleVisibility();
-        }
-      }, visible ? hideLabel : showLabel), secondaryComponent && /*#__PURE__*/React.createElement("div", {
-        className: cx(styles['o-field-input-action'], _defineProperty({}, styles['o-side-fullwidth'], fullwidth)),
-        onClick: function onClick() {
-          return _this2.toggleVisibility();
-        }
-      }, secondaryComponent({
-        visible: visible
-      })), /*#__PURE__*/React.createElement(Input, _extends({}, restProps, {
-        fullwidth: fullwidth,
-        type: visible ? 'text' : 'password'
-      })));
-    }
-  }]);
-
-  return InputPassword;
-}(React.Component);
+  return /*#__PURE__*/React.createElement("div", {
+    className: styles['o-field-input']
+  }, !secondaryComponent && /*#__PURE__*/React.createElement("div", {
+    className: cx(labelStyles['c-label'], styles['o-field-input-action'], _defineProperty({}, styles['o-side-fullwidth'], fullwidth)),
+    onClick: toggleVisibility
+  }, visible ? hideLabel : showLabel), secondaryComponent && /*#__PURE__*/React.createElement("div", {
+    className: cx(styles['o-field-input-action'], _defineProperty({}, styles['o-side-fullwidth'], fullwidth)),
+    onClick: toggleVisibility
+  }, secondaryComponent({
+    visible: visible
+  })), /*#__PURE__*/React.createElement(Input, _extends({}, restProps, {
+    ref: inputRef,
+    fullwidth: fullwidth,
+    type: visible ? 'text' : 'password'
+  })));
+};
 
 InputPassword.propTypes = _objectSpread(_objectSpread({}, Input.propTypes), {}, {
   hideLabel: PropTypes.string,
@@ -236,7 +196,7 @@ var Field = function Field(props) {
           disabled: disabled,
           fullwidth: fullwidth,
           id: id,
-          inputRef: inputRef,
+          ref: inputRef,
           name: name,
           type: type,
           placeholder: placeholder,

package/transpiled/react/Input/index.js

@@ -54,11 +54,6 @@ Input.propTypes = {
   error: PropTypes.bool,
   size: PropTypes.oneOf(['tiny', 'medium', 'large']),
   fullwidth: PropTypes.bool,
-
-  /**
-   * Use that property to pass a ref callback to the native input component.
-   */
-  inputRef: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
   onChange: PropTypes.func,
   onKeyUp: PropTypes.func
 };

package/transpiled/react/Viewer/Panel/ActionMenuWrapper.js

@@ -11,7 +11,7 @@ import ActionMenuDesktop from "cozy-ui/transpiled/react/Viewer/Panel/ActionMenuD
 var mespapiersAppSlug = 'mespapiers';
 
 var checkEditableAttribute = function checkEditableAttribute(name) {
-  var isNotEditableAttributes = ['datetime', 'qualification', 'contact'];
+  var isNotEditableAttributes = ['datetime', 'qualification'];
   return !isNotEditableAttributes.includes(name);
 };