angular2-virtual-select/dist/sh-select-menu.component.metadata.json

A native angular 2 select and multi select component with virtual scrolling to allow thousands of options in one select component

[{"__symbolic":"module","version":3,"metadata":{"ShSelectMenuComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"sh-select-menu","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy"},"member":"OnPush"},"template":"\n        <div class=\"menu\" *ngIf=\"isOpen && _rows\" style=\"min-height: 35px;background-color: white\">\n          <!--virtual-->\n          <virtual-scroll [items]=\"_rows\" (update)=\"viewPortItems = $event\"\n            [style.height]=\"math.min(290,38 * _rows.length) + 'px'\"\n            style=\"display: block\">         \n            <div class=\"item\"\n                 *ngFor=\"let row of viewPortItems\"\n                 [class.selected]=\"selectedValues?.indexOf(row) !== -1\"\n                 (click)=\"toggleSelected(row)\">\n              {{row.name || row}}\n            </div>\n          </virtual-scroll>\n        </div>","styles":[".menu{\n  margin: 0;\n  padding: 0;\n  position: absolute;\n  background-color: white;\n  width: 100%;\n  max-height: 300px;\n  overflow: auto;\n  box-sizing: border-box;\n  z-index: 999;\n  box-shadow: 0 2px 3px 0 rgba(34,36,38,.15);\n  border-bottom: 1px solid rgba(34,36,38,.15);\n  border-left: 1px solid rgba(34,36,38,.15);\n  border-right: 1px solid rgba(34,36,38,.15);\n  border-radius: 0 0 2px 2px;\n  min-width: max-content;\n}\n\n.item{\n  padding: 4px;\n  cursor: pointer;\n  white-space: nowrap;\n}\n.item:hover{\n  background-color: #efefef;\n}\n\n\n.item.selected{\n  font-weight: 900;\n}"]}]}],"members":{"selectedValues":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"isOpen":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"noToggleClick":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"virtualScrollElm":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild"},"arguments":[{"__symbolic":"reference","module":"./virtual-scroll","name":"VirtualScrollComponent"}]}]}],"rows":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"toggleSelected":[{"__symbolic":"method"}]}}}},{"__symbolic":"module","version":1,"metadata":{"ShSelectMenuComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"sh-select-menu","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy"},"member":"OnPush"},"template":"\n        <div class=\"menu\" *ngIf=\"isOpen && _rows\" style=\"min-height: 35px;background-color: white\">\n          <!--virtual-->\n          <virtual-scroll [items]=\"_rows\" (update)=\"viewPortItems = $event\"\n            [style.height]=\"math.min(290,38 * _rows.length) + 'px'\"\n            style=\"display: block\">         \n            <div class=\"item\"\n                 *ngFor=\"let row of viewPortItems\"\n                 [class.selected]=\"selectedValues?.indexOf(row) !== -1\"\n                 (click)=\"toggleSelected(row)\">\n              {{row.name || row}}\n            </div>\n          </virtual-scroll>\n        </div>","styles":[".menu{\n  margin: 0;\n  padding: 0;\n  position: absolute;\n  background-color: white;\n  width: 100%;\n  max-height: 300px;\n  overflow: auto;\n  box-sizing: border-box;\n  z-index: 999;\n  box-shadow: 0 2px 3px 0 rgba(34,36,38,.15);\n  border-bottom: 1px solid rgba(34,36,38,.15);\n  border-left: 1px solid rgba(34,36,38,.15);\n  border-right: 1px solid rgba(34,36,38,.15);\n  border-radius: 0 0 2px 2px;\n  min-width: max-content;\n}\n\n.item{\n  padding: 4px;\n  cursor: pointer;\n  white-space: nowrap;\n}\n.item:hover{\n  background-color: #efefef;\n}\n\n\n.item.selected{\n  font-weight: 900;\n}"]}]}],"members":{"selectedValues":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"isOpen":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"noToggleClick":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"virtualScrollElm":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild"},"arguments":[{"__symbolic":"reference","module":"./virtual-scroll","name":"VirtualScrollComponent"}]}]}],"rows":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"toggleSelected":[{"__symbolic":"method"}]}}}}]