@rivet-health/design-system 27.2.1 → 27.2.2
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/esm2020/lib/input/search/search.component.mjs +3 -3
- package/esm2020/lib/table/table/table-search-columns/table-search-columns.component.mjs +2 -2
- package/fesm2015/rivet-health-design-system.mjs +4 -4
- package/fesm2015/rivet-health-design-system.mjs.map +1 -1
- package/fesm2020/rivet-health-design-system.mjs +4 -4
- package/fesm2020/rivet-health-design-system.mjs.map +1 -1
- package/package.json +1 -1
|
@@ -12,10 +12,10 @@ export class SearchComponent extends TextFieldComponent {
|
|
|
12
12
|
}
|
|
13
13
|
}
|
|
14
14
|
SearchComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SearchComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
15
|
-
SearchComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: SearchComponent, selector: "riv-search", inputs: { placeholder: "placeholder", name: "name", labelTemplate: "labelTemplate" }, usesInheritance: true, ngImport: i0, template: "<input\n #input\n [id]=\"name\"\n [name]=\"name\"\n [placeholder]=\"placeholder\"\n [type]=\"type\"\n [required]=\"required\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [value]=\"text\"\n (input)=\"text = input.value\"\n [class.large]=\"size === 'large'\"\n [attr.maxlength]=\"maxLength\"\n [attr.minlength]=\"minLength\"\n [class.warning]=\"state === 'warning'\"\n [class.error]=\"state === 'error'\"\n [riv-auto-focus]=\"autoFocus\"\n autocomplete=\"off\"\n autocorrect=\"off\"\n autocapitalize=\"off\"\n spellcheck=\"false\"\n (blur)=\"inputBlur()\"\n/>\n<div class=\"label\">\n <label [for]=\"name\" [class.close]=\"!!text\" (click)=\"text = ''\">\n <riv-icon\n *ngIf=\"!labelTemplate\"\n [name]=\"!!text ? 'X' : 'Search'\"\n [size]=\"20\"\n ></riv-icon>\n <riv-icon\n *ngIf=\"labelTemplate && !!text\"\n [name]=\"'X'\"\n [size]=\"20\"\n ></riv-icon>\n </label>\n <ng-container *ngIf=\"labelTemplate\" class=\"search-columns\"\n ><ng-template [ngTemplateOutlet]=\"labelTemplate\"></ng-template\n ></ng-container>\n</div>\n", styles: ["input{width:100%;border:var(--border-width) solid var(--border-light);border-radius:var(--border-radius-small);font:var(--input-medium);color:var(--type-light-high-contrast);padding:var(--size-small) var(--size-medium)}input::placeholder{color:var(--type-light-disabled)}input:disabled{color:var(--type-light-disabled);background-color:var(--surface-light-1)}input:read-only{background-color:var(--surface-light-1)}input:focus{outline:none;border:var(--border-width) solid var(--purp-60)}input.warning{border-color:var(--surface-dark-caution)}input.error{border-color:var(--surface-dark-danger)}input.small{font:var(--input-small);padding:var(--size-small) var(--size-medium)}input.large{font:var(--input-large);padding:var(--size-medium)}\n", ":host{position:relative}input{padding-right:calc(var(--size-xlarge) + var(--size-xsmall))}.label{position:absolute;top:0;right:0;bottom:0;color:var(--type-light-low-contrast);display:flex;align-items:center;justify-content:center;padding-right:var(--size-xsmall)}.label label{color:var(--type-light-low-contrast);display:flex;align-items:center;justify-content:center}label.close{color:var(--type-light-high-contrast)}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.AutoFocusDirective, selector: "[riv-auto-focus]", inputs: ["riv-auto-focus"] }, { kind: "component", type: i3.IconComponent, selector: "riv-icon", inputs: ["name", "size", "customSize", "strokeWidth"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
15
|
+
SearchComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: SearchComponent, selector: "riv-search", inputs: { placeholder: "placeholder", name: "name", labelTemplate: "labelTemplate" }, usesInheritance: true, ngImport: i0, template: "<input\n #input\n [id]=\"name\"\n [name]=\"name\"\n [placeholder]=\"placeholder\"\n [type]=\"type\"\n [required]=\"required\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [value]=\"text\"\n (input)=\"text = input.value\"\n [class.large]=\"size === 'large'\"\n [attr.maxlength]=\"maxLength\"\n [attr.minlength]=\"minLength\"\n [class.warning]=\"state === 'warning'\"\n [class.error]=\"state === 'error'\"\n [riv-auto-focus]=\"autoFocus\"\n autocomplete=\"off\"\n autocorrect=\"off\"\n autocapitalize=\"off\"\n spellcheck=\"false\"\n (blur)=\"inputBlur()\"\n/>\n<div class=\"label\">\n <label [for]=\"name\" [class.close]=\"!!text\" (click)=\"text = ''\">\n <riv-icon\n *ngIf=\"!labelTemplate\"\n [class.clickable]=\"!!text\"\n [name]=\"!!text ? 'X' : 'Search'\"\n [size]=\"20\"\n ></riv-icon>\n <riv-icon\n *ngIf=\"labelTemplate && !!text\"\n class=\"clickable\"\n [name]=\"'X'\"\n [size]=\"20\"\n ></riv-icon>\n </label>\n <ng-container *ngIf=\"labelTemplate\" class=\"search-columns\"\n ><ng-template [ngTemplateOutlet]=\"labelTemplate\"></ng-template\n ></ng-container>\n</div>\n", styles: ["input{width:100%;border:var(--border-width) solid var(--border-light);border-radius:var(--border-radius-small);font:var(--input-medium);color:var(--type-light-high-contrast);padding:var(--size-small) var(--size-medium)}input::placeholder{color:var(--type-light-disabled)}input:disabled{color:var(--type-light-disabled);background-color:var(--surface-light-1)}input:read-only{background-color:var(--surface-light-1)}input:focus{outline:none;border:var(--border-width) solid var(--purp-60)}input.warning{border-color:var(--surface-dark-caution)}input.error{border-color:var(--surface-dark-danger)}input.small{font:var(--input-small);padding:var(--size-small) var(--size-medium)}input.large{font:var(--input-large);padding:var(--size-medium)}\n", ":host{position:relative}input{padding-right:calc(var(--size-xlarge) + var(--size-xsmall))}.label{position:absolute;top:0;right:0;bottom:0;color:var(--type-light-low-contrast);display:flex;align-items:center;justify-content:center;padding-right:var(--size-xsmall)}.label label{color:var(--type-light-low-contrast);display:flex;align-items:center;justify-content:center}label.close{color:var(--type-light-high-contrast)}.clickable:hover{background-color:var(--black-20);cursor:pointer;transition:background-color var(--short-transition)}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.AutoFocusDirective, selector: "[riv-auto-focus]", inputs: ["riv-auto-focus"] }, { kind: "component", type: i3.IconComponent, selector: "riv-icon", inputs: ["name", "size", "customSize", "strokeWidth"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
16
16
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SearchComponent, decorators: [{
|
|
17
17
|
type: Component,
|
|
18
|
-
args: [{ selector: 'riv-search', changeDetection: ChangeDetectionStrategy.OnPush, template: "<input\n #input\n [id]=\"name\"\n [name]=\"name\"\n [placeholder]=\"placeholder\"\n [type]=\"type\"\n [required]=\"required\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [value]=\"text\"\n (input)=\"text = input.value\"\n [class.large]=\"size === 'large'\"\n [attr.maxlength]=\"maxLength\"\n [attr.minlength]=\"minLength\"\n [class.warning]=\"state === 'warning'\"\n [class.error]=\"state === 'error'\"\n [riv-auto-focus]=\"autoFocus\"\n autocomplete=\"off\"\n autocorrect=\"off\"\n autocapitalize=\"off\"\n spellcheck=\"false\"\n (blur)=\"inputBlur()\"\n/>\n<div class=\"label\">\n <label [for]=\"name\" [class.close]=\"!!text\" (click)=\"text = ''\">\n <riv-icon\n *ngIf=\"!labelTemplate\"\n [name]=\"!!text ? 'X' : 'Search'\"\n [size]=\"20\"\n ></riv-icon>\n <riv-icon\n *ngIf=\"labelTemplate && !!text\"\n [name]=\"'X'\"\n [size]=\"20\"\n ></riv-icon>\n </label>\n <ng-container *ngIf=\"labelTemplate\" class=\"search-columns\"\n ><ng-template [ngTemplateOutlet]=\"labelTemplate\"></ng-template\n ></ng-container>\n</div>\n", styles: ["input{width:100%;border:var(--border-width) solid var(--border-light);border-radius:var(--border-radius-small);font:var(--input-medium);color:var(--type-light-high-contrast);padding:var(--size-small) var(--size-medium)}input::placeholder{color:var(--type-light-disabled)}input:disabled{color:var(--type-light-disabled);background-color:var(--surface-light-1)}input:read-only{background-color:var(--surface-light-1)}input:focus{outline:none;border:var(--border-width) solid var(--purp-60)}input.warning{border-color:var(--surface-dark-caution)}input.error{border-color:var(--surface-dark-danger)}input.small{font:var(--input-small);padding:var(--size-small) var(--size-medium)}input.large{font:var(--input-large);padding:var(--size-medium)}\n", ":host{position:relative}input{padding-right:calc(var(--size-xlarge) + var(--size-xsmall))}.label{position:absolute;top:0;right:0;bottom:0;color:var(--type-light-low-contrast);display:flex;align-items:center;justify-content:center;padding-right:var(--size-xsmall)}.label label{color:var(--type-light-low-contrast);display:flex;align-items:center;justify-content:center}label.close{color:var(--type-light-high-contrast)}\n"] }]
|
|
18
|
+
args: [{ selector: 'riv-search', changeDetection: ChangeDetectionStrategy.OnPush, template: "<input\n #input\n [id]=\"name\"\n [name]=\"name\"\n [placeholder]=\"placeholder\"\n [type]=\"type\"\n [required]=\"required\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [value]=\"text\"\n (input)=\"text = input.value\"\n [class.large]=\"size === 'large'\"\n [attr.maxlength]=\"maxLength\"\n [attr.minlength]=\"minLength\"\n [class.warning]=\"state === 'warning'\"\n [class.error]=\"state === 'error'\"\n [riv-auto-focus]=\"autoFocus\"\n autocomplete=\"off\"\n autocorrect=\"off\"\n autocapitalize=\"off\"\n spellcheck=\"false\"\n (blur)=\"inputBlur()\"\n/>\n<div class=\"label\">\n <label [for]=\"name\" [class.close]=\"!!text\" (click)=\"text = ''\">\n <riv-icon\n *ngIf=\"!labelTemplate\"\n [class.clickable]=\"!!text\"\n [name]=\"!!text ? 'X' : 'Search'\"\n [size]=\"20\"\n ></riv-icon>\n <riv-icon\n *ngIf=\"labelTemplate && !!text\"\n class=\"clickable\"\n [name]=\"'X'\"\n [size]=\"20\"\n ></riv-icon>\n </label>\n <ng-container *ngIf=\"labelTemplate\" class=\"search-columns\"\n ><ng-template [ngTemplateOutlet]=\"labelTemplate\"></ng-template\n ></ng-container>\n</div>\n", styles: ["input{width:100%;border:var(--border-width) solid var(--border-light);border-radius:var(--border-radius-small);font:var(--input-medium);color:var(--type-light-high-contrast);padding:var(--size-small) var(--size-medium)}input::placeholder{color:var(--type-light-disabled)}input:disabled{color:var(--type-light-disabled);background-color:var(--surface-light-1)}input:read-only{background-color:var(--surface-light-1)}input:focus{outline:none;border:var(--border-width) solid var(--purp-60)}input.warning{border-color:var(--surface-dark-caution)}input.error{border-color:var(--surface-dark-danger)}input.small{font:var(--input-small);padding:var(--size-small) var(--size-medium)}input.large{font:var(--input-large);padding:var(--size-medium)}\n", ":host{position:relative}input{padding-right:calc(var(--size-xlarge) + var(--size-xsmall))}.label{position:absolute;top:0;right:0;bottom:0;color:var(--type-light-low-contrast);display:flex;align-items:center;justify-content:center;padding-right:var(--size-xsmall)}.label label{color:var(--type-light-low-contrast);display:flex;align-items:center;justify-content:center}label.close{color:var(--type-light-high-contrast)}.clickable:hover{background-color:var(--black-20);cursor:pointer;transition:background-color var(--short-transition)}\n"] }]
|
|
19
19
|
}], propDecorators: { placeholder: [{
|
|
20
20
|
type: Input
|
|
21
21
|
}], name: [{
|
|
@@ -23,4 +23,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
23
23
|
}], labelTemplate: [{
|
|
24
24
|
type: Input
|
|
25
25
|
}] } });
|
|
26
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
26
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2VhcmNoLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL3Jpdi9zcmMvbGliL2lucHV0L3NlYXJjaC9zZWFyY2guY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvcml2L3NyYy9saWIvaW5wdXQvc2VhcmNoL3NlYXJjaC5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQ0wsdUJBQXVCLEVBQ3ZCLFNBQVMsRUFDVCxLQUFLLEdBRU4sTUFBTSxlQUFlLENBQUM7QUFDdkIsT0FBTyxFQUFFLGtCQUFrQixFQUFFLE1BQU0sb0NBQW9DLENBQUM7Ozs7O0FBV3hFLE1BQU0sT0FBTyxlQUFnQixTQUFRLGtCQUFrQjtJQVR2RDs7UUFXVyxnQkFBVyxHQUFXLFFBQVEsQ0FBQztRQUcvQixTQUFJLEdBQVcsUUFBUSxDQUFDO0tBSWxDOzs0R0FUWSxlQUFlO2dHQUFmLGVBQWUsK0pDakI1QixvcENBMENBOzJGRHpCYSxlQUFlO2tCQVQzQixTQUFTOytCQUNFLFlBQVksbUJBTUwsdUJBQXVCLENBQUMsTUFBTTs4QkFJdEMsV0FBVztzQkFEbkIsS0FBSztnQkFJRyxJQUFJO3NCQURaLEtBQUs7Z0JBSU4sYUFBYTtzQkFEWixLQUFLIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtcbiAgQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3ksXG4gIENvbXBvbmVudCxcbiAgSW5wdXQsXG4gIFRlbXBsYXRlUmVmLFxufSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IFRleHRGaWVsZENvbXBvbmVudCB9IGZyb20gJy4uL3RleHQtZmllbGQvdGV4dC1maWVsZC5jb21wb25lbnQnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdyaXYtc2VhcmNoJyxcbiAgdGVtcGxhdGVVcmw6ICcuL3NlYXJjaC5jb21wb25lbnQuaHRtbCcsXG4gIHN0eWxlVXJsczogW1xuICAgICcuLi90ZXh0LWZpZWxkL3RleHQtZmllbGQuY29tcG9uZW50LmNzcycsXG4gICAgJy4vc2VhcmNoLmNvbXBvbmVudC5jc3MnLFxuICBdLFxuICBjaGFuZ2VEZXRlY3Rpb246IENoYW5nZURldGVjdGlvblN0cmF0ZWd5Lk9uUHVzaCxcbn0pXG5leHBvcnQgY2xhc3MgU2VhcmNoQ29tcG9uZW50IGV4dGVuZHMgVGV4dEZpZWxkQ29tcG9uZW50IHtcbiAgQElucHV0KClcbiAgb3ZlcnJpZGUgcGxhY2Vob2xkZXI6IHN0cmluZyA9ICdTZWFyY2gnO1xuXG4gIEBJbnB1dCgpXG4gIG92ZXJyaWRlIG5hbWU6IHN0cmluZyA9ICdzZWFyY2gnO1xuXG4gIEBJbnB1dCgpXG4gIGxhYmVsVGVtcGxhdGU/OiBUZW1wbGF0ZVJlZjx2b2lkPjtcbn1cbiIsIjxpbnB1dFxuICAjaW5wdXRcbiAgW2lkXT1cIm5hbWVcIlxuICBbbmFtZV09XCJuYW1lXCJcbiAgW3BsYWNlaG9sZGVyXT1cInBsYWNlaG9sZGVyXCJcbiAgW3R5cGVdPVwidHlwZVwiXG4gIFtyZXF1aXJlZF09XCJyZXF1aXJlZFwiXG4gIFtkaXNhYmxlZF09XCJkaXNhYmxlZFwiXG4gIFtyZWFkb25seV09XCJyZWFkb25seVwiXG4gIFt2YWx1ZV09XCJ0ZXh0XCJcbiAgKGlucHV0KT1cInRleHQgPSBpbnB1dC52YWx1ZVwiXG4gIFtjbGFzcy5sYXJnZV09XCJzaXplID09PSAnbGFyZ2UnXCJcbiAgW2F0dHIubWF4bGVuZ3RoXT1cIm1heExlbmd0aFwiXG4gIFthdHRyLm1pbmxlbmd0aF09XCJtaW5MZW5ndGhcIlxuICBbY2xhc3Mud2FybmluZ109XCJzdGF0ZSA9PT0gJ3dhcm5pbmcnXCJcbiAgW2NsYXNzLmVycm9yXT1cInN0YXRlID09PSAnZXJyb3InXCJcbiAgW3Jpdi1hdXRvLWZvY3VzXT1cImF1dG9Gb2N1c1wiXG4gIGF1dG9jb21wbGV0ZT1cIm9mZlwiXG4gIGF1dG9jb3JyZWN0PVwib2ZmXCJcbiAgYXV0b2NhcGl0YWxpemU9XCJvZmZcIlxuICBzcGVsbGNoZWNrPVwiZmFsc2VcIlxuICAoYmx1cik9XCJpbnB1dEJsdXIoKVwiXG4vPlxuPGRpdiBjbGFzcz1cImxhYmVsXCI+XG4gIDxsYWJlbCBbZm9yXT1cIm5hbWVcIiBbY2xhc3MuY2xvc2VdPVwiISF0ZXh0XCIgKGNsaWNrKT1cInRleHQgPSAnJ1wiPlxuICAgIDxyaXYtaWNvblxuICAgICAgKm5nSWY9XCIhbGFiZWxUZW1wbGF0ZVwiXG4gICAgICBbY2xhc3MuY2xpY2thYmxlXT1cIiEhdGV4dFwiXG4gICAgICBbbmFtZV09XCIhIXRleHQgPyAnWCcgOiAnU2VhcmNoJ1wiXG4gICAgICBbc2l6ZV09XCIyMFwiXG4gICAgPjwvcml2LWljb24+XG4gICAgPHJpdi1pY29uXG4gICAgICAqbmdJZj1cImxhYmVsVGVtcGxhdGUgJiYgISF0ZXh0XCJcbiAgICAgIGNsYXNzPVwiY2xpY2thYmxlXCJcbiAgICAgIFtuYW1lXT1cIidYJ1wiXG4gICAgICBbc2l6ZV09XCIyMFwiXG4gICAgPjwvcml2LWljb24+XG4gIDwvbGFiZWw+XG4gIDxuZy1jb250YWluZXIgKm5nSWY9XCJsYWJlbFRlbXBsYXRlXCIgY2xhc3M9XCJzZWFyY2gtY29sdW1uc1wiXG4gICAgPjxuZy10ZW1wbGF0ZSBbbmdUZW1wbGF0ZU91dGxldF09XCJsYWJlbFRlbXBsYXRlXCI+PC9uZy10ZW1wbGF0ZVxuICA+PC9uZy1jb250YWluZXI+XG48L2Rpdj5cbiJdfQ==
|
|
@@ -45,10 +45,10 @@ export class TableSearchColumnsComponent {
|
|
|
45
45
|
}
|
|
46
46
|
}
|
|
47
47
|
TableSearchColumnsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: TableSearchColumnsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
48
|
-
TableSearchColumnsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: TableSearchColumnsComponent, selector: "riv-table-search-columns", inputs: { manager: "manager", disabled: "disabled" }, ngImport: i0, template: "<ng-container *ngIf=\"columnList | async; let s\">\n <button #trigger class=\"trigger-button\" (click)=\"open.next(true)\">\n <riv-icon [name]=\"'MoreVertical'\" [size]=\"16\"></riv-icon>\n </button>\n <ng-container *ngIf=\"open | async\">\n <riv-callout\n *riv-overlay\n [anchor]=\"trigger\"\n [showCaret]=\"false\"\n [preferredPosition]=\"'bottom-left'\"\n [theme]=\"'light'\"\n (close)=\"open.next(false)\"\n >\n <div class=\"content-body\">\n <div class=\"header-container\">\n <riv-help\n [size]=\"12\"\n [help]=\"'Toggle which columns are included in table search results'\"\n ></riv-help\n ><span class=\"header-text\">Search in</span>\n </div>\n\n <ng-container\n [ngTemplateOutlet]=\"optionList\"\n [ngTemplateOutletContext]=\"{ columns: s.activeSearchColumns }\"\n ></ng-container>\n\n <div *ngIf=\"s.hiddenSearchColumns.length > 0\" class=\"column-header\">\n Hidden columns\n </div>\n\n <ng-container\n *ngIf=\"s.hiddenSearchColumns.length > 0\"\n [ngTemplateOutlet]=\"optionList\"\n [ngTemplateOutletContext]=\"{ columns: s.hiddenSearchColumns }\"\n ></ng-container>\n\n <ng-template #optionList let-columns=\"columns\">\n <ng-container *ngFor=\"let column of columns\">\n <ng-container\n [ngTemplateOutlet]=\"option\"\n [ngTemplateOutletContext]=\"{ node: column }\"\n ></ng-container>\n </ng-container>\n </ng-template>\n\n <ng-template #option let-node=\"node\">\n <div class=\"node-container\">\n <span class=\"node-text\">{{ node.title }}</span>\n <riv-switch-checkbox\n [size]=\"'small'\"\n [value]=\"node.searchEnabled\"\n [disabled]=\"s.searchEnabledCount === 1 && node.searchEnabled\"\n [rivTooltip]=\"\n s.searchEnabledCount === 1 && node.searchEnabled\n ? 'At least one search field is required'\n : undefined\n \"\n (valueChange)=\"updateColumns(node.id, $event)\"\n ></riv-switch-checkbox>\n </div>\n </ng-template>\n </div>\n </riv-callout>\n </ng-container>\n</ng-container>\n", styles: [".node-container{display:flex;justify-content:space-between;margin:var(--size-small) var(--size-medium)}.node-text{font:var(--input-medium)}.header-container{margin:calc(var(--base-grid-size) * .75) var(--size-medium);padding-bottom:var(--size-small)}.header-text{font:var(--input-medium);margin-left:var(--size-small)}.footer-container{display:flex;justify-content:end}.trigger-button{margin-top:var(--size-small);
|
|
48
|
+
TableSearchColumnsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: TableSearchColumnsComponent, selector: "riv-table-search-columns", inputs: { manager: "manager", disabled: "disabled" }, ngImport: i0, template: "<ng-container *ngIf=\"columnList | async; let s\">\n <button #trigger class=\"trigger-button\" (click)=\"open.next(true)\">\n <riv-icon [name]=\"'MoreVertical'\" [size]=\"16\"></riv-icon>\n </button>\n <ng-container *ngIf=\"open | async\">\n <riv-callout\n *riv-overlay\n [anchor]=\"trigger\"\n [showCaret]=\"false\"\n [preferredPosition]=\"'bottom-left'\"\n [theme]=\"'light'\"\n (close)=\"open.next(false)\"\n >\n <div class=\"content-body\">\n <div class=\"header-container\">\n <riv-help\n [size]=\"12\"\n [help]=\"'Toggle which columns are included in table search results'\"\n ></riv-help\n ><span class=\"header-text\">Search in</span>\n </div>\n\n <ng-container\n [ngTemplateOutlet]=\"optionList\"\n [ngTemplateOutletContext]=\"{ columns: s.activeSearchColumns }\"\n ></ng-container>\n\n <div *ngIf=\"s.hiddenSearchColumns.length > 0\" class=\"column-header\">\n Hidden columns\n </div>\n\n <ng-container\n *ngIf=\"s.hiddenSearchColumns.length > 0\"\n [ngTemplateOutlet]=\"optionList\"\n [ngTemplateOutletContext]=\"{ columns: s.hiddenSearchColumns }\"\n ></ng-container>\n\n <ng-template #optionList let-columns=\"columns\">\n <ng-container *ngFor=\"let column of columns\">\n <ng-container\n [ngTemplateOutlet]=\"option\"\n [ngTemplateOutletContext]=\"{ node: column }\"\n ></ng-container>\n </ng-container>\n </ng-template>\n\n <ng-template #option let-node=\"node\">\n <div class=\"node-container\">\n <span class=\"node-text\">{{ node.title }}</span>\n <riv-switch-checkbox\n [size]=\"'small'\"\n [value]=\"node.searchEnabled\"\n [disabled]=\"s.searchEnabledCount === 1 && node.searchEnabled\"\n [rivTooltip]=\"\n s.searchEnabledCount === 1 && node.searchEnabled\n ? 'At least one search field is required'\n : undefined\n \"\n (valueChange)=\"updateColumns(node.id, $event)\"\n ></riv-switch-checkbox>\n </div>\n </ng-template>\n </div>\n </riv-callout>\n </ng-container>\n</ng-container>\n", styles: [".node-container{display:flex;justify-content:space-between;margin:var(--size-small) var(--size-medium)}.node-text{font:var(--input-medium)}.header-container{margin:calc(var(--base-grid-size) * .75) var(--size-medium);padding-bottom:var(--size-small)}.header-text{font:var(--input-medium);margin-left:var(--size-small)}.footer-container{display:flex;justify-content:end}.trigger-button{margin-top:var(--size-small);border-radius:var(--border-radius-small)}.trigger-button:hover{background-color:var(--black-20);cursor:pointer;transition:background-color var(--short-transition)}.column-header{margin:var(--size-small) var(--size-medium);font:var(--input-medium);color:var(--type-light-low-contrast)}.content-body{display:flex;max-height:50vh;overflow-y:auto;flex-direction:column;align-items:stretch;gap:var(--size-small);padding:var(--size-large);min-width:calc(var(--base-grid-size) * 75)}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2.CalloutComponent, selector: "riv-callout", inputs: ["anchor", "isModal", "preferredPosition", "allowedPositions", "fallbackDirection", "showCaret", "theme"], outputs: ["close"] }, { kind: "component", type: i3.HelpComponent, selector: "riv-help", inputs: ["help", "size"] }, { kind: "component", type: i4.IconComponent, selector: "riv-icon", inputs: ["name", "size", "customSize", "strokeWidth"] }, { kind: "directive", type: i5.OverlayDirective, selector: "[riv-overlay]" }, { kind: "component", type: i6.SwitchCheckboxComponent, selector: "riv-switch-checkbox", inputs: ["size"] }, { kind: "directive", type: i7.TooltipDirective, selector: "[rivTooltip]", inputs: ["rivTooltip", "rivTooltipTheme", "rivTooltipMaxWidth", "rivTooltipPreferredPosition", "rivTooltipCloseDelay"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
49
49
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: TableSearchColumnsComponent, decorators: [{
|
|
50
50
|
type: Component,
|
|
51
|
-
args: [{ selector: 'riv-table-search-columns', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"columnList | async; let s\">\n <button #trigger class=\"trigger-button\" (click)=\"open.next(true)\">\n <riv-icon [name]=\"'MoreVertical'\" [size]=\"16\"></riv-icon>\n </button>\n <ng-container *ngIf=\"open | async\">\n <riv-callout\n *riv-overlay\n [anchor]=\"trigger\"\n [showCaret]=\"false\"\n [preferredPosition]=\"'bottom-left'\"\n [theme]=\"'light'\"\n (close)=\"open.next(false)\"\n >\n <div class=\"content-body\">\n <div class=\"header-container\">\n <riv-help\n [size]=\"12\"\n [help]=\"'Toggle which columns are included in table search results'\"\n ></riv-help\n ><span class=\"header-text\">Search in</span>\n </div>\n\n <ng-container\n [ngTemplateOutlet]=\"optionList\"\n [ngTemplateOutletContext]=\"{ columns: s.activeSearchColumns }\"\n ></ng-container>\n\n <div *ngIf=\"s.hiddenSearchColumns.length > 0\" class=\"column-header\">\n Hidden columns\n </div>\n\n <ng-container\n *ngIf=\"s.hiddenSearchColumns.length > 0\"\n [ngTemplateOutlet]=\"optionList\"\n [ngTemplateOutletContext]=\"{ columns: s.hiddenSearchColumns }\"\n ></ng-container>\n\n <ng-template #optionList let-columns=\"columns\">\n <ng-container *ngFor=\"let column of columns\">\n <ng-container\n [ngTemplateOutlet]=\"option\"\n [ngTemplateOutletContext]=\"{ node: column }\"\n ></ng-container>\n </ng-container>\n </ng-template>\n\n <ng-template #option let-node=\"node\">\n <div class=\"node-container\">\n <span class=\"node-text\">{{ node.title }}</span>\n <riv-switch-checkbox\n [size]=\"'small'\"\n [value]=\"node.searchEnabled\"\n [disabled]=\"s.searchEnabledCount === 1 && node.searchEnabled\"\n [rivTooltip]=\"\n s.searchEnabledCount === 1 && node.searchEnabled\n ? 'At least one search field is required'\n : undefined\n \"\n (valueChange)=\"updateColumns(node.id, $event)\"\n ></riv-switch-checkbox>\n </div>\n </ng-template>\n </div>\n </riv-callout>\n </ng-container>\n</ng-container>\n", styles: [".node-container{display:flex;justify-content:space-between;margin:var(--size-small) var(--size-medium)}.node-text{font:var(--input-medium)}.header-container{margin:calc(var(--base-grid-size) * .75) var(--size-medium);padding-bottom:var(--size-small)}.header-text{font:var(--input-medium);margin-left:var(--size-small)}.footer-container{display:flex;justify-content:end}.trigger-button{margin-top:var(--size-small);
|
|
51
|
+
args: [{ selector: 'riv-table-search-columns', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"columnList | async; let s\">\n <button #trigger class=\"trigger-button\" (click)=\"open.next(true)\">\n <riv-icon [name]=\"'MoreVertical'\" [size]=\"16\"></riv-icon>\n </button>\n <ng-container *ngIf=\"open | async\">\n <riv-callout\n *riv-overlay\n [anchor]=\"trigger\"\n [showCaret]=\"false\"\n [preferredPosition]=\"'bottom-left'\"\n [theme]=\"'light'\"\n (close)=\"open.next(false)\"\n >\n <div class=\"content-body\">\n <div class=\"header-container\">\n <riv-help\n [size]=\"12\"\n [help]=\"'Toggle which columns are included in table search results'\"\n ></riv-help\n ><span class=\"header-text\">Search in</span>\n </div>\n\n <ng-container\n [ngTemplateOutlet]=\"optionList\"\n [ngTemplateOutletContext]=\"{ columns: s.activeSearchColumns }\"\n ></ng-container>\n\n <div *ngIf=\"s.hiddenSearchColumns.length > 0\" class=\"column-header\">\n Hidden columns\n </div>\n\n <ng-container\n *ngIf=\"s.hiddenSearchColumns.length > 0\"\n [ngTemplateOutlet]=\"optionList\"\n [ngTemplateOutletContext]=\"{ columns: s.hiddenSearchColumns }\"\n ></ng-container>\n\n <ng-template #optionList let-columns=\"columns\">\n <ng-container *ngFor=\"let column of columns\">\n <ng-container\n [ngTemplateOutlet]=\"option\"\n [ngTemplateOutletContext]=\"{ node: column }\"\n ></ng-container>\n </ng-container>\n </ng-template>\n\n <ng-template #option let-node=\"node\">\n <div class=\"node-container\">\n <span class=\"node-text\">{{ node.title }}</span>\n <riv-switch-checkbox\n [size]=\"'small'\"\n [value]=\"node.searchEnabled\"\n [disabled]=\"s.searchEnabledCount === 1 && node.searchEnabled\"\n [rivTooltip]=\"\n s.searchEnabledCount === 1 && node.searchEnabled\n ? 'At least one search field is required'\n : undefined\n \"\n (valueChange)=\"updateColumns(node.id, $event)\"\n ></riv-switch-checkbox>\n </div>\n </ng-template>\n </div>\n </riv-callout>\n </ng-container>\n</ng-container>\n", styles: [".node-container{display:flex;justify-content:space-between;margin:var(--size-small) var(--size-medium)}.node-text{font:var(--input-medium)}.header-container{margin:calc(var(--base-grid-size) * .75) var(--size-medium);padding-bottom:var(--size-small)}.header-text{font:var(--input-medium);margin-left:var(--size-small)}.footer-container{display:flex;justify-content:end}.trigger-button{margin-top:var(--size-small);border-radius:var(--border-radius-small)}.trigger-button:hover{background-color:var(--black-20);cursor:pointer;transition:background-color var(--short-transition)}.column-header{margin:var(--size-small) var(--size-medium);font:var(--input-medium);color:var(--type-light-low-contrast)}.content-body{display:flex;max-height:50vh;overflow-y:auto;flex-direction:column;align-items:stretch;gap:var(--size-small);padding:var(--size-large);min-width:calc(var(--base-grid-size) * 75)}\n"] }]
|
|
52
52
|
}], propDecorators: { manager: [{
|
|
53
53
|
type: Input
|
|
54
54
|
}], disabled: [{
|
|
@@ -2319,10 +2319,10 @@ class SearchComponent extends TextFieldComponent {
|
|
|
2319
2319
|
}
|
|
2320
2320
|
}
|
|
2321
2321
|
SearchComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SearchComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
2322
|
-
SearchComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: SearchComponent, selector: "riv-search", inputs: { placeholder: "placeholder", name: "name", labelTemplate: "labelTemplate" }, usesInheritance: true, ngImport: i0, template: "<input\n #input\n [id]=\"name\"\n [name]=\"name\"\n [placeholder]=\"placeholder\"\n [type]=\"type\"\n [required]=\"required\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [value]=\"text\"\n (input)=\"text = input.value\"\n [class.large]=\"size === 'large'\"\n [attr.maxlength]=\"maxLength\"\n [attr.minlength]=\"minLength\"\n [class.warning]=\"state === 'warning'\"\n [class.error]=\"state === 'error'\"\n [riv-auto-focus]=\"autoFocus\"\n autocomplete=\"off\"\n autocorrect=\"off\"\n autocapitalize=\"off\"\n spellcheck=\"false\"\n (blur)=\"inputBlur()\"\n/>\n<div class=\"label\">\n <label [for]=\"name\" [class.close]=\"!!text\" (click)=\"text = ''\">\n <riv-icon\n *ngIf=\"!labelTemplate\"\n [name]=\"!!text ? 'X' : 'Search'\"\n [size]=\"20\"\n ></riv-icon>\n <riv-icon\n *ngIf=\"labelTemplate && !!text\"\n [name]=\"'X'\"\n [size]=\"20\"\n ></riv-icon>\n </label>\n <ng-container *ngIf=\"labelTemplate\" class=\"search-columns\"\n ><ng-template [ngTemplateOutlet]=\"labelTemplate\"></ng-template\n ></ng-container>\n</div>\n", styles: ["input{width:100%;border:var(--border-width) solid var(--border-light);border-radius:var(--border-radius-small);font:var(--input-medium);color:var(--type-light-high-contrast);padding:var(--size-small) var(--size-medium)}input::placeholder{color:var(--type-light-disabled)}input:disabled{color:var(--type-light-disabled);background-color:var(--surface-light-1)}input:read-only{background-color:var(--surface-light-1)}input:focus{outline:none;border:var(--border-width) solid var(--purp-60)}input.warning{border-color:var(--surface-dark-caution)}input.error{border-color:var(--surface-dark-danger)}input.small{font:var(--input-small);padding:var(--size-small) var(--size-medium)}input.large{font:var(--input-large);padding:var(--size-medium)}\n", ":host{position:relative}input{padding-right:calc(var(--size-xlarge) + var(--size-xsmall))}.label{position:absolute;top:0;right:0;bottom:0;color:var(--type-light-low-contrast);display:flex;align-items:center;justify-content:center;padding-right:var(--size-xsmall)}.label label{color:var(--type-light-low-contrast);display:flex;align-items:center;justify-content:center}label.close{color:var(--type-light-high-contrast)}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: AutoFocusDirective, selector: "[riv-auto-focus]", inputs: ["riv-auto-focus"] }, { kind: "component", type: IconComponent, selector: "riv-icon", inputs: ["name", "size", "customSize", "strokeWidth"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2322
|
+
SearchComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: SearchComponent, selector: "riv-search", inputs: { placeholder: "placeholder", name: "name", labelTemplate: "labelTemplate" }, usesInheritance: true, ngImport: i0, template: "<input\n #input\n [id]=\"name\"\n [name]=\"name\"\n [placeholder]=\"placeholder\"\n [type]=\"type\"\n [required]=\"required\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [value]=\"text\"\n (input)=\"text = input.value\"\n [class.large]=\"size === 'large'\"\n [attr.maxlength]=\"maxLength\"\n [attr.minlength]=\"minLength\"\n [class.warning]=\"state === 'warning'\"\n [class.error]=\"state === 'error'\"\n [riv-auto-focus]=\"autoFocus\"\n autocomplete=\"off\"\n autocorrect=\"off\"\n autocapitalize=\"off\"\n spellcheck=\"false\"\n (blur)=\"inputBlur()\"\n/>\n<div class=\"label\">\n <label [for]=\"name\" [class.close]=\"!!text\" (click)=\"text = ''\">\n <riv-icon\n *ngIf=\"!labelTemplate\"\n [class.clickable]=\"!!text\"\n [name]=\"!!text ? 'X' : 'Search'\"\n [size]=\"20\"\n ></riv-icon>\n <riv-icon\n *ngIf=\"labelTemplate && !!text\"\n class=\"clickable\"\n [name]=\"'X'\"\n [size]=\"20\"\n ></riv-icon>\n </label>\n <ng-container *ngIf=\"labelTemplate\" class=\"search-columns\"\n ><ng-template [ngTemplateOutlet]=\"labelTemplate\"></ng-template\n ></ng-container>\n</div>\n", styles: ["input{width:100%;border:var(--border-width) solid var(--border-light);border-radius:var(--border-radius-small);font:var(--input-medium);color:var(--type-light-high-contrast);padding:var(--size-small) var(--size-medium)}input::placeholder{color:var(--type-light-disabled)}input:disabled{color:var(--type-light-disabled);background-color:var(--surface-light-1)}input:read-only{background-color:var(--surface-light-1)}input:focus{outline:none;border:var(--border-width) solid var(--purp-60)}input.warning{border-color:var(--surface-dark-caution)}input.error{border-color:var(--surface-dark-danger)}input.small{font:var(--input-small);padding:var(--size-small) var(--size-medium)}input.large{font:var(--input-large);padding:var(--size-medium)}\n", ":host{position:relative}input{padding-right:calc(var(--size-xlarge) + var(--size-xsmall))}.label{position:absolute;top:0;right:0;bottom:0;color:var(--type-light-low-contrast);display:flex;align-items:center;justify-content:center;padding-right:var(--size-xsmall)}.label label{color:var(--type-light-low-contrast);display:flex;align-items:center;justify-content:center}label.close{color:var(--type-light-high-contrast)}.clickable:hover{background-color:var(--black-20);cursor:pointer;transition:background-color var(--short-transition)}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: AutoFocusDirective, selector: "[riv-auto-focus]", inputs: ["riv-auto-focus"] }, { kind: "component", type: IconComponent, selector: "riv-icon", inputs: ["name", "size", "customSize", "strokeWidth"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2323
2323
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SearchComponent, decorators: [{
|
|
2324
2324
|
type: Component,
|
|
2325
|
-
args: [{ selector: 'riv-search', changeDetection: ChangeDetectionStrategy.OnPush, template: "<input\n #input\n [id]=\"name\"\n [name]=\"name\"\n [placeholder]=\"placeholder\"\n [type]=\"type\"\n [required]=\"required\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [value]=\"text\"\n (input)=\"text = input.value\"\n [class.large]=\"size === 'large'\"\n [attr.maxlength]=\"maxLength\"\n [attr.minlength]=\"minLength\"\n [class.warning]=\"state === 'warning'\"\n [class.error]=\"state === 'error'\"\n [riv-auto-focus]=\"autoFocus\"\n autocomplete=\"off\"\n autocorrect=\"off\"\n autocapitalize=\"off\"\n spellcheck=\"false\"\n (blur)=\"inputBlur()\"\n/>\n<div class=\"label\">\n <label [for]=\"name\" [class.close]=\"!!text\" (click)=\"text = ''\">\n <riv-icon\n *ngIf=\"!labelTemplate\"\n [name]=\"!!text ? 'X' : 'Search'\"\n [size]=\"20\"\n ></riv-icon>\n <riv-icon\n *ngIf=\"labelTemplate && !!text\"\n [name]=\"'X'\"\n [size]=\"20\"\n ></riv-icon>\n </label>\n <ng-container *ngIf=\"labelTemplate\" class=\"search-columns\"\n ><ng-template [ngTemplateOutlet]=\"labelTemplate\"></ng-template\n ></ng-container>\n</div>\n", styles: ["input{width:100%;border:var(--border-width) solid var(--border-light);border-radius:var(--border-radius-small);font:var(--input-medium);color:var(--type-light-high-contrast);padding:var(--size-small) var(--size-medium)}input::placeholder{color:var(--type-light-disabled)}input:disabled{color:var(--type-light-disabled);background-color:var(--surface-light-1)}input:read-only{background-color:var(--surface-light-1)}input:focus{outline:none;border:var(--border-width) solid var(--purp-60)}input.warning{border-color:var(--surface-dark-caution)}input.error{border-color:var(--surface-dark-danger)}input.small{font:var(--input-small);padding:var(--size-small) var(--size-medium)}input.large{font:var(--input-large);padding:var(--size-medium)}\n", ":host{position:relative}input{padding-right:calc(var(--size-xlarge) + var(--size-xsmall))}.label{position:absolute;top:0;right:0;bottom:0;color:var(--type-light-low-contrast);display:flex;align-items:center;justify-content:center;padding-right:var(--size-xsmall)}.label label{color:var(--type-light-low-contrast);display:flex;align-items:center;justify-content:center}label.close{color:var(--type-light-high-contrast)}\n"] }]
|
|
2325
|
+
args: [{ selector: 'riv-search', changeDetection: ChangeDetectionStrategy.OnPush, template: "<input\n #input\n [id]=\"name\"\n [name]=\"name\"\n [placeholder]=\"placeholder\"\n [type]=\"type\"\n [required]=\"required\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [value]=\"text\"\n (input)=\"text = input.value\"\n [class.large]=\"size === 'large'\"\n [attr.maxlength]=\"maxLength\"\n [attr.minlength]=\"minLength\"\n [class.warning]=\"state === 'warning'\"\n [class.error]=\"state === 'error'\"\n [riv-auto-focus]=\"autoFocus\"\n autocomplete=\"off\"\n autocorrect=\"off\"\n autocapitalize=\"off\"\n spellcheck=\"false\"\n (blur)=\"inputBlur()\"\n/>\n<div class=\"label\">\n <label [for]=\"name\" [class.close]=\"!!text\" (click)=\"text = ''\">\n <riv-icon\n *ngIf=\"!labelTemplate\"\n [class.clickable]=\"!!text\"\n [name]=\"!!text ? 'X' : 'Search'\"\n [size]=\"20\"\n ></riv-icon>\n <riv-icon\n *ngIf=\"labelTemplate && !!text\"\n class=\"clickable\"\n [name]=\"'X'\"\n [size]=\"20\"\n ></riv-icon>\n </label>\n <ng-container *ngIf=\"labelTemplate\" class=\"search-columns\"\n ><ng-template [ngTemplateOutlet]=\"labelTemplate\"></ng-template\n ></ng-container>\n</div>\n", styles: ["input{width:100%;border:var(--border-width) solid var(--border-light);border-radius:var(--border-radius-small);font:var(--input-medium);color:var(--type-light-high-contrast);padding:var(--size-small) var(--size-medium)}input::placeholder{color:var(--type-light-disabled)}input:disabled{color:var(--type-light-disabled);background-color:var(--surface-light-1)}input:read-only{background-color:var(--surface-light-1)}input:focus{outline:none;border:var(--border-width) solid var(--purp-60)}input.warning{border-color:var(--surface-dark-caution)}input.error{border-color:var(--surface-dark-danger)}input.small{font:var(--input-small);padding:var(--size-small) var(--size-medium)}input.large{font:var(--input-large);padding:var(--size-medium)}\n", ":host{position:relative}input{padding-right:calc(var(--size-xlarge) + var(--size-xsmall))}.label{position:absolute;top:0;right:0;bottom:0;color:var(--type-light-low-contrast);display:flex;align-items:center;justify-content:center;padding-right:var(--size-xsmall)}.label label{color:var(--type-light-low-contrast);display:flex;align-items:center;justify-content:center}label.close{color:var(--type-light-high-contrast)}.clickable:hover{background-color:var(--black-20);cursor:pointer;transition:background-color var(--short-transition)}\n"] }]
|
|
2326
2326
|
}], propDecorators: { placeholder: [{
|
|
2327
2327
|
type: Input
|
|
2328
2328
|
}], name: [{
|
|
@@ -5828,10 +5828,10 @@ class TableSearchColumnsComponent {
|
|
|
5828
5828
|
}
|
|
5829
5829
|
}
|
|
5830
5830
|
TableSearchColumnsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: TableSearchColumnsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
5831
|
-
TableSearchColumnsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: TableSearchColumnsComponent, selector: "riv-table-search-columns", inputs: { manager: "manager", disabled: "disabled" }, ngImport: i0, template: "<ng-container *ngIf=\"columnList | async; let s\">\n <button #trigger class=\"trigger-button\" (click)=\"open.next(true)\">\n <riv-icon [name]=\"'MoreVertical'\" [size]=\"16\"></riv-icon>\n </button>\n <ng-container *ngIf=\"open | async\">\n <riv-callout\n *riv-overlay\n [anchor]=\"trigger\"\n [showCaret]=\"false\"\n [preferredPosition]=\"'bottom-left'\"\n [theme]=\"'light'\"\n (close)=\"open.next(false)\"\n >\n <div class=\"content-body\">\n <div class=\"header-container\">\n <riv-help\n [size]=\"12\"\n [help]=\"'Toggle which columns are included in table search results'\"\n ></riv-help\n ><span class=\"header-text\">Search in</span>\n </div>\n\n <ng-container\n [ngTemplateOutlet]=\"optionList\"\n [ngTemplateOutletContext]=\"{ columns: s.activeSearchColumns }\"\n ></ng-container>\n\n <div *ngIf=\"s.hiddenSearchColumns.length > 0\" class=\"column-header\">\n Hidden columns\n </div>\n\n <ng-container\n *ngIf=\"s.hiddenSearchColumns.length > 0\"\n [ngTemplateOutlet]=\"optionList\"\n [ngTemplateOutletContext]=\"{ columns: s.hiddenSearchColumns }\"\n ></ng-container>\n\n <ng-template #optionList let-columns=\"columns\">\n <ng-container *ngFor=\"let column of columns\">\n <ng-container\n [ngTemplateOutlet]=\"option\"\n [ngTemplateOutletContext]=\"{ node: column }\"\n ></ng-container>\n </ng-container>\n </ng-template>\n\n <ng-template #option let-node=\"node\">\n <div class=\"node-container\">\n <span class=\"node-text\">{{ node.title }}</span>\n <riv-switch-checkbox\n [size]=\"'small'\"\n [value]=\"node.searchEnabled\"\n [disabled]=\"s.searchEnabledCount === 1 && node.searchEnabled\"\n [rivTooltip]=\"\n s.searchEnabledCount === 1 && node.searchEnabled\n ? 'At least one search field is required'\n : undefined\n \"\n (valueChange)=\"updateColumns(node.id, $event)\"\n ></riv-switch-checkbox>\n </div>\n </ng-template>\n </div>\n </riv-callout>\n </ng-container>\n</ng-container>\n", styles: [".node-container{display:flex;justify-content:space-between;margin:var(--size-small) var(--size-medium)}.node-text{font:var(--input-medium)}.header-container{margin:calc(var(--base-grid-size) * .75) var(--size-medium);padding-bottom:var(--size-small)}.header-text{font:var(--input-medium);margin-left:var(--size-small)}.footer-container{display:flex;justify-content:end}.trigger-button{margin-top:var(--size-small);
|
|
5831
|
+
TableSearchColumnsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: TableSearchColumnsComponent, selector: "riv-table-search-columns", inputs: { manager: "manager", disabled: "disabled" }, ngImport: i0, template: "<ng-container *ngIf=\"columnList | async; let s\">\n <button #trigger class=\"trigger-button\" (click)=\"open.next(true)\">\n <riv-icon [name]=\"'MoreVertical'\" [size]=\"16\"></riv-icon>\n </button>\n <ng-container *ngIf=\"open | async\">\n <riv-callout\n *riv-overlay\n [anchor]=\"trigger\"\n [showCaret]=\"false\"\n [preferredPosition]=\"'bottom-left'\"\n [theme]=\"'light'\"\n (close)=\"open.next(false)\"\n >\n <div class=\"content-body\">\n <div class=\"header-container\">\n <riv-help\n [size]=\"12\"\n [help]=\"'Toggle which columns are included in table search results'\"\n ></riv-help\n ><span class=\"header-text\">Search in</span>\n </div>\n\n <ng-container\n [ngTemplateOutlet]=\"optionList\"\n [ngTemplateOutletContext]=\"{ columns: s.activeSearchColumns }\"\n ></ng-container>\n\n <div *ngIf=\"s.hiddenSearchColumns.length > 0\" class=\"column-header\">\n Hidden columns\n </div>\n\n <ng-container\n *ngIf=\"s.hiddenSearchColumns.length > 0\"\n [ngTemplateOutlet]=\"optionList\"\n [ngTemplateOutletContext]=\"{ columns: s.hiddenSearchColumns }\"\n ></ng-container>\n\n <ng-template #optionList let-columns=\"columns\">\n <ng-container *ngFor=\"let column of columns\">\n <ng-container\n [ngTemplateOutlet]=\"option\"\n [ngTemplateOutletContext]=\"{ node: column }\"\n ></ng-container>\n </ng-container>\n </ng-template>\n\n <ng-template #option let-node=\"node\">\n <div class=\"node-container\">\n <span class=\"node-text\">{{ node.title }}</span>\n <riv-switch-checkbox\n [size]=\"'small'\"\n [value]=\"node.searchEnabled\"\n [disabled]=\"s.searchEnabledCount === 1 && node.searchEnabled\"\n [rivTooltip]=\"\n s.searchEnabledCount === 1 && node.searchEnabled\n ? 'At least one search field is required'\n : undefined\n \"\n (valueChange)=\"updateColumns(node.id, $event)\"\n ></riv-switch-checkbox>\n </div>\n </ng-template>\n </div>\n </riv-callout>\n </ng-container>\n</ng-container>\n", styles: [".node-container{display:flex;justify-content:space-between;margin:var(--size-small) var(--size-medium)}.node-text{font:var(--input-medium)}.header-container{margin:calc(var(--base-grid-size) * .75) var(--size-medium);padding-bottom:var(--size-small)}.header-text{font:var(--input-medium);margin-left:var(--size-small)}.footer-container{display:flex;justify-content:end}.trigger-button{margin-top:var(--size-small);border-radius:var(--border-radius-small)}.trigger-button:hover{background-color:var(--black-20);cursor:pointer;transition:background-color var(--short-transition)}.column-header{margin:var(--size-small) var(--size-medium);font:var(--input-medium);color:var(--type-light-low-contrast)}.content-body{display:flex;max-height:50vh;overflow-y:auto;flex-direction:column;align-items:stretch;gap:var(--size-small);padding:var(--size-large);min-width:calc(var(--base-grid-size) * 75)}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: CalloutComponent, selector: "riv-callout", inputs: ["anchor", "isModal", "preferredPosition", "allowedPositions", "fallbackDirection", "showCaret", "theme"], outputs: ["close"] }, { kind: "component", type: HelpComponent, selector: "riv-help", inputs: ["help", "size"] }, { kind: "component", type: IconComponent, selector: "riv-icon", inputs: ["name", "size", "customSize", "strokeWidth"] }, { kind: "directive", type: OverlayDirective, selector: "[riv-overlay]" }, { kind: "component", type: SwitchCheckboxComponent, selector: "riv-switch-checkbox", inputs: ["size"] }, { kind: "directive", type: TooltipDirective, selector: "[rivTooltip]", inputs: ["rivTooltip", "rivTooltipTheme", "rivTooltipMaxWidth", "rivTooltipPreferredPosition", "rivTooltipCloseDelay"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
5832
5832
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: TableSearchColumnsComponent, decorators: [{
|
|
5833
5833
|
type: Component,
|
|
5834
|
-
args: [{ selector: 'riv-table-search-columns', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"columnList | async; let s\">\n <button #trigger class=\"trigger-button\" (click)=\"open.next(true)\">\n <riv-icon [name]=\"'MoreVertical'\" [size]=\"16\"></riv-icon>\n </button>\n <ng-container *ngIf=\"open | async\">\n <riv-callout\n *riv-overlay\n [anchor]=\"trigger\"\n [showCaret]=\"false\"\n [preferredPosition]=\"'bottom-left'\"\n [theme]=\"'light'\"\n (close)=\"open.next(false)\"\n >\n <div class=\"content-body\">\n <div class=\"header-container\">\n <riv-help\n [size]=\"12\"\n [help]=\"'Toggle which columns are included in table search results'\"\n ></riv-help\n ><span class=\"header-text\">Search in</span>\n </div>\n\n <ng-container\n [ngTemplateOutlet]=\"optionList\"\n [ngTemplateOutletContext]=\"{ columns: s.activeSearchColumns }\"\n ></ng-container>\n\n <div *ngIf=\"s.hiddenSearchColumns.length > 0\" class=\"column-header\">\n Hidden columns\n </div>\n\n <ng-container\n *ngIf=\"s.hiddenSearchColumns.length > 0\"\n [ngTemplateOutlet]=\"optionList\"\n [ngTemplateOutletContext]=\"{ columns: s.hiddenSearchColumns }\"\n ></ng-container>\n\n <ng-template #optionList let-columns=\"columns\">\n <ng-container *ngFor=\"let column of columns\">\n <ng-container\n [ngTemplateOutlet]=\"option\"\n [ngTemplateOutletContext]=\"{ node: column }\"\n ></ng-container>\n </ng-container>\n </ng-template>\n\n <ng-template #option let-node=\"node\">\n <div class=\"node-container\">\n <span class=\"node-text\">{{ node.title }}</span>\n <riv-switch-checkbox\n [size]=\"'small'\"\n [value]=\"node.searchEnabled\"\n [disabled]=\"s.searchEnabledCount === 1 && node.searchEnabled\"\n [rivTooltip]=\"\n s.searchEnabledCount === 1 && node.searchEnabled\n ? 'At least one search field is required'\n : undefined\n \"\n (valueChange)=\"updateColumns(node.id, $event)\"\n ></riv-switch-checkbox>\n </div>\n </ng-template>\n </div>\n </riv-callout>\n </ng-container>\n</ng-container>\n", styles: [".node-container{display:flex;justify-content:space-between;margin:var(--size-small) var(--size-medium)}.node-text{font:var(--input-medium)}.header-container{margin:calc(var(--base-grid-size) * .75) var(--size-medium);padding-bottom:var(--size-small)}.header-text{font:var(--input-medium);margin-left:var(--size-small)}.footer-container{display:flex;justify-content:end}.trigger-button{margin-top:var(--size-small);
|
|
5834
|
+
args: [{ selector: 'riv-table-search-columns', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"columnList | async; let s\">\n <button #trigger class=\"trigger-button\" (click)=\"open.next(true)\">\n <riv-icon [name]=\"'MoreVertical'\" [size]=\"16\"></riv-icon>\n </button>\n <ng-container *ngIf=\"open | async\">\n <riv-callout\n *riv-overlay\n [anchor]=\"trigger\"\n [showCaret]=\"false\"\n [preferredPosition]=\"'bottom-left'\"\n [theme]=\"'light'\"\n (close)=\"open.next(false)\"\n >\n <div class=\"content-body\">\n <div class=\"header-container\">\n <riv-help\n [size]=\"12\"\n [help]=\"'Toggle which columns are included in table search results'\"\n ></riv-help\n ><span class=\"header-text\">Search in</span>\n </div>\n\n <ng-container\n [ngTemplateOutlet]=\"optionList\"\n [ngTemplateOutletContext]=\"{ columns: s.activeSearchColumns }\"\n ></ng-container>\n\n <div *ngIf=\"s.hiddenSearchColumns.length > 0\" class=\"column-header\">\n Hidden columns\n </div>\n\n <ng-container\n *ngIf=\"s.hiddenSearchColumns.length > 0\"\n [ngTemplateOutlet]=\"optionList\"\n [ngTemplateOutletContext]=\"{ columns: s.hiddenSearchColumns }\"\n ></ng-container>\n\n <ng-template #optionList let-columns=\"columns\">\n <ng-container *ngFor=\"let column of columns\">\n <ng-container\n [ngTemplateOutlet]=\"option\"\n [ngTemplateOutletContext]=\"{ node: column }\"\n ></ng-container>\n </ng-container>\n </ng-template>\n\n <ng-template #option let-node=\"node\">\n <div class=\"node-container\">\n <span class=\"node-text\">{{ node.title }}</span>\n <riv-switch-checkbox\n [size]=\"'small'\"\n [value]=\"node.searchEnabled\"\n [disabled]=\"s.searchEnabledCount === 1 && node.searchEnabled\"\n [rivTooltip]=\"\n s.searchEnabledCount === 1 && node.searchEnabled\n ? 'At least one search field is required'\n : undefined\n \"\n (valueChange)=\"updateColumns(node.id, $event)\"\n ></riv-switch-checkbox>\n </div>\n </ng-template>\n </div>\n </riv-callout>\n </ng-container>\n</ng-container>\n", styles: [".node-container{display:flex;justify-content:space-between;margin:var(--size-small) var(--size-medium)}.node-text{font:var(--input-medium)}.header-container{margin:calc(var(--base-grid-size) * .75) var(--size-medium);padding-bottom:var(--size-small)}.header-text{font:var(--input-medium);margin-left:var(--size-small)}.footer-container{display:flex;justify-content:end}.trigger-button{margin-top:var(--size-small);border-radius:var(--border-radius-small)}.trigger-button:hover{background-color:var(--black-20);cursor:pointer;transition:background-color var(--short-transition)}.column-header{margin:var(--size-small) var(--size-medium);font:var(--input-medium);color:var(--type-light-low-contrast)}.content-body{display:flex;max-height:50vh;overflow-y:auto;flex-direction:column;align-items:stretch;gap:var(--size-small);padding:var(--size-large);min-width:calc(var(--base-grid-size) * 75)}\n"] }]
|
|
5835
5835
|
}], propDecorators: { manager: [{
|
|
5836
5836
|
type: Input
|
|
5837
5837
|
}], disabled: [{
|