ngx-ode-ui 3.12.0-dev.7 → 3.12.0-dev.8

package/esm5/ngx-ode-ui.js

@@ -7,4 +7,5 @@
  * Generated bundle index. Do not edit.
  */
 export { DynamicModuleImportsService, InputFileService, LabelsService, SpinnerService, CUSTOM_INPUT_CONTROL_VALUE_ACCESSOR, DatepickerComponent, EllipsisComponent, FormErrorsComponent, FormFieldComponent, ItemTreeComponent, LightBoxComponent, LightboxConfirmComponent, ListComponent, ListCheckableComponent, icons, MessageBoxComponent, MessageStickerComponent, MonoSelectComponent, MultiComboComponent, MultiSelectComponent, PanelSectionComponent, PortalComponent, PushPanelComponent, SearchInputComponent, SideLayoutComponent, SidePanelComponent, SpinnerCubeComponent, PagerComponent, TooltipComponent, UploadFilesComponent, SimpleSelectComponent, StepComponent, WizardComponent, DynamicComponentDirective, ComponentDescriptor, AnchorDirective, DragAndDropFilesDirective, DynamicTemplateDirective, ObjectURLDirective, BytesPipe, FilterPipe, FlattenObjectArrayPipe, KeysPipe, LimitPipe, LocalizedDatePipe, OrderPipe, StorePipe, LengthPipe, toDecimal, getUnit, UNITS, trim, standardise, removeAccents, getText, clickOn, NgxOdeUiModule } from './public-api';
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibmd4LW9kZS11aS5qcyIsInNvdXJjZVJvb3QiOiJuZzovL25neC1vZGUtdWkvIiwic291cmNlcyI6WyJuZ3gtb2RlLXVpLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7Ozs7Ozs7O0FBSUEsaWhDQUFjLGNBQWMsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogR2VuZXJhdGVkIGJ1bmRsZSBpbmRleC4gRG8gbm90IGVkaXQuXG4gKi9cblxuZXhwb3J0ICogZnJvbSAnLi9wdWJsaWMtYXBpJztcbiJdfQ==
+export { DropdownComponent as ɵa } from './lib/components/dropdown/dropdown.component';
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibmd4LW9kZS11aS5qcyIsInNvdXJjZVJvb3QiOiJuZzovL25neC1vZGUtdWkvIiwic291cmNlcyI6WyJuZ3gtb2RlLXVpLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7Ozs7Ozs7O0FBSUEsaWhDQUFjLGNBQWMsQ0FBQztBQUU3QixPQUFPLEVBQUMsaUJBQWlCLElBQUksRUFBRSxFQUFDLE1BQU0sOENBQThDLENBQUMiLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIEdlbmVyYXRlZCBidW5kbGUgaW5kZXguIERvIG5vdCBlZGl0LlxuICovXG5cbmV4cG9ydCAqIGZyb20gJy4vcHVibGljLWFwaSc7XG5cbmV4cG9ydCB7RHJvcGRvd25Db21wb25lbnQgYXMgybVhfSBmcm9tICcuL2xpYi9jb21wb25lbnRzL2Ryb3Bkb3duL2Ryb3Bkb3duLmNvbXBvbmVudCc7Il19

package/fesm2015/ngx-ode-ui.js

@@ -1224,6 +1224,7 @@ class ListComponent extends OdeComponent {
         this.model = [];
         this.searchPlaceholder = 'search';
         this.noResultsLabel = 'list.results.no.items';
+        this.isSearchActive = true;
         this.searchInput = false;
         this.inputChange = new EventEmitter();
         this.onSelect = new EventEmitter();
@@ -1263,7 +1264,7 @@ class ListComponent extends OdeComponent {
 ListComponent.decorators = [
     { type: Component, args: [{
                 selector: 'ode-list',
-                template: "<ode-search-input\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</div>\n",
+                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</div>\n",
                 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}"]
             }] }
 ];
@@ -1279,6 +1280,7 @@ ListComponent.propDecorators = {
     limit: [{ type: Input }],
     searchPlaceholder: [{ type: Input }],
     noResultsLabel: [{ type: Input }],
+    isSearchActive: [{ type: Input }],
     searchInput: [{ type: Input }],
     searchSubmit: [{ type: Input }],
     inputChange: [{ type: Output }],
@@ -1310,6 +1312,8 @@ if (false) {
     /** @type {?} */
     ListComponent.prototype.noResultsLabel;
     /** @type {?} */
+    ListComponent.prototype.isSearchActive;
+    /** @type {?} */
     ListComponent.prototype.searchInput;
     /** @type {?} */
     ListComponent.prototype.searchSubmit;
@@ -2604,6 +2608,7 @@ class SearchInputComponent extends OdeComponent {
         this._elRef = _elRef;
         this._renderer = _renderer;
         /* Inputs / Outputs / View */
+        this.isSearchActive = false;
         this.searchInput = false;
         this._delay = 200;
         this.onChange = new EventEmitter();
@@ -2699,6 +2704,7 @@ SearchInputComponent.ctorParameters = () => [
     { type: Renderer2 }
 ];
 SearchInputComponent.propDecorators = {
+    isSearchActive: [{ type: Input }],
     searchInput: [{ type: Input }],
     searchSubmit: [{ type: Input }],
     delay: [{ type: Input }],
@@ -2706,6 +2712,8 @@ SearchInputComponent.propDecorators = {
     searchBox: [{ type: ViewChild, args: ['searchBox', { static: false },] }]
 };
 if (false) {
+    /** @type {?} */
+    SearchInputComponent.prototype.isSearchActive;
     /** @type {?} */
     SearchInputComponent.prototype.searchInput;
     /** @type {?} */
@@ -4650,6 +4658,80 @@ function clickOn(el) {
     return el.triggerEventHandler('click', null);
 }
 
+/**
+ * @fileoverview added by tsickle
+ * Generated from: lib/components/dropdown/dropdown.component.ts
+ * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+ */
+/**
+ * DropdownComponent is an alternative to the MonoSelectComponent.
+ * Accept everything inside <ng-content> but should work with <ode-list> component
+ *
+ * Simple Dropdown Component without search:
+ * [isSearchActive] can be set to false to disable search input in <ode-list>
+ * ```
+ * <ode-dropdown
+ * [name]="option_name"
+ * [isDropdownOpened]="a_boolean"
+ * (onDropdown)="toggle_func"
+ * >
+ * <ode-list
+ * [model]="model"
+ * [filters]="filters"
+ * (onSelect)="func_to_select_elem($event)"
+ * (inputChange)="a_string_for_input_value = $event"
+ * noResultsLabel="text_to_display"
+ * searchPlaceholder="default_placeholder_text"
+ * >
+ * <ng-template let-item>
+ * <div>{{ item.name }}</div>
+ * </ng-template>
+ * </ode-list>
+ * </ode-dropdown>
+ * `̀``
+ */
+class DropdownComponent extends OdeComponent {
+    /**
+     * @param {?} injector
+     */
+    constructor(injector) {
+        super(injector);
+        this.name = '';
+        this.isDropdownOpened = false;
+        this.onDropdown = new EventEmitter();
+    }
+    /**
+     * @return {?}
+     */
+    ngOnInit() {
+        super.ngOnInit();
+    }
+}
+DropdownComponent.decorators = [
+    { type: Component, args: [{
+                selector: 'ode-dropdown',
+                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",
+                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-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)}"]
+            }] }
+];
+/** @nocollapse */
+DropdownComponent.ctorParameters = () => [
+    { type: Injector }
+];
+DropdownComponent.propDecorators = {
+    name: [{ type: Input }],
+    isDropdownOpened: [{ type: Input }],
+    onDropdown: [{ type: Output }]
+};
+if (false) {
+    /** @type {?} */
+    DropdownComponent.prototype.name;
+    /** @type {?} */
+    DropdownComponent.prototype.isDropdownOpened;
+    /** @type {?} */
+    DropdownComponent.prototype.onDropdown;
+}
+
 /**
  * @fileoverview added by tsickle
  * Generated from: lib/ngx-ode-ui.module.ts
@@ -4725,7 +4807,8 @@ NgxOdeUiModule.decorators = [
                     LocalizedDatePipe,
                     BytesPipe,
                     KeysPipe,
-                    LengthPipe
+                    LengthPipe,
+                    DropdownComponent
                 ],
                 imports: [
                     CommonModule,
@@ -4762,6 +4845,7 @@ NgxOdeUiModule.decorators = [
                     SpinnerCubeComponent,
                     PagerComponent,
                     EllipsisComponent,
+                    DropdownComponent,
                     // directives
                     AnchorDirective,
                     DynamicTemplateDirective,
@@ -4796,5 +4880,5 @@ NgxOdeUiModule.decorators = [
  * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  */
 
-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 };
+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 };
 //# sourceMappingURL=ngx-ode-ui.js.map