@scaleflex/widget-explorer 0.0.1

package/lib/utils/SearchSuggestions/SuggestionMode.js

@@ -0,0 +1,70 @@
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function _classCallCheck(a, n) { if (!(a instanceof n)) throw new TypeError("Cannot call a class as a function"); }
+function _defineProperties(e, r) { for (var t = 0; t < r.length; t++) { var o = r[t]; o.enumerable = o.enumerable || !1, o.configurable = !0, "value" in o && (o.writable = !0), Object.defineProperty(e, _toPropertyKey(o.key), o); } }
+function _createClass(e, r, t) { return r && _defineProperties(e.prototype, r), t && _defineProperties(e, t), Object.defineProperty(e, "prototype", { writable: !1 }), e; }
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+var SuggestionMode = /*#__PURE__*/function () {
+  function SuggestionMode(manager) {
+    _classCallCheck(this, SuggestionMode);
+    _defineProperty(this, "id", null);
+    _defineProperty(this, "char", null);
+    _defineProperty(this, "manager", null);
+    this.manager = manager;
+  }
+  return _createClass(SuggestionMode, [{
+    key: "searchQuery",
+    get: function get() {
+      var _this$manager$searchI;
+      return ((_this$manager$searchI = this.manager.searchInputRef) === null || _this$manager$searchI === void 0 ? void 0 : _this$manager$searchI.value) || '';
+    }
+  }, {
+    key: "modeSearchQuery",
+    get: function get() {
+      var _this$searchQuery$mat;
+      return (_this$searchQuery$mat = this.searchQuery.match(new RegExp(".*".concat(this["char"], "([^").concat(this["char"], "]*)")))) === null || _this$searchQuery$mat === void 0 ? void 0 : _this$searchQuery$mat[1];
+    }
+  }, {
+    key: "searchQueryLastChar",
+    get: function get() {
+      return this.searchQuery.slice(-1);
+    }
+  }, {
+    key: "onEnterPressed",
+    value: function onEnterPressed(event) {}
+  }, {
+    key: "onEscapePressed",
+    value: function onEscapePressed(event) {
+      this.reset();
+    }
+  }, {
+    key: "reset",
+    value: function reset() {
+      var newValue = this.searchQuery.replace(new RegExp("".concat(this["char"], "[^").concat(this["char"], "]*")), '');
+      this.manager.changeSearchInputValue(newValue);
+      this.manager.setMode(null);
+      this.manager.setActiveAttribute(null);
+      this.manager.activateAttribute(null);
+    }
+  }, {
+    key: "shouldPreventDefaultKeyDown",
+    value: function shouldPreventDefaultKeyDown(event) {
+      return false;
+    }
+  }, {
+    key: "onKeyDown",
+    value: function onKeyDown(event) {}
+  }, {
+    key: "getItems",
+    value: function getItems() {
+      return [];
+    }
+  }, {
+    key: "getEmptyItemsPlaceholder",
+    value: function getEmptyItemsPlaceholder(items) {
+      return '';
+    }
+  }]);
+}();
+export default SuggestionMode;

package/lib/utils/SearchSuggestions/SuggestionModeAttribute.js

@@ -0,0 +1,87 @@
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function _classCallCheck(a, n) { if (!(a instanceof n)) throw new TypeError("Cannot call a class as a function"); }
+function _defineProperties(e, r) { for (var t = 0; t < r.length; t++) { var o = r[t]; o.enumerable = o.enumerable || !1, o.configurable = !0, "value" in o && (o.writable = !0), Object.defineProperty(e, _toPropertyKey(o.key), o); } }
+function _createClass(e, r, t) { return r && _defineProperties(e.prototype, r), t && _defineProperties(e, t), Object.defineProperty(e, "prototype", { writable: !1 }), e; }
+function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e)); }
+function _possibleConstructorReturn(t, e) { if (e && ("object" == _typeof(e) || "function" == typeof e)) return e; if (void 0 !== e) throw new TypeError("Derived constructors may only return object or undefined"); return _assertThisInitialized(t); }
+function _assertThisInitialized(e) { if (void 0 === e) throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); return e; }
+function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
+function _getPrototypeOf(t) { return _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function (t) { return t.__proto__ || Object.getPrototypeOf(t); }, _getPrototypeOf(t); }
+function _inherits(t, e) { if ("function" != typeof e && null !== e) throw new TypeError("Super expression must either be null or a function"); t.prototype = Object.create(e && e.prototype, { constructor: { value: t, writable: !0, configurable: !0 } }), Object.defineProperty(t, "prototype", { writable: !1 }), e && _setPrototypeOf(t, e); }
+function _setPrototypeOf(t, e) { return _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function (t, e) { return t.__proto__ = e, t; }, _setPrototypeOf(t, e); }
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+import escapeRegExp from '@scaleflex/widget-utils/lib/escapeRegExp';
+import { MenuItem } from '@scaleflex/ui/core';
+import { MODE_CHAR, MODE_ID } from './constants';
+import SuggestionMode from './SuggestionMode';
+import { jsx as _jsx } from "react/jsx-runtime";
+var SuggestionModeAttribute = /*#__PURE__*/function (_SuggestionMode) {
+  function SuggestionModeAttribute() {
+    var _this;
+    _classCallCheck(this, SuggestionModeAttribute);
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+    _this = _callSuper(this, SuggestionModeAttribute, [].concat(args));
+    _defineProperty(_this, "id", MODE_ID.ATTRIBUTE);
+    _defineProperty(_this, "char", MODE_CHAR[MODE_ID.ATTRIBUTE]);
+    return _this;
+  }
+  _inherits(SuggestionModeAttribute, _SuggestionMode);
+  return _createClass(SuggestionModeAttribute, [{
+    key: "getItems",
+    value: function getItems() {
+      var _this2 = this;
+      var filteredAttributes = this.modeSearchQuery ? this.manager.attributesKeys.filter(function (aKey) {
+        return new RegExp(escapeRegExp(_this2.modeSearchQuery), 'i').test(aKey.slug);
+      }) : this.manager.attributesKeys;
+      return (filteredAttributes || []).slice(0, 10).map(function (aKey) {
+        return /*#__PURE__*/_jsx(MenuItem, {
+          onClick: function onClick() {
+            var newValue = _this2.searchQueryLastChar === MODE_CHAR[MODE_ID.ATTRIBUTE] ? "".concat(_this2.searchQuery).concat(aKey.slug).concat(MODE_CHAR[MODE_ID.EXPRESSION]) : _this2.searchQuery.replace(new RegExp("".concat(MODE_CHAR[MODE_ID.ATTRIBUTE]).concat(_this2.modeSearchQuery, "$")), "".concat(MODE_CHAR[MODE_ID.ATTRIBUTE]).concat(aKey.slug).concat(MODE_CHAR[MODE_ID.EXPRESSION]));
+            _this2.manager.changeSearchInputValue(newValue);
+            _this2.manager.setActiveAttribute(aKey);
+            _this2.manager.activateAttribute(aKey);
+          },
+          children: "".concat(MODE_CHAR[MODE_ID.ATTRIBUTE]).concat(aKey.slug)
+        }, aKey.sys_key);
+      });
+    }
+  }, {
+    key: "shouldPreventDefaultKeyDown",
+    value: function shouldPreventDefaultKeyDown(event) {
+      var _this3 = this;
+      if (event.key === MODE_CHAR[MODE_ID.EXPRESSION]) {
+        var attrKey = (this.manager.attributesKeys || []).find(function (aKey) {
+          return aKey.slug === _this3.modeSearchQuery;
+        });
+        if (!attrKey) {
+          return true;
+        }
+      }
+      return false;
+    }
+  }, {
+    key: "onKeyDown",
+    value: function onKeyDown(event) {
+      var _this4 = this;
+      if (event.key === MODE_CHAR[MODE_ID.EXPRESSION]) {
+        var attrKey = (this.manager.attributesKeys || []).find(function (aKey) {
+          return aKey.slug === _this4.modeSearchQuery;
+        });
+        if (attrKey) {
+          this.manager.setActiveAttribute(attrKey);
+          this.manager.activateAttribute(attrKey);
+        }
+      }
+    }
+  }, {
+    key: "getEmptyItemsPlaceholder",
+    value: function getEmptyItemsPlaceholder() {
+      return this.manager.i18n('searchSuggestionsPlaceholderNoAttributes');
+    }
+  }]);
+}(SuggestionMode);
+export default SuggestionModeAttribute;

package/lib/utils/SearchSuggestions/SuggestionModeExpression.js

@@ -0,0 +1,121 @@
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function _classCallCheck(a, n) { if (!(a instanceof n)) throw new TypeError("Cannot call a class as a function"); }
+function _defineProperties(e, r) { for (var t = 0; t < r.length; t++) { var o = r[t]; o.enumerable = o.enumerable || !1, o.configurable = !0, "value" in o && (o.writable = !0), Object.defineProperty(e, _toPropertyKey(o.key), o); } }
+function _createClass(e, r, t) { return r && _defineProperties(e.prototype, r), t && _defineProperties(e, t), Object.defineProperty(e, "prototype", { writable: !1 }), e; }
+function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e)); }
+function _possibleConstructorReturn(t, e) { if (e && ("object" == _typeof(e) || "function" == typeof e)) return e; if (void 0 !== e) throw new TypeError("Derived constructors may only return object or undefined"); return _assertThisInitialized(t); }
+function _assertThisInitialized(e) { if (void 0 === e) throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); return e; }
+function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
+function _getPrototypeOf(t) { return _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function (t) { return t.__proto__ || Object.getPrototypeOf(t); }, _getPrototypeOf(t); }
+function _inherits(t, e) { if ("function" != typeof e && null !== e) throw new TypeError("Super expression must either be null or a function"); t.prototype = Object.create(e && e.prototype, { constructor: { value: t, writable: !0, configurable: !0 } }), Object.defineProperty(t, "prototype", { writable: !1 }), e && _setPrototypeOf(t, e); }
+function _setPrototypeOf(t, e) { return _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function (t, e) { return t.__proto__ = e, t; }, _setPrototypeOf(t, e); }
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+import escapeRegExp from '@scaleflex/widget-utils/lib/escapeRegExp';
+import { MenuItem } from '@scaleflex/ui/core';
+import { EXPRESSION_API_SLUG_TO_LABEL_I18N_KEY, MODE_CHAR, MODE_ID } from './constants';
+import SuggestionMode from './SuggestionMode';
+import { jsx as _jsx } from "react/jsx-runtime";
+var SuggestionModeExpression = /*#__PURE__*/function (_SuggestionMode) {
+  function SuggestionModeExpression() {
+    var _this;
+    _classCallCheck(this, SuggestionModeExpression);
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+    _this = _callSuper(this, SuggestionModeExpression, [].concat(args));
+    _defineProperty(_this, "id", MODE_ID.EXPRESSION);
+    _defineProperty(_this, "char", MODE_CHAR[MODE_ID.EXPRESSION]);
+    return _this;
+  }
+  _inherits(SuggestionModeExpression, _SuggestionMode);
+  return _createClass(SuggestionModeExpression, [{
+    key: "getItems",
+    value: function getItems() {
+      var _this2 = this;
+      if (this.manager.activeAttribute) {
+        var expressions = this.manager.activeAttribute.stats.top_values || [];
+        if (this.manager.filters.length && expressions.length) {
+          var selectedExpressions = this.manager.filters.filter(function (filter) {
+            return filter.key === _this2.manager.activeAttribute.slug;
+          }).map(function (filter) {
+            var _filter$value;
+            return ((_filter$value = filter.value) === null || _filter$value === void 0 ? void 0 : _filter$value.sys_key) || filter.value;
+          });
+          if (selectedExpressions.length) {
+            expressions = expressions.filter(function (expression) {
+              return !selectedExpressions.includes(expression.sys_key);
+            });
+          }
+        }
+        var filteredExpressions = this.modeSearchQuery ? expressions.filter(function (aKey) {
+          return new RegExp(escapeRegExp(_this2.modeSearchQuery), 'i').test(aKey.sys_key) || new RegExp(escapeRegExp(_this2.modeSearchQuery), 'i').test(aKey.label);
+        }) : expressions;
+        return filteredExpressions.slice(0, 10).map(function (value) {
+          return /*#__PURE__*/_jsx(MenuItem, {
+            onClick: function onClick() {
+              _this2.manager.selectFilter(_this2.manager.activeAttribute.slug, value);
+              _this2.resetAttribute();
+            },
+            children: EXPRESSION_API_SLUG_TO_LABEL_I18N_KEY[value.api_slug] && _this2.manager.i18n(EXPRESSION_API_SLUG_TO_LABEL_I18N_KEY[value.api_slug]) || value.label || value.sys_key
+          }, value.sys_key);
+        });
+      }
+      return [];
+    }
+  }, {
+    key: "getEmptyItemsPlaceholder",
+    value: function getEmptyItemsPlaceholder() {
+      var _this$manager$activeA, _this$manager$activeA2, _this$manager$activeA3, _this$manager$activeA4;
+      if (this.modeSearchQuery && ((_this$manager$activeA = this.manager.activeAttribute) === null || _this$manager$activeA === void 0 ? void 0 : (_this$manager$activeA2 = _this$manager$activeA.stats) === null || _this$manager$activeA2 === void 0 ? void 0 : _this$manager$activeA2.is_free_text) === 1) {
+        return this.manager.i18n('searchSuggestionsPlaceholderPressEnter');
+      } else if (((_this$manager$activeA3 = this.manager.activeAttribute) === null || _this$manager$activeA3 === void 0 ? void 0 : (_this$manager$activeA4 = _this$manager$activeA3.stats) === null || _this$manager$activeA4 === void 0 ? void 0 : _this$manager$activeA4.is_numeric) === 1) {
+        return this.manager.i18n('searchSuggestionsPlaceholderNumbersOnly');
+      }
+      return this.manager.i18n('searchSuggestionsPlaceholderNoExpressions');
+    }
+  }, {
+    key: "resetAttribute",
+    value: function resetAttribute() {
+      this.manager.modeAttribute.reset();
+    }
+  }, {
+    key: "reset",
+    value: function reset() {
+      var newValue = this.searchQuery.replace(new RegExp("".concat(this["char"], "[^").concat(this["char"], "]*")), '');
+      this.manager.changeSearchInputValue(newValue);
+      this.manager.setMode(MODE_ID.ATTRIBUTE);
+    }
+  }, {
+    key: "onEnterPressed",
+    value: function onEnterPressed(event) {
+      if (this.modeSearchQuery) {
+        this.manager.selectFilter(this.manager.activeAttribute.slug, this.modeSearchQuery);
+        this.resetAttribute();
+      }
+    }
+  }, {
+    key: "shouldPreventDefaultKeyDown",
+    value: function shouldPreventDefaultKeyDown(event) {
+      var _this$manager$activeA5, _this$manager$activeA6;
+      if (((_this$manager$activeA5 = this.manager.activeAttribute) === null || _this$manager$activeA5 === void 0 ? void 0 : (_this$manager$activeA6 = _this$manager$activeA5.stats) === null || _this$manager$activeA6 === void 0 ? void 0 : _this$manager$activeA6.is_numeric) === 1 && /[\sa-z]/gi.test(event.key) && !['Backspace'].includes(event.key)) {
+        return true;
+      }
+      return false;
+    }
+  }, {
+    key: "onKeyDown",
+    value: function onKeyDown(event) {
+      var _this3 = this;
+      var attrKey = (this.manager.attributesKeys || []).find(function (aKey) {
+        return aKey.slug === _this3.modeSearchQuery;
+      });
+      if (attrKey) {
+        this.manager.setActiveAttribute(attrKey);
+        this.manager.activateAttribute(attrKey);
+      }
+    }
+  }]);
+}(SuggestionMode);
+export default SuggestionModeExpression;

package/lib/utils/SearchSuggestions/SuggestionModeTag.js

@@ -0,0 +1,87 @@
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function _classCallCheck(a, n) { if (!(a instanceof n)) throw new TypeError("Cannot call a class as a function"); }
+function _defineProperties(e, r) { for (var t = 0; t < r.length; t++) { var o = r[t]; o.enumerable = o.enumerable || !1, o.configurable = !0, "value" in o && (o.writable = !0), Object.defineProperty(e, _toPropertyKey(o.key), o); } }
+function _createClass(e, r, t) { return r && _defineProperties(e.prototype, r), t && _defineProperties(e, t), Object.defineProperty(e, "prototype", { writable: !1 }), e; }
+function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e)); }
+function _possibleConstructorReturn(t, e) { if (e && ("object" == _typeof(e) || "function" == typeof e)) return e; if (void 0 !== e) throw new TypeError("Derived constructors may only return object or undefined"); return _assertThisInitialized(t); }
+function _assertThisInitialized(e) { if (void 0 === e) throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); return e; }
+function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
+function _getPrototypeOf(t) { return _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function (t) { return t.__proto__ || Object.getPrototypeOf(t); }, _getPrototypeOf(t); }
+function _inherits(t, e) { if ("function" != typeof e && null !== e) throw new TypeError("Super expression must either be null or a function"); t.prototype = Object.create(e && e.prototype, { constructor: { value: t, writable: !0, configurable: !0 } }), Object.defineProperty(t, "prototype", { writable: !1 }), e && _setPrototypeOf(t, e); }
+function _setPrototypeOf(t, e) { return _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function (t, e) { return t.__proto__ = e, t; }, _setPrototypeOf(t, e); }
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+import escapeRegExp from '@scaleflex/widget-utils/lib/escapeRegExp';
+import { MenuItem } from '@scaleflex/ui/core';
+import { MODE_CHAR, MODE_ID } from './constants';
+import SuggestionMode from './SuggestionMode';
+import { jsx as _jsx } from "react/jsx-runtime";
+var SuggestionModeTag = /*#__PURE__*/function (_SuggestionMode) {
+  function SuggestionModeTag() {
+    var _this;
+    _classCallCheck(this, SuggestionModeTag);
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+    _this = _callSuper(this, SuggestionModeTag, [].concat(args));
+    _defineProperty(_this, "id", MODE_ID.TAG);
+    _defineProperty(_this, "char", MODE_CHAR[MODE_ID.TAG]);
+    return _this;
+  }
+  _inherits(SuggestionModeTag, _SuggestionMode);
+  return _createClass(SuggestionModeTag, [{
+    key: "getFilteredTags",
+    value: function getFilteredTags() {
+      var _this2 = this;
+      var filteredOptions = this.manager.attributesTags;
+      if (this.manager.tags.length) {
+        var selectedTags = this.manager.tags.filter(function (tag) {
+          return tag.name && tag.sid;
+        }).map(function (tag) {
+          return tag.name + tag.sid;
+        });
+        if (selectedTags.length) {
+          filteredOptions = this.manager.attributesTags.filter(function (tag) {
+            return !selectedTags.includes(tag.name + tag.sid);
+          });
+        }
+      }
+      var filteredTags = this.modeSearchQuery ? filteredOptions.filter(function (aTag) {
+        return new RegExp(escapeRegExp(_this2.modeSearchQuery), 'i').test(aTag.name);
+      }) : filteredOptions;
+      return filteredTags || [];
+    }
+  }, {
+    key: "getItems",
+    value: function getItems() {
+      var _this3 = this;
+      return this.getFilteredTags().slice(0, 10).map(function (aTag) {
+        return /*#__PURE__*/_jsx(MenuItem, {
+          onClick: function onClick() {
+            _this3.manager.selectTag(aTag);
+            _this3.reset();
+          },
+          children: "".concat(_this3["char"]).concat(aTag.name)
+        }, aTag.name);
+      });
+    }
+  }, {
+    key: "onEnterPressed",
+    value: function onEnterPressed(event) {
+      if (this.modeSearchQuery) {
+        var searchedTag = this.getFilteredTags()[0];
+        if (searchedTag) {
+          this.manager.selectTag(searchedTag);
+          this.reset();
+        }
+      }
+    }
+  }, {
+    key: "getEmptyItemsPlaceholder",
+    value: function getEmptyItemsPlaceholder() {
+      return this.manager.i18n('searchSuggestionsPlaceholderNoTags');
+    }
+  }]);
+}(SuggestionMode);
+export default SuggestionModeTag;

package/lib/utils/SearchSuggestions/SuggestionsManager.js

@@ -0,0 +1,242 @@
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function _classCallCheck(a, n) { if (!(a instanceof n)) throw new TypeError("Cannot call a class as a function"); }
+function _defineProperties(e, r) { for (var t = 0; t < r.length; t++) { var o = r[t]; o.enumerable = o.enumerable || !1, o.configurable = !0, "value" in o && (o.writable = !0), Object.defineProperty(e, _toPropertyKey(o.key), o); } }
+function _createClass(e, r, t) { return r && _defineProperties(e.prototype, r), t && _defineProperties(e, t), Object.defineProperty(e, "prototype", { writable: !1 }), e; }
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+import { MODE_CHAR, MODE_ID } from './constants';
+import SuggestionModeAttribute from './SuggestionModeAttribute';
+import SuggestionModeExpression from './SuggestionModeExpression';
+import SuggestionModeTag from './SuggestionModeTag';
+var SuggestionsManager = /*#__PURE__*/function () {
+  function SuggestionsManager(_ref) {
+    var i18n = _ref.i18n,
+      _ref$modeId = _ref.modeId,
+      modeId = _ref$modeId === void 0 ? null : _ref$modeId,
+      searchInputRef = _ref.searchInputRef,
+      setModeState = _ref.setModeState,
+      _ref$attributesKeys = _ref.attributesKeys,
+      attributesKeys = _ref$attributesKeys === void 0 ? [] : _ref$attributesKeys,
+      _ref$attributesTags = _ref.attributesTags,
+      attributesTags = _ref$attributesTags === void 0 ? [] : _ref$attributesTags,
+      selectFilter = _ref.selectFilter,
+      selectTag = _ref.selectTag,
+      _ref$filters = _ref.filters,
+      filters = _ref$filters === void 0 ? [] : _ref$filters,
+      _ref$tags = _ref.tags,
+      tags = _ref$tags === void 0 ? [] : _ref$tags,
+      setItems = _ref.setItems,
+      setEmptyItemsPlaceholder = _ref.setEmptyItemsPlaceholder;
+    _classCallCheck(this, SuggestionsManager);
+    _defineProperty(this, "i18n", function () {});
+    _defineProperty(this, "activeMode", null);
+    _defineProperty(this, "activeAttribute", null);
+    _defineProperty(this, "searchInputRef", null);
+    _defineProperty(this, "setModeState", function () {});
+    _defineProperty(this, "attributesKeys", []);
+    _defineProperty(this, "attributesTags", []);
+    _defineProperty(this, "selectFilter", function () {});
+    _defineProperty(this, "selectTag", function () {});
+    _defineProperty(this, "setItems", function () {});
+    _defineProperty(this, "setEmptyItemsPlaceholder", function () {});
+    _defineProperty(this, "filters", []);
+    // selected filters
+    _defineProperty(this, "tags", []);
+    // selected tags
+    _defineProperty(this, "modeAttribute", new SuggestionModeAttribute(this));
+    _defineProperty(this, "modeExpression", new SuggestionModeExpression(this));
+    _defineProperty(this, "modeTag", new SuggestionModeTag(this));
+    _defineProperty(this, "items", []);
+    _defineProperty(this, "emptyItemsPlaceholder", '');
+    this.setI18n(i18n);
+    this.setModeState = setModeState;
+    this.setMode(modeId);
+    this.setSearchInputRef(searchInputRef);
+    this.setAttributesKeys(attributesKeys);
+    this.setAttributesTags(attributesTags);
+    this.setSelectFilter(selectFilter);
+    this.setSelectTag(selectTag);
+    this.setFilters(filters);
+    this.setTags(tags);
+    this.setItems = setItems;
+    this.setEmptyItemsPlaceholder = setEmptyItemsPlaceholder;
+  }
+  return _createClass(SuggestionsManager, [{
+    key: "setMode",
+    value: function setMode() {
+      var modeId = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
+      switch (modeId) {
+        case MODE_ID.ATTRIBUTE:
+          this.activeMode = this.modeAttribute;
+          break;
+        case MODE_ID.EXPRESSION:
+          this.activeMode = this.modeExpression;
+          break;
+        case MODE_ID.TAG:
+          this.activeMode = this.modeTag;
+          break;
+        default:
+          this.activeMode = null;
+      }
+      this.setModeState(modeId);
+      this.render();
+    }
+  }, {
+    key: "setActiveAttribute",
+    value: function setActiveAttribute() {
+      var activeAttribute = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
+      this.activeAttribute = activeAttribute || null;
+      this.render();
+    }
+  }, {
+    key: "setSearchInputRef",
+    value: function setSearchInputRef() {
+      var searchInputRef = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
+      this.searchInputRef = searchInputRef || null;
+    }
+  }, {
+    key: "setAttributesKeys",
+    value: function setAttributesKeys() {
+      var attributesKeys = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
+      this.attributesKeys = attributesKeys || [];
+    }
+  }, {
+    key: "setAttributesTags",
+    value: function setAttributesTags() {
+      var attributesTags = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
+      this.attributesTags = attributesTags || [];
+    }
+  }, {
+    key: "setSelectFilter",
+    value: function setSelectFilter(selectFilter) {
+      this.selectFilter = selectFilter;
+    }
+  }, {
+    key: "setSelectTag",
+    value: function setSelectTag(selectTag) {
+      this.selectTag = selectTag;
+    }
+  }, {
+    key: "setFilters",
+    value: function setFilters() {
+      var filters = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
+      this.filters = filters || [];
+    }
+  }, {
+    key: "setTags",
+    value: function setTags() {
+      var tags = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
+      this.tags = tags || [];
+    }
+  }, {
+    key: "setI18n",
+    value: function setI18n(i18n) {
+      this.i18n = i18n;
+    }
+  }, {
+    key: "activateAttribute",
+    value: function activateAttribute() {
+      var attribute = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
+      this.setMode(attribute ? MODE_ID.EXPRESSION : null);
+      this.setActiveAttribute(attribute);
+    }
+  }, {
+    key: "changeSearchInputValue",
+    value: function changeSearchInputValue(newValue) {
+      this.searchInputRef.value = newValue;
+      this.searchInputRef.focus();
+    }
+  }, {
+    key: "onSearchButtonClick",
+    value: function onSearchButtonClick(event) {
+      this.activeMode.onEnterPressed(event);
+    }
+  }, {
+    key: "onSearchInputKeyDown",
+    value: function onSearchInputKeyDown(event) {
+      if (this.activeMode) {
+        switch (event.key) {
+          case 'Enter':
+            this.activeMode.onEnterPressed(event);
+            break;
+          case 'Escape':
+            this.activeMode.onEscapePressed(event);
+            break;
+          default:
+            {
+              var shouldPreventDefault = false;
+              if (this.activeMode) {
+                shouldPreventDefault = this.activeMode["char"] === event.key ? true : this.activeMode.shouldPreventDefaultKeyDown(event);
+              }
+              if (shouldPreventDefault) {
+                event.preventDefault();
+                event.stopPropagation();
+              } else if (this.activeMode) {
+                this.activeMode.onKeyDown(event);
+              }
+            }
+        }
+      } else {
+        // No active mode
+        if (event.key === MODE_CHAR[MODE_ID.ATTRIBUTE]) {
+          this.setMode(MODE_ID.ATTRIBUTE);
+        } else if (event.key === MODE_CHAR[MODE_ID.TAG]) {
+          this.setMode(MODE_ID.TAG);
+        }
+      }
+    }
+  }, {
+    key: "onSearchInputKeyUp",
+    value: function onSearchInputKeyUp(event) {
+      var _event$currentTarget;
+      var q = (_event$currentTarget = event.currentTarget) === null || _event$currentTarget === void 0 ? void 0 : _event$currentTarget.value;
+      if (this.activeMode) {
+        var _this$activeMode;
+        var isAttrModeCharIncluded = this.activeMode.id !== MODE_ID.TAG && q.includes(MODE_CHAR[MODE_ID.ATTRIBUTE]);
+        var isTagModeCharIncluded = this.activeMode.id === MODE_ID.TAG && q.includes(MODE_CHAR[MODE_ID.TAG]);
+        if (!q || !(isAttrModeCharIncluded || isTagModeCharIncluded)) {
+          this.setMode(null);
+          this.setActiveAttribute(null);
+        }
+        if (((_this$activeMode = this.activeMode) === null || _this$activeMode === void 0 ? void 0 : _this$activeMode.id) === MODE_ID.EXPRESSION && this.activeAttribute && !new RegExp("".concat(this.activeAttribute.slug).concat(MODE_CHAR[MODE_ID.EXPRESSION])).test(q)) {
+          this.setMode(MODE_ID.ATTRIBUTE);
+        }
+      }
+    }
+  }, {
+    key: "reset",
+    value: function reset() {
+      if (this.activeMode) {
+        this.activeMode.reset();
+      }
+    }
+  }, {
+    key: "getItems",
+    value: function getItems() {
+      return this.activeMode ? this.activeMode.getItems() : [];
+    }
+  }, {
+    key: "getEmptyItemsPlaceholder",
+    value: function getEmptyItemsPlaceholder(items) {
+      return this.activeMode ? this.activeMode.getEmptyItemsPlaceholder(items) : '';
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      var newItems = this.getItems();
+      var newEmptyItemsPlaceholder = this.getEmptyItemsPlaceholder(this.items);
+      var newItemsEmpty = Array.isArray(newItems) && newItems.length === 0;
+      var oldItemsEmpty = Array.isArray(this.items) && this.items.length === 0;
+      if (newItems !== this.items && !(newItemsEmpty && oldItemsEmpty)) {
+        this.items = newItems;
+        this.setItems(this.items);
+      }
+      if (newEmptyItemsPlaceholder !== this.emptyItemsPlaceholder) {
+        this.emptyItemsPlaceholder = newEmptyItemsPlaceholder;
+        this.setEmptyItemsPlaceholder(this.emptyItemsPlaceholder);
+      }
+    }
+  }]);
+}();
+export default SuggestionsManager;

package/lib/utils/SearchSuggestions/constants.js

@@ -0,0 +1,14 @@
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+import { ORIENTATION_KEY_TO_LABEL_I18N_KEYS } from '../constants';
+export var MODE_ID = {
+  ATTRIBUTE: 'ATTRIBUTE',
+  EXPRESSION: 'EXPRESSION',
+  TAG: 'TAG'
+};
+export var MODE_CHAR = _defineProperty(_defineProperty(_defineProperty({}, MODE_ID.ATTRIBUTE, '@'), MODE_ID.EXPRESSION, ':'), MODE_ID.TAG, '#');
+export var EXPRESSION_API_SLUG_TO_LABEL_I18N_KEY = _objectSpread({}, ORIENTATION_KEY_TO_LABEL_I18N_KEYS);

package/lib/utils/SearchSuggestions/index.js

@@ -0,0 +1,4 @@
+import SuggestionsManager from './SuggestionsManager';
+import SearchSuggestionsMenu from './SearchSuggestionsMenu';
+import { MODE_CHAR, MODE_ID } from './constants';
+export { SuggestionsManager, MODE_CHAR, MODE_ID, SearchSuggestionsMenu };

package/lib/utils/SearchSuggestions/styled.js

@@ -0,0 +1,12 @@
+var _templateObject;
+function _taggedTemplateLiteral(e, t) { return t || (t = e.slice(0)), Object.freeze(Object.defineProperties(e, { raw: { value: Object.freeze(t) } })); }
+import styled from 'styled-components';
+import { Menu as SfxMenu } from '@scaleflex/ui/core';
+var Menu = styled(SfxMenu)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  ", "\n\n  .SfxMenuItem-root {\n    display: block;\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n  }\n"])), function (_ref) {
+  var $width = _ref.$width;
+  return $width && "width: ".concat($width, "px;");
+});
+var Styled = {
+  Menu: Menu
+};
+export default Styled;

package/lib/utils/availableScreenSizes.js

@@ -0,0 +1,4 @@
+var WIDTH_XL = 900;
+var WIDTH_LG = 700;
+var WIDTH_MD = 576;
+export { WIDTH_XL, WIDTH_LG, WIDTH_MD };