cozy-ui-plus 1.1.0

package/dist/Contacts/GroupsSelect/locales/index.js

@@ -0,0 +1,97 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.locales = void 0;
+var en = {
+  Contacts: {
+    GroupsSelect: {
+      create: "Create a group",
+      name: "Name of the group",
+      already_exists: "The group %{name} already exists.",
+      manage: "Groups",
+      filter: {
+        "all-groups": "All groups"
+      },
+      created: {
+        success: "The group has been created correctly.",
+        error: "The group has not been created."
+      },
+      renamed: {
+        success: "The group has been renamed correctly.",
+        error: "The group has not been renamed."
+      }
+    }
+  }
+};
+var fr = {
+  Contacts: {
+    GroupsSelect: {
+      create: "Cr\xE9er un groupe",
+      name: "Nom du groupe",
+      already_exists: "Le groupe %{name} existe d\xE9j\xE0.",
+      manage: "Groupes",
+      filter: {
+        "all-groups": "Tous les groupes"
+      },
+      created: {
+        success: "Le groupe a bien \xE9t\xE9 cr\xE9\xE9.",
+        error: "Le groupe n'a pas \xE9t\xE9 cr\xE9\xE9."
+      },
+      renamed: {
+        success: "Le groupe a bien \xE9t\xE9 renomm\xE9.",
+        error: "Le groupe n'a pas \xE9t\xE9 renomm\xE9."
+      }
+    }
+  }
+};
+var ru = {
+  Contacts: {
+    GroupsSelect: {
+      create: "\u0421\u043E\u0437\u0434\u0430\u0442\u044C \u0433\u0440\u0443\u043F\u043F\u0443",
+      name: "\u041D\u0430\u0437\u0432\u0430\u043D\u0438\u0435 \u0433\u0440\u0443\u043F\u043F\u044B",
+      already_exists: "\u0413\u0440\u0443\u043F\u043F\u0430 %{name} \u0443\u0436\u0435 \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u0435\u0442.",
+      manage: "\u0413\u0440\u0443\u043F\u043F\u044B",
+      filter: {
+        "all-groups": "\u0412\u0441\u0435 \u0433\u0440\u0443\u043F\u043F\u044B"
+      },
+      created: {
+        success: "\u0413\u0440\u0443\u043F\u043F\u0430 \u0431\u044B\u043B\u0430 \u0441\u043E\u0437\u0434\u0430\u043D\u0430 \u0443\u0441\u043F\u0435\u0448\u043D\u043E.",
+        error: "\u0413\u0440\u0443\u043F\u043F\u0430 \u043D\u0435 \u0431\u044B\u043B\u0430 \u0441\u043E\u0437\u0434\u0430\u043D\u0430."
+      },
+      renamed: {
+        success: "\u0413\u0440\u0443\u043F\u043F\u0430 \u0431\u044B\u043B\u0430 \u043F\u0435\u0440\u0435\u0438\u043C\u0435\u043D\u043E\u0432\u0430\u043D\u0430 \u0443\u0441\u043F\u0435\u0448\u043D\u043E.",
+        error: "\u0413\u0440\u0443\u043F\u043F\u0430 \u043D\u0435 \u0431\u044B\u043B\u0430 \u043F\u0435\u0440\u0435\u0438\u043C\u0435\u043D\u043E\u0432\u0430\u043D\u0430."
+      }
+    }
+  }
+};
+var vi = {
+  Contacts: {
+    GroupsSelect: {
+      create: "T\u1EA1o nh\xF3m",
+      name: "T\xEAn nh\xF3m",
+      already_exists: "Nh\xF3m %{name} \u0111\xE3 t\u1ED3n t\u1EA1i.",
+      manage: "Nh\xF3m",
+      filter: {
+        "all-groups": "T\u1EA5t c\u1EA3 nh\xF3m"
+      },
+      created: {
+        success: "Nh\xF3m \u0111\xE3 \u0111\u01B0\u1EE3c t\u1EA1o th\xE0nh c\xF4ng.",
+        error: "Nh\xF3m ch\u01B0a \u0111\u01B0\u1EE3c t\u1EA1o."
+      },
+      renamed: {
+        success: "Nh\xF3m \u0111\xE3 \u0111\u01B0\u1EE3c \u0111\u1ED5i t\xEAn th\xE0nh c\xF4ng.",
+        error: "Nh\xF3m ch\u01B0a \u0111\u01B0\u1EE3c \u0111\u1ED5i t\xEAn."
+      }
+    }
+  }
+};
+var locales = {
+  en: en,
+  fr: fr,
+  ru: ru,
+  vi: vi
+};
+exports.locales = locales;

package/dist/Contacts/GroupsSelect/useGroupSelect.js

@@ -0,0 +1,196 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
+var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
+
+var _get = _interopRequireDefault(require("lodash/get"));
+
+var _Alert = require("cozy-ui/transpiled/react/providers/Alert");
+
+var _I18n = require("cozy-ui/transpiled/react/providers/I18n");
+
+var _GroupsSelectProvider = require("./GroupsSelectProvider");
+
+var _helpers = require("./helpers");
+
+var _locales = require("./locales");
+
+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) { (0, _defineProperty2.default)(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; }
+
+var useGroupsSelect = function useGroupsSelect(_ref) {
+  var allGroups = _ref.allGroups,
+      onGroupCreated = _ref.onGroupCreated,
+      client = _ref.client,
+      onGroupCreate = _ref.onGroupCreate,
+      onGroupUpdate = _ref.onGroupUpdate;
+
+  var _useSelectedGroup = (0, _GroupsSelectProvider.useSelectedGroup)(),
+      selectedGroup = _useSelectedGroup.selectedGroup,
+      setSelectedGroup = _useSelectedGroup.setSelectedGroup;
+
+  var _useAlert = (0, _Alert.useAlert)(),
+      showAlert = _useAlert.showAlert;
+
+  (0, _I18n.useExtendI18n)(_locales.locales);
+
+  var _useI18n = (0, _I18n.useI18n)(),
+      t = _useI18n.t;
+
+  var createGroupSelf = /*#__PURE__*/function () {
+    var _ref2 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(group) {
+      var _yield$onGroupCreate, createdGroup;
+
+      return _regenerator.default.wrap(function _callee$(_context) {
+        while (1) {
+          switch (_context.prev = _context.next) {
+            case 0:
+              if (group.name) {
+                _context.next = 2;
+                break;
+              }
+
+              return _context.abrupt("return");
+
+            case 2:
+              if (!(0, _helpers.isExistingGroup)(allGroups, group)) {
+                _context.next = 4;
+                break;
+              }
+
+              return _context.abrupt("return", showAlert({
+                severity: 'error',
+                message: t('Contacts.GroupsSelect.already_exists', {
+                  name: group.name
+                })
+              }));
+
+            case 4:
+              _context.prev = 4;
+              _context.next = 7;
+              return onGroupCreate(client, group);
+
+            case 7:
+              _yield$onGroupCreate = _context.sent;
+              createdGroup = _yield$onGroupCreate.data;
+
+              if (onGroupCreated) {
+                onGroupCreated(createdGroup);
+              }
+
+              return _context.abrupt("return", showAlert({
+                severity: 'success',
+                message: t('Contacts.GroupsSelect.created.success')
+              }));
+
+            case 13:
+              _context.prev = 13;
+              _context.t0 = _context["catch"](4);
+              return _context.abrupt("return", showAlert({
+                severity: 'error',
+                message: t('Contacts.GroupsSelect.created.error')
+              }));
+
+            case 16:
+            case "end":
+              return _context.stop();
+          }
+        }
+      }, _callee, null, [[4, 13]]);
+    }));
+
+    return function createGroupSelf(_x) {
+      return _ref2.apply(this, arguments);
+    };
+  }();
+
+  var renameGroupSelf = /*#__PURE__*/function () {
+    var _ref3 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee2(groupId, newName) {
+      var group, allOtherGroups, isRenamedGroupSelected, _yield$onGroupUpdate, data;
+
+      return _regenerator.default.wrap(function _callee2$(_context2) {
+        while (1) {
+          switch (_context2.prev = _context2.next) {
+            case 0:
+              group = allGroups.find(function (group) {
+                return group.id === groupId;
+              });
+              allOtherGroups = allGroups.filter(function (group) {
+                return group.id !== groupId;
+              });
+              isRenamedGroupSelected = (0, _get.default)(group, '_id') === (0, _get.default)(selectedGroup, '_id');
+
+              if (!(0, _helpers.isExistingGroup)(allOtherGroups, {
+                name: newName
+              })) {
+                _context2.next = 5;
+                break;
+              }
+
+              return _context2.abrupt("return", showAlert({
+                severity: 'error',
+                message: t('Contacts.GroupsSelect.already_exists', {
+                  name: newName
+                })
+              }));
+
+            case 5:
+              _context2.prev = 5;
+              _context2.next = 8;
+              return onGroupUpdate(client, _objectSpread(_objectSpread({}, group), {}, {
+                name: newName
+              }));
+
+            case 8:
+              _yield$onGroupUpdate = _context2.sent;
+              data = _yield$onGroupUpdate.data;
+
+              if (isRenamedGroupSelected) {
+                setSelectedGroup(data);
+              }
+
+              return _context2.abrupt("return", showAlert({
+                severity: 'success',
+                message: t('Contacts.GroupsSelect.renamed.success')
+              }));
+
+            case 14:
+              _context2.prev = 14;
+              _context2.t0 = _context2["catch"](5);
+              return _context2.abrupt("return", showAlert({
+                severity: 'error',
+                message: t('Contacts.GroupsSelect.renamed.error')
+              }));
+
+            case 17:
+            case "end":
+              return _context2.stop();
+          }
+        }
+      }, _callee2, null, [[5, 14]]);
+    }));
+
+    return function renameGroupSelf(_x2, _x3) {
+      return _ref3.apply(this, arguments);
+    };
+  }();
+
+  return {
+    createGroup: createGroupSelf,
+    renameGroup: renameGroupSelf
+  };
+};
+
+var _default = useGroupsSelect;
+exports.default = _default;

package/dist/Contacts/Header/GroupsSelection.js

@@ -0,0 +1,101 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _SelectBox = require("cozy-ui/transpiled/react/SelectBox");
+
+var _Breakpoints = require("cozy-ui/transpiled/react/providers/Breakpoints");
+
+var _I18n = require("cozy-ui/transpiled/react/providers/I18n");
+
+var _locales = require("./locales");
+
+var _GroupsSelect = _interopRequireDefault(require("../GroupsSelect/GroupsSelect"));
+
+var _GroupsSelectProvider = require("../GroupsSelect/GroupsSelectProvider");
+
+var _helpers = require("../GroupsSelect/helpers");
+
+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) { (0, _defineProperty2.default)(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; }
+
+var setGroupsSelectOptions = function setGroupsSelectOptions(allGroups, defaultSelectedGroup) {
+  return allGroups.length > 0 ? [defaultSelectedGroup].concat(allGroups) : allGroups;
+};
+
+var useGroupsSelectCustomStyles = function useGroupsSelectCustomStyles() {
+  var _useBreakpoints = (0, _Breakpoints.useBreakpoints)(),
+      isMobile = _useBreakpoints.isMobile;
+
+  return {
+    container: function container(base) {
+      return _objectSpread(_objectSpread({}, base), {}, {
+        width: isMobile ? '100%' : '50%'
+      });
+    },
+    noOptionsMessage: function noOptionsMessage(base) {
+      return _objectSpread(_objectSpread({}, base), {}, {
+        textAlign: 'left'
+      });
+    }
+  };
+};
+
+var ControlDefaultWithTestId = function ControlDefaultWithTestId(_ref) {
+  var props = (0, _extends2.default)({}, _ref);
+  return /*#__PURE__*/_react.default.createElement(_SelectBox.ControlDefault, (0, _extends2.default)({}, props, {
+    innerProps: _objectSpread(_objectSpread({}, props.innerProps), {}, {
+      'data-testid': 'selectBox-controlDefault',
+      className: 'u-bdrs-4'
+    })
+  }));
+};
+
+var GroupsSelection = function GroupsSelection(_ref2) {
+  var allGroups = _ref2.allGroups,
+      onGroupCreate = _ref2.onGroupCreate,
+      onGroupUpdate = _ref2.onGroupUpdate,
+      onGroupDelete = _ref2.onGroupDelete;
+  (0, _I18n.useExtendI18n)(_locales.locales);
+
+  var _useI18n = (0, _I18n.useI18n)(),
+      t = _useI18n.t;
+
+  var _useSelectedGroup = (0, _GroupsSelectProvider.useSelectedGroup)(),
+      selectedGroup = _useSelectedGroup.selectedGroup,
+      setSelectedGroup = _useSelectedGroup.setSelectedGroup;
+
+  var groupsSelectOptions = setGroupsSelectOptions(allGroups, (0, _helpers.translatedDefaultSelectedGroup)(t));
+  var groupsSelectCustomStyles = useGroupsSelectCustomStyles();
+  return /*#__PURE__*/_react.default.createElement(_GroupsSelect.default, {
+    allGroups: groupsSelectOptions,
+    value: selectedGroup,
+    noOptionsMessage: function noOptionsMessage() {
+      return t('Contacts.Header.filter.no-group');
+    },
+    styles: groupsSelectCustomStyles,
+    closeMenuOnSelect: true,
+    components: {
+      Control: ControlDefaultWithTestId
+    },
+    onChange: setSelectedGroup,
+    onGroupCreate: onGroupCreate,
+    onGroupUpdate: onGroupUpdate,
+    onGroupDelete: onGroupDelete
+  });
+};
+
+var _default = GroupsSelection;
+exports.default = _default;

package/dist/Contacts/Header/ImportDropdown.js

@@ -0,0 +1,115 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _cozyClient = require("cozy-client");
+
+var _contact = require("cozy-client/dist/models/contact");
+
+var _Buttons = _interopRequireDefault(require("cozy-ui/transpiled/react/Buttons"));
+
+var _Icon = _interopRequireDefault(require("cozy-ui/transpiled/react/Icon"));
+
+var _Bottom = _interopRequireDefault(require("cozy-ui/transpiled/react/Icons/Bottom"));
+
+var _Team = _interopRequireDefault(require("cozy-ui/transpiled/react/Icons/Team"));
+
+var _Link = _interopRequireDefault(require("cozy-ui/transpiled/react/Link"));
+
+var _ActionMenu = _interopRequireWildcard(require("cozy-ui/transpiled/react/deprecated/ActionMenu"));
+
+var _I18n = require("cozy-ui/transpiled/react/providers/I18n");
+
+var _locales = require("./locales");
+
+var _AppIcon = _interopRequireDefault(require("../../AppIcon"));
+
+var _AppLinker = _interopRequireDefault(require("../../AppLinker"));
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+var ImportDropdown = function ImportDropdown(_ref) {
+  var onContactImport = _ref.onContactImport;
+  (0, _I18n.useExtendI18n)(_locales.locales);
+
+  var _useI18n = (0, _I18n.useI18n)(),
+      t = _useI18n.t;
+
+  var client = (0, _cozyClient.useClient)();
+  var anchorRef = (0, _react.useRef)();
+
+  var _useState = (0, _react.useState)(false),
+      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+      showMenu = _useState2[0],
+      setShowMenu = _useState2[1];
+
+  var storeURL = (0, _cozyClient.generateWebLink)({
+    cozyUrl: client.getStackClient().uri,
+    hash: "discover/?type=konnector&doctype=".concat(_contact.CONTACTS_DOCTYPE),
+    pathname: '/',
+    slug: 'store',
+    subDomainType: client.getInstanceOptions().subdomain
+  });
+  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_Buttons.default, {
+    ref: anchorRef,
+    variant: "secondary",
+    label: t('Contacts.Header.import.title'),
+    endIcon: /*#__PURE__*/_react.default.createElement(_Icon.default, {
+      icon: _Bottom.default
+    }),
+    fullWidth: true,
+    onClick: function onClick() {
+      return setShowMenu(function (v) {
+        return !v;
+      });
+    }
+  }), showMenu && /*#__PURE__*/_react.default.createElement(_ActionMenu.default, {
+    anchorElRef: anchorRef,
+    popperOptions: {
+      placement: 'bottom-end'
+    },
+    onClose: function onClose() {
+      return setShowMenu(false);
+    }
+  }, /*#__PURE__*/_react.default.createElement(_ActionMenu.ActionMenuItem, {
+    left: /*#__PURE__*/_react.default.createElement(_Icon.default, {
+      icon: _Team.default
+    }),
+    onClick: onContactImport
+  }, t('Contacts.Header.import.vcard')), /*#__PURE__*/_react.default.createElement(_AppLinker.default, {
+    app: {
+      slug: 'store'
+    },
+    href: storeURL
+  }, function (_ref2) {
+    var onClick = _ref2.onClick,
+        href = _ref2.href;
+    return /*#__PURE__*/_react.default.createElement(_ActionMenu.ActionMenuItem, {
+      left: /*#__PURE__*/_react.default.createElement(_AppIcon.default, {
+        app: "store",
+        className: "u-h-1 u-w-1"
+      }),
+      onClick: onClick
+    }, /*#__PURE__*/_react.default.createElement(_Link.default, {
+      className: "u-p-0",
+      href: href,
+      style: {
+        color: 'var(--primaryTextColor)'
+      }
+    }, t('Contacts.Header.import.store')));
+  })));
+};
+
+var _default = ImportDropdown;
+exports.default = _default;

package/dist/Contacts/Header/SearchInput.js

@@ -0,0 +1,40 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _debounce = _interopRequireDefault(require("lodash/debounce"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _SearchBar = _interopRequireDefault(require("cozy-ui/transpiled/react/SearchBar"));
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+var SearchInput = function SearchInput(_ref) {
+  var setSearchValue = _ref.setSearchValue;
+  var delayedSetSearchValue = (0, _react.useMemo)(function () {
+    return (0, _debounce.default)(function (searchValue) {
+      return setSearchValue(searchValue);
+    }, 375);
+  }, [setSearchValue]);
+
+  var handleOnChange = function handleOnChange(ev) {
+    delayedSetSearchValue(ev.target.value);
+  };
+
+  return /*#__PURE__*/_react.default.createElement(_SearchBar.default, {
+    size: "small",
+    elevation: 0,
+    onChange: handleOnChange
+  });
+};
+
+var _default = SearchInput;
+exports.default = _default;

package/dist/Contacts/Header/index.js

@@ -0,0 +1,93 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _classnames = _interopRequireDefault(require("classnames"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _Buttons = _interopRequireDefault(require("cozy-ui/transpiled/react/Buttons"));
+
+var _Icon = _interopRequireDefault(require("cozy-ui/transpiled/react/Icon"));
+
+var _PersonAdd = _interopRequireDefault(require("cozy-ui/transpiled/react/Icons/PersonAdd"));
+
+var _Breakpoints = require("cozy-ui/transpiled/react/providers/Breakpoints");
+
+var _I18n = require("cozy-ui/transpiled/react/providers/I18n");
+
+var _GroupsSelection = _interopRequireDefault(require("./GroupsSelection"));
+
+var _ImportDropdown = _interopRequireDefault(require("./ImportDropdown"));
+
+var _SearchInput = _interopRequireDefault(require("./SearchInput"));
+
+var _locales = require("./locales");
+
+var Header = function Header(_ref) {
+  var allGroups = _ref.allGroups,
+      onContactCreate = _ref.onContactCreate,
+      onContactImport = _ref.onContactImport,
+      onSearch = _ref.onSearch,
+      onGroupCreate = _ref.onGroupCreate,
+      onGroupDelete = _ref.onGroupDelete,
+      onGroupUpdate = _ref.onGroupUpdate;
+  (0, _I18n.useExtendI18n)(_locales.locales);
+
+  var _useI18n = (0, _I18n.useI18n)(),
+      t = _useI18n.t;
+
+  var _useBreakpoints = (0, _Breakpoints.useBreakpoints)(),
+      isMobile = _useBreakpoints.isMobile;
+
+  return /*#__PURE__*/_react.default.createElement("div", {
+    className: !isMobile ? 'u-flex u-flex-justify-between' : undefined
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: (0, _classnames.default)('u-flex u-flex-items-center u-w-auto-s u-w-5 u-maw-6', {
+      'u-mb-1': isMobile,
+      'u-mr-1': !isMobile
+    })
+  }, /*#__PURE__*/_react.default.createElement(_Buttons.default, {
+    className: "u-mr-half",
+    variant: "ghost",
+    startIcon: /*#__PURE__*/_react.default.createElement(_Icon.default, {
+      icon: _PersonAdd.default
+    }),
+    label: t('Contacts.Header.create'),
+    fullWidth: true,
+    onClick: onContactCreate
+  }), /*#__PURE__*/_react.default.createElement(_ImportDropdown.default, {
+    onContactImport: onContactImport
+  })), /*#__PURE__*/_react.default.createElement("div", {
+    className: !isMobile ? 'u-flex u-flex-items-center u-flex-justify-end u-flex-grow-1 u-maw-7' : undefined
+  }, /*#__PURE__*/_react.default.createElement(_GroupsSelection.default, {
+    allGroups: allGroups,
+    onGroupCreate: onGroupCreate,
+    onGroupUpdate: onGroupUpdate,
+    onGroupDelete: onGroupDelete
+  }), /*#__PURE__*/_react.default.createElement(_SearchInput.default, {
+    setSearchValue: onSearch
+  })));
+};
+
+Header.propTypes = {
+  allGroups: _propTypes.default.array,
+  onContactCreate: _propTypes.default.func,
+  onContactImport: _propTypes.default.func,
+  onSearch: _propTypes.default.func,
+  onGroupCreate: _propTypes.default.func,
+  onGroupUpdate: _propTypes.default.func,
+  onGroupDelete: _propTypes.default.func
+};
+Header.defaultProps = {
+  allGroups: []
+};
+var _default = Header;
+exports.default = _default;