cozy-ui 131.1.0-beta.9 → 131.2.0

package/transpiled/react/ContactsList/Contacts/ContactIdentity.js

@@ -0,0 +1,67 @@
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+var _excluded = ["noWrapper"];
+import PropTypes from 'prop-types';
+import React from 'react';
+import { getInitials } from 'cozy-client/dist/models/contact';
+import ContactName from "cozy-ui/transpiled/react/ContactsList/Contacts/ContactName";
+import Avatar from "cozy-ui/transpiled/react/Avatar";
+import { TableCell } from "cozy-ui/transpiled/react/deprecated/Table";
+import { useI18n, useExtendI18n } from "cozy-ui/transpiled/react/providers/I18n";
+import { locales } from "cozy-ui/transpiled/react/ContactsList/locales/withContactsListLocales";
+var styles = {
+  "contact": "styles__contact___169nD",
+  "contact--clickable": "styles__contact--clickable___1GLTM",
+  "contact-phone": "styles__contact-phone___1sA_m",
+  "contact-cozyurl": "styles__contact-cozyurl___3kBp5",
+  "contact-email": "styles__contact-email___3n3q2",
+  "contact-myself": "styles__contact-myself___1aOdx",
+  "contact-identity": "styles__contact-identity___mL3IJ",
+  "contact-firstname": "styles__contact-firstname___2GPEr",
+  "contact-avatar": "styles__contact-avatar___3lZPs"
+};
+
+var MyselfMarker = function MyselfMarker() {
+  useExtendI18n(locales);
+
+  var _useI18n = useI18n(),
+      t = _useI18n.t;
+
+  return /*#__PURE__*/React.createElement("span", {
+    className: "".concat(styles['contact-myself'])
+  }, "(", t('me'), ")");
+};
+
+var ContactIdentity = function ContactIdentity(_ref) {
+  var contact = _ref.contact;
+  var isMyself = !!contact.me;
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Avatar, {
+    display: "inline",
+    size: "s"
+  }, getInitials(contact)), /*#__PURE__*/React.createElement(ContactName, {
+    contact: contact
+  }), isMyself && /*#__PURE__*/React.createElement(MyselfMarker, null));
+};
+
+ContactIdentity.propTypes = {
+  contact: PropTypes.object.isRequired
+};
+
+var ContactIdentityWrapper = function ContactIdentityWrapper(_ref2) {
+  var noWrapper = _ref2.noWrapper,
+      props = _objectWithoutProperties(_ref2, _excluded);
+
+  if (noWrapper) {
+    return /*#__PURE__*/React.createElement(ContactIdentity, props);
+  }
+
+  return /*#__PURE__*/React.createElement(TableCell, {
+    "data-testid": "ContactIdentity" // used by a test in cozy-contacts
+    ,
+    className: "".concat(styles['contact-identity'], " u-flex u-flex-items-center u-ellipsis u-p-0")
+  }, /*#__PURE__*/React.createElement(ContactIdentity, props));
+};
+
+ContactIdentityWrapper.defaultProps = {
+  noWrapper: false
+};
+export default ContactIdentityWrapper;

package/transpiled/react/ContactsList/Contacts/ContactName.d.ts

@@ -0,0 +1,10 @@
+export default ContactName;
+declare function ContactName({ contact }: {
+    contact: any;
+}): JSX.Element;
+declare namespace ContactName {
+    namespace propTypes {
+        const contact: PropTypes.Validator<object>;
+    }
+}
+import PropTypes from "prop-types";

package/transpiled/react/ContactsList/Contacts/ContactName.js

@@ -0,0 +1,34 @@
+import cx from 'classnames';
+import PropTypes from 'prop-types';
+import React from 'react';
+import { getDisplayName } from 'cozy-client/dist/models/contact';
+import Typography from "cozy-ui/transpiled/react/Typography";
+
+var ContactName = function ContactName(_ref) {
+  var _contact$name;
+
+  var contact = _ref.contact;
+  var familyName = (_contact$name = contact.name) === null || _contact$name === void 0 ? void 0 : _contact$name.familyName;
+  var displayName = getDisplayName(contact);
+  var namesToDisplay = displayName === null || displayName === void 0 ? void 0 : displayName.split(' ');
+  return /*#__PURE__*/React.createElement(Typography, {
+    "data-testid": "ContactName" // used by a test in cozy-contacts
+    ,
+    className: "u-ml-1",
+    noWrap: true,
+    display: "inline"
+  }, namesToDisplay === null || namesToDisplay === void 0 ? void 0 : namesToDisplay.map(function (name, index) {
+    var isLastItem = index === namesToDisplay.length - 1;
+    return /*#__PURE__*/React.createElement("span", {
+      key: "display-".concat(index),
+      className: cx({
+        'u-fw-bold': name === familyName
+      })
+    }, name, !isLastItem && /*#__PURE__*/React.createElement(React.Fragment, null, "\xA0"));
+  }));
+};
+
+ContactName.propTypes = {
+  contact: PropTypes.object.isRequired
+};
+export default ContactName;

package/transpiled/react/ContactsList/Contacts/ContactPhone.d.ts

@@ -0,0 +1,14 @@
+export default ContactPhone;
+declare function ContactPhone({ phone }: {
+    phone: any;
+}): JSX.Element;
+declare namespace ContactPhone {
+    namespace propTypes {
+        const phone: PropTypes.Requireable<string>;
+    }
+    namespace defaultProps {
+        const phone_1: string;
+        export { phone_1 as phone };
+    }
+}
+import PropTypes from "prop-types";

package/transpiled/react/ContactsList/Contacts/ContactPhone.js

@@ -0,0 +1,31 @@
+import PropTypes from 'prop-types';
+import React from 'react';
+import { TableCell } from "cozy-ui/transpiled/react/deprecated/Table";
+var styles = {
+  "contact": "styles__contact___169nD",
+  "contact--clickable": "styles__contact--clickable___1GLTM",
+  "contact-phone": "styles__contact-phone___1sA_m",
+  "contact-cozyurl": "styles__contact-cozyurl___3kBp5",
+  "contact-email": "styles__contact-email___3n3q2",
+  "contact-myself": "styles__contact-myself___1aOdx",
+  "contact-identity": "styles__contact-identity___mL3IJ",
+  "contact-firstname": "styles__contact-firstname___2GPEr",
+  "contact-avatar": "styles__contact-avatar___3lZPs"
+};
+
+var ContactPhone = function ContactPhone(_ref) {
+  var phone = _ref.phone;
+  return /*#__PURE__*/React.createElement(TableCell, {
+    "data-testid": "ContactPhone" // used by a test in cozy-contacts
+    ,
+    className: "".concat(styles['contact-phone'], " u-ellipsis u-p-0")
+  }, phone);
+};
+
+ContactPhone.propTypes = {
+  phone: PropTypes.string
+};
+ContactPhone.defaultProps = {
+  phone: '—'
+};
+export default ContactPhone;

package/transpiled/react/ContactsList/ContactsList.d.ts

@@ -0,0 +1,2 @@
+declare var _default: any;
+export default _default;

package/transpiled/react/ContactsList/ContactsList.js

@@ -0,0 +1,51 @@
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+var _excluded = ["contacts", "onItemClick"];
+import PropTypes from 'prop-types';
+import React from 'react';
+import ContactRow from "cozy-ui/transpiled/react/ContactsList/ContactRow";
+import { sortContacts, categorizeContacts, sortHeaders } from "cozy-ui/transpiled/react/ContactsList/helpers";
+import withContactsListLocales from "cozy-ui/transpiled/react/ContactsList/locales/withContactsListLocales";
+import List from "cozy-ui/transpiled/react/List";
+import ListSubheader from "cozy-ui/transpiled/react/ListSubheader";
+import { Table } from "cozy-ui/transpiled/react/deprecated/Table";
+import useBreakpoints from "cozy-ui/transpiled/react/providers/Breakpoints";
+import { useI18n } from "cozy-ui/transpiled/react/providers/I18n";
+
+var ContactsList = function ContactsList(_ref) {
+  var contacts = _ref.contacts,
+      onItemClick = _ref.onItemClick,
+      rest = _objectWithoutProperties(_ref, _excluded);
+
+  var _useI18n = useI18n(),
+      t = _useI18n.t;
+
+  var sortedContacts = sortContacts(contacts);
+  var categorizedContacts = categorizeContacts(sortedContacts, t);
+  var sortedHeaders = sortHeaders(categorizedContacts, t);
+
+  var _useBreakpoints = useBreakpoints(),
+      isDesktop = _useBreakpoints.isDesktop;
+
+  return /*#__PURE__*/React.createElement(Table, rest, sortedHeaders.map(function (header) {
+    return /*#__PURE__*/React.createElement(List, {
+      key: header,
+      subheader: /*#__PURE__*/React.createElement(ListSubheader, {
+        gutters: isDesktop ? 'double' : 'default'
+      }, header)
+    }, categorizedContacts[header].map(function (contact, index) {
+      return /*#__PURE__*/React.createElement(ContactRow, {
+        key: contact._id,
+        id: contact._id,
+        contact: contact,
+        divider: index !== categorizedContacts[header].length - 1,
+        onClick: onItemClick
+      });
+    }));
+  }));
+};
+
+ContactsList.propTypes = {
+  contacts: PropTypes.array.isRequired,
+  onItemClick: PropTypes.func
+};
+export default withContactsListLocales(ContactsList);

package/transpiled/react/ContactsList/helpers.d.ts

@@ -0,0 +1,9 @@
+export function buildLastNameFirst(contact: any): any;
+export function sortLastNameFirst(contact: any, comparedContact: any): any;
+export function sortContacts(contacts: any): any;
+export function categorizeContacts(contacts: object[], t: Function): CategorizedContactsResult;
+export function sortHeaders(categorized: CategorizedContactsResult, t: Function): string[];
+export function makeGroupLabelsAndCounts(contacts: array, t: any): object;
+export type CategorizedContactsResult = {
+    [x: string]: Object;
+};

package/transpiled/react/ContactsList/helpers.js

@@ -0,0 +1,130 @@
+import get from 'lodash/get';
+export function buildLastNameFirst(contact) {
+  var givenName = contact.name && contact.name.givenName ? contact.name.givenName.toUpperCase() : '';
+  var familyName = contact.name && contact.name.familyName ? contact.name.familyName.toUpperCase() : '';
+
+  if (!givenName && !familyName && contact.fullname) {
+    return contact.fullname.toUpperCase().trim();
+  } else {
+    return "".concat(familyName, " ").concat(givenName).trim();
+  }
+}
+export var sortLastNameFirst = function sortLastNameFirst(contact, comparedContact) {
+  var nameA = buildLastNameFirst(contact);
+  var nameB = buildLastNameFirst(comparedContact);
+  return nameA.localeCompare(nameB);
+};
+export var sortContacts = function sortContacts(contacts) {
+  return contacts.sort(sortLastNameFirst);
+};
+/**
+ * Build header for a contact (first letter of last name)
+ * @param {object} contact
+ * @param {function} t translation function
+ * @returns {string} header
+ */
+
+var makeHeader = function makeHeader(contact, t) {
+  if (contact.me) return t('me');
+  var name = buildLastNameFirst(contact);
+  return name[0] || t('empty');
+};
+/**
+ * Build header for a contact (first letter of indexes.byFamilyNameGivenNameEmailCozyUrl)
+ * @param {object} contact
+ * @param {function} t translation function
+ * @returns {string} header
+ */
+
+
+var makeHeaderForIndexedContacts = function makeHeaderForIndexedContacts(contact, t) {
+  var _contact$cozyMetadata;
+
+  if (contact.me) return t('me');
+  if ((_contact$cozyMetadata = contact.cozyMetadata) !== null && _contact$cozyMetadata !== void 0 && _contact$cozyMetadata.favorite) return t('favorite');
+  var index = get(contact, 'indexes.byFamilyNameGivenNameEmailCozyUrl', '');
+  var hasIndex = index !== null && index.length > 0;
+
+  if (hasIndex) {
+    var firstLetterWithoutAccent = index[0].normalize('NFD').replace(/(?:[\^`\xA8\xAF\xB4\xB7\xB8\u02B0-\u034E\u0350-\u0357\u035D-\u0362\u0374\u0375\u037A\u0384\u0385\u0483-\u0487\u0559\u0591-\u05A1\u05A3-\u05BD\u05BF\u05C1\u05C2\u05C4\u064B-\u0652\u0657\u0658\u06DF\u06E0\u06E5\u06E6\u06EA-\u06EC\u0730-\u074A\u07A6-\u07B0\u07EB-\u07F5\u0818\u0819\u0898-\u089F\u08C9-\u08D2\u08E3-\u08FE\u093C\u094D\u0951-\u0954\u0971\u09BC\u09CD\u0A3C\u0A4D\u0ABC\u0ACD\u0AFD-\u0AFF\u0B3C\u0B4D\u0B55\u0BCD\u0C3C\u0C4D\u0CBC\u0CCD\u0D3B\u0D3C\u0D4D\u0DCA\u0E47-\u0E4C\u0E4E\u0EBA\u0EC8-\u0ECC\u0F18\u0F19\u0F35\u0F37\u0F39\u0F3E\u0F3F\u0F82-\u0F84\u0F86\u0F87\u0FC6\u1037\u1039\u103A\u1063\u1064\u1069-\u106D\u1087-\u108D\u108F\u109A\u109B\u135D-\u135F\u1714\u1715\u17C9-\u17D3\u17DD\u1939-\u193B\u1A75-\u1A7C\u1A7F\u1AB0-\u1ABE\u1AC1-\u1ACB\u1B34\u1B44\u1B6B-\u1B73\u1BAA\u1BAB\u1C36\u1C37\u1C78-\u1C7D\u1CD0-\u1CE8\u1CED\u1CF4\u1CF7-\u1CF9\u1D2C-\u1D6A\u1DC4-\u1DCF\u1DF5-\u1DFF\u1FBD\u1FBF-\u1FC1\u1FCD-\u1FCF\u1FDD-\u1FDF\u1FED-\u1FEF\u1FFD\u1FFE\u2CEF-\u2CF1\u2E2F\u302A-\u302F\u3099-\u309C\u30FC\uA66F\uA67C\uA67D\uA67F\uA69C\uA69D\uA6F0\uA6F1\uA700-\uA721\uA788-\uA78A\uA7F8\uA7F9\uA8C4\uA8E0-\uA8F1\uA92B-\uA92E\uA953\uA9B3\uA9C0\uA9E5\uAA7B-\uAA7D\uAABF-\uAAC2\uAAF6\uAB5B-\uAB5F\uAB69-\uAB6B\uABEC\uABED\uFB1E\uFE20-\uFE2F\uFF3E\uFF40\uFF70\uFF9E\uFF9F\uFFE3]|\uD800\uDEE0|\uD801[\uDF80-\uDF85\uDF87-\uDFB0\uDFB2-\uDFBA]|\uD802[\uDEE5\uDEE6]|\uD803[\uDD22-\uDD27\uDF46-\uDF50\uDF82-\uDF85]|\uD804[\uDC46\uDC70\uDCB9\uDCBA\uDD33\uDD34\uDD73\uDDC0\uDDCA-\uDDCC\uDE35\uDE36\uDEE9\uDEEA\uDF3C\uDF4D\uDF66-\uDF6C\uDF70-\uDF74]|\uD805[\uDC42\uDC46\uDCC2\uDCC3\uDDBF\uDDC0\uDE3F\uDEB6\uDEB7\uDF2B]|\uD806[\uDC39\uDC3A\uDD3D\uDD3E\uDD43\uDDE0\uDE34\uDE47\uDE99]|\uD807[\uDC3F\uDD42\uDD44\uDD45\uDD97]|\uD81A[\uDEF0-\uDEF4\uDF30-\uDF36]|\uD81B[\uDF8F-\uDF9F\uDFF0\uDFF1]|\uD82B[\uDFF0-\uDFF3\uDFF5-\uDFFB\uDFFD\uDFFE]|\uD833[\uDF00-\uDF2D\uDF30-\uDF46]|\uD834[\uDD67-\uDD69\uDD6D-\uDD72\uDD7B-\uDD82\uDD85-\uDD8B\uDDAA-\uDDAD]|\uD838[\uDD30-\uDD36\uDEAE\uDEEC-\uDEEF]|\uD83A[\uDCD0-\uDCD6\uDD44-\uDD46\uDD48-\uDD4A])/g, '');
+    return firstLetterWithoutAccent;
+  }
+
+  return t('empty');
+};
+/**
+ * @typedef {Object.<string, Object>} CategorizedContactsResult
+ */
+
+/**
+ * Categorize contacts by first letter of last name
+ * Expl.: all contacts with A as first letter will be in A category
+ * @param {object[]} contacts io.cozy.contacts documents
+ * @param {function} t translation function
+ * @returns {CategorizedContactsResult} Categorized contacts
+ */
+
+
+export var categorizeContacts = function categorizeContacts(contacts, t) {
+  return contacts.reduce(function (acc, contact) {
+    var header = makeHeader(contact, t);
+    acc[header] = acc[header] || [];
+    acc[header].push(contact);
+    return acc;
+  }, {});
+};
+/**
+ * Sort headers (first letter of last name) alphabetically and put 'me' and 'empty' first
+ * @param {CategorizedContactsResult} categorized categorized contacts
+ * @param {function} t translation function
+ * @returns {string[]}
+ */
+
+export var sortHeaders = function sortHeaders(categorized, t) {
+  var headers = Object.keys(categorized);
+  var notEmptyAndMyselfHeaders = headers.filter(function (header) {
+    return header !== t('empty') && header !== t('me');
+  });
+  var notEmptyAndMyselfSorted = notEmptyAndMyselfHeaders.slice().sort();
+
+  if (headers.length === notEmptyAndMyselfHeaders.length) {
+    return notEmptyAndMyselfSorted;
+  }
+
+  var headersSorted = [];
+
+  if (headers.includes(t('me'))) {
+    headersSorted.push(t('me'));
+  }
+
+  if (headers.includes(t('empty'))) {
+    headersSorted.push(t('empty'));
+  }
+
+  return headersSorted.concat(notEmptyAndMyselfSorted);
+};
+/**
+ * Counts how many contacts are categorized by first letter and store it in `groupCounts`
+ * Expl.: if there is 3 contacts in A and 2 in B, it will return [3,2]
+ * Also store first letters and store them in `groupLabels`
+ * @param {array} contacts - Array of io.cozy.contact documents
+ * @returns {object}
+ */
+
+export var makeGroupLabelsAndCounts = function makeGroupLabelsAndCounts(contacts, t) {
+  return contacts.reduce(function (acc, contact) {
+    var header = makeHeaderForIndexedContacts(contact, t);
+
+    if (!acc.groupLabels.includes(header)) {
+      acc.groupLabels.push(header);
+    }
+
+    var idx = acc.groupLabels.indexOf(header);
+    var val = acc.groupCounts[idx] || 0;
+    acc.groupCounts[idx] = val + 1;
+    return acc;
+  }, {
+    groupLabels: [],
+    groupCounts: []
+  });
+};

package/transpiled/react/ContactsList/helpers.spec.d.ts

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

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

@@ -0,0 +1,2 @@
+export default ContactsList;
+import ContactsList from "./ContactsList";

package/transpiled/react/ContactsList/index.js

@@ -0,0 +1,2 @@
+import ContactsList from "cozy-ui/transpiled/react/ContactsList/ContactsList";
+export default ContactsList;

package/transpiled/react/ContactsList/locales/withContactsListLocales.d.ts

@@ -0,0 +1,12 @@
+export namespace locales {
+    export { en };
+    export { fr };
+    export { ru };
+    export { vi };
+}
+declare var _default: Component;
+export default _default;
+import en from "./en.json";
+import fr from "./fr.json";
+import ru from "./ru.json";
+import vi from "./vi.json";

package/transpiled/react/ContactsList/locales/withContactsListLocales.js

@@ -0,0 +1,28 @@
+var en = {
+  empty: "EMPTY",
+  me: "me",
+  favorite: "favorites"
+};
+var fr = {
+  empty: "VIDE",
+  me: "moi",
+  favorite: "favoris"
+};
+var ru = {
+  empty: "\u041F\u0423\u0421\u0422\u041E",
+  me: "\u044F",
+  favorite: "\u0438\u0437\u0431\u0440\u0430\u043D\u043D\u043E\u0435"
+};
+var vi = {
+  empty: "TR\u1ED0NG",
+  me: "t\xF4i",
+  favorite: "y\xEAu th\xEDch"
+};
+import withOnlyLocales from "cozy-ui/transpiled/react/providers/I18n/withOnlyLocales";
+export var locales = {
+  en: en,
+  fr: fr,
+  ru: ru,
+  vi: vi
+};
+export default withOnlyLocales(locales);

package/transpiled/react/ContactsListModal/AddContact/AddContactActions.d.ts

@@ -0,0 +1,2 @@
+declare var _default: any;
+export default _default;

package/transpiled/react/ContactsListModal/AddContact/AddContactActions.js

@@ -0,0 +1,19 @@
+import React from 'react';
+import Button from "cozy-ui/transpiled/react/Buttons";
+import { withContactsListLocales } from "cozy-ui/transpiled/react/ContactsListModal/withContactsListLocales";
+
+var AddContactActions = function AddContactActions(_ref) {
+  var t = _ref.t,
+      onCancel = _ref.onCancel,
+      onSave = _ref.onSave;
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Button, {
+    variant: "secondary",
+    label: t('cancel'),
+    onClick: onCancel
+  }), /*#__PURE__*/React.createElement(Button, {
+    label: t('save'),
+    onClick: onSave
+  }));
+};
+
+export default withContactsListLocales(AddContactActions);

package/transpiled/react/ContactsListModal/AddContact/AddContactContent.d.ts

@@ -0,0 +1,2 @@
+declare var _default: any;
+export default _default;

package/transpiled/react/ContactsListModal/AddContact/AddContactContent.js

@@ -0,0 +1,65 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+
+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 PropTypes from 'prop-types';
+import React from 'react';
+var styles = {
+  "icon": "styles__icon___gvQ89"
+};
+import Icon from "cozy-ui/transpiled/react/Icon";
+import PeopleIcon from "cozy-ui/transpiled/react/Icons/People";
+import TextField from "cozy-ui/transpiled/react/TextField";
+import Typography from "cozy-ui/transpiled/react/Typography";
+import { Media, Img, Bd } from "cozy-ui/transpiled/react/deprecated/Media";
+import { withContactsListLocales } from "cozy-ui/transpiled/react/ContactsListModal/withContactsListLocales";
+
+var AddContactContent = function AddContactContent(_ref) {
+  var t = _ref.t,
+      setContactValues = _ref.setContactValues;
+
+  var handleChange = function handleChange(ev) {
+    var _ev$target = ev.target,
+        name = _ev$target.name,
+        value = _ev$target.value;
+    setContactValues(function (v) {
+      return _objectSpread(_objectSpread({}, v), {}, _defineProperty({}, name, value));
+    });
+  };
+
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Typography, {
+    variant: "h5"
+  }, t('coordinates')), /*#__PURE__*/React.createElement(Media, null, /*#__PURE__*/React.createElement(Img, {
+    className: styles.icon
+  }, /*#__PURE__*/React.createElement(Icon, {
+    icon: PeopleIcon
+  })), /*#__PURE__*/React.createElement(Bd, {
+    className: "u-mr-1"
+  }, /*#__PURE__*/React.createElement(TextField, {
+    className: "u-mt-1",
+    variant: "outlined",
+    fullWidth: true,
+    id: "givenName",
+    name: "givenName",
+    label: t('givenName'),
+    onChange: handleChange
+  }))), /*#__PURE__*/React.createElement(Media, null, /*#__PURE__*/React.createElement(Bd, {
+    className: "u-ml-3 u-mr-1"
+  }, /*#__PURE__*/React.createElement(TextField, {
+    className: "u-mt-1",
+    variant: "outlined",
+    fullWidth: true,
+    id: "familyName",
+    name: "familyName",
+    label: t('familyName'),
+    onChange: handleChange
+  }))));
+};
+
+AddContactContent.propTypes = {
+  t: PropTypes.func,
+  setContactValues: PropTypes.func
+};
+export default withContactsListLocales(AddContactContent);

package/transpiled/react/ContactsListModal/AddContact/AddContactDialog.d.ts

@@ -0,0 +1,6 @@
+export default AddContactDialog;
+declare function AddContactDialog({ onListClose, onCreate, onClose }: {
+    onListClose: any;
+    onCreate: any;
+    onClose: any;
+}): JSX.Element;

package/transpiled/react/ContactsListModal/AddContact/AddContactDialog.js

@@ -0,0 +1,42 @@
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import React, { useState } from 'react';
+import { useClient } from 'cozy-client';
+import AddContactActions from "cozy-ui/transpiled/react/ContactsListModal/AddContact/AddContactActions";
+import AddContactContent from "cozy-ui/transpiled/react/ContactsListModal/AddContact/AddContactContent";
+import AddContactTitle from "cozy-ui/transpiled/react/ContactsListModal/AddContact/AddContactTitle";
+import { handleSubmit } from "cozy-ui/transpiled/react/ContactsListModal/AddContact/helpers";
+import { FixedDialog } from "cozy-ui/transpiled/react/CozyDialogs";
+
+var AddContactDialog = function AddContactDialog(_ref) {
+  var onListClose = _ref.onListClose,
+      onCreate = _ref.onCreate,
+      onClose = _ref.onClose;
+
+  var _useState = useState({}),
+      _useState2 = _slicedToArray(_useState, 2),
+      contactValues = _useState2[0],
+      setContactValues = _useState2[1];
+
+  var client = useClient();
+  return /*#__PURE__*/React.createElement(FixedDialog, {
+    open: true,
+    onClose: onClose,
+    title: /*#__PURE__*/React.createElement(AddContactTitle, null),
+    content: /*#__PURE__*/React.createElement(AddContactContent, {
+      setContactValues: setContactValues
+    }),
+    actions: /*#__PURE__*/React.createElement(AddContactActions, {
+      onCancel: onClose,
+      onSave: function onSave() {
+        return handleSubmit({
+          client: client,
+          contactValues: contactValues,
+          onCreate: onCreate,
+          onListClose: onListClose
+        });
+      }
+    })
+  });
+};
+
+export default AddContactDialog;

package/transpiled/react/ContactsListModal/AddContact/AddContactTitle.d.ts

@@ -0,0 +1,2 @@
+declare var _default: any;
+export default _default;

package/transpiled/react/ContactsListModal/AddContact/AddContactTitle.js

@@ -0,0 +1,9 @@
+import React from 'react';
+import { withContactsListLocales } from "cozy-ui/transpiled/react/ContactsListModal/withContactsListLocales";
+
+var AddContactTitle = function AddContactTitle(_ref) {
+  var t = _ref.t;
+  return /*#__PURE__*/React.createElement(React.Fragment, null, t('newContact'));
+};
+
+export default withContactsListLocales(AddContactTitle);

package/transpiled/react/ContactsListModal/AddContact/helpers.d.ts

@@ -0,0 +1,6 @@
+export function handleSubmit({ client, contactValues, onCreate, onListClose }: {
+    client: any;
+    contactValues: any;
+    onCreate: any;
+    onListClose: any;
+}): Promise<void>;

package/transpiled/react/ContactsListModal/AddContact/helpers.js

@@ -0,0 +1,48 @@
+import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
+import _regeneratorRuntime from "@babel/runtime/regenerator";
+export var handleSubmit = /*#__PURE__*/function () {
+  var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(_ref) {
+    var client, contactValues, onCreate, onListClose, givenName, familyName, _yield$client$save, contact;
+
+    return _regeneratorRuntime.wrap(function _callee$(_context) {
+      while (1) {
+        switch (_context.prev = _context.next) {
+          case 0:
+            client = _ref.client, contactValues = _ref.contactValues, onCreate = _ref.onCreate, onListClose = _ref.onListClose;
+            givenName = contactValues.givenName, familyName = contactValues.familyName;
+
+            if (!(!givenName && !familyName)) {
+              _context.next = 4;
+              break;
+            }
+
+            return _context.abrupt("return");
+
+          case 4:
+            _context.next = 6;
+            return client.save({
+              _type: 'io.cozy.contacts',
+              name: {
+                familyName: familyName,
+                givenName: givenName
+              }
+            });
+
+          case 6:
+            _yield$client$save = _context.sent;
+            contact = _yield$client$save.data;
+            onCreate(contact);
+            onListClose();
+
+          case 10:
+          case "end":
+            return _context.stop();
+        }
+      }
+    }, _callee);
+  }));
+
+  return function handleSubmit(_x) {
+    return _ref2.apply(this, arguments);
+  };
+}();

package/transpiled/react/ContactsListModal/AddContact/helpers.spec.d.ts

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

package/transpiled/react/ContactsListModal/ContactsListContent.d.ts

@@ -0,0 +1,2 @@
+declare var _default: any;
+export default _default;