@nova-ui/bits
Version:
SolarWinds Nova Framework
54 lines • 11.8 kB
JavaScript
// © 2022 SolarWinds Worldwide, LLC. All rights reserved.
//
// Permission is hereby granted, free of charge, to any person obtaining a copy
// of this software and associated documentation files (the "Software"), to
// deal in the Software without restriction, including without limitation the
// rights to use, copy, modify, merge, publish, distribute, sublicense, and/or
// sell copies of the Software, and to permit persons to whom the Software is
// furnished to do so, subject to the following conditions:
//
// The above copyright notice and this permission notice shall be included in
// all copies or substantial portions of the Software.
//
// THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
// IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
// FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
// AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
// LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
// OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
// THE SOFTWARE.
import { Component, EventEmitter, Input, Output, ViewEncapsulation, } from "@angular/core";
import * as i0 from "@angular/core";
/**
* @ignore
* <example-url>./../examples/index.html#/repeat-item</example-url>
*/
export class RepeatItemComponent {
constructor() {
this.clickable = false;
this.nowrap = false;
this.selected = false;
this.selectable = false;
this.rowClicked = new EventEmitter();
}
get role() {
return this.selectable ? "option" : "listitem";
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: RepeatItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: RepeatItemComponent, selector: "nui-repeat-item", inputs: { clickable: "clickable", nowrap: "nowrap", selected: "selected", selectable: "selectable" }, outputs: { rowClicked: "rowClicked" }, host: { properties: { "attr.role": "role" } }, ngImport: i0, template: "<li\n class=\"nui-repeat-item\"\n [class.nui-repeat-item--selected]=\"selected\"\n [class.text-nowrap]=\"nowrap\"\n [class.nui-repeat-item--clickable]=\"clickable\"\n (click)=\"clickable ? rowClicked.emit($event) : null\"\n tabindex=\"-1\"\n>\n <div class=\"nui-repeat-item__content\">\n <ng-content></ng-content>\n </div>\n</li>\n", styles: ["body>nui-repeat-item.cdk-drag-preview .nui-repeat-item{list-style-type:none}body>nui-repeat-item.cdk-drag-preview .nui-repeat-item__controls-drag-handle{display:none}.nui .nui-repeat-item:active,.nui .nui-repeat-item:focus{outline:none}.nui .nui-repeat-item:hover{background-color:var(--nui-color-bg-secondary,#fafafa)}.nui .nui-repeat-item__content{display:flex}.nui .nui-repeat-item__controls-drag-handle{height:16px}.nui .nui-repeat-item__controls-drag-handle .nui-dnd-handle:hover{cursor:move}.nui .nui-repeat-item__controls-container{padding-left:3px}.nui .nui-repeat-item__controls-container .nui-repeat-item__checkbox .nui-checkbox{display:flex;justify-content:center;width:30px;height:30px}.nui .nui-repeat-item__controls-container .nui-repeat-item__checkbox .nui-checkbox__label:hover{background-color:transparent}.nui .nui-repeat-item__controls-container .nui-repeat-item__checkbox .nui-checkbox__transclude{margin-left:0}.nui .nui-repeat-item__content-container{min-height:30px;flex-grow:1;display:flex;align-items:center;margin-left:5px;margin-right:10px;min-width:0}.nui .nui-repeat-item__actions-container{margin-left:5px;display:flex;align-items:flex-start}.nui .nui-repeat-item__actions-container .btn-action:focus{background-color:transparent}.nui .nui-repeat-item.nui-repeat-item--clickable:not(.nui-repeat-item--selected):hover{background-color:var(--nui-color-bg-secondary,#fafafa)}.nui .nui-repeat-item.nui-repeat-item--selected{background-color:var(--nui-color-selected,rgba(0, 196, 210, .1));color:var(--nui-color-text-default,#111)}.nui .nui-repeat-item.nui-repeat-item--selected.nui-repeat-item--clickable:hover{background-color:var(--nui-color-selected-hover,rgba(0, 196, 210, .2))}\n"], encapsulation: i0.ViewEncapsulation.None }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: RepeatItemComponent, decorators: [{
type: Component,
args: [{ selector: "nui-repeat-item", encapsulation: ViewEncapsulation.None, host: { "[attr.role]": "role" }, template: "<li\n class=\"nui-repeat-item\"\n [class.nui-repeat-item--selected]=\"selected\"\n [class.text-nowrap]=\"nowrap\"\n [class.nui-repeat-item--clickable]=\"clickable\"\n (click)=\"clickable ? rowClicked.emit($event) : null\"\n tabindex=\"-1\"\n>\n <div class=\"nui-repeat-item__content\">\n <ng-content></ng-content>\n </div>\n</li>\n", styles: ["body>nui-repeat-item.cdk-drag-preview .nui-repeat-item{list-style-type:none}body>nui-repeat-item.cdk-drag-preview .nui-repeat-item__controls-drag-handle{display:none}.nui .nui-repeat-item:active,.nui .nui-repeat-item:focus{outline:none}.nui .nui-repeat-item:hover{background-color:var(--nui-color-bg-secondary,#fafafa)}.nui .nui-repeat-item__content{display:flex}.nui .nui-repeat-item__controls-drag-handle{height:16px}.nui .nui-repeat-item__controls-drag-handle .nui-dnd-handle:hover{cursor:move}.nui .nui-repeat-item__controls-container{padding-left:3px}.nui .nui-repeat-item__controls-container .nui-repeat-item__checkbox .nui-checkbox{display:flex;justify-content:center;width:30px;height:30px}.nui .nui-repeat-item__controls-container .nui-repeat-item__checkbox .nui-checkbox__label:hover{background-color:transparent}.nui .nui-repeat-item__controls-container .nui-repeat-item__checkbox .nui-checkbox__transclude{margin-left:0}.nui .nui-repeat-item__content-container{min-height:30px;flex-grow:1;display:flex;align-items:center;margin-left:5px;margin-right:10px;min-width:0}.nui .nui-repeat-item__actions-container{margin-left:5px;display:flex;align-items:flex-start}.nui .nui-repeat-item__actions-container .btn-action:focus{background-color:transparent}.nui .nui-repeat-item.nui-repeat-item--clickable:not(.nui-repeat-item--selected):hover{background-color:var(--nui-color-bg-secondary,#fafafa)}.nui .nui-repeat-item.nui-repeat-item--selected{background-color:var(--nui-color-selected,rgba(0, 196, 210, .1));color:var(--nui-color-text-default,#111)}.nui .nui-repeat-item.nui-repeat-item--selected.nui-repeat-item--clickable:hover{background-color:var(--nui-color-selected-hover,rgba(0, 196, 210, .2))}\n"] }]
}], propDecorators: { clickable: [{
type: Input
}], nowrap: [{
type: Input
}], selected: [{
type: Input
}], selectable: [{
type: Input
}], rowClicked: [{
type: Output
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicmVwZWF0LWl0ZW0uY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vc3JjL2xpYi9yZXBlYXQvcmVwZWF0LWl0ZW0vcmVwZWF0LWl0ZW0uY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vc3JjL2xpYi9yZXBlYXQvcmVwZWF0LWl0ZW0vcmVwZWF0LWl0ZW0uY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEseURBQXlEO0FBQ3pELEVBQUU7QUFDRiwrRUFBK0U7QUFDL0UsNEVBQTRFO0FBQzVFLDhFQUE4RTtBQUM5RSwrRUFBK0U7QUFDL0UsOEVBQThFO0FBQzlFLDREQUE0RDtBQUM1RCxFQUFFO0FBQ0YsNkVBQTZFO0FBQzdFLHVEQUF1RDtBQUN2RCxFQUFFO0FBQ0YsNkVBQTZFO0FBQzdFLDRFQUE0RTtBQUM1RSwrRUFBK0U7QUFDL0UsMEVBQTBFO0FBQzFFLGlGQUFpRjtBQUNqRiw2RUFBNkU7QUFDN0UsaUJBQWlCO0FBRWpCLE9BQU8sRUFDSCxTQUFTLEVBQ1QsWUFBWSxFQUNaLEtBQUssRUFDTCxNQUFNLEVBQ04saUJBQWlCLEdBQ3BCLE1BQU0sZUFBZSxDQUFDOztBQUV2Qjs7O0dBR0c7QUFRSCxNQUFNLE9BQU8sbUJBQW1CO0lBUGhDO1FBUW9CLGNBQVMsR0FBRyxLQUFLLENBQUM7UUFFbEIsV0FBTSxHQUFHLEtBQUssQ0FBQztRQUVmLGFBQVEsR0FBRyxLQUFLLENBQUM7UUFFakIsZUFBVSxHQUFHLEtBQUssQ0FBQztRQUVsQixlQUFVLEdBQUcsSUFBSSxZQUFZLEVBQWMsQ0FBQztLQUtoRTtJQUhHLElBQUksSUFBSTtRQUNKLE9BQU8sSUFBSSxDQUFDLFVBQVUsQ0FBQyxDQUFDLENBQUMsUUFBUSxDQUFDLENBQUMsQ0FBQyxVQUFVLENBQUM7SUFDbkQsQ0FBQzsrR0FiUSxtQkFBbUI7bUdBQW5CLG1CQUFtQixtUEN2Q2hDLDRXQVlBOzs0RkQyQmEsbUJBQW1CO2tCQVAvQixTQUFTOytCQUNJLGlCQUFpQixpQkFHWixpQkFBaUIsQ0FBQyxJQUFJLFFBQy9CLEVBQUUsYUFBYSxFQUFFLE1BQU0sRUFBRTs4QkFHZixTQUFTO3NCQUF4QixLQUFLO2dCQUVVLE1BQU07c0JBQXJCLEtBQUs7Z0JBRVUsUUFBUTtzQkFBdkIsS0FBSztnQkFFVSxVQUFVO3NCQUF6QixLQUFLO2dCQUVXLFVBQVU7c0JBQTFCLE1BQU0iLCJzb3VyY2VzQ29udGVudCI6WyIvLyDCqSAyMDIyIFNvbGFyV2luZHMgV29ybGR3aWRlLCBMTEMuIEFsbCByaWdodHMgcmVzZXJ2ZWQuXG4vL1xuLy8gUGVybWlzc2lvbiBpcyBoZXJlYnkgZ3JhbnRlZCwgZnJlZSBvZiBjaGFyZ2UsIHRvIGFueSBwZXJzb24gb2J0YWluaW5nIGEgY29weVxuLy8gIG9mIHRoaXMgc29mdHdhcmUgYW5kIGFzc29jaWF0ZWQgZG9jdW1lbnRhdGlvbiBmaWxlcyAodGhlIFwiU29mdHdhcmVcIiksIHRvXG4vLyAgZGVhbCBpbiB0aGUgU29mdHdhcmUgd2l0aG91dCByZXN0cmljdGlvbiwgaW5jbHVkaW5nIHdpdGhvdXQgbGltaXRhdGlvbiB0aGVcbi8vICByaWdodHMgdG8gdXNlLCBjb3B5LCBtb2RpZnksIG1lcmdlLCBwdWJsaXNoLCBkaXN0cmlidXRlLCBzdWJsaWNlbnNlLCBhbmQvb3Jcbi8vICBzZWxsIGNvcGllcyBvZiB0aGUgU29mdHdhcmUsIGFuZCB0byBwZXJtaXQgcGVyc29ucyB0byB3aG9tIHRoZSBTb2Z0d2FyZSBpc1xuLy8gIGZ1cm5pc2hlZCB0byBkbyBzbywgc3ViamVjdCB0byB0aGUgZm9sbG93aW5nIGNvbmRpdGlvbnM6XG4vL1xuLy8gVGhlIGFib3ZlIGNvcHlyaWdodCBub3RpY2UgYW5kIHRoaXMgcGVybWlzc2lvbiBub3RpY2Ugc2hhbGwgYmUgaW5jbHVkZWQgaW5cbi8vICBhbGwgY29waWVzIG9yIHN1YnN0YW50aWFsIHBvcnRpb25zIG9mIHRoZSBTb2Z0d2FyZS5cbi8vXG4vLyBUSEUgU09GVFdBUkUgSVMgUFJPVklERUQgXCJBUyBJU1wiLCBXSVRIT1VUIFdBUlJBTlRZIE9GIEFOWSBLSU5ELCBFWFBSRVNTIE9SXG4vLyAgSU1QTElFRCwgSU5DTFVESU5HIEJVVCBOT1QgTElNSVRFRCBUTyBUSEUgV0FSUkFOVElFUyBPRiBNRVJDSEFOVEFCSUxJVFksXG4vLyAgRklUTkVTUyBGT1IgQSBQQVJUSUNVTEFSIFBVUlBPU0UgQU5EIE5PTklORlJJTkdFTUVOVC4gSU4gTk8gRVZFTlQgU0hBTEwgVEhFXG4vLyAgQVVUSE9SUyBPUiBDT1BZUklHSFQgSE9MREVSUyBCRSBMSUFCTEUgRk9SIEFOWSBDTEFJTSwgREFNQUdFUyBPUiBPVEhFUlxuLy8gIExJQUJJTElUWSwgV0hFVEhFUiBJTiBBTiBBQ1RJT04gT0YgQ09OVFJBQ1QsIFRPUlQgT1IgT1RIRVJXSVNFLCBBUklTSU5HIEZST00sXG4vLyAgT1VUIE9GIE9SIElOIENPTk5FQ1RJT04gV0lUSCBUSEUgU09GVFdBUkUgT1IgVEhFIFVTRSBPUiBPVEhFUiBERUFMSU5HUyBJTlxuLy8gIFRIRSBTT0ZUV0FSRS5cblxuaW1wb3J0IHtcbiAgICBDb21wb25lbnQsXG4gICAgRXZlbnRFbWl0dGVyLFxuICAgIElucHV0LFxuICAgIE91dHB1dCxcbiAgICBWaWV3RW5jYXBzdWxhdGlvbixcbn0gZnJvbSBcIkBhbmd1bGFyL2NvcmVcIjtcblxuLyoqXG4gKiBAaWdub3JlXG4gKiA8ZXhhbXBsZS11cmw+Li8uLi9leGFtcGxlcy9pbmRleC5odG1sIy9yZXBlYXQtaXRlbTwvZXhhbXBsZS11cmw+XG4gKi9cbkBDb21wb25lbnQoe1xuICAgIHNlbGVjdG9yOiBcIm51aS1yZXBlYXQtaXRlbVwiLFxuICAgIHRlbXBsYXRlVXJsOiBcIi4vcmVwZWF0LWl0ZW0uY29tcG9uZW50Lmh0bWxcIixcbiAgICBzdHlsZVVybHM6IFtcIi4vcmVwZWF0LWl0ZW0uY29tcG9uZW50Lmxlc3NcIl0sXG4gICAgZW5jYXBzdWxhdGlvbjogVmlld0VuY2Fwc3VsYXRpb24uTm9uZSxcbiAgICBob3N0OiB7IFwiW2F0dHIucm9sZV1cIjogXCJyb2xlXCIgfSxcbn0pXG5leHBvcnQgY2xhc3MgUmVwZWF0SXRlbUNvbXBvbmVudCB7XG4gICAgQElucHV0KCkgcHVibGljIGNsaWNrYWJsZSA9IGZhbHNlO1xuXG4gICAgQElucHV0KCkgcHVibGljIG5vd3JhcCA9IGZhbHNlO1xuXG4gICAgQElucHV0KCkgcHVibGljIHNlbGVjdGVkID0gZmFsc2U7XG5cbiAgICBASW5wdXQoKSBwdWJsaWMgc2VsZWN0YWJsZSA9IGZhbHNlO1xuXG4gICAgQE91dHB1dCgpIHB1YmxpYyByb3dDbGlja2VkID0gbmV3IEV2ZW50RW1pdHRlcjxNb3VzZUV2ZW50PigpO1xuXG4gICAgZ2V0IHJvbGUoKTogc3RyaW5nIHtcbiAgICAgICAgcmV0dXJuIHRoaXMuc2VsZWN0YWJsZSA/IFwib3B0aW9uXCIgOiBcImxpc3RpdGVtXCI7XG4gICAgfVxufVxuIiwiPGxpXG4gICAgY2xhc3M9XCJudWktcmVwZWF0LWl0ZW1cIlxuICAgIFtjbGFzcy5udWktcmVwZWF0LWl0ZW0tLXNlbGVjdGVkXT1cInNlbGVjdGVkXCJcbiAgICBbY2xhc3MudGV4dC1ub3dyYXBdPVwibm93cmFwXCJcbiAgICBbY2xhc3MubnVpLXJlcGVhdC1pdGVtLS1jbGlja2FibGVdPVwiY2xpY2thYmxlXCJcbiAgICAoY2xpY2spPVwiY2xpY2thYmxlID8gcm93Q2xpY2tlZC5lbWl0KCRldmVudCkgOiBudWxsXCJcbiAgICB0YWJpbmRleD1cIi0xXCJcbj5cbiAgICA8ZGl2IGNsYXNzPVwibnVpLXJlcGVhdC1pdGVtX19jb250ZW50XCI+XG4gICAgICAgIDxuZy1jb250ZW50PjwvbmctY29udGVudD5cbiAgICA8L2Rpdj5cbjwvbGk+XG4iXX0=