ngx-ode-ui 3.12.0-dev.1 → 3.12.0-dev.13

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 (32) hide show
  1. package/bundles/ngx-ode-ui.umd.js +261 -9
  2. package/bundles/ngx-ode-ui.umd.js.map +1 -1
  3. package/bundles/ngx-ode-ui.umd.min.js +1 -1
  4. package/bundles/ngx-ode-ui.umd.min.js.map +1 -1
  5. package/esm2015/lib/components/dropdown/dropdown.component.js +76 -0
  6. package/esm2015/lib/components/list/list.component.js +18 -4
  7. package/esm2015/lib/components/list-checkable/list-checkable.component.js +137 -0
  8. package/esm2015/lib/components/multi-combo/multi-combo.component.js +2 -2
  9. package/esm2015/lib/components/search-input/search-input.component.js +15 -3
  10. package/esm2015/lib/ngx-ode-ui.module.js +8 -2
  11. package/esm2015/ngx-ode-ui.js +3 -2
  12. package/esm2015/public-api.js +2 -1
  13. package/esm5/lib/components/dropdown/dropdown.component.js +81 -0
  14. package/esm5/lib/components/list/list.component.js +18 -4
  15. package/esm5/lib/components/list-checkable/list-checkable.component.js +148 -0
  16. package/esm5/lib/components/multi-combo/multi-combo.component.js +2 -2
  17. package/esm5/lib/components/search-input/search-input.component.js +16 -5
  18. package/esm5/lib/ngx-ode-ui.module.js +8 -2
  19. package/esm5/ngx-ode-ui.js +3 -2
  20. package/esm5/public-api.js +2 -1
  21. package/fesm2015/ngx-ode-ui.js +247 -8
  22. package/fesm2015/ngx-ode-ui.js.map +1 -1
  23. package/fesm5/ngx-ode-ui.js +260 -10
  24. package/fesm5/ngx-ode-ui.js.map +1 -1
  25. package/lib/components/dropdown/dropdown.component.d.ts +36 -0
  26. package/lib/components/list/list.component.d.ts +5 -1
  27. package/lib/components/list-checkable/list-checkable.component.d.ts +55 -0
  28. package/lib/components/search-input/search-input.component.d.ts +3 -0
  29. package/ngx-ode-ui.d.ts +1 -0
  30. package/ngx-ode-ui.metadata.json +1 -1
  31. package/package.json +1 -1
  32. package/public-api.d.ts +1 -0
@@ -1380,9 +1380,11 @@ var ListComponent = /** @class */ (function (_super) {
1380
1380
  /* Store pipe */
1381
1381
  _this.self = _this;
1382
1382
  _this._storedElements = [];
1383
- _this.model = [];
1384
1383
  _this.searchPlaceholder = 'search';
1385
1384
  _this.noResultsLabel = 'list.results.no.items';
1385
+ _this.placeholder = 'list.placeholder';
1386
+ _this.isSearchActive = true;
1387
+ _this.searchInput = false;
1386
1388
  _this.inputChange = new EventEmitter();
1387
1389
  _this.onSelect = new EventEmitter();
1388
1390
  _this.listChange = new EventEmitter();
@@ -1425,8 +1427,8 @@ var ListComponent = /** @class */ (function (_super) {
1425
1427
  ListComponent.decorators = [
1426
1428
  { type: Component, args: [{
1427
1429
  selector: 'ode-list',
1428
- template: "<ode-search-input [attr.placeholder]=\"searchPlaceholder | translate\" (onChange)=\"inputChange.emit($event)\"></ode-search-input>\n<div class=\"toolbar\">\n <ng-content select=\"[toolbar]\"></ng-content>\n</div>\n<div class=\"list-wrapper\"\n infiniteScroll\n [scrollWindow]=\"false\"\n (scrolled)=\"scrolledDown.emit()\"\n [infiniteScrollThrottle]=\"50\">\n <ul>\n <li *ngFor=\"let item of model | filter: filters | filter: inputFilter | store:self:'storedElements' | orderBy: sort | slice: 0:limit\"\n (click)=\"onSelect.emit(item)\"\n [class.selected]=\"isSelected(item)\"\n [class.disabled]=\"isDisabled(item)\"\n [ngClass]=\"ngClass(item)\"\n class=\"lct-list-item\">\n <ng-template [ngTemplateOutlet]=\"templateRef\" [ngTemplateOutletContext]=\"{$implicit: item}\">\n </ng-template>\n </li>\n </ul>\n <ul *ngIf=\"storedElements && storedElements.length === 0\">\n <li class=\"no-results\">{{ noResultsLabel | translate }}</li>\n </ul>\n</div>\n",
1429
- styles: ["ul{margin:0;padding:0;font-size:.9em}ul li{cursor:pointer;border-top:1px solid #ddd;padding:10px}ul li.disabled{pointer-events:none}"]
1430
+ template: "<ode-search-input\n *ngIf=\"isSearchActive\"\n [searchInput]=\"searchInput\"\n [searchSubmit]=\"searchSubmit\"\n [attr.placeholder]=\"searchPlaceholder | translate\"\n (onChange)=\"inputChange.emit($event)\"></ode-search-input>\n<div class=\"toolbar\">\n <ng-content select=\"[toolbar]\"></ng-content>\n</div>\n<div class=\"list-wrapper\"\n infiniteScroll\n [scrollWindow]=\"false\"\n (scrolled)=\"scrolledDown.emit()\"\n [infiniteScrollThrottle]=\"50\">\n <ul>\n <li *ngFor=\"let item of model | filter: filters | filter: inputFilter | store:self:'storedElements' | orderBy: sort | slice: 0:limit\"\n (click)=\"onSelect.emit(item)\"\n [class.selected]=\"isSelected(item)\"\n [class.disabled]=\"isDisabled(item)\"\n [ngClass]=\"ngClass(item)\"\n class=\"lct-list-item\">\n <ng-template [ngTemplateOutlet]=\"templateRef\" [ngTemplateOutletContext]=\"{$implicit: item}\">\n </ng-template>\n </li>\n </ul>\n <ul *ngIf=\"storedElements && storedElements.length === 0\">\n <li class=\"no-results\">{{ noResultsLabel | translate }}</li>\n </ul>\n <ul *ngIf=\"!model\">\n <li class=\"placeholder\">{{ placeholder | translate }}</li>\n </ul>\n</div>\n",
1431
+ styles: ["ul{margin:0;padding:0;font-size:.9em}ul li{cursor:pointer;border-top:1px solid #ddd;padding:10px}ul li.no-results{padding:50px;text-align:center;font-style:italic}ul li.no-results:hover{cursor:default!important;background-color:inherit!important}ul li.placeholder{color:#aaa;padding:50px;text-align:center}ul li.placeholder:hover{cursor:default!important;background-color:inherit!important}ul li.disabled{pointer-events:none}.list-wrapper{min-height:30vh}"]
1430
1432
  }] }
1431
1433
  ];
1432
1434
  /** @nocollapse */
@@ -1441,6 +1443,10 @@ var ListComponent = /** @class */ (function (_super) {
1441
1443
  limit: [{ type: Input }],
1442
1444
  searchPlaceholder: [{ type: Input }],
1443
1445
  noResultsLabel: [{ type: Input }],
1446
+ placeholder: [{ type: Input }],
1447
+ isSearchActive: [{ type: Input }],
1448
+ searchInput: [{ type: Input }],
1449
+ searchSubmit: [{ type: Input }],
1444
1450
  inputChange: [{ type: Output }],
1445
1451
  onSelect: [{ type: Output }],
1446
1452
  listChange: [{ type: Output }],
@@ -1472,6 +1478,14 @@ if (false) {
1472
1478
  /** @type {?} */
1473
1479
  ListComponent.prototype.noResultsLabel;
1474
1480
  /** @type {?} */
1481
+ ListComponent.prototype.placeholder;
1482
+ /** @type {?} */
1483
+ ListComponent.prototype.isSearchActive;
1484
+ /** @type {?} */
1485
+ ListComponent.prototype.searchInput;
1486
+ /** @type {?} */
1487
+ ListComponent.prototype.searchSubmit;
1488
+ /** @type {?} */
1475
1489
  ListComponent.prototype.inputChange;
1476
1490
  /** @type {?} */
1477
1491
  ListComponent.prototype.onSelect;
@@ -1489,6 +1503,150 @@ if (false) {
1489
1503
  ListComponent.prototype.ngClass;
1490
1504
  }
1491
1505
 
1506
+ /**
1507
+ * @fileoverview added by tsickle
1508
+ * Generated from: lib/components/list-checkable/list-checkable.component.ts
1509
+ * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
1510
+ */
1511
+ var ListCheckableComponent = /** @class */ (function (_super) {
1512
+ __extends(ListCheckableComponent, _super);
1513
+ function ListCheckableComponent(injector) {
1514
+ var _this = _super.call(this, injector) || this;
1515
+ _this.model = [];
1516
+ _this.noResultsLabel = 'list.results.no.items';
1517
+ _this.readOnly = false;
1518
+ _this.onCheck = new EventEmitter();
1519
+ _this.listChange = new EventEmitter();
1520
+ _this.scrolledDown = new EventEmitter();
1521
+ _this.areAllChecked = (/**
1522
+ * @return {?}
1523
+ */
1524
+ function () { return false; });
1525
+ _this.isChecked = (/**
1526
+ * @param {?=} arg
1527
+ * @return {?}
1528
+ */
1529
+ function (arg) { return false; });
1530
+ _this.isDisabled = (/**
1531
+ * @param {?=} arg
1532
+ * @return {?}
1533
+ */
1534
+ function (arg) { return false; });
1535
+ _this.ngClass = (/**
1536
+ * @param {?=} arg
1537
+ * @return {?}
1538
+ */
1539
+ function (arg) { return ({}); });
1540
+ /* Store pipe */
1541
+ _this.self = _this;
1542
+ _this._storedElements = [];
1543
+ return _this;
1544
+ }
1545
+ Object.defineProperty(ListCheckableComponent.prototype, "storedElements", {
1546
+ get: /**
1547
+ * @return {?}
1548
+ */
1549
+ function () {
1550
+ return this._storedElements;
1551
+ },
1552
+ set: /**
1553
+ * @param {?} list
1554
+ * @return {?}
1555
+ */
1556
+ function (list) {
1557
+ this._storedElements = list;
1558
+ this.listChange.emit(list);
1559
+ },
1560
+ enumerable: true,
1561
+ configurable: true
1562
+ });
1563
+ /**
1564
+ * @param {?} checkAll
1565
+ * @return {?}
1566
+ */
1567
+ ListCheckableComponent.prototype.toggleAll = /**
1568
+ * @param {?} checkAll
1569
+ * @return {?}
1570
+ */
1571
+ function (checkAll) {
1572
+ var _this = this;
1573
+ this.model.forEach((/**
1574
+ * @param {?} item
1575
+ * @return {?}
1576
+ */
1577
+ function (item) {
1578
+ /** @type {?} */
1579
+ var isChecked = _this.isChecked(item);
1580
+ if (!_this.isDisabled(item)
1581
+ && ((isChecked && !checkAll) || (!isChecked && checkAll))) {
1582
+ _this.onCheck.emit({ item: item, checked: checkAll });
1583
+ }
1584
+ }));
1585
+ };
1586
+ ListCheckableComponent.decorators = [
1587
+ { type: Component, args: [{
1588
+ selector: 'ode-list-checkable',
1589
+ template: "<div class=\"list-checkable-wrapper\"\n infiniteScroll\n [scrollWindow]=\"false\"\n (scrolled)=\"scrolledDown.emit()\"\n [infiniteScrollThrottle]=\"50\">\n\n <ul *ngIf=\"storedElements && storedElements.length === 0\">\n <li class=\"no-results\"><span>{{ noResultsLabel | translate }}</span></li>\n </ul>\n \n <ul>\n <li class=\"select-all\" \n [class.checked]=\"areAllChecked()\"\n *ngIf=\"!readOnly\">\n <label>\n <span>{{(areAllChecked() ? 'ux.multiselect.deselect-all' : 'ux.multiselect.select-all') | translate}}</span>\n <input type=\"checkbox\" [checked]=\"areAllChecked()\" (change)=\"toggleAll($event.target.checked)\" />\n </label>\n </li>\n\n <li class=\"lct-list-checkable-item\" \n [class.checked]=\"isChecked(item)\"\n [class.disabled]=\"isDisabled(item)\"\n [ngClass]=\"ngClass(item)\"\n *ngFor=\"let item of model | filter: filters | store:self:'storedElements' | orderBy: sort | slice: 0:limit\">\n <label>\n <span>\n <ng-template [ngTemplateOutlet]=\"templateRef\" [ngTemplateOutletContext]=\"{$implicit: item}\"></ng-template> \n </span>\n <input *ngIf=\"!readOnly\" type=\"checkbox\" \n [disabled]=\"isDisabled(item)\"\n [checked]=\"isChecked(item)\"\n (change)=\"onCheck.emit({item:item, checked:$event.target.checked})\"/>\n </label>\n </li>\n </ul>\n\n</div>\n",
1590
+ styles: ["ul{margin:0;padding:0;font-size:.9em}ul li{border-top:1px solid #ddd;width:-webkit-fill-available;width:-moz-available;display:flex}ul li:not(.checked){color:#939393}ul li.disabled{pointer-events:none}ul li.select-all{background-color:#ff83520a;color:#5b6472}ul li.select-all span{text-align:right}ul li label{cursor:pointer;width:100%;display:flex}ul li label:hover{background-color:#eaedf2}ul li label span{padding:7px 15px;width:100%}ul li label input[type=checkbox]{margin-right:15px;-ms-grid-row-align:center;align-self:center}"]
1591
+ }] }
1592
+ ];
1593
+ /** @nocollapse */
1594
+ ListCheckableComponent.ctorParameters = function () { return [
1595
+ { type: Injector }
1596
+ ]; };
1597
+ ListCheckableComponent.propDecorators = {
1598
+ model: [{ type: Input }],
1599
+ filters: [{ type: Input }],
1600
+ sort: [{ type: Input }],
1601
+ limit: [{ type: Input }],
1602
+ noResultsLabel: [{ type: Input }],
1603
+ readOnly: [{ type: Input }],
1604
+ onCheck: [{ type: Output }],
1605
+ listChange: [{ type: Output }],
1606
+ scrolledDown: [{ type: Output }],
1607
+ templateRef: [{ type: ContentChild, args: [TemplateRef, { static: false },] }],
1608
+ areAllChecked: [{ type: Input }],
1609
+ isChecked: [{ type: Input }],
1610
+ isDisabled: [{ type: Input }],
1611
+ ngClass: [{ type: Input }]
1612
+ };
1613
+ return ListCheckableComponent;
1614
+ }(OdeComponent));
1615
+ if (false) {
1616
+ /** @type {?} */
1617
+ ListCheckableComponent.prototype.model;
1618
+ /** @type {?} */
1619
+ ListCheckableComponent.prototype.filters;
1620
+ /** @type {?} */
1621
+ ListCheckableComponent.prototype.sort;
1622
+ /** @type {?} */
1623
+ ListCheckableComponent.prototype.limit;
1624
+ /** @type {?} */
1625
+ ListCheckableComponent.prototype.noResultsLabel;
1626
+ /** @type {?} */
1627
+ ListCheckableComponent.prototype.readOnly;
1628
+ /** @type {?} */
1629
+ ListCheckableComponent.prototype.onCheck;
1630
+ /** @type {?} */
1631
+ ListCheckableComponent.prototype.listChange;
1632
+ /** @type {?} */
1633
+ ListCheckableComponent.prototype.scrolledDown;
1634
+ /** @type {?} */
1635
+ ListCheckableComponent.prototype.templateRef;
1636
+ /** @type {?} */
1637
+ ListCheckableComponent.prototype.areAllChecked;
1638
+ /** @type {?} */
1639
+ ListCheckableComponent.prototype.isChecked;
1640
+ /** @type {?} */
1641
+ ListCheckableComponent.prototype.isDisabled;
1642
+ /** @type {?} */
1643
+ ListCheckableComponent.prototype.ngClass;
1644
+ /** @type {?} */
1645
+ ListCheckableComponent.prototype.self;
1646
+ /** @type {?} */
1647
+ ListCheckableComponent.prototype._storedElements;
1648
+ }
1649
+
1492
1650
  /**
1493
1651
  * @fileoverview added by tsickle
1494
1652
  * Generated from: lib/components/message-box/message-box.component.ts
@@ -2300,7 +2458,7 @@ var MultiComboComponent = /** @class */ (function (_super) {
2300
2458
  MultiComboComponent.decorators = [
2301
2459
  { type: Component, args: [{
2302
2460
  selector: 'ode-multi-combo',
2303
- template: "<button (click)=\"toggleVisibility()\"\n [ngClass]=\"{ opened: show }\"\n [disabled]=\"disabled\">\n {{ title }}\n</button>\n<div [ngClass]=\"{ hidden: !show }\">\n <div class=\"options\">\n <button class=\"select-all\" (click)=\"selectAll()\" *ngIf=\"!maxSelected\"\n [title]=\"labels('select.all')\">{{ labels('select.all') }}</button>\n <button class=\"deselect-all\" (click)=\"deselectAll()\"\n [title]=\"labels('deselect.all')\">{{ labels('deselect.all') }}</button>\n </div>\n <div *ngIf=\"filter\" class=\"filter\">\n <ode-search-input (onChange)=\"search.input = $event\" [attr.placeholder]=\"labels('search')\"></ode-search-input>\n </div>\n <ul>\n <li *ngFor=\"let item of _comboModel | filter: getFilter() | orderBy: orderBy | store: self:'filteredComboModel'\"\n (click)=\"toggleItem(item)\"\n [ngClass]=\"{ selected: isSelected(item) }\"\n [attr.disabled]=\"isDisabled()\">\n {{ displayItem(item) | translate }}\n </li>\n </ul>\n</div>\n",
2461
+ template: "<button (click)=\"toggleVisibility()\"\n [ngClass]=\"{ opened: show }\"\n [disabled]=\"disabled\"\n type=\"button\">\n {{ title }}\n</button>\n<div [ngClass]=\"{ hidden: !show }\">\n <div class=\"options\">\n <button class=\"select-all\" (click)=\"selectAll()\" *ngIf=\"!maxSelected\"\n [title]=\"labels('select.all')\" type=\"button\">{{ labels('select.all') }}</button>\n <button class=\"deselect-all\" (click)=\"deselectAll()\"\n [title]=\"labels('deselect.all')\" type=\"button\">{{ labels('deselect.all') }}</button>\n </div>\n <div *ngIf=\"filter\" class=\"filter\">\n <ode-search-input (onChange)=\"search.input = $event\" [attr.placeholder]=\"labels('search')\"></ode-search-input>\n </div>\n <ul>\n <li *ngFor=\"let item of _comboModel | filter: getFilter() | orderBy: orderBy | store: self:'filteredComboModel'\"\n (click)=\"toggleItem(item)\"\n [ngClass]=\"{ selected: isSelected(item) }\"\n [attr.disabled]=\"isDisabled()\">\n {{ displayItem(item) | translate }}\n </li>\n </ul>\n</div>\n",
2304
2462
  host: {
2305
2463
  '(document:click)': 'onClick($event)',
2306
2464
  },
@@ -2791,6 +2949,9 @@ var SearchInputComponent = /** @class */ (function (_super) {
2791
2949
  var _this = _super.call(this, injector) || this;
2792
2950
  _this._elRef = _elRef;
2793
2951
  _this._renderer = _renderer;
2952
+ /* Inputs / Outputs / View */
2953
+ _this.isSearchActive = false;
2954
+ _this.searchInput = false;
2794
2955
  _this._delay = 200;
2795
2956
  _this.onChange = new EventEmitter();
2796
2957
  /* Internal logic */
@@ -2804,9 +2965,7 @@ var SearchInputComponent = /** @class */ (function (_super) {
2804
2965
  function () {
2805
2966
  return this._delay;
2806
2967
  },
2807
- /* Inputs / Outputs / View */
2808
- set: /* Inputs / Outputs / View */
2809
- /**
2968
+ set: /**
2810
2969
  * @param {?} d
2811
2970
  * @return {?}
2812
2971
  */
@@ -2896,7 +3055,8 @@ var SearchInputComponent = /** @class */ (function (_super) {
2896
3055
  SearchInputComponent.decorators = [
2897
3056
  { type: Component, args: [{
2898
3057
  selector: 'ode-search-input',
2899
- template: "<input type=\"search\" #searchBox (input)=\"search(searchBox.value)\"/>\n"
3058
+ template: "<form\n class=\"search-container\"\n (ngSubmit)=\"searchInput && searchSubmit()\">\n <input\n #searchBox\n class=\"search-input\"\n name=\"searchTerm\"\n type=\"search\"\n (input)=\"search(searchBox.value)\" />\n <button class=\"search-button\" *ngIf=\"searchInput\">\n <i class=\"fa fa-search is-size-4 search-icon\"></i>\n </button>\n</form>\n\n<!-- <input *ngIf=\"!searchInput\" type=\"search\" #searchBox (input)=\"search(searchBox.value)\"/> -->",
3059
+ styles: [":host .search-container{margin:0;display:flex}:host .search-icon{padding-left:0}:host .search-button{margin:0;background:#ff8352;color:#fff}"]
2900
3060
  }] }
2901
3061
  ];
2902
3062
  /** @nocollapse */
@@ -2906,6 +3066,9 @@ var SearchInputComponent = /** @class */ (function (_super) {
2906
3066
  { type: Renderer2 }
2907
3067
  ]; };
2908
3068
  SearchInputComponent.propDecorators = {
3069
+ isSearchActive: [{ type: Input }],
3070
+ searchInput: [{ type: Input }],
3071
+ searchSubmit: [{ type: Input }],
2909
3072
  delay: [{ type: Input }],
2910
3073
  onChange: [{ type: Output }],
2911
3074
  searchBox: [{ type: ViewChild, args: ['searchBox', { static: false },] }]
@@ -2913,6 +3076,12 @@ var SearchInputComponent = /** @class */ (function (_super) {
2913
3076
  return SearchInputComponent;
2914
3077
  }(OdeComponent));
2915
3078
  if (false) {
3079
+ /** @type {?} */
3080
+ SearchInputComponent.prototype.isSearchActive;
3081
+ /** @type {?} */
3082
+ SearchInputComponent.prototype.searchInput;
3083
+ /** @type {?} */
3084
+ SearchInputComponent.prototype.searchSubmit;
2916
3085
  /**
2917
3086
  * @type {?}
2918
3087
  * @private
@@ -4997,6 +5166,83 @@ function clickOn(el) {
4997
5166
  return el.triggerEventHandler('click', null);
4998
5167
  }
4999
5168
 
5169
+ /**
5170
+ * @fileoverview added by tsickle
5171
+ * Generated from: lib/components/dropdown/dropdown.component.ts
5172
+ * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
5173
+ */
5174
+ /**
5175
+ * DropdownComponent is an alternative to the MonoSelectComponent.
5176
+ * Accept everything inside <ng-content> but should work with <ode-list> component
5177
+ *
5178
+ * Simple Dropdown Component without search:
5179
+ * [isSearchActive] can be set to false to disable search input in <ode-list>
5180
+ * ```
5181
+ * <ode-dropdown
5182
+ * [name]="option_name"
5183
+ * [isDropdownOpened]="a_boolean"
5184
+ * (onDropdown)="toggle_func"
5185
+ * >
5186
+ * <ode-list
5187
+ * [model]="model"
5188
+ * [filters]="filters"
5189
+ * (onSelect)="func_to_select_elem($event)"
5190
+ * (inputChange)="a_string_for_input_value = $event"
5191
+ * noResultsLabel="text_to_display"
5192
+ * searchPlaceholder="default_placeholder_text"
5193
+ * >
5194
+ * <ng-template let-item>
5195
+ * <div>{{ item.name }}</div>
5196
+ * </ng-template>
5197
+ * </ode-list>
5198
+ * </ode-dropdown>
5199
+ * `̀``
5200
+ */
5201
+ var DropdownComponent = /** @class */ (function (_super) {
5202
+ __extends(DropdownComponent, _super);
5203
+ function DropdownComponent(injector) {
5204
+ var _this = _super.call(this, injector) || this;
5205
+ _this.name = '';
5206
+ _this.isDropdownOpened = false;
5207
+ _this.onDropdown = new EventEmitter();
5208
+ return _this;
5209
+ }
5210
+ /**
5211
+ * @return {?}
5212
+ */
5213
+ DropdownComponent.prototype.ngOnInit = /**
5214
+ * @return {?}
5215
+ */
5216
+ function () {
5217
+ _super.prototype.ngOnInit.call(this);
5218
+ };
5219
+ DropdownComponent.decorators = [
5220
+ { type: Component, args: [{
5221
+ selector: 'ode-dropdown',
5222
+ template: "<div class=\"dropdown\" [ngClass]=\"isDropdownOpened ? 'open' : ''\">\n <button (click)=\"onDropdown.emit()\" class=\"dropdown-trigger\">\n <span class=\"cell-ellipsis\">{{ name }}</span> <i class=\"fonticon arrow-select\"></i>\n </button>\n <div class=\"dropdown-list\">\n <ng-content></ng-content>\n </div>\n</div>\n",
5223
+ styles: [".dropdown{position:relative;width:230px;box-sizing:border-box}.dropdown *{box-sizing:border-box}.dropdown-trigger{cursor:pointer;display:inline-flex;align-items:center;justify-content:space-between;padding:12px 16px;font-size:14px;color:#4a4a4a;text-transform:uppercase;text-align:left;width:100%;border-radius:8px;border:1px solid #7a7a7a;background-color:#fff}.dropdown-trigger>span{display:inline-block;max-width:100%;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.dropdown-trigger i.arrow-select{display:inline-block;float:none!important;padding-left:0;transform:rotate(180deg);transform-origin:center center}.dropdown-trigger:hover{color:#4a4a4a;border-color:#7a7a7a;background-color:#fff}.dropdown-trigger:hover i.arrow-select{color:#4a4a4a!important}.dropdown-list{display:none;position:absolute;overflow:hidden;z-index:2;top:100%;left:0;right:0;width:316px;box-shadow:0 4px 12px 0 rgba(0,0,0,.15);border-radius:8px;background-color:#fff}.dropdown::ng-deep ode-list li{justify-content:flex-start}.dropdown::ng-deep ode-list input[type=search]{padding:12px 16px}.dropdown.open .dropdown-list{display:block}.dropdown.open i.arrow-select{transform:rotate(0)}"]
5224
+ }] }
5225
+ ];
5226
+ /** @nocollapse */
5227
+ DropdownComponent.ctorParameters = function () { return [
5228
+ { type: Injector }
5229
+ ]; };
5230
+ DropdownComponent.propDecorators = {
5231
+ name: [{ type: Input }],
5232
+ isDropdownOpened: [{ type: Input }],
5233
+ onDropdown: [{ type: Output }]
5234
+ };
5235
+ return DropdownComponent;
5236
+ }(OdeComponent));
5237
+ if (false) {
5238
+ /** @type {?} */
5239
+ DropdownComponent.prototype.name;
5240
+ /** @type {?} */
5241
+ DropdownComponent.prototype.isDropdownOpened;
5242
+ /** @type {?} */
5243
+ DropdownComponent.prototype.onDropdown;
5244
+ }
5245
+
5000
5246
  /**
5001
5247
  * @fileoverview added by tsickle
5002
5248
  * Generated from: lib/ngx-ode-ui.module.ts
@@ -5045,6 +5291,7 @@ var NgxOdeUiModule = /** @class */ (function () {
5045
5291
  LightBoxComponent,
5046
5292
  LightboxConfirmComponent,
5047
5293
  ListComponent,
5294
+ ListCheckableComponent,
5048
5295
  MonoSelectComponent,
5049
5296
  MultiSelectComponent,
5050
5297
  MultiComboComponent,
@@ -5079,7 +5326,8 @@ var NgxOdeUiModule = /** @class */ (function () {
5079
5326
  LocalizedDatePipe,
5080
5327
  BytesPipe,
5081
5328
  KeysPipe,
5082
- LengthPipe
5329
+ LengthPipe,
5330
+ DropdownComponent
5083
5331
  ],
5084
5332
  imports: [
5085
5333
  CommonModule,
@@ -5096,6 +5344,7 @@ var NgxOdeUiModule = /** @class */ (function () {
5096
5344
  LightBoxComponent,
5097
5345
  LightboxConfirmComponent,
5098
5346
  ListComponent,
5347
+ ListCheckableComponent,
5099
5348
  MonoSelectComponent,
5100
5349
  MultiSelectComponent,
5101
5350
  MultiComboComponent,
@@ -5115,6 +5364,7 @@ var NgxOdeUiModule = /** @class */ (function () {
5115
5364
  SpinnerCubeComponent,
5116
5365
  PagerComponent,
5117
5366
  EllipsisComponent,
5367
+ DropdownComponent,
5118
5368
  // directives
5119
5369
  AnchorDirective,
5120
5370
  DynamicTemplateDirective,
@@ -5151,5 +5401,5 @@ var NgxOdeUiModule = /** @class */ (function () {
5151
5401
  * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
5152
5402
  */
5153
5403
 
5154
- export { AnchorDirective, BytesPipe, CUSTOM_INPUT_CONTROL_VALUE_ACCESSOR, ComponentDescriptor, DatepickerComponent, DragAndDropFilesDirective, DynamicComponentDirective, DynamicModuleImportsService, DynamicTemplateDirective, EllipsisComponent, FilterPipe, FlattenObjectArrayPipe, FormErrorsComponent, FormFieldComponent, InputFileService, ItemTreeComponent, KeysPipe, LabelsService, LengthPipe, LightBoxComponent, LightboxConfirmComponent, LimitPipe, ListComponent, LocalizedDatePipe, MessageBoxComponent, MessageStickerComponent, MonoSelectComponent, MultiComboComponent, MultiSelectComponent, NgxOdeUiModule, ObjectURLDirective, OrderPipe, PagerComponent, PanelSectionComponent, PortalComponent, PushPanelComponent, SearchInputComponent, SideLayoutComponent, SidePanelComponent, SimpleSelectComponent, SpinnerCubeComponent, SpinnerService, StepComponent, StorePipe, TooltipComponent, UNITS, UploadFilesComponent, WizardComponent, clickOn, getText, getUnit, icons, removeAccents, standardise, toDecimal, trim };
5404
+ export { AnchorDirective, BytesPipe, CUSTOM_INPUT_CONTROL_VALUE_ACCESSOR, ComponentDescriptor, DatepickerComponent, DragAndDropFilesDirective, DynamicComponentDirective, DynamicModuleImportsService, DynamicTemplateDirective, EllipsisComponent, FilterPipe, FlattenObjectArrayPipe, FormErrorsComponent, FormFieldComponent, InputFileService, ItemTreeComponent, KeysPipe, LabelsService, LengthPipe, LightBoxComponent, LightboxConfirmComponent, LimitPipe, ListCheckableComponent, ListComponent, LocalizedDatePipe, MessageBoxComponent, MessageStickerComponent, MonoSelectComponent, MultiComboComponent, MultiSelectComponent, NgxOdeUiModule, ObjectURLDirective, OrderPipe, PagerComponent, PanelSectionComponent, PortalComponent, PushPanelComponent, SearchInputComponent, SideLayoutComponent, SidePanelComponent, SimpleSelectComponent, SpinnerCubeComponent, SpinnerService, StepComponent, StorePipe, TooltipComponent, UNITS, UploadFilesComponent, WizardComponent, clickOn, getText, getUnit, icons, removeAccents, standardise, toDecimal, trim, DropdownComponent as ɵa };
5155
5405
  //# sourceMappingURL=ngx-ode-ui.js.map