gd-bs 6.6.1 → 6.6.3
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.
- package/build/components/dropdown/index.js +73 -30
- package/build/components/form/control.js +68 -0
- package/build/components/form/types.js +18 -14
- package/dist/gd-bs-icons.js +1 -1
- package/dist/gd-bs-icons.min.js +1 -1
- package/dist/gd-bs.d.ts +5 -0
- package/dist/gd-bs.js +1 -1
- package/dist/gd-bs.min.js +1 -1
- package/index.html +7 -22
- package/package.json +1 -1
- package/src/components/dropdown/index.ts +78 -31
- package/src/components/dropdown/types.d.ts +1 -0
- package/src/components/form/control.ts +68 -0
- package/src/components/form/controlTypes.d.ts +4 -0
- package/src/components/form/types.ts +18 -14
|
@@ -18,6 +18,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
|
18
18
|
exports.Dropdown = exports.DropdownTypes = void 0;
|
|
19
19
|
var base_1 = require("../base");
|
|
20
20
|
var button_1 = require("../button");
|
|
21
|
+
var checkboxGroup_1 = require("../checkboxGroup");
|
|
21
22
|
var popover_1 = require("../popover");
|
|
22
23
|
var formItem_1 = require("./formItem");
|
|
23
24
|
var item_1 = require("./item");
|
|
@@ -54,6 +55,7 @@ var _Dropdown = /** @class */ (function (_super) {
|
|
|
54
55
|
if (template === void 0) { template = GetHTML(props); }
|
|
55
56
|
var _this = _super.call(this, template, props) || this;
|
|
56
57
|
_this._autoSelect = null;
|
|
58
|
+
_this._cb = null;
|
|
57
59
|
_this._initFl = false;
|
|
58
60
|
_this._items = null;
|
|
59
61
|
_this._popover = null;
|
|
@@ -381,28 +383,55 @@ var _Dropdown = /** @class */ (function (_super) {
|
|
|
381
383
|
// Get the menu
|
|
382
384
|
var menu = this.el.querySelector(".dropdown-menu") || this.el.querySelector("select");
|
|
383
385
|
if (menu) {
|
|
384
|
-
|
|
385
|
-
|
|
386
|
-
|
|
387
|
-
|
|
388
|
-
|
|
389
|
-
var
|
|
390
|
-
|
|
391
|
-
|
|
392
|
-
|
|
393
|
-
|
|
394
|
-
|
|
386
|
+
// See if we are creating checkboxes
|
|
387
|
+
if (this.props.isCheckbox) {
|
|
388
|
+
var cbItems = [];
|
|
389
|
+
// Parse the items
|
|
390
|
+
var items = this.props.items || [];
|
|
391
|
+
for (var i = 0; i < items.length; i++) {
|
|
392
|
+
var item = items[i];
|
|
393
|
+
// Create the checkbox item
|
|
394
|
+
cbItems.push({
|
|
395
|
+
data: item,
|
|
396
|
+
isDisabled: item.isDisabled,
|
|
397
|
+
isSelected: item.isSelected,
|
|
398
|
+
label: item.text,
|
|
399
|
+
onChange: item.onClick,
|
|
400
|
+
type: checkboxGroup_1.CheckboxGroupTypes.Checkbox
|
|
401
|
+
});
|
|
395
402
|
}
|
|
396
|
-
//
|
|
397
|
-
|
|
403
|
+
// Render the checkbox
|
|
404
|
+
this._cb = (0, checkboxGroup_1.CheckboxGroup)({
|
|
405
|
+
className: "m-2",
|
|
406
|
+
el: menu,
|
|
407
|
+
items: cbItems,
|
|
408
|
+
multi: this.props.multi
|
|
409
|
+
});
|
|
398
410
|
}
|
|
399
|
-
|
|
400
|
-
|
|
401
|
-
//
|
|
402
|
-
var
|
|
403
|
-
|
|
404
|
-
//
|
|
405
|
-
this.
|
|
411
|
+
else {
|
|
412
|
+
var isForm = menu.nodeName == "SELECT";
|
|
413
|
+
// Parse the items
|
|
414
|
+
var items = this.props.items || [];
|
|
415
|
+
for (var i = 0; i < items.length; i++) {
|
|
416
|
+
// Create the item
|
|
417
|
+
var item = isForm ? new formItem_1.DropdownFormItem(items[i], this.props) : new item_1.DropdownItem(items[i], this.props);
|
|
418
|
+
this._items.push(item);
|
|
419
|
+
// See if this isn't for a form
|
|
420
|
+
if (!isForm) {
|
|
421
|
+
// Configure the item events
|
|
422
|
+
this.configureItemEvents(item);
|
|
423
|
+
}
|
|
424
|
+
// Add the item to the menu
|
|
425
|
+
menu.appendChild(item.el);
|
|
426
|
+
}
|
|
427
|
+
// See if this is a form
|
|
428
|
+
if (isForm) {
|
|
429
|
+
// Ensure the selected values match the index
|
|
430
|
+
var idx = menu.selectedIndex;
|
|
431
|
+
if (this._items[idx] && this._items[idx].isSelected == false) {
|
|
432
|
+
// Select the item
|
|
433
|
+
this._items[idx].toggle();
|
|
434
|
+
}
|
|
406
435
|
}
|
|
407
436
|
}
|
|
408
437
|
}
|
|
@@ -431,17 +460,31 @@ var _Dropdown = /** @class */ (function (_super) {
|
|
|
431
460
|
// Gets the value
|
|
432
461
|
_Dropdown.prototype.getValue = function () {
|
|
433
462
|
var values = [];
|
|
434
|
-
//
|
|
435
|
-
|
|
436
|
-
|
|
437
|
-
|
|
438
|
-
|
|
439
|
-
|
|
440
|
-
|
|
441
|
-
// See if this item is selected
|
|
442
|
-
if (item.isSelected) {
|
|
463
|
+
// See if the checkboxes exist
|
|
464
|
+
if (this._cb) {
|
|
465
|
+
// Get the values
|
|
466
|
+
var items = this._cb.getValue();
|
|
467
|
+
items = typeof (items["length"]) === "number" ? items : [items];
|
|
468
|
+
// Parse the items
|
|
469
|
+
for (var i = 0; i < items.length; i++) {
|
|
443
470
|
// Add the value
|
|
444
|
-
values.push(
|
|
471
|
+
values.push(items[i].data);
|
|
472
|
+
}
|
|
473
|
+
// Return the value
|
|
474
|
+
}
|
|
475
|
+
else {
|
|
476
|
+
// Parse the items
|
|
477
|
+
for (var i = 0; i < this._items.length; i++) {
|
|
478
|
+
var item = this._items[i];
|
|
479
|
+
// Skip disabled items
|
|
480
|
+
if (item.el.disabled) {
|
|
481
|
+
continue;
|
|
482
|
+
}
|
|
483
|
+
// See if this item is selected
|
|
484
|
+
if (item.isSelected) {
|
|
485
|
+
// Add the value
|
|
486
|
+
values.push(item.props);
|
|
487
|
+
}
|
|
445
488
|
}
|
|
446
489
|
}
|
|
447
490
|
// Return the value
|
|
@@ -170,6 +170,39 @@ var FormControl = /** @class */ (function () {
|
|
|
170
170
|
value: value
|
|
171
171
|
});
|
|
172
172
|
break;
|
|
173
|
+
// Dropdown
|
|
174
|
+
case _1.FormControlTypes.DropdownButton:
|
|
175
|
+
// Add the dropdown
|
|
176
|
+
this._ddl = (0, dropdown_1.Dropdown)({
|
|
177
|
+
className: className,
|
|
178
|
+
formFl: false,
|
|
179
|
+
id: this._props.id,
|
|
180
|
+
isReadonly: this._props.isReadonly,
|
|
181
|
+
items: this._props.items,
|
|
182
|
+
onChange: this._props.onChange,
|
|
183
|
+
onMenuRendering: this._props.onMenuRendering,
|
|
184
|
+
required: this._props.required,
|
|
185
|
+
title: this._props.title,
|
|
186
|
+
value: value
|
|
187
|
+
});
|
|
188
|
+
break;
|
|
189
|
+
// Dropdown
|
|
190
|
+
case _1.FormControlTypes.DropdownCheckbox:
|
|
191
|
+
// Add the dropdown
|
|
192
|
+
this._ddl = (0, dropdown_1.Dropdown)({
|
|
193
|
+
className: className,
|
|
194
|
+
formFl: false,
|
|
195
|
+
id: this._props.id,
|
|
196
|
+
isCheckbox: true,
|
|
197
|
+
isReadonly: this._props.isReadonly,
|
|
198
|
+
items: this._props.items,
|
|
199
|
+
onChange: this._props.onChange,
|
|
200
|
+
onMenuRendering: this._props.onMenuRendering,
|
|
201
|
+
required: this._props.required,
|
|
202
|
+
title: this._props.title,
|
|
203
|
+
value: value
|
|
204
|
+
});
|
|
205
|
+
break;
|
|
173
206
|
// Email
|
|
174
207
|
case _1.FormControlTypes.Email:
|
|
175
208
|
// Add the input
|
|
@@ -256,6 +289,41 @@ var FormControl = /** @class */ (function () {
|
|
|
256
289
|
value: value
|
|
257
290
|
});
|
|
258
291
|
break;
|
|
292
|
+
// Multi-Dropdown Button
|
|
293
|
+
case _1.FormControlTypes.MultiDropdownButton:
|
|
294
|
+
// Add the dropdown
|
|
295
|
+
this._ddl = (0, dropdown_1.Dropdown)({
|
|
296
|
+
className: className,
|
|
297
|
+
formFl: false,
|
|
298
|
+
id: this._props.id,
|
|
299
|
+
isReadonly: this._props.isReadonly,
|
|
300
|
+
items: this._props.items,
|
|
301
|
+
multi: true,
|
|
302
|
+
onChange: this._props.onChange,
|
|
303
|
+
onMenuRendering: this._props.onMenuRendering,
|
|
304
|
+
required: this._props.required,
|
|
305
|
+
title: this._props.title,
|
|
306
|
+
value: value
|
|
307
|
+
});
|
|
308
|
+
break;
|
|
309
|
+
// Multi-Dropdown Checkbox
|
|
310
|
+
case _1.FormControlTypes.MultiDropdownCheckbox:
|
|
311
|
+
// Add the dropdown
|
|
312
|
+
this._ddl = (0, dropdown_1.Dropdown)({
|
|
313
|
+
className: className,
|
|
314
|
+
formFl: false,
|
|
315
|
+
id: this._props.id,
|
|
316
|
+
isCheckbox: true,
|
|
317
|
+
isReadonly: this._props.isReadonly,
|
|
318
|
+
items: this._props.items,
|
|
319
|
+
multi: true,
|
|
320
|
+
onChange: this._props.onChange,
|
|
321
|
+
onMenuRendering: this._props.onMenuRendering,
|
|
322
|
+
required: this._props.required,
|
|
323
|
+
title: this._props.title,
|
|
324
|
+
value: value
|
|
325
|
+
});
|
|
326
|
+
break;
|
|
259
327
|
// Multi-List Box
|
|
260
328
|
case _1.FormControlTypes.MultiListBox:
|
|
261
329
|
// Add the list box
|
|
@@ -11,20 +11,24 @@ var FormControlTypes;
|
|
|
11
11
|
FormControlTypes[FormControlTypes["Email"] = 3] = "Email";
|
|
12
12
|
FormControlTypes[FormControlTypes["Datalist"] = 4] = "Datalist";
|
|
13
13
|
FormControlTypes[FormControlTypes["Dropdown"] = 5] = "Dropdown";
|
|
14
|
-
FormControlTypes[FormControlTypes["
|
|
15
|
-
FormControlTypes[FormControlTypes["
|
|
16
|
-
FormControlTypes[FormControlTypes["
|
|
17
|
-
FormControlTypes[FormControlTypes["
|
|
18
|
-
FormControlTypes[FormControlTypes["
|
|
19
|
-
FormControlTypes[FormControlTypes["
|
|
20
|
-
FormControlTypes[FormControlTypes["
|
|
21
|
-
FormControlTypes[FormControlTypes["
|
|
22
|
-
FormControlTypes[FormControlTypes["
|
|
23
|
-
FormControlTypes[FormControlTypes["
|
|
24
|
-
FormControlTypes[FormControlTypes["
|
|
25
|
-
FormControlTypes[FormControlTypes["
|
|
26
|
-
FormControlTypes[FormControlTypes["
|
|
27
|
-
FormControlTypes[FormControlTypes["
|
|
14
|
+
FormControlTypes[FormControlTypes["DropdownButton"] = 6] = "DropdownButton";
|
|
15
|
+
FormControlTypes[FormControlTypes["DropdownCheckbox"] = 7] = "DropdownCheckbox";
|
|
16
|
+
FormControlTypes[FormControlTypes["File"] = 8] = "File";
|
|
17
|
+
FormControlTypes[FormControlTypes["ListBox"] = 9] = "ListBox";
|
|
18
|
+
FormControlTypes[FormControlTypes["MultiCheckbox"] = 10] = "MultiCheckbox";
|
|
19
|
+
FormControlTypes[FormControlTypes["MultiDropdown"] = 11] = "MultiDropdown";
|
|
20
|
+
FormControlTypes[FormControlTypes["MultiDropdownButton"] = 12] = "MultiDropdownButton";
|
|
21
|
+
FormControlTypes[FormControlTypes["MultiDropdownCheckbox"] = 13] = "MultiDropdownCheckbox";
|
|
22
|
+
FormControlTypes[FormControlTypes["MultiListBox"] = 14] = "MultiListBox";
|
|
23
|
+
FormControlTypes[FormControlTypes["MultiRadio"] = 15] = "MultiRadio";
|
|
24
|
+
FormControlTypes[FormControlTypes["MultiSwitch"] = 16] = "MultiSwitch";
|
|
25
|
+
FormControlTypes[FormControlTypes["Password"] = 17] = "Password";
|
|
26
|
+
FormControlTypes[FormControlTypes["Radio"] = 18] = "Radio";
|
|
27
|
+
FormControlTypes[FormControlTypes["Range"] = 19] = "Range";
|
|
28
|
+
FormControlTypes[FormControlTypes["Readonly"] = 20] = "Readonly";
|
|
29
|
+
FormControlTypes[FormControlTypes["Switch"] = 21] = "Switch";
|
|
30
|
+
FormControlTypes[FormControlTypes["TextArea"] = 22] = "TextArea";
|
|
31
|
+
FormControlTypes[FormControlTypes["TextField"] = 23] = "TextField";
|
|
28
32
|
})(FormControlTypes = exports.FormControlTypes || (exports.FormControlTypes = {}));
|
|
29
33
|
/**
|
|
30
34
|
* Form Validation Types
|