cozy-ui 128.2.0 → 128.3.0

package/transpiled/react/Contacts/AddModal/ContactForm/FieldInput.d.ts

@@ -0,0 +1,35 @@
+export default FieldInput;
+declare function FieldInput({ name, labelProps, attributes: { subFields, ...restAttributes }, contacts, error, helperText, label, required }: {
+    name: any;
+    labelProps: any;
+    attributes: {
+        [x: string]: any;
+        subFields: any;
+    };
+    contacts: any;
+    error: any;
+    helperText: any;
+    label: any;
+    required: any;
+}): JSX.Element;
+declare namespace FieldInput {
+    namespace propTypes {
+        export const name: PropTypes.Validator<string>;
+        export { labelPropTypes as labelProps };
+        export { fieldInputAttributesTypes as attributes };
+        export const contacts: PropTypes.Requireable<PropTypes.InferProps<{
+            data: PropTypes.Requireable<(object | null)[]>;
+        }>>;
+        export const id: PropTypes.Requireable<string>;
+        export const label: PropTypes.Requireable<string>;
+        export const required: PropTypes.Requireable<boolean>;
+    }
+    namespace defaultProps {
+        export const labelProps: null;
+        const required_1: boolean;
+        export { required_1 as required };
+    }
+}
+import PropTypes from "prop-types";
+import { labelPropTypes } from "../types";
+import { fieldInputAttributesTypes } from "../types";

package/transpiled/react/Contacts/AddModal/ContactForm/FieldInput.js

@@ -0,0 +1,126 @@
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+var _excluded = ["subFields"];
+import cx from 'classnames';
+import uniqueId from 'lodash/uniqueId';
+import PropTypes from 'prop-types';
+import React, { useState } from 'react';
+import { Field } from 'react-final-form';
+import FieldInputWrapper from "cozy-ui/transpiled/react/Contacts/AddModal/ContactForm/FieldInputWrapper";
+import HasValueCondition from "cozy-ui/transpiled/react/Contacts/AddModal/ContactForm/HasValueCondition";
+import { RelatedContactList } from "cozy-ui/transpiled/react/Contacts/AddModal/ContactForm/RelatedContactList";
+import { locales } from "cozy-ui/transpiled/react/Contacts/AddModal/ContactForm/locales";
+var styles = {
+  "contact-form-field__wrapper": "styles__contact-form-field__wrapper___39a5x"
+};
+import { useI18n, useExtendI18n } from "cozy-ui/transpiled/react/providers/I18n";
+import ContactAddressDialog from "cozy-ui/transpiled/react/Contacts/AddModal/ContactAddressDialog";
+import { fieldInputAttributesTypes, labelPropTypes } from "cozy-ui/transpiled/react/Contacts/AddModal/types";
+
+var FieldInput = function FieldInput(_ref) {
+  var name = _ref.name,
+      labelProps = _ref.labelProps,
+      _ref$attributes = _ref.attributes,
+      subFields = _ref$attributes.subFields,
+      restAttributes = _objectWithoutProperties(_ref$attributes, _excluded),
+      contacts = _ref.contacts,
+      error = _ref.error,
+      helperText = _ref.helperText,
+      label = _ref.label,
+      required = _ref.required;
+
+  var _useState = useState(uniqueId('field_')),
+      _useState2 = _slicedToArray(_useState, 1),
+      id = _useState2[0]; // state only use to generate id once and not at each render
+
+
+  var _useState3 = useState(false),
+      _useState4 = _slicedToArray(_useState3, 2),
+      hasBeenFocused = _useState4[0],
+      setHasBeenFocused = _useState4[1];
+
+  var _useState5 = useState(false),
+      _useState6 = _slicedToArray(_useState5, 2),
+      isAddressDialogOpen = _useState6[0],
+      setIsAddressDialogOpen = _useState6[1];
+
+  var _useState7 = useState(false),
+      _useState8 = _slicedToArray(_useState7, 2),
+      isRelatedContactDialogOpen = _useState8[0],
+      setIsRelatedContactDialogOpen = _useState8[1];
+
+  useExtendI18n(locales);
+
+  var _useI18n = useI18n(),
+      t = _useI18n.t;
+
+  var handleClick = function handleClick() {
+    if (name.includes('address')) {
+      setIsAddressDialogOpen(true);
+    }
+
+    if (name.includes('relatedContact')) {
+      setIsRelatedContactDialogOpen(true);
+    }
+  };
+
+  var onFocus = function onFocus() {
+    setHasBeenFocused(true);
+  };
+
+  return /*#__PURE__*/React.createElement("div", {
+    className: cx(styles['contact-form-field__wrapper'], 'u-flex', 'u-flex-column-s')
+  }, /*#__PURE__*/React.createElement(Field, {
+    required: required,
+    error: error,
+    helperText: helperText,
+    label: label,
+    id: id,
+    attributes: restAttributes,
+    name: name,
+    component: FieldInputWrapper,
+    onFocus: onFocus,
+    onClick: handleClick
+  }), isAddressDialogOpen && /*#__PURE__*/React.createElement(ContactAddressDialog, {
+    onClose: function onClose() {
+      return setIsAddressDialogOpen(false);
+    },
+    name: name,
+    subFields: subFields
+  }), isRelatedContactDialogOpen && /*#__PURE__*/React.createElement(RelatedContactList, {
+    onClose: function onClose() {
+      return setIsRelatedContactDialogOpen(false);
+    },
+    name: name,
+    contacts: contacts
+  }), labelProps && /*#__PURE__*/React.createElement(HasValueCondition, {
+    name: name,
+    otherCondition: hasBeenFocused
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "u-mt-half-s u-ml-half u-ml-0-s u-flex-shrink-0 u-w-auto u-miw-4"
+  }, /*#__PURE__*/React.createElement(Field, {
+    attributes: labelProps,
+    name: "".concat(name, "Label"),
+    label: t('Contacts.AddModal.ContactForm.fields.label'),
+    component: FieldInputWrapper,
+    onFocus: onFocus
+  }))));
+};
+
+FieldInput.propTypes = {
+  name: PropTypes.string.isRequired,
+  labelProps: labelPropTypes,
+  attributes: fieldInputAttributesTypes,
+  contacts: PropTypes.shape({
+    data: PropTypes.arrayOf(PropTypes.object)
+  }),
+  // Destructuring props
+  id: PropTypes.string,
+  label: PropTypes.string,
+  required: PropTypes.bool
+};
+FieldInput.defaultProps = {
+  labelProps: null,
+  required: false
+};
+export default FieldInput;

package/transpiled/react/Contacts/AddModal/ContactForm/FieldInputArray.d.ts

@@ -0,0 +1,14 @@
+export default FieldInputArray;
+declare function FieldInputArray({ attributes: { name, label, ...restAttributes }, contacts, formProps: { valid, submitFailed, errors } }: {
+    attributes: {
+        [x: string]: any;
+        name: any;
+        label: any;
+    };
+    contacts: any;
+    formProps: {
+        valid: any;
+        submitFailed: any;
+        errors: any;
+    };
+}): JSX.Element;

package/transpiled/react/Contacts/AddModal/ContactForm/FieldInputArray.js

@@ -0,0 +1,82 @@
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+var _excluded = ["name", "label"];
+import cx from 'classnames';
+import React from 'react';
+import { FieldArray } from 'react-final-form-arrays';
+import FieldInput from "cozy-ui/transpiled/react/Contacts/AddModal/ContactForm/FieldInput";
+import { fieldsRequired, addField, removeField } from "cozy-ui/transpiled/react/Contacts/AddModal/ContactForm/helpers";
+import { locales } from "cozy-ui/transpiled/react/Contacts/AddModal/ContactForm/locales";
+import Button from "cozy-ui/transpiled/react/Buttons";
+import Icon from "cozy-ui/transpiled/react/Icon";
+import IconButton from "cozy-ui/transpiled/react/IconButton";
+import CrossCircleIcon from "cozy-ui/transpiled/react/Icons/CrossCircle";
+import PlusIcon from "cozy-ui/transpiled/react/Icons/Plus";
+import ListItemIcon from "cozy-ui/transpiled/react/ListItemIcon";
+import { useI18n, useExtendI18n } from "cozy-ui/transpiled/react/providers/I18n";
+
+var FieldInputArray = function FieldInputArray(_ref) {
+  var _ref$attributes = _ref.attributes,
+      name = _ref$attributes.name,
+      label = _ref$attributes.label,
+      restAttributes = _objectWithoutProperties(_ref$attributes, _excluded),
+      contacts = _ref.contacts,
+      _ref$formProps = _ref.formProps,
+      valid = _ref$formProps.valid,
+      submitFailed = _ref$formProps.submitFailed,
+      errors = _ref$formProps.errors;
+
+  useExtendI18n(locales);
+
+  var _useI18n = useI18n(),
+      t = _useI18n.t;
+
+  return /*#__PURE__*/React.createElement(FieldArray, {
+    name: name
+  }, function (_ref2) {
+    var fields = _ref2.fields;
+    return /*#__PURE__*/React.createElement(React.Fragment, null, fields.map(function (nameWithIndex, index) {
+      var _fields$value$index, _fields$value$index2;
+
+      var key = ((_fields$value$index = fields.value[index]) === null || _fields$value$index === void 0 ? void 0 : _fields$value$index.fieldId) || nameWithIndex;
+      var showRemove = (_fields$value$index2 = fields.value[index]) === null || _fields$value$index2 === void 0 ? void 0 : _fields$value$index2[name];
+      var inputName = "".concat(nameWithIndex, ".").concat(name);
+      var isError = fieldsRequired.includes(inputName) && !valid && submitFailed;
+      return /*#__PURE__*/React.createElement("div", {
+        key: key,
+        className: cx('u-flex u-flex-items-center', {
+          'u-mt-1': index !== 0
+        })
+      }, /*#__PURE__*/React.createElement(FieldInput, {
+        attributes: restAttributes,
+        contacts: contacts,
+        error: isError,
+        helperText: isError ? errors[inputName] : null,
+        name: inputName,
+        label: t("Contacts.AddModal.ContactForm.fields.".concat(name)),
+        labelProps: label
+      }), showRemove && /*#__PURE__*/React.createElement(ListItemIcon, {
+        className: "u-ml-half"
+      }, /*#__PURE__*/React.createElement(IconButton, {
+        "aria-label": "delete",
+        color: "error",
+        size: "medium",
+        onClick: function onClick() {
+          return removeField(fields, index);
+        }
+      }, /*#__PURE__*/React.createElement(Icon, {
+        icon: CrossCircleIcon
+      }))));
+    }), /*#__PURE__*/React.createElement(Button, {
+      variant: "text",
+      startIcon: /*#__PURE__*/React.createElement(Icon, {
+        icon: PlusIcon
+      }),
+      onClick: function onClick() {
+        return addField(fields);
+      },
+      label: t("Contacts.AddModal.ContactForm.addLabel.".concat(name))
+    }));
+  });
+};
+
+export default FieldInputArray;

package/transpiled/react/Contacts/AddModal/ContactForm/FieldInputLayout.d.ts

@@ -0,0 +1,20 @@
+export default FieldInputLayout;
+declare function FieldInputLayout({ attributes: { isArray, icon, ...attributes }, contacts, formProps }: {
+    attributes: {
+        [x: string]: any;
+        isArray: any;
+        icon: any;
+    };
+    contacts: any;
+    formProps: any;
+}): JSX.Element;
+declare namespace FieldInputLayout {
+    namespace propTypes {
+        const attributes: PropTypes.Requireable<object>;
+        const contacts: PropTypes.Requireable<PropTypes.InferProps<{
+            data: PropTypes.Requireable<(object | null)[]>;
+        }>>;
+        const formProps: PropTypes.Requireable<object>;
+    }
+}
+import PropTypes from "prop-types";

package/transpiled/react/Contacts/AddModal/ContactForm/FieldInputLayout.js

@@ -0,0 +1,70 @@
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+var _excluded = ["isArray", "icon"],
+    _excluded2 = ["name", "label"];
+import cx from 'classnames';
+import PropTypes from 'prop-types';
+import React from 'react';
+import FieldInput from "cozy-ui/transpiled/react/Contacts/AddModal/ContactForm/FieldInput";
+import FieldInputArray from "cozy-ui/transpiled/react/Contacts/AddModal/ContactForm/FieldInputArray";
+import { fieldsRequired } from "cozy-ui/transpiled/react/Contacts/AddModal/ContactForm/helpers";
+import { locales } from "cozy-ui/transpiled/react/Contacts/AddModal/ContactForm/locales";
+import Icon from "cozy-ui/transpiled/react/Icon";
+import { useI18n, useExtendI18n } from "cozy-ui/transpiled/react/providers/I18n";
+
+var FieldInputLayout = function FieldInputLayout(_ref) {
+  var _ref$attributes = _ref.attributes,
+      isArray = _ref$attributes.isArray,
+      icon = _ref$attributes.icon,
+      attributes = _objectWithoutProperties(_ref$attributes, _excluded),
+      contacts = _ref.contacts,
+      formProps = _ref.formProps;
+
+  useExtendI18n(locales);
+
+  var _useI18n = useI18n(),
+      t = _useI18n.t;
+
+  var valid = formProps.valid,
+      submitFailed = formProps.submitFailed,
+      errors = formProps.errors;
+
+  var name = attributes.name,
+      label = attributes.label,
+      restAttributes = _objectWithoutProperties(attributes, _excluded2);
+
+  var isError = fieldsRequired.includes(name) && !valid && submitFailed;
+  return /*#__PURE__*/React.createElement("div", {
+    className: cx('u-flex u-mt-1', {
+      'u-flex-items-center': !isArray,
+      'u-flex-items-baseline': isArray
+    })
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "u-w-2-half"
+  }, icon && /*#__PURE__*/React.createElement(Icon, {
+    icon: icon,
+    color: "var(--iconTextColor)"
+  })), /*#__PURE__*/React.createElement("div", {
+    className: "u-w-100"
+  }, isArray ? /*#__PURE__*/React.createElement(FieldInputArray, {
+    attributes: attributes,
+    contacts: contacts,
+    formProps: formProps
+  }) : /*#__PURE__*/React.createElement(FieldInput, {
+    attributes: restAttributes,
+    contacts: contacts,
+    error: isError,
+    helperText: isError ? errors[name] : null,
+    name: name,
+    label: t("Contacts.AddModal.ContactForm.fields.".concat(name)),
+    labelProps: label
+  })));
+};
+
+FieldInputLayout.propTypes = {
+  attributes: PropTypes.object,
+  contacts: PropTypes.shape({
+    data: PropTypes.arrayOf(PropTypes.object)
+  }),
+  formProps: PropTypes.object
+};
+export default FieldInputLayout;

package/transpiled/react/Contacts/AddModal/ContactForm/FieldInputWrapper.d.ts

@@ -0,0 +1,16 @@
+export default FieldInputWrapper;
+declare function FieldInputWrapper({ input, attributes, variant, fullWidth, ...props }: {
+    [x: string]: any;
+    input: any;
+    attributes: any;
+    variant: any;
+    fullWidth: any;
+}): JSX.Element;
+declare namespace FieldInputWrapper {
+    export { FieldInputWrapperPropTypes as propTypes };
+    export namespace defaultProps {
+        const variant: string;
+        const fullWidth: boolean;
+    }
+}
+import { FieldInputWrapperPropTypes } from "../types";

package/transpiled/react/Contacts/AddModal/ContactForm/FieldInputWrapper.js

@@ -0,0 +1,31 @@
+import _extends from "@babel/runtime/helpers/extends";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+var _excluded = ["input", "attributes", "variant", "fullWidth"];
+import React from 'react';
+import TextFieldCustomLabelSelect from "cozy-ui/transpiled/react/Contacts/AddModal/ContactForm/TextFieldCustomLabelSelect";
+import TextFieldSelect from "cozy-ui/transpiled/react/Contacts/AddModal/ContactForm/TextFieldSelect";
+import TextField from "cozy-ui/transpiled/react/TextField";
+import { FieldInputWrapperPropTypes } from "cozy-ui/transpiled/react/Contacts/AddModal/types"; // component used to flatten props to ensure compatibility
+// between Field from react-final-form and TextField from Mui
+
+var FieldInputWrapper = function FieldInputWrapper(_ref) {
+  var input = _ref.input,
+      attributes = _ref.attributes,
+      variant = _ref.variant,
+      fullWidth = _ref.fullWidth,
+      props = _objectWithoutProperties(_ref, _excluded);
+
+  var Component = attributes.customLabelOptions ? TextFieldCustomLabelSelect : attributes !== null && attributes !== void 0 && attributes.select ? TextFieldSelect : TextField;
+  return /*#__PURE__*/React.createElement(Component, _extends({}, attributes, input, props, {
+    variant: variant,
+    fullWidth: fullWidth,
+    minRows: "2"
+  }));
+};
+
+FieldInputWrapper.propTypes = FieldInputWrapperPropTypes;
+FieldInputWrapper.defaultProps = {
+  variant: 'outlined',
+  fullWidth: true
+};
+export default FieldInputWrapper;

package/transpiled/react/Contacts/AddModal/ContactForm/HasValueCondition.d.ts

@@ -0,0 +1,18 @@
+export default HasValueCondition;
+declare function HasValueCondition({ children, otherCondition, name }: {
+    children: any;
+    otherCondition: any;
+    name: any;
+}): JSX.Element;
+declare namespace HasValueCondition {
+    namespace defaultProps {
+        const otherCondition: undefined;
+    }
+    namespace propTypes {
+        export const children: PropTypes.Validator<PropTypes.ReactElementLike>;
+        export const name: PropTypes.Validator<string>;
+        const otherCondition_1: PropTypes.Requireable<boolean>;
+        export { otherCondition_1 as otherCondition };
+    }
+}
+import PropTypes from "prop-types";

package/transpiled/react/Contacts/AddModal/ContactForm/HasValueCondition.js

@@ -0,0 +1,32 @@
+/*
+  Wrapper for react-final-form field that renders it children only if the field
+  with the given name has a truthy value or if the other condition is fulfilled
+*/
+import PropTypes from 'prop-types';
+import React from 'react';
+import { Field } from 'react-final-form';
+
+var HasValueCondition = function HasValueCondition(_ref) {
+  var children = _ref.children,
+      otherCondition = _ref.otherCondition,
+      name = _ref.name;
+  return /*#__PURE__*/React.createElement(Field, {
+    name: name,
+    subscription: {
+      value: true
+    }
+  }, function (_ref2) {
+    var value = _ref2.input.value;
+    return otherCondition !== undefined && otherCondition || value ? children : null;
+  });
+};
+
+HasValueCondition.defaultProps = {
+  otherCondition: undefined
+};
+HasValueCondition.propTypes = {
+  children: PropTypes.element.isRequired,
+  name: PropTypes.string.isRequired,
+  otherCondition: PropTypes.bool
+};
+export default HasValueCondition;

package/transpiled/react/Contacts/AddModal/ContactForm/HasValueCondition.spec.d.ts

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

package/transpiled/react/Contacts/AddModal/ContactForm/RelatedContactList.d.ts

@@ -0,0 +1,15 @@
+export function RelatedContactList({ name, onClose, contacts }: {
+    name: any;
+    onClose: any;
+    contacts: any;
+}): JSX.Element;
+export namespace RelatedContactList {
+    namespace propTypes {
+        const name: PropTypes.Validator<string>;
+        const onClose: PropTypes.Validator<(...args: any[]) => any>;
+        const contacts: PropTypes.Validator<PropTypes.InferProps<{
+            data: PropTypes.Requireable<(object | null)[]>;
+        }>>;
+    }
+}
+import PropTypes from "prop-types";

package/transpiled/react/Contacts/AddModal/ContactForm/RelatedContactList.js

@@ -0,0 +1,39 @@
+import PropTypes from 'prop-types';
+import React from 'react';
+import { useForm } from 'react-final-form';
+import { makeDisplayName } from 'cozy-client/dist/models/contact';
+import ContactsListModal from "cozy-ui/transpiled/react/ContactsListModal";
+export var RelatedContactList = function RelatedContactList(_ref) {
+  var name = _ref.name,
+      onClose = _ref.onClose,
+      contacts = _ref.contacts;
+
+  var _useForm = useForm(),
+      change = _useForm.change;
+  /**
+   * @param {import('cozy-client/types/types').IOCozyContact} contact
+   */
+
+
+  var onClickContactsListModal = function onClickContactsListModal(contact) {
+    // Use `makeDisplayName` because if the contact is newly created, it has no `displayName` attribute. (Creation of a contact when selecting a linked contact)
+    change(name, makeDisplayName(contact));
+    change("".concat(name, "Id"), contact._id);
+    onClose();
+  };
+
+  return /*#__PURE__*/React.createElement(ContactsListModal, {
+    dismissAction: onClose,
+    onItemClick: function onItemClick(contact) {
+      return onClickContactsListModal(contact);
+    },
+    contacts: contacts
+  });
+};
+RelatedContactList.propTypes = {
+  name: PropTypes.string.isRequired,
+  onClose: PropTypes.func.isRequired,
+  contacts: PropTypes.shape({
+    data: PropTypes.arrayOf(PropTypes.object)
+  }).isRequired
+};

package/transpiled/react/Contacts/AddModal/ContactForm/TextFieldCustomLabelSelect.d.ts

@@ -0,0 +1,9 @@
+export default TextFieldCustomLabelSelect;
+declare function TextFieldCustomLabelSelect({ name, value, options, customLabelOptions, onChange, ...props }: {
+    [x: string]: any;
+    name: any;
+    value: any;
+    options: any;
+    customLabelOptions: any;
+    onChange: any;
+}): JSX.Element;

package/transpiled/react/Contacts/AddModal/ContactForm/TextFieldCustomLabelSelect.js

@@ -0,0 +1,81 @@
+import _extends from "@babel/runtime/helpers/extends";
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+var _excluded = ["name", "value", "options", "customLabelOptions", "onChange"];
+import React, { useState } from 'react';
+import TextFieldSelect from "cozy-ui/transpiled/react/Contacts/AddModal/ContactForm/TextFieldSelect";
+import { makeCustomLabel, makeInitialCustomValue } from "cozy-ui/transpiled/react/Contacts/AddModal/ContactForm/helpers";
+import { locales } from "cozy-ui/transpiled/react/Contacts/AddModal/ContactForm/locales";
+import { useI18n, useExtendI18n } from "cozy-ui/transpiled/react/providers/I18n";
+import CustomLabelDialog from "cozy-ui/transpiled/react/Contacts/AddModal/CustomLabelDialog";
+import { FieldInputWrapperPropTypes } from "cozy-ui/transpiled/react/Contacts/AddModal/types";
+
+var TextFieldCustomLabelSelect = function TextFieldCustomLabelSelect(_ref) {
+  var name = _ref.name,
+      value = _ref.value,
+      options = _ref.options,
+      customLabelOptions = _ref.customLabelOptions,
+      _onChange = _ref.onChange,
+      props = _objectWithoutProperties(_ref, _excluded);
+
+  useExtendI18n(locales);
+
+  var _useI18n = useI18n(),
+      t = _useI18n.t;
+
+  var _useState = useState(false),
+      _useState2 = _slicedToArray(_useState, 2),
+      openModal = _useState2[0],
+      setOpenModal = _useState2[1];
+
+  var _useState3 = useState(function () {
+    return makeInitialCustomValue(name, value);
+  }),
+      _useState4 = _slicedToArray(_useState3, 2),
+      customValue = _useState4[0],
+      setCustomValue = _useState4[1];
+
+  var customOption = customValue ? [{
+    value: customValue,
+    label: makeCustomLabel(customValue, t),
+    translated: true,
+    onClick: function onClick() {
+      // trigger modal only if customValue is already selected
+      if (value === customValue) {
+        return setOpenModal(true);
+      }
+    }
+  }] : [{
+    value: 'skip',
+    label: 'Contacts.AddModal.ContactForm.label.custom',
+    onClick: function onClick() {
+      return setOpenModal(true);
+    }
+  }];
+
+  var _options = options.concat(customOption);
+
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(TextFieldSelect, _extends({}, props, {
+    name: name,
+    value: value,
+    options: _options,
+    onChange: function onChange(ev) {
+      if (ev.target.value === 'skip') {
+        return;
+      }
+
+      _onChange(ev);
+    }
+  })), openModal && /*#__PURE__*/React.createElement(CustomLabelDialog, {
+    customValue: customValue,
+    customLabelOptions: customLabelOptions,
+    setCustomValue: setCustomValue,
+    onSubmit: _onChange,
+    onClose: function onClose() {
+      return setOpenModal(false);
+    }
+  }));
+};
+
+TextFieldCustomLabelSelect.prototype = FieldInputWrapperPropTypes;
+export default TextFieldCustomLabelSelect;

package/transpiled/react/Contacts/AddModal/ContactForm/TextFieldSelect.d.ts

@@ -0,0 +1,5 @@
+export default TextFieldSelect;
+declare function TextFieldSelect({ options, ...props }: {
+    [x: string]: any;
+    options: any;
+}): JSX.Element;

package/transpiled/react/Contacts/AddModal/ContactForm/TextFieldSelect.js

@@ -0,0 +1,42 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+var _excluded = ["options"];
+
+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 from 'react';
+import { locales } from "cozy-ui/transpiled/react/Contacts/AddModal/ContactForm/locales";
+import MenuItem from "cozy-ui/transpiled/react/MenuItem";
+import TextField from "cozy-ui/transpiled/react/TextField";
+import { useI18n, useExtendI18n } from "cozy-ui/transpiled/react/providers/I18n";
+import { FieldInputWrapperPropTypes } from "cozy-ui/transpiled/react/Contacts/AddModal/types";
+
+var TextFieldSelect = function TextFieldSelect(_ref) {
+  var options = _ref.options,
+      props = _objectWithoutProperties(_ref, _excluded);
+
+  useExtendI18n(locales);
+
+  var _useI18n = useI18n(),
+      t = _useI18n.t;
+
+  var _options = _toConsumableArray(options.map(function (option) {
+    return _objectSpread(_objectSpread({}, option), {}, {
+      label: option.translated ? option.label : t(option.label)
+    });
+  }));
+
+  return /*#__PURE__*/React.createElement(TextField, props, _options.map(function (option, index) {
+    return /*#__PURE__*/React.createElement(MenuItem, {
+      key: "".concat(props.name, "-").concat(index),
+      value: option.value,
+      onClick: option.onClick
+    }, option.label);
+  }));
+};
+
+TextFieldSelect.prototype = FieldInputWrapperPropTypes;
+export default TextFieldSelect;

package/transpiled/react/Contacts/AddModal/ContactForm/contactToFormValues.d.ts

@@ -0,0 +1,2 @@
+export default contactToFormValues;
+declare function contactToFormValues(contact: any, t: any): any;