@miso.ai/client-sdk-ui 1.11.0-beta.9 → 1.11.1-beta.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (111) hide show
  1. package/dist/cjs/actor/feedback.js +6 -39
  2. package/dist/cjs/actor/fields.js +14 -6
  3. package/dist/cjs/actor/index.js +0 -7
  4. package/dist/cjs/actor/interactions.js +4 -15
  5. package/dist/cjs/actor/sessions.js +2 -32
  6. package/dist/cjs/actor/tracker.js +25 -26
  7. package/dist/cjs/actor/utils.js +0 -49
  8. package/dist/cjs/actor/view.js +40 -40
  9. package/dist/cjs/actor/views.js +29 -8
  10. package/dist/cjs/constants.js +18 -19
  11. package/dist/cjs/defaults/hybrid-search/phrases.js +3 -3
  12. package/dist/cjs/defaults/hybrid-search/templates.js +22 -7
  13. package/dist/cjs/element/role/index.js +12 -5
  14. package/dist/cjs/element/role/{miso-hits.js → miso-more.js} +4 -4
  15. package/dist/cjs/element/role/miso-total.js +20 -0
  16. package/dist/cjs/layout/affiliation/affiliation.js +0 -3
  17. package/dist/cjs/layout/banner/banner.js +0 -4
  18. package/dist/cjs/layout/button/more-button.js +73 -0
  19. package/dist/cjs/layout/container/container.js +0 -3
  20. package/dist/cjs/layout/error/error.js +0 -4
  21. package/dist/cjs/layout/index.js +7 -0
  22. package/dist/cjs/layout/input/facets.js +0 -4
  23. package/dist/cjs/layout/input/option-list.js +0 -4
  24. package/dist/cjs/layout/input/search-box.js +13 -12
  25. package/dist/cjs/layout/list/cards.js +0 -3
  26. package/dist/cjs/layout/list/carousel.js +0 -3
  27. package/dist/cjs/layout/list/collection.js +22 -7
  28. package/dist/cjs/layout/list/list.js +0 -3
  29. package/dist/cjs/layout/radio/feedback.js +0 -3
  30. package/dist/cjs/layout/radio/radio.js +0 -4
  31. package/dist/cjs/layout/raf.js +4 -2
  32. package/dist/cjs/layout/text/text.js +0 -4
  33. package/dist/cjs/layout/text/typewriter/index.js +0 -3
  34. package/dist/cjs/layout/triggerable.js +79 -0
  35. package/dist/cjs/util/states.js +0 -15
  36. package/dist/cjs/version.js +1 -1
  37. package/dist/cjs/workflow/answer-based.js +70 -105
  38. package/dist/cjs/workflow/ask.js +29 -27
  39. package/dist/cjs/workflow/asks.js +1 -1
  40. package/dist/cjs/workflow/autocompletable.js +33 -0
  41. package/dist/cjs/workflow/autocomplete.js +122 -0
  42. package/dist/cjs/workflow/base.js +156 -98
  43. package/dist/cjs/workflow/explore.js +48 -46
  44. package/dist/cjs/workflow/hybrid-search-answer.js +17 -7
  45. package/dist/cjs/workflow/hybrid-search-results.js +17 -87
  46. package/dist/cjs/workflow/hybrid-search-views.js +122 -0
  47. package/dist/cjs/workflow/hybrid-search.js +47 -168
  48. package/dist/cjs/workflow/options.js +32 -17
  49. package/dist/cjs/workflow/processors.js +166 -2
  50. package/dist/cjs/workflow/recommendation.js +36 -49
  51. package/dist/cjs/workflow/search-based.js +228 -0
  52. package/dist/cjs/workflow/search.js +21 -68
  53. package/dist/cjs/workflow/use-link.js +44 -0
  54. package/package.json +2 -2
  55. package/src/actor/feedback.js +6 -23
  56. package/src/actor/fields.js +14 -6
  57. package/src/actor/index.js +0 -1
  58. package/src/actor/interactions.js +4 -10
  59. package/src/actor/sessions.js +3 -31
  60. package/src/actor/tracker.js +25 -19
  61. package/src/actor/utils.js +0 -47
  62. package/src/actor/view.js +27 -15
  63. package/src/actor/views.js +32 -8
  64. package/src/constants.js +25 -16
  65. package/src/defaults/hybrid-search/phrases.js +2 -2
  66. package/src/defaults/hybrid-search/templates.js +17 -5
  67. package/src/element/role/index.js +2 -1
  68. package/src/element/role/{miso-hits.js → miso-more.js} +3 -3
  69. package/src/element/role/miso-total.js +16 -0
  70. package/src/layout/affiliation/affiliation.js +1 -5
  71. package/src/layout/banner/banner.js +0 -5
  72. package/src/layout/button/more-button.js +69 -0
  73. package/src/layout/container/container.js +1 -5
  74. package/src/layout/error/error.js +0 -5
  75. package/src/layout/index.js +2 -1
  76. package/src/layout/input/facets.js +0 -5
  77. package/src/layout/input/option-list.js +0 -5
  78. package/src/layout/input/search-box.js +11 -14
  79. package/src/layout/list/cards.js +0 -4
  80. package/src/layout/list/carousel.js +0 -4
  81. package/src/layout/list/collection.js +21 -9
  82. package/src/layout/list/list.js +0 -4
  83. package/src/layout/radio/feedback.js +0 -4
  84. package/src/layout/radio/radio.js +0 -5
  85. package/src/layout/raf.js +2 -2
  86. package/src/layout/text/text.js +0 -5
  87. package/src/layout/text/typewriter/index.js +1 -5
  88. package/src/layout/triggerable.js +76 -0
  89. package/src/util/states.js +0 -14
  90. package/src/version.js +1 -1
  91. package/src/workflow/answer-based.js +61 -72
  92. package/src/workflow/ask.js +30 -24
  93. package/src/workflow/asks.js +1 -1
  94. package/src/workflow/autocompletable.js +29 -0
  95. package/src/workflow/autocomplete.js +113 -0
  96. package/src/workflow/base.js +133 -87
  97. package/src/workflow/explore.js +38 -30
  98. package/src/workflow/hybrid-search-answer.js +17 -6
  99. package/src/workflow/hybrid-search-results.js +17 -77
  100. package/src/workflow/hybrid-search-views.js +124 -0
  101. package/src/workflow/hybrid-search.js +47 -157
  102. package/src/workflow/options.js +26 -11
  103. package/src/workflow/processors.js +151 -3
  104. package/src/workflow/recommendation.js +32 -33
  105. package/src/workflow/search-based.js +222 -0
  106. package/src/workflow/search.js +21 -65
  107. package/src/workflow/use-link.js +40 -0
  108. package/dist/cjs/actor/autocomplete.js +0 -160
  109. package/dist/cjs/workflow/utils.js +0 -42
  110. package/src/actor/autocomplete.js +0 -133
  111. package/src/workflow/utils.js +0 -29
@@ -61,7 +61,7 @@ class Sections extends _templates.Sections {
61
61
  return container(options, {
62
62
  name: 'search-results',
63
63
  visibleWhen: 'loading ready'
64
- }, [this.searchResultsInfoGroup(options), this.searchResultsFilters(options), '<miso-products></miso-products>']);
64
+ }, [this.searchResultsInfoGroup(options), this.searchResultsFilters(options), '<miso-products></miso-products>', this.more(options)]);
65
65
  }
66
66
  searchResultsInfoGroup(options) {
67
67
  const {
@@ -72,7 +72,7 @@ class Sections extends _templates.Sections {
72
72
  } = options;
73
73
  return element('div', {
74
74
  classes: [`${classPrefix}__search-results-info`]
75
- }, [this.keywords(options), this.hits(options)]);
75
+ }, [this.keywords(options), this.total(options)]);
76
76
  }
77
77
  searchResultsFilters(options) {
78
78
  const {
@@ -95,15 +95,29 @@ class Sections extends _templates.Sections {
95
95
  inline: true
96
96
  }).replaceAll('${value}', '<miso-keywords></miso-keywords>');
97
97
  }
98
- hits(options) {
98
+ total(options) {
99
99
  const {
100
100
  phrase
101
101
  } = this._helpers;
102
102
  return phrase(options, {
103
- name: 'hits',
103
+ name: 'total',
104
104
  tag: 'div',
105
105
  inline: true
106
- }).replaceAll('${value}', '<miso-hits></miso-hits>');
106
+ }).replaceAll('${value}', '<miso-total></miso-total>');
107
+ }
108
+ more(options) {
109
+ if (!options.moreButton) {
110
+ return '';
111
+ }
112
+ const {
113
+ element
114
+ } = this._helpers;
115
+ const {
116
+ classPrefix
117
+ } = options;
118
+ return element('div', {
119
+ classes: [`${classPrefix}__search-results-more-container`]
120
+ }, ['<miso-more></miso-more>']);
107
121
  }
108
122
  }
109
123
  const helpers = exports.helpers = (0, _commons.externalize)(new _templates.Helpers(Object.assign({}, CONSTANTS, {
@@ -122,7 +136,8 @@ function root() {
122
136
  options = normalizeOptions(options);
123
137
  const {
124
138
  answerBox,
125
- answerGroup
139
+ answerGroup,
140
+ searchResultsGroup
126
141
  } = sections;
127
142
  const {
128
143
  answerBox: answerBoxOptions = true
@@ -135,6 +150,6 @@ function root() {
135
150
  name: 'answer'
136
151
  }, answerBoxOptions ? [answerBox(options)] : answerGroup(options)), section(options, {
137
152
  name: 'search-results'
138
- }, sections.searchResultsGroup(options))].join('');
153
+ }, searchResultsGroup(options))].join('');
139
154
  }
140
155
  ;
@@ -33,16 +33,16 @@ Object.defineProperty(exports, "MisoFeedbackElement", {
33
33
  return _misoFeedback.default;
34
34
  }
35
35
  });
36
- Object.defineProperty(exports, "MisoHitsElement", {
36
+ Object.defineProperty(exports, "MisoKeywordsElement", {
37
37
  enumerable: true,
38
38
  get: function () {
39
- return _misoHits.default;
39
+ return _misoKeywords.default;
40
40
  }
41
41
  });
42
- Object.defineProperty(exports, "MisoKeywordsElement", {
42
+ Object.defineProperty(exports, "MisoMoreElement", {
43
43
  enumerable: true,
44
44
  get: function () {
45
- return _misoKeywords.default;
45
+ return _misoMore.default;
46
46
  }
47
47
  });
48
48
  Object.defineProperty(exports, "MisoProductsElement", {
@@ -99,6 +99,12 @@ Object.defineProperty(exports, "MisoSovrnAffiliationElement", {
99
99
  return _misoAffiliation.default;
100
100
  }
101
101
  });
102
+ Object.defineProperty(exports, "MisoTotalElement", {
103
+ enumerable: true,
104
+ get: function () {
105
+ return _misoTotal.default;
106
+ }
107
+ });
102
108
  var _misoComponent = _interopRequireDefault(require("./miso-component.js"));
103
109
  var _misoQuery = _interopRequireDefault(require("./miso-query.js"));
104
110
  var _misoQuerySuggestions = _interopRequireDefault(require("./miso-query-suggestions.js"));
@@ -112,7 +118,8 @@ var _misoRelatedResources = _interopRequireDefault(require("./miso-related-resou
112
118
  var _misoRelatedQuestions = _interopRequireDefault(require("./miso-related-questions.js"));
113
119
  var _misoAffiliation = _interopRequireDefault(require("./miso-affiliation.js"));
114
120
  var _misoKeywords = _interopRequireDefault(require("./miso-keywords.js"));
115
- var _misoHits = _interopRequireDefault(require("./miso-hits.js"));
121
+ var _misoTotal = _interopRequireDefault(require("./miso-total.js"));
116
122
  var _misoFacets = _interopRequireDefault(require("./miso-facets.js"));
123
+ var _misoMore = _interopRequireDefault(require("./miso-more.js"));
117
124
  var _misoError = _interopRequireDefault(require("./miso-error.js"));
118
125
  function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
@@ -7,14 +7,14 @@ exports.default = void 0;
7
7
  var _misoComponent = _interopRequireDefault(require("./miso-component.js"));
8
8
  var _constants = require("../../constants.js");
9
9
  function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
10
- class MisoHitsElement extends _misoComponent.default {
10
+ class MisoMoreElement extends _misoComponent.default {
11
11
  constructor() {
12
12
  super({
13
- role: _constants.ROLE.HITS
13
+ role: _constants.ROLE.MORE
14
14
  });
15
15
  }
16
16
  static get tagName() {
17
- return 'miso-hits';
17
+ return 'miso-more';
18
18
  }
19
19
  }
20
- exports.default = MisoHitsElement;
20
+ exports.default = MisoMoreElement;
@@ -0,0 +1,20 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.default = void 0;
7
+ var _misoComponent = _interopRequireDefault(require("./miso-component.js"));
8
+ var _constants = require("../../constants.js");
9
+ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
10
+ class MisoTotalElement extends _misoComponent.default {
11
+ constructor() {
12
+ super({
13
+ role: _constants.ROLE.TOTAL
14
+ });
15
+ }
16
+ static get tagName() {
17
+ return 'miso-total';
18
+ }
19
+ }
20
+ exports.default = MisoTotalElement;
@@ -166,9 +166,6 @@ function autoplayOptionsEquals(a, b) {
166
166
  */
167
167
 
168
168
  class AffiliationLayout extends _collection.default {
169
- static get category() {
170
- return _constants.LAYOUT_CATEGORY.AFFILIATION;
171
- }
172
169
  static get type() {
173
170
  return TYPE;
174
171
  }
@@ -4,7 +4,6 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.default = void 0;
7
- var _constants = require("../../constants.js");
8
7
  var _template = _interopRequireDefault(require("../template.js"));
9
8
  var _svgs = require("../svgs.js");
10
9
  const _excluded = ["className", "templates"];
@@ -27,9 +26,6 @@ const DEFAULT_TEMPLATES = Object.freeze({
27
26
  // TODO: give a role and make this customizable
28
27
 
29
28
  class BannerLayout extends _template.default {
30
- static get category() {
31
- return _constants.LAYOUT_CATEGORY.BANNER;
32
- }
33
29
  static get type() {
34
30
  return TYPE;
35
31
  }
@@ -0,0 +1,73 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.default = void 0;
7
+ var _constants = require("../../constants.js");
8
+ var _index = require("../../actor/index.js");
9
+ var _template = _interopRequireDefault(require("../template.js"));
10
+ const _excluded = ["className", "templates"];
11
+ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
12
+ function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (e.includes(n)) continue; t[n] = r[n]; } return t; }
13
+ const TYPE = 'more-button';
14
+ const DEFAULT_CLASSNAME = 'miso-more-button';
15
+ function root(layout, state) {
16
+ const {
17
+ className,
18
+ role,
19
+ templates
20
+ } = layout;
21
+ const roleAttr = role ? ` data-role="${role}"` : '';
22
+ const disabledAttr = state.status !== _constants.STATUS.READY ? ' disabled' : '';
23
+ return `
24
+ <div class="${className}"${roleAttr}${disabledAttr}>
25
+ ${templates.text(layout)}
26
+ </div>
27
+ `;
28
+ }
29
+ const DEFAULT_TEMPLATES = Object.freeze({
30
+ root,
31
+ text
32
+ });
33
+ function text(layout) {
34
+ return 'More';
35
+ }
36
+ class MoreButtonLayout extends _template.default {
37
+ static get type() {
38
+ return TYPE;
39
+ }
40
+ static get defaultTemplates() {
41
+ return DEFAULT_TEMPLATES;
42
+ }
43
+ static get defaultClassName() {
44
+ return DEFAULT_CLASSNAME;
45
+ }
46
+ constructor() {
47
+ let _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
48
+ let {
49
+ className = DEFAULT_CLASSNAME,
50
+ templates
51
+ } = _ref,
52
+ options = _objectWithoutPropertiesLoose(_ref, _excluded);
53
+ super(Object.assign({
54
+ className,
55
+ templates: Object.assign({}, DEFAULT_TEMPLATES, templates)
56
+ }, options));
57
+ }
58
+ initialize(view) {
59
+ this._unsubscribes = [...this._unsubscribes, view.proxyElement.on('click', e => this._handleClick(e))];
60
+ }
61
+ _handleClick(event) {
62
+ // only left click
63
+ if (event.button !== 0) {
64
+ return;
65
+ }
66
+ const button = event.target.closest('data-role="more"');
67
+ if (!button || button.disabled) {
68
+ return;
69
+ }
70
+ this._view.hub.trigger(_index.fields.more());
71
+ }
72
+ }
73
+ exports.default = MoreButtonLayout;
@@ -13,9 +13,6 @@ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e
13
13
  function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (e.includes(n)) continue; t[n] = r[n]; } return t; }
14
14
  const TYPE = 'container';
15
15
  class ContainerLayout extends _raf.default {
16
- static get category() {
17
- return _constants.LAYOUT_CATEGORY.CONTAINER;
18
- }
19
16
  static get type() {
20
17
  return TYPE;
21
18
  }
@@ -4,7 +4,6 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.default = void 0;
7
- var _constants = require("../../constants.js");
8
7
  var _template = _interopRequireDefault(require("../template.js"));
9
8
  const _excluded = ["className", "templates"];
10
9
  function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
@@ -33,9 +32,6 @@ const DEFAULT_TEMPLATES = Object.freeze({
33
32
  message
34
33
  });
35
34
  class ErrorLayout extends _template.default {
36
- static get category() {
37
- return _constants.LAYOUT_CATEGORY.ERROR;
38
- }
39
35
  static get type() {
40
36
  return TYPE;
41
37
  }
@@ -63,6 +63,12 @@ Object.defineProperty(exports, "ListLayout", {
63
63
  return _list.default;
64
64
  }
65
65
  });
66
+ Object.defineProperty(exports, "MoreButtonLayout", {
67
+ enumerable: true,
68
+ get: function () {
69
+ return _moreButton.default;
70
+ }
71
+ });
66
72
  Object.defineProperty(exports, "OptionListLayout", {
67
73
  enumerable: true,
68
74
  get: function () {
@@ -108,4 +114,5 @@ var _text = _interopRequireDefault(require("./text/text.js"));
108
114
  var _index = _interopRequireDefault(require("./text/typewriter/index.js"));
109
115
  var _affiliation = _interopRequireDefault(require("./affiliation/affiliation.js"));
110
116
  var _facets = _interopRequireDefault(require("./input/facets.js"));
117
+ var _moreButton = _interopRequireDefault(require("./button/more-button.js"));
111
118
  function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
@@ -5,7 +5,6 @@ Object.defineProperty(exports, "__esModule", {
5
5
  });
6
6
  exports.default = void 0;
7
7
  var _commons = require("@miso.ai/commons");
8
- var _constants = require("../../constants.js");
9
8
  var _template = _interopRequireDefault(require("../template.js"));
10
9
  var _bindings = _interopRequireDefault(require("../../util/bindings.js"));
11
10
  const _excluded = ["className", "templates"];
@@ -126,9 +125,6 @@ function getSelectedValues(facets) {
126
125
  return selections;
127
126
  }
128
127
  class FacetsLayout extends _template.default {
129
- static get category() {
130
- return _constants.LAYOUT_CATEGORY.FILTERS;
131
- }
132
128
  static get type() {
133
129
  return TYPE;
134
130
  }
@@ -5,7 +5,6 @@ Object.defineProperty(exports, "__esModule", {
5
5
  });
6
6
  exports.default = void 0;
7
7
  var _commons = require("@miso.ai/commons");
8
- var _constants = require("../../constants.js");
9
8
  var _index = require("../../actor/index.js");
10
9
  var _template = _interopRequireDefault(require("../template.js"));
11
10
  var _trackable = require("../trackable.js");
@@ -54,9 +53,6 @@ const DEFAULT_TEMPLATES = Object.freeze({
54
53
  option
55
54
  });
56
55
  class OptionListLayout extends _template.default {
57
- static get category() {
58
- return _constants.LAYOUT_CATEGORY.QUERY;
59
- }
60
56
  static get type() {
61
57
  return TYPE;
62
58
  }
@@ -107,10 +107,7 @@ function completionList(layout, type, items) {
107
107
  className,
108
108
  templates
109
109
  } = layout;
110
- return `
111
- <ul class="${className}__${type}-list" data-role="${type}-list">
112
- ${items.map(item => templates.completionItem(layout, type, item)).join('')}
113
- </ul>`.trim();
110
+ return `<ul class="${className}__${type}-list" data-role="${type}-list">${items.map(item => templates.completionItem(layout, type, item)).join('')}</ul>`;
114
111
  }
115
112
  function completionItem(layout, type, item) {
116
113
  const {
@@ -142,9 +139,6 @@ const DEFAULT_AUTOCOMPLETE_OPTIONS = Object.freeze({
142
139
  debounce: 300
143
140
  });
144
141
  class SearchBoxLayout extends _template.default {
145
- static get category() {
146
- return _constants.LAYOUT_CATEGORY.QUERY;
147
- }
148
142
  static get type() {
149
143
  return TYPE;
150
144
  }
@@ -178,7 +172,7 @@ class SearchBoxLayout extends _template.default {
178
172
  proxyElement,
179
173
  hub
180
174
  } = view;
181
- this._unsubscribes = [...this._unsubscribes, proxyElement.on('input', e => this._syncInput(e)), proxyElement.on('keydown', e => this._handleKeyDown(e)), proxyElement.on('click', e => this._handleClick(e)), proxyElement.on('focusin', e => this._handleFocusIn(e)), proxyElement.on('focusout', e => this._handleFocusOut(e)), hub.on(_index.fields.data(_constants.DATA_ASPECT.AUTOCOMPLETE), () => view.refresh({
175
+ this._unsubscribes = [...this._unsubscribes, proxyElement.on('input', e => this._syncInput(e)), proxyElement.on('keydown', e => this._handleKeyDown(e)), proxyElement.on('click', e => this._handleClick(e)), proxyElement.on('focusin', e => this._handleFocusIn(e)), proxyElement.on('focusout', e => this._handleFocusOut(e)), hub.on(_index.fields.completions(), () => view.refresh({
182
176
  force: true
183
177
  }))];
184
178
  }
@@ -212,7 +206,7 @@ class SearchBoxLayout extends _template.default {
212
206
  state
213
207
  });
214
208
  return Object.assign({}, state, {
215
- completions: this._view.hub.states[_index.fields.data(_constants.DATA_ASPECT.AUTOCOMPLETE)]
209
+ completions: this._view.hub.states[_index.fields.completions()]
216
210
  });
217
211
  }
218
212
  _render(element, data, controls) {
@@ -221,6 +215,8 @@ class SearchBoxLayout extends _template.default {
221
215
  super._render(element, data, controls);
222
216
  }
223
217
  this._updateCompletions(element, data, controls);
218
+ }
219
+ _afterRender(element, state) {
224
220
  this._fullfillFocusRequest(element);
225
221
  this._fullfillValueRequest(element);
226
222
  }
@@ -237,9 +233,12 @@ class SearchBoxLayout extends _template.default {
237
233
  }
238
234
  const {
239
235
  status = _constants.STATUS.INITIAL,
240
- index,
236
+ session,
241
237
  value: completions
242
238
  } = state.completions;
239
+ const {
240
+ index
241
+ } = session;
243
242
  if (rendered && rendered.completions.index === index && rendered.completions.status === status) {
244
243
  return;
245
244
  }
@@ -332,7 +331,7 @@ class SearchBoxLayout extends _template.default {
332
331
  target,
333
332
  isComposing
334
333
  } = _ref8;
335
- if (!isComposing && key === 'Enter' && target.matches('input')) {
334
+ if (!isComposing && key === 'Enter' && target.matches('[data-role="input"]')) {
336
335
  this._submit(target.value);
337
336
  target.blur();
338
337
  }
@@ -401,7 +400,9 @@ class SearchBoxLayout extends _template.default {
401
400
  if (!options) {
402
401
  return;
403
402
  }
404
- this._view.tracker.submit(value);
403
+ this._view.tracker.submit({
404
+ value
405
+ }); // not array
405
406
  }
406
407
  }
407
408
  exports.default = SearchBoxLayout;
@@ -11,9 +11,6 @@ function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t =
11
11
  const TYPE = 'cards';
12
12
  const DEFAULT_CLASSNAME = 'miso-cards';
13
13
  class CardsLayout extends _collection.default {
14
- static get category() {
15
- return super.category;
16
- }
17
14
  static get type() {
18
15
  return TYPE;
19
16
  }
@@ -40,9 +40,6 @@ function chevron(layout) {
40
40
  return `<svg class="${className}__control-button" shape-rendering="geometricPrecision" stroke="currentColor" stroke-width="24" fill="#fff" viewBox="-30 -30 358 572"><path d="M285.77 441c16.24 16.17 16.32 42.46.15 58.7-16.16 16.24-42.45 16.32-58.69.16l-215-214.47c-16.24-16.16-16.32-42.45-.15-58.69L227.23 12.08c16.24-16.17 42.53-16.09 58.69.15 16.17 16.24 16.09 42.54-.15 58.7l-185.5 185.04L285.77 441z"/></svg>`;
41
41
  }
42
42
  class CarouselLayout extends _collection.default {
43
- static get category() {
44
- return super.category;
45
- }
46
43
  static get type() {
47
44
  return TYPE;
48
45
  }
@@ -7,6 +7,7 @@ exports.default = void 0;
7
7
  var _constants = require("../../constants.js");
8
8
  var _template = _interopRequireDefault(require("../template.js"));
9
9
  var _trackable = require("../trackable.js");
10
+ var _triggerable = require("../triggerable.js");
10
11
  var _templates = require("../templates.js");
11
12
  const _excluded = ["templates", "itemType"];
12
13
  function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
@@ -21,7 +22,7 @@ function root(layout, state) {
21
22
  status
22
23
  } = state;
23
24
  const roleAttr = role ? `data-role="${role}"` : '';
24
- return `<div class="${className} ${status}" ${roleAttr}>${status === _constants.STATUS.READY ? templates[status](layout, state) : ''}</div>`;
25
+ return `<div class="${className} ${status}" ${roleAttr}>${status === _constants.STATUS.READY ? templates[status](layout, state) : ''}${templates.trigger(layout, state)}${templates.loading(layout, state)}</div>`;
25
26
  }
26
27
  function ready(layout, state) {
27
28
  const {
@@ -31,6 +32,7 @@ function ready(layout, state) {
31
32
 
32
33
  // TODO: handle categories, attributes, etc. by introducing sublayout
33
34
  if (values && values.length > 0 || state.ongoing) {
35
+ // TODO: ad-hoc ongoing?
34
36
  return templates.list(layout, state, values);
35
37
  } else {
36
38
  return templates.empty(layout, state);
@@ -70,6 +72,15 @@ function item(layout, state, value, index) {
70
72
  });
71
73
  return `<li class="${className}__item">${body}</li>`;
72
74
  }
75
+ function trigger(layout, state) {
76
+ const {
77
+ className
78
+ } = layout;
79
+ return `<div class="${className}__trigger" data-role="trigger"></div>`;
80
+ }
81
+ function loading() {
82
+ return `<div class="miso-loading" aria-label="Loading" data-role="loading"></div>`;
83
+ }
73
84
 
74
85
  // TODO: let templates.js control what to be included here
75
86
 
@@ -95,12 +106,11 @@ const DEFAULT_TEMPLATES = Object.freeze({
95
106
  ctaBlock: _templates.ctaBlock,
96
107
  cta: _templates.cta,
97
108
  imageBlock: _templates.imageBlock,
98
- indexBlock: _templates.indexBlock
109
+ indexBlock: _templates.indexBlock,
110
+ trigger,
111
+ loading
99
112
  });
100
113
  class CollectionLayout extends _template.default {
101
- static get category() {
102
- return _constants.LAYOUT_CATEGORY.LIST;
103
- }
104
114
  static get defaultTemplates() {
105
115
  return DEFAULT_TEMPLATES;
106
116
  }
@@ -115,6 +125,7 @@ class CollectionLayout extends _template.default {
115
125
  itemType
116
126
  }, options));
117
127
  this._initTrackable();
128
+ this._initTriggerable();
118
129
  }
119
130
  initialize(view) {
120
131
  this._unsubscribes.push(view.proxyElement.on('click', this._onClick.bind(this)));
@@ -133,7 +144,7 @@ class CollectionLayout extends _template.default {
133
144
  }
134
145
  _shallRenderIncrementally(state, rendered) {
135
146
  // TODO: compare item ids as well
136
- return this.options.incremental && rendered && rendered.value && rendered.value.length > 0 && state.status === _constants.STATUS.READY && rendered.status === _constants.STATUS.READY && state.session && rendered.session && state.session.id === rendered.session.id;
147
+ return this.options.incremental && rendered && rendered.value && rendered.value.length > 0 && state.value && state.value.length >= rendered.value.length && state.session && rendered.session && state.session.id === rendered.session.id;
137
148
  }
138
149
  _html(state, rendered, incremental) {
139
150
  if (incremental) {
@@ -170,9 +181,11 @@ class CollectionLayout extends _template.default {
170
181
  }
171
182
  _afterRender(element, state) {
172
183
  this._syncBindings(element, state);
184
+ this._syncTrigger(element, state);
173
185
  }
174
186
  _unrender() {
175
187
  this._clearBindings();
188
+ this._untrackTrigger();
176
189
  }
177
190
  _getItems(state) {
178
191
  return state.value;
@@ -212,9 +225,11 @@ class CollectionLayout extends _template.default {
212
225
  }
213
226
  destroy() {
214
227
  this._destroyTrackable();
228
+ this._destroyTriggerable();
215
229
  this._view = undefined;
216
230
  super.destroy();
217
231
  }
218
232
  }
219
233
  exports.default = CollectionLayout;
220
- (0, _trackable.makeTrackable)(CollectionLayout.prototype);
234
+ (0, _trackable.makeTrackable)(CollectionLayout.prototype);
235
+ (0, _triggerable.makeTriggerable)(CollectionLayout.prototype);
@@ -11,9 +11,6 @@ function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t =
11
11
  const TYPE = 'list';
12
12
  const DEFAULT_CLASSNAME = 'miso-list';
13
13
  class ListLayout extends _collection.default {
14
- static get category() {
15
- return super.category;
16
- }
17
14
  static get type() {
18
15
  return TYPE;
19
16
  }
@@ -61,9 +61,6 @@ const DEFAULT_TEMPLATES = Object.freeze({
61
61
  text
62
62
  });
63
63
  class FeedbackLayout extends _radio.default {
64
- static get category() {
65
- return super.category;
66
- }
67
64
  static get type() {
68
65
  return TYPE;
69
66
  }
@@ -5,7 +5,6 @@ Object.defineProperty(exports, "__esModule", {
5
5
  });
6
6
  exports.default = void 0;
7
7
  var _commons = require("@miso.ai/commons");
8
- var _constants = require("../../constants.js");
9
8
  var _template = _interopRequireDefault(require("../template.js"));
10
9
  var _templates = require("../templates.js");
11
10
  const _excluded = ["className", "templates", "field", "defaultValue"];
@@ -40,9 +39,6 @@ const DEFAULT_TEMPLATES = Object.freeze(Object.assign({}, (0, _templates.require
40
39
  option
41
40
  }));
42
41
  class RadioLayout extends _template.default {
43
- static get category() {
44
- return _constants.LAYOUT_CATEGORY.RADIO;
45
- }
46
42
  static get defaultTemplates() {
47
43
  return DEFAULT_TEMPLATES;
48
44
  }
@@ -5,19 +5,21 @@ Object.defineProperty(exports, "__esModule", {
5
5
  });
6
6
  exports.default = void 0;
7
7
  var _commons = require("@miso.ai/commons");
8
- const _excluded = ["role", "workflow"];
8
+ const _excluded = ["role", "workflow", "workflowOptions"];
9
9
  function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (e.includes(n)) continue; t[n] = r[n]; } return t; }
10
10
  class RafLayout {
11
11
  constructor() {
12
12
  let _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
13
13
  let {
14
14
  role,
15
- workflow
15
+ workflow,
16
+ workflowOptions
16
17
  } = _ref,
17
18
  options = _objectWithoutPropertiesLoose(_ref, _excluded);
18
19
  (0, _commons.defineValues)(this, {
19
20
  role,
20
21
  workflow,
22
+ workflowOptions,
21
23
  options
22
24
  });
23
25
  this._unsubscribes = [];
@@ -5,7 +5,6 @@ Object.defineProperty(exports, "__esModule", {
5
5
  });
6
6
  exports.default = void 0;
7
7
  var _commons = require("@miso.ai/commons");
8
- var _constants = require("../../constants.js");
9
8
  var _template = _interopRequireDefault(require("../template.js"));
10
9
  const _excluded = ["className", "templates", "tag"];
11
10
  function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
@@ -60,9 +59,6 @@ const DEFAULT_TEMPLATES = Object.freeze({
60
59
  root
61
60
  });
62
61
  class TextLayout extends _template.default {
63
- static get category() {
64
- return _constants.LAYOUT_CATEGORY.TEXT;
65
- }
66
62
  static get type() {
67
63
  return TYPE;
68
64
  }
@@ -15,9 +15,6 @@ function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t =
15
15
  const TYPE = 'typewriter';
16
16
  const DEFAULT_CLASSNAME = 'miso-typewriter';
17
17
  class TypewriterLayout extends _progressive.default {
18
- static get category() {
19
- return _constants.LAYOUT_CATEGORY.TEXT;
20
- }
21
18
  static get type() {
22
19
  return TYPE;
23
20
  }