superdesk-ui-framework 3.1.0 → 3.1.1

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.
@@ -70,7 +70,7 @@ return /******/ (function(modules) { // webpackBootstrap
70
70
  /******/ __webpack_require__.p = "";
71
71
  /******/
72
72
  /******/ // Load entry module and return exports
73
- /******/ return __webpack_require__(__webpack_require__.s = 575);
73
+ /******/ return __webpack_require__(__webpack_require__.s = 576);
74
74
  /******/ })
75
75
  /************************************************************************/
76
76
  /******/ ({
@@ -28246,7 +28246,7 @@ module.exports = function(module) {
28246
28246
 
28247
28247
  /***/ }),
28248
28248
 
28249
- /***/ 575:
28249
+ /***/ 576:
28250
28250
  /***/ (function(module, exports, __webpack_require__) {
28251
28251
 
28252
28252
  "use strict";
@@ -28256,11 +28256,11 @@ __webpack_require__(21);
28256
28256
 
28257
28257
  __webpack_require__(44);
28258
28258
 
28259
- __webpack_require__(576);
28259
+ __webpack_require__(577);
28260
28260
 
28261
- __webpack_require__(578);
28261
+ __webpack_require__(579);
28262
28262
 
28263
- __webpack_require__(580);
28263
+ __webpack_require__(581);
28264
28264
 
28265
28265
  __webpack_require__(0);
28266
28266
 
@@ -28268,7 +28268,7 @@ __webpack_require__(8);
28268
28268
 
28269
28269
  /***/ }),
28270
28270
 
28271
- /***/ 576:
28271
+ /***/ 577:
28272
28272
  /***/ (function(module, exports, __webpack_require__) {
28273
28273
 
28274
28274
  var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_DEFINE_RESULT__;/*!
@@ -28292,7 +28292,7 @@ var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_
28292
28292
  if ( true ) {
28293
28293
 
28294
28294
  // AMD. Register as an anonymous module.
28295
- !(__WEBPACK_AMD_DEFINE_ARRAY__ = [ __webpack_require__(44), __webpack_require__(577) ], __WEBPACK_AMD_DEFINE_FACTORY__ = (factory),
28295
+ !(__WEBPACK_AMD_DEFINE_ARRAY__ = [ __webpack_require__(44), __webpack_require__(578) ], __WEBPACK_AMD_DEFINE_FACTORY__ = (factory),
28296
28296
  __WEBPACK_AMD_DEFINE_RESULT__ = (typeof __WEBPACK_AMD_DEFINE_FACTORY__ === 'function' ?
28297
28297
  (__WEBPACK_AMD_DEFINE_FACTORY__.apply(exports, __WEBPACK_AMD_DEFINE_ARRAY__)) : __WEBPACK_AMD_DEFINE_FACTORY__),
28298
28298
  __WEBPACK_AMD_DEFINE_RESULT__ !== undefined && (module.exports = __WEBPACK_AMD_DEFINE_RESULT__));
@@ -29030,7 +29030,7 @@ return $.widget;
29030
29030
 
29031
29031
  /***/ }),
29032
29032
 
29033
- /***/ 577:
29033
+ /***/ 578:
29034
29034
  /***/ (function(module, exports, __webpack_require__) {
29035
29035
 
29036
29036
  var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_DEFINE_RESULT__;( function( factory ) {
@@ -29060,16 +29060,16 @@ return $.ui.version = "1.13.0";
29060
29060
 
29061
29061
  /***/ }),
29062
29062
 
29063
- /***/ 578:
29063
+ /***/ 579:
29064
29064
  /***/ (function(module, exports, __webpack_require__) {
29065
29065
 
29066
- __webpack_require__(579);
29066
+ __webpack_require__(580);
29067
29067
  module.exports = angular;
29068
29068
 
29069
29069
 
29070
29070
  /***/ }),
29071
29071
 
29072
- /***/ 579:
29072
+ /***/ 580:
29073
29073
  /***/ (function(module, exports, __webpack_require__) {
29074
29074
 
29075
29075
  /* WEBPACK VAR INJECTION */(function(__webpack_provided_window_dot_jQuery) {/**
@@ -65676,16 +65676,16 @@ $provide.value("$locale", {
65676
65676
 
65677
65677
  /***/ }),
65678
65678
 
65679
- /***/ 580:
65679
+ /***/ 581:
65680
65680
  /***/ (function(module, exports, __webpack_require__) {
65681
65681
 
65682
- __webpack_require__(581);
65682
+ __webpack_require__(582);
65683
65683
  module.exports = 'ngAnimate';
65684
65684
 
65685
65685
 
65686
65686
  /***/ }),
65687
65687
 
65688
- /***/ 581:
65688
+ /***/ 582:
65689
65689
  /***/ (function(module, exports) {
65690
65690
 
65691
65691
  /**
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "superdesk-ui-framework",
3
- "version": "3.1.0",
3
+ "version": "3.1.1",
4
4
  "license": "AGPL-3.0",
5
5
  "repository": {
6
6
  "type": "git",
@@ -119,7 +119,7 @@ var Menu = /** @class */ (function (_super) {
119
119
  }
120
120
  }
121
121
  } },
122
- React.createElement(tieredmenu_1.TieredMenu, { className: 'sd-overflow--y-auto max-h-full', popup: true, model: this.toPrimeReactInterface(this.props.items), ref: function (el) { return _this.menu = el; }, appendTo: document.body, onShow: function () {
122
+ React.createElement(tieredmenu_1.TieredMenu, { popup: true, model: this.toPrimeReactInterface(this.props.items), ref: function (el) { return _this.menu = el; }, appendTo: document.body, onShow: function () {
123
123
  _this.focusedBefore = document.activeElement;
124
124
  var firstMenuItem = document.querySelectorAll('.p-tieredmenu [role="menuitem"]')[0];
125
125
  if (firstMenuItem instanceof HTMLElement) {
@@ -0,0 +1,62 @@
1
+ import * as React from "react";
2
+ interface IState<T> {
3
+ options: Array<ITreeMenuNode<T>>;
4
+ openDropdown: boolean;
5
+ activeTree: Array<Array<ITreeMenuNode<T>>>;
6
+ buttonTree: Array<ITreeMenuNode<T>>;
7
+ buttonValue: ITreeMenuNode<T> | null;
8
+ filterArr: Array<ITreeMenuNode<T>>;
9
+ searchFieldValue: string;
10
+ firstBranchOptions: Array<ITreeMenuNode<T>>;
11
+ buttonTarget: Array<string>;
12
+ }
13
+ interface IProps<T> {
14
+ zIndex?: number;
15
+ searchPlaceholder?: string;
16
+ singleLevelSearch?: boolean;
17
+ 'data-test-id'?: string;
18
+ getOptions?(): Array<ITreeMenuNode<T>>;
19
+ getLabel(item: T): string;
20
+ getId(item: T): string;
21
+ getBackgroundColor?(item: T): string;
22
+ getBorderColor?(item: T): string;
23
+ optionTemplate?(item: T): React.ComponentType<T> | JSX.Element;
24
+ children: (toggle: (event: React.SyntheticEvent) => void) => JSX.Element;
25
+ }
26
+ interface IParent<T> {
27
+ value: T;
28
+ children: Array<ITreeMenuNode<T>>;
29
+ }
30
+ interface IChildren<T> {
31
+ value: T;
32
+ disabled?: boolean;
33
+ onSelect(): void;
34
+ }
35
+ export type ITreeMenuNode<T> = IParent<T> | IChildren<T>;
36
+ export declare class TreeMenu<T> extends React.Component<IProps<T>, IState<T>> {
37
+ private dropdownRef;
38
+ private ref;
39
+ private openDropdownRef;
40
+ private treeMenuRef;
41
+ private inputRef;
42
+ private popperInstance;
43
+ constructor(props: IProps<T>);
44
+ inputFocus: () => void;
45
+ listNavigation: () => void;
46
+ onMouseDown: (event: MouseEvent) => void;
47
+ onKeyDown: (e: KeyboardEvent) => void;
48
+ onPressEsc: (event: KeyboardEvent) => void;
49
+ componentDidMount: () => void;
50
+ componentWillUnmount(): void;
51
+ componentDidUpdate(_prevProps: Readonly<IProps<T>>, prevState: Readonly<IState<T>>): void;
52
+ toggleMenu(): void;
53
+ toggle(event: React.SyntheticEvent): void;
54
+ handleMultiLevel(item: ITreeMenuNode<T>): void;
55
+ handleButton(item: ITreeMenuNode<T>): void;
56
+ handleTree(_event: React.MouseEvent<HTMLLIElement, MouseEvent>, option: ITreeMenuNode<T>): void;
57
+ backButton(): void;
58
+ recursion(arr: Array<ITreeMenuNode<T>>): void;
59
+ filteredItem(arr: Array<ITreeMenuNode<T>>): JSX.Element | JSX.Element[];
60
+ render(): JSX.Element;
61
+ }
62
+ export {};
@@ -0,0 +1,340 @@
1
+ "use strict";
2
+ var __extends = (this && this.__extends) || (function () {
3
+ var extendStatics = function (d, b) {
4
+ extendStatics = Object.setPrototypeOf ||
5
+ ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
6
+ function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
7
+ return extendStatics(d, b);
8
+ };
9
+ return function (d, b) {
10
+ if (typeof b !== "function" && b !== null)
11
+ throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
12
+ extendStatics(d, b);
13
+ function __() { this.constructor = d; }
14
+ d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
15
+ };
16
+ })();
17
+ var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
18
+ if (k2 === undefined) k2 = k;
19
+ var desc = Object.getOwnPropertyDescriptor(m, k);
20
+ if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
21
+ desc = { enumerable: true, get: function() { return m[k]; } };
22
+ }
23
+ Object.defineProperty(o, k2, desc);
24
+ }) : (function(o, m, k, k2) {
25
+ if (k2 === undefined) k2 = k;
26
+ o[k2] = m[k];
27
+ }));
28
+ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
29
+ Object.defineProperty(o, "default", { enumerable: true, value: v });
30
+ }) : function(o, v) {
31
+ o["default"] = v;
32
+ });
33
+ var __importStar = (this && this.__importStar) || function (mod) {
34
+ if (mod && mod.__esModule) return mod;
35
+ var result = {};
36
+ if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
37
+ __setModuleDefault(result, mod);
38
+ return result;
39
+ };
40
+ var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
41
+ if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
42
+ if (ar || !(i in from)) {
43
+ if (!ar) ar = Array.prototype.slice.call(from, 0, i);
44
+ ar[i] = from[i];
45
+ }
46
+ }
47
+ return to.concat(ar || Array.prototype.slice.call(from));
48
+ };
49
+ Object.defineProperty(exports, "__esModule", { value: true });
50
+ exports.TreeMenu = void 0;
51
+ var React = __importStar(require("react"));
52
+ var Icon_1 = require("./Icon");
53
+ var core_1 = require("@popperjs/core");
54
+ var TreeSelectItem_1 = require("./TreeSelect/TreeSelectItem");
55
+ var KeyboardNavigation_1 = require("./TreeSelect/KeyboardNavigation");
56
+ var WithPortal_1 = require("./WithPortal");
57
+ var helpers_1 = require("../helpers");
58
+ function nodeHasChildren(item) {
59
+ return item[(0, helpers_1.nameof)('children')] != null;
60
+ }
61
+ function nodeCanBeSelected(item) {
62
+ return item[(0, helpers_1.nameof)('onSelect')] != null;
63
+ }
64
+ function onSelect(item) {
65
+ if (nodeCanBeSelected(item)) {
66
+ return item.onSelect;
67
+ }
68
+ return undefined;
69
+ }
70
+ function disabledItem(item) {
71
+ if (nodeCanBeSelected(item)) {
72
+ return item.disabled;
73
+ }
74
+ return undefined;
75
+ }
76
+ var TreeMenu = /** @class */ (function (_super) {
77
+ __extends(TreeMenu, _super);
78
+ function TreeMenu(props) {
79
+ var _this = _super.call(this, props) || this;
80
+ _this.inputFocus = function () {
81
+ var _a;
82
+ (_a = _this.inputRef.current) === null || _a === void 0 ? void 0 : _a.focus();
83
+ };
84
+ _this.listNavigation = function () {
85
+ var element = document.querySelector('.suggestion-item--btn:not([disabled])');
86
+ element.focus();
87
+ };
88
+ _this.onMouseDown = function (event) {
89
+ var _a, _b;
90
+ if ((((_a = _this.dropdownRef.current) === null || _a === void 0 ? void 0 : _a.contains(event.target)) !== true)
91
+ && (((_b = _this.treeMenuRef.current) === null || _b === void 0 ? void 0 : _b.contains(event.target)) !== true)
92
+ && _this.state.openDropdown) {
93
+ _this.setState({
94
+ openDropdown: false,
95
+ searchFieldValue: '',
96
+ });
97
+ }
98
+ };
99
+ _this.onKeyDown = function (e) {
100
+ if (_this.state.openDropdown && _this.ref.current) {
101
+ (0, KeyboardNavigation_1.keyboardNavigation)(e, _this.ref.current, _this.inputFocus);
102
+ if (e.key === 'Backspace' && _this.state.activeTree.length > 0) {
103
+ _this.backButton();
104
+ var lastElement = _this.state.buttonTarget.pop();
105
+ if (lastElement != null) {
106
+ var className = (0, TreeSelectItem_1.getPrefixedItemId)(lastElement);
107
+ var element = document.getElementsByClassName(className)[0];
108
+ element.focus();
109
+ }
110
+ }
111
+ }
112
+ };
113
+ _this.onPressEsc = function (event) {
114
+ if (event.key === 'Escape' && _this.state.openDropdown) {
115
+ _this.setState({
116
+ openDropdown: false,
117
+ searchFieldValue: '',
118
+ });
119
+ }
120
+ };
121
+ _this.componentDidMount = function () {
122
+ _this.recursion(_this.state.options);
123
+ document.addEventListener("mousedown", _this.onMouseDown);
124
+ document.addEventListener("keydown", _this.onKeyDown);
125
+ document.addEventListener("keydown", _this.onPressEsc);
126
+ };
127
+ _this.state = {
128
+ options: _this.props.getOptions ? _this.props.getOptions() : [],
129
+ firstBranchOptions: _this.props.getOptions ? _this.props.getOptions() : [],
130
+ searchFieldValue: '',
131
+ activeTree: [],
132
+ buttonTree: [],
133
+ buttonTarget: [],
134
+ filterArr: [],
135
+ buttonValue: null,
136
+ openDropdown: false,
137
+ };
138
+ _this.handleMultiLevel = _this.handleMultiLevel.bind(_this);
139
+ _this.backButton = _this.backButton.bind(_this);
140
+ _this.handleButton = _this.handleButton.bind(_this);
141
+ _this.handleTree = _this.handleTree.bind(_this);
142
+ _this.toggleMenu = _this.toggleMenu.bind(_this);
143
+ _this.toggle = _this.toggle.bind(_this);
144
+ _this.onMouseDown = _this.onMouseDown.bind(_this);
145
+ _this.onKeyDown = _this.onKeyDown.bind(_this);
146
+ _this.onPressEsc = _this.onPressEsc.bind(_this);
147
+ _this.dropdownRef = React.createRef();
148
+ _this.ref = React.createRef();
149
+ _this.openDropdownRef = React.createRef();
150
+ _this.treeMenuRef = React.createRef();
151
+ _this.inputRef = React.createRef();
152
+ _this.popperInstance = null;
153
+ return _this;
154
+ }
155
+ TreeMenu.prototype.componentWillUnmount = function () {
156
+ document.removeEventListener("mousedown", this.onMouseDown);
157
+ document.removeEventListener("keydown", this.onKeyDown);
158
+ document.addEventListener("keydown", this.onPressEsc);
159
+ };
160
+ TreeMenu.prototype.componentDidUpdate = function (_prevProps, prevState) {
161
+ var _a;
162
+ if (prevState.openDropdown !== this.state.openDropdown) {
163
+ this.toggleMenu();
164
+ }
165
+ if ((prevState.activeTree !== this.state.activeTree)
166
+ || (prevState.filterArr !== this.state.filterArr)
167
+ || (prevState.options !== this.state.options)) {
168
+ (_a = this.popperInstance) === null || _a === void 0 ? void 0 : _a.update();
169
+ }
170
+ };
171
+ TreeMenu.prototype.toggleMenu = function () {
172
+ var _this = this;
173
+ var _a, _b;
174
+ if (this.state.openDropdown) {
175
+ if (this.openDropdownRef.current && this.dropdownRef.current) {
176
+ this.popperInstance = (0, core_1.createPopper)(this.openDropdownRef.current, this.dropdownRef.current, {
177
+ placement: 'bottom-start',
178
+ });
179
+ }
180
+ (_a = this.inputRef.current) === null || _a === void 0 ? void 0 : _a.addEventListener('keydown', function (e) {
181
+ if (e.key === 'ArrowDown') {
182
+ e.preventDefault();
183
+ e.stopPropagation();
184
+ setTimeout(function () {
185
+ _this.listNavigation();
186
+ });
187
+ }
188
+ });
189
+ if (this.inputRef.current) {
190
+ this.inputFocus();
191
+ }
192
+ else {
193
+ var element = document.querySelector('.suggestion-item--btn:not([disabled])');
194
+ element.focus();
195
+ }
196
+ }
197
+ else {
198
+ (_b = this.openDropdownRef.current) === null || _b === void 0 ? void 0 : _b.focus();
199
+ }
200
+ };
201
+ TreeMenu.prototype.toggle = function (event) {
202
+ event.stopPropagation();
203
+ this.setState({
204
+ openDropdown: !this.state.openDropdown,
205
+ });
206
+ };
207
+ TreeMenu.prototype.handleMultiLevel = function (item) {
208
+ if (nodeHasChildren(item)) {
209
+ this.setState({
210
+ activeTree: __spreadArray(__spreadArray([], this.state.activeTree, true), [this.state.options], false),
211
+ options: item.children,
212
+ });
213
+ }
214
+ };
215
+ TreeMenu.prototype.handleButton = function (item) {
216
+ var buttonTreeNext = this.state.buttonTree;
217
+ if (this.state.buttonValue != null) {
218
+ buttonTreeNext = buttonTreeNext.concat(this.state.buttonValue);
219
+ }
220
+ this.setState({
221
+ buttonTree: buttonTreeNext,
222
+ buttonValue: item,
223
+ });
224
+ };
225
+ TreeMenu.prototype.handleTree = function (_event, option) {
226
+ if (nodeHasChildren(option)) {
227
+ this.handleButton(option);
228
+ this.handleMultiLevel(option);
229
+ }
230
+ else {
231
+ this.setState({
232
+ openDropdown: false,
233
+ options: this.state.firstBranchOptions,
234
+ activeTree: [],
235
+ buttonTarget: [],
236
+ });
237
+ }
238
+ setTimeout(function () {
239
+ var element = document.querySelectorAll('.suggestion-item--btn:not([disabled])')[0];
240
+ element.focus();
241
+ });
242
+ };
243
+ TreeMenu.prototype.backButton = function () {
244
+ var items = this.state.activeTree.pop();
245
+ if (items != null) {
246
+ this.setState({
247
+ options: items,
248
+ });
249
+ }
250
+ var item = this.state.buttonTree.pop();
251
+ if (item != null) {
252
+ this.setState({
253
+ buttonValue: item,
254
+ });
255
+ }
256
+ };
257
+ TreeMenu.prototype.recursion = function (arr) {
258
+ var _this = this;
259
+ arr.map(function (item) {
260
+ _this.state.filterArr.push(item);
261
+ if (nodeHasChildren(item)) {
262
+ _this.recursion(item.children);
263
+ }
264
+ });
265
+ };
266
+ TreeMenu.prototype.filteredItem = function (arr) {
267
+ var _this = this;
268
+ var filteredArr = arr.filter(function (item) {
269
+ if (_this.state.searchFieldValue) {
270
+ if (_this.props.getLabel(item.value)
271
+ .toLowerCase()
272
+ .includes(_this.state.searchFieldValue.toLowerCase())) {
273
+ return item.value;
274
+ }
275
+ else {
276
+ return;
277
+ }
278
+ }
279
+ else {
280
+ return item.value;
281
+ }
282
+ });
283
+ if (filteredArr.length === 0) {
284
+ return React.createElement("li", { className: "suggestion-item--nothing-found" }, "Nothing found");
285
+ }
286
+ else {
287
+ return filteredArr.map(function (option, i) { return (React.createElement(TreeSelectItem_1.TreeSelectItem, { key: i, option: option, handleTree: _this.handleTree, disabledItem: disabledItem(option), getBorderColor: _this.props.getBorderColor, getBackgroundColor: _this.props.getBackgroundColor, getId: _this.props.getId, optionTemplate: _this.props.optionTemplate, getLabel: _this.props.getLabel, onClick: function () {
288
+ if (onSelect != null) {
289
+ onSelect(option);
290
+ _this.setState({
291
+ searchFieldValue: '',
292
+ });
293
+ }
294
+ } })); });
295
+ }
296
+ };
297
+ TreeMenu.prototype.render = function () {
298
+ var _this = this;
299
+ return (React.createElement("div", { ref: this.treeMenuRef },
300
+ React.createElement("div", { ref: this.openDropdownRef }, this.props.children(this.toggle)),
301
+ React.createElement(WithPortal_1.WithPortal, { active: this.state.openDropdown, "data-test-id": "tree-menu-popover" },
302
+ React.createElement("div", { ref: this.dropdownRef, className: "autocomplete autocomplete--multi-select autocomplete--fixed-width", style: {
303
+ zIndex: this.props.zIndex,
304
+ } },
305
+ React.createElement("div", { className: 'autocomplete__header' },
306
+ React.createElement("div", { className: "autocomplete__icon", onClick: function () {
307
+ _this.backButton();
308
+ } },
309
+ React.createElement(Icon_1.Icon, { name: "search", className: "search" })),
310
+ React.createElement("div", { className: 'autocomplete__filter' },
311
+ React.createElement("input", { className: "autocomplete__input", type: "text", placeholder: this.props.searchPlaceholder, ref: this.inputRef, value: this.state.searchFieldValue, onChange: function (event) {
312
+ var _a;
313
+ _this.setState({ searchFieldValue: event.target.value });
314
+ (_a = _this.popperInstance) === null || _a === void 0 ? void 0 : _a.update();
315
+ } }))),
316
+ (this.state.activeTree.length > 0 && this.state.buttonValue != null)
317
+ && React.createElement("div", { className: 'autocomplete__category-header' },
318
+ React.createElement("div", { className: "autocomplete__icon", onClick: function () {
319
+ _this.backButton();
320
+ } },
321
+ React.createElement(Icon_1.Icon, { name: "arrow-left", className: "arrow-left" })),
322
+ React.createElement("div", { className: 'autocomplete__filter' },
323
+ React.createElement("button", { className: 'autocomplete__category-title' }, this.props.optionTemplate
324
+ ? this.props.optionTemplate(this.state.buttonValue.value)
325
+ : this.props.getLabel(this.state.buttonValue.value)))),
326
+ this.state.searchFieldValue === '' ?
327
+ this.props.getOptions ?
328
+ React.createElement("ul", { ref: this.ref, className: "suggestion-list suggestion-list--multi-select" }, this.state.options.map(function (option, i) { return (React.createElement(TreeSelectItem_1.TreeSelectItem, { key: i, option: option, handleTree: _this.handleTree, onClick: onSelect(option), disabledItem: disabledItem(option), getBorderColor: _this.props.getBorderColor, getBackgroundColor: _this.props.getBackgroundColor, getId: _this.props.getId, optionTemplate: _this.props.optionTemplate, getLabel: _this.props.getLabel, onKeyDown: function () { return _this.setState({
329
+ buttonTarget: __spreadArray(__spreadArray([], _this.state.buttonTarget, true), [
330
+ _this.props.getId(option.value),
331
+ ], false),
332
+ }); } })); }))
333
+ : null
334
+ : React.createElement("ul", { className: "suggestion-list suggestion-list--multi-select", ref: this.ref }, this.filteredItem(this.props.singleLevelSearch
335
+ ? this.state.options
336
+ : this.state.filterArr))))));
337
+ };
338
+ return TreeMenu;
339
+ }(React.Component));
340
+ exports.TreeMenu = TreeMenu;
@@ -1 +1,2 @@
1
1
  export declare function assertNever(x: never): never;
2
+ export declare function nameof<T>(name: keyof T): string;
package/react/helpers.js CHANGED
@@ -1,7 +1,11 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.assertNever = void 0;
3
+ exports.nameof = exports.assertNever = void 0;
4
4
  function assertNever(x) {
5
5
  throw new Error('Unexpected object: ' + x);
6
6
  }
7
7
  exports.assertNever = assertNever;
8
+ function nameof(name) {
9
+ return name.toString();
10
+ }
11
+ exports.nameof = nameof;
package/react/index.d.ts CHANGED
@@ -85,6 +85,7 @@ export { Time } from './components/Text/Time';
85
85
  export { Heading } from './components/Text/Heading';
86
86
  export { BottomNav } from './components/Navigation/BottomNav';
87
87
  export { TreeSelect } from './components/TreeSelect/TreeSelect';
88
+ export { TreeMenu } from './components/TreeMenu';
88
89
  export { TableList, TableListItem } from './components/Lists/TableList';
89
90
  export { ContentListItem } from './components/Lists/ContentList';
90
91
  export { MultiSelect } from './components/MultiSelect';
package/react/index.js CHANGED
@@ -18,7 +18,7 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
18
18
  Object.defineProperty(exports, "__esModule", { value: true });
19
19
  exports.ContentDivider = exports.Divider = exports.Icon = exports.Prop = exports.PropsList = exports.StrechBar = exports.SlidingToolbar = exports.SubNavDivider = exports.SubNav = exports.LeftMenu = exports.TabList = exports.Tab = exports.NavButton = exports.CheckButtonGroup = exports.CheckGroup = exports.CheckboxButton = exports.RadioButtonGroup = exports.Checkbox = exports.RadioGroup = exports.Loader = exports.ButtonGroup = exports.SwitchGroup = exports.Switch = exports.FormLabel = exports.TimePicker = exports.DatePickerISO = exports.DatePicker = exports.getDurationString = exports.DurationInput = exports.Tooltip = exports.IconLabel = exports.IconButton = exports.Rotate = exports.AvatarPlaceholder = exports.Avatar = exports.AvatarGroup = exports.AvatarContentImage = exports.AvatarContentText = exports.AvatarWrapper = exports.Alert = exports.Badge = exports.Label = exports.Popover = exports.WithPagination = exports.SelectWithTemplate = exports.Option = exports.Select = exports.Input = exports.Button = exports.HelloWorld = void 0;
20
20
  exports.Heading = exports.Time = exports.Text = exports.LoadingOverlay = exports.Spinner = exports.ListItemLoader = exports.Skeleton = exports.IllustrationButton = exports.SvgIconIllustration = exports.WithSizeObserver = exports.SearchBar = exports.CreateButton = exports.DropZone = exports.ThemeSelector = exports.IconPicker = exports.SelectGrid = exports.ToggleBox = exports.Menu = exports.toasted = exports.GridItemCheckWrapper = exports.GridItemTopActions = exports.GridItemFooterActions = exports.GridItemFooterBlock = exports.GridItemSlug = exports.GridItemText = exports.GridItemTitle = exports.GridItemTime = exports.GridItemContentBlock = exports.GridItemFooter = exports.GridItemMedia = exports.GridItemContent = exports.GridItem = exports.GridList = exports.Modal = exports.Carousel = exports.DonutChart = exports.Autocomplete = exports.EmptyState = exports.Tabs = exports.TabContent = exports.TabPanel = exports.TabLabel = exports.TagInput = exports.Tag = exports.Dropdown = exports.DropdownDivider = exports.DropdownLabel = exports.DropdownItem = exports.DropdownFirst = exports.HeadingText = void 0;
21
- exports.DragHandle = exports.DragHandleDots = exports.ResizeObserverComponent = exports.SpacerBlock = exports.Spacer = exports.WithPopover = exports.ResizablePanels = exports.MultiSelect = exports.ContentListItem = exports.TableListItem = exports.TableList = exports.TreeSelect = exports.BottomNav = void 0;
21
+ exports.DragHandle = exports.DragHandleDots = exports.ResizeObserverComponent = exports.SpacerBlock = exports.Spacer = exports.WithPopover = exports.ResizablePanels = exports.MultiSelect = exports.ContentListItem = exports.TableListItem = exports.TableList = exports.TreeMenu = exports.TreeSelect = exports.BottomNav = void 0;
22
22
  var HelloWorld_1 = require("./components/HelloWorld");
23
23
  Object.defineProperty(exports, "HelloWorld", { enumerable: true, get: function () { return HelloWorld_1.HelloWorld; } });
24
24
  var Button_1 = require("./components/Button");
@@ -207,6 +207,8 @@ var BottomNav_1 = require("./components/Navigation/BottomNav");
207
207
  Object.defineProperty(exports, "BottomNav", { enumerable: true, get: function () { return BottomNav_1.BottomNav; } });
208
208
  var TreeSelect_1 = require("./components/TreeSelect/TreeSelect");
209
209
  Object.defineProperty(exports, "TreeSelect", { enumerable: true, get: function () { return TreeSelect_1.TreeSelect; } });
210
+ var TreeMenu_1 = require("./components/TreeMenu");
211
+ Object.defineProperty(exports, "TreeMenu", { enumerable: true, get: function () { return TreeMenu_1.TreeMenu; } });
210
212
  var TableList_1 = require("./components/Lists/TableList");
211
213
  Object.defineProperty(exports, "TableList", { enumerable: true, get: function () { return TableList_1.TableList; } });
212
214
  Object.defineProperty(exports, "TableListItem", { enumerable: true, get: function () { return TableList_1.TableListItem; } });