@gympass/yoga 7.71.0 → 7.72.0

package/cjs/AutoComplete/web/AutoComplete.js

@@ -15,7 +15,7 @@ var _yogaIcons = require("@gympass/yoga-icons");
 
 var _Input = _interopRequireDefault(require("../../Input/web/Input"));
 
-var _excluded = ["className", "style", "full", "options", "onChange", "onClean", "onSelect", "value", "error", "openSuggestionsAriaLabel", "closeSuggestionsAriaLabel"];
+var _excluded = ["className", "style", "full", "options", "onChange", "onClean", "onSelect", "value", "error", "openSuggestionsAriaLabel", "closeSuggestionsAriaLabel", "shouldFilterOptions"];
 
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
 
@@ -78,6 +78,7 @@ var AutoComplete = /*#__PURE__*/_react["default"].forwardRef(function (_ref6, re
       error = _ref6.error,
       openSuggestionsAriaLabel = _ref6.openSuggestionsAriaLabel,
       closeSuggestionsAriaLabel = _ref6.closeSuggestionsAriaLabel,
+      shouldFilterOptions = _ref6.shouldFilterOptions,
       props = _objectWithoutPropertiesLoose(_ref6, _excluded);
 
   var _useState = (0, _react.useState)(value),
@@ -136,11 +137,11 @@ var AutoComplete = /*#__PURE__*/_react["default"].forwardRef(function (_ref6, re
         openMenu = _ref8.openMenu,
         inputValue = _ref8.inputValue;
     var reg = new RegExp("(" + escapeRegExp(inputValue || '').trim() + ")", 'gi');
-    var suggestionList = options.filter(function (option) {
+    var suggestionList = shouldFilterOptions ? options.filter(function (option) {
       return option.match(reg);
     }).sort(function (first, second) {
       return first.toLowerCase().indexOf(inputValue) < second.toLowerCase().indexOf(inputValue) ? -1 : 1;
-    });
+    }) : options;
 
     if (!!inputValue && isOpen) {
       setIsSuggestionsOpen(true);
@@ -218,7 +219,10 @@ AutoComplete.propTypes = {
   openSuggestionsAriaLabel: _propTypes.string,
 
   /** an aria label for the close suggestions icon */
-  closeSuggestionsAriaLabel: _propTypes.string
+  closeSuggestionsAriaLabel: _propTypes.string,
+
+  /** flag to enable options filtering */
+  shouldFilterOptions: _propTypes.bool
 };
 AutoComplete.defaultProps = {
   className: undefined,
@@ -231,7 +235,8 @@ AutoComplete.defaultProps = {
   value: undefined,
   error: undefined,
   openSuggestionsAriaLabel: 'Open suggestions',
-  closeSuggestionsAriaLabel: 'Close suggestions'
+  closeSuggestionsAriaLabel: 'Close suggestions',
+  shouldFilterOptions: true
 };
 var _default = AutoComplete;
 exports["default"] = _default;

package/esm/AutoComplete/web/AutoComplete.js

@@ -1,4 +1,4 @@
-var _excluded = ["className", "style", "full", "options", "onChange", "onClean", "onSelect", "value", "error", "openSuggestionsAriaLabel", "closeSuggestionsAriaLabel"];
+var _excluded = ["className", "style", "full", "options", "onChange", "onClean", "onSelect", "value", "error", "openSuggestionsAriaLabel", "closeSuggestionsAriaLabel", "shouldFilterOptions"];
 
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
 
@@ -59,6 +59,7 @@ var AutoComplete = /*#__PURE__*/React.forwardRef(function (_ref6, ref) {
       error = _ref6.error,
       openSuggestionsAriaLabel = _ref6.openSuggestionsAriaLabel,
       closeSuggestionsAriaLabel = _ref6.closeSuggestionsAriaLabel,
+      shouldFilterOptions = _ref6.shouldFilterOptions,
       props = _objectWithoutPropertiesLoose(_ref6, _excluded);
 
   var _useState = useState(value),
@@ -117,11 +118,11 @@ var AutoComplete = /*#__PURE__*/React.forwardRef(function (_ref6, ref) {
         openMenu = _ref8.openMenu,
         inputValue = _ref8.inputValue;
     var reg = new RegExp("(" + escapeRegExp(inputValue || '').trim() + ")", 'gi');
-    var suggestionList = options.filter(function (option) {
+    var suggestionList = shouldFilterOptions ? options.filter(function (option) {
       return option.match(reg);
     }).sort(function (first, second) {
       return first.toLowerCase().indexOf(inputValue) < second.toLowerCase().indexOf(inputValue) ? -1 : 1;
-    });
+    }) : options;
 
     if (!!inputValue && isOpen) {
       setIsSuggestionsOpen(true);
@@ -198,7 +199,10 @@ AutoComplete.propTypes = {
   openSuggestionsAriaLabel: string,
 
   /** an aria label for the close suggestions icon */
-  closeSuggestionsAriaLabel: string
+  closeSuggestionsAriaLabel: string,
+
+  /** flag to enable options filtering */
+  shouldFilterOptions: bool
 };
 AutoComplete.defaultProps = {
   className: undefined,
@@ -211,6 +215,7 @@ AutoComplete.defaultProps = {
   value: undefined,
   error: undefined,
   openSuggestionsAriaLabel: 'Open suggestions',
-  closeSuggestionsAriaLabel: 'Close suggestions'
+  closeSuggestionsAriaLabel: 'Close suggestions',
+  shouldFilterOptions: true
 };
 export default AutoComplete;

package/esm/AutoComplete/web/AutoComplete.test.js

@@ -53,14 +53,27 @@ describe('<AutoComplete />', function () {
       fireEvent.focus(getByDisplayValue('secon'));
       expect(container.querySelector('ul').firstChild.textContent).toBe('second');
     });
-    it('should close options list when clean button is clicked', function () {
+    it('should not filter the options', function () {
       var _render6 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(AutoComplete, {
         value: "secon",
-        options: ['first', 'second', 'third']
+        options: ['first', 'second', 'third'],
+        shouldFilterOptions: false
       }))),
           container = _render6.container,
-          getByDisplayValue = _render6.getByDisplayValue,
-          getByRole = _render6.getByRole;
+          getByDisplayValue = _render6.getByDisplayValue;
+
+      fireEvent.focus(getByDisplayValue('secon'));
+      expect(container.querySelector('ul').firstChild.textContent).toBe('first');
+      expect(container.querySelector('ul').childNodes.length).toBe(3);
+    });
+    it('should close options list when clean button is clicked', function () {
+      var _render7 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(AutoComplete, {
+        value: "secon",
+        options: ['first', 'second', 'third']
+      }))),
+          container = _render7.container,
+          getByDisplayValue = _render7.getByDisplayValue,
+          getByRole = _render7.getByRole;
 
       fireEvent.focus(getByDisplayValue('secon'));
       fireEvent.click(getByRole('button', {
@@ -75,12 +88,12 @@ describe('<AutoComplete />', function () {
       var onCleanMock = jest.fn();
       var onSelectMock = jest.fn();
 
-      var _render7 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(AutoComplete, {
+      var _render8 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(AutoComplete, {
         value: "New",
         options: ['New York'],
         onChange: onChangeMock
       }))),
-          getByDisplayValue = _render7.getByDisplayValue;
+          getByDisplayValue = _render8.getByDisplayValue;
 
       fireEvent.change(getByDisplayValue('New'), {
         target: {
@@ -96,15 +109,15 @@ describe('<AutoComplete />', function () {
       var onSelectMock = jest.fn();
       var onChangeMock = jest.fn();
 
-      var _render8 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(AutoComplete, {
+      var _render9 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(AutoComplete, {
         value: "New",
         options: ['New York'],
         onClean: onCleanMock,
         onSelect: onSelectMock,
         onChange: onChangeMock
       }))),
-          getByDisplayValue = _render8.getByDisplayValue,
-          getByRole = _render8.getByRole;
+          getByDisplayValue = _render9.getByDisplayValue,
+          getByRole = _render9.getByRole;
 
       fireEvent.focus(getByDisplayValue('New'));
       fireEvent.click(getByRole('button', {
@@ -119,15 +132,15 @@ describe('<AutoComplete />', function () {
       var onCleanMock = jest.fn();
       var onChangeMock = jest.fn();
 
-      var _render9 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(AutoComplete, {
+      var _render10 = render( /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(AutoComplete, {
         value: "New",
         options: ['New York'],
         onSelect: onSelectMock,
         onClean: onCleanMock,
         onChange: onChangeMock
       }))),
-          getByDisplayValue = _render9.getByDisplayValue,
-          getByRole = _render9.getByRole;
+          getByDisplayValue = _render10.getByDisplayValue,
+          getByRole = _render10.getByRole;
 
       fireEvent.focus(getByDisplayValue('New'));
       fireEvent.click(getByRole('option'));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gympass/yoga",
-  "version": "7.71.0",
+  "version": "7.72.0",
   "description": "Gympass component library",
   "main": "./cjs",
   "sideEffects": false,
@@ -53,7 +53,7 @@
     "react": ">=16",
     "styled-components": "^4.4.0"
   },
-  "gitHead": "9dab18e17e33d1ce97064c09c9ccf722c647e8a9",
+  "gitHead": "9231980c252bc0f14c5c37da6cec98d6070ba14f",
   "module": "./esm",
   "private": false,
   "react-native": "./cjs/index.native.js"